优化表单交互

src/views/sceneManagement/sceneList/modal/ItemModal.vue

@@ -11,10 +11,10 @@
     "
   >
     <el-form ref="form" :model="form" :rules="rules" label-width="160px">
-      <el-form-item label="幼儿园名称" prop="name"
-        ><el-input v-model="form.name" placeholder="请输入幼儿园名称" />
+      <el-form-item label="场景名称" prop="name"
+        ><el-input v-model="form.name" placeholder="请输入场景名称" />
       </el-form-item>
-      <el-form-item label="幼儿园类型" prop="type">
+      <el-form-item label="场景类型" prop="type">
         <el-radio-group v-model="form.type">
           <el-radio
             v-for="(item, index) in TypeOptions"
@@ -35,19 +35,19 @@
       <el-form-item label="办公电话" prop="phonenumber">
         <el-input v-model="form.phonenumber" placeholder="请输入办公电话" />
       </el-form-item>
-      <el-form-item label="幼儿园介绍" prop="brief">
+      <el-form-item label="场景介绍" prop="brief">
         <el-input
           v-model="form.brief"
           type="textarea"
           :rows="2"
-          placeholder="请输入幼儿园介绍"
+          placeholder="请输入场景介绍"
         />
       </el-form-item>
       <el-form-item label="封面图" prop="cover" required>
         <upload v-model="form.cover" :limit="9" params="prefix=/kindergarten-cover" />
         <el-row>建议尺寸：</el-row>
       </el-form-item>
-      <el-form-item label="幼儿园logo" prop="logo" required>
+      <el-form-item label="场景Logo" prop="logo" required>
         <upload v-model="form.logo" params="prefix=/kindergarten-logo"/>
         <el-row>建议尺寸：</el-row>
       </el-form-item>
@@ -143,59 +143,59 @@ export default {
       }
     };
     return {
-      title: '新增幼儿园信息',
+      title: '新增场景信息',
       modal: true,
 
       TypeOptions: SCENETYPE,
 
       form: {
         name: '',
-        address: '',
-        idCardNumber: '',
-        phonenumber: '',
-        brief: '',
-        realName: '',
-        personPhonenumber: '',
         type: '',
-
-        // TODO 未对接接口字段
         province: '',
         city: '',
         area: '',
+        address: '',
+        addressArr: [],
+        phonenumber: '',
+        brief: '',
+        cover: [],
         logo: [],
         previewLogo: [],
         hdLogo: [],
-        cover: [],
+        isShow: false,
+
         businessLicense: [],
+        realName: '',
+        personPhonenumber: '',
+        email: '',
+        idCardNumber: '',
         bodyPhoto: [],
         idCardFront: [],
-        idCardBack: [],
-        addressArr: [],
-        isShow: false
+        idCardBack: []
       },
       rules: {
-        name: [{ required: true, min: 4, max: 64, message: '请输入幼儿园名称（4 ～ 64个字符）', trigger: 'change' }],
+        name: [{ required: true, min: 4, max: 64, message: '请输入场景名称（4 ～ 64个字符）', trigger: 'change' }],
+        type: [{ required: true, message: '请选择场景类型', trigger: 'change' }],
         addressArr: [{ type: 'array', required: true, message: '请选择省市区', trigger: 'change'}],
         address: [{ required: true, min: 4, max: 255, message: '请输入详细地址（4 ～ 255个字符）', trigger: 'change' }],
         phonenumber: [{ required: true, min: 4, max: 64, message: '请输入办公电话（4 ～ 64个字符）', trigger: 'change' }],
-        brief: [{ required: true, min: 4, max: 255, message: '请输入幼儿园介绍（4 ～ 255个字符）', trigger: 'change' }],
+        brief: [{ required: true, min: 4, max: 255, message: '请输入场景介绍（4 ～ 255个字符）', trigger: 'change' }],
+        cover: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change' }],
+        logo: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change'}],
+        previewLogo: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change'}],
+        hdLogo: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change'}],
+
+        businessLicense: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change' }],
         realName: [{ required: true, min: 2, max: 64, message: '请输入申请人姓名（2 ～ 64个字符）', trigger: 'change' }],
         personPhonenumber: [{ required: true, min: 4, max: 64, message: '请输入手机号（4 ～ 64个字符）', trigger: 'change' }],
-        type: [{ required: true, message: '请选择幼儿园类型', trigger: 'change' }],
         email: [
           { required: true, min: 4, max: 64, message: '请输入邮箱（4 ～ 64个字符）', trigger: 'change' },
           { validator: checkEmail, trigger: 'blur' }
         ],
         idCardNumber: [{ required: true, min: 4, max: 64, message: '请输入证照号码（4 ～ 64个字符）', trigger: 'change' }],
-        logo: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change'}],
-        previewLogo: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change'}],
-        hdLogo: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change'}],
-        cover: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change' }],
-        businessLicense: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change' }],
         bodyPhoto: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change' }],
         idCardFront: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change' }],
-        idCardBack: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change' }],
-        addressArr: [{ type: 'array', required: true, message: '请选择地址', trigger: 'change' }]
+        idCardBack: [{ type: 'array', required: true, message: '请上传图片', trigger: 'change' }]
       }
     };
   },
