From 55f6e4ca25eb246d6c49327e0b23b6839d187c19 Mon Sep 17 00:00:00 2001 From: YunaiV <zhijiantianya@gmail.com> Date: Fri, 10 Nov 2023 23:01:36 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B8=BB=E5=AD=90=E8=A1=A8=EF=BC=9A=E7=A1=AE?= =?UTF-8?q?=E8=AE=A4=E5=88=97=E8=A1=A8=E7=BC=96=E8=BE=91=E7=9A=84=E6=94=AF?= =?UTF-8?q?=E6=8C=81=E7=BB=84=E4=BB=B6=E6=83=85=E5=86=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/UploadFile/src/UploadFile.vue | 2 + .../infra/demo02/DemoStudentContactForm.vue | 68 +++++++++++++++++-- 2 files changed, 66 insertions(+), 4 deletions(-) diff --git a/src/components/UploadFile/src/UploadFile.vue b/src/components/UploadFile/src/UploadFile.vue index 6895440b..bba466a7 100644 --- a/src/components/UploadFile/src/UploadFile.vue +++ b/src/components/UploadFile/src/UploadFile.vue @@ -144,6 +144,8 @@ watch( } else if (isArray(props.modelValue)) { // 情况2:字符串 files.concat(props.modelValue) + } else if (props.modelValue === undefined) { + // 情况3:undefined 不处理 } else { throw new Error('不支持的 modelValue 类型') } diff --git a/src/views/infra/demo02/DemoStudentContactForm.vue b/src/views/infra/demo02/DemoStudentContactForm.vue index 50c44263..694aadac 100644 --- a/src/views/infra/demo02/DemoStudentContactForm.vue +++ b/src/views/infra/demo02/DemoStudentContactForm.vue @@ -9,20 +9,73 @@ > <el-table :data="formData" class="-mt-10px"> <el-table-column label="序号" type="index" width="100" /> - <el-table-column label="名字" prop="name" width="300"> + <el-table-column label="名字" prop="name" width="50"> <template #default="row"> <el-form-item class="mb-0px!"> <el-input v-model="row.name" placeholder="请输入名字" /> </el-form-item> </template> </el-table-column> - <el-table-column label="手机号码"> + <el-table-column label="手机号码" width="150"> <template #default="{ row, $index }"> <el-form-item :prop="`${$index}.mobile`" :rules="formRules.mobile" class="mb-0px!"> <el-input type="number" placeholder="输入手机号码" v-model="row.mobile" /> </el-form-item> </template> </el-table-column> + <el-table-column label="类型" width="150"> + <template #default="{ row, $index }"> + <el-form-item :prop="`${$index}.javaType`" :rules="formRules.javaType" class="mb-0px!"> + <el-select v-model="row.javaType"> + <el-option label="Long" value="Long" /> + <el-option label="String" value="String" /> + <el-option label="Integer" value="Integer" /> + <el-option label="Double" value="Double" /> + <el-option label="BigDecimal" value="BigDecimal" /> + <el-option label="LocalDateTime" value="LocalDateTime" /> + <el-option label="Boolean" value="Boolean" /> + </el-select> + </el-form-item> + </template> + </el-table-column> + <el-table-column label="多选" width="150"> + <template #default="{ row, $index }"> + <el-form-item :prop="`${$index}.sex`" :rules="formRules.sex" class="mb-0px!"> + <el-checkbox-group v-model="row.sex"> + <el-checkbox key="Long" label="Long">Long</el-checkbox> + <el-checkbox key="String" label="String">String</el-checkbox> + </el-checkbox-group> + </el-form-item> + </template> + </el-table-column> + <el-table-column label="图片上传" width="200"> + <template #default="{ row, $index }"> + <el-form-item :prop="`${$index}.pic`" :rules="formRules.pic" class="mb-0px!"> + <UploadImg v-model="row.pic" /> + </el-form-item> + </template> + </el-table-column> + <el-table-column label="文件上传" width="200"> + <template #default="{ row, $index }"> + <el-form-item :prop="`${$index}.file`" :rules="formRules.file" class="mb-0px!"> + <UploadFile v-model="row.file" /> + </el-form-item> + </template> + </el-table-column> + <el-table-column label="大输入框" width="200"> + <template #default="{ row, $index }"> + <el-form-item :prop="`${$index}.content`" :rules="formRules.content" class="mb-0px!"> + <el-input v-model="row.content" type="textarea" placeholder="请输入 content" /> + </el-form-item> + </template> + </el-table-column> + <el-table-column label="HTML" width="1024"> + <template #default="{ row, $index }"> + <el-form-item :prop="`${$index}.html`" :rules="formRules.html" class="mb-0px!"> + <Editor v-model="row.html" height="150px" /> + </el-form-item> + </template> + </el-table-column> <el-table-column align="center" fixed="right" label="操作" width="60"> <template #default="{ $index }"> <el-button @click="handleDelete($index)" link>—</el-button> @@ -41,7 +94,10 @@ const props = defineProps<{ const formLoading = ref(false) // 表单的加载中 const formData = ref([]) const formRules = reactive({ - mobile: [required] + mobile: [required], + javaType: [required], + sex: [required], + pic: [required] }) const formRef = ref() // 表单 Ref @@ -53,7 +109,11 @@ watch( formData.value = [ { name: '芋艿', - mobile: '15601691300' + mobile: '15601691300', + javaType: undefined, + sex: [], + pic: undefined, + file: undefined } ] } else {