。

src/views/GameView.vue

@@ -50,6 +50,9 @@
         <ElFormItem prop="charactors" label="初始角色">
             <div class="charactor-form" v-for="(item, i) in model.charactors" :key="i">
                 <ElForm :model="item" label-position="top" inline :rules="charactorRules" ref="charactorForms">
+                    <ElFormItem prop="avatar" label="头像">
+                        <SingleUpload v-model="item.avatar" />
+                    </ElFormItem>
                     <ElFormItem prop="name" label="角色名称">
                         <ElInput v-model="item.name" />
                     </ElFormItem>
@@ -175,6 +178,7 @@ function onAddCharactor() {
     model.value.charactors = (model.value.charactors || []).concat({})
 }
 const charactorRules = {
+    avatar: [{ required: true, message: '请上传头像', trigger: 'blur' }],
     name: [{ required: true, message: '请输入角色名称', trigger: 'blur' }],
     gender: [{ required: true, message: '请输入性别', trigger: 'blur' }],
     age: [{ required: true, message: '请输入年龄', trigger: 'blur' }],

src/views/PlayView.vue

@@ -93,6 +93,9 @@
     </ElDialog>
     <ElDialog title="加入角色" v-model="showAddCharactorDialog" width="500px">
         <ElForm :model="charactorModel" label-position="top" inline :rules="charactorRules" ref="charactorForm">
+            <ElFormItem prop="avatar" label="头像">
+                <SingleUpload v-model="charactorModel.avatar" />
+            </ElFormItem>
             <ElFormItem prop="name" label="角色名称">
                 <ElInput v-model="charactorModel.name" />
             </ElFormItem>
@@ -129,6 +132,7 @@ import { zhCN } from 'date-fns/locale'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { InfoCircle } from '@vicons/tabler'
 import { useTimeFormatter } from '@/utils/formatter'
+import SingleUpload from '@/components/SingleUpload.vue'
 const route = useRoute()
 const game = ref({})
 const history = ref([])
@@ -219,6 +223,7 @@ async function revert() {
 
 const showAddCharactorDialog = ref(false)
 const charactorRules = {
+    avatar: [{ required: true, message: '请上传头像', trigger: 'blur' }],
     name: [{ required: true, message: '请输入角色名称', trigger: 'blur' }],
     gender: [{ required: true, message: '请输入性别', trigger: 'blur' }],
     age: [{ required: true, message: '请输入年龄', trigger: 'blur' }],