From 459485c83b29141ec6863392a39ce342e8af3aa5 Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Tue, 19 Apr 2022 12:14:59 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B1=85=E6=B0=91=E6=A1=A3=E6=A1=88=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AppResident/components/AiEditCard.vue     |   33 +-
 packages/meta/AppResident/localResident.vue   | 1385 +++++++++--------
 2 files changed, 807 insertions(+), 611 deletions(-)

diff --git a/packages/meta/AppResident/components/AiEditCard.vue b/packages/meta/AppResident/components/AiEditCard.vue
index adff852e..5cfb670d 100644
--- a/packages/meta/AppResident/components/AiEditCard.vue
+++ b/packages/meta/AppResident/components/AiEditCard.vue
@@ -1,9 +1,18 @@
 <template>
   <section class="AiEditCard">
     <ai-card v-bind="{...$props,...$attrs}">
+      <template v-if="showBtn" #right>
+        <template v-if="edit">
+          <el-button type="text" @click="handleCancel">取消</el-button>
+          <el-button type="text" @click="handleSave">保存</el-button>
+        </template>
+        <template v-else>
+          <el-button type="text" icon="iconfont iconEdit" @click="edit=true">修改</el-button>
+        </template>
+      </template>
       <template #content>
-        <slot name="edit"/>
-        <slot/>
+        <slot v-if="edit" name="edit"/>
+        <slot v-else/>
       </template>
     </ai-card>
   </section>
@@ -13,15 +22,29 @@
 export default {
   name: "AiEditCard",
   props: {
-    editable:{default:false}
+    editable: Boolean,
+    showBtn: {default: true}
   },
   data() {
     return {
-      editable: false
+      edit: false
+    }
+  },
+  methods: {
+    handleSave() {
+      if (this.$listeners.save) {
+        this.$emit('save', () => this.edit = false)
+      } else this.edit = false
+    },
+    handleCancel() {
+      if (this.$listeners.cancel) {
+        this.$emit('cancel')
+        this.edit = false
+      } else this.edit = false
     }
   },
-  methods: {},
   created() {
+    this.edit = this.editable
   }
 }
 </script>
diff --git a/packages/meta/AppResident/localResident.vue b/packages/meta/AppResident/localResident.vue
index 90ff7c96..c7e0bdf2 100644
--- a/packages/meta/AppResident/localResident.vue
+++ b/packages/meta/AppResident/localResident.vue
@@ -1,8 +1,7 @@
 <template>
-  <section class="addAborigines">
+  <section class="localResident">
     <ai-detail>
-      <ai-title slot="title" :title="showDetail?'本地居民信息':'添加本地居民'" isShowBack @onBackClick="$router.push({query:{}})"
-                isShowBottomBorder>
+      <ai-title slot="title" :title="pageTitle" isShowBack @onBackClick="back" isShowBottomBorder>
         <template v-if="showDetail" #rightBtn>
           <el-button @click="beforeWriteOff()" icon="el-icon-switch-button" v-if="baseInfo.fileStatus==0">注销档案
           </el-button>
@@ -14,532 +13,767 @@
       <template #content>
         <el-form class="content-right" :model="baseInfo" ref="ruleForm" :rules="rules" label-width="130px"
                  label-position="right" size="small">
-
-          <ai-card title="基本信息">
-            <template v-if="showDetail" #right>
-              <template v-if="$permissions('app_appresident_edit')">
-                <el-button
-                    type="text"
-                    class="iconfont iconEdit"
-                    @click="editInit(),showEdit1=true;"
-                    v-if="!showEdit1"
-                >&nbsp;修改
-                </el-button>
-              </template>
-              <el-button
-                  type="text"
-                  @click="showEdit1=false,searchDetail(baseInfo.id)"
-                  v-if="showEdit1"
-              >取消
-              </el-button>
-              <el-button type="text" v-if="showEdit1" @click="saveFrom('ruleForm')">保存</el-button>
-            </template>
-            <div slot="content" v-if="showEdit1">
-              <div class="above">
-                <div class="left">
-                  <el-form-item label="姓名：" prop="name">
-                    <el-input
-                        v-model="baseInfo.name"
-                        autocomplete="off"
-                        size="small"
-                        placeholder="请输入姓名"
-                        v-if="showEdit1"
-                        maxlength="20"
-                        show-word-limit
-                        :disabled="!!showDetail"
-                    ></el-input>
-                    <!-- <p v-else>{{baseInfo.name||'-'}}</p> -->
-                  </el-form-item>
-                  <el-form-item label="身份证号：" prop="idNumber">
-                    <el-input
-                        v-model="baseInfo.idNumber"
-                        autocomplete="off"
-                        size="small"
-                        placeholder="请输入身份证号"
-                        v-if="showEdit1"
-                        :maxlength="18"
-                        @input="idChange"
-                        :disabled="!!showDetail"
-                    />
-                    <!-- <p v-else>
-                        <ai-id mode="show" v-model="baseInfo.idNumber" right-btn></ai-id>
-                    </p>-->
-                  </el-form-item>
-                  <el-form-item label="性别：" prop="sex">
-                    <el-select v-model="baseInfo.sex"
-                               placeholder="请选择"
-                               disabled
-                               clearable>
-                      <el-option
-                          v-for="(item,i) in dict.getDict('sex')"
-                          :label="item.dictName"
-                          :key="i"
-                          :value="item.dictValue"
-                      ></el-option>
-                    </el-select>
-                    <!-- <p v-else>
-                        {{dict.getLabel('sex',baseInfo.sex)||'-'}}
-                    </p>-->
-                  </el-form-item>
-                </div>
-                <div class="right">
-                  <el-form-item label="个人照片：" prop="photo">
-                    <!-- <div class="pictrue">
-                        <img :src="imgUrl" alt="" title=""></img>
-                        <el-upload
-                            v-if="showEdit1"
-                            class="upload-demo"
-                            action
-                            multiple
-                            accept=".png,.jpg"
-                            :http-request="uploadFile"
-                            :show-file-list="false"
-                            :on-change="handleChange"
-                            :file-list="fileList"
-                            >
-                            <el-button >上传照片</el-button>
-                            <div slot="tip" class="el-upload__tip">
-                                    图片大小不能超过2M
+          <el-tabs tab-position="left" v-if="showDetail">
+            <el-tab-pane label="基本信息">
+              <ai-edit-card title="基本信息" :show-btn="permissions('app_appresident_edit')"
+                            @save="saveFrom" @cancel="getDetail(baseInfo.id)">
+                <template #edit>
+                  <div class="above">
+                    <div class="left">
+                      <el-form-item label="姓名：" prop="name">
+                        <el-input
+                            v-model="baseInfo.name"
+                            autocomplete="off"
+                            size="small"
+                            placeholder="请输入姓名"
+                            maxlength="20"
+                            show-word-limit
+                            :disabled="!!showDetail"
+                        />
+                        <!-- <p v-else>{{baseInfo.name||'-'}}</p> -->
+                      </el-form-item>
+                      <el-form-item label="身份证号：" prop="idNumber">
+                        <el-input
+                            v-model="baseInfo.idNumber"
+                            autocomplete="off"
+                            size="small"
+                            placeholder="请输入身份证号"
+                            :maxlength="18"
+                            @input="idChange"
+                            :disabled="!!showDetail"
+                        />
+                        <!-- <p v-else>
+                            <ai-id mode="show" v-model="baseInfo.idNumber" right-btn></ai-id>
+                        </p>-->
+                      </el-form-item>
+                      <el-form-item label="性别：" prop="sex">
+                        <el-select v-model="baseInfo.sex"
+                                   placeholder="请选择"
+                                   disabled
+                                   clearable>
+                          <el-option
+                              v-for="(item,i) in dict.getDict('sex')"
+                              :label="item.dictName"
+                              :key="i"
+                              :value="item.dictValue"
+                          ></el-option>
+                        </el-select>
+                        <!-- <p v-else>
+                            {{dict.getLabel('sex',baseInfo.sex)||'-'}}
+                        </p>-->
+                      </el-form-item>
                     </div>
