update 编码表单优化

Web/src/pages/business/house/houseCode/form/index.vue

@@ -103,8 +103,8 @@ export default {
             this.$message.success('保存成功');
             this.$confirm({
               content: '已添加成功，是否继续添加？',
-              onOk() {
-                console.log('OK');
+              onOk: () => {
+                this.$refs.forms[0].onProjectChange();
               },
               onCancel: () => {
                 this.closeContentWindow();

Web/src/pages/business/house/houseCode/form/part.vue

@@ -35,8 +35,8 @@
         </a-radio-group>
       </a-form-model-item>
       <a-form-model-item class="ant-row-flex" label="房屋编码" prop="no">
-        <a-row align="top" type="flex">
-          <a-col flex="50px">
+        <a-row :gutter="8" align="top" type="flex">
+          <a-col>
             <span>宁波市 -</span>
           </a-col>
           <a-col flex="1">
@@ -52,7 +52,7 @@
               />
             </a-form-model-item>
           </a-col>
-          <a-col class="text-center" flex="20px">
+          <a-col>
             <span>-</span>
           </a-col>
           <a-col flex="1">
@@ -66,7 +66,7 @@
               </a-select>
             </a-form-model-item>
           </a-col>
-          <a-col class="text-center" flex="20px">
+          <a-col>
             <span>-</span>
           </a-col>
           <a-col flex="1">
@@ -83,8 +83,14 @@
               />
             </a-form-model-item>
           </a-col>
+          <a-col v-if="codeSuffix">
+            <span>- {{ codeSuffix }}</span>
+          </a-col>
         </a-row>
       </a-form-model-item>
+      <a-form-model-item :colon="false" :label="true" class="ant-row-flex" v-if="houseCode">
+        <a-tag :key="index" color="purple" v-for="(item, index) in houseCode">{{ item}}</a-tag>
+      </a-form-model-item>
       <a-form-model-item class="ant-row-flex" label="房屋地址" prop="address">
         <a-input placeholder="请输入房屋地址或在地图上选择地点" v-model="form.address" />
       </a-form-model-item>
@@ -161,7 +167,7 @@ export default {
         type: [{ required: true, message: '请选择房屋性质' }],
         industry: [{ validator: validatorIndustry }],
         areaCode: [{ required: true, message: '请选择房屋所在区域' }],
-        projectId: [{ required: true, message: '请选择项目', trigger: 'blur' }],
+        projectId: [{ required: true, message: '请选择项目' }],
         no: [{ required: true, message: '请输入房屋序号', trigger: 'blur' }],
         address: [{ required: true, message: '请输入房屋地址', trigger: 'blur' }],
         lng: [{ required: true, message: '请在地图中选择坐标' }],
@@ -185,6 +191,58 @@ export default {
     };
   },
 
+  computed: {
+    /**
+     * 房屋完整编号,仅展示
+     */
+    houseCode() {
+      const houseCode = [];
+      if (this.form.areaCode && this.form.areaCode.length === 4) {
+        let deep = this.$_.cloneDeep(this.options.areaTree);
+        this.form.areaCode.forEach((p, i) => {
+          const _deep = deep.find((m) => m.code === p);
+          if (i === 3) {
+            deep = _deep;
+          } else {
+            deep = _deep.children;
+          }
+        });
+        houseCode.push(...deep.adCode.split(''));
+      } else {
+        houseCode.push(...'XXXXXXXXXXXX'.split(''));
+      }
+
+      if (this.form.projectId) {
+        const project = this.options.projects.find((p) => p.id === this.form.projectId);
+        houseCode.push(...`000${project.sort}`.slice(-3).split(''));
+      } else {
+        houseCode.push(...'XXX'.split(''));
+      }
+
+      if (this.form.no) {
+        houseCode.push(...`000${this.form.no}`.slice(-3).split(''));
+      } else {
+        houseCode.push(...'XXX'.split(''));
+      }
+
+      if (this.codeSuffix) {
+        houseCode.push(this.codeSuffix);
+      }
+
+      return houseCode;
+    },
+    /**
+     * 非住宅编号后缀,仅展示
+     */
+    codeSuffix() {
+      if (this.form.industry) {
+        const houseIndustry = this.codes.houseIndustry.find((p) => p.code == this.form.industry);
+        return houseIndustry.extCode.tag;
+      }
+      return '';
+    },
+  },
+
   async created() {
     await this.onInit();
     this.onFillData();