@@ -205,7 +205,7 @@ export default {
       handler(id) {
         if (id) {
           this.loadData();
-          this.title = '编辑幼儿园信息';
+          this.title = '编辑场景信息';
         }
       },
       immediate: true

src/views/sceneManagement/sceneVerify/modal/ItemModal.vue

@@ -2,7 +2,7 @@
   <el-dialog
     :title="title"
     :visible.sync="modal"
-    width="80%"
+    width="70%"
     :close-on-click-modal="false"
     @close="
       res => {
@@ -10,14 +10,26 @@
       }
     "
   >
-    <el-form ref="form" :model="form" :rules="rules" label-width="140px">
-      <el-form-item label="幼儿园名称"> {{ form.name }} </el-form-item>
-      <el-form-item label="幼儿园类型"> {{ form.type }} </el-form-item>
-      <el-form-item label="所在地区">
-        {{ form.area ? form.province + '/' + form.city + '/' + form.area : '' }}
-      </el-form-item>
+    <el-form ref="form" :model="form" :rules="rules" label-width="160px">
+      <el-form-item label="场景名称"> {{ form.name }} </el-form-item>
+      <el-form-item label="场景类型"> {{ form.type }} </el-form-item>
+      <el-form-item label="所在地区"> {{ form.area ? form.province + '/' + form.city + '/' + form.area : '' }} </el-form-item>
       <el-form-item label="详细地址"> {{ form.address }} </el-form-item>
-      <el-form-item label="幼儿园logo">
+      <el-form-item label="办公电话"> {{ form.phonenumber }} </el-form-item>
+      <el-form-item label="场景介绍"> {{ form.brief }} </el-form-item>
+      <el-form-item label="封面图"
+      ><img
+        :src="form.cover"
+        class="pre-img"
+        @click="
+            () =>
+              this.$AdvanceViewImageModal({
+                items: [{ src: form.cover }]
+              })
+          "
+      />
+      </el-form-item>
+      <el-form-item label="场景Logo">
         <img
           :src="form.logo"
           class="pre-img"
@@ -29,7 +41,7 @@
           "
         />
       </el-form-item>
-      <el-form-item label="幼儿园预览logo">
+      <el-form-item label="裂变预览图Logo（照片右下角）">
         <img
           :src="form.previewLogo"
           class="pre-img"
@@ -41,7 +53,7 @@
           "
         />
       </el-form-item>
-      <el-form-item label="幼儿园高清图logo">
+      <el-form-item label="裂变高清图Logo（照片右下角）">
         <img
           :src="form.hdLogo"
           class="pre-img"
@@ -53,20 +65,9 @@
           "
         />
       </el-form-item>
-      <el-form-item label="封面图"
-        ><img
-          :src="form.cover"
-          class="pre-img"
-          @click="
-            () =>
-              this.$AdvanceViewImageModal({
-                items: [{ src: form.cover }]
-              })
-          "
-        />
-      </el-form-item>
-      <el-form-item label="办公电话"> {{ form.phonenumber }} </el-form-item>
-      <el-form-item label="幼儿园介绍"> {{ form.brief }} </el-form-item>
+
+      <el-divider content-position="left">以下为认证信息</el-divider>
+
       <el-form-item label="营业执照"
         ><img
           :src="form.businessLicense"
@@ -119,6 +120,9 @@
           "
         />
       </el-form-item>
+
+      <el-divider content-position="left">以下为审核信息</el-divider>
+
       <el-form-item label="审核状态" prop="auditStatus">
         <el-radio-group v-if="auditStatus !== 1" v-model="form.auditStatus">
           <el-radio :label="1">通过</el-radio>
@@ -179,7 +183,7 @@ export default {
 
   data() {
     return {
-      title: '幼儿园详情',
+      title: '场景详情',
       modal: true,
       form: {
         auditStatus: null,