-                        </el-upload>
-                    </div>-->
-                    <ai-avatar :instance="instance" v-if="showEdit1" v-model="baseInfo.photo"/>
-                    <ai-avatar v-model="baseInfo.photo" v-else :editable="false"/>
-                    <!--<ai-avatar :instance="instance" v-model="baseInfo.photo"/>-->
-                  </el-form-item>
-                </div>
-              </div>
-              <div class="above">
-                <div class="left">
-                  <el-form-item label="出生日期：" prop="birthday">
-                    <el-date-picker
-                        v-if="showEdit1"
-                        disabled
-                        :editable="false"
-                        value-format="yyyy-MM-dd HH:mm:ss"
-                        format="yyyy-MM-dd"
-                        v-model="birthday"
-                        type="date"
-
-                        placeholder="选择日期"
-                    ></el-date-picker>
-                    <!-- <p v-else>{{birthday?birthday.substring(0, 10):"-"}}</p> -->
-                  </el-form-item>
-                  <el-form-item label="文化程度：" prop="education">
-                    <el-select
-                        v-model="baseInfo.education"
-                        placeholder="请选择"
-
-                        v-if="showEdit1"
-                        clearable
-                    >
-                      <el-option
-                          v-for="(item,i) in dict.getDict('education')"
-                          :label="item.dictName"
-                          :key="i"
-                          :value="item.dictValue"
-                      ></el-option>
-                    </el-select>
-                    <!-- <p v-else>{{dict.getLabel('education',baseInfo.education)||'-'}}</p> -->
-                  </el-form-item>
-                  <el-form-item label="政治面貌：" prop="politicsStatus">
-                    <el-select
-                        v-model="baseInfo.politicsStatus"
-                        placeholder="请选择"
-
-                        v-if="showEdit1"
-                        clearable
-                    >
-                      <el-option
-                          v-for="(item,i) in dict.getDict('politicsStatus')"
-                          :label="item.dictName"
-                          :key="i"
-                          :value="item.dictValue"
-                      ></el-option>
-                    </el-select>
-                    <!-- <p v-else>{{dict.getLabel('politicsStatus',baseInfo.politicsStatus)||'-'}}</p> -->
-                  </el-form-item>
-                  <el-form-item label="职业：" prop="job">
-                    <el-select
-                        v-model="baseInfo.job"
-                        placeholder="请选择"
-
-                        v-if="showEdit1"
-                        clearable
-                    >
-                      <el-option
-                          v-for="(item,i) in dict.getDict('job')"
-                          :label="item.dictName"
-                          :key="i"
-                          :value="item.dictValue"
-                      ></el-option>
-                    </el-select>
-                    <!-- <p v-else>{{dict.getLabel('job',baseInfo.job)||'-'}}</p> -->
-                  </el-form-item>
-                  <el-form-item label="宗教信仰：" prop="faithType">
-                    <el-select
-                        v-model="baseInfo.faithType"
-                        placeholder="请选择"
-
-                        v-if="showEdit1"
-                        clearable
-                    >
-                      <el-option
-                          v-for="(item,i) in dict.getDict('faithType')"
-                          :label="item.dictName"
-                          :key="i"
-                          :value="item.dictValue"
-                      ></el-option>
-                    </el-select>
-                    <!-- <p v-else>{{dict.getLabel('faithType',baseInfo.faithType)||'-'}}</p> -->
-                  </el-form-item>
-                </div>
-                <div class="right">
-                  <el-form-item label="年龄：" prop="age">
-                    <el-input
-                        disabled
-                        v-model="baseInfo.age"
-                        autocomplete="off"
-                        size="small"
-                        placeholder="请输入年龄"
-                        v-if="showEdit1"
-                        type="number"
-                        @mousewheel.native.prevent
-                    ></el-input>
-                    <!-- <p v-else>{{baseInfo.age}}</p> -->
-                  </el-form-item>
-                  <el-form-item label="民族：" prop="nation">
-                    <el-select
-                        v-model="baseInfo.nation"
-                        placeholder="请选择"
-
-                        v-if="showEdit1"
-                        clearable
-                    >
-                      <el-option
-                          v-for="(item,i) in dict.getDict('nation')"
-                          :label="item.dictName"
-                          :key="i"
-                          :value="item.dictValue"
-                      ></el-option>
-                    </el-select>
-                    <!-- <p v-else>{{dict.getLabel('nation',baseInfo.nation)||'-'}}</p> -->
-                  </el-form-item>
-                  <el-form-item label="婚姻状况：" prop="maritalStatus">
-                    <el-select
-                        v-model="baseInfo.maritalStatus"
-                        placeholder="请选择"
-
-                        v-if="showEdit1"
-                        clearable
-                    >
-                      <el-option
-                          v-for="(item,i) in dict.getDict('maritalStatus')"
-                          :label="item.dictName"
-                          :key="i"
-                          :value="item.dictValue"
-                      ></el-option>
-                    </el-select>
-                    <!-- <p v-else>{{dict.getLabel('maritalStatus',baseInfo.maritalStatus)||'-'}}</p> -->
-                  </el-form-item>
-                  <el-form-item label="兵役状况：" prop="militaryStatus">
-                    <el-select
-                        v-model="baseInfo.militaryStatus"
-                        placeholder="请选择"
-
-                        v-if="showEdit1"
-                        clearable
-                    >
-                      <el-option
-                          v-for="(item,i) in dict.getDict('militaryStatus')"
-                          :label="item.dictName"
-                          :key="i"
-                          :value="item.dictValue"
-                      ></el-option>
-                    </el-select>
-                    <!-- <p v-else>{{dict.getLabel('militaryStatus',baseInfo.militaryStatus)||'-'}}</p> -->
-                  </el-form-item>
-                </div>
-              </div>
-              <div class="areaList">
-                <el-form-item label="籍贯：" prop=" birthplaceAreaId">
-                  <ai-area-select
-                      clearable
-                      always-show
-                      :instance="instance"
-                      v-if="showEdit1"
-                      v-model="baseInfo.birthplaceAreaId"
-                      :areaLevel="3"
-                  ></ai-area-select>
-                  <!-- <p v-if="!showEdit1">{{baseInfo.birthplaceAreaName||'-'}}</p> -->
-                </el-form-item>
-              </div>
-            </div>
-            <div slot="content" v-else>
-              <el-row type="flex">
-                <div class="detail-info fill">
-                  <h3 class="name">{{ baseInfo.name || '-' }}</h3>
-                  <div class="detail-left fill">
-                    <div class="info">
-                      <span class="label">性别：</span>
-                      <span class="value">{{ dict.getLabel('sex', baseInfo.sex) || '-' }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">出生日期：</span>
-                      <span class="value">{{ birthday ? birthday.substring(0, 10) : '-' }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">籍贯：</span>
-                      <span class="value">{{ baseInfo.birthplaceAreaName || '-' }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">文化程度：</span>
-                      <span class="value">{{ dict.getLabel('education', baseInfo.education) || '-' }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">政治面貌：</span>
-                      <span
-                          class="value"
-                      >{{ dict.getLabel('politicsStatus', baseInfo.politicsStatus) || '-' }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">宗教信仰：</span>
-                      <span class="value">{{ dict.getLabel('faithType', baseInfo.faithType) || '-' }}</span>
+                    <div class="right">
+                      <el-form-item label="个人照片：" prop="photo">
+                        <ai-avatar :instance="instance" v-model="baseInfo.photo"/>
+                      </el-form-item>
                     </div>
                   </div>
-                  <div class="detail-right fill">
-                    <div class="info">
-                      <span class="label">身份证号：</span>
-                      <span class="value">
+                  <div class="above">
+                    <div class="left">
+                      <el-form-item label="出生日期：">
+                        <el-date-picker
+                            disabled
+                            :editable="false"
+                            value-format="yyyy-MM-dd HH:mm:ss"
+                            format="yyyy-MM-dd"
+                            v-model="baseInfo.birthday"
+                            type="date"
+
+                            placeholder="选择日期"
+                        ></el-date-picker>
+                      </el-form-item>
+                      <el-form-item label="文化程度：" prop="education">
+                        <el-select
+                            v-model="baseInfo.education"
+                            placeholder="请选择"
+
+                            clearable
+                        >
+                          <el-option
+                              v-for="(item,i) in dict.getDict('education')"
+                              :label="item.dictName"
+                              :key="i"
+                              :value="item.dictValue"
+                          ></el-option>
+                        </el-select>
+                        <!-- <p v-else>{{dict.getLabel('education',baseInfo.education)||'-'}}</p> -->
+                      </el-form-item>
+                      <el-form-item label="政治面貌：" prop="politicsStatus">
+                        <el-select
+                            v-model="baseInfo.politicsStatus"
+                            placeholder="请选择"
+
+                            clearable
+                        >
+                          <el-option
+                              v-for="(item,i) in dict.getDict('politicsStatus')"
+                              :label="item.dictName"
+                              :key="i"
+                              :value="item.dictValue"
+                          ></el-option>
+                        </el-select>
+                        <!-- <p v-else>{{dict.getLabel('politicsStatus',baseInfo.politicsStatus)||'-'}}</p> -->
+                      </el-form-item>
+                      <el-form-item label="职业：" prop="job">
+                        <el-select
+                            v-model="baseInfo.job"
+                            placeholder="请选择"
+
+                            clearable
+                        >
+                          <el-option
+                              v-for="(item,i) in dict.getDict('job')"
+                              :label="item.dictName"
+                              :key="i"
+                              :value="item.dictValue"
+                          ></el-option>
+                        </el-select>
+                        <!-- <p v-else>{{dict.getLabel('job',baseInfo.job)||'-'}}</p> -->
+                      </el-form-item>
+                      <el-form-item label="宗教信仰：" prop="faithType">
+                        <el-select
+                            v-model="baseInfo.faithType"
+                            placeholder="请选择"
+
+                            clearable
+                        >
+                          <el-option
+                              v-for="(item,i) in dict.getDict('faithType')"
+                              :label="item.dictName"
+                              :key="i"
+                              :value="item.dictValue"
+                          ></el-option>
+                        </el-select>
+                        <!-- <p v-else>{{dict.getLabel('faithType',baseInfo.faithType)||'-'}}</p> -->
+                      </el-form-item>
+                    </div>
+                    <div class="right">
+                      <el-form-item label="年龄：" prop="age">
+                        <el-input
+                            disabled
+                            v-model="baseInfo.age"
+                            autocomplete="off"
+                            size="small"
+                            placeholder="请输入年龄"
+                            type="number"
+                            @mousewheel.native.prevent
+                        ></el-input>
+                        <!-- <p v-else>{{baseInfo.age}}</p> -->
+                      </el-form-item>
+                      <el-form-item label="民族：" prop="nation">
+                        <el-select
+                            v-model="baseInfo.nation"
+                            placeholder="请选择"
+
+                            clearable
+                        >
+                          <el-option
+                              v-for="(item,i) in dict.getDict('nation')"
+                              :label="item.dictName"
+                              :key="i"
+                              :value="item.dictValue"
+                          ></el-option>
+                        </el-select>
+                        <!-- <p v-else>{{dict.getLabel('nation',baseInfo.nation)||'-'}}</p> -->
+                      </el-form-item>
+                      <el-form-item label="婚姻状况：" prop="maritalStatus">
+                        <el-select
+                            v-model="baseInfo.maritalStatus"
+                            placeholder="请选择"
+
+                            clearable
+                        >
+                          <el-option
+                              v-for="(item,i) in dict.getDict('maritalStatus')"
+                              :label="item.dictName"
+                              :key="i"
+                              :value="item.dictValue"
+                          ></el-option>
+                        </el-select>
+                        <!-- <p v-else>{{dict.getLabel('maritalStatus',baseInfo.maritalStatus)||'-'}}</p> -->
+                      </el-form-item>
+                      <el-form-item label="兵役状况：" prop="militaryStatus">
+                        <el-select
+                            v-model="baseInfo.militaryStatus"
+                            placeholder="请选择"
+
+                            clearable
+                        >
+                          <el-option
+                              v-for="(item,i) in dict.getDict('militaryStatus')"
+                              :label="item.dictName"
+                              :key="i"
+                              :value="item.dictValue"
+                          ></el-option>
+                        </el-select>
+                        <!-- <p v-else>{{dict.getLabel('militaryStatus',baseInfo.militaryStatus)||'-'}}</p> -->
+                      </el-form-item>
+                    </div>
+                  </div>
+                  <div class="areaList">
+                    <el-form-item label="籍贯：" prop=" birthplaceAreaId">
+                      <ai-area-select
+                          clearable
+                          always-show
+                          :instance="instance"
+                          v-model="baseInfo.birthplaceAreaId"
+                          :areaLevel="3"
+                      />
+                    </el-form-item>
+                  </div>
+                </template>
+                <template>
+                  <el-row type="flex">
+                    <div class="detail-info fill">
+                      <h3 class="name">{{ baseInfo.name || '-' }}</h3>
+                      <div class="detail-left fill">
+                        <div class="info">
+                          <span class="label">性别：</span>
+                          <span class="value">{{ dict.getLabel('sex', baseInfo.sex) || '-' }}</span>
+                        </div>
+                        <div class="info">
+                          <span class="label">出生日期：</span>
+                          <span class="value" v-text="baseInfo.birthday||'-'"/>
+                        </div>
+                        <div class="info">
+                          <span class="label">籍贯：</span>
+                          <span class="value">{{ baseInfo.birthplaceAreaName || '-' }}</span>
+                        </div>
+                        <div class="info">
+                          <span class="label">文化程度：</span>
+                          <span class="value">{{ dict.getLabel('education', baseInfo.education) || '-' }}</span>
+                        </div>
+                        <div class="info">
+                          <span class="label">政治面貌：</span>
+                          <span
+                              class="value"
+                          >{{ dict.getLabel('politicsStatus', baseInfo.politicsStatus) || '-' }}</span>
+                        </div>
+                        <div class="info">
+                          <span class="label">宗教信仰：</span>
+                          <span class="value">{{ dict.getLabel('faithType', baseInfo.faithType) || '-' }}</span>
+                        </div>
+                      </div>
+                      <div class="detail-right fill">
+                        <div class="info">
+                          <span class="label">身份证号：</span>
+                          <span class="value">
                         <ai-id mode="show" v-model="baseInfo.idNumber" right-btn class="line-center"></ai-id>
                       </span>
+                        </div>
+                        <div class="info">
+                          <span class="label">年龄：</span>
+                          <span class="value">{{ baseInfo.age }}</span>
+                        </div>
+                        <div class="info">
+                          <span class="label">民族：</span>
+                          <span class="value">{{ dict.getLabel('nation', baseInfo.nation) || '-' }}</span>
+                        </div>
+                        <div class="info">
+                          <span class="label">婚姻状况：</span>
+                          <span
+                              class="value"
+                          >{{ dict.getLabel('maritalStatus', baseInfo.maritalStatus) || '-' }}</span>
+                        </div>
+                        <div class="info">
+                          <span class="label">兵役状况：</span>
+                          <span
+                              class="value"
+                          >{{ dict.getLabel('militaryStatus', baseInfo.militaryStatus) || '-' }}</span>
+                        </div>
+                        <div class="info">
+                          <span class="label">职业：</span>
+                          <span class="value">{{ dict.getLabel('job', baseInfo.job) || '-' }}</span>
+                        </div>
+                      </div>
                     </div>
-                    <div class="info">
-                      <span class="label">年龄：</span>
-                      <span class="value">{{ baseInfo.age }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">民族：</span>
-                      <span class="value">{{ dict.getLabel('nation', baseInfo.nation) || '-' }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">婚姻状况：</span>
-                      <span
-                          class="value"
-                      >{{ dict.getLabel('maritalStatus', baseInfo.maritalStatus) || '-' }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">兵役状况：</span>
-                      <span
-                          class="value"
-                      >{{ dict.getLabel('militaryStatus', baseInfo.militaryStatus) || '-' }}</span>
-                    </div>
-                    <div class="info">
-                      <span class="label">职业：</span>
-                      <span class="value">{{ dict.getLabel('job', baseInfo.job) || '-' }}</span>
+                    <ai-avatar v-model="baseInfo.photo" :editable="false"/>
+                  </el-row>
+                </template>
+              </ai-edit-card>
+              <ai-edit-card title="联络信息" :show-btn="permissions('app_appresident_edit')"
+                            @save="saveFrom" @cancel="getDetail(baseInfo.id)">
+                <template #edit>
+                  <div class="above">
+                    <div class="left">
+                      <el-form-item label="联系方式：" prop="phone">
+                        <el-input v-model="baseInfo.phone" size="small" placeholder="请输入联系方式" :maxlength="11"
+                                  show-word-limit/>
+                      </el-form-item>
                     </div>
                   </div>
-                </div>
-                <ai-avatar v-model="baseInfo.photo" :editable="false"/>
-              </el-row>
-            </div>
-          </ai-card>
-
-          <ai-card title="联络信息">
-            <template v-if="showDetail" #right>
-              <template v-if="$permissions('app_appresident_edit')">
-                <el-button
-                    type="text"
-                    class="iconfont iconEdit"
-                    @click="editInit(),showEdit2=true;"
-                    v-if="!showEdit2">
-                  修改
-                </el-button>
-              </template>
-              <el-button
-                  type="text"
-                  @click="showEdit2=false,searchDetail(baseInfo.id)"
-                  v-if="showEdit2">
-                取消
-              </el-button>
-              <el-button type="text" v-if="showEdit2" @click="saveFrom('ruleForm')">保存</el-button>
-            </template>
-            <div slot="content" v-if="showEdit2">
-              <div class="above">
-                <div class="left">
-                  <el-form-item label="联系方式：" prop="phone">
-                    <el-input v-model="baseInfo.phone" size="small" placeholder="请输入联系方式" v-if="showEdit2"
-                              :maxlength="11"/>
+                  <el-form-item label="现住址：" prop="currentAreaId">
+                    <ai-area-select clearable always-show :instance="instance" :disabled-level="disabledLevel"
+                                    v-model="baseInfo.currentAreaId"
+                                    :valueLevel="4"/>
+                    <el-form-item>
+                      <el-input v-model="baseInfo.currentAddress" placeholder="详细地址" maxlength="30" show-word-limit
+                                clearable/>
+                    </el-form-item>
                   </el-form-item>
-                </div>
-              </div>
-              <el-form-item label="现住址：" prop="currentAreaId">
-                <ai-area-select clearable always-show :instance="instance" :disabled-level="disabledLevel" v-model="baseInfo.currentAreaId"
-                                :valueLevel="4"/>
-                <el-form-item>
-                  <el-input v-model="baseInfo.currentAddress" placeholder="详细地址" maxlength="30" show-word-limit clearable/>
-                </el-form-item>
-              </el-form-item>
-            </div>
-            <div slot="content" v-else style="margin-top: 16px;margin-bottom:24px">
-              <div class="info" style="margin-bottom:8px">
-                <span class="label">联系方式：</span>
-                <span class="value">{{ baseInfo.phone || '-' }}</span>
-              </div>
-              <div class="info">
-                <span class="label">现住址：</span>
-                <span class="value">{{ baseInfo.currentAreaName + baseInfo.currentAddress || "-" }}</span>
-              </div>
-            </div>
-          </ai-card>
-
-          <ai-card title="户籍信息">
-            <template v-if="showDetail" #right>
-              <template v-if="$permissions('app_appresident_edit')">
-                <el-button
-                    type="text"
-                    class="iconfont iconEdit"
-                    @click="editInit(),showEdit3=true;"
-                    v-if="!showEdit3"
-                >&nbsp;修改
-                </el-button>
-              </template>
-              <el-button
-                  type="text"
-                  @click="showEdit3=false,searchDetail(baseInfo.id)"
-                  v-if="showEdit3"
-              >取消
-              </el-button>
-              <el-button type="text" v-if="showEdit3" @click="saveFrom('ruleForm')">保存</el-button>
-            </template>
-            <div slot="content" v-if="showEdit3">
-              <div class="above">
-                <div class="left">
-                  <el-form-item label="是否户主：" prop="householdName">
-                    <el-select v-model="baseInfo.householdName" placeholder="请选择"
-                               @change="householdRelationChange" clearable>
-                      <el-option v-for="(item,i) in dict.getDict('householdName')"
-                                 :label="item.dictName" :key="i" :value="item.dictValue"/>
-                    </el-select>
-                  </el-form-item>
-                  <el-form-item label="与户主关系：" prop="householdRelation" v-if="baseInfo.householdName==0">
-                    <el-select v-model="baseInfo.householdRelation" placeholder="请选择" v-if="showEdit3" clearable>
-                      <el-option v-for="(item,i) in dict.getDict('householdRelation')"
-                                 :label="item.dictName" :key="i" :value="item.dictValue"/>
-                    </el-select>
-                  </el-form-item>
-                </div>
-                <div class="right">
-                  <el-form-item label="户主身份证号：" prop="householdIdNumber" v-if="baseInfo.householdName==0">
-                    <el-input v-model="baseInfo.householdIdNumber" placeholder="请输入户主身份证号" :maxlength="18" clearable/>
-                  </el-form-item>
-                </div>
-              </div>
-              <el-form-item label="户籍地：" prop="householdAreaId">
-                <ai-area-select clearable always-show :instance="instance" v-if="showEdit3"
-                                v-model="baseInfo.householdAreaId" />
-                <el-form-item v-if="baseInfo.householdAreaId">
-                  <el-input v-model="baseInfo.householdAddress" placeholder="详细地址" maxlength="30" show-word-limit clearable/>
-                </el-form-item>
-              </el-form-item>
-            </div>
-            <div slot="content" v-else style="margin-top: 16px;margin-bottom:24px">
-              <div class="detail-info">
-                <div class="detail-left fill">
+                </template>
+                <template>
+                  <div class="info" style="margin-bottom:8px">
+                    <span class="label">联系方式：</span>
+                    <span class="value">{{ baseInfo.phone || '-' }}</span>
+                  </div>
                   <div class="info">
-                    <span class="label">是否户主：</span>
-                    <span class="value">{{ dict.getLabel('householdName', baseInfo.householdName) || '-' }}</span>
+                    <span class="label">现住址：</span>
+                    <span class="value">{{ [baseInfo.currentAreaName, baseInfo.currentAddress].join("") || "-" }}</span>
                   </div>
-                </div>
-                <div class="info fill" v-if="baseInfo.householdName==0">
-                  <span class="label">与户主关系：</span>
-                  <span class="value">{{ dict.getLabel('householdRelation', baseInfo.householdRelation) || '-' }}</span>
-                </div>
-                <div class="info fill" v-if="baseInfo.householdName==0">
-                  <span class="label">户主身份证号：</span>
-                  <span class="value">
+                </template>
+              </ai-edit-card>
+              <ai-edit-card title="户籍信息" :show-btn="permissions('app_appresident_edit')"
+                            @save="saveFrom" @cancel="getDetail(baseInfo.id)">
+                <template #edit>
+
+                  <div class="above">
+                    <div class="left">
+                      <el-form-item label="是否户主：" prop="householdName">
+                        <el-select v-model="baseInfo.householdName" placeholder="请选择"
+                                   @change="householdRelationChange" clearable>
+                          <el-option v-for="(item,i) in dict.getDict('householdName')"
+                                     :label="item.dictName" :key="i" :value="item.dictValue"/>
+                        </el-select>
+                      </el-form-item>
+                      <el-form-item label="与户主关系：" prop="householdRelation" v-if="baseInfo.householdName==0">
+                        <el-select v-model="baseInfo.householdRelation" placeholder="请选择" clearable>
+                          <el-option v-for="(item,i) in dict.getDict('householdRelation')"
+                                     :label="item.dictName" :key="i" :value="item.dictValue"/>
+                        </el-select>
+                      </el-form-item>
+                    </div>
+                    <div class="right">
+                      <el-form-item label="户主身份证号：" prop="householdIdNumber" v-if="baseInfo.householdName==0">
+                        <el-input v-model="baseInfo.householdIdNumber" placeholder="请输入户主身份证号" :maxlength="18"
+                                  clearable/>
+                      </el-form-item>
+                    </div>
+                  </div>
+                  <el-form-item label="户籍地：" prop="householdAreaId">
+                    <ai-area-select clearable always-show :instance="instance" v-model="baseInfo.householdAreaId"/>
+                    <el-form-item v-if="baseInfo.householdAreaId">
+                      <el-input v-model="baseInfo.householdAddress" placeholder="详细地址" maxlength="30" show-word-limit
+                                clearable/>
+                    </el-form-item>
+                  </el-form-item>
+                </template>
+                <template>
+                  <div class="detail-info">
+                    <div class="detail-left fill">
+                      <div class="info">
+                        <span class="label">是否户主：</span>
+                        <span class="value">{{ dict.getLabel('householdName', baseInfo.householdName) || '-' }}</span>
+                      </div>
+                    </div>
+                    <div class="info fill" v-if="baseInfo.householdName==0">
+                      <span class="label">与户主关系：</span>
+                      <span class="value">{{
+                          dict.getLabel('householdRelation', baseInfo.householdRelation) || '-'
+                        }}</span>
+                    </div>
+                    <div class="info fill" v-if="baseInfo.householdName==0">
+                      <span class="label">户主身份证号：</span>
+                      <span class="value">
                         <ai-id mode="show" v-model="baseInfo.householdIdNumber" right-btn></ai-id>
                       </span>
-                </div>
-              </div>
-              <div class="detail-info-p info">
-                <span class="label">户籍地：</span>
-                <span class="value">
+                    </div>
+                  </div>
+                  <div class="detail-info-p info">
+                    <span class="label">户籍地：</span>
+                    <span class="value">
                   {{ baseInfo.householdAreaName + (baseInfo.householdAddress ? baseInfo.householdAddress : "") }}
                 </span>
-              </div>
-            </div>
-          </ai-card>
+                  </div>
+                </template>
+              </ai-edit-card>
+              <ai-card title="家庭成员">
+                <div slot="content">
+                  <el-table
+                      border
+                      ref="multipleTable"
+                      :data="family"
+                      style="margin-top:8px;"
 
-          <ai-card title="家庭成员" v-if="showDetail">
-            <div slot="content" v-if="showDetail">
-              <el-table
-                  border
-                  ref="multipleTable"
-                  :data="family"
-                  style="margin-top:8px;"
-
-                  header-cell-class-name="table-header"
-                  tooltip-effect="light"
-                  row-class-name="table-row"
-                  cell-class-name="table-cell"
-              >
-                <el-table-column align="center" prop="name" label="与户主关系">
-                  <template slot-scope="scope">
+                      header-cell-class-name="table-header"
+                      tooltip-effect="light"
+                      row-class-name="table-row"
+                      cell-class-name="table-cell"
+                  >
+                    <el-table-column align="center" prop="name" label="与户主关系">
+                      <template slot-scope="scope">
                       <span>{{
                           scope.row.householdRelation ? dict.getLabel('householdRelation', scope.row.householdRelation) : "户主"
                         }}</span>
-                  </template>
-                </el-table-column>
-                <el-table-column prop="name" label="姓名" align="center" show-overflow-tooltip></el-table-column>
-                <el-table-column prop="idNumber" label="性别" align="center" show-overflow-tooltip>
-                  <template slot-scope="scope">
-                    <span>{{ parseInt(scope.row.idNumber.substr(16, 1)) % 2 == 1 ? '男' : '女' }}</span>
-                  </template>
-                </el-table-column>
-                <el-table-column prop="age" label="年龄" align="center" show-overflow-tooltip></el-table-column>
-                <el-table-column
-                    prop="idNumber"
-                    label="身份证号"
-                    align="center"
-                    width="200"
-                    show-overflow-tooltip>
-                  <template slot-scope="{row}">
-                    <ai-id mode="show" v-model="row.idNumber" :showEyes="false"/>
-                  </template>
-                </el-table-column>
-                <el-table-column prop="address" label="操作" align="center" show-overflow-tooltip>
-                  <template slot-scope="scope">
-                    <el-button icon="iconfont iconShow" title="查看详情" class="dict-list-operation"
-                               @click="showFamily(scope.row)" type="text"/>
-                  </template>
-                </el-table-column>
-                <div slot="empty" class="no-data" style="height:160px;"/>
-              </el-table>
-            </div>
-          </ai-card>
-          <ai-card v-for="(item, index) in baseInfo.tsrqInfos" :key="index" :title="item.applicationName">
-            <ai-wrapper
-              slot="content"
-              label-width="120px">
-              <ai-info-item
-                v-for="(filed, i) in item.tableInfos"
-                :label="filed.fieldName"
-                :key="i"
-                :isLine="filed.grid === '1'">
-                <ai-file-list :fileList="formData[item.fieldDbName]" v-if="item.type == 'upload'" :fileOps="{name: 'name', size: 'fileSizeStr'}"></ai-file-list>
-                <div v-else>{{ filed.fieldValue || '-' }}</div>
-              </ai-info-item>
-            </ai-wrapper>
-          </ai-card>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="name" label="姓名" align="center" show-overflow-tooltip></el-table-column>
+                    <el-table-column prop="idNumber" label="性别" align="center" show-overflow-tooltip>
+                      <template slot-scope="scope">
+                        <span>{{ parseInt(scope.row.idNumber.substr(16, 1)) % 2 == 1 ? '男' : '女' }}</span>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="age" label="年龄" align="center" show-overflow-tooltip></el-table-column>
+                    <el-table-column
+                        prop="idNumber"
+                        label="身份证号"
+                        align="center"
+                        width="200"
+                        show-overflow-tooltip>
+                      <template slot-scope="{row}">
+                        <ai-id mode="show" v-model="row.idNumber" :showEyes="false"/>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="address" label="操作" align="center" show-overflow-tooltip>
+                      <template slot-scope="scope">
+                        <el-button icon="iconfont iconShow" title="查看详情" class="dict-list-operation"
+                                   @click="showFamily(scope.row)" type="text"/>
+                      </template>
+                    </el-table-column>
+                    <div slot="empty" class="no-data" style="height:160px;"/>
+                  </el-table>
+                </div>
+              </ai-card>
+              <ai-edit-card title="标签信息" :show-btn="permissions('app_appresident_edit')"
+                            @save="saveFrom" @cancel="getDetail(baseInfo.id)">
+                <template #edit>
+                  <el-form-item label-width="0">
+                    <el-checkbox label="1">标签1</el-checkbox>
+                  </el-form-item>
+                </template>
+                <template>
+                  <el-tag effect="dark">标签二</el-tag>
+                </template>
+              </ai-edit-card>
+            </el-tab-pane>
+            <el-tab-pane label="资产信息" lazy>
+              <ai-edit-card title="车辆信息" :show-btn="permissions('app_appresident_edit')"
+                            @save="saveFrom" @cancel="getDetail(baseInfo.id)">
+                <template>
+                  <el-form-item label-width="0">
+                    <span v-for="car in baseInfo.cars" :key="car.id" v-text="car.license"/>
+                    <ai-empty v-if="baseInfo.cars.length==0"/>
+                  </el-form-item>
+                </template>
+                <template #edit>
+                  <el-form-item label-width="0" prop="cars">
+                    <el-input v-for="(car,i) in baseInfo.cars" :key="car.id" v-model="car.license" clearable
+                              placeholder="请输入车牌号">
+                      <el-button slot="append" type="text" @click="baseInfo.cars.splice(i,1)">删除</el-button>
+                    </el-input>
+                    <el-button type="text" @click="baseInfo.cars.push({})">新增车辆</el-button>
+                  </el-form-item>
+                </template>
+              </ai-edit-card>
+              <ai-edit-card title="房屋信息" :show-btn="permissions('app_appresident_edit')"
+                            @save="saveFrom" @cancel="getDetail(baseInfo.id)">
+                <template>
+                  <el-form-item label-width="0">
+                    <span v-for="house in baseInfo.houseList" :key="house.id"
+                          v-text="[house.areaName,house.address].join('')"/>
+                    <ai-empty v-if="baseInfo.houseList.length==0"/>
+                  </el-form-item>
+                </template>
+                <template #edit>
+                  <div v-for="house in baseInfo.houseList" :key="house.id">
+                    <ai-area-get v-model="house.areaId" :instance="instance"/>
+                    <el-input v-model="house.address" clearable placeholder="请输入详情地址" size="small"/>
+                  </div>
+                  <el-button type="text" @click="baseInfo.houseList.push({})">新增房屋</el-button>
+                </template>
+              </ai-edit-card>
+            </el-tab-pane>
+            <el-tab-pane label="特殊人群" lazy v-if="hasSpecial">
+              <ai-card v-for="(item, index) in baseInfo.tsrqInfos" :key="index" :title="item.applicationName">
+                <ai-wrapper
+                    slot="content"
+                    label-width="120px">
+                  <ai-info-item
+                      v-for="(filed, i) in item.tableInfos"
+                      :label="filed.fieldName"
+                      :key="i"
+                      :isLine="filed.grid === '1'">
+                    <ai-file-list :fileList="formData[item.fieldDbName]" v-if="item.type == 'upload'"
+                                  :fileOps="{name: 'name', size: 'fileSizeStr'}"></ai-file-list>
+                    <div v-else>{{ filed.fieldValue || '-' }}</div>
+                  </ai-info-item>
+                </ai-wrapper>
+              </ai-card>
+            </el-tab-pane>
+          </el-tabs>
+          <template v-else>
+            <ai-card title="基本信息">
+              <template #content>
+                <div class="above">
+                  <div class="left">
+                    <el-form-item label="姓名：" prop="name">
+                      <el-input
+                          v-model="baseInfo.name"
+                          autocomplete="off"
+                          size="small"
+                          placeholder="请输入姓名"
+                          maxlength="20"
+                          show-word-limit
+                          :disabled="!!showDetail"
+                      />
+                      <!-- <p v-else>{{baseInfo.name||'-'}}</p> -->
+                    </el-form-item>
+                    <el-form-item label="身份证号：" prop="idNumber">
+                      <el-input
+                          v-model="baseInfo.idNumber"
+                          autocomplete="off"
+                          size="small"
+                          placeholder="请输入身份证号"
+                          :maxlength="18"
+                          @input="idChange"
+                          :disabled="!!showDetail"
+                      />
+                      <!-- <p v-else>
+                          <ai-id mode="show" v-model="baseInfo.idNumber" right-btn></ai-id>
+                      </p>-->
+                    </el-form-item>
+                    <el-form-item label="性别：" prop="sex">
+                      <el-select v-model="baseInfo.sex"
+                                 placeholder="请选择"
+                                 disabled
+                                 clearable>
+                        <el-option
+                            v-for="(item,i) in dict.getDict('sex')"
+                            :label="item.dictName"
+                            :key="i"
+                            :value="item.dictValue"
+                        ></el-option>
+                      </el-select>
+                      <!-- <p v-else>
+                          {{dict.getLabel('sex',baseInfo.sex)||'-'}}
+                      </p>-->
+                    </el-form-item>
+                  </div>
+                  <div class="right">
+                    <el-form-item label="个人照片：" prop="photo">
+                      <ai-avatar :instance="instance" v-model="baseInfo.photo"/>
+                    </el-form-item>
+                  </div>
+                </div>
+                <div class="above">
+                  <div class="left">
+                    <el-form-item label="出生日期：">
+                      <el-date-picker
+                          disabled
+                          :editable="false"
+                          value-format="yyyy-MM-dd HH:mm:ss"
+                          format="yyyy-MM-dd"
+                          v-model="baseInfo.birthday"
+                          type="date"
+                          placeholder="选择日期"
+                      ></el-date-picker>
+                    </el-form-item>
+                    <el-form-item label="文化程度：" prop="education">
+                      <el-select
+                          v-model="baseInfo.education"
+                          placeholder="请选择"
+
+                          clearable
+                      >
+                        <el-option
+                            v-for="(item,i) in dict.getDict('education')"
+                            :label="item.dictName"
+                            :key="i"
+                            :value="item.dictValue"
+                        ></el-option>
+                      </el-select>
+                      <!-- <p v-else>{{dict.getLabel('education',baseInfo.education)||'-'}}</p> -->
+                    </el-form-item>
+                    <el-form-item label="政治面貌：" prop="politicsStatus">
+                      <el-select
+                          v-model="baseInfo.politicsStatus"
+                          placeholder="请选择"
+
+                          clearable
+                      >
+                        <el-option
+                            v-for="(item,i) in dict.getDict('politicsStatus')"
+                            :label="item.dictName"
+                            :key="i"
+                            :value="item.dictValue"
+                        ></el-option>
+                      </el-select>
+                      <!-- <p v-else>{{dict.getLabel('politicsStatus',baseInfo.politicsStatus)||'-'}}</p> -->
+                    </el-form-item>
+                    <el-form-item label="职业：" prop="job">
+                      <el-select
+                          v-model="baseInfo.job"
+                          placeholder="请选择"
+
+                          clearable
+                      >
+                        <el-option
+                            v-for="(item,i) in dict.getDict('job')"
+                            :label="item.dictName"
+                            :key="i"
+                            :value="item.dictValue"
+                        ></el-option>
+                      </el-select>
+                      <!-- <p v-else>{{dict.getLabel('job',baseInfo.job)||'-'}}</p> -->
+                    </el-form-item>
+                    <el-form-item label="宗教信仰：" prop="faithType">
+                      <el-select
+                          v-model="baseInfo.faithType"
+                          placeholder="请选择"
+
+                          clearable
+                      >
+                        <el-option
+                            v-for="(item,i) in dict.getDict('faithType')"
+                            :label="item.dictName"
+                            :key="i"
+                            :value="item.dictValue"
+                        ></el-option>
+                      </el-select>
+                      <!-- <p v-else>{{dict.getLabel('faithType',baseInfo.faithType)||'-'}}</p> -->
+                    </el-form-item>
+                  </div>
+                  <div class="right">
+                    <el-form-item label="年龄：" prop="age">
+                      <el-input
+                          disabled
+                          v-model="baseInfo.age"
+                          autocomplete="off"
+                          size="small"
+                          placeholder="请输入年龄"
+                          type="number"
+                          @mousewheel.native.prevent
+                      ></el-input>
+                      <!-- <p v-else>{{baseInfo.age}}</p> -->
+                    </el-form-item>
+                    <el-form-item label="民族：" prop="nation">
+                      <el-select
+                          v-model="baseInfo.nation"
+                          placeholder="请选择"
+
+                          clearable
+                      >
+                        <el-option
+                            v-for="(item,i) in dict.getDict('nation')"
+                            :label="item.dictName"
+                            :key="i"
+                            :value="item.dictValue"
+                        ></el-option>
+                      </el-select>
+                      <!-- <p v-else>{{dict.getLabel('nation',baseInfo.nation)||'-'}}</p> -->
+                    </el-form-item>
+                    <el-form-item label="婚姻状况：" prop="maritalStatus">
+                      <el-select
+                          v-model="baseInfo.maritalStatus"
+                          placeholder="请选择"
+
+                          clearable
+                      >
+                        <el-option
+                            v-for="(item,i) in dict.getDict('maritalStatus')"
+                            :label="item.dictName"
+                            :key="i"
+                            :value="item.dictValue"
+                        ></el-option>
+                      </el-select>
+                      <!-- <p v-else>{{dict.getLabel('maritalStatus',baseInfo.maritalStatus)||'-'}}</p> -->
+                    </el-form-item>
+                    <el-form-item label="兵役状况：" prop="militaryStatus">
+                      <el-select
+                          v-model="baseInfo.militaryStatus"
+                          placeholder="请选择"
+
+                          clearable
+                      >
+                        <el-option
+                            v-for="(item,i) in dict.getDict('militaryStatus')"
+                            :label="item.dictName"
+                            :key="i"
+                            :value="item.dictValue"
+                        ></el-option>
+                      </el-select>
+                      <!-- <p v-else>{{dict.getLabel('militaryStatus',baseInfo.militaryStatus)||'-'}}</p> -->
+                    </el-form-item>
+                  </div>
+                </div>
+                <div class="areaList">
+                  <el-form-item label="籍贯：" prop=" birthplaceAreaId">
+                    <ai-area-select
+                        clearable
+                        always-show
+                        :instance="instance"
+                        v-model="baseInfo.birthplaceAreaId"
+                        :areaLevel="3"
+                    />
+                  </el-form-item>
+                </div>
+              </template>
+            </ai-card>
+            <ai-card title="联络信息">
+              <template #content>
+                <div class="above">
+                  <div class="left">
+                    <el-form-item label="联系方式：" prop="phone">
+                      <el-input v-model="baseInfo.phone" size="small" placeholder="请输入联系方式" :maxlength="11"
+                                show-word-limit/>
+                    </el-form-item>
+                  </div>
+                </div>
+                <el-form-item label="现住址：" prop="currentAreaId">
+                  <ai-area-select clearable always-show :instance="instance" :disabled-level="disabledLevel"
+                                  v-model="baseInfo.currentAreaId"
+                                  :valueLevel="4"/>
+                  <el-form-item>
+                    <el-input v-model="baseInfo.currentAddress" placeholder="详细地址" maxlength="30" show-word-limit
+                              clearable/>
+                  </el-form-item>
+                </el-form-item>
+              </template>
+            </ai-card>
+            <ai-card title="户籍信息">
+              <template #content>
+
+                <div class="above">
+                  <div class="left">
+                    <el-form-item label="是否户主：" prop="householdName">
+                      <el-select v-model="baseInfo.householdName" placeholder="请选择"
+                                 @change="householdRelationChange" clearable>
+                        <el-option v-for="(item,i) in dict.getDict('householdName')"
+                                   :label="item.dictName" :key="i" :value="item.dictValue"/>
+                      </el-select>
+                    </el-form-item>
+                    <el-form-item label="与户主关系：" prop="householdRelation" v-if="baseInfo.householdName==0">
+                      <el-select v-model="baseInfo.householdRelation" placeholder="请选择" clearable>
+                        <el-option v-for="(item,i) in dict.getDict('householdRelation')"
+                                   :label="item.dictName" :key="i" :value="item.dictValue"/>
+                      </el-select>
+                    </el-form-item>
+                  </div>
+                  <div class="right">
+                    <el-form-item label="户主身份证号：" prop="householdIdNumber" v-if="baseInfo.householdName==0">
+                      <el-input v-model="baseInfo.householdIdNumber" placeholder="请输入户主身份证号" :maxlength="18"
+                                clearable/>
+                    </el-form-item>
+                  </div>
+                </div>
+                <el-form-item label="户籍地：" prop="householdAreaId">
+                  <ai-area-select clearable always-show :instance="instance" v-model="baseInfo.householdAreaId"/>
+                  <el-form-item v-if="baseInfo.householdAreaId">
+                    <el-input v-model="baseInfo.householdAddress" placeholder="详细地址" maxlength="30" show-word-limit
+                              clearable/>
+                  </el-form-item>
+                </el-form-item>
+              </template>
+            </ai-card>
+          </template>
         </el-form>
       </template>
       <template v-if="!showDetail" #footer>
-        <el-button @click="cancelFn()">取消</el-button>
-        <el-button type="primary" @click="saveFrom('ruleForm','goBack')">保存</el-button>
+        <el-button @click="back">取消</el-button>
+        <el-button type="primary" @click="saveFrom()">保存</el-button>
       </template>
     </ai-detail>
-
     <el-dialog class="deleteStyle" :visible.sync="familyDialog" width="720px" title="家庭成员信息" top="30vh">
       <el-row type="flex" justify="space-between">
         <ul>
@@ -655,14 +889,15 @@
 </template>
 <script>
 import {mapState} from "vuex";
+import AiEditCard from "./components/AiEditCard";
 
 export default {
-  name: "addAborigines",
+  name: "localResident",
+  components: {AiEditCard},
   props: {
     instance: Function,
     dict: Object,
     permissions: Function,
-    detail: Object,
     active: String
   },
   data() {
@@ -723,7 +958,6 @@ export default {
         logoutDescription: "",
         fileStatus: "1"
       },
-      birthday: "",
       rules: {
         name: [{required: true, message: "请输入姓名", trigger: "blur"}],
         idNumber: [
@@ -745,7 +979,7 @@ export default {
               if (/.+0{3}$/.test(v) && v) {
                 cb("户籍地必须选到村级")
               } else cb()
-            },trigger: "blur"
+            }, trigger: "blur"
           }
         ],
         householdName: [
@@ -763,10 +997,6 @@ export default {
       },
       imgUrl: "",
       fileList: [],
-      showEdit1: false,
-      showEdit2: false,
-      showEdit3: false,
-      showEdit4: false,
       disabledLevel: 0
     };
   },
@@ -775,52 +1005,36 @@ export default {
     showDetail() {
       return !!this.$route.query?.id
     },
-    navList() {
-      return [
-        {name: "本地居民信息", id: "1"},
-        {name: "变更记录", id: "2"}
-      ]
+    pageTitle() {
+      return this.showDetail ? '本地居民信息' : '添加本地居民'
     },
-    tipOps() {
-      return this.dict.getDict("residentTipType") || []
+    hasSpecial() {
+      //是否有特殊人员信息
+      return this.baseInfo.tsrqInfos?.length > 0
     }
   },
   methods: {
-    uploadFile(file) {
-      const isLt2M = file.file.size / 1024 / 1024 < 2;
-      if (!isLt2M) {
-        this.$message.warning("头像大小不能超过 2MB!");
-        return;
-      }
-      let formData = new FormData();
-      formData.append("file", file.file);
-      this.instance.post(`/admin/file/add`, formData, {withCredentials: false})
-      .then(res => {
-        if (res && res.code == 0) {
-          let imgInfo = res.data[0].split(";");
-          this.imgUrl = imgInfo[0];
-          this.baseInfo.photo = res.data[0];
-        }
-      });
-    },
-    handleChange(file, fileList) {
-      this.fileList = fileList;
+    back() {
+      this.$router.push({query: {}})
     },
     householdRelationChange() {
       this.baseInfo.householdIdNumber = "";
       this.baseInfo.householdRelation = "";
     },
-    saveFrom(formName, type) {
-      this.$refs[formName].validate(valid => {
-        if (valid) {
-          this.saveFromFn(type);
+    saveFrom(cb) {
+      this.$refs.ruleForm.validate(v => {
+        if (v) {
+          this.saveFromFn().then(() => {
+            if (cb) {
+              cb()
+              this.getDetail()
+            } else {
+              this.back()
+            }
+          });
         }
       });
     },
-    cancelFn() {
-      this.$refs.ruleForm?.resetFields()
-      this.$router.push({query: {}});
-    },
     submitForm(formName) {
       this.writeInfo.id = this.baseInfo.id;
       this.$refs[formName].validate(valid => {
@@ -845,9 +1059,9 @@ export default {
       });
       this.$refs.writeInfo.resetFields();
     },
-    saveFromFn(type) {
+    saveFromFn() {
       let {currentHouseList, householdHouseList, tips} = this.baseInfo
-      this.instance.post(`/app/appresident/addOrUpdate`, {
+      return this.instance.post(`/app/appresident/addOrUpdate`, {
         residentType: this.$route.query.type,
         ...this.baseInfo,
         currentHouseList: currentHouseList?.join("|"),
@@ -856,28 +1070,19 @@ export default {
       }).then(res => {
         if (res?.code == 0) {
           this.$message.success("保存成功");
-          if (type) {
-            this.$router.push({query: {}})
-          } else {
-            this.editInit();
-          }
         }
-      });
+      })
     },
-    editInit() {
-      this.showEdit1 = false;
-      this.showEdit2 = false;
-      this.showEdit3 = false;
-      this.showEdit4 = false;
-      this.searchDetail(this.baseInfo.id);
-    },
-    searchDetail(id, type) {
+    getDetail() {
+      let {id} = this.$route.query
       this.instance.post(`/app/appresident/detail`, null, {
         params: {id}
       }).then(res => {
         if (res?.data) {
           let {currentHouseList, householdHouseList, tips} = res.data.resident
           this.baseInfo = {
+            cars: [],
+            houseList: [],
             ...res.data.resident,
             currentHouseList: currentHouseList?.split("|"),
             householdHouseList: householdHouseList?.split("|"),
@@ -885,9 +1090,6 @@ export default {
           };
           this.family = res.data.family;
           this.IdCard(this.baseInfo.idNumber);
-          if (type == "family") {
-            this.familyDialog = false;
-          }
         }
       });
     },
@@ -924,64 +1126,35 @@ export default {
     },
     IdCard(UUserCard) {
       if (UUserCard) {
-        let arr = [];
-        //获取出生日期
-        let birth =
-            UUserCard.substring(6, 10) +
-            "-" +
-            UUserCard.substring(10, 12) +
-            "-" +
-            UUserCard.substring(12, 14) +
-            " 00:00:00";
-        arr.push(birth);
-
-        if (parseInt(UUserCard.substr(16, 1)) % 2 == 1) {
-          //男
-          arr.push("1");
-        } else {
-          //女
-          arr.push("0");
-        }
-        //获取年龄
-        const myDate = new Date();
-        const month = myDate.getMonth() + 1;
-        const day = myDate.getDate();
-        let age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1;
-        if (
-            UUserCard.substring(10, 12) < month ||
-            (UUserCard.substring(10, 12) == month &&
-                UUserCard.substring(12, 14) <= day)
-        ) {
-          age++;
-        }
-        arr.push(age);
-        this.baseInfo.sex = arr[1];
-        this.baseInfo.age = arr[2];
-        this.birthday = arr[0];
+        this.baseInfo.age = this.$calcAge(UUserCard)
+        let {birthday, sex} = this.idCardNoUtil.getIdCardInfo(UUserCard)
+        this.baseInfo.sex = sex
+        this.baseInfo.birthday = birthday
       }
     }
   },
   created() {
     this.disabledLevel = this.user.info.areaMap[this.user.info.areaId].length;
     if (!this.showDetail) {
-      this.showEdit1 = true;
-      this.showEdit2 = true;
-      this.showEdit3 = true;
-      this.showEdit4 = true;
       // this.baseInfo.householdAreaId = JSON.parse(JSON.stringify(this.user.info.areaId))
       this.baseInfo.currentAreaId = JSON.parse(JSON.stringify(this.user.info.areaId))
       this.$nextTick(() => this.$refs.ruleForm?.resetFields())
     } else {
-      this.searchDetail(this.$route.query.id);
+      this.getDetail(this.$route.query.id);
     }
   }
 };
 </script>
 <style lang="scss" scoped>
-.addAborigines {
+.localResident {
   height: 100%;
   font-size: 14px;
 
+  ::v-deep.el-tabs__content {
+    max-height: calc(100vh - 136px);
+    overflow-y: auto;
+  }
+
   .el-form-item {
     margin-bottom: 10px;