图片

src/components/AiCell/AiCell.vue

@@ -0,0 +1,76 @@
+<template>
+  <section class="AiCell" :class="{bottomBorder,alignCenter,topLabel}">
+    <div class="label" :class="{title}">
+      <slot v-if="$slots.label" name="label"/>
+      <span v-else>{{ label }}</span>
+    </div>
+    <div class="content" :class="{topLabel}">
+      <slot/>
+    </div>
+  </section>
+</template>
+
+<script>
+export default {
+  name: "AiCell",
+  props: {
+    label: {default: ""},
+    bottomBorder: Boolean,
+    topLabel: Boolean,
+    title: Boolean,
+    alignCenter: Boolean
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiCell {
+  display: flex;
+  min-height: 72px;
+  font-size: 30px;
+  color: #333;
+  padding: 14px 0;
+  box-sizing: border-box;
+  justify-content: space-between;
+
+  &.bottomBorder {
+    border-bottom: 1px solid #eee;
+  }
+
+  &.alignCenter {
+    align-items: center;
+  }
+
+  &.topLabel {
+    flex-direction: column;
+  }
+
+  .label {
+    min-width: 60px;
+    flex-shrink: 0;
+    width: auto;
+    color: #999;
+
+
+    &.title {
+      color: #333;
+      font-weight: bold;
+      font-size: 34px;
+    }
+  }
+
+  .content {
+    flex: 1;
+    min-width: 100px;
+    min-height: 40px;
+    max-width: 500px;
+    text-align: right;
+
+    &.topLabel {
+      text-align: start;
+      margin-top: 16px;
+      max-width: 100%;
+    }
+  }
+}
+</style>

src/components/AiListPage/AiListPage.vue

@@ -0,0 +1,115 @@
+<template>
+  <section class="AppListPage">
+    <div class="header" :style="{backgroundImage: url(headerBg)}">
+      <img :src="headerBg" alt="">
+      <p>{{label}}</p>
+    </div>
+    <div class="content">
+      <div class="title">{{label}}</div>
+      <div class="app-list">
+        <div class="item" v-for="(item, index) in appList" :key="index" @click="linkTo(item.url)" >
+          <!-- <div class="icon" :style="{backgroundImage: url(item.icon)}"></div> -->
+          <img :src="item.icon" alt="" class="icon">
+          <p>{{item.name}}</p>
+        </div>
+      </div>
+    </div>  
+    
+  </section>
+</template>
+
+<script>
+
+export default {
+  name: "AppListPage",
+  props: {
+    label: String,
+    appList: Array,
+    headerBg: String
+  },
+  methods: {
+    linkTo(url) {
+      console.log(111)
+      console.log(url)
+      uni.navigateTo({url})
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AppListPage {
+  padding-top: 20px;
+  .header{
+    width: calc(100% - 36px);
+    height: 240px;
+    margin: 0 18px 20px 18px;
+    background-size: 100% 100%;
+    img {
+      width: 100%;
+      height: 100%;
+    }
+    p{
+      position: absolute;
+      top: 48px;
+      left: 50px;
+      font-size: 46px;
+      font-family: PingFangSC-Semibold, PingFang SC;
+      font-weight: 600;
+      color: #26385C;
+      line-height: 64px;
+      // padding: 48px 50px 0 50px;
+      word-break: break-all;
+    }
+  }
+  .content{
+    margin: 0 20px 20px;
+    width: calc(100% - 40px);
+    background: #FFF;
+    border-radius: 16px;
+    .title{
+      line-height: 70px;
+      border-bottom: 1px solid #eee;
+      padding-left: 20px;
+      font-size: 26px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #999;
+    }
+    .app-list{
+      overflow: hidden;
+      .item{
+        text-align: center;
+        padding-bottom: 38px;
+        border-right: 1px solid #eee;
+        border-top: 1px solid #eee;
+        width: calc(33% - 1px);
+        float: left;
+        .icon{
+          display: inline-block;
+          width: 58px;
+          height: 58px;
+          margin: 40px 0 18px 0;
+          background-size: 100% 100%;
+          text-align: center;
+        }
+        p{
+          font-size: 28px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #3D434A;
+          line-height: 40px;
+        }
+      }
+      .item:nth-of-type(3n) {
+        border-right: 0;
+      }
+      .item:nth-of-type(1),
+      .item:nth-of-type(2),
+      .item:nth-of-type(3) {
+        border-top: 0;
+      }
+    }
+  }
+}
+</style>

src/components/AiLoading/AiLoading.vue

@@ -0,0 +1,28 @@
+<template>
+  <section class="AiLoading">
+    <image :src="image"/>
+    <span>{{ tips }}</span>
+  </section>
+</template>
+
+<script>
+export default {
+  name: "AiLoading",
+  props: {
+    tips: {default: "应用加载中"},
+    image: {default: "https://cdn.cunwuyun.cn/wxAdmin/img/message.png"}
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiLoading {
+  font-size: 32px;
+  color: #666;
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+</style>

src/components/AiResult/AiResult.vue

@@ -0,0 +1,88 @@
+<template>
+  <section class="AiResult">
+    <slot v-if="$slots.default"/>
+    <template v-else>
+      <image :src="result.image"/>
+      <span class="tips">{{ result.tips }}</span>
+      <slot name="extra" class="extra" v-if="$slots.extra"/>
+      <div v-if="result.btn" class="btn" @tap="handleTap">{{ result.btn }}</div>
+    </template>
+  </section>
+</template>
+
+<script>
+export default {
+  name: "AiResult",
+  props: {
+    tips: {default: "提交成功!"},
+    image: {default: "https://cdn.cunwuyun.cn/dvcp/h5/result/success.png"},
+    btn: {default: ""},
+    status: {default: "success"},
+    btnTap: Function
+  },
+  computed: {
+    result() {
+      let obj = {
+        image: this.image,
+        tips: this.tips,
+        btn: this.btn
+      }
+      if (this.status == "error") {
+        obj.image = this.$cdn + "result/fail.png"
+        obj.tips = this.tips || "提交失败!"
+      } else if (this.status == "loading") {
+        obj.image = "https://cdn.cunwuyun.cn/wxAdmin/img/message.png"
+        obj.tips = this.tips || "数据读取中..."
+      }
+      return obj
+    }
+  },
+  methods: {
+    handleTap() {
+      this.btnTap && this.btnTap()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiResult {
+  padding-top: 96px;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: 36px;
+  font-weight: bold;
+
+  & > image {
+    width: 192px;
+    height: 192px;
+  }
+
+  .tips {
+    margin: 16px auto 0;
+    color: #333;
+  }
+
+  .extra {
+    margin-top: 48px;
+  }
+
+  .btn {
+    cursor: pointer;
+    margin-top: 80px;
+    width: calc(100% - 192px);
+    height: 88px;
+    background: #197DF0;
+    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.02);
+    border-radius: 8px;
+    color: #FFF;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-weight: 500;
+  }
+}
+</style>

src/components/AiTable/AiTable.vue

@@ -0,0 +1,48 @@
+<template>
+  <section class="AiTable">
+    <u-table color="#333">
+      <u-tr>
+        <u-th v-for="(col,i) in colConfigs" :key="i" :width="col.width">{{ col.label }}</u-th>
+      </u-tr>
+      <u-tr v-for="(row,j) in data" :key="j">
+        <u-td v-for="(col,i) in colConfigs" :key="i" :width="col.width">
+          <slot v-if="col.slot" :name="col.slot" :row="row"/>
+          <p v-else-if="col.dict">{{ $dict.getLabel(col.dict, row[col.prop]) }}</p>
+          <p v-else>{{ row[col.prop] || "-" }}</p>
+        </u-td>
+      </u-tr>
+    </u-table>
+  </section>
+</template>
+
+<script>
+
+export default {
+  name: "AiTable",
+  props: {
+    data: {default: () => []},
+    colConfigs: {default: () => []},
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiTable {
+  border-radius: 8px;
+  min-height: 100px;
+  overflow: hidden;
+
+  .u-table, .u-th {
+    border-color: #D0D4DC !important;
+  }
+
+  .u-th {
+    background-color: #DFE6F4;
+    color: #646D7F;
+  }
+
+  .u-tr {
+    height: 80px;
+  }
+}
+</style>

src/project/baiduAI/AppDialogue/AppDialogue.vue

@@ -17,18 +17,18 @@
         <div v-for="(item, index) in messageList" :key="index">
           <div class="send-time">{{item.createTime.substring(5, 16)}}</div>
           <div :class="item.userType == 1 ? 'item-left' : 'item-right'">
-            <img src="./img/user-img.png" alt="" class="user-img" v-if="item.userType == 1">
+            <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/user-img.png" alt="" class="user-img" v-if="item.userType == 1">
             <div class="item" :class="'item'+index">
               <u-icon name="play-right-fill" color="#CCE2FF" size="20" v-if="item.userType != 1" class="u-icon-right"></u-icon>
               <u-icon name="play-left-fill" color="#F3F5F7" size="20" v-if="item.userType == 1" class="u-icon-left"></u-icon>
               <div class="voice-div" v-if="item.sdkFileUrl" @click="play(item.sdkFileUrl, index)">
                 <span>8”</span>
-                <img src="./img/play-d.gif" alt="" v-if="item.isPlay">
-                <img src="./img/play-j.png" alt="" v-else>
+                <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/play-d.gif" alt="" v-if="item.isPlay">
+                <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/play-j.png" alt="" v-else>
               </div>
               <p v-if="!item.sdkFileUrl">{{item.content || ''}}</p>
             </div>
-            <img src="./img/user-img.png" alt="" class="user-img" v-if="item.userType != 1">
+            <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/user-img.png" alt="" class="user-img" v-if="item.userType != 1">
           </div>
         </div>
       </div>
@@ -54,10 +54,10 @@
     </div>
     <!-- <div class="login-btn">
       
-      <img src="./img/question-icon.png" alt="">登录
+      <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/question-icon.png" alt="">登录
     </div> -->
     <button class="login-btn" open-type="getPhoneNumber" @getphonenumber="handleAdminLogin">
-      <img src="./img/question-icon.png" alt="">登录
+      <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/question-icon.png" alt="">登录
     </button>
     <AiLogin ref="login"/>
   </div>

src/project/baiduAI/AppMy/AppMy.vue

@@ -16,18 +16,18 @@
         <!-- <div class="app-list">
           <div class="item">
             <div class="item-left">
-              <img src="./img/icon1.png" alt="" class="icon-img">应用1
+              <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/icon1.png" alt="" class="icon-img">应用1
             </div>
             <div class="item-right">
-              <img src="./img/right-icon.png" alt="" class="right-img">
+              <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/right-icon.png" alt="" class="right-img">
             </div>
           </div>
           <div class="item">
             <div class="item-left">
-              <img src="./img/icon2.png" alt="" class="icon-img">应用2
+              <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/icon2.png" alt="" class="icon-img">应用2
             </div>
             <div class="item-right">
-              <img src="./img/right-icon.png" alt="" class="right-img">
+              <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/right-icon.png" alt="" class="right-img">
             </div>
           </div>
         </div> -->

src/project/baiduAI/AppRecord/AppRecord.vue

@@ -12,18 +12,18 @@
       <div v-for="(item, index) in messageList" :key="index">
         <div class="send-time">{{item.createTime.substring(5, 16)}}</div>
         <div :class="item.userType == 1 ? 'item-left' : 'item-right'">
-          <img src="./img/user-img.png" alt="" class="user-img" v-if="item.userType == 1">
+          <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/user-img.png" alt="" class="user-img" v-if="item.userType == 1">
           <div class="item" :class="'item'+index">
             <u-icon name="play-right-fill" color="#CCE2FF" size="20" v-if="item.userType != 1" class="u-icon-right"></u-icon>
             <u-icon name="play-left-fill" color="#F3F5F7" size="20" v-if="item.userType == 1" class="u-icon-left"></u-icon>
             <div class="voice-div" v-if="item.sdkFileUrl" @click="play(item.sdkFileUrl, index)">
               <span>8”</span>
-              <img src="./img/play-d.gif" alt="" v-if="item.isPlay">
-              <img src="./img/play-j.png" alt="" v-else>
+              <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/play-d.gif" alt="" v-if="item.isPlay">
+              <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/play-j.png" alt="" v-else>
             </div>
             <p v-if="!item.sdkFileUrl">{{item.content || ''}}</p>
           </div>
-          <img src="./img/user-img.png" alt="" class="user-img" v-if="item.userType != 1">
+          <img src="https://cdn.cunwuyun.cn/wechat/baiduAI/user-img.png" alt="" class="user-img" v-if="item.userType != 1">
         </div>
       </div>
       <AiEmpty v-if="!messageList.length"/>

src/project/new/AppPageInteraction/AppPageInteraction.vue

@@ -0,0 +1,48 @@
+<template>
+  <div class="AppPageInteraction">
+    <AiListPage :label="label" :appList="appList" :headerBg="headerBg"/>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AppPageInteraction',
+  appName: '工作台(居民管理)',
+  data() {
+    return {
+      label: '居民管理',
+      appList: [
+        {
+          name: '居民信息管理',
+          icon: require('./img/jmhd.png'),
+          url: '../AppResidentFile/AppResidentFile'
+        },
+        {
+          name: '居民档案',
+          icon: require('./img/jmda.png'),
+          url: '../AppPeopleList/AppPeopleList'
+        },
+        // {
+        //   name: '小程序公告',
+        //   icon: require('./img/xcxgg.png'),
+        //   url: '../AppUniMsg/AppUniMsg'
+        // }
+      ],
+      headerBg: require('./img/header-bg.png'),
+    }
+  },
+  onShow() {
+    document.title = "居民管理"
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+uni-page-body {
+  height: 100%;
+}
+
+.AppPageInteraction {
+  height: 100%;
+}
+</style>

src/project/new/AppPeopleList/Add.vue

@@ -0,0 +1,379 @@
+<template>
+  <div class="add">
+    <div class="item">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">居民类型</span>
+        <span class="value" @click="clickSelect('residentType', 'residentType')">
+          <span v-if="form.residentType === ''" class="color-999">请选择</span>
+          <span v-else>{{$dict.getLabel('residentType', form.residentType)}}</span>
+          <img src="./components/img/right-icon.png" alt="">
+        </span>
+      </div>
+    </div>
+    <div class="item">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">是否户主</span>
+        <span class="value" @click="clickSelect('yesOrNo', 'householdName')">
+          <span v-if="form.householdName === ''" class="color-999">请选择</span>
+          <span v-else>{{$dict.getLabel('yesOrNo', form.householdName)}}</span>
+          <img src="./components/img/right-icon.png" alt="">
+        </span>
+      </div>
+    </div>
+    <div class="item" v-if="form.householdName != 1">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">户主身份证</span>
+        <span class="value">
+          <input type="idcard" placeholder="请输入" v-model="form.householdIdNumber" maxlength="18">
+        </span>
+      </div>
+    </div>
+    <div class="item" v-if="form.householdName != 1">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">与户主关系</span>
+        <span class="value" @click="clickSelect('householdRelation', 'householdRelation')">
+          <span v-if="form.householdRelation === ''" class="color-999">请选择</span>
+          <span v-else>{{$dict.getLabel('householdRelation', form.householdRelation)}}</span>
+          <img src="./components/img/right-icon.png" alt="">
+        </span>
+      </div>
+    </div>
+    <div class="item">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">姓名</span>
+        <span class="value">
+          <input type="text" placeholder="请输入" v-model="form.name" maxlength="10" :disabled="this.form.id ? true : false">
+        </span>
+      </div>
+    </div>
+    <div class="item">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">身份证号</span>
+        <span class="value">
+          <input type="idcard" placeholder="请输入" v-model="form.idNumber" maxlength="18" @input="changeIdNumber" :disabled="this.form.id ? true : false">
+        </span>
+      </div>
+    </div>
+    <div class="item">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">性别</span>
+        <span class="value">
+          <span v-if="form.sex === ''" class="color-999">请选择</span>
+          <span v-else>{{$dict.getLabel('sex', form.sex)}}</span>
+          <img src="./components/img/right-icon.png" alt="">
+        </span>
+      </div>
+    </div>
+    <div class="item">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">出生日期</span>
+        <span class="value">
+          <span :class="form.birthDate == '' ? 'color-999' : ''">{{form.birthDate || '请选择'}}</span>
+          <img src="./components/img/right-icon.png" alt="">
+        </span>
+      </div>
+    </div>
+    <div class="item">
+      <span class="tips"></span>
+      <div class="border">
+        <span class="label">联系电话</span>
+        <span class="value">
+          <input type="text" placeholder="请输入" @input="changePhone" v-model="form.phone" maxlength="11">
+        </span>
+      </div>
+    </div>
+    <div class="item">
+      <span class="tips">*</span>
+      <div class="border">
+        <span class="label">现住址</span>
+        <span class="value">
+          <AiAreaPicker ref="address" class="aiArea" :areaId="user.areaId" :fullName.sync="form.currentAreaName" :value="form.currentAreaId" mode="custom" @select="onCurrentAreaChange">
+            <div class="aiArea">
+              <span class="label" v-if="form.currentAreaName">{{ form.currentAreaName }}</span>
+              <span v-else class="color-999">请选择</span>
+              <img src="./components/img/right-icon.png" alt="">
+            </div>
+          </AiAreaPicker>
+        </span>
+      </div>
+    </div>
+    <div class="item mar-b0">
+      <span class="tips"></span>
+      <div class="border not-border">
+        <span class="label">详细地址</span>
+      </div>
+    </div>
+    <div class="text-area">
+      <textarea placeholder="请输入" maxlength="30" v-model="form.currentAddress"></textarea>
+    </div>
+    <div class="item">
+      <span class="tips"></span>
+      <div class="border">
+        <span class="label">户籍地址</span>
+        <span class="value">
+          <AiAreaPicker ref="address" class="aiArea" :areaId="user.areaId" :fullName.sync="form.householdAreaName" all :value="form.householdAreaId" mode="custom" @select="onHouseAreaChange">
+            <div class="aiArea">
+              <span class="label" v-if="form.householdAreaName">{{ form.householdAreaName }}</span>
+              <span v-else class="color-999">请选择</span>
+              <img src="./components/img/right-icon.png" alt="">
+            </div>
+          </AiAreaPicker>
+        </span>
+      </div>
+    </div>
+    <div class="item mar-b0">
+      <span class="tips"></span>
+      <div class="border not-border">
+        <span class="label">详细地址</span>
+      </div>
+    </div>
+    <div class="text-area">
+      <textarea placeholder="请输入" maxlength="30" v-model="form.householdAddress"></textarea>
+    </div>
+    <div class="pad-b152"></div>
+    <div class="add-btn" @click="submit">
+      <div>保存</div>
+    </div>
+    <u-select v-model="showSelect" :list="selectList" label-name="dictName" value-name="dictValue"  @confirm="confirmSelect"/>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+export default {
+  name: 'add',
+  data() {
+    return {
+      form: {
+        id: '',
+        householdName: '',
+        householdIdNumber: '',
+        householdRelation: '',
+        name: '',
+        idNumber: '',
+        sex: '',
+        birthDate: '',
+        phone: '',
+        currentAreaId: '',
+        currentAreaName: '',
+        currentAddress: '',
+        householdAreaId: '',
+        householdAreaName: '',
+        householdAddress: '',
+        residentType: '',
+        age: ''
+      },
+      showSelect: false,
+      formName: '',
+      selectList: []
+    }
+  },
+  onLoad(options) {
+    this.$dict.load('yesOrNo', 'sex', 'householdRelation', 'nation', 'education', 'maritalStatus', 'politicsStatus', 'militaryStatus', 'faithType', 'residentType').then(() => {
+      if(options.id) {
+        document.title = '编辑居民'
+        this.form.id = options.id
+        this.getDetail()
+      }else {
+        document.title = '新增居民'
+        this.form.residentType = options.type || ''
+      }
+    })
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  methods: {
+    submit() {
+      if(this.form.residentType === '') {
+        return this.$u.toast('请选择居民类型')
+      }
+      if(this.form.householdName === '') {
+        return this.$u.toast('请选择是否户主')
+      }
+      if(this.form.householdName != 1 && !this.form.householdIdNumber) {
+        return this.$u.toast('请输入户主身份证')
+      }
+      if(this.form.householdName != 1 && this.form.householdRelation === '') {
+        return this.$u.toast('请选择与户主关系')
+      }
+      if(!this.form.name) {
+        return this.$u.toast('请输入姓名')
+      }
+      if(!this.form.idNumber) {
+        return this.$u.toast('请输入身份证号')
+      }
+      if(!this.form.sex) {
+        return this.$u.toast('请选择性别')
+      }
+      if(!this.form.birthDate) {
+        return this.$u.toast('请选择出生日期')
+      }
+      if(!this.form.currentAreaId) {
+        return this.$u.toast('请选择现住址')
+      }
+      if(!/[^0]0{0,2}$/.test(this.form.currentAreaId)) {
+        return this.$u.toast('现住址必须选到村级')
+      }
+      if(this.form.householdAreaId && !/[^0]0{0,2}$/.test(this.form.householdAreaId)) {
+        return this.$u.toast('户籍地必须选到村级')
+      }
+      this.form.age =  this.$calcAge(this.form.idNumber)
+      this.$instance.post('/app/appresident/addOrUpdate', this.form).then(res => {
+        if (res.code === 0) {
+          this.$u.toast('新增成功')
+          uni.$emit('reload')
+          uni.navigateBack({
+            delta: 1
+          })
+        }
+      }).catch((err) => {
+        this.$u.toast(err)
+      })
+
+    },
+    confirmSelect(e) {
+      this.form[this.formName] = e[0].value
+    },
+    clickSelect(dictName, formName) {
+      this.selectList = this.$dict.getDict(dictName)
+      this.formName = formName
+      this.showSelect = true
+    },
+    changeIdNumber() {
+      let reg = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
+      if (this.form.idNumber.length == 18 && !reg.test(this.form.idNumber)) {
+        return this.$u.toast('请输入正确的身份证号码')
+      }
+      var info = this.$idCardNoUtil.getIdCardInfo(this.form.idNumber)
+      this.form.birthDate = info.birthday
+      this.form.sex = info.gender
+      console.log(this.form)
+      this.$forceUpdate()
+    },
+
+    changePhone() {
+      let regTel = /^1(3\d|4[5-9]|5[0-35-9]|6[567]|7[0-8]|8\d|9[0-35-9])\d{8}$/
+      if (this.form.phone.length == 11 && !regTel.test(this.form.phone)) {
+        return this.$u.toast('请输入正确的手机号')
+      }
+    },
+
+    onCurrentAreaChange(e) {
+      this.form.currentAreaId = e
+    },
+
+    onHouseAreaChange(e) {
+      this.form.householdAreaId = e
+    },
+
+    getDetail() {
+      this.$instance.post(`/app/appresident/detail?id=${this.form.id}`).then(res => {
+        if (res.code === 0) {
+          this.form = {...res.data.resident}
+          var info = this.$idCardNoUtil.getIdCardInfo(this.form.idNumber)
+          this.form.birthDate = info.birthday
+          this.form.sex = info.gender
+        }
+      })
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.add {
+  .item{
+    width: 100%;
+    padding-left: 14px;
+    background: #FFF;
+    box-sizing: border-box;
+    display: flex;
+    margin-bottom: 16px;
+    .tips{
+      width: 18px;
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #FF4466;
+      line-height: 44px;
+      padding: 34px 0 34px 0;
+    }
+    .border{
+      width: calc(100% - 18px);
+      padding: 34px 32px 34px 0;
+      line-height: 44px;
+      border-bottom: 1px solid #D8DDE6;
+      line-height: 44px;
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #333;
+      display: flex;
+      box-sizing: border-box;
+      .label{
+        width: 170px;
+      }
+      .value{
+        width: calc(100% - 170px);
+        text-align: right;
+        img{
+          width: 32px;
+          height: 32px;
+          margin-left: 8px;
+          vertical-align: middle;
+        }
+      }
+      .color-999{
+        color: #999;
+      }
+    }
+    .not-border{
+      border-bottom: 0;
+    }
+  }
+  .mar-b0{
+    margin-bottom: 0;
+  }
+  .text-area{
+    width: 100%;
+    background-color: #fff;
+    padding: 0 32px;
+    margin-bottom: 16px;
+    box-sizing: border-box;
+    textarea{
+      width: 100%;
+      height: 88px;
+      padding-bottom: 32px;
+    }
+  }
+  .pad-b152{
+    width: 100%;
+    padding-bottom: 152px;
+    background-color: #f5f5f5;
+  }
+  .add-btn{
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    z-index: 999;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    background: #3975C6;
+    font-size: 32px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #FFF;
+    div{
+      text-align: center;
+    }
+  }
+}
+</style>

src/project/new/AppPeopleList/AppPeopleList.vue

@@ -0,0 +1,64 @@
+<template>
+  <div class="AppPeopleList">
+    <div class="banner" v-for="(item, index) in bannerList" :key="index" @click="linkTo(item.linkUrl)">
+      <img :src="item.img" alt="">
+      <p>{{item.title}}</p>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AppPeopleList',
+  appName: '居民档案',
+  data() {
+    return {
+      bannerList: [
+        {
+          img: require('./components/img/blue-bg.png'),
+          title: '查看居民档案',
+          linkUrl: './PeopleList'
+        },
+        {
+          img: require('./components/img/green-bg.png'),
+          title: '居民档案审核',
+          linkUrl: './ExamineList'
+        }
+      ]
+    }
+  },
+  onShow() {
+    document.title = '居民档案'
+  },
+  methods: {
+    linkTo(url) {
+      uni.navigateTo({url})
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppPeopleList{
+  height: 100%;
+  padding-top: 16px;
+  .banner{
+    padding: 32px 40px 0;
+    position: relative;
+    img{
+      width: 100%;
+      height: 228px;
+    }
+    p{
+      position: absolute;
+      top: 120px;
+      left: 88px;
+      font-size: 44px;
+      font-family: PingFang-SC-Heavy, PingFang-SC;
+      font-weight: 800;
+      color: #FFF;
+      line-height: 60px;
+    }
+  }
+}
+</style>

src/project/new/AppPeopleList/Content.vue

@@ -0,0 +1,99 @@
+<template>
+  <div class="Content">
+    <div class="text-area">
+      <div class="title"><span class="tips">*</span>不通过理由</div>
+      <textarea placeholder="请输入" maxlength="200" v-model="opinion"></textarea>
+      <div class="num">{{opinion.length}}/200</div>
+      <!-- <u-input v-model="opinion" type="textarea" placeholder="请输入"  maxlength="500" /> -->
+    </div>
+    <div class="footer" @click="examine(0)">
+      <div class="btn">保存</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Content",
+  data() {
+    return {
+      opinion: '',
+      id: '',
+    };
+  },
+  onShow() {
+    document.title = '居民档案审核'
+  },
+  onLoad(option) {
+    this.id = option.id
+  },
+  methods: {
+    examine(pass) {
+      if(!this.opinion) {
+        return this.$u.toast('请输入不通过理由')
+      }
+      this.$instance.post(`/app/appresident/examine?id=${this.id}&pass=${pass}&opinion=${this.opinion}`).then((res) => {
+        if (res.code == 0) {
+          this.$u.toast('审核成功')
+          uni.$emit('updatePeople')
+          setTimeout(() => {
+            uni.navigateBack({delta: 2})
+          }, 600)
+        }
+      })
+    }
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.Content {
+  .text-area{
+    padding: 34px 32px;
+    background-color: #fff;
+    .title{
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #333;
+      line-height: 44px;
+      margin-bottom: 32px;
+      .tips{
+        font-size: 32px;
+        margin-right: 8px;
+        color: #f46;
+      }
+    }
+    textarea{
+      width: 100%;
+      height: 500px;
+      word-break: break-all;
+    }
+  }
+  .num{
+    text-align: right;
+    color: #999;
+  }
+  .footer {
+    width: 100%;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+  }
+  .btn {
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    background: #3975C6;
+    font-size: 32px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #FFF;
+  }
+  .line-bg {
+    width: 100%;
+    height: 16px;
+    background: #F5F5F5;
+  }
+}
+</style>

src/project/new/AppPeopleList/DetailCard.vue

@@ -0,0 +1,222 @@
+<template>
+  <div class="DetailCard">
+    <div class="top"></div>
+
+    <div class="middle">
+      <div class="hint">家庭地址</div>
+
+      <div class="areaHint">
+        <u-icon name="map-fill" color="#73ABFF"></u-icon>
+        <span>{{resident.currentAreaName}}{{resident.currentAddress || ''}}</span>
+      </div>
+    </div>
+
+    <div class="bottom">
+      <div class="hints">家庭成员 {{ data.family && data.family.length }}人</div>
+
+      <div v-if="data.family && data.family.length > 0">
+        <div class="card" v-for="(item, i) in data.family" :key="i" @click="toDetailPeople(item)">
+          <div class="photos">
+            <img :src="item.photo" alt="" v-if="item.photo" />
+            <img src="./components/img/44.png" alt="" v-else />
+          </div>
+
+          <div class="right">
+            <div class="rightTop">
+              <div class="rightTop-lefts">
+                <span class="names">{{ item.name }}</span>
+                <span class="fileStatuss" v-if="item.fileStatus == 1"> 已注销</span>
+                <span class="householdNames" v-if="item.householdName == 1">户主</span>
+                <span class="householdNames" v-else>
+                  {{ $dict.getLabel('householdRelation', item.householdRelation) }}
+                </span>
+              </div>
+
+              <div class="rightTop-rights">
+                <u-section :show-line="false" sub-title="详情"></u-section>
+              </div>
+            </div>
+
+            <div class="rightBottom">
+              <span>身份证号：</span>
+              <span>{{ item.idNumber.replace(/^(\w{6})\w{8}(.*)$/, '$1********$2') }}</span>
+            </div>
+            <!-- <div class="spacial" v-if="item.idNumber == data.resident.idNumber">
+              <span v-for="(e,index) in spacialList" :key="index">{{e.applicationName}}</span>
+            </div> -->
+          </div>
+        </div>
+      </div>
+
+      <AiEmpty v-else></AiEmpty>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'DetailCard',
+  components: {},
+  props: {},
+  data() {
+    return {
+      id: '',
+      data: [],
+      resident: {},
+      // spacialList: [],
+    }
+  },
+  computed: {},
+  watch: {},
+  onLoad(o) {
+    this.id = o.id
+    this.$dict.load('householdRelation', 'fileStatus').then(() => {
+      this.getDetail()
+    })
+  },
+  onShow() {
+    document.title = '居民档案'
+  },
+  methods: {
+    getDetail() {
+      this.$instance.post(`/app/appresident/detail?id=${this.id}`).then((res) => {
+        if (res.code == 0) {
+          this.data = res.data
+          this.$forceUpdate()
+          this.$nextTick(() => {
+            this.resident = res.data.resident
+            // this.spacialList = res.data.resident.tsrqInfos
+            this.$forceUpdate()
+          })
+        }
+      })
+    },
+
+    toDetailPeople(item) {
+      uni.navigateTo({ url: `./DetailPeople?id=${item.id}&type=0` })
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.DetailCard {
+  height: 100%;
+  .top {
+    height: 112px;
+    background: #3975c6;
+  }
+
+  .middle {
+    margin: -80px 32px 0 32px;
+    padding: 38px 30px 78px 28px;
+    background: #ffffff;
+    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.02);
+    border-radius: 16px;
+    z-index: 999;
+    .hint {
+      font-size: 32px;
+      font-weight: 500;
+      color: #333333;
+    }
+    .areaHint {
+      margin-top: 38px;
+      span {
+        margin-left: 14px;
+      }
+    }
+  }
+
+  .bottom {
+    margin: 32px 30px 48px 30px;
+    background: #fff;
+    padding: 38px 30px 30px 30px;
+    .hints {
+      margin-bottom: 38px;
+    }
+    .card {
+      display: flex;
+      box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.08);
+      border-radius: 16px;
+      padding: 48px 32px;
+      margin-bottom: 32px;
+      .photos {
+        img {
+          width: 96px;
+          height: 96px;
+          border-radius: 50%;
+        }
+      }
+
+      .right {
+        display: flex;
+        flex-direction: column;
+        margin-left: 40px;
+        width: 100%;
+        .rightTop {
+          display: flex;
+          justify-content: space-between;
+          .rightTop-lefts {
+            .names {
+              font-size: 32px;
+              font-weight: 600;
+            }
+            .householdNames {
+              margin-left: 30px;
+              font-size: 26px;
+              font-weight: 500;
+              color: #5aad6a;
+            }
+            .fileStatuss {
+              display: inline-block;
+              margin-left: 30px;
+              color: #ff4466;
+              background: #ffecef;
+              border-radius: 8px;
+              width: 88px;
+              height: 40px;
+              line-height: 40px;
+              text-align: center;
+            }
+          }
+          .rightTop-rights {
+            ::v-deep .u-section {
+              .u-section__right-info {
+                color: #3975c6 !important;
+                .u-section__right-info__icon-arrow {
+                  .u-icon {
+                    .u-icon__icon {
+                      color: #3975c6 !important;
+                    }
+                  }
+                }
+              }
+            }
+          }
+        }
+        .rightBottom {
+          margin-top: 20px;
+        }
+        // .spacial {
+        //   margin-top: 10px;
+        //   white-space: wrap;
+        //   span {
+        //     margin-right: 10px;
+        //     color: #ff4466;
+        //   }
+        // }
+      }
+    }
+    .card:nth-child(2n-1) {
+      // background: royalblue;
+      background: url(http://respub.sinoecare.net/20211222/装饰-20211222162743.png) no-repeat;
+      background-size: 100% 100%;
+    }
+    .card:nth-child(2n) {
+      // background: pink;
+      background: url(http://respub.sinoecare.net/20211222/装饰2-20211222162934.png) no-repeat;
+      background-size: 100% 100%;
+    }
+  }
+}
+</style>

src/project/new/AppPeopleList/DetailPeople.vue

@@ -0,0 +1,404 @@
+<template>
+  <div class="DetailPeople" v-if="data.resident">
+
+    <div class="top">
+      <div class="photos">
+        <img :src="data.resident.photo" alt="" v-if="data.resident && data.resident.photo" />
+        <img src="./components/img/44.png" alt="" v-else />
+      </div>
+
+      <div class="right">
+        <div class="rightTop">
+          <span class="names">{{ data.resident && data.resident.name }}<span v-if="data.resident.fileStatus == 1" class="fileStatuss"> 已注销 </span></span>
+          <span class="householdNames" v-if="data.resident && data.resident.householdName == 1">户主</span>
+          <span class="householdNames" v-else>
+            {{ $dict.getLabel('householdRelation', data.resident && data.resident.householdRelation) }}
+          </span>
+        </div>
+
+        <div class="rightBottom" v-if="data.resident && data.resident.phone">{{ data.resident.phone }}</div>
+      </div>
+    </div>
+
+    <div class="line"></div>
+
+    <div class="tab-list">
+      <div v-for="(item, index) in tabList" :key="index" :class="tabIndex == index ? 'tab-item active' : 'tab-item' " @click="tabIndex=index">
+        <div v-if="index == 0">
+          <img :src="item.activeIcon" alt="" v-if="tabIndex==0">
+          <img :src=" item.icon" alt="" v-if="tabIndex!=0">
+        </div>
+        <div v-if="index != 0">
+          <img src="./components/img/tsrq备份@2x.png" alt="" v-if="tabIndex==index && index != 0">
+          <img src="./components/img/tsrq@2x.png" alt="" v-if="tabIndex!=index && index != 0">
+        </div>
+        
+        <p v-if="index==0">{{item.name}}</p>
+        <p v-else class="type">{{item.applicationName}}</p>
+      </div>
+    </div>
+    <!-- 基本信息 -->
+    <div v-if="tabIndex == 0">
+      <div class="middle">
+      <div class="hint">个人基本信息</div>
+
+      <div class="contents">
+        <div class="item">
+          <span>籍贯</span>
+          <span>{{ data.resident && data.resident.birthplaceAreaName }}</span>
+        </div>
+
+        <div class="item">
+          <span>身份证号</span>
+          <span>{{ data.resident && data.resident.idNumber.replace(/^(\w{6})\w{8}(.*)$/, '$1********$2') }}</span>
+        </div>
+
+        <div class="item">
+          <span>民族</span>
+          <span v-if="data.resident && data.resident.nation"> {{ $dict.getLabel('nation', data.resident.nation) }}</span>
+        </div>
+
+        <div class="item">
+          <span>文化程度</span>
+          <span v-if="data.resident && data.resident.education">{{ $dict.getLabel('education', data.resident.education) }}</span>
+        </div>
+
+        <div class="item">
+          <span>婚姻状况</span>
+          <span v-if="data.resident && data.resident.maritalStatus">{{ $dict.getLabel('maritalStatus', data.resident.maritalStatus) }}</span>
+        </div>
+
+        <div class="item">
+          <span>政治面貌</span>
+          <span v-if="data.resident && data.resident.politicsStatus">{{ $dict.getLabel('politicsStatus', data.resident.politicsStatus) }}</span>
+        </div>
+
+        <div class="item">
+          <span>兵役状况</span>
+          <span v-if="data.resident && data.resident.militaryStatus">{{ $dict.getLabel('militaryStatus', data.resident.militaryStatus) }}</span>
+        </div>
+
+        <div class="item">
+          <span>宗教信仰</span>
+          <span v-if="data.resident && data.resident.faithType">{{ $dict.getLabel('faithType', data.resident.faithType) }}</span>
+        </div>
+
+        <div class="item">
+          <span>职业</span>
+          <span v-if="data.resident && data.resident.job">{{ $dict.getLabel('job', data.resident.job) }}</span>
+        </div>
+      </div>
+    </div>
+
+    <div class="lines"></div>
+
+    <div class="bottom">
+      <div class="hint">联络信息</div>
+
+      <div class="contents">
+        <div class="item">
+          <span>联系方式</span>
+          <span class="phones" v-if="data.resident && data.resident.phone" @click="callPhone(data.resident.phone)">{{ data.resident.phone }}</span>
+        </div>
+
+        <div class="item">
+          <span class="label">现住址</span>
+          <span class="value" v-if="data.resident && data.resident.currentAreaName">{{ data.resident.currentAreaName }}</span>
+        </div>
+
+        <div class="item">
+          <span class="label">现住详细地址</span>
+          <span class="value" v-if="data.resident && data.resident.currentAddress">{{ data.resident.currentAddress }}</span>
+        </div>
+
+        <div class="item">
+          <span class="label">户籍地址</span>
+          <span class="value" v-if="data.resident && data.resident.householdAreaName">{{ data.resident.householdAreaName }}</span>
+        </div>
+
+        <div class="item">
+          <span class="label">户籍详细地址</span>
+          <span class="value" v-if="data.resident && data.resident.householdAddress">{{ data.resident.householdAddress }}</span>
+        </div>
+
+        <div class="item" v-if="type == 1 && data.resident.auditStatus != 0">
+          <span class="label">处理结果</span>
+          <span class="value">{{ data.resident.auditStatus == 1 ? '通过' : '不通过' }}</span>
+        </div>
+
+        <div class="item"  v-if="type == 1 && data.resident.auditStatus != 0">
+          <span class="label">原因</span>
+        </div>
+        <div class="item">{{data.resident.auditOpinion || ''}}</div>
+      </div>
+    </div>
+    </div>
+    <!-- 特殊人群 -->
+    <div v-if="tabIndex != 0 &&  tabList &&  tabList.length">
+      <div class="spacial" v-for="(item,index) in tabList" :key="index" v-if="tabIndex == index">
+        <div class="specialList" v-for="(t,indexs) in item.tableInfos" :key="indexs" v-if="item.tableInfos && item.tableInfos.length">
+          <div class="spacial-row">
+            <div>{{ t.fieldName }}</div>
+            <div>{{ t.fieldValue }}</div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="pad-b112" v-if="data.resident.auditStatus == 0 && type == 1"></div>
+    <div class="footer" v-if="data.resident.auditStatus == 0 && type == 1">
+      <div @click="toContent">不通过</div>
+      <div class="pass" @click="examine(1)">通过</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'DetailPeople',
+  components: {},
+  props: {},
+  data() {
+    return {
+      id: '',
+      data: [],
+      type: 0, //0查看详情  1审核详情
+      tabList:[],
+      tabIndex: 0,
+    }
+  },
+  computed: {},
+  watch: {},
+  onLoad(o) {
+    this.id = o.id
+    this.type = o.type
+    this.$dict.load('householdRelation', 'nation', 'education', 'maritalStatus', 'politicsStatus', 'militaryStatus', 'faithType', 'job', 'fileStatus').then(() => {
+      this.getDetail()
+    })
+    uni.$on('updatePeople', res => {
+      this.getDetail()
+    })
+  },
+  onShow() {
+    document.title = '家庭成员信息'
+  },
+  methods: {
+    getDetail() {
+      this.$instance.post(`/app/appresident/detail?id=${this.id}`).then((res) => {
+        if (res.code == 0) {
+          this.data = res.data
+          if (res.data.resident.tsrqInfos) {
+          this.tabList = res.data.resident.tsrqInfos
+          let info = {
+            icon: require('./components/img/icon1n@2x.png'),
+            activeIcon:  require('./components/img/icon1h@2x.png'),
+            name: '基本信息',
+          }
+          this.tabList.unshift(info)
+          } else {
+            this.tabList =[{
+              icon: require('./components/img/icon1n@2x.png'),
+              activeIcon:  require('./components/img/icon1h@2x.png'),
+              name: '基本信息',
+            }]
+          }
+        }
+      })
+    },
+    callPhone(phone) {
+      uni.makePhoneCall({ phoneNumber: phone })
+    },
+    examine(pass) {
+      this.$confirm('确认通过该审核？').then(() => {
+        this.$instance.post(`/app/appresident/examine?id=${this.id}&pass=${pass}`).then((res) => {
+          if (res.code == 0) {
+            uni.$emit('updatePeople')
+            this.$u.toast('审核成功')
+            setTimeout(() => {
+              uni.navigateBack()
+            }, 600)
+          }
+        })
+      })
+      
+    },
+    toContent() {
+      uni.navigateTo({url: `./Content?id=${this.id}`})
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.DetailPeople {
+  height: 100%;
+  background: #fff;
+  .top {
+    display: flex;
+    padding: 48px 32px 32px 32px;
+    .photos {
+      img {
+        width: 112px;
+        height: 112px;
+        border-radius: 50%;
+      }
+    }
+    .right {
+      display: flex;
+      flex-direction: column;
+      width: 100%;
+      margin-left: 24px;
+      .rightTop {
+        display: flex;
+        justify-content: space-between;
+        .fileStatuss {
+          display: inline-block;
+          margin-left: 30px;
+          color: #ff4466;
+          background: #ffecef;
+          border-radius: 8px;
+          width: 120px;
+          height: 40px;
+          line-height: 40px;
+          text-align: center;
+          font-weight: 400;
+          font-size: 28px;
+        }
+        .names {
+          font-size: 32px;
+          font-weight: 600;
+        }
+        .householdNames {
+          margin-left: 30px;
+          font-size: 26px;
+          font-weight: 500;
+          color: #5aad6a;
+        }
+      }
+      .rightBottom {
+        margin-top: 16px;
+      }
+    }
+  }
+
+  .tab-list{
+  padding-top: 32px;
+  display: flex;
+  word-wrap: nowrap;
+  overflow-x: scroll;
+  -webkit-overflow-scrolling: touch;
+  .tab-item{
+    display: inline-block;
+    width: 148px;
+    height: 136px;
+    background-color: #F8F9FB;
+    border-radius: 8px;
+    text-align: center;
+    margin-left: 32px;
+    img{
+      width: 40px;
+      height: 40px;
+      margin-top: 30px;
+    }
+    p{
+      font-size: 22px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #C5C9CD;
+      line-height: 32px;
+      margin-top: 8px;
+    }
+  }
+  .type {
+    padding: 0 10px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space:nowrap;
+  }
+  .active{
+    background-color: #357CE3;
+    p{
+      color: #fff;
+    }
+  }
+}
+
+  .line {
+    height: 8px;
+    background: #f5f5f5;
+  }
+
+  .middle,
+  .bottom {
+    padding: 0 32px;
+
+    .hint {
+      font-weight: 600;
+      padding: 32px 0;
+    }
+
+    .contents {
+      .item {
+        display: flex;
+        justify-content: space-between;
+        padding: 14px 0;
+        .phones {
+          color: #3d94fb;
+        }
+        .label{
+          width: 200px;
+        }
+        .value{
+          width: calc(100% - 200px);
+          text-align: right;
+          word-break: break-all;
+        }
+      }
+    }
+  }
+
+  .lines {
+    height: 4px;
+    background: #f5f5f5;
+  }
+
+  .spacial {
+    margin-top: 30px;
+    .specialList {
+      padding: 14px 32px;
+      .spacial-row {
+        display: flex;
+        justify-content: space-between;
+      }
+    }
+  }
+
+  .pad-b112{
+    padding-bottom: 112px;
+    background-color: #f5f5f5;
+  }
+  .footer {
+    width: 100%;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    z-index: 99999;
+    display: flex;
+    font-size: 32px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    div{
+      flex: 1;
+      background: #fff;
+      color: #FF4466;
+    }
+
+    .pass {
+      background: #1365DD;
+      color: #FFF;
+    }
+  }
+}
+</style>

src/project/new/AppPeopleList/ExamineList.vue

@@ -0,0 +1,276 @@
+<template>
+  <div class="ExamineList">
+    <AiTopFixed>
+      <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#3975C6" inactive-color="#CDDCF0" bar-width="48" active-color="#fff " @change="change"></u-tabs>
+      <div class="middle">
+        <div class="left">
+          <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect" :name.sync="areaName" style="color: #666">
+            <u-icon name="map-fill" color="#3192F4" size="20px" style="vertical-align: text-bottom"></u-icon>
+            <span style="margin-left: 4px" v-if="areaName">{{ areaName }}</span>
+            <span v-else>请选择</span>
+            <u-icon name="arrow-down" color="#666" size="28" style="margin-left: 4px" />
+          </AiAreaPicker>
+        </div>
+        <u-search v-model="keyword" :clearabled="true" placeholder="姓名/联系方式/身份证后6位" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="handerSearch" @clear="handerClear"></u-search>
+      </div>
+    </AiTopFixed>
+    <div v-if="datas && datas.length > 0" class="list-content">
+      <div class="card" v-for="(item, i) in datas" :key="i" @click="toDetailPeople(item)">
+        <div class="photos">
+          <img :src="item.photo" alt="" v-if="item.photo" />
+          <img src="./components/img/44.png" alt="" v-else />
+        </div>
+        <div class="right">
+          <div class="rightTop">
+            <div class="rightTop-lefts">
+              <span class="names">{{ item.name }}</span>
+              <span class="fileStatuss" v-if="item.fileStatus == 1"> {{ $dict.getLabel('fileStatus', item.fileStatus) }}</span>
+              <span class="householdNames" v-if="item.householdName == 1">户主</span>
+              <span class="householdNames" v-else>非户主</span>
+              <span class="audit-status" :class="'status'+item.auditStatus">{{ $dict.getLabel('auditStatus', item.auditStatus) }}</span>
+            </div>
+
+            <div class="rightTop-rights">
+              <u-section :show-line="false" sub-title="详情"></u-section>
+            </div>
+          </div>
+
+          <div class="rightBottom">
+            <span>身份证号：</span>
+            <span>{{ item.idNumber.replace(/^(\w{6})\w{8}(.*)$/, '$1********$2') }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <AiEmpty v-else></AiEmpty>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+export default {
+  name: 'ExamineList',
+  components: {},
+  props: {},
+  data() {
+    return {
+      id: '',
+      datas: [],
+      resident: {},
+      areaId: '',
+      areaName: '',
+      tabList: [
+        {
+          name: '待处理',
+        },
+        {
+          name: '已处理',
+        },
+      ],
+      currentTabs: 0,
+      keyword: ''
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  onLoad() {
+    this.areaId = this.user.areaId
+    this.areaName = this.user.areaName
+    this.$dict.load('householdRelation', 'auditStatus').then(() => {
+      this.getList()
+    })
+    uni.$on('updatePeople', () => {
+      this.getListInit()
+    })
+  },
+  onShow() {
+    document.title = '居民档案审核'
+  },
+  methods: {
+    getListInit() {
+      this.current = 1
+      this.datas = []
+      this.getList()
+    },
+    getList() {
+      var auditType = 0 // 0待处理; 2已处理
+      if(this.currentTabs == 1) {
+        auditType = 2
+      }
+      this.$instance.post('/app/appresident/list', null, {
+        params: {
+          size: 10,
+          current: this.current,
+          con: this.keyword,
+          areaId: this.areaId,
+          auditType,
+          source: 1
+        },
+      })
+      .then((res) => {
+        if (res.code == 0) {
+          this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records
+
+          this.pages = res.data.pages
+        }
+      })
+    },
+
+    change(index) {
+      this.currentTabs = index
+      this.getListInit()
+    },
+
+    toDetailPeople(item) {
+      uni.navigateTo({ url: `./DetailPeople?id=${item.id}&type=1` })
+    },
+
+    areaSelect(e) {
+      this.areaId = e
+      this.getListInit()
+    },
+
+    handerSearch(e) {
+      this.keyword = e
+      this.getListInit()
+    },
+
+    handerClear() {
+      this.keyword = ''
+      this.getListInit()
+    },
+  },
+  onReachBottom() {
+    this.current = this.current + 1
+    this.getList()
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.ExamineList {
+  height: 100%;
+  .list-content{
+    padding: 0 60px;
+    background-color: #fff;
+  }
+  .card {
+    display: flex;
+    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.08);
+    border-radius: 16px;
+    padding: 48px 32px;
+    margin-bottom: 32px;
+    background: url(http://respub.sinoecare.net/20211222/装饰2-20211222162934.png) no-repeat;
+    background-size: 100% 100%;
+    .photos {
+      img {
+        width: 96px;
+        height: 96px;
+        border-radius: 50%;
+      }
+    }
+
+    .right {
+      display: flex;
+      flex-direction: column;
+      margin-left: 40px;
+      width: 100%;
+      .rightTop {
+        display: flex;
+        justify-content: space-between;
+        .rightTop-lefts {
+          width: calc(100% - 100px);
+          .names {
+            font-size: 32px;
+            font-weight: 600;
+            word-break: break-all;
+          }
+          .householdNames {
+            margin-left: 30px;
+            font-size: 26px;
+            font-weight: 500;
+            color: #5aad6a;
+            display: inline-block;
+            width: 100px;
+          }
+          .fileStatuss {
+            display: inline-block;
+            margin-left: 30px;
+            color: #ff4466;
+            background: #ffecef;
+            border-radius: 8px;
+            width: 88px;
+            height: 40px;
+            line-height: 40px;
+            text-align: center;
+          }
+        }
+        .rightTop-rights {
+          width: 100px;
+          ::v-deep .u-section {
+            .u-section__right-info {
+              color: #3975c6 !important;
+              .u-section__right-info__icon-arrow {
+                .u-icon {
+                  .u-icon__icon {
+                    color: #3975c6 !important;
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+      .rightBottom {
+        margin-top: 20px;
+      }
+    }
+  }
+  .middle {
+    display: flex;
+    padding: 24px 32px;
+    .left {
+      width: 220px;
+      display: flex;
+      align-items: center;
+
+      img {
+        width: 48px;
+        height: 48px;
+      }
+    }
+    .u-search {
+      margin-bottom: 0 !important;
+    }
+  }
+
+  ::v-deep .content{
+    padding: 0;
+  }
+
+  .audit-status{
+    display: inline-block;
+    padding: 0 8px;
+    line-height: 40px;
+    background: #EAF0FE;
+    border-radius: 8px;
+    font-size: 24px;
+    font-family: PingFangSC-Regular, PingFang SC;
+  }
+  .status1{
+    color: #3E95FF;
+    background-color: #EAF0FE;
+  }
+  .status0{
+    color: #5AAD6A;
+    background-color: #E9FFED;
+  }
+  .status2{
+    color: #f46;
+    background-color: #FFECEF;
+  }
+
+}
+</style>

src/project/new/AppPeopleList/PeopleList.vue

@@ -0,0 +1,320 @@
+<template>
+  <div class="PeopleList">
+    <AiTopFixed>
+      <div class="areatop">
+        <!-- <div>区域选择</div>
+        <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="seachObj"></AiAreaPicker>
+        <u-icon name="photo"></u-icon> -->
+        <!-- @select="areaSelect" -->
+        <u-form label-width="auto">
+          <u-form-item label="区域选择" right-icon="arrow-right" class="areaIds">
+            <AiAreaPicker v-model="areaId" :areaId="user.areaId" @input="seachObj" :name.sync="areaName" selectRoot/>
+          </u-form-item>
+        </u-form>
+      </div>
+
+      <div class="line"></div>
+
+      <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" @change="change"></u-tabs>
+
+      <div class="seachObjs">
+        <u-search v-model="keyword" :clearabled="true" placeholder="姓名/联系方式/身份证后6位" :show-action="false"
+                  bg-color="#F5F5F5" search-icon-color="#E2E8F1" color="#666" height="58" @search="handerSearch"
+                  @clear="handerClear"></u-search>
+      </div>
+    </AiTopFixed>
+    <div class="dataes" v-if="datas.length > 0">
+      <div class="datass" v-for="(item, iindex) in datas" :key="iindex" @click="toDetailCard(item)">
+        <div class="left">
+          <img :src="item.photo" alt="" v-if="item.photo"/>
+          <img src="./components/img/4.png" alt="" v-else/>
+        </div>
+
+        <div class="right">
+          <div class="rightTop">
+            <span class="name">{{ item.name }}</span>
+            <span class="btn" v-if="user.id == item.createUserId">
+              <img src="./components/img/edit-icon.png" alt="" @click.stop="edit(item.id)">
+              <img src="./components/img/del-icon.png" alt="" @click.stop="del(item.id)">
+            </span>
+          </div>
+          <div class="rightBottom">
+            <span>{{ item.idNumber.replace(/^(\w{6})\w{8}(.*)$/, '$1********$2') }}</span>
+
+            <span>{{ item.phone }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="empty" v-else>
+      <img src="https://cdn.cunwuyun.cn/dvcp/h5/no-data.png" alt="">
+      <p>暂无居民信息<br/>点击<span @click="edit('')">新增按钮</span>新增居民信息,也可在管理系统批量导入</p>
+    </div>
+    <!-- <AiEmpty class="emptyWrap" v-else></AiEmpty> -->
+    <div style="height: 60px"></div>
+    <div class="addBtn" @click="edit('')">新增居民</div>
+  </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+
+export default {
+  name: 'PeopleList',
+  props: {},
+  data() {
+    return {
+      keyword: '',
+      datas: [],
+      current: 1,
+      size: 10,
+      tabList: [
+        {
+          name: '全部居民',
+        },
+        {
+          name: '本地居民',
+        },
+        {
+          name: '流动人员',
+        },
+      ],
+      currentTabs: 0,
+      areaId: '',
+      areaName: '',
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  watch: {},
+  onLoad() {
+    this.areaId = this.user.areaId
+    this.areaName = this.user.areaName
+    uni.$on('reload', () => {
+      this.current = 1
+      this.getList()
+    })
+    this.getList()
+  },
+  onShow() {
+    document.title = '查看居民档案'
+  },
+  methods: {
+    getList() {
+      var residentType = ['', 0, 1][this.currentTabs]
+      this.$instance
+      .post('/app/appresident/list', null, {
+        params: {
+          size: 20,
+          current: this.current,
+          con: this.keyword,
+          areaId: this.areaId,
+          residentType: residentType,
+          auditStatus: 1
+        },
+      })
+      .then((res) => {
+        if (res.code == 0) {
+          this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records
+
+          this.pages = res.data.pages
+        }
+      })
+    },
+
+    change(index) {
+      this.currentTabs = index
+      this.current = 1
+      this.datas = []
+      this.getList()
+    },
+
+    toDetailCard(item) {
+      uni.navigateTo({url: `./DetailCard?id=${item.id}`})
+    },
+
+    seachObj(e) {
+      this.areaId = e
+      this.current = 1
+      this.getList()
+    },
+
+    handerSearch(e) {
+      this.keyword = e
+      this.current = 1
+      this.getList()
+    },
+
+    handerClear() {
+      this.keyword = ''
+      this.current = 1
+      this.getList()
+    },
+    edit(id) {
+      var residentType = ['', 0, 1][this.currentTabs]
+      uni.navigateTo({url: `./Add?id=${id}&type=${residentType}`})
+    },
+    del(id) {
+      this.$confirm('确定删除该数据?').then(() => {
+        uni.showLoading()
+        this.$instance.post(`/app/appresident/delete?ids=${id}`).then((res) => {
+          if (res.code == 0) {
+            this.$u.toast('删除成功！')
+            this.current = 1
+            this.getList()
+          }
+          uni.hideLoading()
+        })
+      }).catch(() => {
+      })
+    }
+  },
+  onReachBottom() {
+    this.current = this.current + 1
+    this.getList()
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.PeopleList {
+  height: 100%;
+
+  .areatop {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .line {
+    height: 16px;
+    background: #f5f5f5;
+  }
+
+  .seachObjs {
+    border-bottom: 2px solid #f5f5f5;
+    border-top: 2px solid #f5f5f5;
+    padding: 20px 32px;
+    background: #fff;
+  }
+
+  ::v-deep .u-form {
+    width: 100%;
+
+    .areaIds {
+      .u-form-item__body {
+        .u-form-item--right {
+          .u-form-item--right__content {
+            display: flex;
+            align-items: center;
+
+            .u-form-item--right__content__slot {
+              .AiAreaPicker {
+                width: 100%;
+                display: flex;
+                justify-content: flex-end;
+
+                .areaSelector {
+                  .location {
+                    opacity: 0;
+                  }
+                }
+              }
+            }
+
+            .u-form-item--right__content__icon {
+              margin-bottom: 8px;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .dataes {
+    background: #fff;
+
+    .datass {
+      display: flex;
+      padding: 24px 32px;
+
+      .left {
+        img {
+          width: 80px;
+          height: 80px;
+          border-radius: 50%;
+        }
+      }
+
+      .right {
+        display: flex;
+        flex-direction: column;
+        margin-left: 32px;
+        width: 100%;
+
+        .rightTop {
+          font-size: 32px;
+          font-weight: 500;
+          color: #333333;
+          display: flex;
+          justify-content: space-between;
+
+          .btn {
+            img {
+              width: 48px;
+              height: 48px;
+              margin-left: 40px;
+            }
+          }
+        }
+
+        .rightBottom {
+          display: flex;
+          justify-content: space-between;
+          margin-top: 8px;
+        }
+      }
+    }
+  }
+
+  .emptyWrap {
+    background: #f5f5f5;
+    margin: 0;
+  }
+
+  .addBtn {
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    background: #1365DD;
+    text-align: center;
+    color: #FFF;
+    font-size: 32px;
+    position: fixed;
+    bottom: 0;
+  }
+
+  .empty {
+    height: 100%;
+
+    img {
+      width: 282px;
+      height: 306px;
+      margin: 168px 0 0 234px;
+    }
+
+    p {
+      text-align: center;
+      font-size: 28px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #999;
+      line-height: 44px;
+
+      span {
+        color: #467DFE;
+      }
+    }
+  }
+}
+</style>