diff --git a/Web/public/doc-code/seed/form-page/only-form/index.vue b/Web/public/doc-code/seed/form-page/only-form/index.vue
index 71cc94d..36c1566 100644
--- a/Web/public/doc-code/seed/form-page/only-form/index.vue
+++ b/Web/public/doc-code/seed/form-page/only-form/index.vue
@@ -14,7 +14,7 @@
           <br />
           <a-card class="yo-form-page--body">
             <template v-for="(part, index) in parts">
-              <section :id="`form-${index}`" :key="index">
+              <section :id="`form-${index}-${id}`" :key="index">
                 <h5 v-if="part.title">{{part.title}}</h5>
                 <component
                   :is="part.component"
@@ -36,7 +36,7 @@
             @click.prevent
           >
             <a-anchor-link
-              :href="`#form-${index}`"
+              :href="`#form-${index}-${id}`"
               :key="index"
               :title="part.title"
               v-for="(part, index) in parts"
@@ -65,7 +65,7 @@
 </template>
 <script>
 export default {
-  props: ['param'],
+  props: ['id', 'param'],
 
   data() {
     return {
diff --git a/Web/public/doc-code/seed/form-page/tab-form/tab.vue b/Web/public/doc-code/seed/form-page/tab-form/tab.vue
index bfa678b..36a80a2 100644
--- a/Web/public/doc-code/seed/form-page/tab-form/tab.vue
+++ b/Web/public/doc-code/seed/form-page/tab-form/tab.vue
@@ -43,6 +43,7 @@
           >
             <component
               :frame="self"
+              :id="id"
               :is="tab.component"
               :param="param"
               ref="forms"
@@ -56,7 +57,7 @@
 </template>
 <script>
 export default {
-  props: ['param'],
+  props: ['id', 'param'],
 
   data() {
     return {
diff --git a/Web/public/doc-code/seed/form-page/tab-form/tabPane.vue b/Web/public/doc-code/seed/form-page/tab-form/tabPane.vue
index 98deaf0..db7a336 100644
--- a/Web/public/doc-code/seed/form-page/tab-form/tabPane.vue
+++ b/Web/public/doc-code/seed/form-page/tab-form/tabPane.vue
@@ -12,7 +12,7 @@
         <br />
         <a-card class="yo-form-page--body">
           <template v-for="(part, index) in parts">
-            <section :id="`form-${index}`" :key="index">
+            <section :id="`form-${index}-${id}`" :key="index">
               <h5 v-if="part.title">{{part.title}}</h5>
               <component
                 :is="part.component"
@@ -35,7 +35,7 @@
           @click.prevent
         >
           <a-anchor-link
-            :href="`#form-${index}`"
+            :href="`#form-${index}-${id}`"
             :key="index"
             :title="part.title"
             v-for="(part, index) in parts"
@@ -47,7 +47,7 @@
 </template>
 <script>
 export default {
-  props: ['param'],
+  props: ['id', 'param'],
 
   data() {
     return {
diff --git a/Web/src/pages/business/house/houseCode/form/index.vue b/Web/src/pages/business/house/houseCode/form/index.vue
index d7f02f7..797531e 100644
--- a/Web/src/pages/business/house/houseCode/form/index.vue
+++ b/Web/src/pages/business/house/houseCode/form/index.vue
@@ -20,7 +20,7 @@
           </div>
           <a-card class="yo-form-page--body">
             <template v-for="(part, index) in parts">
-              <section :id="`form-${index}`" :key="index">
+              <section :id="`form-${index}-${id}`" :key="index">
                 <h5 v-if="part.title">{{part.title}}</h5>
                 <component
                   :is="part.component"
@@ -56,7 +56,7 @@
 </template>
 <script>
 export default {
-  props: ['param'],
+  props: ['id', 'param'],
 
   data() {
     return {
@@ -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();
diff --git a/Web/src/pages/business/house/houseCode/form/part.vue b/Web/src/pages/business/house/houseCode/form/part.vue
index d5749b7..e52d7e3 100644
--- a/Web/src/pages/business/house/houseCode/form/part.vue
+++ b/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();
diff --git a/Web/src/pages/business/house/houseInfo/form/base/index.vue b/Web/src/pages/business/house/houseInfo/form/base/index.vue
index 0a8a761..86db592 100644
--- a/Web/src/pages/business/house/houseInfo/form/base/index.vue
+++ b/Web/src/pages/business/house/houseInfo/form/base/index.vue
@@ -6,7 +6,7 @@
         <br />
         <a-card class="yo-form-page--body">
           <template v-for="(part, index) in parts">
-            <section :id="`form-${index}`" :key="index">
+            <section :id="`form-${index}-${id}`" :key="index">
               <h5 v-if="part.title">{{part.title}}</h5>
               <component
                 :frame="frame"
@@ -30,7 +30,7 @@
           @click.prevent
         >
           <a-anchor-link
-            :href="`#form-${index}`"
+            :href="`#form-${index}-${id}`"
             :key="index"
             :title="part.title"
             v-for="(part, index) in parts"
@@ -42,7 +42,7 @@
 </template>
 <script>
 export default {
-  props: ['param', 'frame'],
+  props: ['id', 'param', 'frame'],
 
   data() {
     return {
diff --git a/Web/src/pages/business/house/houseInfo/form/curtainWall/index.vue b/Web/src/pages/business/house/houseInfo/form/curtainWall/index.vue
index 912f78a..67d6a30 100644
--- a/Web/src/pages/business/house/houseInfo/form/curtainWall/index.vue
+++ b/Web/src/pages/business/house/houseInfo/form/curtainWall/index.vue
@@ -12,7 +12,7 @@
         <br />
         <a-card class="yo-form-page--body">
           <template v-for="(part, index) in parts">
-            <section :id="`form-curtainwall-${index}`" :key="index">
+            <section :id="`form-curtainwall-${index}-${id}`" :key="index">
               <h5 v-if="part.title">{{part.title}}</h5>
               <component
                 :is="part.component"
@@ -35,7 +35,7 @@
           @click.prevent
         >
           <a-anchor-link
-            :href="`#form-curtainwall-${index}`"
+            :href="`#form-curtainwall-${index}-${id}`"
             :key="index"
             :title="part.title"
             v-for="(part, index) in parts"
@@ -47,7 +47,7 @@
 </template>
 <script>
 export default {
-  props: ['param'],
+  props: ['id', 'param'],
 
   data() {
     return {
diff --git a/Web/src/pages/business/house/houseInfo/form/faceBrick/index.vue b/Web/src/pages/business/house/houseInfo/form/faceBrick/index.vue
index fe9d40d..936a08c 100644
--- a/Web/src/pages/business/house/houseInfo/form/faceBrick/index.vue
+++ b/Web/src/pages/business/house/houseInfo/form/faceBrick/index.vue
@@ -14,7 +14,7 @@
         <br />
         <a-card class="yo-form-page--body">
           <template v-for="(part, index) in parts">
-            <section :id="`form-facebrick-${index}`" :key="index">
+            <section :id="`form-facebrick-${index}-${id}`" :key="index">
               <h5 v-if="part.title">{{part.title}}</h5>
               <component
                 :is="part.component"
@@ -37,7 +37,7 @@
           @click.prevent
         >
           <a-anchor-link
-            :href="`#form-facebrick-${index}`"
+            :href="`#form-facebrick-${index}-${id}`"
             :key="index"
             :title="part.title"
             v-for="(part, index) in parts"
@@ -49,7 +49,7 @@
 </template>
 <script>
 export default {
-  props: ['param'],
+  props: ['id', 'param'],
 
   data() {
     return {
diff --git a/Web/src/pages/business/house/houseInfo/form/index.vue b/Web/src/pages/business/house/houseInfo/form/index.vue
index 932d7e1..e4acc4c 100644
--- a/Web/src/pages/business/house/houseInfo/form/index.vue
+++ b/Web/src/pages/business/house/houseInfo/form/index.vue
@@ -52,6 +52,7 @@
             >
               <component
                 :frame="self"
+                :id="id"
                 :is="tab.component"
                 :param="param"
                 ref="forms"
@@ -66,7 +67,7 @@
 </template>
 <script>
 export default {
-  props: ['param'],
+  props: ['id', 'param'],
 
   data() {
     return {
diff --git a/Web/src/pages/system/dict/_index.vue b/Web/src/pages/system/dict/_index.vue
deleted file mode 100644
index c044c35..0000000
--- a/Web/src/pages/system/dict/_index.vue
+++ /dev/null
@@ -1,232 +0,0 @@
-<template>
-  <container>
-    <br />
-    <a-card :bordered="false">
-      <yo-table
-        :columns="columns"
-        :load-data="loadData"
-        @query="onQuery"
-        @resetQuery="onResetQuery"
-        ref="table"
-      >
-        <Auth auth="sysDictType:page" slot="query">
-          <a-form-model-item label="类型名称">
-            <a-input placeholder="请输入类型名称" v-model="query.name" />
-          </a-form-model-item>
-          <a-form-model-item label="唯一编码">
-            <a-input placeholder="请输入唯一编码" v-model="query.code" />
-          </a-form-model-item>
-        </Auth>
-        <Auth auth="sysDictType:add" slot="operator">
-          <a-button @click="onOpen('add-form')" icon="plus">新增字典类型</a-button>
-        </Auth>
-        <!-- 格式化字段内容 -->
-        <span slot="status" slot-scope="text">{{ bindCodeValue(text, 'commonStatus') }}</span>
-        <!-- 添加操作控件 -->
-        <span slot="action" slot-scope="text, record">
-          <yo-table-actions>
-            <Auth auth="sysDictType:edit">
-              <a @click="onOpen('edit-form', record)">编辑</a>
-            </Auth>
-            <Auth auth="sysDictType:delete">
-              <a-popconfirm @confirm="onDelete(record)" placement="topRight" title="是否确认删除">
-                <a>删除</a>
-              </a-popconfirm>
-            </Auth>
-            <!-- 可在此处添加其他操作控件 -->
-          </yo-table-actions>
-        </span>
-        <div slot="expandedRowRender" slot-scope="record">
-          <dict-data :codes="codes" :type="record" />
-        </div>
-      </yo-table>
-    </a-card>
-    <br />
-
-    <yo-modal-form :action="$api.sysDictTypeAdd" @ok="onReloadData" ref="add-form" title="新增字典类型">
-      <form-body />
-    </yo-modal-form>
-
-    <yo-modal-form :action="$api.sysDictTypeEdit" @ok="onReloadData" ref="edit-form" title="编辑字典类型">
-      <form-body />
-    </yo-modal-form>
-  </container>
-</template>
-<script>
-import DictData from './dictdata';
-
-import FormBody from './form';
-
-export default {
-  components: {
-    DictData,
-    FormBody,
-  },
-  data() {
-    return {
-      query: {},
-      columns: [
-        {
-          title: '类型名称',
-          dataIndex: 'name',
-          sorter: true,
-        },
-        {
-          title: '唯一编码',
-          dataIndex: 'code',
-          sorter: true,
-        },
-        {
-          title: '排序',
-          dataIndex: 'sort',
-          sorter: true,
-        },
-        {
-          title: '备注',
-          dataIndex: 'remark',
-          width: 200,
-          sorter: true,
-        },
-        {
-          title: '状态',
-          dataIndex: 'status',
-          scopedSlots: { customRender: 'status' },
-          sorter: true,
-        },
-      ],
-      codes: {
-        commonStatus: [],
-      },
-    };
-  },
-  created() {
-    this.onLoadCodes();
-
-    /** 根据权限添加操作列 */
-    const flag = this.$auth({ sysDictType: [['edit'], ['delete']] });
-    if (flag) {
-      this.columns.push({
-        title: '操作',
-        width: '150px',
-        dataIndex: 'action',
-        scopedSlots: { customRender: 'action' },
-      });
-    }
-  },
-  methods: {
-    /**
-     * 必要的方法
-     * 传给yo-table以示意数据接口及其参数和返回的数据结构
-     */
-    loadData(params) {
-      return (
-        this.$api
-          /** !!此处必须修改调用的接口方法 */
-          .sysDictTypePage({
-            ...params,
-            ...this.query,
-          })
-          .then((res) => {
-            const data = res.data;
-            data.rows = data.rows.map(
-              (p) =>
-                (p = {
-                  ...p,
-                  data: [],
-                  query: {},
-                })
-            );
-            return data;
-          })
-      );
-    },
-
-    /**
-     * 有查询功能时的必要方法
-     * 加载数据时初始化分页信息
-     */
-    onQuery() {
-      this.$refs.table.onReloadData(true);
-    },
-
-    /**
-     * 有查询功能时的必要方法
-     * 重置查询条件
-     */
-    onResetQuery() {
-      /** 在这里重置查询条件时,可对特殊的字段做保留处理 */
-      this.query = {};
-      this.onQuery();
-    },
-
-    /**
-     * 必要方法
-     * 重新列表数据
-     */
-    onReloadData() {
-      this.$refs.table.onReloadData();
-    },
-
-    /**
-     * 必要方法
-     * 加载字典数据
-     * 如果不需要获取相应的字典数据,此方法内容可空
-     */
-    onLoadCodes() {
-      this.$api.$queue([this.$api.sysDictTypeDropDownAwait({ code: 'common_status' })]).then(([commonStatus]) => {
-        this.codes.commonStatus = commonStatus.data;
-      });
-    },
-
-    /**
-     * 必要方法
-     * 绑定数据字典值
-     */
-    bindCodeValue(code, name) {
-      const c = this.codes[name].find((p) => p.code == code);
-      if (c) {
-        return c.value;
-      }
-      return null;
-    },
-
-    /**
-     * 必要方法
-     * 从列表页调用窗口的打开方法
-     */
-    onOpen(formName, record) {
-      this.$refs[formName].onOpen({
-        record,
-      });
-    },
-
-    /**
-     * 必要方法
-     * 可以用做一系列操作的公共回调,此方法中会重新加载当前列表
-     */
-    onResult(success, successMessage) {
-      if (success) {
-        this.$message.success(successMessage);
-        this.onReloadData();
-      }
-    },
-
-    /**
-     * 必要方法
-     * 删除时调用
-     */
-    onDelete(record) {
-      this.$refs.table.onLoading();
-      this.$api
-        /** !!此处必须修改调用的接口方法 */
-        .sysDictTypeDelete(record)
-        .then(({ success }) => {
-          this.onResult(success, '删除成功');
-        })
-        .finally(() => {
-          this.$refs.table.onLoaded();
-        });
-    },
-  },
-};
-</script>
\ No newline at end of file
diff --git a/Web/src/pages/system/dict/dictdata/index.vue b/Web/src/pages/system/dict/dictdata/index.vue
index 481d636..35d10ad 100644
--- a/Web/src/pages/system/dict/dictdata/index.vue
+++ b/Web/src/pages/system/dict/dictdata/index.vue
@@ -40,7 +40,7 @@
         <a-input placeholder="请输入字典值" v-model="record.code" />
       </Auth>
       <Auth auth="sysDictData:edit" slot="extCode" slot-scope="text, record">
-        <a @click="onOpen('ext-code-form', record)">编辑</a>
+        <a @click="onOpen('ext-code-form', record)" class="json-editor">JSON</a>
       </Auth>
       <Auth auth="sysDictData:edit" slot="sort" slot-scope="text, record">
         <a-input-number
@@ -85,14 +85,28 @@
     </yo-modal-form>
   </a-card>
 </template>
-<style scoped>
-.ant-card>>>.ant-table-footer {
-  border-width: 1px 0 0 !important;
-  background-color: transparent;
-}
-.ant-card>>>.yo-table .ant-table-content .ant-table-body>table>.ant-table-thead>tr>th:last-child,
-.ant-card>>>.yo-table .ant-table-content .ant-table-body>table>.ant-table-tbody>tr>td:last-child {
-  border-right-width: 0 !important;
+<style lang="less" scoped>
+@import (reference) '~@/assets/style/app.less';
+.ant-card {
+  /deep/.ant-table-footer {
+    border-width: 1px 0 0 !important;
+    background-color: transparent;
+  }
+  /deep/.yo-table .ant-table-content .ant-table-body>table>.ant-table-thead>tr>th:last-child,
+  /deep/.yo-table .ant-table-content .ant-table-body>table>.ant-table-tbody>tr>td:last-child {
+    border-right-width: 0 !important;
+  }
+  .json-editor {
+    font-weight: bold;
+
+    display: inline-block;
+
+    transform: scaleY(.85);
+
+    color: transparent;
+    background-image: linear-gradient(135deg, @primary-color, @success-color);
+    -webkit-background-clip: text;
+  }
 }
 
 </style>