diff --git a/src/components/AiGap.vue b/src/components/AiGap.vue
new file mode 100644
index 00000000..611bf111
--- /dev/null
+++ b/src/components/AiGap.vue
@@ -0,0 +1,28 @@
+<template>
+  <section class="AiGap" :style="{height,width}"/>
+</template>
+
+<script>
+export default {
+  name: "AiGap",
+  props: {
+    h: {default: 30},
+    w: {default: '100%'}
+  },
+  computed: {
+    height() {
+      let {h} = this
+      return /\d/.test(h) ? `${h}rpx` : h
+    },
+    width() {
+      let {w} = this
+      return /\d/.test(w) ? `${w}rpx` : w
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiGap {
+}
+</style>
diff --git a/src/components/AiItem.vue b/src/components/AiItem.vue
index cf5be5a1..ab58679b 100644
--- a/src/components/AiItem.vue
+++ b/src/components/AiItem.vue
@@ -1,8 +1,8 @@
 <template>
-  <section class="AiItem">
+  <section class="AiItem" :class="{border}">
     <div v-if="topLabel" class="topLabel">
       <div class="labelPane" flex>
-        <div class="label" :class="{required}" v-text="label"/>
+        <div class="label" :class="{required,labelBold}" v-text="label"/>
         <slot name="sub" v-if="$slots.sub"/>
       </div>
       <div class="content">
@@ -12,11 +12,13 @@
     </div>
     <div v-else class="normal" flex>
       <div class="fill" flex>
-        <div class="label" :class="{required}" v-text="label"/>
+        <div class="label" :class="{required,labelBold}" v-text="label"/>
         <slot name="sub" v-if="$slots.sub"/>
       </div>
-      <slot v-if="$slots.default"/>
-      <div v-else v-text="value"/>
+      <div class="flexContent">
+        <slot v-if="$slots.default"/>
+        <div v-else v-text="value"/>
+      </div>
     </div>
   </section>
 </template>
@@ -28,7 +30,9 @@ export default {
     value: {default: ""},
     label: {default: ""},
     required: Boolean,
-    topLabel: Boolean
+    topLabel: Boolean,
+    border: {default: true},
+    labelBold: Boolean
   },
   data() {
     return {}
@@ -40,12 +44,25 @@ export default {
 .AiItem {
   font-family: PingFangSC-Regular, PingFang SC;
 
+  .border {
+    .normal {
+      border-bottom: 2px solid #ddd;
+    }
+
+    .topLabel {
+      border-bottom: 2px solid #ddd;
+    }
+  }
+
   .normal {
     width: 100%;
-    border-bottom: 2px solid #ddd;
     padding-right: 32px;
     box-sizing: border-box;
     height: 112px;
+
+    .flexContent {
+      max-width: 62vw;
+    }
   }
 
   .label {
@@ -64,11 +81,15 @@ export default {
       content: "*";
       color: #f46;
     }
+
+    &.labelBold {
+      font-weight: bold;
+      font-size: 34px;
+    }
   }
 
-  .topLabel {
+  ::v-deep.topLabel {
     padding: 32px 32px 32px 0;
-    border-bottom: 2px solid #ddd;
 
     .labelPane {
       margin-bottom: 32px;
@@ -76,6 +97,10 @@ export default {
 
     .content {
       padding-left: 20px;
+
+      .AiMore > .u-icon {
+        width: 100%;
+      }
     }
   }
 }
diff --git a/src/components/AiPagePicker.vue b/src/components/AiPagePicker.vue
index f35a0f19..76ba8271 100644
--- a/src/components/AiPagePicker.vue
+++ b/src/components/AiPagePicker.vue
@@ -28,7 +28,7 @@ export default {
     return {
       configList: {
         resident: {url: "/components/pages/selectResident", label: "name"},
-        sysUser:{url: "/components/pages/selectSysUser", label: "name"},
+        sysUser: {url: "/components/pages/selectSysUser", label: "name"},
         gird: {url: "/components/pages/selectGird", label: "girdName"},
         party: {url: "/components/pages/selectParty", label: "name"},
         custom: {...this.ops}
@@ -56,7 +56,7 @@ export default {
       })
       let url = `${config.url}`,
           qsstr = qs.stringify({
-            selected, ...this.$attrs
+            selected, nodeKey, ...this.$attrs
           })
       if (!!qsstr) {
         url += `?${qsstr}`
diff --git a/src/components/AiPhone.vue b/src/components/AiPhone.vue
new file mode 100644
index 00000000..9a91388d
--- /dev/null
+++ b/src/components/AiPhone.vue
@@ -0,0 +1,30 @@
+<template>
+  <section class="AiPhone">
+    <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(phone)" class="phone-icon" v-if="phone"/>
+  </section>
+</template>
+
+<script>
+export default {
+  name: "AiPhone",
+  props: {
+    phone: {default: ""}
+  },
+  methods: {
+    callPhone(phoneNumber) {
+      uni.makePhoneCall({phoneNumber})
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.AiPhone {
+  .phone-icon {
+    width: 40px;
+    height: 40px;
+    vertical-align: sub;
+    margin-left: 16px;
+  }
+}
+</style>
diff --git a/src/components/pages/selectSysUser.vue b/src/components/pages/selectSysUser.vue
index 33cb52bb..e990c10c 100644
--- a/src/components/pages/selectSysUser.vue
+++ b/src/components/pages/selectSysUser.vue
@@ -48,6 +48,9 @@ export default {
     ...mapState(['user']),
     isSingle() {
       return this.$route.query.single
+    },
+    nodeKey() {
+      return this.$route.query.nodeKey || "idNumber"
     }
   },
   onLoad(query) {
@@ -67,7 +70,7 @@ export default {
           if (res?.data) {
             this.total = res.data.pages || 0
             res.data.records.forEach(e => {
-              e.isCheck = this.selected.includes(e.idNumber)
+              e.isCheck = this.selected.includes(e[this.nodeKey])
             })
             this.list = [current == 1 ? [] : this.list, res.data.records || []].flat()
           }
diff --git a/src/project/grid/AppGridManagement/AddGird.vue b/src/project/grid/AppGridManagement/AddGird.vue
index eeb2a5da..f9976143 100644
--- a/src/project/grid/AppGridManagement/AddGird.vue
+++ b/src/project/grid/AppGridManagement/AddGird.vue
@@ -1,42 +1,31 @@
 <template>
   <div class="AddGird">
-    <div class="item-flex">
-      <div class="label">
-        <span class="tips">*</span>网格名称
-      </div>
-      <div class="value">
-        <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="form.girdName" maxlength="50" />
-      </div>
-    </div>
-    <div class="item-flex">
-      <div class="label">
-        <span class="tips"></span>网格长
-      </div>
-      <div class="value" @click="toAddUser('manage')">
-        
-        <span v-if="form.girdMemberManageList && form.girdMemberManageList.length">
-          <span v-for="(item, index) in form.girdMemberManageList" :key="index"><span v-if="index>0">,</span>{{item.name}}</span>
-        </span>
-        <span style="color:#999;" v-else>请选择</span>
-        <img src="./components/img/right-icon.png" alt="" /></div>
-    </div>
-    <div class="item-flex" v-if="form.girdLevel == 2">
-      <div class="label">
-        <span class="tips"></span>网格员
-      </div>
-      <div class="value" @click="toAddUser('Member')">
-        <span v-if="form.girdMemberList && form.girdMemberList.length">
-          <span v-for="(item, index) in form.girdMemberList" :key="index"><span v-if="index>0">,</span>{{item.name}}</span>
-        </span>
-        <span style="color:#999;" v-else>请选择</span>
-        <img src="./components/img/right-icon.png" alt="" />
-      </div>
-    </div>
-    <div class="footer" @click="confirm">确认添加</div>
+    <AiGroup>
+      <AiItem label="网格名称" required>
+        <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="form.girdName"
+                 maxlength="50"/>
+      </AiItem>
+    </AiGroup>
+    <AiGroup>
+      <AiItem label="网格长" topLabel>
+        <AiPagePicker type="sysUser" :selected.sync="form.girdMemberManageList" action="/app/wxcp/wxuser/list?status=1" nodeKey="id">
+          <AiMore :value="getArrayLabel(form.girdMemberManageList)"/>
+        </AiPagePicker>
+      </AiItem>
+    </AiGroup>
+    <AiGroup>
+      <AiItem label="网格员" topLabel>
+        <AiPagePicker type="sysUser" :selected.sync="form.girdMemberList" action="/app/wxcp/wxuser/list?status=1" nodeKey="id">
+          <AiMore :value="getArrayLabel(form.girdMemberList)"/>
+        </AiPagePicker>
+      </AiItem>
+    </AiGroup>
+    <div class="footer" @click="confirm">{{ fromType == 'add' ? '确认添加' : '确认修改' }}</div>
   </div>
 </template>
 
 <script>
+
 export default {
   data() {
     return {
@@ -47,98 +36,71 @@ export default {
       },
       detailInfo: {},
       fromType: 'add', //add新增 edit编辑,
-      addUserType: 'manage', //manage网格长 Member管理员
     }
-  },
-  methods: {
-   
   },
   onLoad(option) {
     this.id = option.id
     this.fromType = option.fromType
     this.getDetail()
-    uni.$on('selectUser', res => {
-      if(this.addUserType == 'manage') {
-        this.form.girdMemberManageList = res
-      }else {
-        this.form.girdMemberList = res
-      }
-    })
   },
   onShow() {
-    document.title = '添加网格'
+    if (this.fromType == 'add') {
+      document.title = '添加网格'
+    } else {
+      document.title = '编辑网格'
+    }
   },
   methods: {
     getDetail() {
       this.$http.post(`/app/appgirdinfo/queryDetailById?id=${this.id}`).then((res) => {
-        if (res.code == 0) {
+        if (res?.data) {
           this.detailInfo = res.data
-          if(this.fromType == 'edit') {
+          if (this.fromType == 'edit') {
             this.form = res.data
           }
-          if(this.fromType == 'add') {
+          if (this.fromType == 'add') {
             this.form.parentGirdId = this.detailInfo.id
             this.form.parentGirdName = this.detailInfo.girdName
-            this.form.girdLevel = Number(this.detailInfo.girdLevel)+1
-            this.form.girdType = Number(this.detailInfo.girdType)+1
-            this.form.isLastLevel = this.form.girdLevel == 2 ? '1' : '0'
             this.$forceUpdate()
           }
         }
       })
     },
-    toAddUser(type) {
-      this.addUserType = type
-      var selectUserList = []
-      if(type == 'manage') {
-        selectUserList = this.form.girdMemberManageList
-      }else {
-        selectUserList = this.form.girdMemberList
-      }
-      uni.setStorageSync('selectUserList', selectUserList)
-      uni.navigateTo({url: `./SelectUser`})
-    },
     confirm() {
-      if(!this.form.girdName){
+      if (!this.form.girdName) {
         return this.$u.toast('请输入网格名称')
       }
-
-      var girdMemberManageList = []
-      if(this.form.girdMemberManageList && this.form.girdMemberManageList.length) {
-        girdMemberManageList = this.form.girdMemberManageList.map((item) => {
-          return {
-            wxUserId: item.id,
-            phone: item.mobile,
-            photo: item.avatar,
-            name: item.name
-          }
-        })
-      }
-
-      var girdMemberList = []
-      if(this.form.girdMemberList && this.form.girdMemberList.length) {
-        girdMemberList = this.form.girdMemberList.map((item) => {
-          return {
-            wxUserId: item.id,
-            phone: item.mobile,
-            photo: item.avatar,
-            name: item.name
-          }
-        })
-      }
-      
+      let girdMemberManageList = this.form.girdMemberManageList?.map((item) => {
+        return {
+          wxUserId: item.id,
+          phone: item.mobile,
+          photo: item.avatar,
+          name: item.name
+        }
+      })
+      let girdMemberList = this.form.girdMemberList?.map((item) => {
+        return {
+          wxUserId: item.id,
+          phone: item.mobile,
+          photo: item.avatar,
+          name: item.name
+        }
+      })
       this.$http.post(`/app/appgirdinfo/addOrUpdateByEw`, {...this.form, girdMemberManageList, girdMemberList}).then((res) => {
-        if (res.code == 0) {
+        if (res?.code == 0) {
           this.$u.toast('提交成功')
           uni.$emit('update')
           setTimeout(() => {
-            uni.navigateBack()
+            uni.navigateBack({})
           }, 600)
         }
       }).catch((err) => {
         this.$u.toast(err)
       })
 
+    },
+    getArrayLabel(arr, key = 'name', separation = '，') {
+      return arr?.map(e => e[key])?.join(separation)
     }
   }
 }
@@ -146,42 +108,47 @@ export default {
 
 <style lang="scss" scoped>
 .AddGird {
-  .item-flex{
+  .item-flex {
     display: flex;
     padding: 34px 32px;
     background-color: #fff;
     font-size: 32px;
     font-family: PingFangSC-Regular, PingFang SC;
     margin-bottom: 16px;
-    .label{
+
+    .label {
       font-weight: 400;
       color: #333333;
       line-height: 22px;
       width: 150px;
-      .tips{
+
+      .tips {
         display: inline-block;
         width: 16px;
         color: #F46;
         line-height: 44px;
       }
     }
-    .value{
+
+    .value {
       width: calc(100% - 150px);
       line-height: 44px;
       text-align: right;
       color: #666;
-      img{
-        width: 32px;
-        height: 32px;
+
+      img {
+        width: 44px;
+        height: 44px;
         vertical-align: middle;
-        margin-left: 8px;
       }
     }
-    .color-999{
+
+    .color-999 {
       color: #999;
     }
   }
-  .footer{
+
+  .footer {
     width: 100%;
     height: 112px;
     line-height: 112px;
diff --git a/src/project/grid/AppGridManagement/AppGridManagement.vue b/src/project/grid/AppGridManagement/AppGridManagement.vue
index 25cee7e2..a30f9df6 100644
--- a/src/project/grid/AppGridManagement/AppGridManagement.vue
+++ b/src/project/grid/AppGridManagement/AppGridManagement.vue
@@ -1,24 +1,26 @@
 <template>
   <div class="AppGridManagement">
-    <!-- <div class="header" v-if="component != 'Map' && isAdmin"> -->
-    <div class="pad-t32" v-if="component != 'Map' && isAdmin"></div>
-    <div class="select-gird" v-if="component != 'Map' && isAdmin">
-      <img src="./components/img/gird-icon.png" alt="" class="gird-icon">
-      <div @click="linkTo('./SelectGird')">
-        {{ params.girdName }}
-        <img src="./components/img/down-icon.png" alt="" class="down-icon">
+    <template v-if="isGridMember">
+      <div class="pad-t32" v-if="component != 'Map'"/>
+      <div class="select-gird" v-if="component != 'Map'" flex>
+        <AiPagePicker type="custom" class="fill" @select="handleSelectGird"
+                      :ops="{url:'./SelectGird',label: 'girdName'}">
+          <div flex>
+            <img src="./components/img/gird-icon.png" alt="" class="gird-icon">
+            <AiMore v-model="params.girdName" icon="arrow-down"/>
+          </div>
+        </AiPagePicker>
+        <span @click="linkTo('./SetGird?id='+params.id)" v-if="isGridAdmin">网格配置</span>
       </div>
-      <span @click="linkTo('./SetGird')" v-if="checkType == 2">网格配置</span>
-    </div>
-    <!-- </div> -->
-    <component v-if="refresh && isAdmin" :is="component" @change="onChange" :params="params"></component>
-    <div class="tabs" v-if="isTab && isAdmin">
-      <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index">
-        <img :src="tabIndex == index ? item.activeImg : item.img" alt=""/>
-        <p :class="tabIndex == index ? 'color-3267F0' : ''">{{ item.text }}</p>
+      <component v-if="refresh" :is="component" @change="onChange" :params="params"/>
+      <div class="tabs" v-if="isTab">
+        <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index">
+          <img :src="tabIndex == index ? item.activeImg : item.img" alt=""/>
+          <p :class="{'color-3267F0':tabIndex == index}" v-text="item.text"/>
+        </div>
       </div>
-    </div>
-    <div v-if="!isAdmin" class="empty">
+    </template>
+    <div v-if="!isGridMember" class="empty">
       <img src="./components/img/no-admin.png" alt="">
       <p>没有网格员权限<br/>无法查看网格信息哦~</p>
       <div class="add-btn" @click="linkTo('./AddUser')">网格员信息申报</div>
@@ -30,11 +32,11 @@
 import Statistics from './Statistics.vue'
 import Organization from './Organization.vue'
 import Map from './Map.vue'
+import {mapState} from 'vuex'
 
 export default {
   name: 'AppGridManagement',
   appName: '网格管理(新)',
-
   data() {
     return {
       component: 'Statistics',
@@ -62,48 +64,48 @@ export default {
         }
       ],
       isTab: true,
-      isAdmin: false,
-      checkType: 0,
     }
   },
-
+  computed: {
+    ...mapState(['user']),
+    isGridMember() {
+      return this.user.girdCheckType > 0
+    },
+    isGridAdmin() {
+      return this.user.girdCheckType == 2
+    }
+  },
   components: {
     Organization,
     Statistics,
     Map,
   },
-
   methods: {
     onChange(e) {
       this.params = e.params
       this.component = e.type
     },
-    tabClick(index, component) {
-      this.tabIndex = index
-      this.component = component
+    refreshHome() {
       this.refresh = false
       this.$nextTick(() => {
         this.refresh = true
       })
     },
-    isGirdUser() {
-      this.isAdmin = false
-      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
-        if (res.code == 0) {
-          if (res.data.checkType != '0') {
-            this.isAdmin = true
-            this.checkType = res.data.checkType
-            this.params = res.data.appGirdInfo
-          }
-        }
-      })
+    tabClick(index, component) {
+      this.tabIndex = index
+      this.component = component
+      this.refreshHome();
     },
     linkTo(url) {
       uni.navigateTo({url})
     },
+    handleSelectGird(v) {
+      this.params = v || {}
+      this.refreshHome()
+    }
   },
-  onShow() {
-    document.title = '网格管理'
+  onLoad() {
+    this.handleSelectGird(this.user.gridInfo)
     uni.$on('hideTab', () => {
       this.isTab = false
     })
@@ -111,14 +113,8 @@ export default {
       this.isTab = true
     })
   },
-  onLoad() {
-    this.isGirdUser()
-    uni.$on('goback', (res) => {
-      this.params = res
-    })
-    uni.$on('updateGird', (res) => {
-      this.isGirdUser()
-    })
+  onShow() {
+    document.title = '网格管理'
   },
   onReachBottom() {
     if (!this.tabIndex) {
@@ -137,12 +133,8 @@ export default {
   padding-top: 32px;
 }
 
-.header {
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 9;
-  width: 100%;
+.gird-icon {
+  margin-right: 8px;
 }
 
 .select-gird {
@@ -159,22 +151,6 @@ export default {
     vertical-align: middle;
   }
 
-  div {
-    display: inline-block;
-    width: calc(100% - 144px);
-    padding-left: 20px;
-    box-sizing: border-box;
-    font-size: 32px;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    color: #333;
-    line-height: 48px;
-
-    img {
-      margin-left: 8px;
-    }
-  }
-
   span {
     display: inline-block;
     width: 112px;
diff --git a/src/project/grid/AppGridManagement/FamilyList.vue b/src/project/grid/AppGridManagement/FamilyList.vue
index 983e9268..80eeb7b5 100644
--- a/src/project/grid/AppGridManagement/FamilyList.vue
+++ b/src/project/grid/AppGridManagement/FamilyList.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="FamilyList">
     <div class="title">
-      <div>户主列表</div>
+      <div>户主列表({{ total }})</div>
       <div v-if="list.length">
         <span style="font-size: 14px; color: #2979ff;" @click="changeType" v-if="edit">修改</span>
         <span style="font-size: 14px; color: #2979ff;" @click="edit = true" v-else>取消</span>
@@ -11,7 +11,7 @@
       <ul v-for="(item,index) in list" :key="index">
         <li>
           <div class="user">
-             <div v-if="!edit">
+            <div v-if="!edit">
               <img src="./components/img/xz.png" alt="" class="checkbox" v-if="!item.checked" @click="userClick(index)">
               <img src="./components/img/xzh.png" alt="" class="checkbox" v-else @click="userClick(index)">
             </div>
@@ -22,11 +22,11 @@
               </div>
               <div class="userInfo">
                 <div class="name">
-                  <span class="user-name">{{item.name}}</span>
-                  <span class="user-tel">{{item.phone}}</span>
+                  <span class="user-name">{{ item.name }}</span>
+                  <span class="user-tel">{{ item.phone }}</span>
                 </div>
-                <div class="idCard">{{item.idNumber && item.idNumber.replace(/(.{6}).*(.{4})/,"$1********$2")}}</div>
-                <div class="address">{{item.currentAreaName || ''}}{{ item.currentAddress || '' }}</div>
+                <div class="idCard">{{ item.idNumber && item.idNumber.replace(/(.{6}).*(.{4})/, "$1********$2") }}</div>
+                <div class="address">{{ item.currentAreaName || '' }}{{ item.currentAddress || '' }}</div>
               </div>
             </div>
           </div>
@@ -44,8 +44,9 @@
 export default {
   data() {
     return {
-      list:[],
-      current:1,
+      list: [],
+      total: 0,
+      current: 1,
       userId: '',
       edit: true,
       checked: true,
@@ -53,14 +54,15 @@ export default {
     }
   },
   methods: {
-    getList(){
-       this.$http.post(`/app/appgirdmemberresident/listByGirdMember?current=${this.current}&girdMemberId=${this.userId}&girdId=${this.girdId}`).then((res) => {
+    getList() {
+      this.$http.post(`/app/appgirdmemberresident/listByGirdMember?current=${this.current}&girdMemberId=${this.userId}&girdId=${this.girdId}`).then((res) => {
         if (res.code == 0) {
-         this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records
+          this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records
+          this.total = res.data.total
         }
       })
     },
-    toAddFamily(){
+    toAddFamily() {
       uni.navigateTo({url: `./AddFamily?id=${this.userId}&girdId=${this.girdId}`})
     },
     userClick(index) {
@@ -68,14 +70,14 @@ export default {
       this.$forceUpdate()
     },
     // 点击删除
-    delFamily(){
+    delFamily() {
       var ids = []
       this.list.map((item) => {
-        if(item.checked) {
+        if (item.checked) {
           ids.push(item.gmrId)
         }
       })
-      if(!ids.length) {
+      if (!ids.length) {
         return this.$u.toast('请选中需要删除的家庭户主')
       }
       this.$confirm(`是否删除这些关联家庭信息？`).then(() => {
@@ -117,78 +119,93 @@ export default {
 
 <style lang="scss" scoped>
 .FamilyList {
+  min-height: 100vh;
   .title {
     display: flex;
     justify-content: space-between;
     padding: 24px 32px;
-    background-color: #F3F6F9;
+    background-color: #fff;
     font-size: 34px;
     font-weight: 800;
   }
+
   .main {
     padding-bottom: 112px;
+
     ul {
       padding-left: 32px;
       background-color: #fff;
+
       li {
-      list-style-type: none;
-      .user {
-        display: flex;
-        justify-content: flex-start;
-        padding-top: 24px;
-          .checkbox{
-          margin-top: 20px;
-          margin-right: 32px;
-          width: 48px;
-          height: 48px;
-        }
-        .info {
+        list-style-type: none;
+
+        .user {
           display: flex;
           justify-content: flex-start;
-           width: 100%;
-          .userImg {
-          margin-right: 32px;
-          width: 80px;
-          height: 80px;
-          border-radius: 50%;
-        }
-          .userInfo {
-            width: 100%;
-            padding-right: 32px;
-            border-bottom: 1px solid #E4E5E6;
-            .name {
-            display: flex;
-            justify-content: space-between;
-            font-size: 32px;
-            margin-bottom: 8px;
-            .user-name {
-              font-weight: 800;
-            }
-            .user-tel {
-              font-size: 26px;
-              color: #999999 ;
-            }
-         }
-         .idCard {
-           margin-bottom: 16px;
-           font-size: 26px;
-           color: #999999;
-         }
-         .address {
-           max-width: 100%;
-           word-break:break-all;
-           margin-bottom: 18px;
-           font-size: 26px;
-           color: #999999;
-         }
+          padding-top: 24px;
+
+          .checkbox {
+            margin-top: 20px;
+            margin-right: 32px;
+            width: 48px;
+            height: 48px;
+          }
+
+          .info {
+            display: flex;
+            justify-content: flex-start;
+            width: 100%;
+
+            .userImg {
+              margin-right: 32px;
+              width: 80px;
+              height: 80px;
+              border-radius: 50%;
+            }
+
+            .userInfo {
+              width: 100%;
+              padding-right: 32px;
+              border-bottom: 1px solid #E4E5E6;
+
+              .name {
+                display: flex;
+                justify-content: space-between;
+                font-size: 32px;
+                margin-bottom: 8px;
+
+                .user-name {
+                  font-weight: 800;
+                }
+
+                .user-tel {
+                  font-size: 26px;
+                  color: #999999;
+                }
+              }
+
+              .idCard {
+                margin-bottom: 16px;
+                font-size: 26px;
+                color: #999999;
+              }
+
+              .address {
+                max-width: 100%;
+                word-break: break-all;
+                margin-bottom: 18px;
+                font-size: 26px;
+                color: #999999;
+              }
+            }
+
           }
-          
         }
       }
-      }
     }
   }
-  .footer{
+
+  .footer {
     position: fixed;
     left: 0px;
     bottom: 0px;
diff --git a/src/project/grid/AppGridManagement/Map.vue b/src/project/grid/AppGridManagement/Map.vue
index 0b64d3c0..c4503bd0 100644
--- a/src/project/grid/AppGridManagement/Map.vue
+++ b/src/project/grid/AppGridManagement/Map.vue
@@ -1,11 +1,16 @@
 <template>
-  <div class="map">
+  <div class="detail">
     <div class="grid-select">
-      <span class="label">网格选择</span>
-      <div class="grid-select__right" @click="toChoose">
-        <span>{{ form.girdName || '请选择' }}</span>
-        <u-icon name="arrow-right" color="#cccccc" size="30" style="margin-left:8px;"></u-icon>
-      </div>
+      <AiPagePicker type="custom" class="fill" @select="handleSelectGird"
+                    :ops="{url:'./SelectGird',label: 'girdName'}">
+        <div class="gird-content">
+          <div class="label">网格选择</div>
+          <div class="grid-select__right">
+            <span>{{ form.girdName || '请选择' }}</span>
+            <u-icon name="arrow-right" color="#cccccc" size="26" style="margin-left:4px;"></u-icon>
+          </div>
+        </div>
+      </AiPagePicker>
     </div>
     <div class="map-content">
       <AiTMap ref="AiTMap" :map.sync="map" :lib.sync="lib" :libraries="['geometry','service', 'tools']"/>
@@ -14,23 +19,13 @@
       <div class="popup">
         <div class="bg"></div>
         <div class="title">{{ form.girdName }}</div>
-				<scroll-view scroll-y="true" class="grid-info">
-          <div class="info-flex">
-            <span class="label">网格类型</span>
-            <span class="value">{{ $dict.getLabel('girdType', form.girdType) }}</span>
-          </div>
-          <div class="info-flex">
-            <span class="label">网格层级</span>
-            <span class="value">{{ $dict.getLabel('girdLevel', form.girdLevel) }}</span>
-          </div>
-          <div v-if="form.girdMemberManageList && form.girdMemberManageList.length">
-            <div class="info-flex" v-for="(item, index) in  form.girdMemberManageList" :key="index">
-              <span class="label">网格长</span>
-              <span class="value">{{ item.name }}&nbsp;&nbsp;{{ item.phone }}
-                <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(item.phone)" class="phone-icon"
-                    v-if="item.phone">
-              </span>
-            </div>
+        <scroll-view scroll-y="true" class="grid-info">
+          <div class="info-flex" v-for="(item, index) in  form.girdMemberManageList" :key="index">
+            <span class="label">网格长</span>
+            <span class="value">
+              {{ [item.name,item.phone].join("  ") }}
+
+            </span>
           </div>
           <div v-if="form.girdMemberList && form.girdMemberList.length">
             <div class="info-flex" v-for="(item, index) in  form.girdMemberList" :key="index">
@@ -68,16 +63,10 @@ export default {
   },
   computed: {...mapState(['user', 'config'])},
   created() {
-    this.$dict.load('girdType', 'girdLevel')
+    this.$dict.load('girdType')
     this.areaId = this.user.areaId
     // this.getLeafNodes()
     uni.$on('goback', e => {
-      if (e.girdLevel == '0') {
-        setTimeout(() => {
-          this.$u.toast('请选择二级或者三级网格')
-        }, 400)
-        return false
-      }
       this.getGridList(e.id, true)
     })
   },
@@ -94,14 +83,14 @@ export default {
     getLeafNodes() {
       this.$http.post(`/app/appgirdinfo/queryGirdMemberGirdsById`).then((res) => {
         if (res?.data) {
-          this.treeList = res.data.filter(v => v.girdLevel === '2')
+          this.treeList = res.data
 
           const arr = res.data.filter(v => v.points).map(e => {
             return {
               id: e.id,
               girdName: e.girdName,
               points: e.points.map(p => [p.lng, p.lat])
-            } 
+            }
           })
 
           arr.length > 0 && this.renderGridMap(arr)
@@ -121,7 +110,6 @@ export default {
               points: v.points ? v.points.map(p => [p.lng, p.lat]) : []
             }
           })
-
           this.renderGridMap(arr)
         }
       }).catch(() => {
@@ -142,7 +130,7 @@ export default {
               girdName: res.data.girdName,
               points: res.data.points.map(p => [p.lng, p.lat])
             }]
-            
+
             this.renderGridMap(arr)
           }
 
@@ -262,17 +250,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-::v-deep uni-page-body {
+.detail {
   height: 100%;
-}
 
-ai-tree-picker {
-  display: inline-block;
-}
-
-.map {
-  height: 100%;
-  height: calc(100% - 98px);
   .grid-select {
     width: 100%;
     padding: 34px 32px;
@@ -282,14 +262,15 @@ ai-tree-picker {
     justify-content: space-between;
     line-height: 44px;
     color: #333;
-    // position: fixed;
-    // top: 0;
-    // left: 0;
-    // z-index: 999;
 
     .grid-select__right {
+      width: calc(100% - 140px);
+      text-align: right;
+    }
+
+    .gird-content {
       display: flex;
-      align-items: center;
+      justify-content: space-between;
     }
 
     .label {
@@ -309,7 +290,7 @@ ai-tree-picker {
 
   .map-content {
     width: 100%;
-    height: calc(100% - 115px);
+    height: calc(100% - 210px);
   }
 
   .popup {
@@ -343,8 +324,8 @@ ai-tree-picker {
       line-height: 40px;
       font-size: 28px;
 
-      &:last-child {
-        border: none;
+      &:last-of-type {
+        border-bottom: none;
       }
 
       .label {
@@ -357,22 +338,11 @@ ai-tree-picker {
       .value {
         color: #666;
         font-size: 26px;
-
-        .phone-icon {
-          width: 40px;
-          height: 40px;
-          vertical-align: sub;
-          margin-left: 16px;
-        }
       }
     }
   }
 }
 
-.grid-name {
-  display: inline-block;
-}
-
 .footer {
   width: 100%;
   position: fixed;
diff --git a/src/project/grid/AppGridManagement/SelectGird.vue b/src/project/grid/AppGridManagement/SelectGird.vue
index e67b6ff8..a59d7ec3 100644
--- a/src/project/grid/AppGridManagement/SelectGird.vue
+++ b/src/project/grid/AppGridManagement/SelectGird.vue
@@ -2,37 +2,39 @@
   <div class="SelectGird">
     <div class="header-middle">
       <div class="hint">
-        <span v-for="(item, index) in slectList" :key="index"><span v-if="index" style="margin:0 4px;">/</span><span style="color:#3F8DF5" @click="girdNameClick(item, index)">{{item.girdName}}</span></span>
+        <AiGap/>
+        <span v-for="(item, index) in slectList" :key="index">
+          <span v-if="index" style="margin:0 4px;" v-text="`/`"/>
+          <span style="color:#3F8DF5" @click="girdNameClick(item, index)" v-text="item.girdName"/>
+        </span>
       </div>
       <div class="showTypes">
         <div v-if="treeList.length > 0">
           <div class="cards" v-for="(item, index) in treeList" :key="index" @click="itemClick(item)">
             <div class="imges">
-              <span>
-                <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" @click.stop="girdClick(item, index)" />
-                <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)" />
-              </span>
-              <img src="./components/img/gird--select-icon.png" alt="" class="avatras" />
+              <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked"
+                   @click.stop="girdClick(item, index)"/>
+              <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)"/>
+              <img src="./components/img/gird--select-icon.png" alt="" class="avatras"/>
             </div>
-            <div class="rightes">
-              <div class="applicationNames">{{ item.girdName }}</div>
-              <img src="./components/img/right-icon.png" alt="" class="imgs" v-if="item.girdLevel != 2"/>
+            <div class="rightes fill">
+              <div class="applicationNames fill">{{ item.girdName }}</div>
             </div>
           </div>
         </div>
-
-        <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
+        <AiEmpty :description="isGridMember?`暂无数据`:`当前人员不是网格员或网格管理员`" class="emptyWrap" v-else/>
       </div>
     </div>
     <!-- <div style="padding-bottom: 70px;"></div> -->
     <div class="subBtn" @click="submit">
       <div>确定选择</div>
     </div>
-
   </div>
 </template>
 
 <script>
+import {mapState} from "vuex";
+
 export default {
   name: 'SelectGird',
   data() {
@@ -41,90 +43,92 @@ export default {
       allData: null,
       treeList: [],
       slectList: [],
-      userGird: {},
       userList: [],
-      girdLevel: 0,
-      parentGirdId: ''
+      parentGirdId: '',
+      isFormMap: 0, //1为网格地图 一级不允许选中
     }
   },
-  onLoad() {
-    this.isGirdUser()
+  computed: {
+    ...mapState(['user']),
+    isMyGirds() {
+      return !!this.$route.query.self
+    },
+    isGridMember() {
+      return this.user.girdCheckType > 0
+    }
+  },
+  onLoad(option) {
+    if (option.isFormMap) {
+      this.isFormMap = option.isFormMap
+    }
+    this.isGridMember ? this.getAllGrids() : this.$u.toast('当前人员不是网格员或网格管理员')
   },
   methods: {
-    isGirdUser() {
-      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
-        if (res.code == 0) {
-          if (res.data.checkType) {
-            this.userGird = res.data
-            this.getTree()
-          } else {
-            this.$u.toast('当前人员不是网格员或网格管理员')
-          }
-        }
-      })
-    },
-    getTree() {
+    getAllGrids() {
       this.slectList = []
-      this.$http.post(`/app/appgirdinfo/queryAppGirdInfoByGirdLevel?girdLevel=${this.girdLevel}&girdMemberId=${this.userGird.girdMemberId}&parentGirdId=${this.parentGirdId}`).then((res) => {
+      let {girdMemberId} = this.user,
+          url = `/app/appgirdinfo/queryAppGirdInfoByGirdLevel`,
+          params = {girdMemberId}
+      if (this.isMyGirds) {
+        url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2AndUser`
+        params = {}
+      }
+      this.$http.post(url, null, {params}).then((res) => {
         if (res?.data) {
-          this.allData = res.data
+          let parents = res.data.map(e => e.parentGirdId)
+          this.allData = res.data.map(e => ({...e, hasChildren: parents.includes(e.id)}))
           this.treeInit()
         }
       })
     },
-
     treeInit() {
-      this.treeList = this.allData
-      this.treeList.map((item) => {
-        item.isChecked = false
-      })
-      var obj = {
-        girdName: '可选范围',
-        id: '',
-        girdLevel: ''
+      let last = uni.getStorageSync("lastSelectedGrid")
+      if (last) {
+        this.$http.post("/app/appgirdinfo/listFatherGirdInfo", null, {
+          params: {girdId: last}
+        }).then(res => {
+          if (res?.data) {
+            this.slectList = [{girdName: '可选范围', id: ''}, res.data].flat()
+            this.getGridsByGridMemberAndParent({id: last})
+          }
+        })
+      } else {
+        this.treeList = this.allData.filter(e => !e.parentGirdId || this.isMyGirds)
+        this.treeList.map((item) => item.isChecked = false)
+        let obj = {girdName: '可选范围', id: ''}
+        this.slectList.push(obj)
       }
-      this.slectList.push(obj)
     },
-
     itemClick(row) {
-      if(row.girdLevel == 2) return
-      var obj = {
-        girdName: row.girdName,
-        id: row.id,
-        girdLevel: row.girdLevel
-      }
-      this.slectList.push(obj)
-      this.searckGird(row)
-    },
-
-    searckGird(row) {
-      if(row.girdLevel == 2) return
-      var girdLevel = Number(row.girdLevel)+1
-      this.$http.post(`/app/appgirdinfo/queryAppGirdInfoByGirdLevel?girdLevel=${girdLevel}&girdMemberId=${this.userGird.girdMemberId}&parentGirdId=${row.id}`).then((res) => {
-        if (res?.data) {
-          this.treeList = res.data
+      if (row.hasChildren) {
+        let obj = {
+          girdName: row.girdName,
+          id: row.id,
         }
-      })
+        this.slectList.push(obj)
+        this.getGridsByGridMemberAndParent(row)
+      }
+    },
+    getGridsByGridMemberAndParent(row) {
+      let {id: parentGirdId} = row
+      this.treeList = this.allData.filter(e => e.parentGirdId == parentGirdId)
     },
-
     girdNameClick(row, index) {
       this.userList = []
-      if(!index) { //第一级别
+      if (!index) { //第一级别
         this.slectList = []
         this.treeInit()
-      }else {
+      } else {
         var list = []
         this.slectList.map((item, i) => {
-          if(i <= index) {
+          if (i <= index) {
             list.push(item)
           }
         })
         this.slectList = list
-        this.searckGird(row)
+        this.getGridsByGridMemberAndParent(row)
       }
     },
-    
-
     girdClick(row, index) {
       if (this.treeList[index].isChecked) {//取消
         this.treeList[index].isChecked = false
@@ -138,29 +142,28 @@ export default {
       }
       this.$forceUpdate()
     },
-
-
     submit() {
       if (this.SelectGird.id != null) {
-        uni.$emit('goback', this.SelectGird)
-        uni.navigateBack()
+        uni.setStorageSync("lastSelectedGrid", this.SelectGird.parentGirdId)
+        uni.navigateBack({
+          success: () => {
+            uni.$emit("pagePicker:custom", this.SelectGird)
+          }
+        })
       } else {
         return this.$u.toast('请选择网格')
       }
-    },
+    }
   }
 }
 </script>
 
 <style scoped lang="scss">
 .SelectGird {
-  height: 100%;
+  min-height: 100vh;
   background: #fff;
   padding-bottom: 140px;
-  .header-top {
-    background: #fff;
-    padding: 20px 32px;
-  }
+  box-sizing: border-box;
 
   .header-middle {
     .hint {
@@ -173,11 +176,6 @@ export default {
     }
 
     .showTypes {
-      .empty-div {
-        height: 16px;
-        background: #f5f5f5;
-      }
-
       .cards {
         display: flex;
         align-items: center;
@@ -203,82 +201,32 @@ export default {
             margin-left: 36px;
           }
         }
+
         img {
           width: 74px;
           height: 74px;
           border-radius: 8px;
         }
+
         .rightes {
-          width: calc(100% - 188px);
           display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-left: 32px;
           border-bottom: 1px solid #e4e5e6;
+          padding: 0 16px;
+
           .applicationNames {
-            width: calc(100% - 100px);
+            display: inline-block;
             font-size: 36px;
             font-weight: 500;
             color: #333333;
-            overflow:hidden; 
-            text-overflow:ellipsis; 
-            white-space:nowrap;
-          }
-          .imgs {
-            width: 60px;
-            height: 60px;
-            vertical-align: middle;
-            margin-right: 32px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            vertical-align: bottom;
           }
         }
       }
     }
 
-    .showUsers {
-      .cards {
-        display: flex;
-        align-items: center;
-        height: 120px;
-        line-height: 120px;
-        // background: pink;
-        padding: 0 0 0 32px;
-
-        .imges {
-          display: flex;
-          align-items: center;
-          width: 200px;
-          .imgselect {
-            width: 48px;
-            height: 48px;
-          }
-
-          .avatras {
-            width: 74px;
-            height: 74px;
-            border-radius: 8px;
-            margin-left: 36px;
-          }
-        }
-
-        .rights {
-          width: 100%;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-left: 32px;
-          border-bottom: 1px solid #e4e5e6;
-          padding-right: 40px;
-          .applicationNames {
-            font-size: 36px;
-            font-weight: 500;
-            color: #333333;
-          }
-          .idNumbers {
-            color: #666;
-          }
-        }
-      }
-    }
   }
 
   .subBtn {
@@ -288,6 +236,7 @@ export default {
     width: 100%;
     height: 118px;
     background: #f4f8fb;
+
     div {
       width: 192px;
       height: 80px;
diff --git a/src/project/grid/AppGridManagement/SetGird.vue b/src/project/grid/AppGridManagement/SetGird.vue
index 6ba36f36..edc2facf 100644
--- a/src/project/grid/AppGridManagement/SetGird.vue
+++ b/src/project/grid/AppGridManagement/SetGird.vue
@@ -1,369 +1,149 @@
 <template>
   <div class="setGird">
-    <div class="header-middle">
-      <div class="hint">
-        <span v-for="(item, index) in slectList" :key="index"><span v-if="index" style="margin:0 4px;">/</span><span style="color:#3F8DF5" @click="girdNameClick(item, index)">{{item.girdName}}</span></span>
-      </div>
-
-      <div class="showTypes" v-if="!userList.length">
+    <AiGroup>
+      <AiItem :label="detail.girdName" :border="false" labelBold>
+        <u-icon name="arrow-right" label="查看网格成员" label-pos="left" label-color="#3F8DF5" @click="showGirdInfo()"/>
+      </AiItem>
+    </AiGroup>
+    <AiGroup>
+      <AiItem label="下级网格" top-label :border="false" labelBold>
         <div v-if="treeList.length > 0">
           <div class="cards" v-for="(item, index) in treeList" :key="index">
-            <div class="imges">
-              <!-- <span v-if="item.girdRight == 1 && item.girdLevel != 2">
-                <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" @click.stop="girdClick(item, index)" />
-                <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)" />
-              </span>
-              <span v-else style="width:24px;"></span> -->
-              <img src="./components/img/gird--select-icon.png" alt="" class="avatras" />
-            </div>
-            <div class="rightes">
-              <div class="applicationNames" @click="showGirdInfo(item)">{{ item.girdName }}</div>
-              <div class="right-icon" v-if="item.girdLevel != 2" @click="itemClick(item)" >
-                <img src="./components/img/right-icon.png" alt="" class="imgs" />
-              </div>
+            <div class="rightes fill" flex>
+              <img src="./components/img/gird--select-icon.png" alt="" class="avatras"/>
+              <div class="applicationNames fill" @click="showGirdInfo(item)">{{ item.girdName }}</div>
+              <u-icon v-if="item.hasChildren" @click="itemClick(item)" name="arrow-right" color="#ddd"/>
             </div>
           </div>
         </div>
-
-        <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
-      </div>
+        <AiEmpty description="暂无数据" class="emptyWrap" v-else/>
+      </AiItem>
+    </AiGroup>
+    <div class="subBtn" v-if="detail.girdRight==1">
+      <div @click="toAddGird">添加下级网格</div>
+      <div @click="handleDelete">编辑网格</div>
+      <div class="delete" @click="toAddGird">删除网格</div>
     </div>
-    <!-- <div style="padding-bottom: 70px;"></div> -->
-    <!-- <div class="subBtn" @click="toAddGird" v-if="slectList.length && slectList[slectList.length-1].girdLevel != 1">
-      <div>添加网格</div>
-    </div> -->
-
-     <u-popup v-model="show" mode="bottom" border-radius="14" height="1000">
-      <div class="popup">
-        <div class="bg"></div>
-        <div class="title">{{ form.girdName }}</div>
-       <div class="info-flex">
-          <span class="label">网格类型</span>
-          <span class="value">{{ $dict.getLabel('girdType', form.girdType) }}</span>
-        </div>
-        <div class="info-flex">
-          <span class="label">网格层级</span>
-          <span class="value">{{ $dict.getLabel('girdLevel', form.girdLevel) }}</span>
-        </div>
-        <div v-if="form.girdMemberManageList && form.girdMemberManageList.length">
-          <div class="info-flex" v-for="(item, index) in  form.girdMemberManageList" :key="index">
-            <span class="label">网格长</span>
-            <span class="value">{{ item.name }}&nbsp;&nbsp;{{ item.phone }}
-              <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(item.phone)" class="phone-icon"
-                   v-if="item.phone">
-            </span>
-          </div>
-        </div>
-        <div v-if="form.girdMemberList && form.girdMemberList.length">
-          <div class="info-flex" v-for="(item, index) in  form.girdMemberList" :key="index">
-            <span class="label">网格员</span>
-            <span class="value">{{ item.name }}&nbsp;&nbsp;{{ item.phone }}
-              <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(item.phone)" class="phone-icon"
-                   v-if="item.phone">
-            </span>
-          </div>
-        </div>
-        <div style="height:56px;"></div>
-        <div class="btn">
-          <span class="del mar-r32" @click="del" v-if="form.girdRight == 1">删除网格</span>
-          <span class="edit mar-r32" @click="edit" v-if="form.girdRight == 1">编辑网格</span>
-          <span class="edit" :class="form.girdRight == 1 ? '' : 'flex1'" v-if="form.girdLevel != 2" @click="toAddGird">添加下级网格</span>
-        </div>
-      </div>
-    </u-popup>
-
   </div>
 </template>
-
 <script>
+import {mapState} from "vuex"
+
 export default {
   name: 'setGird',
   data() {
     return {
-      setGird: {},
-      allData: null,
+      detail: {},
       treeList: [],
-      slectList: [],
-      userList: [],
-
-      show: false,
-      form: {},
     }
   },
-  onLoad() {
-    this.$dict.load('girdType', 'girdLevel')
-    this.isGirdUser()
-    uni.$on('update',  () => {
-      this.show = false
-      this.getTree()
-    })
+  computed: {
+    ...mapState(['user'])
   },
   onShow() {
+    this.getAllGrids()
     document.title = '网格配置'
   },
   methods: {
-    isGirdUser() {
-      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
-        if (res.code == 0) {
-          if (res.data.checkType) {
-            this.userGird = res.data
-            this.getTree()
-          } else {
-            this.$u.toast('当前人员不是网格员或网格管理员')
-          }
-        }
-      })
-    },
-    getTree() {
-      this.slectList = []
-      this.$http.post(`/app/appgirdinfo/queryAppGirdInfoByGirdLevel?girdLevel=0&girdMemberId=${this.userGird.girdMemberId}&parentGirdId=`).then((res) => {
+    getAllGrids() {
+      let {id: parentGirdId} = this.$route.query
+      this.$http.post(`/app/appgirdinfo/listByInfo`, null, {
+        params: {parentGirdId}
+      }).then(res => {
         if (res?.data) {
-          this.allData = res.data
-          this.treeInit()
+          let parents = [...new Set(res.data.map(e => e.parentGirdId))]
+          this.detail = res.data.find(e => e.id == parentGirdId) || {}
+          this.treeList = res.data.filter(e => e.parentGirdId == parentGirdId).map(e => ({...e, hasChildren: parents.includes(e.id)}))
         }
       })
     },
 
-    treeInit() {
-      this.treeList = this.allData
-      this.treeList.map((item) => {
-        item.isChecked = false
-      })
-      var obj = {
-        girdName: '可选范围',
-        id: '',
-        girdLevel: '0'
-      }
-      this.slectList.push(obj)
-    },
-
     itemClick(row) {
-      if(row.girdLevel == 2) return
-      var obj = {
-        girdName: row.girdName,
-        id: row.id,
-        girdLevel: row.girdLevel
-      }
-      this.slectList.push(obj)
-      this.searckGird(row)
+      uni.navigateTo({url: `./SetGird?id=${row.id}`})
     },
-
-    searckGird(row) {
-      if(row.girdLevel == 2) return
-      var girdLevel = Number(row.girdLevel)+1
-      this.$http.post(`/app/appgirdinfo/queryAppGirdInfoByGirdLevel?girdLevel=${girdLevel}&girdMemberId=${this.userGird.girdMemberId}&parentGirdId=${row.id}`).then((res) => {
-        if (res?.data) {
-          this.treeList = res.data
-          this.setGird = {}
-        }
-      })
+    showGirdInfo(row = {id: this.$route.query.id}) {
+      uni.navigateTo({url: `./gridMembers?id=${row.id}`})
     },
-
-    girdNameClick(row, index) {
-      this.userList = []
-      if(!index) { //第一级别
-        this.slectList = []
-        this.treeInit()
-      }else {
-        var list = []
-        this.slectList.map((item, i) => {
-          if(i <= index) {
-            list.push(item)
-          }
-        })
-        this.slectList = list
-        this.searckGird(row)
-      }
-    },
-    
-
-    girdClick(row, index) {
-      if (this.treeList[index].isChecked) {//取消
-        this.treeList[index].isChecked = false
-        this.setGird = {}
-      } else {
-        this.treeList.map((item) => {
-          item.isChecked = false
-        })
-        this.treeList[index].isChecked = true
-        this.setGird = row
-      }
-      this.$forceUpdate()
-    },
-
-    showGirdInfo(row) {
-      this.show = true
-      this.form = row
-    },
-
-    del() {
-      this.$confirm(`是否删除该网格？`).then(() => {
-        this.$http.post(`/app/appgirdinfo/delete?ids=${this.form.id}`).then((res) => {
-          if (res.code == 0) {
-            this.$u.toast('删除成功!')
-            this.show = false
-            this.form = {}
-            this.treeList = []
-            this.isGirdUser()
-          }
-        }).catch((err) => {
-          this.$u.toast(err)
-        })
-      })
-    },
-
-    edit() {
-      uni.navigateTo({url: `./AddGird?id=${this.form.id}&fromType=edit`})
-    },
-
     callPhone(phone) {
       uni.makePhoneCall({phoneNumber: phone})
     },
-
     toAddGird() {
-      console.log(this.setGird)
-      // if (this.setGird.id != null) {
-      //   uni.navigateTo({url: `./AddGird?id=${this.setGird.id}&fromType=add`})
-      // } else {
-      //   return this.$u.toast('请选择网格')
-      // }
-      uni.navigateTo({url: `./AddGird?id=${this.form.id}&fromType=add`})
-    }
+      uni.navigateTo({url: `./AddGird?id=${this.detail.id}&fromType=add`})
+    },
+    edit() {
+      uni.navigateTo({url: `./AddGird?id=${this.detail.id}&fromType=edit`})
+    },
+    handleDelete() {
+      this.$confirm('删除网格后，会清除网格内网格员和责任家庭信息，如有下级网格，会同步删除下级网格所有数据', `您确认要删除该网格？`).then(() => {
+        this.$http.post(`/app/appgirdinfo/delete?ids=${this.detail.id}`).then((res) => {
+          if (res?.code == 0) {
+            this.$u.toast('删除成功!')
+            this.getDetail()
+          }
+        })
+      })
+    },
   }
 }
 </script>
 
 <style scoped lang="scss">
 .setGird {
-  height: 100%;
-  background: #fff;
+  min-height: 100vh;
+  background: #F5F6F7;
   padding-bottom: 140px;
-  .header-top {
-    background: #fff;
-    padding: 20px 32px;
+  box-sizing: border-box;
+
+  .empty-div {
+    height: 16px;
+    background: #f5f5f5;
   }
 
-  .header-middle {
-    .hint {
-      padding: 28px 20px 28px 32px;
-      line-height: 56px;
-      box-shadow: 0px 1px 0px 0px #e4e5e6;
-      font-size: 30px;
-      font-weight: 500;
-      word-break: break-all;
+  .cards {
+    display: flex;
+    align-items: center;
+    height: 120px;
+    line-height: 120px;
+    // background: pink;
+
+    .avatras {
+      width: 74px;
+      height: 74px;
+      border-radius: 8px;
+      margin-right: 20px;
     }
 
-    .showTypes {
-      .empty-div {
-        height: 16px;
-        background: #f5f5f5;
-      }
-
-      .cards {
-        display: flex;
-        align-items: center;
-        height: 120px;
-        line-height: 120px;
-        // background: pink;
-        padding: 0 0 0 32px;
-
-        .imges {
-          display: flex;
-          align-items: center;
-          // width: 200px;
-          .imgselect {
-            width: 48px;
-            height: 48px;
-            vertical-align: middle;
-          }
-
-          .avatras {
-            width: 74px;
-            height: 74px;
-            border-radius: 8px;
-            margin-left: 36px;
-          }
-        }
-        img {
-          width: 74px;
-          height: 74px;
-          border-radius: 8px;
-        }
-        .rightes {
-          width: calc(100% - 140px);
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-left: 32px;
-          border-bottom: 1px solid #e4e5e6;
-          .applicationNames {
-            width: calc(100% - 100px);
-            font-size: 36px;
-            font-weight: 500;
-            color: #333333;
-            overflow:hidden; 
-            text-overflow:ellipsis; 
-            white-space:nowrap;
-          }
-          .right-icon{
-            width: 100px;
-            padding-right: 32px;
-            box-sizing: border-box;
-            text-align: right;
-             .imgs {
-              width: 60px;
-              height: 60px;
-              vertical-align: middle;
-            }
-          }
-         
-        }
-      }
+    img {
+      width: 74px;
+      height: 74px;
+      border-radius: 8px;
     }
 
-    .showUsers {
-      .cards {
-        display: flex;
-        align-items: center;
-        height: 120px;
-        line-height: 120px;
-        // background: pink;
-        padding: 0 0 0 32px;
+    .rightes {
+      display: flex;
+      border-bottom: 1px solid #e4e5e6;
+      padding-right: 16px;
 
-        .imges {
-          display: flex;
-          align-items: center;
-          width: 200px;
-          .imgselect {
-            width: 48px;
-            height: 48px;
-          }
+      .applicationNames {
+        display: inline-block;
+        font-size: 36px;
+        font-weight: 500;
+        color: #333333;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        vertical-align: bottom;
+      }
 
-          .avatras {
-            width: 74px;
-            height: 74px;
-            border-radius: 8px;
-            margin-left: 36px;
-          }
-        }
+      .imgs {
+        width: 40px;
+        height: 40px;
+        margin-right: 0;
+        vertical-align: middle;
+      }
 
-        .rights {
-          width: 100%;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-left: 32px;
-          border-bottom: 1px solid #e4e5e6;
-          padding-right: 40px;
-          .applicationNames {
-            font-size: 36px;
-            font-weight: 500;
-            color: #333333;
-          }
-          .idNumbers {
-            color: #666;
-          }
-        }
+      .u-icon {
+        padding: 0 16px;
       }
     }
   }
@@ -375,104 +155,30 @@ export default {
     width: 100%;
     height: 118px;
     background: #f4f8fb;
+    font-family: PingFangSC-Medium, PingFang SC;
+
     div {
-      width: 192px;
-      height: 80px;
-      line-height: 80px;
+      padding: 0 32px;
+      height: 88px;
+      line-height: 88px;
       text-align: center;
       background: #1365dd;
-      border-radius: 4px;
+      border-radius: 8px;
       font-size: 32px;
       color: #fff;
-      margin: 20px 34px 0 0;
+      margin-left: 22px;
       float: right;
-    }
-  }
+      border: 2px #1365dd solid;
 
-  .popup {
-    padding: 0 32px 16px;
-
-    .bg {
-      width: 64px;
-      height: 10px;
-      background: #CCC;
-      border-radius: 6px;
-      margin: 32px 0 32px 344px;
-    }
-
-    .title {
-      font-size: 36px;
-      font-family: PingFang-SC-Heavy, PingFang-SC;
-      font-weight: 800;
-      color: #333;
-      line-height: 50px;
-      margin-bottom: 24px;
-    }
-
-    .info-flex {
-      padding: 26px 0 30px 0;
-      width: 100%;
-      border-bottom: 1px solid #D8DDE6;
-      line-height: 40px;
-      font-size: 28px;
-
-      .label {
-        display: inline-block;
-        width: 160px;
-        font-weight: 800;
-        color: #333;
-      }
-
-      .value {
-        color: #666;
-        font-size: 26px;
-
-        .phone-icon {
-          width: 40px;
-          height: 40px;
-          vertical-align: sub;
-          margin-left: 16px;
-        }
-      }
-    }
-    .border-b0{
-      border-bottom: 0;
-    }
-    .btn{
-      width: 100%;
-      padding: 32px;
-      box-sizing: border-box;
-      background-color: #fff;
-      display: flex;
-      position: fixed;
-      bottom: 0;
-      left: 0;
-      span{
-        display: inline-block;
-        height: 92px;
-        line-height: 90px;
-        border-radius: 8px;
-        font-size: 32px;
-        font-family: PingFangSC-Medium, PingFang SC;
-        font-weight: 500;
-        box-sizing: border-box;
-        padding: 0 28px;
-      }
-      .del{
+      &.delete {
+        background: #fff;
         color: #f46;
-        border: 1px solid #f46;
+        border-color: #f46;
       }
-      .edit{
-        background-color: #3671EE;
-        color: #fff;
-      }
-      .mar-r32{
+
+      &:first-of-type {
         margin-right: 32px;
       }
-      .flex1{
-        width: 100%;
-        text-align: center;
-      }
     }
   }
 }
diff --git a/src/project/grid/AppGridManagement/Statistics.vue b/src/project/grid/AppGridManagement/Statistics.vue
index 52e1c8c2..2c7a765c 100644
--- a/src/project/grid/AppGridManagement/Statistics.vue
+++ b/src/project/grid/AppGridManagement/Statistics.vue
@@ -26,27 +26,14 @@
 
     <div class="bottom">
       <div class="girdMsg">网格信息</div>
-
       <div class="girdCont">
         <div class="boxes">
           <span class="boxesLeft">网格名称</span>
-
-          <span class="boxesRight">{{ girdMsgList.girdName || '' }}</span>
-          <!-- <span class="boxesRight">{{ girdUser.appGirdInfo.girdName }}</span> -->
+          <span class="boxesRight">{{ gridInfo.girdName || '' }}</span>
         </div>
-
         <div class="boxes">
-          <span class="boxesLeft">网格类型</span>
-
-          <span class="boxesRight">
-            {{ $dict.getLabel('girdType', girdMsgList.girdType) || '' }}
-          </span>
-        </div>
-
-        <div class="boxes">
-          <span class="boxesLeft">网格层级</span>
-
-          <span class="boxesRight">{{ $dict.getLabel('girdLevel', girdMsgList.girdLevel) || '' }}</span>
+          <span class="boxesLeft">标绘状态</span>
+          <span class="boxesRight">{{ gridInfo.plottingStatus == 1 ? '已标绘' : '未标绘' }}</span>
         </div>
       </div>
     </div>
@@ -64,56 +51,37 @@ export default {
   },
   data() {
     return {
-      girdUser: [],
       peopleList: {},
-      girdMsgList: {},
+      gridInfo: {},
       checkType: '',
     }
   },
-  computed: {},
-  watch: {},
-  onLoad() {},
   created() {
-    this.$dict.load('girdType', 'girdLevel').then(() => {
-      this.isGirdUser()
-      this.girdMsgList = this.params
-      this.getList()
-    })
-
+    this.gridInfo = this.params
+    this.getList()
     uni.$on('goback', (res) => {
-      this.girdMsgList = res
+      this.gridInfo = res
       this.getList()
     })
   },
   methods: {
-    isGirdUser() {
-      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
-        if (res.code == 0) {
-          this.girdUser = res.data
-        }
-      })
-    },
-
     getList() {
-      this.$http.post(`/app/appgirdmemberinfo/girdMemberAndResidentStatistic?girdId=${this.girdMsgList.id}`).then((res) => {
-        if (res.code == 0) {
+      this.$http.post(`/app/appgirdmemberinfo/girdMemberAndResidentStatistic?girdId=${this.gridInfo.id}`).then((res) => {
+        if (res?.data) {
           this.peopleList = res.data
         }
       })
     },
     linkTo(url) {
-      uni.navigateTo({ url })
+      uni.navigateTo({url})
     },
   },
 }
 </script>
 
 <style scoped lang="scss">
-uni-page-body {
-  height: 100%;
-}
 .Statistics {
-  padding: 0 30px 0;
+  padding: 0 30px;
   box-sizing: border-box;
 
   .middle {
@@ -121,25 +89,30 @@ uni-page-body {
     border-radius: 16px;
     margin-top: 32px;
     padding: 32px 0 60px 0;
+
     .girdPeople {
       padding: 0 0 56px 24px;
       font-size: 32px;
       font-family: PingFangSC-Regular, PingFang SC;
       color: #333333;
     }
+
     .card {
       display: flex;
       justify-content: space-around;
+
       .box {
         display: flex;
         flex-direction: column;
         align-items: center;
+
         .count {
           font-size: 64px;
           font-family: DINAlternate-Bold, DINAlternate;
           font-weight: bold;
           color: #3b424a;
         }
+
         .girdCount {
           margin-top: 8px;
           font-size: 28px;
@@ -156,16 +129,19 @@ uni-page-body {
     border-radius: 16px;
     margin-top: 32px;
     padding: 0 24px 64px 24px;
+
     .girdMsg {
       padding: 32px 0;
       font-size: 32px;
       font-family: PingFangSC-Regular, PingFang SC;
       color: #333333;
     }
+
     .girdCont {
       .boxes {
         padding: 24px 0 30px 0;
         box-shadow: inset 0px -1px 0px 0px #d8dde6;
+
         .boxesLeft {
           font-size: 30px;
           font-family: PingFang-SC-Heavy, PingFang-SC;
@@ -175,6 +151,7 @@ uni-page-body {
           width: 140px;
           vertical-align: top;
         }
+
         .boxesRight {
           margin-left: 40px;
           font-size: 28px;
diff --git a/src/project/grid/AppGridManagement/gridMembers.vue b/src/project/grid/AppGridManagement/gridMembers.vue
new file mode 100644
index 00000000..f1f07f14
--- /dev/null
+++ b/src/project/grid/AppGridManagement/gridMembers.vue
@@ -0,0 +1,187 @@
+<template>
+  <section class="gridMembers">
+    <div class="title">{{ detail.girdName }}</div>
+    <div flex v-for="(item, index) in list" :key="index" class="listItem">
+<!--      <img class="avatar" :src="item.photo"/>-->
+      <div class="fill">
+        <div class="memberName" v-text="item.name"/>
+        <div flex>
+          <div class="color-999" v-text="item.userRole"/>
+          <div v-if="item.label" class="tag" v-text="item.label"/>
+        </div>
+      </div>
+      <div class="btns">
+        <div @click="gotoFamilyList(item)">责任家庭</div>
+<!--        <div @click="handleTag(item)">标签设置</div>-->
+      </div>
+    </div>
+    <div class="btn" v-if="detail.girdRight == 1">
+      <span class="del" @click="del" v-if="!!detail.parentGirdId">删除网格</span>
+      <span class="edit" @click="edit">编辑网格</span>
+    </div>
+  </section>
+</template>
+
+<script>
+export default {
+  name: "gridMembers",
+  appName: "网格成员",
+  computed: {
+    list() {
+      let {girdMemberManageList, girdMemberList} = this.detail
+      return [girdMemberManageList?.map(e => ({...e, userRole: "网格长"})) || [],
+        girdMemberList?.map(e => ({
+          ...e,
+          userRole: "网格员"
+        })) || []].flat()
+    }
+  },
+  data() {
+    return {
+      detail: {}
+    }
+  },
+  methods: {
+    getDetail() {
+      let {id} = this.$route.query
+      this.$http.post("/app/appgirdinfo/queryDetailById", null, {
+        params: {id}
+      }).then(res => {
+        if (res?.data) {
+          this.detail = res.data
+        }
+      })
+    },
+    del() {
+      this.$confirm('删除网格后，会清除网格内网格员和责任家庭信息，如有下级网格，会同步删除下级网格所有数据', `您确认要删除该网格？`).then(() => {
+        this.$http.post(`/app/appgirdinfo/delete?ids=${this.detail.id}`).then((res) => {
+          if (res?.code == 0) {
+            this.$u.toast('删除成功!')
+            this.getDetail()
+          }
+        })
+      })
+    },
+    edit() {
+      uni.navigateTo({url: `./AddGird?id=${this.detail.id}&fromType=edit`})
+    },
+    handleTag({id, label}) {
+      uni.showModal({
+        title: "设置标签",
+        content: label,
+        editable: true,
+        placeholderText: "请输入标签,最多10字",
+        success: res => {
+          if (res.confirm) {
+            if (res.content && res.content.length <= 10) {
+              this.$http.post("/app/appgirdmemberinfo/updateGirdMemberLabelById", null, {
+                params: {id, label: res.content}
+              }).then(res => {
+                if (res?.code == 0) {
+                  this.$u.toast("设置成功")
+                  this.getDetail()
+                } else this.handleTag({id, label})
+              }).catch(() => this.handleTag({id, label}))
+            } else {
+              this.$u.toast("请输入标签,最多10字")
+              this.handleTag({id, label})
+            }
+          }
+        }
+      })
+    },
+    gotoFamilyList(item) {
+      uni.navigateTo({url: `./FamilyList?id=${item.id}&girdId=${item.girdId}`})
+    }
+  },
+  onShow() {
+    this.getDetail()
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.gridMembers {
+  padding: 16px 32px 170px;
+  min-height: 100vh;
+  box-sizing: border-box;
+
+  .color-999 {
+    color: #999;
+  }
+
+  .avatar {
+    width: 96px;
+    height: 96px;
+    margin-right: 32px;
+  }
+
+  .btns {
+    margin-left: 32px;
+    line-height: 48px;
+    color: #26f;
+  }
+
+  .title {
+    font-size: 36px;
+    font-family: PingFang-SC-Heavy, PingFang-SC;
+    font-weight: 800;
+    color: #333;
+    line-height: 50px;
+    margin-bottom: 24px;
+  }
+
+  .listItem {
+    padding: 20px 0;
+    border-bottom: 1px solid #ddd;
+  }
+
+  .btn {
+    width: 100%;
+    padding: 32px;
+    box-sizing: border-box;
+    background-color: #fff;
+    display: flex;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+
+    span {
+      display: inline-block;
+      height: 92px;
+      line-height: 90px;
+      border-radius: 8px;
+      font-size: 34px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      box-sizing: border-box;
+      text-align: center;
+    }
+
+    .del {
+      color: #f46;
+      border: 1px solid #f46;
+      flex: 1;
+      margin-right: 32px;
+    }
+
+    .edit {
+      background-color: #3671EE;
+      color: #fff;
+      flex: 2;
+    }
+  }
+
+  .memberName {
+    height: 40px;
+  }
+
+  .tag {
+    margin-left: 32px;
+    padding: 4px 8px;
+    border-radius: 8px;
+    background: #26f;
+    color: #fff;
+  }
+}
+</style>
diff --git a/src/project/grid/AppGridManagement/selectGridMember.vue b/src/project/grid/AppGridManagement/selectGridMember.vue
new file mode 100644
index 00000000..59633a6a
--- /dev/null
+++ b/src/project/grid/AppGridManagement/selectGridMember.vue
@@ -0,0 +1,305 @@
+<template>
+  <section class="selectGridMember">
+    <div class="header-middle">
+      <div class="hint">
+        <span v-for="(item, index) in selectGridPath" :key="index"><span v-if="index" style="margin:0 4px;">/</span><span
+            style="color:#3F8DF5" @click="girdNameClick(item, index)">{{ item.girdName }}</span></span>
+      </div>
+      <div class="cards" v-for="(item, index) in treeList" :key="item.id" @click="itemClick(item)">
+        <div class="imges">
+          <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked"
+               @click.stop="girdClick(item, index)"/>
+          <img src="./components/img/xz.png" alt="" class="imgselect" v-else
+               @click.stop="girdClick(item, index)"/>
+          <img src="./components/img/gird--select-icon.png" alt="" class="avatras"/>
+        </div>
+        <div class="rightes">
+          <div class="applicationNames">{{ item.girdName }}</div>
+          <img src="./components/img/right-icon.png" alt="" class="imgs"/>
+        </div>
+      </div>
+      <div class="userCards" v-for="(e, index) in userList" :key="e.id">
+        <div class="imges">
+          <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="e.isChecked" @click="userClick(e, index)"/>
+          <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click="userClick(e, index)"/>
+          <img src="./components/img/tx@2x.png" alt="" class="avatras"/>
+        </div>
+        <div class="rights fill">
+          <div class="applicationNames">
+            <AiOpenData v-if="e.name" type="userName" :openid="e.name" style="display: block;"/>
+          </div>
+          <div class="idNumbers">{{ e.phone }}</div>
+        </div>
+      </div>
+      <AiEmpty description="暂无数据" v-if="!hasData"/>
+    </div>
+    <div class="subBtn" @click="submit">
+      <div>确定选择</div>
+    </div>
+
+  </section>
+</template>
+
+<script>
+export default {
+  name: "selectGridMember",
+  appName: "选择人员(网格成员)",
+  data() {
+    return {
+      selected: {},
+      allData: null,
+      treeList: [],
+      selectGridPath: [],
+      userList: [],
+    }
+  },
+  computed: {
+    hasData() {
+      return this.treeList?.length > 0 || this.userList?.length > 0
+    }
+  },
+  onLoad() {
+    this.selected.id = this.$route.query.id
+    this.getAllGrids()
+  },
+  onShow() {
+    document.title = '选择人员'
+  },
+  methods: {
+    getAllGrids() {
+      this.$http.post('/app/appgirdinfo/listByInfo').then((res) => {
+        if (res?.data) {
+          let parents = res.data.map(e => e.parentGirdId)
+          this.allData = res.data.map(e => ({...e, hasChildren: parents.includes(e.id)}))
+          this.gridInit()
+        }
+      })
+    },
+    gridInit() {
+      this.treeList = this.allData.filter(e => !e.parentGirdId)
+      this.selectGridPath = [{girdName: "可选范围", id: ''}]
+    },
+    itemClick({id, girdName}) {
+      this.selectGridPath.push({girdName, id})
+      this.getGridsAndUsersByParent(id)
+    },
+
+    getGridsAndUsersByParent(id) {
+      this.treeList = this.allData.filter(e => e.parentGirdId == id)
+      this.userList = []
+      this.$http.post(`/app/appgirdmemberinfo/listByGirdIdByThree?girdId=${id}`).then((res) => {
+        if (res?.data) {
+          this.userList = res.data.map(e => ({...e, isChecked: e.id == this.selected.id}))
+        }
+      })
+    },
+    girdNameClick(row, index) {
+      this.userList = []
+      if (!index) { //第一级别
+        this.gridInit()
+      } else {
+        let length = this.selectGridPath.length - index
+        this.selectGridPath.splice(index, length)
+        this.getGridsAndUsersByParent(row.id)
+      }
+    },
+    girdClick(row, index) {
+      if (this.treeList[index].isChecked) {//取消
+        this.treeList[index].isChecked = false
+        this.selected = {}
+      } else {
+        this.treeList.map((item, i) => {
+          item.isChecked = index == i
+        })
+        this.selected = {...row, kind: "grid"}
+      }
+      this.$forceUpdate()
+    },
+
+    userClick(row, index) {
+      if (this.userList[index].isChecked) {//取消
+        this.userList[index].isChecked = false
+        this.selected = {}
+      } else {
+        this.userList.map((item, i) => {
+          item.isChecked = index == i
+        })
+        this.selected = {...row, kind: "user"}
+      }
+      this.$forceUpdate()
+    },
+
+    submit() {
+      if (this.selected.id != null) {
+        uni.navigateBack({
+          success: () => {
+            uni.$emit("pagePicker:custom", this.selected)
+          }
+        })
+      } else {
+        return this.$u.toast('请选择网格或网格员')
+      }
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.selectGridMember {
+  height: 100%;
+  background: #fff;
+
+  .header-top {
+    background: #fff;
+    padding: 20px 32px;
+  }
+
+  .header-middle {
+    padding-bottom: 140px;
+
+    .hint {
+      padding: 28px 20px 28px 32px;
+      line-height: 56px;
+      box-shadow: 0 1px 0 0 #e4e5e6;
+      font-size: 30px;
+      font-weight: 500;
+      // word-break: break-all;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+
+    .empty-div {
+      height: 16px;
+      background: #f5f5f5;
+    }
+
+    .cards {
+      display: flex;
+      align-items: center;
+      height: 120px;
+      line-height: 120px;
+      padding: 0 0 0 32px;
+
+      .imges {
+        display: flex;
+        align-items: center;
+
+        .imgselect {
+          width: 48px;
+          height: 48px;
+          vertical-align: middle;
+        }
+
+        .avatras {
+          width: 74px;
+          height: 74px;
+          border-radius: 8px;
+          margin-left: 36px;
+        }
+      }
+
+      img {
+        width: 74px;
+        height: 74px;
+        border-radius: 8px;
+      }
+
+      .rightes {
+        width: calc(100% - 160px);
+        display: flex;
+        align-items: center;
+        margin-left: 32px;
+        border-bottom: 1px solid #e4e5e6;
+
+        .applicationNames {
+          flex: 1;
+          min-width: 0;
+          font-size: 36px;
+          font-weight: 500;
+          color: #333333;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+        }
+
+        .imgs {
+          width: 40px;
+          height: 40px;
+          margin-right: 20px;
+        }
+      }
+    }
+
+    .userCards {
+      display: flex;
+      align-items: center;
+      height: 120px;
+      line-height: 120px;
+      padding: 0 0 0 32px;
+
+      .imges {
+        display: flex;
+        align-items: center;
+
+        .imgselect {
+          width: 48px;
+          height: 48px;
+        }
+
+        .avatras {
+          width: 74px;
+          height: 74px;
+          border-radius: 8px;
+          margin-left: 36px;
+        }
+      }
+
+      .rights {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-left: 32px;
+        border-bottom: 1px solid #e4e5e6;
+        padding-right: 40px;
+        height: inherit;
+
+        .applicationNames {
+          font-size: 36px;
+          font-weight: 500;
+          color: #333333;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+        }
+
+        .idNumbers {
+          color: #666;
+        }
+      }
+    }
+  }
+
+  .subBtn {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 118px;
+    background: #f4f8fb;
+
+    div {
+      width: 192px;
+      height: 80px;
+      line-height: 80px;
+      text-align: center;
+      background: #1365dd;
+      border-radius: 4px;
+      font-size: 32px;
+      color: #fff;
+      margin: 20px 34px 0 0;
+      float: right;
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/AddSet.vue b/src/project/grid/AppHandSnapshot/AddSet.vue
new file mode 100644
index 00000000..8368f651
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/AddSet.vue
@@ -0,0 +1,215 @@
+<template>
+  <div class="AddSet">
+    <div class="contents">
+      <u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false">
+        <u-form-item label="事项分组" prop="title" required :border-bottom="false" right-icon="arrow-right">
+          <u-input v-model="forms.title" placeholder="请输入事项分组" />
+        </u-form-item>
+        <u-form-item label="类别" prop="status" required :border-bottom="false"> </u-form-item>
+        <div class="remove-item">
+          <img src="./components/img/remove-icon.png" alt="" />
+          <div class="input">
+            <u-input v-model="forms.status" placeholder="请输入" />
+          </div>
+        </div>
+        <div class="remove-item">
+          <img src="./components/img/add-icon.png" alt="" />
+          <div class="input color-2270F1">添加分类</div>
+        </div>
+      </u-form>
+    </div>
+
+    <!-- <div class="btn" @click="submit">保存</div> -->
+    <div class="footer">
+      <div class="remove">删除</div>
+      <div class="confirm" @click="submit">保存</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AddSet',
+  components: {},
+  props: {},
+  data() {
+    return {
+      forms: {
+        status: '',
+        content: '',
+        fileIds: [],
+      },
+      flag: false,
+      show: false,
+    }
+  },
+  methods: {
+    submit() {
+      if (this.flag) return
+
+      this.$refs.uForm.validate((valid) => {
+        if (valid) {
+          if (!this.forms.title) {
+            return this.$u.toast('请输入事项分组')
+          }
+
+          const imgs = []
+          if (this.forms.fileIds) {
+            this.forms.fileIds.map((e) => {
+              imgs.push({ url: e.url, id: e.id })
+            })
+          }
+
+          this.flag = true
+          this.$http
+            .post(`/app/appclapeventgroup/addOrUpdate`, {
+              title: this.forms.title,
+              content: this.forms.content,
+              // images: JSON.stringify(imgs) || [],
+              images: imgs || [],
+
+              people: this.forms.people,
+              phone: this.forms.phone,
+              id: this.id,
+            })
+            .then((res) => {
+              if (res.code == 0) {
+                this.$u.toast('发布成功')
+                this.flag = false
+                uni.navigateTo({ url: `./AppHandSnapshot` })
+              }
+            })
+        } else {
+          this.$u.toast('失败')
+        }
+      })
+    },
+
+    toSelectUser() {
+      console.log(123)
+      uni.navigateTo({ url: './SelectUser' })
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.AddSet {
+  height: 100%;
+  .contents {
+    ::v-deep .u-form {
+      .u-form-item {
+        padding: 0 45px !important;
+        .u-form-item__body {
+          .u-form-item--right__content__slot {
+            padding-bottom: 0;
+            .u-input {
+              text-align: right !important;
+            }
+          }
+        }
+      }
+
+      .u-form-item:first-child {
+        .u-form-item__body {
+          border-bottom: 1px solid #ddd;
+        }
+      }
+
+      .line {
+        height: 24px;
+        background: #f3f6f9;
+      }
+
+      .contents {
+        padding-bottom: 20px !important;
+        .u-form-item__body {
+          .u-form-item--right__content__slot {
+            .u-input {
+              text-align: left !important;
+            }
+          }
+        }
+      }
+
+      .avatars {
+        padding-bottom: 20px !important;
+        .u-form-item__body {
+          .default {
+            width: 160px;
+            height: 160px;
+          }
+        }
+      }
+    }
+  }
+  .remove-item {
+    padding: 42px 0 42px 32px;
+    box-sizing: border-box;
+    background-color: #fff;
+    img {
+      width: 36px;
+      height: 36px;
+      margin-right: 12px;
+      vertical-align: middle;
+    }
+    .input {
+      display: inline-block;
+      width: calc(100% - 48px);
+      height: 36px;
+      line-height: 36px;
+    }
+    .color-2270F1 {
+      color: #2270f1;
+      font-size: 30px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      line-height: 42px;
+    }
+  }
+
+  .btn {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    box-sizing: border-box;
+    background: #3975c6;
+    padding: 34px 0;
+    text-align: center;
+    font-size: 32px;
+    font-weight: 500;
+    color: #ffffff;
+  }
+
+  .footer {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    box-sizing: border-box;
+    background: #fff;
+    padding: 32px;
+    display: flex;
+    justify-content: space-between;
+    div {
+      height: 92px;
+      line-height: 92px;
+      box-sizing: border-box;
+      text-align: center;
+      border-radius: 8px;
+      font-size: 34px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+    }
+    .remove {
+      flex: 1;
+      border: 1px solid #f46;
+      color: #f46;
+      margin-right: 32px;
+    }
+    .confirm {
+      flex: 2;
+      background: #3975c6;
+      color: #fff;
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/AppHandSnapshot.vue b/src/project/grid/AppHandSnapshot/AppHandSnapshot.vue
new file mode 100644
index 00000000..69122920
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/AppHandSnapshot.vue
@@ -0,0 +1,155 @@
+<template>
+  <div class="AppHandSnapshot">
+    <component v-if="refresh && isAdmin" :is="component" @change="onChange" :params="params"> </component>
+    <div class="tabs" v-if="isTab && isAdmin">
+      <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index">
+        <img :src="tabIndex == index ? item.activeImg : item.img" alt="" />
+        <p :class="tabIndex == index ? 'color-3267F0' : ''">{{ item.text }}</p>
+      </div>
+    </div>
+    <div v-if="!isAdmin" class="empty">
+      <img src="./components/img/no-admin.png" alt="">
+      <p>没有网格员权限<br />无法查看随手拍信息哦~</p>
+    </div>
+  </div>
+</template>
+
+<script>
+import List from './List.vue'
+import Statistics from './Statistics.vue'
+import Set from './Set.vue'
+
+export default {
+  name: 'AppHandSnapshot',
+  appName: '随手拍',
+
+  data() {
+    return {
+      component: 'List',
+      params: {},
+      refresh: true,
+      tabIndex: 0,
+      tabs: [
+        {
+          img: require('./components/img/handle-icon.png'),
+          activeImg: require('./components/img/handle-icon-active.png'),
+          text: '办理',
+          component: 'List',
+        },
+        {
+          img: require('./components/img/statistics-icon.png'),
+          activeImg: require('./components/img/statistics-icon-active.png'),
+          text: '统计',
+          component: 'Statistics',
+        },
+        // {
+        //   img: require('./components/img/set-icon.png'),
+        //   activeImg: require('./components/img/set-icon-active.png'),
+        //   text: '配置',
+        //   component: 'Set'
+        // }
+      ],
+      isTab: true,
+      isAdmin: false
+    }
+  },
+
+  components: {
+    List,
+    Statistics,
+    Set,
+  },
+
+  methods: {
+    onChange(e) {
+      this.params = e.params
+      this.component = e.type
+    },
+    tabClick(index, component) {
+      this.tabIndex = index
+      this.component = component
+      this.refresh = false
+      this.$nextTick(() => {
+        this.refresh = true
+      })
+    },
+    isGirdUser() {
+      this.isAdmin = false
+      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
+        if (res.code == 0) {
+          if (res.data.checkType != '0') {
+            this.isAdmin = true
+          }
+        }
+      })
+    },
+  },
+  onLoad() {
+    this.isGirdUser()
+  },
+  onShow() {
+    document.title = '随手拍'
+    uni.$on('hideTab', () => {
+      this.isTab = false
+    })
+    uni.$on('showTab', () => {
+      this.isTab = true
+    })
+
+  },
+  onReachBottom() {
+    if(!this.tabIndex) {
+      uni.$emit('nextList')
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppHandSnapshot {
+  height: 100%;
+}
+.tabs {
+  width: 100%;
+  height: 98px;
+  background: #fff;
+  border-top: 1px solid #ddd;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  display: flex;
+  .item {
+    flex: 1;
+    text-align: center;
+    img {
+      width: 56px;
+      height: 56px;
+      margin-top: 8px;
+    }
+    p {
+      font-size: 22px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #c4cad4;
+      line-height: 8px;
+    }
+    .color-3267F0 {
+      color: #3267f0;
+    }
+  }
+}
+.empty{
+  text-align: center;
+  img{
+    width: 282px;
+    height: 306px;
+    margin: 136px auto 0;
+  }
+  p{
+    font-size: 28px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    color: #999;
+    line-height: 40px;
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/Content.vue b/src/project/grid/AppHandSnapshot/Content.vue
new file mode 100644
index 00000000..4e7f1344
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/Content.vue
@@ -0,0 +1,235 @@
+<template>
+  <div class="Transfer">
+    <div class="contents">
+      <u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false">
+        <u-form-item label="转交给" prop="status" required :border-bottom="false" right-icon="arrow-right" class="first-form" v-if="status == 1">
+          <u-input v-model="forms.name" placeholder="请选择转交对象" @click="toSelectUser" disabled />
+        </u-form-item>
+        <u-form-item label="事件分类" prop="groupName" required :border-bottom="false" right-icon="arrow-right" v-if="status != 1">
+          <!-- <u-input v-model="forms.groupName" placeholder="请选择事件分类"  /> -->
+          <span @click="show = true" class="right-span" :style="forms.groupName ? '' : 'color:#999;'">{{forms.groupName || '请选择事件分类'}}</span>
+
+          <u-select v-model="show" :list="myList" value-name="id" label-name="groupName" @confirm="selectStatus"></u-select>
+        </u-form-item>
+
+        <u-form-item :label="status == 3 ? '办结意见' : status == 2 ? '拒绝受理意见' : '办理意见'" prop="content" required :border-bottom="false" label-position="top" class="contents">
+          <u-input v-model="forms.content" :placeholder="status == 2 ? '请写下拒绝受理意见…' : '请写下你的办结意见...'" type="textarea" auto-height height="100" maxlength="500" />
+        </u-form-item>
+
+        <div class="line"></div>
+
+        <u-form-item label="图片上传(最多9张)" prop="files" :border-bottom="false" class="avatars" label-position="top">
+          <AiUploader :def.sync="forms.files" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
+        </u-form-item>
+
+      </u-form>
+    </div>
+
+    <div class="btn" v-if="this.status == 1" @click="confirm">
+      <span>转交事件</span>
+    </div>
+
+    <div class="btn" v-if="this.status == 2" @click="confirm">
+      <span>拒绝受理</span>
+    </div>
+
+    <div class="btn" v-if="this.status == 3" @click="confirm">
+      <span>我已办结</span>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Content',
+  components: {},
+  props: {},
+  data() {
+    return {
+      forms: {
+        groupName: '',
+        groupId: '',
+        content: '',
+        files: [],
+        name: ''
+      },
+      flag: false,
+      show: false,
+      status: '',  //1转交  2拒绝受理  3我已办结
+      myList: [],
+      id: '',
+      selectUser: {},
+      titleList: ['', '转交事件', '拒绝受理', '我已办结']
+    }
+  },
+  onLoad(option) {
+    this.status = option.status
+    this.id = option.id
+    this.forms.groupId = option.groupId
+    this.forms.groupName = option.groupName
+    this.typeList()
+    uni.$on('goback', (res) => {
+      this.selectUser = res
+      if(res.name) {
+        this.forms.name = res.name
+      }else{
+        this.forms.name = res.girdName
+      }
+    })
+  },
+  onShow() {
+    console.log(this.titleList[this.status])
+    document.title = this.titleList[this.status]
+  },
+  methods: {
+
+    typeList() {
+      this.$http.post(`/app/appclapeventgroup/list`, null, {
+        params: {
+          size: 9999,
+        },
+      })
+      .then((res) => {
+        if (res.code == 0) {
+          this.myList = res.data.records
+          this.$forceUpdate()
+        }
+      })
+    },
+
+    confirm() {
+      if(this.status == 1 && !this.forms.name) {
+        return this.$u.toast('请选择转交对象')
+      }
+      if(this.status != 1 && !this.forms.groupName) {
+        return this.$u.toast('请选择分类')
+      }
+      if(this.status != 1 && !this.forms.content) {
+        return this.$u.toast('请输入意见')
+      }
+      this.submit()
+    },
+    submit() {  //status 1转交  2拒绝受理  3我已办结
+      var url = '', successText= '', params= ''
+      if(this.status == 1) {
+        url = `/app/appclapeventinfo/transfer`
+        successText = '转交成功'
+        params = {
+          ...this.forms,
+          girdId: this.selectUser.id,
+          girdName: this.selectUser.girdName,
+        }
+        if(this.selectUser.name) { //选择的网格员
+          params.girdId = this.selectUser.girdId
+          params.girdMemberId = this.selectUser.id
+          params.girdMemberName = this.selectUser.name
+        }
+      }
+      if(this.status == 2) {
+        url = `/app/appclapeventinfo/refuse`
+        successText = '拒绝成功'
+        params = {...this.forms}
+      }
+      if(this.status == 3) {
+        url = `/app/appclapeventinfo/finishByGirdMember`
+        successText = '办结成功'
+        params = {...this.forms}
+      }
+      params.id = this.id
+      this.$http.post(url, params).then((res) => {
+        if (res.code == 0) {
+          this.$u.toast(successText)
+          uni.$emit('updateDeatil')
+          uni.$emit('getListInit')
+          setTimeout(() => {
+            if(this.status == 1) {
+              uni.navigateBack({delta: 2})
+            }else {
+              uni.navigateBack()
+            }
+          },600)
+        }
+      })
+    },
+    selectStatus(e) {
+      this.forms.groupName = e[0].label
+      this.forms.groupId = e[0].value
+    },
+    toSelectUser() {
+      uni.navigateTo({ url: './SelectUser' })
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.Transfer {
+  height: 100%;
+  .contents {
+    padding-bottom: 140px;
+    ::v-deep .u-form {
+      .u-form-item {
+        padding: 0 45px !important;
+        .u-form-item__body {
+          .u-form-item--right__content__slot {
+            padding-bottom: 0;
+            .u-input {
+              text-align: right !important;
+            }
+          }
+        }
+      }
+
+      .u-form-item:first-child {
+        .u-form-item__body {
+          border-bottom: 1px solid #ddd;
+        }
+      }
+
+      .line {
+        height: 24px;
+        background: #f3f6f9;
+      }
+
+      .contents {
+        padding-bottom: 20px !important;
+        .u-form-item__body {
+          .u-form-item--right__content__slot {
+            .u-input {
+              text-align: left !important;
+            }
+          }
+        }
+      }
+
+      .avatars {
+        padding-bottom: 20px !important;
+        .u-form-item__body {
+          .default {
+            width: 160px;
+            height: 160px;
+          }
+        }
+      }
+    }
+  }
+
+  .btn {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    box-sizing: border-box;
+    background: #3975c6;
+    padding: 34px 0;
+    text-align: center;
+    font-size: 32px;
+    font-weight: 500;
+    color: #ffffff;
+  }
+  .right-span{
+    display: inline-block;
+    width: 100%;
+    text-align: right;
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/Detail.vue b/src/project/grid/AppHandSnapshot/Detail.vue
new file mode 100644
index 00000000..2de9cb91
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/Detail.vue
@@ -0,0 +1,449 @@
+<template>
+  <div class="Detail">
+    <div class="header-top">
+      <div class="avatars" v-if="data.name">{{ data.name.substring(data.name.length, data.name.length - 2) }}</div>
+
+      <div class="right">
+        <div class="names">{{ data.name }}的上报</div>
+
+        <div class="times">{{ data.createTime }}</div>
+      </div>
+    </div>
+
+    <div class="header-middle">
+      <div class="titles">{{ data.content }}</div>
+
+      <span class="status status0" :class="data.eventStatus == 0 ? 'status0' : data.eventStatus == 1 ? 'status1' : data.eventStatus == 2 ? 'status2' : 'status3'" v-if="data.eventStatus"> {{ $dict.getLabel('clapEventStatus', data.eventStatus) }}</span>
+
+      <div class="card">
+        <span class="card-left">事件类型</span>
+        <span class="card-right">{{ data.groupName }}</span>
+      </div>
+
+      <div class="card">
+        <span class="card-left">所属网格</span>
+        <span class="card-right">{{ data.girdName }}</span>
+      </div>
+
+      <div class="card">
+        <span class="card-left">联系方式</span>
+        <span class="card-right">
+          <span> {{ data.phone }}</span>
+          <u-icon name="phone-fill" color="#3D94FB" @click="callPhone(data.phone)"></u-icon>
+        </span>
+      </div>
+
+      <div class="card">
+        <span class="card-left">上报地址</span>
+        <span class="card-right">
+          <span>{{ data.address }}</span>
+        </span>
+      </div>
+
+      <!-- 暂时先去掉 -->
+
+      <!-- <div class="card">
+        <span class="card-left">上报来源</span>
+        <span class="card-right">三角湖居民社群 李毅 小程序填报三角湖居民社群 李毅 小程序填报三角湖居民社群 李毅 小程序填报</span>
+      </div> -->
+
+      <div class="cards">
+        <span class="card-left" style="color:#999">照片</span>
+      </div>
+
+      <img :src="item.url" alt="" v-for="(item, i) in data.files" :key="i"  @click="previewImage(data.files, item.url)" />
+    </div>
+
+    <div class="header-bottom">
+      <div class="line"></div>
+
+      <div class="plan">
+        <div class="nav">
+          <span>办理进度</span>
+          <span> ({{ $dict.getLabel('clapEventStatus', data.eventStatus) }})</span>
+        </div>
+
+        <div class="cards" v-for="(item, index) in data.processList" :key="index">
+          <div class="cardss">
+            <div class="cardss-left">
+              <span>
+                <!-- {{ item.systemExplain }} -->
+                {{ item.girdMemberName && item.girdMemberName.substring(item.girdMemberName.length, item.girdMemberName.length - 2) }}
+              </span>
+
+              <!-- <img src="./components/1.png" class="avatarIcon" alt="" /> -->
+            </div>
+
+            <div class="cardss-right">
+              <div class="cardsss-right-left">
+                <div class="cardssss-right-left-top">
+                  <span>{{ item.systemExplain }}</span>
+                  <div style="color: #2ea222; font-size: 16px; margin-top: 5px">
+                    {{ $dict.getLabel('clapDoStatus', item.doStatus) }}
+                  </div>
+                </div>
+              </div>
+
+              <div class="cardees-right-right">{{ item.doTime }}</div>
+            </div>
+
+            <div class="lines"></div>
+          </div>
+
+          <div class="cardes-msg-top" v-if="item.doExplain">{{ item.doExplain }}</div>
+
+          <div class="imgs">
+            <img :src="e.url" alt="" v-for="(e, index) in item.files" :key="index"  @click="previewImage(item.files, e.url)" />
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="fixedBtn">
+      <div class="status00" v-if="data.eventStatus == 0">
+        <div class="columns border-r" @click="toContent(1)">
+          <!-- <img src="./components/img/zhuanjiao.png" alt="" /> -->
+          <span class="hint">转交事件</span>
+        </div>
+
+        <div class="columns" @click="toContent(2)">
+          <!-- <img src="./components/img/jujue.png" alt="" /> -->
+          <span class="hint">拒绝受理</span>
+        </div>
+
+        <div class="doIt" @click="doItShow = true">我来受理</div>
+      </div>
+
+      <div class="endDoIt" v-if="data.eventStatus == 1 && data.rightType == 0" @click="toContent(3)">前往办理</div>
+    </div>
+
+    <u-modal v-model="doItShow" :mask-close-able="true" z-index="99" content="确定受理该事件?" :show-cancel-button="true" @confirm="doThings"></u-modal>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Detail',
+  components: {},
+  props: {},
+  data() {
+    return {
+      data: {},
+      id: '',
+      doItShow: false,
+    }
+  },
+  computed: {},
+  watch: {},
+  onLoad(o) {
+    this.id = o.id
+    this.$dict.load('realityStatus', 'clapDoStatus').then(() => {
+      this.getDetail()
+    })
+
+    uni.$on('updateDeatil', () => {
+      this.getDetail()
+    })
+  },
+  onShow() {
+    document.title = '随手拍'
+  },
+  methods: {
+    getDetail() {
+      this.$http.post(`/app/appclapeventinfo/queryDetailById?id=${this.id}`).then((res) => {
+        if (res?.data) {
+          this.data = res.data
+        }
+      })
+    },
+
+    callPhone(phone) {
+      uni.makePhoneCall({ phoneNumber: phone })
+    },
+
+    doThings() {
+      this.$http.post(`/app/appclapeventinfo/acceptance?id=${this.id}`).then((res) => {
+        if (res.code == 0) {
+          this.getDetail()
+        }
+      })
+    },
+
+    toContent(status) {
+      uni.navigateTo({ url: `./Content?status=${status}&groupId=${this.data.groupId}&groupName=${this.data.groupName}&id=${this.id}` })
+    },
+    previewImage(images, img) {
+      uni.previewImage({
+        urls: images.map(v => v.url),
+        current: img
+      })
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+uni-page-body {
+  height: 100%;
+}
+.Detail {
+  height: 100%;
+  background: #fff;
+
+  .header-top {
+    display: flex;
+    margin: 26px 0 14px 0;
+    padding: 0 32px;
+    .avatars {
+      width: 80px;
+      height: 80px;
+      line-height: 80px;
+      background: #3975c6;
+      border-radius: 50%;
+      color: #fff;
+      text-align: center;
+      font-size: 28px;
+      font-weight: 500;
+      margin-right: 16px;
+    }
+    .right {
+      .names {
+        font-size: 32px;
+        font-weight: 500;
+      }
+      .times {
+        margin-top: 10px;
+        font-size: 28px;
+        color: #999999;
+      }
+    }
+  }
+
+  .header-middle {
+    padding: 0 32px 10px 32px;
+    .titles {
+      margin: 32px 0;
+      line-height: 1.4;
+      word-break: break-all;
+      font-size: 40px;
+      font-weight: 600;
+    }
+    .status {
+      display: inline-block;
+      margin-bottom: 14px;
+      padding: 4px 8px;
+      font-size: 26px;
+      color: #ffffff;
+      border-radius: 8px;
+    }
+    .status0 {
+      background: #ff883c;
+    }
+
+    .status1 {
+      background: #1aaaff;
+    }
+
+    .status2 {
+      background: #42d784;
+    }
+
+    .status3 {
+      background: #ff4466;
+    }
+
+    .card {
+      display: flex;
+      justify-content: space-between;
+      padding: 34px 0;
+      border-bottom: 1px solid #ddd;
+      .card-left {
+        width: 46%;
+        font-size: 32px;
+        color: #999999;
+      }
+      .card-right {
+        font-size: 32px;
+        .u-icon {
+          margin-left: 8px;
+        }
+      }
+    }
+
+    // .card:last-child {
+    //   border-bottom: none;
+    // }
+
+    .cards {
+      padding: 34px 0;
+    }
+
+    img {
+      width: 225px;
+      height: 226px;
+      margin-right: 8px;
+    }
+    img:nth-child(3n) {
+      margin-right: 0;
+    }
+  }
+
+  .header-bottom {
+    padding-bottom: 80px;
+    .line {
+      height: 16px;
+      background: #f3f6f9;
+    }
+
+    .plan {
+      padding: 0 32px;
+      .nav {
+        padding: 26px 0;
+      }
+
+      .cards {
+        position: relative;
+        padding-bottom: 80px;
+        .cardss {
+          display: flex;
+          justify-content: space-between;
+
+          .cardss-left {
+            position: relative;
+            width: 80px;
+            height: 80px;
+            text-align: center;
+            line-height: 80px;
+            color: #fff;
+            background: #197df0;
+            border: 1px solid #dddddd;
+            border-radius: 50%;
+            font-size: 28px;
+            z-index: 9;
+            // img {
+            //   width: 100%;
+            //   height: 100%;
+            //   border-radius: 50%;
+            // }
+            .avatarIcon {
+              position: absolute;
+              bottom: 0;
+              right: 0;
+              width: 38px;
+              height: 38px;
+            }
+          }
+          .cardss-right {
+            width: calc(100% - 110px);
+            display: flex;
+            justify-content: space-between;
+            .cardsss-right-left {
+              .cardssss-right-left-top {
+                width: 300px;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                font-size: 32px;
+              }
+              .cardssss-right-left-bottom {
+                margin-top: 10px;
+                font-size: 28px;
+                color: #666666;
+              }
+            }
+            .cardees-right-right {
+              font-size: 28px;
+              color: #999999;
+            }
+          }
+          .lines {
+            position: absolute;
+            top: 0;
+            left: 40px;
+            width: 4px;
+            height: 100%;
+            background: #eeeeee;
+          }
+        }
+        .cardes-msg-top {
+          font-size: 28px;
+          color: #343d65;
+          margin-top: 10px;
+          margin-left: 110px;
+        }
+
+        .imgs {
+          margin-top: 10px;
+          margin-left: 110px;
+          img {
+            width: 136px;
+            height: 136px;
+            border-radius: 4px;
+            margin-right: 12px;
+          }
+          img:nth-child(4n) {
+            margin-right: 0;
+          }
+        }
+      }
+      .cards:last-child {
+        .lines {
+          width: 0;
+          height: 0;
+        }
+      }
+    }
+  }
+
+  .fixedBtn {
+    background: #fff;
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    box-sizing: border-box;
+    z-index: 999;
+    .status00 {
+      display: flex;
+
+      .columns {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        width: 22%;
+        padding: 16px 0;
+        border-top: 1px solid #ddd;
+        img {
+          width: 44px;
+          height: 42px;
+        }
+        .hint {
+          margin-top: 4px;
+          font-size: 28px;
+          color: #666666;
+        }
+      }
+      .border-r {
+        border-right: 1px solid #ddd;
+      }
+      .doIt {
+        width: 56%;
+        background: #3975c6;
+        text-align: center;
+        line-height: 112px;
+        font-size: 36px;
+        font-weight: 500;
+        color: #fff;
+      }
+    }
+
+    .endDoIt {
+      background: #3975c6;
+      text-align: center;
+      padding: 34px 0;
+
+      font-size: 32px;
+      font-weight: 500;
+      color: #ffffff;
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/List.vue b/src/project/grid/AppHandSnapshot/List.vue
new file mode 100644
index 00000000..82a31199
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/List.vue
@@ -0,0 +1,310 @@
+<template>
+  <div class="list">
+    <AiTopFixed>
+      <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#3975C6" inactive-color="#fff" active-color="#fff" @change="change"></u-tabs>
+      <div class="select-top">
+        <div class="tab-item" @click="show = true">
+          <span class="color-666">{{girdNameText}}</span>
+          <img src="./components/img/down-icon.png" alt="" />
+        </div>
+
+        <u-select v-model="show" :list="myGirdList" value-name="id" label-name="girdName" @confirm="confirm"></u-select>
+
+        <div class="tab-item" @click="showType = true">
+          <span class="color-666">{{eventStatusText}}</span>
+          <img src="./components/img/down-icon.png" alt="" />
+        </div>
+
+        <u-select v-model="showType" :list="listType" value-name="dictValue" label-name="dictName" @confirm="confirm"></u-select>
+      </div>
+    </AiTopFixed>
+
+    <template >
+      <AiCard v-for="(item, i) in datas" :key="i" @click.native="goDetail(item, 1)">
+        <template #custom>
+          <div class="card-top">
+            <div class="titles">{{ item.content }}</div>
+
+            <div class="types">
+              <span>事件类型</span>
+              <span class="types-right">{{ item.groupName }}</span>
+            </div>
+
+            <div class="gards">
+              <span>所属网格</span>
+              <span class="gards-right">{{ item.girdName }}</span>
+            </div>
+          </div>
+
+          <div class="status" :class="item.eventStatus == 0 ? 'status0' : item.eventStatus == 1 ? 'status1' : item.eventStatus == 2 ? 'status2' : 'status3'" v-if="item.eventStatus">
+            <span class="icon"></span>
+            <span>
+              {{ $dict.getLabel('clapEventStatus', item.eventStatus) }}
+            </span>
+          </div>
+        </template>
+      </AiCard>
+      <AiEmpty v-if="!datas.length"></AiEmpty>
+    </template>
+
+    <div class="pad-b120" v-if="datas.length"></div>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+
+export default {
+  props: {},
+  data() {
+    return {
+      datas: [],
+      tabList: [
+        {
+          name: '全部待办',
+        },
+        {
+          name: '办件历史',
+        },
+      ],
+      currentTabs: 0,
+      current: 1,
+      pages: 0,
+      show: false,
+      myGirdList: [],
+      girdId: '',
+      girdNameText: '所属网格',
+      showType: false,
+      listType: [],
+      eventStatus: '',
+      eventStatusText: '办件状态',
+      listTypeHistory: [],
+      listTypeAll: []
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+
+    loadmore() {
+      return this.pages <= this.current ? 'loading ' : 'nomore'
+    },
+  },
+  mounted() {
+    this.current = 1
+    this.girdList()
+    this.getList()
+    uni.$on('nextList', ()=>{
+      this.current ++
+      this.getList()
+    })
+    uni.$on('getListInit', ()=>{
+      this.current = 1
+      this.getList()
+    })
+
+  },
+  onShow() {
+    document.title = '随手拍'
+  },
+  created() {
+    this.$dict.load('clapEventStatus', 'clapEventStatusAll', 'clapEventStatusHistory').then(() => {
+      this.getList()
+      this.listTypeAll = this.$dict.getDict('clapEventStatusAll')
+      this.listTypeHistory = this.$dict.getDict('clapEventStatusHistory')
+      this.listType = this.listTypeAll
+    })
+  },
+  methods: {
+    getList() {
+      this.$http
+        .post(`/app/appclapeventinfo/listByGirdMember`, null, {
+          params: {
+            size: 10,
+            current: this.current,
+            searchType: this.currentTabs == 1 ? '1' : '0',
+            eventStatus: this.eventStatus,
+            girdId: this.girdId
+          },
+        })
+        .then((res) => {
+          if (res.code == 0) {
+            this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records
+            this.pages = res.data.pages
+            this.$forceUpdate()
+          }
+        })
+    },
+
+    girdList() {
+      this.$http.post(`/app/appgirdmemberinfo/queryMyGirdListWithOut01`, null, {
+        params: {
+          size: 9999,
+        },
+      })
+      .then((res) => {
+        if (res.code == 0) {
+          this.myGirdList = res.data
+          var all = {
+            id: '',
+            girdName: '全部'
+          }
+          this.myGirdList.unshift(all)
+        }
+      })
+    },
+
+    confirm(e) {
+      if (this.show) {
+        this.girdNameText = e[0].label
+        this.girdId = e[0].value
+      }
+      if (this.showType) {
+        this.eventStatus = e[0].value
+        this.eventStatusText = e[0].label
+      }
+
+      this.current = 1
+      this.getList()
+    },
+
+    goDetail(item) {
+      uni.navigateTo({ url: `./Detail?id=${item.id}` })
+    },
+
+    change(index) {
+      this.current = 1
+      this.datas = []
+      this.eventStatus = ''
+      this.girdId = ''
+      this.girdNameText = '所属网格'
+      this.eventStatusText = '办件状态'
+      this.currentTabs = index
+      if(index == 0) {
+        this.listType = this.listTypeAll
+      }else {
+        this.listType = this.listTypeHistory
+      }
+      this.getList()
+    },
+
+    linkTo(url) {
+      uni.navigateTo({ url })
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+uni-page-body {
+  height: 100%;
+}
+.list {
+  height: 100%;
+  .select-top {
+    background: #fff;
+    display: flex;
+    padding: 24px 0;
+    .tab-item {
+      flex: 1;
+      text-align: center;
+      line-height: 48px;
+      font-size: 26px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #666;
+      img {
+        width: 32px;
+        height: 32px;
+        margin-left: 8px;
+        vertical-align: middle;
+      }
+    }
+    .tab-item:nth-of-type(1) {
+      border-right: 1px solid #eee;
+    }
+  }
+  ::v-deep .AiTopFixed .content {
+    padding: 0;
+  }
+  ::v-deep .AiCard {
+    background: #f3f6f9;
+    padding: 24px 40px 0 32px;
+    .start {
+      background: #fff;
+      border-radius: 16px;
+      .card-top {
+        padding: 32px;
+        .titles {
+          margin-bottom: 34px;
+          font-size: 32px;
+          font-weight: 500;
+          color: #333333;
+          line-height: 1.4;
+          word-break: break-all;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 2;
+          -webkit-box-orient: vertical;
+        }
+        .types,
+        .gards {
+          margin-top: 8px;
+          font-size: 26px;
+          .types-right,
+          .gards-right {
+            margin-left: 32px;
+            color: #333333;
+          }
+        }
+      }
+
+      .status {
+        padding: 32px;
+        border-top: 1px solid #dddddd;
+        .icon {
+          display: inline-block;
+          width: 8px;
+          height: 8px;
+          vertical-align: middle;
+          margin-right: 8px;
+        }
+      }
+
+      .status0 {
+        color: #ff883c;
+        .icon {
+          background: #ff883c;
+        }
+      }
+
+      .status1 {
+        color: #1aaaff;
+        .icon {
+          background: #1aaaff;
+        }
+      }
+
+      .status2 {
+        color: #42d784;
+        .icon {
+          background: #42d784;
+        }
+      }
+
+      .status3 {
+        color: #ff4466;
+        .icon {
+          background: #ff4466;
+        }
+      }
+    }
+  }
+  // ::v-deep .AiCard:last-child {
+  //   padding-bottom: 24px;
+  // }
+  .pad-b120 {
+    background-color: #f3f6f9;
+    padding-bottom: 120px;
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/PercentageDetail.vue b/src/project/grid/AppHandSnapshot/PercentageDetail.vue
new file mode 100644
index 00000000..d0c2ea1f
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/PercentageDetail.vue
@@ -0,0 +1,211 @@
+<template>
+  <div class="PercentageDetail">
+    <div class="header">
+      <div class="left">
+        <h2>小区管理</h2>
+        <p>共21条，已办结18条</p>
+      </div>
+      <div class="right">
+        <h4>86%</h4>
+        <p>办结率</p>
+      </div>
+    </div>
+    <div class="info-content">
+      <div class="title">分类统计</div>
+      <div class="percentage">
+        <div class="item">
+          <div class="mini-title">小区管理</div>
+          <div class="info">
+            <div class="line-bg"><div class="active-bg"></div></div>共11条 | 已办结9
+          </div>
+        </div>
+        <div class="item">
+          <div class="mini-title">小区管理</div>
+          <div class="info">
+            <div class="line-bg" style="width:44%;"><div class="active-bg"></div></div>共11条 | 已办结9
+          </div>
+        </div>
+        <div class="item">
+          <div class="mini-title">小区管理</div>
+          <div class="info">
+            <div class="line-bg" style="width:30%;"><div class="active-bg"></div></div>共11条 | 已办结9
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {},
+  data() {
+    return {
+      contents: [
+        {
+          label: '待受理',
+          num: 5
+        },
+        {
+          label: '办理中',
+          num: 5
+        },
+        {
+          label: '今日上报',
+          num: 5
+        },
+        {
+          label: '今日办结',
+          num: 5
+        }
+      ]
+    }
+  },
+  onLoad() {
+
+  },
+  onShow() {},
+  methods: {
+    getList() {
+      this.$http
+        .post('/app/appvisitvondolence/list', null, {
+          params: {
+            size: this.size,
+            current: this.current,
+            createUserId: this.currentTabs == 1 ? this.user.id : '',
+          },
+        })
+        .then((res) => {
+          if (res.code == 0) {
+            this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records
+            this.pages = res.data.pages
+          }
+        })
+    },
+
+    goDetail(item) {
+      uni.navigateTo({ url: `./Detail?id=${item.id}` })
+    },
+
+    change(index) {
+      this.currentTabs = index
+      this.getList()
+    },
+  },
+  onReachBottom() {
+    this.current = this.current + 1
+    this.getList()
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.PercentageDetail {
+  background-color: #F3F7F8;
+  padding: 32px 30px 0;
+  .header{
+    width: 100%;
+    background: #FFF;
+    border-radius: 16px;
+    margin-bottom: 30px;
+    display: flex;
+    padding: 32px 32px 38px 24px;
+    box-sizing: border-box;
+    .left{
+      width: calc(100% - 112px);
+      h2{
+        font-size: 42px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        font-weight: 400;
+        color: #333;
+        line-height: 48px;
+        margin-bottom: 16px;
+      }
+      p{
+        font-size: 30px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #999;
+        line-height: 42px;
+      }
+    }
+    .right{
+      width: 112px;
+      background: #E6FFF1;
+      border-radius: 8px;
+      text-align: center;
+      color: #42D784;
+      h4{
+        font-size: 36px;
+        font-family: DINAlternate-Bold, DINAlternate;
+        font-weight: bold;
+        line-height: 42px;
+        padding: 8px 0 4px 0;
+      }
+      p{
+        font-size: 24px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        line-height: 34px;
+      }
+    }
+  }
+  .info-content{
+    width: 100%;
+    background: #FFF;
+    border-radius: 16px;
+    margin-bottom: 24px;
+    .title{
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #333;
+      line-height: 48px;
+      padding: 24px 16px 24px 24px;
+      img{
+        float: right;
+        width: 40px;
+        height: 40px;
+      }
+    }
+    .percentage{
+      padding: 16px 0 0 26px;
+      .item{
+        width: 100%;
+        padding-bottom: 32px;
+        .mini-title{
+          font-size: 30px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          color: #333;
+          line-height: 48px;
+          margin-bottom: 14px;
+        }
+        .info{
+          width: 100%;
+          font-size: 28px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          color: #999;
+          line-height: 48px;
+          .line-bg{
+            display: inline-block;
+            width: 56%;
+            height: 14px;
+            background: #D7D8D9;
+            border-radius: 8px;
+            margin-right: 12px;
+            .active-bg{
+              width: 80%;
+              height: 100%;
+              background: #257FF1;
+              border-radius: 8px;
+            }
+          }
+          img{
+            width: 32px;
+            height: 32px;
+            vertical-align: middle;
+          }
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppGridManagement/SelectUser.vue b/src/project/grid/AppHandSnapshot/SelectUser.vue
similarity index 50%
rename from src/project/grid/AppGridManagement/SelectUser.vue
rename to src/project/grid/AppHandSnapshot/SelectUser.vue
index a3202df9..1385cd20 100644
--- a/src/project/grid/AppGridManagement/SelectUser.vue
+++ b/src/project/grid/AppHandSnapshot/SelectUser.vue
@@ -2,15 +2,35 @@
   <div class="SelectUser">
     <div class="header-middle">
       <div class="hint">
-        <u-search v-model="name" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="getListInit" :clearabled="false"></u-search>
+        <span v-for="(item, index) in slectList" :key="index"><span v-if="index" style="margin:0 4px;">/</span><span style="color:#3F8DF5" @click="girdNameClick(item, index)">{{item.girdName}}</span></span>
       </div>
 
-      <div class="showUsers">
+      <div class="showTypes" v-if="!userList.length">
+        <div v-if="treeList.length > 0">
+          <div class="cards" v-for="(item, index) in treeList" :key="index" @click="itemClick(item)">
+            <div class="imges">
+              <span v-if="item.girdLevel == 2">
+                <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" @click.stop="girdClick(item, index)" />
+                <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)" />
+              </span>
+              <img src="./components/img/gird--select-icon.png" alt="" class="avatras" />
+            </div>
+            <div class="rightes">
+              <div class="applicationNames">{{ item.girdName }}</div>
+              <img src="./components/img/right-icon.png" alt="" class="imgs" />
+            </div>
+          </div>
+        </div>
+
+        <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
+      </div>
+
+      <div class="showUsers" v-else>
         <div v-if="userList.length > 0">
           <div class="cards" v-for="(e, index) in userList" :key="index">
             <div class="imges">
-              <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="e.isChecked" @click="userClick(index)" />
-              <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click="userClick(index)" />
+              <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="e.isChecked" @click="userClick(e, index)" />
+              <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click="userClick(e, index)" />
 
               <img src="./components/img/tx@2x.png" alt="" class="avatras" />
             </div>
@@ -25,7 +45,7 @@
         <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
       </div>
     </div>
-    <div class="pad-b140"></div>
+
     <div class="subBtn" @click="submit">
       <div>确定选择</div>
     </div>
@@ -38,71 +58,135 @@ export default {
   name: 'SelectUser',
   data() {
     return {
-      selectUserList: [],
+      selectUser: {},
+      allData: null,
+      treeList: [],
+      slectList: [],
       userList: [],
-      name: '',
-      current: 1
     }
   },
   onLoad() {
-    this.selectUserList = uni.getStorageSync('selectUserList')
-    this.selectUserList.map((item) => {
-      item.id =item.wxUserId
-      item.mobile = item.phone
-      item.avatar = item.photo
-    })
-    this.getList()
+    this.getTree()
+  },
+  onShow() {
+    document.title = '选择人员'
   },
   methods: {
-    getListInit() {
-      this.userList = []
-      this.current = 1
-      this.getList()
-    },
-    getList() {
-      this.$http.post(`/app/wxcp/wxuser/list?name=${this.name}&current=${this.current}&size=10000`).then((res) => {
+    getTree() {
+      this.slectList = []
+      this.$http.post('/app/appgirdinfo/listAllByTop').then((res) => {
         if (res?.data) {
-          res.data.records.map((item) => {
-            item.isChecked = false
-          })
-
-          this.userList = this.current > 1 ? [...this.userList, ...res.data.records] : res.data.records
-          
-          this.userList.map((item) => {
-            this.selectUserList.map((e) => {
-              if(e.id == item.id) {
-                item.isChecked = true
-              }
-            })
-          })
+          this.allData = res.data
+          this.treeInit()
         }
       })
     },
 
-    userClick(index) {
-      this.userList[index].isChecked = !this.userList[index].isChecked
+    treeInit() {
+      if(this.allData[0].girdLevel == 2) {
+        if(this.allData[0].girdMemberList && this.allData[0].girdMemberList.length) {
+            this.userList = this.allData[0].girdMemberList
+            this.userList.map((item) => {
+            item.isChecked = false
+          })
+        }
+      }else {
+        this.treeList = this.allData[0].girdList
+      }
+      var obj = {
+        girdName: this.allData[0].girdName,
+        id: this.allData[0].id,
+        girdLevel: this.allData[0].girdLevel
+      }
+      this.slectList.push(obj)
+    },
+
+    itemClick(row) {
+      console.log(row)
+      var obj = {
+        girdName: row.girdName,
+        id: row.id,
+        girdLevel: row.girdLevel
+      }
+      this.slectList.push(obj)
+      this.searckGird(row)
+    },
+
+    searckGird(row) {
+      this.treeList = []
+      if(row.girdLevel != 2) { //查网格
+        this.$http.post(`/app/appgirdinfo/list?parentGirdId=${row.id}&size=999`).then((res) => {
+          if (res?.data) {
+            this.treeList = res.data.records
+          }
+        })
+      }else { //查网格员
+        this.userList = []
+        this.$http.post(`/app/appgirdmemberinfo/listByGirdIdByThree?girdId=${row.id}`).then((res) => {
+          if (res?.data) {
+            this.userList = res.data
+            this.userList.map((item) => {
+              item.isChecked = false
+            })
+          }
+        })
+      }
+    },
+
+    girdNameClick(row, index) {
+      this.userList = []
+      if(!index) { //第一级别
+        this.slectList = []
+        this.treeInit()
+      }else {
+        var list = []
+        this.slectList.map((item, i) => {
+          if(i <= index) {
+            list.push(item)
+          }
+        })
+        this.slectList = list
+        this.searckGird(row)
+      }
+    },
+
+
+    girdClick(row, index) {
+      if (this.treeList[index].isChecked) {//取消
+        this.treeList[index].isChecked = false
+        this.selectUser = {}
+      } else {
+        this.treeList.map((item) => {
+          item.isChecked = false
+        })
+        this.treeList[index].isChecked = true
+        this.selectUser = row
+      }
+      this.$forceUpdate()
+    },
+
+    userClick(row, index) {
+      if (this.userList[index].isChecked) {//取消
+        this.userList[index].isChecked = false
+        this.selectUser = {}
+      } else {
+        this.userList.map((item) => {
+          item.isChecked = false
+        })
+        this.userList[index].isChecked = true
+        this.selectUser = row
+      }
       this.$forceUpdate()
     },
 
     submit() {
-      var selectUserList = []
-      this.userList.map((item) => {
-        if(item.isChecked) {
-          selectUserList.push(item)
-        }
-      })
-      uni.$emit('selectUser', selectUserList)
-      uni.navigateBack()
-      // if (!selectUserList.length) {
-      //   return this.$u.toast('请选择人员')
-      // } else {
-       
-      // }
+      if (this.selectUser.id != null) {
+        uni.$emit('goback', this.selectUser)
+        uni.navigateBack()
+      } else {
+        return this.$u.toast('请选择网格或网格员')
+      }
     },
-  },
-  onReachBottom() {
-    this.current ++
-    this.getList()
   }
 }
 </script>
@@ -111,15 +195,13 @@ export default {
 .SelectUser {
   height: 100%;
   background: #fff;
-  .pad-b140{
-    padding-bottom: 140px;
-  }
   .header-top {
     background: #fff;
     padding: 20px 32px;
   }
 
   .header-middle {
+    padding-bottom: 140px;
     .hint {
       padding: 28px 20px 28px 32px;
       line-height: 56px;
diff --git a/src/project/grid/AppHandSnapshot/Set.vue b/src/project/grid/AppHandSnapshot/Set.vue
new file mode 100644
index 00000000..be5fe84c
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/Set.vue
@@ -0,0 +1,76 @@
+<template>
+  <div class="set">
+    <div class="info-content" @click="toSetList">
+      <img src="./components/img/setting-icon.png" alt="" class="set-icon">
+      <div class="info">
+        <h2>配置事件类别</h2>
+        <p>提交上报时选择事件类别，有助于管理上报和统计分析</p>
+      </div>
+      <img src="./components/img/right-icon.png" alt="" class="right-icon">
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {},
+  data() {
+    return {
+
+    }
+  },
+  methods: {
+    toSetList() {
+      uni.navigateTo({url: './SetList'})
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+uni-page-body {
+  height: 100%;
+}
+.set {
+  height: 100%;
+  padding: 32px 30px 0;
+  box-sizing: border-box;
+  background-color: #F3F7F8;
+  .info-content{
+    width: 100%;
+    background-color: #fff;
+    padding: 40px 8px 34px 40px;
+    box-sizing: border-box;
+    display: flex;
+    .set-icon{
+      width: 40px;
+      height: 40px;
+      margin-right: 44px;
+    }
+    .info{
+      display: inline-block;
+      width: calc(100% - 216px);
+      h2{
+        font-size: 36px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #333;
+        line-height: 48px;
+        margin-bottom: 6px;
+      }
+      p{
+        width: 100%;
+        font-size: 28px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #999;
+        line-height: 40px;
+        word-break: break-all;
+      }
+    }
+    .right-icon{
+      width: 56px;
+      height: 56px;
+      margin-left: 76px;
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/SetList.vue b/src/project/grid/AppHandSnapshot/SetList.vue
new file mode 100644
index 00000000..895eb246
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/SetList.vue
@@ -0,0 +1,122 @@
+<template>
+  <div class="SetList">
+    <div class="header">
+      <div class="title">事件类别</div>
+      <p>成员上报时需要选择事件类别，上报会按照分类进行统计。</p>
+    </div>
+    <div class="set-list">
+      <div class="item">
+        <div class="title">小区管理</div>
+        <div class="tips-list">
+          <span class="tips">公共部位设置地桩锁</span>
+          <span class="tips">公共部位桩锁</span>
+          <span class="tips">地桩锁</span>
+          <span class="tips">公共部位设置地桩锁</span>
+          <span class="tips">公共部位桩锁</span>
+          <span class="tips">地桩锁</span>
+          <span class="tips">公共部位设置地桩锁</span>
+          <span class="tips">公共部位桩锁</span>
+          <span class="tips">地桩锁</span>
+        </div>
+        <img src="./components/img/right-icon.png" alt="">
+      </div>
+    </div>
+    <div class="btn" @click="toAddSet">新建分类</div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'SetList',
+  components: {},
+  props: {
+    dict: Object,
+    instance: Function,
+    params: Object,
+  },
+  data() {
+    return {}
+  },
+  methods: {
+    toAddSet() {
+      uni.navigateTo({url: './AddSet'})
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.SetList {
+  height: 100%;
+  background-color: #fff;
+  .header{
+    padding: 40px 30px 74px;
+    .title{
+      font-size: 42px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #333;
+      line-height: 48px;
+      margin-bottom: 16px;
+    }
+    p{
+      width: 100%;
+      font-size: 30px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #999;
+      line-height: 42px;
+      word-break: break-all;
+    }
+  }
+  .set-list{
+    padding: 0 28px 120px;
+    .item{
+      width: 100%;
+      padding-bottom: 20px;
+      border-bottom: 1px solid #E9EAEB;
+      position: relative;
+      .title{
+        font-size: 34px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #333;
+        line-height: 48px;
+        margin-bottom: 22px;
+      }
+      .tips-list{
+        width: calc(100% - 68px);
+      }
+      .tips{
+        display: inline-block;
+        line-height: 64px;
+        background: #F7F8F9;
+        border-radius: 8px;
+        padding: 0 20px;
+        font-size: 30px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #999;
+        margin: 0 16px 24px 0;
+      }
+      img{
+        width: 40px;
+        height: 40px;
+        position: absolute;
+        top: 50%;
+        right: 20px;
+      }
+    }
+  }
+  .btn{
+    width: 100%;
+    line-height: 112px;
+    background: #3975C6;
+    box-shadow: inset 0px 1px 0px 0px #EEEEEE;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    text-align: center;
+    font-size: 32px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #FFF;
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/Statistics.vue b/src/project/grid/AppHandSnapshot/Statistics.vue
new file mode 100644
index 00000000..3be9524b
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/Statistics.vue
@@ -0,0 +1,353 @@
+<template>
+  <div class="statistics" v-if="pageShow">
+    <!-- <div class="gird-select">
+      <img src="./components/img/gird-icon.png" alt="">
+      <span>{{girdName}}</span>
+      <img src="./components/img/down-icon.png" alt="">
+    </div>
+    <u-select v-model="showSelect" :list="myGirdList" value-name="id" label-name="girdName" @confirm="confirm"></u-select> -->
+    <div class="info-content">
+      <div class="title">今日概况</div>
+      <div class="el-row">
+        <div class="item" v-for="(item, index) in todayList" :key="index">
+          <h2>{{item.value}}</h2>
+          <p>{{item.label}}</p>
+        </div>
+      </div>
+    </div>
+    <div class="info-content">
+      <div class="title">业务透视</div>
+      <div class="business">
+        <div class="left">
+          <div class="item">
+            <p>受理率</p>
+            <h2>{{info.businessCountMap['受理率'] || '0'}}%</h2>
+          </div>
+          <div class="item">
+            <p>办结率</p>
+            <h2>{{info.businessCountMap['办结率'] || '0'}}%</h2>
+          </div>
+        </div>
+        <div class="right">
+          <div class="img">
+            <img src="./components/img/line-img.png" alt="">
+            <img src="./components/img/line-img.png" alt="">
+          </div>
+          <div class="num">
+            <div class="item bg1">
+              <h2>累计反馈</h2>
+              <p>{{info.businessCountMap['累计反馈'] || '0'}}</p>
+            </div>
+            <div class="item bg2">
+              <h2>累计受理</h2>
+              <p>{{info.businessCountMap['累计受理'] || '0'}}</p>
+            </div>
+            <div class="item bg3">
+              <h2>累计办理</h2>
+              <p>{{info.businessCountMap['累计办结'] || '0'}}</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="info-content">
+      <div class="title" @click="toPercentageDetail">分类统计
+        <!-- <img src="./components/img/right-icon.png" alt=""> -->
+      </div>
+      <div class="percentage">
+        <div class="item" v-for="(item, index) in info.groupList" :key="index">
+          <div class="mini-title">{{item.groupName}}</div>
+          <div class="info">
+            <div class="line-bg" :style="`width:${item.width}%`" ><div class="active-bg" :style="`width:${item.percentage*100}%`"></div></div>共{{item.totalNum}}条 | 已办结{{item.finishNum}}
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- <div class="info-content" @click="toUserList">
+      <div class="title">成员明细
+        <img src="./components/img/right-icon.png" alt="">
+      </div>
+    </div> -->
+    <div class="pad-b120"></div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {},
+  data() {
+    return {
+      todayList: [],
+      info: {},
+      pageShow: false,
+      myGirdList: [],
+      showSelect: false,
+      myGirdList: [],
+      girdName: '全部网格'
+    }
+  },
+  mounted() {
+    this.girdList()
+    this.getStatistics()
+  },
+  methods: {
+    getStatistics() {
+      this.$http.post('/app/appclapeventinfo/countByGirdMember').then((res) => {
+        if (res.code == 0) {
+          if(res.data.businessCountMap['受理率']) {
+            res.data.businessCountMap['受理率'] = Number(res.data.businessCountMap['受理率'] * 100).toFixed(1)
+          }
+          if(res.data.businessCountMap['办结率']) {
+            res.data.businessCountMap['办结率'] = Number(res.data.businessCountMap['办结率'] * 100).toFixed(1)
+          }
+          this.info = res.data
+
+          Object.keys(res.data.todayCountMap).forEach((key) => {
+            var info = {
+              label: key,
+              value: res.data.todayCountMap[key]
+            }
+            this.todayList.push(info)
+          })
+          if(this.info.groupList.length) {
+            this.info.groupList.map((item, index) => {
+              if(item.finishNum) {
+                item.percentage = (item.finishNum/item.totalNum).toFixed(2)
+              }else {
+                item.percentage = 0
+              }
+              item.width = 56-(index*10)
+            })
+          }
+        }
+        this.pageShow = true
+      })
+    },
+
+    goDetail(item) {
+      uni.navigateTo({ url: `./Detail?id=${item.id}` })
+    },
+
+    change(index) {
+      this.currentTabs = index
+      this.getList()
+    },
+
+    toPercentageDetail() {
+      uni.navigateTo({url: './PercentageDetail'})
+    },
+    toUserList() {
+      uni.navigateTo({url: './UserList'})
+    },
+
+    girdList() {
+      this.$http.post(`/app/appgirdmemberinfo/queryMyGirdList`, null, {
+        params: {
+          size: 9999,
+        },
+      })
+      .then((res) => {
+        if (res.code == 0) {
+          this.myGirdList = res.data
+          var all = {
+            id: '',
+            girdName: '全部'
+          }
+          this.myGirdList.unshift(all)
+        }
+      })
+    },
+    confirm(e) {
+
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.statistics {
+  background-color: #F3F7F8;
+  padding: 30px 30px 0;
+  .gird-select{
+    width: 100%;
+    background: #FFF;
+    border-radius: 16px;
+    margin: 0 0 24px;
+    text-align: center;
+    padding: 24px 0;
+    img{
+      width: 32px;
+      height: 32px;
+      vertical-align: middle;
+    }
+    span{
+      display: inline-block;
+      font-size: 34px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #333;
+      line-height: 48px;
+      margin: 0 10px;
+    }
+  }
+  .info-content{
+    width: 100%;
+    background: #FFF;
+    border-radius: 16px;
+    margin-bottom: 24px;
+    .title{
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #333;
+      line-height: 48px;
+      padding: 24px 16px 24px 24px;
+      img{
+        float: right;
+        width: 40px;
+        height: 40px;
+      }
+    }
+    .el-row{
+      display: flex;
+      padding: 32px 0 60px 0;
+      .item{
+        flex: 1;
+        text-align: center;
+        h2{
+          font-size: 64px;
+          font-family: DINAlternate-Bold, DINAlternate;
+          font-weight: bold;
+          color: #3B424A;
+          line-height: 64px;
+          margin-bottom: 8px;
+        }
+        p{
+          font-size: 28px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          color: #999;
+          line-height: 40px;
+        }
+      }
+    }
+    .business{
+      display: flex;
+      padding: 40px 0 30px 0;
+      .left{
+        width: 220px;
+        padding: 20px 0 78px 50px;
+        .item{
+          margin-bottom: 58px;
+        }
+        h2{
+          font-size: 58px;
+          font-family: DINAlternate-Bold, DINAlternate;
+          font-weight: bold;
+          color: #3B424A;
+          line-height: 64px;
+          letter-spacing: -4px;
+        }
+        p{
+          font-size: 28px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          color: #666;
+          line-height: 48px;
+        }
+      }
+      .right{
+        width: calc(100% - 220px);
+        display: flex;
+        .img{
+          width: 140px;
+          margin-top: 42px;
+          img{
+            width: 140px;
+            height: 144px;
+            margin-bottom: 20px;
+          }
+        }
+        .num{
+          width: calc(100% - 140px);
+          text-align: center;
+          .item{
+            height: 130px;
+            border-radius: 6px;
+            background-size: 100% 100%;
+            margin-bottom: 4px;
+            color: #2F7EE5;
+            h2{
+              font-size: 26px;
+              font-family: PingFangSC-Medium, PingFang SC;
+              font-weight: 500;
+              line-height: 48px;
+              padding-top: 20px;
+            }
+            p{
+              font-size: 40px;
+              font-family: DINAlternate-Bold, DINAlternate;
+              font-weight: bold;
+            }
+          }
+          .bg1{
+            width: 272px;
+            background-image: url('./components/img/bg-1.png');
+          }
+          .bg2{
+            width: 234px;
+            background-image: url('./components/img/bg-2.png');
+            margin-left: 16px;
+          }
+          .bg3{
+            width: 208px;
+            background-image: url('./components/img/bg-3.png');
+            margin-left: 32px;
+          }
+        }
+      }
+    }
+    .percentage{
+      padding: 16px 0 0 26px;
+      .item{
+        width: 100%;
+        padding-bottom: 32px;
+        .mini-title{
+          font-size: 30px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          color: #333;
+          line-height: 48px;
+          margin-bottom: 14px;
+        }
+        .info{
+          width: 100%;
+          font-size: 28px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          color: #999;
+          line-height: 48px;
+          .line-bg{
+            display: inline-block;
+            height: 14px;
+            background: #D7D8D9;
+            border-radius: 8px;
+            margin-right: 12px;
+            .active-bg{
+              height: 100%;
+              background: #257FF1;
+              border-radius: 8px;
+              min-width: 1%;
+            }
+          }
+          img{
+            width: 32px;
+            height: 32px;
+            vertical-align: middle;
+          }
+        }
+      }
+    }
+  }
+  .pad-b120{
+    background-color: #F3F7F8;
+    padding-bottom: 120px;
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/UserList.vue b/src/project/grid/AppHandSnapshot/UserList.vue
new file mode 100644
index 00000000..fe31698a
--- /dev/null
+++ b/src/project/grid/AppHandSnapshot/UserList.vue
@@ -0,0 +1,60 @@
+<template>
+  <div class="UserList">
+    <div class="item">
+      <img src="./components/img/user-img.png" alt="">
+      <div class="info">
+        <h2>李毅</h2>
+        <p>共受理23条 | 已办结17条</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'UserList',
+  data() {
+    return {
+
+    }
+  },
+  methods: {
+
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.UserList {
+  height: 100%;
+  .item{
+    padding: 24px 0 0 32px;
+    background-color: #fff;
+    img{
+      width: 80px;
+      height: 80px;
+      margin-right: 32px;
+    }
+    .info{
+      display: inline-block;
+      width: calc(100% - 112px);
+      padding-bottom: 24px;
+      border-bottom: 1px solid #E4E5E6;
+      h2{
+        font-size: 32px;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #333;
+        line-height: 44px;
+        margin-bottom: 6px;
+      }
+      p{
+        font-size: 28px;
+        font-family: PingFangSC-Regular, PingFang SC;
+        color: #666;
+        line-height: 40px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppHandSnapshot/components/1.png b/src/project/grid/AppHandSnapshot/components/1.png
new file mode 100644
index 00000000..663b9263
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/1.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/22.png b/src/project/grid/AppHandSnapshot/components/22.png
new file mode 100644
index 00000000..7f6bc129
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/22.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/add-icon.png b/src/project/grid/AppHandSnapshot/components/img/add-icon.png
new file mode 100644
index 00000000..f751a7fa
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/add-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/bg-1.png b/src/project/grid/AppHandSnapshot/components/img/bg-1.png
new file mode 100644
index 00000000..696022e9
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/bg-1.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/bg-2.png b/src/project/grid/AppHandSnapshot/components/img/bg-2.png
new file mode 100644
index 00000000..98fa31b8
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/bg-2.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/bg-3.png b/src/project/grid/AppHandSnapshot/components/img/bg-3.png
new file mode 100644
index 00000000..dc469567
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/bg-3.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/down-icon.png b/src/project/grid/AppHandSnapshot/components/img/down-icon.png
new file mode 100644
index 00000000..6ffcc7a2
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/down-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/gird--select-icon.png b/src/project/grid/AppHandSnapshot/components/img/gird--select-icon.png
new file mode 100644
index 00000000..205144d2
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/gird--select-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/gird-icon.png b/src/project/grid/AppHandSnapshot/components/img/gird-icon.png
new file mode 100644
index 00000000..f7f3e61f
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/gird-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/handle-icon-active.png b/src/project/grid/AppHandSnapshot/components/img/handle-icon-active.png
new file mode 100644
index 00000000..1cb07503
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/handle-icon-active.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/handle-icon.png b/src/project/grid/AppHandSnapshot/components/img/handle-icon.png
new file mode 100644
index 00000000..ab2d20c2
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/handle-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/jujue.png b/src/project/grid/AppHandSnapshot/components/img/jujue.png
new file mode 100644
index 00000000..ea7387ad
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/jujue.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/line-img.png b/src/project/grid/AppHandSnapshot/components/img/line-img.png
new file mode 100644
index 00000000..4d423855
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/line-img.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/local-icon.png b/src/project/grid/AppHandSnapshot/components/img/local-icon.png
new file mode 100644
index 00000000..3e23aff6
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/local-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/no-admin.png b/src/project/grid/AppHandSnapshot/components/img/no-admin.png
new file mode 100644
index 00000000..3830c170
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/no-admin.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/remove-icon.png b/src/project/grid/AppHandSnapshot/components/img/remove-icon.png
new file mode 100644
index 00000000..971b39ef
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/remove-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/right-icon.png b/src/project/grid/AppHandSnapshot/components/img/right-icon.png
new file mode 100644
index 00000000..e1c626b7
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/right-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/search-icon.png b/src/project/grid/AppHandSnapshot/components/img/search-icon.png
new file mode 100644
index 00000000..e3cb75af
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/search-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/set-icon-active.png b/src/project/grid/AppHandSnapshot/components/img/set-icon-active.png
new file mode 100644
index 00000000..c025cb79
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/set-icon-active.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/set-icon.png b/src/project/grid/AppHandSnapshot/components/img/set-icon.png
new file mode 100644
index 00000000..58651b64
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/set-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/setting-icon.png b/src/project/grid/AppHandSnapshot/components/img/setting-icon.png
new file mode 100644
index 00000000..29e4b29f
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/setting-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/statistics-icon-active.png b/src/project/grid/AppHandSnapshot/components/img/statistics-icon-active.png
new file mode 100644
index 00000000..81dbd3f7
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/statistics-icon-active.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/statistics-icon.png b/src/project/grid/AppHandSnapshot/components/img/statistics-icon.png
new file mode 100644
index 00000000..63b98d33
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/statistics-icon.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/tx@2x.png b/src/project/grid/AppHandSnapshot/components/img/tx@2x.png
new file mode 100644
index 00000000..d9620e08
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/tx@2x.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/user-img.png b/src/project/grid/AppHandSnapshot/components/img/user-img.png
new file mode 100644
index 00000000..ae49d85f
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/user-img.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/xz.png b/src/project/grid/AppHandSnapshot/components/img/xz.png
new file mode 100644
index 00000000..98f78cda
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/xz.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/xzh.png b/src/project/grid/AppHandSnapshot/components/img/xzh.png
new file mode 100644
index 00000000..967fa399
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/xzh.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/img/zhuanjiao.png b/src/project/grid/AppHandSnapshot/components/img/zhuanjiao.png
new file mode 100644
index 00000000..f6c932fa
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/img/zhuanjiao.png differ
diff --git a/src/project/grid/AppHandSnapshot/components/yan.jpg b/src/project/grid/AppHandSnapshot/components/yan.jpg
new file mode 100644
index 00000000..bf6a5a2c
Binary files /dev/null and b/src/project/grid/AppHandSnapshot/components/yan.jpg differ
diff --git a/src/project/grid/AppMonitoringObject/Add.vue b/src/project/grid/AppMonitoringObject/Add.vue
new file mode 100644
index 00000000..1db5dde1
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/Add.vue
@@ -0,0 +1,1018 @@
+<template>
+  <div class="add">
+    <div class="steps" v-show="!isEdit">
+      <u-steps :list="numList" :current="current" mode="number"></u-steps>
+    </div>
+    <div class="form" v-show="current == 0 || isEdit">
+      <div class="form-group">
+        <div class="form-item" v-if="!isEdit">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>监测对象类型</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpType" v-model="form.objectType"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item" v-if="isEdit">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;">*</i>
+              <span>与户主关系</span>
+            </div>
+            <div class="right">
+              <span v-if="isEdit">{{ $dict.getLabel('fpRelationship', form.householdRelation) }}</span>
+              <AiSelect dict="fpRelationship" v-model="form.householdRelation" v-else></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item" v-if="!isEdit">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;"></i>
+              <span>选择人员</span>
+            </div>
+            <div class="right">
+              <AiPagePicker class="select" :selected.sync="userList" householdName="1" single>
+                <AiMore v-model="form.name"/>
+              </AiPagePicker>
+            </div>
+          </div>
+        </div>
+        <div class="form-item" v-if="isEdit">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>成员姓名</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="text" v-model="form.name" :maxlength="8"
+                     placeholder-style="color: #999; font-size: 30rpx;" disabled/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item" v-if="!isEdit">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>户主姓名</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="text" v-model="form.name" :maxlength="8"
+                     placeholder-style="color: #999; font-size: 30rpx;" :disabled="isEdit"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item" v-if="!isEdit">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>证件号码</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="idcard" v-model="form.idNumber" :maxlength="20"
+                     placeholder-style="color: #999; font-size: 30rpx;" @input="changeIdNumber" :disabled="!!userList.length"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item" v-if="isEdit">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>证件号码</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="idcard" v-model="form.idNumber" :maxlength="20"
+                     placeholder-style="color: #999; font-size: 30rpx;" @input="changeIdNumber" disabled/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>性别</span>
+            </div>
+            <div class="right">
+              <span :style="form.sex === '' ? 'color:#999;' : 'color:#333;' ">{{ $dict.getLabel('sex', form.sex) || '自动识别' }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>联系方式</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="number" v-model="form.phone" :maxlength="11"
+                     placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>现住址</span>
+            </div>
+            <div class="right">
+              <AiAreaPicker :fullName.sync="form.currentAreaName" v-model="form.currentAreaId" @select="areaSelect">
+                <AiMore v-model="form.currentAreaName"/>
+              </AiAreaPicker>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>详细地址</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" v-model="form.currentAddress" placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>民族</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpNation" v-model="form.nation"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>政治面貌</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpPoliticalOutlook" v-model="form.politicsStatus"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;"></i>
+              <span>文化程度</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpEducation" v-model="form.education"></AiSelect>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper border-b0">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>个人照片</span>
+            </div>
+          </div>
+        </div>
+        <div class="upload">
+          <AiUploader :def.sync="photo" multiple placeholder="上传图片" :limit="1" action="/admin/file/add2"/>
+        </div>
+      </div>
+
+
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;"></i>
+              <span>在校生状况</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpStudentsInSchool" v-model="form.schoolStatus"></AiSelect>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 个人健康状况 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrappers">
+            <div class="top">
+              <i style="opacity: 0;">*</i>
+              <span>个人健康状况(可多选)</span>
+            </div>
+            <div class="bottoms">
+              <div class="cards" v-for="(e, index) in helthList" :key="index">
+                <div :style="{color:e.checked == true ? '#1174FE' : '#333'}" @click="userClick(e)">{{ e.dictName }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 残疾类别 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;"></i>
+              <span>残疾类别</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpDisabilityType" v-model="form.disabilityType"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>残疾证办理年度</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpYear" v-model="form.disabilityCertificateYear"></AiSelect>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 基础保险 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrappers">
+            <div class="top">
+              <i style="opacity: 0;">*</i>
+              <span>基础保险(可多选)</span>
+            </div>
+            <div class="bottoms">
+              <div class="cards" v-for="(e, index) in basicsCheckList" :key="index">
+                <div :style="{color:e.checked == true ? '#1174FE' : '#333'}" @click="basicsCheck(e, index)">{{ e.dictName }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 保障措施 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrappers">
+            <div class="top">
+              <i style="opacity: 0;">*</i>
+              <span>保障措施(可多选)</span>
+            </div>
+            <div class="bottoms">
+              <div class="cards" v-for="(e, index) in guaranteeCheckList" :key="index">
+                <div :style="{color:e.checked == true ? '#1174FE' : '#333'}" @click="guaranteeCheck(e, index)">{{ e.dictName }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 劳动技能 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>劳动技能</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpLaborSkills" v-model="form.labourStatus"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>是否会讲普通话</span>
+            </div>
+            <div class="right">
+              <div class="check-item" :class="form.mandarin == '01' ? 'check-active' : '' " @click="form.mandarin='01'">是<img
+                  src="./components/img/check-icon.png" alt=""></div>
+              <div class="check-item" :class="form.mandarin == '02' ? 'check-active' : '' " @click="form.mandarin='02'">否<img
+                  src="./components/img/check-icon.png" alt=""></div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 就业渠道 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>就业渠道</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpEmploymentChannels" v-model="form.employmentChannels"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>务工企业名称</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="text" v-model="form.migrantEnterprises" placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>务工时间/月</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" v-model="form.workeMonths" type="number" placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>公益性岗位</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" v-model="form.publicWelfarePosts" type="text" placeholder-style="color: #999; font-size: 30rpx;" maxlength="20"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>公益性岗位（月数）</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" v-model="form.publicWelfarePostsMonths" type="number" placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 是否国外务工 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>是否国外务工</span>
+            </div>
+            <div class="right">
+              <div class="check-item" :class="form.foreignWorkers == '01' ? 'check-active' : '' " @click="form.foreignWorkers='01'">是<img
+                  src="./components/img/check-icon.png" alt=""></div>
+              <div class="check-item" :class="form.foreignWorkers == '02' ? 'check-active' : '' " @click="form.foreignWorkers='02'">否<img
+                  src="./components/img/check-icon.png" alt=""></div>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>务工所在地</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="text" v-model="form.foreignWorkersAddress" placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 情况描述 -->
+    <div class="condition" v-if="current == 1">
+      <div class="risk">
+        <div><span style="color: #FF4466;">*</span>风险因素</div>
+        <div>
+          <AiSelect dict="fpRiskType" v-model="form.riskType"></AiSelect>
+        </div>
+      </div>
+      <div style="height: 8px; width: 100%;background: #f3f4f5;"></div>
+      <div class="remark">
+        <p><span style="display: inline-block;width: 6px;"></span>备注说明</p>
+        <div>
+          <u-input v-model="form.detail" type="textarea" height="150" placeholder="请输入备注说明" :maxlength='500' clearable/>
+        </div>
+      </div>
+      <div style="height: 8px; width: 100%;background: #f3f4f5;"></div>
+      <div class="remark">
+        <p><span style="width: 8px;"></span>图片<span style="color: #999;font-size: 14px;">(最多9张)</span></p>
+        <div style="margin-top: 30px;">
+          <AiUploader :def.sync="form.files" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
+        </div>
+      </div>
+    </div>
+
+
+    <div class="btn" hover-class="text" @click="nextStep" v-if="current == 0">下一步</div>
+    <div class="btn" hover-class="text" @click="submit" v-if="current == 0 && isEdit">保存</div>
+    <div class="btn" hover-class="text" @click="submit" v-if="current == 1"> {{ girdInfo.checkType == 2 ? '保存' : '申请纳入监测' }}</div>
+  </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+
+export default {
+  data() {
+    return {
+      numList: [
+        {name: '基本信息'},
+        {name: '情况描述'},
+        {name: '等待审核'},
+      ],
+      current: 0,
+      form: {
+        name: '',
+        objectType: '',
+        idNumber: '',
+        sex: '',
+        phone: '',
+        currentAreaId: '',
+        currentAreaName: '',
+        nation: '',
+        politicsStatus: '',
+        education: '',
+        currentAddress: '',
+        files: [],
+        schoolStatus: '',
+        labourStatus: '',
+        workArea: '',
+        workeMonths: '',
+        basicMedicalTreatment: '',
+        seriousIllnessInsurance: '',
+        endowmentInsurance: '',
+        subsistenceAllowance: '',
+        specialPovertySupport: '',
+        girdId: '',
+        girdName: '',
+        healthyStatus: '',
+        age: '',
+        birthday: '',
+        isHousehold: '',
+        photo: '',
+        riskType: '',
+        detail: '',
+        disabilityType: '', // 残疾类型
+        disabilityCertificateYear: '',
+        basicsCheck: '',  // 基础保险
+        guaranteeCheck: '', // 保障措施
+        mandarin: '',
+        employmentChannels: '',
+        migrantEnterprises: '',
+        publicWelfarePosts: '',
+        publicWelfarePostsMonths: '',
+        foreignWorkers: '',
+        foreignWorkersAddress: '',
+        houseIdNumber: '',
+      },
+      $areaId: '',
+      girdInfo: {},
+      photo: [],
+      userList: [],
+      flag: false,
+      helthList: [],
+      basicsCheckList: [
+        {dictName: '城乡居民基本医疗保险', checked: false},
+        {dictName: '城镇职工基本医疗保险', checked: false},
+        {dictName: '大病保险', checked: false},
+        {dictName: '商业补充医疗保险', checked: false},
+        {dictName: '城乡居民基本养老保险', checked: false},
+        {dictName: '城镇职工基本养老保险', checked: false},
+        {dictName: '享受人身意外保险补贴', checked: false},
+      ],
+      basicsList: [],
+      guaranteeCheckList: [
+        {dictName: '享受农村最低生活保障', checked: false},
+        {dictName: '是否特困供养人员', checked: false},
+        {dictName: '分散供养五保户转集中供养（减少）', checked: false},
+        {dictName: '是否接受医疗救助', checked: false},
+        {dictName: '是否接受其它健康扶贫', checked: false},
+      ],
+      guaranteeList: [],
+      isAdd: 'false',
+      houseIdNumber: '',
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+    isEdit() {
+      return !!this.$route.query.id
+    },
+  },
+
+  watch: {
+    userList: {
+      handler: function (v) {
+        let {name, idNumber, currentAreaId, currentAreaName} = v?.[0] || {}
+        this.form = {...this.form, name, idNumber, currentAreaId, currentAreaName}
+        this.form.sex = this.$idCardNoUtil.getIdCardInfo(idNumber)?.sex
+        // this.form.birthday = this.$idCardNoUtil.getIdCardInfo(idNumber)?.birthday
+        this.form.age = this.$calcAge(this.form.idNumber)
+        let birth = idNumber.substr(6,8)
+        this.form.birthDate = birth.replace(/(.{4})(.{2})/,"$1-$2-");
+      },
+      deep: true,
+    },
+  },
+
+  onLoad(query) {
+    this.isGirdUser()
+    this.$dict.load(['fpType', 'fpRiskType', 'riskEliminationMethod', 'fpRiskType', 'fpYesOrNo', 'fpNation', 'fpEducation', 'fpStudentsInSchool', 'fpHealth',
+      'fpLaborSkills', 'fpPoliticalOutlook', 'sex', 'fpHealth', 'fpDisabilityType', 'fpYear', 'fpYesOrNo', 'fpEmploymentChannels']).then(() => {
+
+      this.$dict.getDict('fpHealth').map((item) => {
+        this.helthList.push({
+          dictName: item.dictName,
+          dictValue: item.dictValue,
+          checked: false,
+        })
+      })
+
+      this.form.objectType = query.objectType
+      this.houseIdNumber = query.houseIdNumber
+
+      if (this.isEdit) {
+        this.flag = true
+        this.getInfo(this.$route.query.id)
+      }
+    })
+  },
+
+  onShow() {
+    document.title = this.isEdit ? '编辑监测对象' : '添加监测对象'
+  },
+  methods: {
+    rules() {
+      return {
+        objectType: '请选择监测对象类型',
+        name: '请输入户主姓名',
+        idNumber: '请输入身份证号',
+        phone: '请输入联系方式',
+        currentAreaId: '请选择现住址',
+
+      }
+    },
+
+    areaSelect(e) {
+      this.form.currentAreaId = e
+    },
+
+    getResidentList() {
+      uni.navigateTo({
+        url: './residentList'
+      })
+    },
+
+    userClick(row) {
+      row.checked = !row.checked
+      this.form.healthyStatus = this.helthList.filter(e => e.checked)?.map(e => e.dictValue)?.toString()
+    },
+
+    // 医疗保险
+    basicsCheck(row) {
+      row.checked = !row.checked
+    },
+    // 保障措施
+    guaranteeCheck(row) {
+      row.checked = !row.checked
+    },
+
+    nextStep() {
+
+      if (!this.form.id) {
+        if (!this.form.objectType) {
+          return this.$u.toast('请选择监测对象类型')
+        }
+      }
+
+      if (!this.form.idNumber) {
+        return this.$u.toast('请输入身份证号')
+      }
+      if (!this.form.phone) {
+        return this.$u.toast('请输入联系方式')
+      }
+      if (!this.form.currentAreaId) {
+        return this.$u.toast('请选择现住址')
+      }
+
+      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('请输入正确的手机号')
+      }
+      if (!/[^0]0{0,2}$/.test(this.form.currentAreaId)) {
+        return this.$u.toast('现住址必须选到村级')
+      }
+
+      if (this.form.files.length) {
+        this.form.photo = this.form.files[0].url
+      }
+      if (this.photo.length) {
+        this.form.photo = this.photo[0].url
+      }
+
+      this.form.girdId = this.girdInfo.girdId
+      this.form.girdName = this.girdInfo.girdName
+      this.form.householdIdNumber = this.form.idNumber
+      this.form.householdRelation = '01'
+      this.form.isHousehold = 1
+      this.current = 1
+    },
+
+    checkInit(formName, list, index) {
+      if (list[index].checked) {
+        this.form[formName] = '01'
+      } else {
+        this.form[formName] = '02'
+      }
+    },
+
+    submit() {
+      if(!this.isEdit) {
+        if (!this.form.riskType) {
+          return this.$u.toast('请选择风险因素')
+        }
+      }
+
+      if (this.photo.length) {
+        this.form.photo = this.photo[0].url
+      }
+
+      this.basicsCheckList.map((item, index) => {
+        if (item.checked) {
+          this.basicsList.push(index)
+        }
+      })
+
+      this.form.basicsCheck = this.basicsList.join(',')
+
+      this.guaranteeCheckList.map((item, index) => {
+        if (item.checked) {
+          this.guaranteeList.push(index)
+        }
+      })
+
+      this.form.guaranteeCheck = this.guaranteeList.join(',')
+
+      this.checkInit('jcbxCxyiliao', this.basicsCheckList, 0)
+      this.checkInit('jcbxCzyiliao', this.basicsCheckList, 1)
+      this.checkInit('jcbxDabing', this.basicsCheckList, 2)
+      this.checkInit('jcbxShangye', this.basicsCheckList, 3)
+      this.checkInit('jcbxCxyanglao', this.basicsCheckList, 4)
+      this.checkInit('jcbxCzyanglao', this.basicsCheckList, 5)
+      this.checkInit('jcbxRenshenyiwai', this.basicsCheckList, 6)
+
+      this.checkInit('bzcsNongcundibao', this.guaranteeCheckList, 0)
+      this.checkInit('bzcsTekungongyang', this.guaranteeCheckList, 1)
+      this.checkInit('bzcsWubaohu', this.guaranteeCheckList, 2)
+      this.checkInit('bzcsYiliaojiuzhu', this.guaranteeCheckList, 3)
+      this.checkInit('bzcsQita', this.guaranteeCheckList, 4)
+
+      this.$http.post('/app/apppreventionreturntopoverty/addByEwechat', {
+        ...this.form,
+        girdId: this.user.girdId,
+      }).then(res => {
+        if (res.code == 0) {
+          this.$u.toast(this.form.id ? '保存成功' : '提交成功')
+          uni.$emit('reload')
+          setTimeout(() => {
+            if (this.$route.query.id) {
+              uni.navigateBack({
+                delta: 2
+              })
+            } else {
+              uni.navigateTo({url: './serviceResult'})
+            }
+          }, 600)
+        }
+      }).catch((err) => {
+        this.$u.toast(err)
+      })
+    },
+
+    getInfo(id) {
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${id}`).then(res => {
+        if (res?.data) {
+          if(res.data.basicsCheckList) {
+            res.data.basicsCheckList = res.data.basicsCheck.split(',')
+            res.data.basicsCheckList.map((item, index) => {
+              this.basicsCheckList[index].checked = true
+            })
+          }
+          if(res.data.guaranteeCheckLis) {
+            res.data.guaranteeCheckList = res.data.guaranteeCheck.split(',')
+            res.data.guaranteeCheckList.map((item, index) => {
+              this.guaranteeCheckList[index].checked = true
+            })
+          }
+
+          if(res.data.healthyStatusList) {
+            res.data.healthyStatusList = res.data.healthyStatus.split(',')
+            this.helthList.map(items => {
+              items.checked = res.data.healthyStatusList.includes(items.dictValue)
+            })
+          }
+
+          this.form = { ...this.form, ...res.data }
+
+          if (this.form.photo) {
+            this.photo = [{url: this.form.photo}] || []
+          }
+        }
+      })
+    },
+    changeIdNumber() {
+      if (this.form.idNumber.length < 18 && this.form.idNumber.length > 20) {
+        return this.$u.toast('请输入正确的身份证号码')
+      }
+      let idNumber = this.form.idNumber.substring(0, 18)
+      let info = this.$idCardNoUtil.getIdCardInfo(idNumber)
+      this.form.sex = info.gender
+      this.form.birthDate = info.birthday
+      this.form.age = this.$calcAge(idNumber)
+    },
+    isGirdUser() {
+      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
+        if (res?.data) {
+          this.girdInfo = res.data
+        }
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+.add {
+  padding-bottom: 120px;
+
+  .isActive {
+    background: #3975C6;
+  }
+
+  .steps {
+    height: 176px;
+
+    ::v-deep .u-steps {
+      box-sizing: border-box;
+      padding-top: 40px;
+    }
+  }
+
+  .aiArea {
+    display: flex;
+    align-items: center;
+
+    .label {
+      max-width: 480px;
+      height: 112px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      color: #303133 !important;
+      font-size: 30px;
+    }
+
+    i {
+      margin-left: 4px;
+      font-style: normal;
+      color: #999999;
+      font-size: 30px;
+    }
+  }
+
+  ::v-deep .u-radio {
+    &:last-child {
+      .u-radio__label {
+        margin-right: 0;
+      }
+    }
+  }
+
+  & > div {
+    margin-bottom: 16px;
+    background: #fff;
+  }
+
+  .form-group {
+    .form-item {
+      padding-left: 32px;
+
+      .form-item__wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        border-bottom: 1px solid #E4E5E6;
+      }
+
+      .form-item__wrappers {
+        padding-right: 30px;
+        box-sizing: border-box;
+
+        .top {
+          font-size: 32px;
+          padding: 32px 0;
+        }
+
+        .bottoms {
+          padding-bottom: 20px;
+
+          .cards {
+            padding: 20px;
+            box-sizing: border-box;
+            border: 1px solid #CCCCCC;
+            border-radius: 16px;
+            margin-bottom: 16px;
+
+            .changeActive {
+              color: #1174FE;
+              border: 1px solid #1174FE;
+            }
+          }
+
+        }
+      }
+
+      .right {
+        height: 112px;
+        line-height: 112px;
+        padding-right: 32px;
+
+        span {
+          font-size: 30px;
+          color: #999999;
+        }
+
+        .check-item {
+          display: inline-block;
+          width: 140px;
+          height: 64px;
+          line-height: 64px;
+          text-align: center;
+          background: #F5F5F5;
+          border-radius: 4px;
+          font-size: 30px;
+          font-family: PingFangSC-Medium, PingFang SC;
+          font-weight: 500;
+          color: #333;
+          position: relative;
+
+          img {
+            display: none;
+          }
+        }
+
+        .check-item:nth-of-type(1) {
+          margin-right: 36px;
+        }
+
+        .check-active {
+          background: #E7F1FE;
+          color: #1174FE;
+
+          img {
+            display: block;
+            position: absolute;
+            bottom: 0;
+            right: 0;
+            width: 48px;
+            height: 48px;
+          }
+        }
+      }
+
+      input {
+        height: 100%;
+        text-align: right;
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+        width: 260px;
+
+        span {
+          color: #333333;
+          font-size: 32px;
+        }
+
+        i {
+          margin-right: 4px;
+          font-style: normal;
+          color: #FF4466;
+          font-size: 32px;
+        }
+      }
+    }
+  }
+
+  .form-item__imgs {
+    padding: 32px;
+
+    .form-item__title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 34px;
+
+      h2 {
+        color: #333333;
+        font-weight: normal;
+        font-size: 32px;
+      }
+
+      i {
+        color: #999999;
+        font-size: 28px;
+        font-style: normal;
+      }
+    }
+
+    textarea {
+      width: 100%;
+    }
+  }
+
+  .form-type {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 112px;
+    padding: 0 32px;
+
+    h2 {
+      font-weight: normal;
+      color: #333333;
+      font-size: 32px;
+    }
+
+    span {
+      color: #999999;
+      font-size: 28px;
+    }
+  }
+
+  .condition {
+    margin-top: 16px;
+
+    .risk {
+      display: flex;
+      justify-content: space-between;
+      padding: 30px 32px;
+      box-sizing: border-box;
+    }
+
+    .remark {
+      padding: 30px 32px;
+      box-sizing: border-box;
+    }
+  }
+
+  .btn {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 11;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    margin: 0;
+    text-align: center;
+    color: #FFFFFF;
+    font-size: 32px;
+    background: #3192F4;
+  }
+
+  .upload {
+    width: 100%;
+    padding: 10px 32px 32px 32px;
+    box-sizing: border-box;
+  }
+
+  .border-b0 {
+    border-bottom: 0 !important;
+  }
+
+  ::v-deep .AiSelect .display .selectedLabel {
+    font-size: 28px;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/AppMonitoringObject.vue b/src/project/grid/AppMonitoringObject/AppMonitoringObject.vue
new file mode 100644
index 00000000..114a097e
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/AppMonitoringObject.vue
@@ -0,0 +1,378 @@
+<template>
+  <div class="AppMonitoringObject">
+    <div v-if="isAdmin">
+      <AiTopFixed>
+        <!-- <div class="area">
+          <i>可选范围</i>
+          <span class="separat">/</span>
+          <AiAreaPicker ref="area" class="aiArea" :value="areaId" :areaId="user.areaId" :name.sync="areaName" mode="custom"
+                        @select="seachObj">
+            <span class="label" v-if="areaName">{{ areaName }}</span>
+            <i v-else>请选择</i>
+          </AiAreaPicker>
+        </div>
+        <div class="line"></div> -->
+        <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bar-width="150" @change="change"></u-tabs>
+        <div class="seach-obj">
+          <u-search v-model="keyword" :clearabled="true" placeholder="请输入姓名/身份证号" :show-action="false" bg-color="#F5F5F5"
+                    search-icon-color="#E2E8F1" color="#666" height="58" @search="handerSearch" @clear="handerClear">
+          </u-search>
+        </div>
+      </AiTopFixed>
+      <div class="list-data" v-if="list.length > 0">
+        <div class="item" v-for="(item, iindex) in list" :key="iindex" @click="toDetail(item)">
+          <div class="left">
+            <img :src="item.photo" alt="" v-if="item.photo"/>
+            <img src="./components/img/user-img.png" alt="" v-else/>
+          </div>
+          <div class="right">
+            <div class="right-top">
+              <span class="name">{{ item.name }}</span>
+              <span class="status" :class="`status${item.status}`">{{ $dict.getLabel('fpPrtpStatus', item.status) }}</span>
+            </div>
+            <div class="right-bottom">
+              <p>{{ item.idNumber || '' }}</p>
+              <p>{{ item.countyName + item.townName + item.villageName }}{{ item.currentAddress || '' }}</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <AiEmpty class="emptyWrap" v-else></AiEmpty>
+      <AiFixedBtn v-if="checkType == 1">
+        <div class="addBtn iconfont iconfont-iconfangda" @tap="toAdd" v-if="$permissions('app_apppreventionreturntopoverty_edit')"></div>
+      </AiFixedBtn>
+    </div>
+    <div v-else class="empty">
+      <img src="https://cdn.cunwuyun.cn/dvcp/h5/no-admin.png" alt="">
+      <p>没有网格员权限<br/>无法查看监测信息哦~</p>
+    </div>
+  </div>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: 'AppMonitoringObject',
+  appName: '监测对象',
+  data() {
+    return {
+      keyword: '',
+      list: [],
+      current: 1,
+      total: 0,
+      tabList: [
+        {
+          name: '已登记监测对象',
+        },
+        {
+          name: '已消除风险对象',
+        },
+      ],
+      currentTabs: 0,
+      areaId: '',
+      areaName: '',
+      isAdmin: false,
+      checkType: ''
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  onShow() {
+    document.title = '监测对象'
+    this.areaId = this.user.areaId
+    this.areaName = this.user.areaName
+    this.$dict.load('fpPrtpStatus').then(() => {
+      this.isGirdUser()
+    })
+    uni.$on('reload', () => {
+      this.getListInit()
+    })
+  },
+  methods: {
+    isGirdUser() {
+      this.isAdmin = false
+      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
+        if (res?.data) {
+          if (res.data.checkType != '0') {
+            this.isAdmin = true
+            this.checkType = res.data.checkType
+            this.getList()
+          }
+        }
+      })
+    },
+
+    getListInit() {
+      this.current = 1
+      this.list = []
+      this.getList()
+    },
+
+    getList() {
+      if (this.list.length >= this.total && this.total > 0) return
+      this.$http.post('/app/appgirdmemberpoverty/listByGirdMember', null, {
+        params: {
+          current: this.current,
+          status: this.currentTabs,
+          name: this.keyword,
+        },
+      }).then((res) => {
+        if (res?.data) {
+          res.data.records.map((item) => {
+            if (item.idNumber) {
+              item.idNumber = item.idNumber.replace(/^(\w{6})\w{8}(.*)$/, '$1********$2')
+            }
+          })
+          this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records
+          this.total = res.data.total
+        }
+      })
+    },
+
+    change(index) {
+      this.currentTabs = index
+      this.getListInit()
+    },
+
+    toDetail(item) {
+      uni.navigateTo({url: `./Detail?id=${item.id}`})
+    },
+
+    seachObj(e) {
+      this.areaId = e
+      this.getListInit()
+    },
+
+    handerSearch(e) {
+      this.keyword = e
+      this.getListInit()
+    },
+
+    handerClear() {
+      this.keyword = ''
+      this.getListInit()
+    },
+    toAdd() {
+      uni.navigateTo({url: './Add'})
+    }
+  },
+  onReachBottom() {
+    this.current++
+    this.getList()
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppMonitoringObject {
+  height: 100%;
+
+  .area {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    padding: 0 32px;
+    height: 112px;
+    color: #333333;
+    font-size: 30px;
+    background: #fff;
+    box-sizing: border-box;
+
+    .separat {
+      padding: 0 8px;
+    }
+
+    i {
+      color: #3F8DF5;
+      font-size: 30px;
+      font-style: normal;
+    }
+
+    span {
+      color: #333333;
+      font-size: 30px;
+    }
+  }
+
+  .line {
+    height: 16px;
+    background: #f5f5f5;
+  }
+
+  .seach-obj {
+    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;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .list-data {
+    background: #fff;
+
+    .item {
+      display: flex;
+      padding: 24px 0 0 32px;
+      box-sizing: border-box;
+
+      .left {
+        img {
+          width: 80px;
+          height: 80px;
+          border-radius: 50%;
+        }
+      }
+
+      .right {
+        display: flex;
+        flex-direction: column;
+        margin-left: 32px;
+        width: 100%;
+        border-bottom: 2px solid #E4E5E6;
+        padding-right: 32px;
+
+        .right-top {
+          font-size: 36px;
+          font-family: PingFangSC-Medium, PingFang SC;
+          font-weight: 500;
+          color: #333;
+          line-height: 44px;
+          display: flex;
+          justify-content: space-between;
+          margin-bottom: 8px;
+
+          .status {
+            font-size: 26px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            line-height: 36px;
+          }
+
+          .status0 {
+            color: #F82;
+          }
+
+          .status1 {
+            color: #3975C6;
+          }
+
+          .status2, .status4 {
+            color: #F46;
+          }
+
+          .status3 {
+            color: #2EA222;
+          }
+        }
+
+        .right-bottom {
+          p {
+            font-size: 26px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            color: #999;
+            line-height: 36px;
+            word-break: break-all;
+            margin-bottom: 16px;
+          }
+
+          p:nth-of-type(1) {
+            margin-bottom: 16px;
+          }
+        }
+      }
+    }
+  }
+
+  .emptyWrap {
+    margin: 0;
+  }
+
+  ::v-deep .AiTopFixed .content {
+    padding: 0;
+  }
+
+  ::v-deep .u-tab-bar {
+    bottom: -6px !important;
+  }
+
+  .addBtn {
+    width: 96px;
+    height: 96px;
+    flex-shrink: 0;
+    background: $uni-color-primary;
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+    font-size: 48px;
+    color: #fff;
+    border-radius: 50%;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+  }
+
+  .empty {
+    text-align: center;
+
+    img {
+      width: 282px;
+      height: 306px;
+      margin: 136px auto 0;
+    }
+
+    p {
+      font-size: 28px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #999;
+      line-height: 40px;
+    }
+
+    .add-btn {
+      width: 400px;
+      height: 88px;
+      line-height: 88px;
+      text-align: center;
+      border-radius: 8px;
+      background-color: #3267f0;
+      color: #fff;
+      font-size: 30px;
+      margin: 200px auto 0;
+    }
+  }
+
+  ::v-deep .u-search {
+    margin-bottom: 0 !important;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/Detail.vue b/src/project/grid/AppMonitoringObject/Detail.vue
new file mode 100644
index 00000000..0842487b
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/Detail.vue
@@ -0,0 +1,709 @@
+<template>
+  <div class="detail" v-if="pageShow" :class="[isFrom ? 'active' : '']">
+    <div class="tab" v-if="!isFrom">
+      <span @click="changeTab(0)" :class="[currIndex === 0 ? 'active' : '']">基本信息</span>
+      <span @click="changeTab(1)" :class="[currIndex === 1 ? 'active' : '']">走访日志</span>
+    </div>
+    <div class="tab-content">
+      <div class="tab-content__item" v-show="currIndex === 0">
+        <div class="item-wrapper">
+          <div class="item-header item-avatar">
+            <div class="left">
+              <!-- <img :src="info.photo" alt="" v-if="info.photo" /> -->
+              <img :src="$cdn + 'avatar.png'" />
+              <div class="left-right">
+                <h2>{{ info.name }}</h2>
+                <p style="color: #2979ff;" @click="callPhone(info.phone)"><u-icon name="phone" color="#2979ff" size="28"></u-icon>{{ info.phone }}</p>
+              </div>
+            </div>
+            <span @click="linkTo(`./residentDetail?id=${info.id}`)">详情</span>
+          </div>
+          <div class="item-info">
+            <label>现住地址</label>
+            <span>{{ info.countyName  +  info.townName + info.villageName }}</span>
+          </div>
+          <div class="item-info">
+            <label>详细地址</label>
+            <span>{{ info.currentAddress }}</span>
+          </div>
+        </div>
+        <div class="item-wrapper">
+          <div class="item-header">
+            <div class="left">
+              <h2>帮扶措施</h2>
+            </div>
+            <span @click="toLogList()" v-if="$permissions('app_apppreventionreturntopovertylog_detail')">查看</span>
+          </div>
+          <div class="item-info">
+            <label>采取措施</label>
+            <span>{{ info.helpLog? $dict.getLabel('fpAssistanceMeasures',info.helpLog.operationDesc): '-' }}</span>
+          </div>
+        </div>
+        <div class="item-wrapper">
+          <div class="item-header">
+            <div class="left">
+              <h2>家庭成员</h2>
+              <i :style="{color: info.family && info.family.length ? '#2EA222' : '#FF4466'}">({{
+                  info.family && info.family.length ? '已填写' : '未填写'
+                }})</i>
+            </div>
+            <span @click="toFamily()">编辑</span>
+          </div>
+          <div class="item-info">
+            <label>未参加医疗参保</label>
+            <span>{{ basicNum.length }}人</span>
+          </div>
+          <div class="item-info">
+            <label>未参加养老保险</label>
+            <span>{{ endNum.length }}人</span>
+          </div>
+        </div>
+        <div class="item-wrapper">
+          <div class="item-header">
+            <div class="left">
+              <h2>生产生活条件</h2>
+              <i :style="{color: isFamilySituation ? '#2EA222' : '#FF4466'}">({{
+                  isFamilySituation ? '已填写' : '未填写'
+                }})</i>
+            </div>
+            <span @click="linkTo(`./MonitorFamilySituation?id=${info.id}&girdId=${girdInfo.girdId}&girdName=${girdInfo.girdName}`)">编辑</span>
+          </div>
+          <div class="item-info">
+            <label>是否危房</label>
+            <span>{{ $dict.getLabel('fpYesOrNo', info.dilapidatedHousehold) || '-' }}</span>
+          </div>
+          <div class="item-info">
+            <label>是否解决安全饮水</label>
+            <span>{{ $dict.getLabel('fpYesOrNo', info.drinkingWaterSafety) || '-' }}</span>
+          </div>
+        </div>
+        <div class="item-wrapper">
+          <div class="item-header">
+            <div class="left">
+              <h2>家庭风险情况</h2>
+              <i :style="{color: isFamilyRisk ? '#2EA222' : '#FF4466'}">({{ isFamilyRisk ? '已填写' : '未填写' }})</i>
+            </div>
+            <span @click="linkTo(`./familyRisk?id=${info.id}&girdId=${girdInfo.girdId}&girdName=${girdInfo.girdName}`)">编辑</span>
+          </div>
+          <div class="item-info">
+            <label>监测对象类型</label>
+            <span>{{ $dict.getLabel('fpType', info.objectType) }}</span>
+          </div>
+          <div class="item-info">
+            <label>风险因素</label>
+            <span>{{ $dict.getLabel('fpRiskType', info.riskType) }}</span>
+          </div>
+        </div>
+        <div class="item-wrapper">
+          <div class="item-header">
+            <div class="left">
+              <h2>家庭收支情况</h2>
+              <i :style="{color: familyIncome ? '#2EA222' : '#FF4466'}">({{ familyIncome ? '已填写' : '未填写' }})</i>
+            </div>
+            <span @click="linkTo(`./MonitorIncome?id=${info.id}&girdId=${girdInfo.girdId}&girdName=${girdInfo.girdName}`)">编辑</span>
+          </div>
+          <div class="item-info">
+            <label>家庭纯收入</label>
+            <span>{{ info.familyIncome }}元</span>
+          </div>
+          <div class="item-info">
+            <label>家庭人均纯收入</label>
+            <span>{{ info.perCapitaIncome }}元</span>
+          </div>
+        </div>
+        <!-- 风险解除 -->
+        <!-- v-if="info.status == 3" -->
+        <div class="item-wrapper" v-if="info.status == 3">
+          <div class="item-header">
+            <div class="left">
+              <h2>风险解除跟踪</h2>
+              <i :style="{color: moveRisk ? '#2EA222' : '#FF4466'}">({{ moveRisk ? '已填写' : '未填写' }})</i>
+            </div>
+            <span @click="linkTo(`./MonitorPoorStatus?id=${info.id}&girdId=${girdInfo.girdId}&girdName=${girdInfo.girdName}`)">编辑</span>
+          </div>
+          <div class="item-info">
+            <label>信息采集人</label>
+            <span>{{ info.updateUserName || '-' }}</span>
+          </div>
+          <div class="item-info">
+            <label>信息采集人电话</label>
+            <span>{{ info.updateUserPhone || '-' }}</span>
+          </div>
+        </div>
+      </div>
+
+      <div class="tab-content__item" v-show="currIndex === 1">
+        <div class="log-item" v-for="(item, index) in list" :key="index">
+          <div class="log-item__wrapper">
+            <div class="log-item__user">
+              <div class="left">
+                <div class="user">
+                  <span>{{ item.createUserName.substr(item.createUserName.length - 2) }}</span>
+                </div>
+                <h2>{{ item.createUserName }}</h2>
+              </div>
+              <div class="right">
+                <span>{{ item.createTime }}</span>
+                <u-icon name="list" color="#999" size="28" @click="edit(item.id)" style="margin-left:16px;" v-if="item.createUserId == user.id && item.operationDesc == '走访排查'"></u-icon>
+              </div>
+            </div>
+            <p style="color: #999999;">操作类型：{{ item.operationDesc }}</p>
+            <p>{{ item.detail }}</p>
+            <div class="imgs" v-if="item.files && item.files.length">
+              <image :src="img.url" @click="prevImg(item.files, img.url)" v-for="(img, index) in item.files"
+                     :key="index"/>
+            </div>
+          </div>
+        </div>
+        <AiEmpty v-if="!list.length" style="padding-bottom: 20px;"></AiEmpty>
+      </div>
+    </div>
+    <AiFixedBtn v-if="currIndex === 1">
+      <div class="addBtn iconfont iconfont-iconfangda" @tap="toAddLog()"></div>
+    </AiFixedBtn>
+     <!-- 0：待纳入、1：监测中、2：待解除、3：已解除、4：已驳回 -->
+    <div v-if="checkType == 1 && currIndex != 1">
+      <div class="footer-btn" v-if="info.status == 1">
+        <div class="confirm-btn" @click="toAddView('您确认要申请解除此监测对象的风险吗？', '')">申请解除风险</div>
+      </div>
+      <div class="footer-btn" v-if="info.status == 3 || info.status == 4">
+        <div @click="del" v-if="$permissions('app_apppreventionreturntopoverty_del')">删除人员</div>
+        <div class="confirm-btn" @click="toAddView('您确认要申请纳入此监测对象吗？', '')">申请纳入监测</div>
+      </div>
+    </div>
+
+    <div v-if="checkType == 2 && currIndex != 1">
+
+      <div class="footer-btn" v-if="info.status == 0 && userInfo != ''">
+        <div class="confirm-btn" @click="toRemove('您确认要将此居民纳入监测对象吗？', 1,0)">纳入监测审核</div>
+      </div>
+
+      <div class="footer-btn" v-if="info.status == 1">
+        <div class="confirm-btn" @click="toAddView('您确认要解除此监测对象的风险吗？', 1)">消除风险</div>
+      </div>
+
+      <div class="footer-btn" v-if="info.status == 2">
+        <div class="confirm-btn" @click="toRemove('您确认要解除此监测对象的风险吗？', 1,1)">消除风险审核</div>
+      </div>
+
+      <div class="footer-btn" v-if="(info.status == 4 || info.status == 3) && userInfo != ''">
+        <div @click="del" v-if="$permissions('app_apppreventionreturntopoverty_del')">删除人员</div>
+        <div class="confirm-btn" @click="toAddView('您确认要将此居民纳入监测对象吗？', 1)">纳入监测</div>
+      </div>
+    </div>
+
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+export default {
+  name: 'detail',
+
+  data() {
+    return {
+      info: {},
+      pageShow: false,
+      currIndex: 0,
+      list: [],
+      isFrom: false,
+      viewAll: false,
+      checkType: '',
+      girdInfo: {},
+      userInfo: {},
+      id: '',
+      basicNum: [],
+      endNum: [],
+    }
+  },
+
+  computed: {
+    ...mapState(['user']),
+    isIncome() {
+      if (!this.info.id) {
+        return false
+      }
+      return this.info.income8 > 0 || this.info.income8 > 0;
+    },
+
+    isPoorStatus() {
+      if (!this.info.id) {
+        return false
+      }
+      return (this.info.industrialAssistance || this.info.healthAssistance || this.info.employmentAssistance || this.info.educationalAssistance
+      || this.info.financialAssistance || this.info.socialAssistance || this.info.publicWelfarePostAssistance);
+    },
+
+    isFamilySituation() {
+      if (!this.info.id) {
+        return false
+      }
+      return (this.info.drinkingWaterSafety || this.info.dilapidatedHouse && this.info.move);
+    },
+    isFamilyRisk() {
+      if (!this.info.id) {
+        return false
+      }
+      return (this.info.objectType || this.info.riskType || this.info.militaryMartyrs || this.info.dropOutOfSchool)
+    },
+
+    familyIncome() {
+      if (!this.info.id) {
+        return false
+      }
+      return (this.info.income1 || this.info.income2 || this.info.income3 || this.info.income4
+       || this.info.income5|| this.info.income6|| this.info.income7|| this.info.income8 || this.info.income9 ||
+       this.info.income10 || this.info.income11 || this.info.income12 ||
+       this.info.income13 || this.info.income14 || this.info.income15)
+    },
+
+    moveRisk() {
+      if (!this.info.id) {
+        return false
+      }
+      return (this.info.fxxcIncome1 || this.info.fxxcIncome2 || this.info.fxxcIncome3 || this.info.fxxcIncome4
+       || this.info.fxxcIncome5 || this.info.fxxcIncome6 || this.info.fxxcIncome7)
+    }
+
+  },
+
+  onLoad(query) {
+    if (query.isFrom) {
+      this.isFrom = true
+    }
+    this.$dict.load(['fpType', 'riskEliminationMethod', 'fpRiskType', 'fpYesOrNo', 'fpNation', 'fpEducation', 'fpStudentsInSchool', 'fpHealth',
+    'fpLaborSkills', 'fpPoliticalOutlook', 'fpIndustrialAssistance', 'fpHealthAssistance','fpAssistanceMeasures']).then(() => {
+      this.isGirdUser()
+      this.getInfo()
+    })
+
+    this.id = query.id
+    this.getUserPopup()
+  },
+  onShow() {
+    document.title = '监测对象详情'
+    uni.$on('reload', () => {
+      this.getInfo()
+    })
+  },
+
+  methods: {
+    isGirdUser() {
+      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
+        if (res.code == 0) {
+          this.checkType = res.data.checkType
+          this.girdInfo = res.data
+        }
+      })
+    },
+
+    callPhone(phone) {
+      uni.makePhoneCall({phoneNumber: phone})
+    },
+
+    linkTo(url) {
+      uni.navigateTo({url})
+    },
+
+    call(phone) {
+      if (phone) {
+        uni.makePhoneCall({
+          phoneNumber: phone
+        })
+      }
+    },
+
+    edit(id) {
+      uni.showActionSheet({
+        itemList: ['编辑', '删除'],
+        success: res => {
+          if (res.tapIndex === 0) {
+            uni.navigateTo({
+              url: `./MonitorAddLog?pid=${this.info.id}&id=${id}&type=0`
+            })
+          } else if (res.tapIndex === 1) {
+            this.$confirm('确定删除该数据？').then(() => {
+              uni.showLoading()
+              this.$http.post(`/app/apppreventionreturntopovertylog/delete?ids=${id}`).then(res => {
+                if (res.code === 0) {
+                  this.$u.toast('删除成功')
+                  this.getInfo()
+                }
+                uni.hideLoading()
+              })
+            }).catch(() => {
+            })
+          }
+        }
+      })
+    },
+
+    prevImg(urls, img) {
+      const imgs = urls.map(v => v.url)
+      uni.previewImage({
+        urls: imgs,
+        current: img
+      })
+    },
+
+    toAddLog() {
+      uni.navigateTo({
+        url: `./MonitorAddLog?pid=${this.info.id}&type=0`
+      })
+    },
+
+    toLogList() {
+      uni.navigateTo({
+        url: `./LogList?id=${this.info.id}`
+      })
+    },
+
+    changeTab(index) {
+      this.currIndex = index
+    },
+
+    getUserPopup() {
+      this.$http.post(`/app/apppreventionreturntopoverty/popup?id=${this.id}`).then(res => {
+        if (res?.code === 0) {
+          this.userInfo = res.data
+        }
+      })
+    },
+
+    getInfo() {
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${this.id}`).then(res => {
+        if (res.code === 0) {
+          this.info = res.data
+
+          let ylbxCount = 0
+          let ylCount = 0
+          if(res.data.family && res.data.family.length) {
+            res.data.family.forEach(item => {
+              if (item.basicMedicalTreatment === '02') {
+                ylbxCount = ylbxCount + 1
+              }
+              if (item.endowmentInsurance === '02') {
+                ylCount = ylCount + 1
+              }
+            })
+            this.endNum = res.data.family.filter(item  =>
+              (item.jcbxCxyiliao == '02' || '') && (item.jcbxCzyiliao == '02' || '')
+            )
+            this.endNum = res.data.family.filter(v=>
+              (v.jcbxCxyanglao == '02' || '') && (v.jcbxCzyanglao == '02' || '')
+            )
+          }
+
+          this.info.ylbxCount = ylbxCount
+          this.info.ylCount = ylCount
+          this.pageShow = true
+        }
+      })
+      this.$http.post(`/app/apppreventionreturntopovertylog/list?pid=${this.id}&size=1000&current=1&type=0`).then(res => {
+        if (res.code === 0) {
+          this.list = res.data.records || []
+        }
+      })
+    },
+
+    toAddView(text, pass) {
+      this.$confirm('', text).then(() => {
+        uni.navigateTo({url: `./MonitorAddView?pass=${pass}&id=${this.info.id}&status=${this.info.status}`})
+      })
+    },
+
+    del() {
+      this.$confirm('', '您确认要要删除此监测对象的信息吗？').then(() => {
+        this.$http.post(`/app/apppreventionreturntopoverty/delete?ids=${this.id}`).then(res => {
+          if (res.code === 0) {
+             this.$u.toast('删除成功')
+            uni.$emit('reload')
+            setTimeout(() => {
+              uni.navigateBack()
+            })
+          }
+        })
+      })
+    },
+
+    toRemove(text, pass,type) {
+      this.$confirm('', text).then(() => {
+        uni.navigateTo({url: `./MonitorRemoveView?pass=${pass}&id=${this.info.id}&status=${this.info.status}&type=${type}`})
+      })
+    },
+
+    toFamily() {
+      var objectType = this.info.objectType || ''
+      this.linkTo(`./MonitorFamilyMember?id=${this.info.id}&houseIdNumber=${this.info.idNumber}&objectType=${objectType}`)
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.detail {
+  padding-top: 96px;
+  padding-bottom: 130px;
+
+  &.active {
+    padding-top: 0;
+  }
+
+  .addBtn {
+    width: 96px;
+    height: 96px;
+    flex-shrink: 0;
+    background: $uni-color-primary;
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+    font-size: 48px;
+    color: #fff;
+    border-radius: 50%;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+  }
+
+  .tab {
+    display: flex;
+    position: fixed;
+    align-items: center;
+    left: 0;
+    top: 0;
+    z-index: 1;
+    width: 100%;
+    height: 96px;
+    padding: 0 60px;
+    background: #FFFFFF;
+    border-bottom: 1px solid #D4D4D4;
+    box-sizing: border-box;
+
+    * {
+      box-sizing: border-box;
+    }
+
+    span {
+      position: relative;
+      flex: 1;
+      height: 96px;
+      line-height: 96px;
+      color: #000000;
+      text-align: center;
+      font-size: 32px;
+
+      &::after {
+        position: absolute;
+        bottom: 0;
+        left: 50%;
+        width: 192px;
+        height: 6px;
+        background: transparent;
+        transform: translateX(-50%);
+        content: ' ';
+      }
+
+      &.active {
+        color: #1365DD;
+
+        &::after {
+          background: #1365DD;
+        }
+      }
+    }
+  }
+
+  .item-wrapper {
+    background: #fff;
+    margin-bottom: 16px;
+    padding: 0 32px 16px;
+
+    .item-header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      height: 96px;
+
+      & > span {
+        color: #3975C6;
+        font-size: 32px;
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+
+        h2 {
+          color: #333333;
+          font-size: 32px;
+          font-weight: 500;
+        }
+
+        i {
+          font-style: normal;
+          color: #2EA222;
+          font-size: 32px;
+        }
+      }
+    }
+
+    .item-info {
+      display: flex;
+      justify-content: space-between;
+      padding: 14px 0;
+
+      label {
+        color: #999999;
+        font-size: 32px;
+      }
+
+      span {
+        max-width: 496px;
+        text-align: right;
+        color: #333333;
+        font-size: 32px;
+      }
+    }
+
+    .item-avatar {
+      height: 192px;
+
+      img {
+        width: 112px;
+        height: 112px;
+        margin-right: 24px;
+      }
+
+      .left-right {
+        p {
+          margin-top: 8px;
+          color: #999999;
+          font-size: 28px;
+        }
+      }
+    }
+  }
+
+  .log-item {
+    padding: 0 0 0 32px;
+    background: #fff;
+
+    &:first-child {
+      margin-top: 16px;
+    }
+
+    &:last-child {
+      .log-item__wrapper {
+        border: none !important;
+      }
+    }
+
+    .log-item__wrapper {
+      padding: 32px 32px 32px 0;
+      border-bottom: 1px solid #E4E5E6;
+
+      .log-item__user {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+
+        & > div {
+          display: flex;
+          align-items: center;
+        }
+
+        .left {
+          .user, image {
+            width: 80px;
+            height: 80px;
+            line-height: 80px;
+            margin-right: 16px;
+            text-align: center;
+            border-radius: 50%;
+            background: #2266FF;
+
+            span {
+              color: #fff;
+              font-size: 28px;
+            }
+          }
+
+          h2 {
+            color: #333;
+            font-size: 32px;
+          }
+        }
+
+        .right {
+          image {
+            width: 32px;
+            height: 32px;
+          }
+
+          span {
+            margin-right: 6px;
+            color: #999999;
+            font-size: 28px;
+          }
+        }
+      }
+
+      p {
+        margin: 4px 0 16px 96px;
+        color: #343D65;
+        font-size: 28px;
+      }
+
+      .imgs {
+        margin-left: 96px;
+
+        image {
+          width: 136px;
+          height: 136px;
+          margin-right: 8px;
+          margin-bottom: 8px;
+        }
+      }
+    }
+  }
+  .view-all{
+    text-align: center;
+    font-size: 32px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    color: #3975C6;
+    line-height: 44px;
+    img{
+      width: 32px;
+      height: 32px;
+      margin-left: 8px;
+      transform: rotate(180deg);
+      transition: all 0.3s ease-in-out;
+      vertical-align: middle;
+    }
+    .img-active{
+      transform: rotate(0deg);
+    }
+  }
+  .footer-btn{
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    background: #FFF;
+    display: flex;
+    box-shadow: inset 0px 1px 0px 0px #DDDDDD;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    div{
+      flex: 1;
+      text-align: center;
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #333;
+    }
+    .confirm-btn{
+      background-color: #3192F4;
+      color: #fff;
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/LogList.vue b/src/project/grid/AppMonitoringObject/LogList.vue
new file mode 100644
index 00000000..178471b5
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/LogList.vue
@@ -0,0 +1,380 @@
+<template>
+  <div class="detail">
+    <div class="tab-content">
+      <div class="tab-content__item">
+        <div class="log-item" v-for="(item, index) in list" :key="index">
+          <div class="log-item__wrapper">
+            <div class="log-item__user">
+              <div class="left">
+                <div class="user">
+                  <span>{{ item.createUserName.substr(item.createUserName.length - 2) }}</span>
+                </div>
+                <h2>{{ item.createUserName }}</h2>
+              </div>
+              <div class="right">
+                <span>{{ item.createTime }}</span>
+                <u-icon name="list" color="#999" size="28" @click="edit(item.id)" style="margin-left:16px;" v-if="item.createUserId == user.id"></u-icon>
+              </div>
+            </div>
+            <p style="color: #999999;">帮扶措施：{{ $dict.getLabel('fpAssistanceMeasures',item.operationDesc) }}</p>
+            <p>{{ item.detail }}</p>
+            <div class="imgs" v-if="item.files && item.files.length">
+              <image :src="img.url" @click="prevImg(item.files, img.url)" v-for="(img, index) in item.files"
+                     :key="index"/>
+            </div>
+          </div>
+        </div>
+        <AiEmpty v-if="!list.length" style="padding-bottom: 20px;"></AiEmpty>
+      </div>
+    </div>
+    <AiFixedBtn>
+      <div class="addBtn iconfont iconfont-iconfangda" @tap="toAddLog(0)" v-if="$permissions('app_apppreventionreturntopovertylog_edit')"></div>
+    </AiFixedBtn>
+  </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+export default {
+  name: 'detail',
+
+  data() {
+    return {
+      id: '',
+      list: [],
+    }
+  },
+
+  onLoad(query) {
+    this.$dict.load('fpAssistanceMeasures')
+    this.id = query.id
+    this.getList()
+    uni.$on('reload', () => {
+      this.getList()
+    })
+  },
+  onShow() {
+    document.title = '帮扶措施'
+  },
+
+  computed: {
+    ...mapState(['user']),
+  },
+
+  methods: {
+    prevImg(urls, img) {
+      const imgs = urls.map(v => v.url)
+      uni.previewImage({
+        urls: imgs,
+        current: img
+      })
+    },
+
+    toAddLog() {
+      uni.navigateTo({
+        url: `./MonitorAddLog?pid=${this.id}&type=1`
+      })
+    },
+
+    getList() {
+      this.$http.post(`/app/apppreventionreturntopovertylog/list?pid=${this.id}&size=1000&current=1&type=1`).then(res => {
+        if (res.code === 0) {
+          this.list = res.data.records || []
+        }
+      })
+    },
+
+    edit(id) {
+      uni.showActionSheet({
+        itemList: ['编辑', '删除'],
+        success: res => {
+          if (res.tapIndex === 0) {
+            uni.navigateTo({
+              url: `./MonitorAddLog?pid=${this.id}&id=${id}&type=1`
+            })
+          } else if (res.tapIndex === 1) {
+            this.$confirm('确定删除该数据？').then(() => {
+              uni.showLoading()
+              this.$http.post(`/app/apppreventionreturntopovertylog/delete?ids=${id}`).then(res => {
+                if (res.code === 0) {
+                  this.$u.toast('删除成功')
+                  this.getList()
+                }
+                uni.hideLoading()
+              })
+            }).catch(() => {
+            })
+          }
+        }
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+.detail {
+  // padding-top: 16px;
+
+  &.active {
+    padding-top: 0;
+  }
+
+  .addBtn {
+    width: 96px;
+    height: 96px;
+    flex-shrink: 0;
+    background: $uni-color-primary;
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+    font-size: 48px;
+    color: #fff;
+    border-radius: 50%;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+  }
+
+  .tab {
+    display: flex;
+    position: fixed;
+    align-items: center;
+    left: 0;
+    top: 0;
+    z-index: 1;
+    width: 100%;
+    height: 96px;
+    padding: 0 60px;
+    background: #FFFFFF;
+    border-bottom: 1px solid #D4D4D4;
+    box-sizing: border-box;
+
+    * {
+      box-sizing: border-box;
+    }
+
+    span {
+      position: relative;
+      flex: 1;
+      height: 96px;
+      line-height: 96px;
+      color: #000000;
+      text-align: center;
+      font-size: 32px;
+
+      &::after {
+        position: absolute;
+        bottom: 0;
+        left: 50%;
+        width: 192px;
+        height: 6px;
+        background: transparent;
+        transform: translateX(-50%);
+        content: ' ';
+      }
+
+      &.active {
+        color: #1365DD;
+
+        &::after {
+          background: #1365DD;
+        }
+      }
+    }
+  }
+
+  .item-wrapper {
+    background: #fff;
+    margin-bottom: 16px;
+    padding: 0 32px 16px;
+
+    .item-header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      height: 96px;
+
+      & > span {
+        color: #3975C6;
+        font-size: 32px;
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+
+        h2 {
+          color: #333333;
+          font-size: 32px;
+          font-weight: 500;
+        }
+
+        i {
+          font-style: normal;
+          color: #2EA222;
+          font-size: 32px;
+        }
+      }
+    }
+
+    .item-info {
+      display: flex;
+      justify-content: space-between;
+      padding: 14px 0;
+
+      label {
+        color: #999999;
+        font-size: 32px;
+      }
+
+      span {
+        max-width: 496px;
+        text-align: right;
+        color: #333333;
+        font-size: 32px;
+      }
+    }
+
+    .item-avatar {
+      height: 192px;
+
+      img {
+        width: 112px;
+        height: 112px;
+        margin-right: 24px;
+      }
+
+      .left-right {
+        p {
+          margin-top: 8px;
+          color: #999999;
+          font-size: 28px;
+        }
+      }
+    }
+  }
+
+  .log-item {
+    padding: 0 0 0 32px;
+    background: #fff;
+
+    &:first-child {
+      margin-top: 16px;
+    }
+
+    &:last-child {
+      .log-item__wrapper {
+        border: none !important;
+      }
+    }
+
+    .log-item__wrapper {
+      padding: 32px 32px 32px 0;
+      border-bottom: 1px solid #E4E5E6;
+
+      .log-item__user {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+
+        & > div {
+          display: flex;
+          align-items: center;
+        }
+
+        .left {
+          .user, image {
+            width: 80px;
+            height: 80px;
+            line-height: 80px;
+            margin-right: 16px;
+            text-align: center;
+            border-radius: 50%;
+            background: #2266FF;
+
+            span {
+              color: #fff;
+              font-size: 28px;
+            }
+          }
+
+          h2 {
+            color: #333;
+            font-size: 32px;
+          }
+        }
+
+        .right {
+          image {
+            width: 32px;
+            height: 32px;
+          }
+
+          span {
+            margin-right: 6px;
+            color: #999999;
+            font-size: 28px;
+          }
+        }
+      }
+
+      p {
+        margin: 4px 0 16px 96px;
+        color: #343D65;
+        font-size: 28px;
+      }
+
+      .imgs {
+        margin-left: 96px;
+
+        image {
+          width: 136px;
+          height: 136px;
+          margin-right: 8px;
+          margin-bottom: 8px;
+        }
+      }
+    }
+  }
+  .view-all{
+    text-align: center;
+    font-size: 32px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    color: #3975C6;
+    line-height: 44px;
+    img{
+      width: 32px;
+      height: 32px;
+      margin-left: 8px;
+      transform: rotate(180deg);
+      transition: all 0.3s ease-in-out;
+      vertical-align: middle;
+    }
+    .img-active{
+      transform: rotate(0deg);
+    }
+  }
+  .footer-btn{
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    background: #FFF;
+    display: flex;
+    box-shadow: inset 0px 1px 0px 0px #DDDDDD;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    div{
+      flex: 1;
+      text-align: center;
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #333;
+    }
+    .confirm-btn{
+      background-color: #3192F4;
+      color: #fff;
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/MonitorAddFamilyMember.vue b/src/project/grid/AppMonitoringObject/MonitorAddFamilyMember.vue
new file mode 100644
index 00000000..a944cf93
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/MonitorAddFamilyMember.vue
@@ -0,0 +1,877 @@
+<template>
+  <div class="add">
+    <div class="form">
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;">*</i>
+              <span>与户主关系</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpRelationship" v-model="form.householdRelation"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;"></i>
+              <span>选择人员</span>
+            </div>
+            <div class="right">
+              <AiPagePicker class="select" :selected.sync="userList" single>
+                <AiMore v-model="form.name"/>
+              </AiPagePicker>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>成员姓名</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="text" v-model="form.name" :maxlength="8"
+                     placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+        <!-- <div class="form-item" v-if="!id">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>户主姓名</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="text" v-model="form.name" :maxlength="8"
+                    placeholder-style="color: #999; font-size: 30rpx;" :disabled="isEdit" />
+            </div>
+          </div>
+        </div> -->
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>证件号码</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="idcard" v-model="form.idNumber" :maxlength="20"
+                     placeholder-style="color: #999; font-size: 30rpx;" @input="changeIdNumber" :disabled="userList.length? true : false"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>性别</span>
+            </div>
+            <div class="right">
+              <span :style="form.sex === '' ? 'color:#999;' : 'color:#333;' ">{{ $dict.getLabel('sex', form.sex) || '自动识别' }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>联系方式</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="number" v-model="form.phone" :maxlength="11"
+                     placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i>*</i>
+              <span>现住址</span>
+            </div>
+            <div class="right">
+              <AiAreaPicker :fullName.sync="form.currentAreaName" v-model="form.currentAreaId">
+                <AiMore v-model="form.currentAreaName"/>
+              </AiAreaPicker>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>详细地址</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" v-model="form.currentAddress" placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>民族</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpNation" v-model="form.nation"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>政治面貌</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpPoliticalOutlook" v-model="form.politicsStatus"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;"></i>
+              <span>文化程度</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpEducation" v-model="form.education"></AiSelect>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper border-b0">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>个人照片</span>
+            </div>
+          </div>
+        </div>
+        <div class="upload">
+          <AiUploader :def.sync="photo" multiple placeholder="上传图片" :limit="1" action="/admin/file/add2" :disabled="id != ''"></AiUploader>
+        </div>
+      </div>
+
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;"></i>
+              <span>在校生状况</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpStudentsInSchool" v-model="form.schoolStatus"></AiSelect>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 个人健康状况 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrappers">
+            <div class="top">
+              <i style="opacity: 0;">*</i>
+              <span>个人健康状况(可多选)</span>
+            </div>
+            <div class="bottoms">
+              <div class="cards" v-for="(e, index) in helthList" :key="index">
+                <div :style="{color:e.checked == true ? '#1174FE' : '#333'}" @click="userClick(e, index)">{{ e.dictName }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 残疾类别 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="width: 8px;"></i>
+              <span>残疾类别</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpDisabilityType" v-model="form.disabilityType"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>残疾证办理年度</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpYear" v-model="form.disabilityCertificateYear"></AiSelect>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 基础保险 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrappers">
+            <div class="top">
+              <i style="opacity: 0;">*</i>
+              <span>基础保险(可多选)</span>
+            </div>
+            <div class="bottoms">
+              <div class="cards" v-for="(e, index) in basicsCheckList" :key="index">
+                <div :style="{color:e.checked == true ? '#1174FE' : '#333'}" @click="basicsCheck(e, index)">{{ e.dictName }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 保障措施 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrappers">
+            <div class="top">
+              <i style="opacity: 0;">*</i>
+              <span>保障措施(可多选)</span>
+            </div>
+            <div class="bottoms">
+              <div class="cards" v-for="(e, index) in guaranteeCheckList" :key="index">
+                <div :style="{color:e.checked == true ? '#1174FE' : '#333'}" @click="guaranteeCheck(e, index)">{{ e.dictName }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 劳动技能 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>劳动技能</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpLaborSkills" v-model="form.labourStatus"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>是否会讲普通话</span>
+            </div>
+            <div class="right">
+              <div class="check-item" :class="form.mandarin == '01' ? 'check-active' : '' " @click="form.mandarin='01'">是<img
+                  src="./components/img/check-icon.png" alt=""></div>
+              <div class="check-item" :class="form.mandarin == '02' ? 'check-active' : '' " @click="form.mandarin='02'">否<img
+                  src="./components/img/check-icon.png" alt=""></div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 就业渠道 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>就业渠道</span>
+            </div>
+            <div class="right">
+              <AiSelect dict="fpEmploymentChannels" v-model="form.employmentChannels"></AiSelect>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>务工企业名称</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="text" v-model="form.migrantEnterprises" placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>务工时间/月</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" v-model="form.workeMonths" type="number" placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>公益性岗位</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" v-model="form.publicWelfarePosts" type="text" placeholder-style="color: #999; font-size: 30rpx;" maxlength="20"/>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>公益性岗位（月数）</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" v-model="form.publicWelfarePostsMonths" type="number" placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 是否国外务工 -->
+      <div class="form-group">
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>是否国外务工</span>
+            </div>
+            <div class="right">
+              <div class="check-item" :class="form.foreignWorkers == '01' ? 'check-active' : '' " @click="form.foreignWorkers='01'">是<img
+                  src="./components/img/check-icon.png" alt=""></div>
+              <div class="check-item" :class="form.foreignWorkers == '02' ? 'check-active' : '' " @click="form.foreignWorkers='02'">否<img
+                  src="./components/img/check-icon.png" alt=""></div>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="form-item__wrapper">
+            <div class="left">
+              <i style="opacity: 0;">*</i>
+              <span>务工所在地</span>
+            </div>
+            <div class="right">
+              <input placeholder="请输入" type="text" v-model="form.foreignWorkersAddress" placeholder-style="color: #999; font-size: 30rpx;"/>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="btn" hover-class="text" @click="submit">保存</div>
+  </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+
+export default {
+  data() {
+    return {
+      form: {
+        name: '',
+        objectType: '',
+        idNumber: '',
+        sex: '',
+        phone: '',
+        currentAreaId: '',
+        currentAreaName: '',
+        nation: '',
+        politicsStatus: '',
+        education: '',
+        currentAddress: '',
+        files: [],
+        schoolStatus: '',
+        labourStatus: '',
+        workArea: '',
+        workeMonths: '',
+        basicMedicalTreatment: '',
+        seriousIllnessInsurance: '',
+        endowmentInsurance: '',
+        subsistenceAllowance: '',
+        specialPovertySupport: '',
+        girdId: '',
+        girdName: '',
+        healthyStatus: '',
+        age: '',
+        birthday: '',
+        isHousehold: '',
+        photo: '',
+        riskType: '',
+        detail: '',
+        disabilityType: '', // 残疾类型
+        disabilityCertificateYear: '',
+        basicsCheck: '',  // 基础保险
+        guaranteeCheck: '', // 保障措施
+        mandarin: '',
+        employmentChannels: '',
+        migrantEnterprises: '',
+        publicWelfarePosts: '',
+        publicWelfarePostsMonths: '',
+        foreignWorkers: '',
+        foreignWorkersAddress: '',
+        houseIdNumber: '',
+      },
+      id: '',
+      $areaId: '',
+      isEdit: false,
+      girdInfo: {},
+      householdIdNumber: '',
+      objectType: '',
+      userList: [],
+      photo: [],
+      flag: false,
+      helthList: [],
+      namelist: [],
+      basicsCheckList: [
+        {dictName: '城乡居民基本医疗保险', checked: false},
+        {dictName: '城镇职工基本医疗保险', checked: false},
+        {dictName: '大病保险', checked: false},
+        {dictName: '商业补充医疗保险', checked: false},
+        {dictName: '城乡居民基本养老保险', checked: false},
+        {dictName: '城镇职工基本养老保险', checked: false},
+        {dictName: '享受人身意外保险补贴', checked: false},
+      ],
+      basicsList: [],
+      guaranteeCheckList: [
+        {dictName: '享受农村最低生活保障', checked: false},
+        {dictName: '是否特困供养人员', checked: false},
+        {dictName: '分散供养五保户转集中供养（减少）', checked: false},
+        {dictName: '是否接受医疗救助', checked: false},
+        {dictName: '是否接受其它健康扶贫', checked: false},
+      ],
+      guaranteeList: [],
+      isAdd: 'false',
+    }
+  },
+
+  computed: {
+    ...mapState(['user'])
+  },
+
+  onLoad(query) {
+    this.householdIdNumber = query.houseIdNumber
+    this.objectType = query.objectType
+    this.$dict.load(['fpRelationship', 'riskEliminationMethod', 'fpRiskType', 'fpYesOrNo', 'fpNation', 'fpEducation', 'fpStudentsInSchool', 'fpHealth',
+      'fpLaborSkills', 'fpPoliticalOutlook', 'sex', 'fpHealth']).then(() => {
+      if (query.id) {
+        this.id = query.id
+        this.getInfo(query.id)
+        this.isEdit = true
+      }
+    })
+    this.$dict.getDict('fpHealth').map((item) => {
+      this.helthList.push({
+        dictName: item.dictName,
+        dictValue: item.dictValue,
+        checked: false,
+      })
+    })
+    if (query.index > -1) {
+      this.isEdit = true
+      this.index = Number(query.index)
+    }
+
+    this.isGirdUser()
+    this.$areaId = this.user.areaId
+    uni.$on('reload', () => {
+      this.getInfo()
+    })
+  },
+
+  onShow() {
+    document.title = this.id ? '编辑家庭成员' : '添加家庭成员'
+  },
+
+  methods: {
+    userClick(row, i) {
+      row.checked = !row.checked
+      this.form.healthyStatus = this.helthList.filter(e => e.checked)?.map(e => e.dictValue)?.toString()
+    },
+
+    // 医疗保险
+    basicsCheck(row, i) {
+      this.basicsCheckList[i].checked = !this.basicsCheckList[i].checked
+    },
+    // 保障措施
+    guaranteeCheck(row, i) {
+      this.guaranteeCheckList[i].checked = !this.guaranteeCheckList[i].checked
+    },
+    getInfo(id) {
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${id}`).then(res => {
+        if (res.code === 0) {
+          this.form = {...res.data}
+          if (this.form.photo) {
+            this.form.files = [{url: this.form.photo}]
+          } else {
+            this.form.files = []
+          }
+
+          res.data.healthyStatusList = res.data.healthyStatus.split(',')
+          res.data.healthyStatusList.map((item) => {
+            this.helthList.map(items => {
+              items.checked = item == items.dictValue
+            })
+          })
+        }
+      })
+    },
+
+    rules() {
+      return {
+        householdRelation: '请选择与户主关系',
+        name: '请输入姓名',
+        idNumber: '请输入身份证号',
+        phone: '请输入联系方式',
+        currentAreaId: '请选择现住址',
+      }
+    },
+
+    checkInit(formName, list, index) {
+      if (list[index].checked) {
+        this.form[formName] = '01'
+      } else {
+        this.form[formName] = '02'
+      }
+    },
+
+    submit() {
+
+      const rules = this.rules()
+
+      for (let v of Object.keys(rules)) {
+        if (!this.form[v]) {
+          return this.$u.toast(rules[v])
+        }
+      }
+      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('请输入正确的手机号')
+      }
+      if (!/[^0]0{0,2}$/.test(this.form.currentAreaId)) {
+        return this.$u.toast('现住址必须选到村级')
+      }
+
+      if (this.form.files.length) {
+        this.form.photo = this.form.files[0].url
+      }
+      if (this.photo.length) {
+        this.form.photo = this.photo[0].accessUrl
+      }
+
+      this.form.girdId = this.girdInfo.girdId
+      this.form.girdName = this.girdInfo.girdName
+      this.current = 1
+
+      // if(!this.form.riskType) {
+      //   return this.$u.toast('请选择风险因素')
+      // }
+
+      this.basicsCheckList.map((item, index) => {
+        if (item.checked) {
+          this.basicsList.push(index)
+        }
+      })
+
+      this.form.basicsCheck = this.basicsList.join(',')
+
+      this.guaranteeCheckList.map((item, index) => {
+        if (item.checked) {
+          this.guaranteeList.push(index)
+        }
+      })
+
+      this.form.guaranteeCheck = this.guaranteeList.join(',')
+
+      this.checkInit('jcbxCxyiliao', this.basicsCheckList, 0)
+      this.checkInit('jcbxCzyiliao', this.basicsCheckList, 1)
+      this.checkInit('jcbxDabing', this.basicsCheckList, 2)
+      this.checkInit('jcbxShangye', this.basicsCheckList, 3)
+      this.checkInit('jcbxCxyanglao', this.basicsCheckList, 4)
+      this.checkInit('jcbxCzyanglao', this.basicsCheckList, 5)
+      this.checkInit('jcbxRenshenyiwai', this.basicsCheckList, 6)
+
+      this.checkInit('bzcsNongcundibao', this.guaranteeCheckList, 0)
+      this.checkInit('bzcsTekungongyang', this.guaranteeCheckList, 1)
+      this.checkInit('bzcsWubaohu', this.guaranteeCheckList, 2)
+      this.checkInit('bzcsYiliaojiuzhu', this.guaranteeCheckList, 3)
+      this.checkInit('bzcsQita', this.guaranteeCheckList, 4)
+
+      this.$http.post('/app/apppreventionreturntopoverty/addByEwechat', {
+        ...this.form,
+        id: this.id || '',
+        girdId: this.user.girdCheckType == 1 ? this.user.girdId : '',
+        householdIdNumber: this.householdIdNumber,
+        isHousehold: '0',
+      }).then(res => {
+        if (res.code == 0) {
+          this.$u.toast('保存成功')
+          uni.$emit('reload')
+          setTimeout(() => {
+            uni.navigateBack({
+              delta: 2
+            })
+          },600)
+        }
+      }).catch((err) => {
+        this.$u.toast(err)
+      })
+    },
+
+    isGirdUser() {
+      this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => {
+        if (res.code == 0) {
+          this.girdInfo = res.data
+        }
+      })
+    },
+
+    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]$/;
+      // .length == 18 && !reg.test(this.form.idNumber)
+      if (!this.form.idNumber) {
+        return this.$u.toast('请输入正确的身份证号码')
+      }
+      var info = this.$idCardNoUtil.getIdCardInfo(this.form.idNumber)
+      this.form.sex = info.gender
+      this.form.birthDate = info.birthday
+      var myDate = new Date();
+      var month = myDate.getMonth() + 1;
+      var day = myDate.getDate();
+      var age = myDate.getFullYear() - this.form.idNumber.substring(6, 10) - 1;
+      if (this.form.idNumber.substring(10, 12) < month || this.form.idNumber.substring(10, 12) == month && this.form.idNumber.substring(12, 14) <= day) {
+        age++;
+      }
+      this.form.age = age
+    },
+  },
+  watch: {
+    userList: {
+      handler: function (v) {
+        let {name, idNumber, currentAreaId, currentAreaName} = v?.[0] || {}
+        this.form = {...this.form, name, idNumber, currentAreaId, currentAreaName}
+        this.form.sex = this.$idCardNoUtil.getIdCardInfo(idNumber)?.sex
+        this.form.birthday = this.$idCardNoUtil.getIdCardInfo(idNumber)?.birthday
+        this.form.age = this.$calcAge(this.form.idNumber)
+      },
+      deep: true,
+    },
+  },
+}
+</script>
+
+<style lang="scss">
+.add {
+  padding-bottom: 120px;
+  width: 100%;
+
+  ::v-deep .u-radio {
+    &:last-child {
+      .u-radio__label {
+        margin-right: 0;
+      }
+    }
+  }
+
+  & > div {
+    margin-bottom: 16px;
+    background: #fff;
+  }
+
+  .form-group {
+    .form-item {
+      padding-left: 32px;
+
+      .form-item__wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        border-bottom: 1px solid #E4E5E6;
+      }
+
+      .form-item__wrappers {
+        padding-right: 30px;
+        box-sizing: border-box;
+
+        .top {
+          font-size: 32px;
+          padding: 32px 0;
+        }
+
+        .bottoms {
+          padding-bottom: 20px;
+
+          .cards {
+            padding: 20px;
+            box-sizing: border-box;
+            border: 1px solid #CCCCCC;
+            border-radius: 16px;
+            margin-bottom: 16px;
+
+            .changeActive {
+              color: #1174FE;
+              border: 1px solid #1174FE;
+            }
+          }
+
+        }
+      }
+
+      .right {
+        height: 112px;
+        line-height: 112px;
+        padding-right: 32px;
+
+        span {
+          font-size: 30px;
+          color: #999999;
+        }
+
+        .check-item {
+          display: inline-block;
+          width: 140px;
+          height: 64px;
+          line-height: 64px;
+          text-align: center;
+          background: #F5F5F5;
+          border-radius: 4px;
+          font-size: 30px;
+          font-family: PingFangSC-Medium, PingFang SC;
+          font-weight: 500;
+          color: #333;
+          position: relative;
+
+          img {
+            display: none;
+          }
+        }
+
+        .check-item:nth-of-type(1) {
+          margin-right: 36px;
+        }
+
+        .check-active {
+          background: #E7F1FE;
+          color: #1174FE;
+
+          img {
+            display: block;
+            position: absolute;
+            bottom: 0;
+            right: 0;
+            width: 48px;
+            height: 48px;
+          }
+        }
+      }
+
+      input {
+        height: 100%;
+        text-align: right;
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+
+        span {
+          color: #333333;
+          font-size: 32px;
+        }
+
+        i {
+          margin-right: 4px;
+          font-style: normal;
+          color: #FF4466;
+          font-size: 32px;
+        }
+      }
+    }
+  }
+
+  .form-item__imgs {
+    padding: 32px;
+
+    .form-item__title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 34px;
+
+      h2 {
+        color: #333333;
+        font-weight: normal;
+        font-size: 32px;
+      }
+
+      i {
+        color: #999999;
+        font-size: 28px;
+        font-style: normal;
+      }
+    }
+
+    textarea {
+      width: 100%;
+    }
+  }
+
+  .form-type {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 112px;
+    padding: 0 32px;
+
+    h2 {
+      font-weight: normal;
+      color: #333333;
+      font-size: 32px;
+    }
+
+    span {
+      color: #999999;
+      font-size: 28px;
+    }
+  }
+
+  .btn {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 11;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    margin: 0;
+    text-align: center;
+    color: #FFFFFF;
+    font-size: 32px;
+    background: #3192F4;
+  }
+
+  .upload {
+    width: 100%;
+    padding: 10px 32px 32px 32px;
+    box-sizing: border-box;
+  }
+
+  .border-b0 {
+    border-bottom: 0 !important;
+  }
+
+  ::v-deep .familyMember .item {
+    width: 100%;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/MonitorAddLog.vue b/src/project/grid/AppMonitoringObject/MonitorAddLog.vue
new file mode 100644
index 00000000..4db0d8b1
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/MonitorAddLog.vue
@@ -0,0 +1,195 @@
+<template>
+  <div class="form">
+    <div class="help" v-if="type == 1">
+      <div><span style="color: #FF4466;">*</span>帮扶类型</div>
+      <AiSelect dict="fpAssistanceMeasures" v-model="operationDesc"></AiSelect>
+    </div>
+    <div class="form-item form-item__textarea">
+      <div class="form-item__title">
+        <em>*</em>
+        <h2>{{type == 1 ? '帮扶内容' : '走访内容'}}</h2>
+      </div>
+      <textarea maxlength="500" v-model="detail" :placeholder="type == 1 ? '请输入帮扶内容' : '请输入走访内容'"></textarea>
+      <div class="hint">{{ detail.length }}/500</div>
+    </div>
+    <div class="form-item form-item__imgs">
+      <div class="form-item__title">
+        <h2>图片</h2>
+        <i>（最多9张）</i>
+      </div>
+      <div>
+        <AiUploader :def.sync="files" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
+      </div>
+    </div>
+    <div class="btn" @click="submit">提交</div>
+  </div>
+</template>
+
+<script>
+
+export default {
+  data() {
+    return {
+      detail: '',
+      pid: '',
+      files: [],
+      id: '',
+      type: '',
+      operationDesc: '',
+      flag: false,
+    }
+  },
+  onLoad(query) {
+    this.$dict.load('fpAssistanceMeasures')
+    this.pid = query.pid
+    this.type = query.type
+    if(query.id) {
+      this.id = query.id
+      this.getInfo()
+    }
+  },
+  onShow() {
+    if(this.type == 1) {
+      document.title = this.id ? '编辑帮扶措施' : '添加帮扶措施'
+    }else {
+      document.title = this.id ? '编辑走访日志' : '添加走访日志'
+    }
+
+  },
+  methods: {
+    getInfo() {
+      this.$http.post(`/app/apppreventionreturntopovertylog/queryDetailById?id=${this.id}`).then(res => {
+        if (res.code == 0) {
+          this.operationDesc = res.data.operationDesc
+          this.detail = res.data.detail
+          this.files = res.data.files || []
+        }
+      })
+    },
+    submit() {
+      if(this.flag) return
+      if(this.type == 1) {
+        if (!this.operationDesc) {
+          return this.$u.toast('请选择帮扶类型')
+        }
+        if (!this.detail) {
+          return this.$u.toast('请输入帮扶内容')
+        }
+      } else {
+        if (!this.detail) {
+          return this.$u.toast('请输入走访内容')
+        }
+      }
+
+      this.flag = true
+      this.$http.post('/app/apppreventionreturntopovertylog/addOrUpdate', {
+        detail: this.detail,
+        files: this.files,
+        pid: this.pid,
+        id: this.id,
+        type: this.type,
+        operationDesc: this.operationDesc
+      }).then(res => {
+        if (res.code === 0) {
+          this.$u.toast('提交成功')
+          uni.$emit('reload')
+          setTimeout(() => {
+            uni.navigateBack({
+              delta: 1
+            })
+          }, 300)
+
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.form {
+  padding-bottom: 120px;
+
+  .help {
+    padding: 32px;
+    box-sizing: border-box;
+    display: flex;
+    justify-content: space-between;
+    background: #fff;
+    margin-bottom: 16px;
+  }
+
+  .form-item {
+    padding: 32px;
+    background: #fff;
+    margin-bottom: 16px;
+
+    .form-item__title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 34px;
+
+      em {
+        margin-right: 4px;
+        font-style: normal;
+        color: #FF4466;
+      }
+
+      h2 {
+        color: #333333;
+        font-weight: normal;
+        font-size: 32px;
+      }
+
+      i {
+        color: #999999;
+        font-size: 28px;
+        font-style: normal;
+      }
+    }
+
+    textarea {
+      width: 100%;
+    }
+  }
+
+  .form-type {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 112px;
+    padding: 0 32px;
+
+    h2 {
+      font-weight: normal;
+      color: #333333;
+      font-size: 32px;
+    }
+
+    span {
+      color: #999999;
+      font-size: 28px;
+    }
+  }
+
+  .btn {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 11;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    margin: 0;
+    text-align: center;
+    color: #FFFFFF;
+    font-size: 32px;
+    background: #3192F4;
+  }
+
+  .hint{
+    text-align: right;
+    color: #999;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/MonitorAddView.vue b/src/project/grid/AppMonitoringObject/MonitorAddView.vue
new file mode 100644
index 00000000..02620a2c
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/MonitorAddView.vue
@@ -0,0 +1,164 @@
+<template>
+  <div class="MonitorAddView">
+    <div class="containter">
+      <div class="type" v-if="status == 3 || status == 4 || status == 0">
+        <div><span style="color: #FF4466">*</span>风险因素</div>
+        <div>
+          <AiSelect dict="fpRiskType" v-model="riskType" />
+        </div>
+      </div>
+      <div class="type" v-if="status == 1">
+        <div><span style="color: #FF4466">*</span>风险消除方式</div>
+        <div>
+          <AiSelect dict="fpRiskEliminationMethod" v-model="riskEliminationMethod" />
+        </div>
+      </div>
+      <div class="remark">
+        <div class="title"><span style="display: inline-block;width: 8px;"></span>备注说明</div>
+        <u-input v-model="opinion" type="textarea" placeholder="请输入备注说明" height="200" :maxlength="500"></u-input>
+      </div>
+      <div class="remark">
+        <div class="title"><span style="display: inline-block;width: 8px;"></span>图片<span style="color: #999999;font-size: 14px;">(最多9张)</span></div>
+        <div style="padding-bottom: 20px; box-sizing: border-box;">
+          <AiUploader :def.sync="file" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
+        </div>
+      </div>
+    </div>
+
+    <div class="btn" @click="submit">提交</div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'MonitorAddView',
+  data() {
+    return {
+      riskType: '',
+      opinion: '',
+      pass: '',
+      file: [],
+      filesList: [],
+      riskEliminationMethod: '',
+      status: '',
+    }
+  },
+  onLoad(o) {
+    this.$dict.load('fpRiskType')
+    this.pass = o.pass,
+    this.id = o.id
+    this.status = o.status
+  },
+  onShow() {
+    document.title = (this.status == 3 || this.status == 4 ) && this.pass ==''? '申请纳入监测': this.status == 1 && this.pass ==''? '申请解除风险' :  this.status == 1 && this.pass ==1? '解除风险': (this.status == 4 || this.status==3) &&  this.pass == 1? '纳入监测':''
+  },
+  methods: {
+    submit() {
+      var url = ''
+      var params = {
+              pass: this.pass || '',
+              opinion: this.opinion,
+              files: this.filesList,
+              id: this.id,
+              riskType: this.riskType,
+              riskEliminationMethod: this.riskEliminationMethod,
+            }
+      if(this.pass == 1) {  // 网格长
+        if(!this.riskEliminationMethod) {
+            return this.$u.toast('请选择风险消除方式')
+          }
+        if(this.status == 1) {
+          url = '/app/apppreventionreturntopoverty/relieve' // 解除
+        } else if (this.status == 4 || this.status == 3) {
+          if(!this.riskType) {
+            return this.$u.toast('请选择风险因素')
+          }
+          url = `/app/apppreventionreturntopoverty/examine` //  纳入监测
+        }
+      } else {   // 网格员
+        if(this.status == '0' || this.status == '3' || this.status == '4') {
+          if(!this.riskType) {
+            return this.$u.toast('请选择风险因素')
+          }
+        }
+        if(this.status == '1') {
+          if(!this.riskEliminationMethod) {
+            return this.$u.toast('请选择风险消除方式')
+          }
+        }
+        if(this.file.length > 0) {
+          var files = []
+          this.file.map(item => {
+            files.push(item.id)
+          })
+          this.filesList = files.join(',')
+        }
+
+        if(this.status == 0 || this.status == 3 || this.status == 4) {
+          url = `/app/apppreventionreturntopoverty/examine` // 纳入监测申请
+        } else {
+          url =  `/app/apppreventionreturntopoverty/relieve`  // 消除申请
+        }
+      }
+
+      var formData = new FormData()
+      for (let key in params) {
+            formData.append(key, params[key])
+      }
+      this.$http.post(url , formData).then(res => {
+            if (res.code === 0) {
+              this.$u.toast('提交成功')
+              uni.$emit('reload')
+              setTimeout(() => {
+                uni.navigateBack({
+                  delta: 2
+                })
+              },600)
+            }
+          })
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.MonitorAddView {
+  .containter {
+    padding-bottom: 112px;
+    box-sizing: border-box;
+  }
+  .type {
+    display: flex;
+    justify-content: space-between;
+    height: 112px;
+    line-height: 112px;
+    background: #FFF;
+    padding: 0 32px;
+    box-sizing: border-box;
+  }
+  .remark {
+    margin-top: 16px;
+    background: #FFF;
+    padding: 0 32px;
+    box-sizing: border-box;
+    .title {
+      padding: 30px 0 15px 0;
+    }
+  }
+  ::v-deep .ai-uploader .fileList .default {
+    width: 160px;
+    height: 160px;
+  }
+  .btn {
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    background: #3192F4;
+    color: #FFFFFF;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/MonitorFamilyMember.vue b/src/project/grid/AppMonitoringObject/MonitorFamilyMember.vue
new file mode 100644
index 00000000..b92ca2c5
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/MonitorFamilyMember.vue
@@ -0,0 +1,274 @@
+<template>
+  <div class="familyMember" v-if="pageShow">
+    <div class="item" v-for="(item, index) in list" :key="index">
+      <div class="item-title">
+        <div class="top">
+          <div class="left">
+            <h2>{{ item.name }}</h2>
+            <span>{{ item.idNumber.replace(/(.{6}).*(.{4})/, '$1********$2') }}</span>
+          </div>
+          <span v-if="item.isHousehold == 1">户主</span>
+          <span v-else>{{ $dict.getLabel('fpRelationship', item.householdRelation) }}</span>
+        </div>
+        <div class="bottom">
+          <span>{{ $dict.getLabel('sex', item.sex) }}</span>
+          <span>{{ item.age }}岁</span>
+        </div>
+      </div>
+      <div class="item-bottom">
+        <span @click="showMore(item.id)">查看详情</span>
+        <span @click="remove(index)" v-if="item.isHousehold != 1">删除</span>
+        <span v-else></span>
+      </div>
+    </div>
+    <AiFixedBtn>
+      <div class="addBtn iconfont iconfont-iconfangda" @tap="toAdd"></div>
+    </AiFixedBtn>
+    <div class="no-more" v-if="!list.length">
+      <image src="https://cdn.cunwuyun.cn/dvcp/h5/no-admin.png"/>
+      <div>
+        <span>您还未添加过家庭成员点击</span>
+        <i  @tap="toAdd">新增按钮</i>
+        <span>试试吧~</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+export default {
+  data() {
+    return {
+      list: [],
+      id: '',
+      info: {},
+      pageShow: false,
+      houseIdNumber: '',
+      objectType: '',
+    }
+  },
+
+  onShow() {
+    document.title = '家庭成员'
+  },
+
+  onLoad(query) {
+    this.houseIdNumber = query.houseIdNumber
+    this.objectType = query.objectType
+    this.$dict.load(['fpRelationship','riskEliminationMethod', 'fpRiskType', 'fpYesOrNo', 'fpNation', 'fpEducation', 'fpStudentsInSchool', 'fpHealth',
+    'fpLaborSkills', 'fpPoliticalOutlook', 'sex', 'fpHealth']).then(() => {
+      if(query.id) {
+        this.id = query.id
+        this.getInfo()
+      }
+    })
+
+    uni.$on('reload', () => {
+      this.getInfo()
+    })
+  },
+
+  methods: {
+    toAdd() {
+      uni.navigateTo({
+        url: `./MonitorAddFamilyMember?houseIdNumber=${this.houseIdNumber}&objectType=${this.objectType}`
+      })
+    },
+
+    toEdit(index) {
+      this.$confirm('确定编辑该数据？').then(() => {
+        uni.navigateTo({
+          url: `./MonitorAddFamilyMember?id=${this.list[index].id}&houseIdNumber=${this.houseIdNumber}&objectType=${this.objectType}`
+        })
+      })
+    },
+
+    remove(index) {
+      this.$confirm('', '确定删除该数据？').then(() => {
+        this.$http.post(`/app/apppreventionreturntopoverty/delete?ids=${this.list[index].id}`).then(res => {
+          if (res.code === 0) {
+            this.$u.toast('删除成功')
+            uni.$emit('reload')
+          }
+        })
+      })
+    },
+
+    showMore(id) {
+      uni.navigateTo({url: `./residentDetail?id=${id}`})
+    },
+
+    getInfo() {
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${this.id}`).then(res => {
+        if (res.code === 0) {
+          this.info = res.data
+          if(res.data.family && res.data.family.length) {
+            this.list = res.data.family.map(item => {
+              return {
+                ...item,
+                isShow: false,
+                age: this.$calcAge(item.idNumber)
+              }
+            })
+          }
+          this.pageShow = true
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.familyMember {
+  padding: 32px 0;
+
+  .no-more {
+    padding-top: 160px;
+    text-align: center;
+
+    image {
+      width: 282px;
+      height: 304px;
+    }
+
+    div {
+      width: 280px;
+      margin: 0 auto;
+
+      span {
+        color: #999999;
+        font-size: 28px;
+      }
+
+      i {
+        font-style: normal;
+        color: #467DFE;
+        font-size: 28px;
+      }
+    }
+  }
+
+  .addBtn {
+    width: 96px;
+    height: 96px;
+    flex-shrink: 0;
+    background: $uni-color-primary;
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+    font-size: 48px;
+    color: #fff;
+    border-radius: 50%;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+  }
+
+  .item {
+    width: 686px;
+    margin: 0 auto 32px;
+    border-radius: 16px;
+    overflow: hidden;
+    background: #fff;
+
+    .item-bottom {
+      display: flex;
+      justify-content: space-between;
+      padding: 0 32px;
+      box-sizing: border-box;
+      align-items: center;
+      height: 94px;
+
+      span {
+        height: 100%;
+        line-height: 96px;
+        color: #3975C6;
+        font-size: 26px;
+        text-align: center;
+      }
+    }
+
+    .item-title {
+      padding: 32px;
+      background: #FFFFFF;
+      border-bottom: 1px solid #DDDDDD;
+
+      .top {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-bottom: 8px;
+
+        .left {
+          display: flex;
+          align-items: center;
+
+          h2 {
+            margin-right: 32px;
+            color: #333333;
+            font-size: 40px;
+            font-weight: 500;
+          }
+
+          span {
+            color: #999999;
+            font-size: 28px;
+          }
+        }
+
+        & > span {
+          color: #3975C6;
+          font-size: 28px;
+        }
+      }
+    }
+
+    .item-info {
+      display: flex;
+      align-items: center;
+      flex-wrap: wrap;
+      background: #F9F9F9;
+
+      .item-info__item {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        width: 50%;
+        height: 72px;
+        padding: 0 20px;
+        border-bottom: 1px solid #DDDDDD;
+        border-right: 1px solid #DDDDDD;
+        box-sizing: border-box;
+
+        &:nth-of-type(2n) {
+          border-right: none;
+        }
+      }
+
+      label {
+        color: #999999;
+        font-size: 26px;
+      }
+
+      span {
+        color: #3975C6;
+        font-size: 26px;
+      }
+    }
+
+    .bottom {
+      display: flex;
+      align-items: center;
+
+      span {
+        color: #999999;
+        font-size: 28px;
+
+        &:first-child {
+          margin-right: 20px;
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/MonitorFamilySituation.vue b/src/project/grid/AppMonitoringObject/MonitorFamilySituation.vue
new file mode 100644
index 00000000..3e220b2d
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/MonitorFamilySituation.vue
@@ -0,0 +1,594 @@
+<template>
+  <div class="add">
+    <div class="form-group">
+      <p>生活条件</p>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>户类型</span>
+          </div>
+          <div class="right">
+            <AiSelect dict="fpHouseType" v-model="form.houseType"></AiSelect>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>住房面积（m²）</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.houseArea" placeholder="请输入" placeholder-style="font-size: 15px;" type="number"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>与村主干路距离（公里）</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.trunkRoadDistance" placeholder="请输入" placeholder-style="font-size: 15px;" type="number"  />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>入户路类型</span>
+          </div>
+          <div class="right">
+            <AiSelect dict="fpHouseRoadType" v-model="form.houseRoadType"></AiSelect>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>主要燃料类型</span>
+          </div>
+          <div class="right">
+            <AiSelect dict="fpFuelType" v-model="form.fuelType"></AiSelect>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="form-group" style="margin-top: 8px;">
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否危房</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.dilapidatedHousehold == '01' ? 'check-active' : '' " @click="form.dilapidatedHousehold='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.dilapidatedHousehold == '02' ? 'check-active' : '' " @click="form.dilapidatedHousehold='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否解决安全饮水</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.drinkingWaterSafety == '01' ? 'check-active' : '' " @click="form.drinkingWaterSafety='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.drinkingWaterSafety == '02' ? 'check-active' : '' " @click="form.drinkingWaterSafety='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否住房损坏</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.houseDamage == '01' ? 'check-active' : '' " @click="form.houseDamage='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.houseDamage == '02' ? 'check-active' : '' " @click="form.houseDamage='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否饮水设施损坏</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.drinkingWaterDamage == '01' ? 'check-active' : '' " @click="form.drinkingWaterDamage='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.drinkingWaterDamage == '02' ? 'check-active' : '' " @click="form.drinkingWaterDamage='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否有卫生厕所</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.toilet == '01' ? 'check-active' : '' " @click="form.toilet='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.toilet == '02' ? 'check-active' : '' " @click="form.toilet='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否通生活用电</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.electric == '01' ? 'check-active' : '' " @click="form.electric='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.electric == '02' ? 'check-active' : '' " @click="form.electric='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否通广播电视</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.television == '01' ? 'check-active' : '' " @click="form.television='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.television == '02' ? 'check-active' : '' " @click="form.television='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="form-group" style="margin-top: 8px;">
+      <p>生产条件</p>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>耕地面积(亩)</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.cultivatedLandArea" placeholder="请输入" placeholder-style="font-size: 15px;" type="number"  />
+          </div>
+        </div>
+      </div>
+
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>林果面积(亩)</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.orchardArea" placeholder="请输入" placeholder-style="font-size: 15px;" type="number"  />
+          </div>
+        </div>
+      </div>
+
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>林地面积(亩)</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.woodlandArea" placeholder="请输入" placeholder-style="font-size: 15px;" type="number"  />
+          </div>
+        </div>
+      </div>
+
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>退耕还林面积(亩)</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.grainForGreenArea" placeholder="请输入" placeholder-style="font-size: 15px;" type="number"  />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>牧草地面积(亩)</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.grazingGrasslandArea" placeholder="请输入" placeholder-style="font-size: 15px;" type="number"  />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i></i>
+            <span>水面面积(亩)</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.watersArea" placeholder="请输入" placeholder-style="font-size: 15px;" type="number"  />
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="form-group" style="margin-top: 8px;">
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否有龙头企业带动</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.longtouqiye == '01' ? 'check-active' : '' " @click="form.longtouqiye='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.longtouqiye == '02' ? 'check-active' : '' " @click="form.longtouqiye='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否通生产用电</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.produceElectric == '01' ? 'check-active' : '' " @click="form.produceElectric='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.produceElectric == '02' ? 'check-active' : '' " @click="form.produceElectric='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否加入农民专业合作社</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.nongheshe == '01' ? 'check-active' : '' " @click="form.nongheshe='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.nongheshe == '02' ? 'check-active' : '' " @click="form.nongheshe='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否有创业致富带头人带动</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.cyzfdtr == '01' ? 'check-active' : '' " @click="form.cyzfdtr='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.cyzfdtr == '02' ? 'check-active' : '' " @click="form.cyzfdtr='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="btn" hover-class="text" @click="submit">保存</div>
+  </div>
+</template>
+
+<script>
+
+export default {
+  data() {
+    return {
+      form: {
+        houseType: '',
+        dilapidatedHousehold: '',
+        drinkingWaterSafety: '',
+        move: '',
+        houseArea: '',
+        trunkRoadDistance: '',
+        houseRoadType: '',
+        fuelType:'',
+        houseDamage: '',
+        drinkingWaterDamage: '',
+        toilet: '',
+        electric: '',
+        television: '',
+        cultivatedLandArea: '', // 耕地面积
+        orchardArea: '',
+        woodlandArea: '',
+        grainForGreenArea: '',
+        grazingGrasslandArea: '',
+        watersArea: '',
+        longtouqiye: '',
+        produceElectric: '',
+        nongheshe: '',
+        cyzfdtr: '',
+      },
+      id: '',
+      girdId: '',
+      girdName: '',
+      value: '',
+    }
+  },
+
+
+  onLoad(query) {
+    this.$dict.load(['fpYesOrNo', 'fpRiskType','fpHouseRoadType','fpFuelType','fpHouseType']).then(() => {
+      this.getInfo(query.id)
+    })
+    this.id = query.id
+    this.girdId = query.girdId
+    this.girdName = query.girdName
+
+
+  },
+
+  onShow() {
+    document.title = '生活生产条件'
+  },
+
+  methods: {
+    getInfo(id) {
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${id}`).then(res => {
+        if (res.code === 0) {
+          this.form = {
+            ...this.form,
+            ...res.data
+          }
+        }
+
+        uni.hideLoading()
+      })
+    },
+
+    submit() {
+
+      if(!this.form.dilapidatedHousehold) {
+        return this.$u.toast('请选择是否危房')
+      }
+      if(!this.form.drinkingWaterSafety) {
+        return this.$u.toast('请选择是否解决安全饮水')
+      }
+      if(!this.form.houseDamage) {
+        return this.$u.toast('请选择是否住房损坏')
+      }
+      if(!this.form.drinkingWaterDamage) {
+        return this.$u.toast('请选择是否饮水设施损坏')
+      }
+      if(!this.form.toilet) {
+        return this.$u.toast('请选择是否有卫生厕所')
+      }
+      if(!this.form.electric) {
+        return this.$u.toast('请选择是否通生活用电')
+      }
+      if(!this.form.television) {
+        return this.$u.toast('请选择是否通广播电视')
+      }
+      if(!this.form.longtouqiye) {
+        return this.$u.toast('请选择是否有龙头企业带动')
+      }
+      if(!this.form.produceElectric) {
+        return this.$u.toast('请选择是否通生产用电')
+      }
+      if(!this.form.nongheshe) {
+        return this.$u.toast('请选择是否加入农民专业合作社')
+      }
+      if(!this.form.cyzfdtr) {
+        return this.$u.toast('请选择是否有创业致富带头人带动')
+      }
+
+      this.form.girdId = this.girdId
+      this.form.girdName = this.girdName
+      this.$http.post('/app/apppreventionreturntopoverty/addByEwechat', {
+        ...this.form,
+        id: this.id
+      }).then(res => {
+        if (res.code === 0) {
+          this.$u.toast('操作成功')
+          uni.$emit('reload')
+          setTimeout(() => {
+            uni.navigateBack()
+          }, 600)
+        }
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+.add {
+  padding-bottom: 120px;
+
+  .form-textarea {
+    padding: 32px;
+
+    h2 {
+      margin-bottom: 32px;
+      color: #333333;
+      font-size: 32px;
+      font-weight: 500;
+    }
+
+    textarea {
+      width: 100%;
+      height: 200px;
+    }
+  }
+
+  & > div {
+    margin-bottom: 16px;
+    // background: #fff;
+  }
+
+  ::v-deep .u-radio {
+    &:last-child {
+      .u-radio__label {
+        margin-right: 0;
+      }
+    }
+  }
+  ::v-deep .AiSelect .display {
+    justify-content: flex-end;
+  }
+
+  .form-group {
+    background: #fff;
+    p {
+      color: #333333;
+      font-size: 36px;
+      padding: 20px 32px;
+      // border-bottom: 1px solid #E4E5E6;
+      font-weight: 600;
+    }
+    .form-item {
+      padding: 0 32px;
+
+      .form-item__wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        border-bottom: 1px solid #E4E5E6;
+      }
+
+      .left {
+        width: 300px;
+      }
+
+      .right {
+        width: calc(100% - 300px);
+        text-align: right;
+        ::v-deep .u-input .u-input__input .uni-input-wrapper {
+          text-align: right;
+        }
+
+        span {
+          font-size: 30px;
+          color: #999999;
+        }
+        .check-item{
+          display: inline-block;
+          width: 160px;
+          height: 64px;
+          line-height: 64px;
+          text-align: center;
+          background: #F5F5F5;
+          border-radius: 4px;
+          font-size: 30px;
+          font-family: PingFangSC-Medium, PingFang SC;
+          font-weight: 500;
+          color: #333;
+          position: relative;
+          img{
+            display: none;
+          }
+        }
+        .check-item:nth-of-type(1) {
+          margin-right: 36px;
+        }
+        .check-active{
+          background: #E7F1FE;
+          color: #1174FE;
+          img{
+            display: block;
+            position: absolute;
+            bottom: 0;
+            right: 0;
+            width: 48px;
+            height: 48px;
+          }
+        }
+      }
+
+      input {
+        height: 100%;
+        text-align: right;
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+
+        span {
+          color: #333333;
+          font-size: 32px;
+        }
+
+        i {
+          margin-right: 4px;
+          font-style: normal;
+          color: #FF4466;
+          font-size: 32px;
+        }
+      }
+
+      &:last-child {
+        .form-item__wrapper {
+          border: none;
+        }
+      }
+    }
+  }
+
+  .form-item__imgs {
+    padding: 32px;
+
+    .form-item__title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 34px;
+
+      h2 {
+        color: #333333;
+        font-weight: normal;
+        font-size: 32px;
+      }
+
+      i {
+        color: #999999;
+        font-size: 28px;
+        font-style: normal;
+      }
+    }
+
+    textarea {
+      width: 100%;
+    }
+  }
+
+  .form-type {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 112px;
+    padding: 0 32px;
+
+    h2 {
+      font-weight: normal;
+      color: #333333;
+      font-size: 32px;
+    }
+
+    span {
+      color: #999999;
+      font-size: 28px;
+    }
+  }
+
+  .btn {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 11;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    margin: 0;
+    text-align: center;
+    color: #FFFFFF;
+    font-size: 32px;
+    background: #3192F4;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/MonitorIncome.vue b/src/project/grid/AppMonitoringObject/MonitorIncome.vue
new file mode 100644
index 00000000..f3d47c1c
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/MonitorIncome.vue
@@ -0,0 +1,385 @@
+<template>
+  <div class="add">
+    <div class="form-group">
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>工资性收入(元)</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income3" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>生产经营收入(元)</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income4" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>计划生育金(元)</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income5" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>资产收益扶贫分红收入</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income6" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>养老保险金（元）</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income9" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="form-group">
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>低保金（元）</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income7" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>特困供养金（元）</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income8" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>生态补偿金（元）</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income10" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>财产性收入（元）</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income13" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>其他财产性收入</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income14" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>转移性收入（元）</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income11" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;"  maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>其他转移性收入（元）</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income12" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>生产经营性支出（元）</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income15" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>纳入监测对象的收入参考范围</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income1" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <span>纳入监测对象的人均收入参考范围</span>
+          </div>
+          <div class="right">
+            <input placeholder="请输入" v-model.number="form.income2" type="number"
+                   placeholder-style="color: #999; font-size: 30rpx;" maxlength="9"/>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- <p class="tips">*不填时默认为0元</p> -->
+
+    <div class="btn" hover-class="text" @click="submit">保存</div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      form: {
+        income1: '',
+        income2: '',
+        income3: '',
+        income4: '',
+        income5: '',
+        income6: '',
+        income8: '',
+        income9: '',
+        income10: '',
+        income11: '',
+        income12: '',
+        income13: '',
+        income14: '',
+        income15: '',
+      },
+      id: '',
+      girdId: '',
+      girdName: '',
+    }
+  },
+
+  onLoad(query) {
+    this.id = query.id
+    this.girdId = query.girdId
+    this.girdName = query.girdName
+    this.getInfo(query.id)
+  },
+
+  onShow() {
+    document.title = '家庭收支情况'
+  },
+
+  methods: {
+    getInfo(id) {
+
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${id}`).then(res => {
+        // var arr = ['income1','income2','income3','income4','income5','income6','income8','income9','income10','income11','income12','income13','income14','income15']
+        // var newArr = {}
+        if (res.code === 0) {
+          // for(let key in res.data) {
+          //   if(arr.includes(key)) {
+          //     newArr = res.data[key] == 0? '':res.data[key]
+          //   }
+          // }
+          // this.form = {...newArr}
+
+          this.form = {
+            ...this.form,
+            ...res.data
+          }
+        }
+      })
+    },
+
+    submit() {
+      this.form.girdId = this.girdId
+      this.form.girdName = this.girdName
+      this.$http.post('/app/apppreventionreturntopoverty/addByEwechat', {
+        ...this.form,
+        id: this.id
+      }).then(res => {
+        if (res.code === 0) {
+          this.$u.toast('保存成功')
+          uni.$emit('reload')
+          uni.navigateBack({
+            delta: 1
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.add {
+  padding-bottom: 120px;
+
+  .tips {
+    margin: 32px 0 0 32px;
+    color: #999999;
+    font-size: 26px;
+  }
+
+  & > div {
+    margin-bottom: 16px;
+    background: #fff;
+  }
+
+  .form-group {
+    .form-item {
+      padding-left: 32px;
+
+      .form-item__wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        border-bottom: 1px solid #E4E5E6;
+      }
+
+      .right {
+        height: 112px;
+        line-height: 112px;
+        padding-right: 32px;
+
+        span {
+          font-size: 30px;
+          color: #999999;
+        }
+      }
+
+      input {
+        height: 100%;
+        text-align: right;
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+
+        span {
+          color: #333333;
+          font-size: 32px;
+        }
+
+        i {
+          margin-right: 4px;
+          font-style: normal;
+          color: #FF4466;
+          font-size: 32px;
+        }
+      }
+
+      &:last-child {
+        .form-item__wrapper {
+          border: none;
+        }
+      }
+    }
+  }
+
+  .form-item__imgs {
+    padding: 32px;
+
+    .form-item__title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 34px;
+
+      h2 {
+        color: #333333;
+        font-weight: normal;
+        font-size: 32px;
+      }
+
+      i {
+        color: #999999;
+        font-size: 28px;
+        font-style: normal;
+      }
+    }
+
+    textarea {
+      width: 100%;
+    }
+  }
+
+  .form-type {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 112px;
+    padding: 0 32px;
+
+    h2 {
+      font-weight: normal;
+      color: #333333;
+      font-size: 32px;
+    }
+
+    span {
+      color: #999999;
+      font-size: 28px;
+    }
+  }
+
+  .btn {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 11;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    margin: 0;
+    text-align: center;
+    color: #FFFFFF;
+    font-size: 32px;
+    background: #3192F4;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/MonitorPoorStatus.vue b/src/project/grid/AppMonitoringObject/MonitorPoorStatus.vue
new file mode 100644
index 00000000..96e059e3
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/MonitorPoorStatus.vue
@@ -0,0 +1,305 @@
+<template>
+  <div class="add">
+    <div class="form-group">
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="opacity: 0;">*</i>
+            <span>工资性收入情况</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.fxxcIncome1" placeholder="请输入" placeholder-style="font-size: 15px;" type="text" maxlength="9" />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="opacity: 0;">*</i>
+            <span>生产经营性收入情况</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.fxxcIncome2" placeholder="请输入" placeholder-style="font-size: 15px;" type="text" maxlength="9" />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="opacity: 0;">*</i>
+            <span>财产性收入情况</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.fxxcIncome3" placeholder="请输入" placeholder-style="font-size: 15px;" type="text" maxlength="9" />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="opacity: 0;">*</i>
+            <span>理赔收入情况</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.fxxcIncome5" placeholder="请输入" placeholder-style="font-size: 15px;" type="text" maxlength="9" />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="opacity: 0;">*</i>
+            <span>转移性收入情况</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.fxxcIncome4" placeholder="请输入" placeholder-style="font-size: 15px;" type="text" maxlength="9" />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="opacity: 0;">*</i>
+            <span>生产经营支出情况</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.fxxcIncome6" placeholder="请输入" placeholder-style="font-size: 15px;" type="text" maxlength="9" />
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="opacity: 0;">*</i>
+            <span>合规自然支出情况</span>
+          </div>
+          <div class="right">
+            <u-input v-model="form.fxxcIncome7" placeholder="请输入" placeholder-style="font-size: 15px;" type="text" maxlength="9" />
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- <p class="tips">*不填时默认为0元</p> -->
+    <div class="btn" hover-class="text" @click="submit">保存</div>
+  </div>
+</template>
+
+<script>
+
+export default {
+  data() {
+    return {
+      result: '',
+      form: {
+        fxxcIncome1: '',
+        fxxcIncome2: '',
+        fxxcIncome3: '',
+        fxxcIncome4: '',
+        fxxcIncome5: '',
+        fxxcIncome6: '',
+        fxxcIncome7: '',
+      },
+      id: '',
+      girdId: '',
+      girdName: '',
+    }
+  },
+
+  onLoad(query) {
+    this.$dict.load(['fpYesOrNo', 'fpRiskEliminationMethod', 'fpIndustrialAssistance', 'fpHealthAssistance', 'fpEmploymentAssistance',
+      'fpEducationalAssistance', 'fpFinancialAssistance', 'fpSocialAssistance', 'fpPublicWelfarePostAssistance']).then(() => {
+      this.getInfo(query.id)
+    })
+    this.id = query.id
+    this.girdId = query.girdId
+    this.girdName = query.girdName
+  },
+
+  onShow() {
+    document.title = '风险解除跟踪'
+  },
+
+  methods: {
+    getInfo(id) {
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${id}`).then(res => {
+        if (res.code === 0) {
+          this.form = {
+            ...this.form,
+            ...res.data
+          }
+
+          if (this.form.riskEliminationMethod) {
+            this.form.isRisk = '01'
+          }
+        }
+      })
+    },
+
+    onRiskChange(e) {
+      if (e === '02') {
+        this.form.riskEliminationMethod = ''
+        this.form.riskEliminationDate = ''
+      }
+    },
+
+    submit() {
+      this.form.girdId = this.girdId
+      this.form.girdName = this.girdName
+      this.$http.post('/app/apppreventionreturntopoverty/addByEwechat', {
+        ...this.form,
+        id: this.id,
+      }).then(res => {
+        if (res.code === 0) {
+          this.$u.toast('保存成功')
+          uni.$emit('reload')
+          uni.navigateBack({
+            delta: 1
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.add {
+  padding-bottom: 120px;
+
+  & > div {
+    margin-bottom: 16px;
+    background: #fff;
+  }
+
+  ::v-deep .u-radio {
+    &:last-child {
+      .u-radio__label {
+        margin-right: 0;
+      }
+    }
+  }
+
+  .form-group {
+    .form-item {
+      padding-left: 32px;
+
+      .form-item__wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        border-bottom: 1px solid #E4E5E6;
+      }
+
+      .right {
+        display: flex;
+        align-items: center;
+        height: 112px;
+        padding-right: 32px;
+
+        span {
+          font-size: 30px;
+          color: #999999;
+        }
+      }
+
+      input {
+        height: 100%;
+        text-align: right;
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+
+        span {
+          color: #333333;
+          font-size: 32px;
+        }
+
+        i {
+          margin-right: 4px;
+          font-style: normal;
+          color: #FF4466;
+          font-size: 32px;
+        }
+      }
+
+      &:last-child {
+        .form-item__wrapper {
+          border: none;
+        }
+      }
+    }
+  }
+
+  .form-item__imgs {
+    padding: 32px;
+
+    .form-item__title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 34px;
+
+      h2 {
+        color: #333333;
+        font-weight: normal;
+        font-size: 32px;
+      }
+
+      i {
+        color: #999999;
+        font-size: 28px;
+        font-style: normal;
+      }
+    }
+
+    textarea {
+      width: 100%;
+    }
+  }
+
+  .form-type {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 112px;
+    padding: 0 32px;
+
+    h2 {
+      font-weight: normal;
+      color: #333333;
+      font-size: 32px;
+    }
+
+    span {
+      color: #999999;
+      font-size: 28px;
+    }
+  }
+  ::v-deep .u-input .u-input__input .uni-input-wrapper {
+    text-align: right;
+  }
+
+  .tips {
+    margin: 32px 0 0 32px;
+    color: #999999;
+    font-size: 26px;
+  }
+
+  .btn {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 11;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    margin: 0;
+    text-align: center;
+    color: #FFFFFF;
+    font-size: 32px;
+    background: #3192F4;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/MonitorRemoveView.vue b/src/project/grid/AppMonitoringObject/MonitorRemoveView.vue
new file mode 100644
index 00000000..c5c3069e
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/MonitorRemoveView.vue
@@ -0,0 +1,262 @@
+<template>
+  <div class="MonitorRemoveView">
+    <div class="user-info" v-if="info">
+      <div class="title">审核信息</div>
+      <div class="info">
+        <div class="item">
+          <span>操作类型：</span>
+          <span style="color: #2EA222;" v-if="info.operationType == 0">申请纳入监测</span>
+          <span style="color: #2EA222;" v-if="info.operationType == 1">申请解除风险</span>
+        </div>
+        <div class="item">
+          <span>监测类型：</span>
+          <span v-if="info.operationType == 0">{{ $dict.getLabel('fpRiskType',info.bizDictValue) }}</span>
+          <span v-if="info.operationType == 1">{{ $dict.getLabel('fpRiskEliminationMethod',info.bizDictValue) }}</span>
+        </div>
+        <div class="item">
+          <span>申请人：</span>
+          <span>{{ info.operationUserName }}</span>
+        </div>
+        <div class="item">
+          <span>申请时间：</span>
+          <span>{{ info.createTime }}</span>
+        </div>
+        <div class="item">
+          <span>备注说明：</span>
+          <span>{{ info.detail }}</span>
+        </div>
+        <div class="item">
+          <span style="color: #999;">图片：</span>
+          <div class="imgs" v-if="info.files && info.files.length">
+            <image :src="img.url" @click="prevImg(info.files, img.url)" v-for="(img, index) in info.files"
+                      :key="index"/>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="result">
+      <div class="title">处理意见</div>
+      <div class="check">
+        <div class="left">
+          <span style="color: #FF4466;">*</span>
+          <span>审核结果</span>
+        </div>
+        <div class="right">
+          <div class="check-item" :class="form.pass == '1' ? 'check-active' : '' " @click="form.pass='1'">{{ type == 0? '纳入监测': '解除风险'}}<img src="./components/img/check-icon.png" alt=""></div>
+          <div class="check-item" :class="form.pass == '0' ? 'check-active' : '' " @click="form.pass='0'">驳回申请<img src="./components/img/check-icon.png" alt=""></div>
+        </div>
+      </div>
+      <div class="item">
+        <div><span style="display: inline-block;width: 6px;"></span>备注说明</div>
+        <div>
+          <u-input v-model="form.opinion" type="textarea" placeholder="请输入备注说明" height="200" :maxlength="500"></u-input>
+        </div>
+      </div>
+      <div class="item">
+        <div><span style="width: 8px;"></span>图片<span style="color: #999;">(最多9张)</span></div>
+        <div style="margin-top: 20px; box-sizing: border-box;">
+          <AiUploader :def.sync="files" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader>
+        </div>
+      </div>
+    </div>
+
+    <div class="btn" @click="submit">提交</div>
+
+  </div>
+</template>
+
+<script>
+export default {
+  name: "MonitorRemoveView",
+  // 网格长审核
+  data() {
+    return {
+      info: {},
+      id: '',
+      pass: '',
+      status: '',
+      form: {
+        pass: '',
+        opinion: '',
+        files: [],
+      },
+      files: [],
+      type: '',
+    }
+  },
+  onLoad(o) {
+    this.$dict.load('fpRiskType','fpRiskEliminationMethod')
+    this.pass = o.pass;
+    this.id = o.id;
+    this.status = o.status;
+    this.form.pass = this.pass;
+    this.type = o.type
+  },
+  created() {
+    this.getInfo()
+    document.title = this.type == 0? '纳入监测审核': '解除风险审核'
+  },
+  methods: {
+    getInfo() {
+      this.$http.post(`/app/apppreventionreturntopoverty/popup?id=${this.id}`).then(res => {
+        if (res.code === 0) {
+          this.info = res.data
+        }
+      })
+    },
+    prevImg(urls, img) {
+      const imgs = urls.map(v => v.url)
+      uni.previewImage({
+        urls: imgs,
+        current: img
+      })
+    },
+
+    submit() {
+      var url = ''
+      var params = {
+        ...this.form,
+        id: this.id,
+      }
+      if (this.type == 0) {   // 纳入审核
+        url = `/app/apppreventionreturntopoverty/examine`
+      } else if (this.type == 1){     // 解除审核
+        url = `/app/apppreventionreturntopoverty/relieve`
+      }
+
+      var formData = new FormData()
+      for (let key in params) {
+            formData.append(key, params[key])
+      }
+
+      this.$http.post(url,formData).then(res => {
+        if (res.code == 0) {
+          this.$u.toast('提交成功')
+          uni.$emit('reload')
+          setTimeout(() =>{
+            uni.navigateBack({
+              delta: 2
+            })
+          },600)
+        }
+      })
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.MonitorRemoveView {
+  .user-info {
+    background: #FFF;
+    .title {
+      padding: 30px 32px;
+      box-sizing: border-box;
+      border-bottom: 1px solid #DDDDDD;
+      font-weight: 600;
+    }
+    .info {
+      padding: 30px 32px;
+      box-sizing: border-box;
+      .item {
+        display: flex;
+        span {
+          padding: 12px 0;
+        }
+        span:first-child {
+          width: 140px;
+          color: #999999;
+          text-align: right;
+        }
+        span:last-child {
+          color: #343D65;
+        }
+        .imgs {
+          image {
+            width: 136px;
+            height: 136px;
+            margin-right: 8px;
+            margin-bottom: 8px;
+          }
+        }
+      }
+    }
+  }
+  .result {
+    margin-top: 16px;
+    padding-bottom: 112px;
+    box-sizing: border-box;
+    .title {
+      height: 112px;
+      padding: 30px 32px;
+      font-weight: 600;
+      box-sizing: border-box;
+      border-bottom: 1px solid #DDDDDD;
+      background: #FFF;
+    }
+    .check {
+      display: flex;
+      justify-content: space-between;
+      border-bottom: 1px solid #DDDDDD;
+      padding: 30px 32px;
+      box-sizing: border-box;
+      background: #FFF;
+      align-items: center;
+      border-bottom: 1px solid #DDDDDD;
+      .check-item{
+        display: inline-block;
+        width: 140px;
+        height: 64px;
+        line-height: 64px;
+        text-align: center;
+        background: #F5F5F5;
+        border-radius: 4px;
+        font-size: 30px;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #333;
+        position: relative;
+        img{
+          display: none;
+        }
+      }
+      .check-item:nth-of-type(1) {
+        margin-right: 36px;
+      }
+      .check-active{
+        background: #E7F1FE;
+        color: #1174FE;
+        img{
+          display: block;
+          position: absolute;
+          bottom: 0;
+          right: 0;
+          width: 48px;
+          height: 48px;
+        }
+      }
+    }
+    .item {
+      border-bottom: 1px solid #DDDDDD;
+      padding: 30px 32px;
+      background: #FFF;
+    }
+    ::v-deep .ai-uploader .fileList .default {
+      width: 160px;
+      height: 160px;
+    }
+  }
+  .btn {
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    background: #3192F4;
+    color: #FFFFFF;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/components/img/check-icon.png b/src/project/grid/AppMonitoringObject/components/img/check-icon.png
new file mode 100644
index 00000000..4955a075
Binary files /dev/null and b/src/project/grid/AppMonitoringObject/components/img/check-icon.png differ
diff --git a/src/project/grid/AppMonitoringObject/components/img/right-icon.png b/src/project/grid/AppMonitoringObject/components/img/right-icon.png
new file mode 100644
index 00000000..58a59c4d
Binary files /dev/null and b/src/project/grid/AppMonitoringObject/components/img/right-icon.png differ
diff --git a/src/project/grid/AppMonitoringObject/components/img/service-success.png b/src/project/grid/AppMonitoringObject/components/img/service-success.png
new file mode 100644
index 00000000..95613958
Binary files /dev/null and b/src/project/grid/AppMonitoringObject/components/img/service-success.png differ
diff --git a/src/project/grid/AppMonitoringObject/components/img/top-icon-blue.png b/src/project/grid/AppMonitoringObject/components/img/top-icon-blue.png
new file mode 100644
index 00000000..5ce4b2a6
Binary files /dev/null and b/src/project/grid/AppMonitoringObject/components/img/top-icon-blue.png differ
diff --git a/src/project/grid/AppMonitoringObject/components/img/user-img.png b/src/project/grid/AppMonitoringObject/components/img/user-img.png
new file mode 100644
index 00000000..ae49d85f
Binary files /dev/null and b/src/project/grid/AppMonitoringObject/components/img/user-img.png differ
diff --git a/src/project/grid/AppMonitoringObject/familyRisk.vue b/src/project/grid/AppMonitoringObject/familyRisk.vue
new file mode 100644
index 00000000..11c86d2b
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/familyRisk.vue
@@ -0,0 +1,347 @@
+<template>
+  <div class="familyRisk">
+    <div class="form-group">
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>监测对象类型</span>
+          </div>
+          <div class="right">
+            <AiSelect dict="fpType" v-model="form.objectType"></AiSelect>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="margin-right: 8px;"></i>
+            <span>脱贫年度</span>
+          </div>
+          <div class="right">
+            <AiSelect dict="fpYear" v-model="form.povertyYear"></AiSelect>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="form-group" style="margin-top: 8px;">
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>风险因素</span>
+          </div>
+          <div class="right">
+            <AiSelect dict="fpRiskType" v-model="form.riskType"></AiSelect>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i style="margin-right: 8px;"></i>
+            <span>因自然灾害事项</span>
+          </div>
+          <div class="right">
+            <AiSelect dict="fpNaturalDisaster" v-model="form.naturalDisasterType"></AiSelect>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="form-group" style="margin-top: 8px;">
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否军烈属</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.militaryMartyrs == '01' ? 'check-active' : '' " @click="form.militaryMartyrs='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.militaryMartyrs == '02' ? 'check-active' : '' " @click="form.militaryMartyrs='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrapper">
+          <div class="left">
+            <i>*</i>
+            <span>是否义务阶段失学辍学</span>
+          </div>
+          <div class="right">
+            <div class="check-item" :class="form.dropOutOfSchool == '01' ? 'check-active' : '' " @click="form.dropOutOfSchool='01'">是<img src="./components/img/check-icon.png" alt=""></div>
+            <div class="check-item" :class="form.dropOutOfSchool == '02' ? 'check-active' : '' " @click="form.dropOutOfSchool='02'">否<img src="./components/img/check-icon.png" alt=""></div>
+          </div>
+        </div>
+      </div>
+      <div class="form-item">
+        <div class="form-item__wrappers">
+          <div class="top">
+            <i style="margin-right: 8px;"></i>
+            <span>义务阶段未上学原因</span>
+          </div>
+          <div class="bottom">
+            <u-input v-model="form.dropOutOfSchoolReason" placeholder="请输入" placeholder-style="font-size: 15px;" :height="200" type="textarea" maxlength="500" />
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="btn" @click="submit">保存</div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'familyRisk',
+  data() {
+    return {
+      form: {
+        objectType: '',
+        povertyYear: '',
+        riskType: '',
+        naturalDisasterType: '',
+        militaryMartyrs: '',
+        dropOutOfSchool: '',
+        dropOutOfSchoolReason: '',
+      },
+      value: '',
+    }
+  },
+  onLoad(query) {
+    this.$dict.load('fpYear','fpType','fpRiskType','fpNaturalDisaster').then(()=>{
+      this.getInfo(query.id)
+    })
+    this.id = query.id
+    this.girdId = query.girdId
+    this.girdName = query.girdName
+  },
+  onShow() {
+    document.title = '家庭风险情况'
+  },
+  methods: {
+    getInfo(id) {
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${id}`).then(res => {
+        if (res.code === 0) {
+          this.form = {
+            ...this.form,
+            ...res.data
+          }
+        }
+        uni.hideLoading()
+      })
+    },
+
+    submit() {
+      if (!this.form.objectType) {
+        return this.$u.toast('请选择监测对象类型')
+      }
+      if (!this.form.riskType) {
+        return this.$u.toast('请选择风险因素')
+      }
+      if (!this.form.militaryMartyrs) {
+        return this.$u.toast('是否军烈属')
+      }
+      if (!this.form.dropOutOfSchool) {
+        return this.$u.toast('是否义务阶段失学辍学')
+      }
+
+      this.form.girdId = this.girdId
+      this.form.girdName = this.girdName
+      this.$http.post('/app/apppreventionreturntopoverty/addByEwechat', {
+        ...this.form,
+        id: this.id
+      }).then(res => {
+        if (res.code === 0) {
+          this.$u.toast('保存成功')
+          uni.$emit('reload')
+          uni.navigateBack({
+            delta: 1
+          })
+        }
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+.familyRisk {
+  width: 100%;
+  box-sizing: border-box;
+  padding-bottom: 120px;
+  .form-group {
+    background: #fff;
+    p {
+      color: #333333;
+      font-size: 36px;
+      padding: 20px 32px;
+      // border-bottom: 1px solid #E4E5E6;
+      font-weight: 600;
+    }
+    .form-item {
+      padding: 0 32px;
+
+      ::v-deep .AiSelect .display {
+        justify-content: flex-end;
+      }
+
+      .form-item__wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 112px;
+        border-bottom: 1px solid #E4E5E6;
+
+        .left {
+          width: 300px;
+        }
+
+        .right {
+          width: calc(100% - 300px);
+          text-align: right !important;
+          ::v-deep .u-input .u-input__input .uni-input-wrapper {
+            text-align: right;
+          }
+
+          span {
+            font-size: 30px;
+            color: #999999;
+          }
+          .check-item{
+            display: inline-block;
+            width: 160px;
+            height: 64px;
+            line-height: 64px;
+            text-align: center;
+            background: #F5F5F5;
+            border-radius: 4px;
+            font-size: 30px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 500;
+            color: #333;
+            position: relative;
+            img{
+              display: none;
+            }
+          }
+          .check-item:nth-of-type(1) {
+            margin-right: 36px;
+          }
+          .check-active{
+            background: #E7F1FE;
+            color: #1174FE;
+            img{
+              display: block;
+              position: absolute;
+              bottom: 0;
+              right: 0;
+              width: 48px;
+              height: 48px;
+            }
+          }
+        }
+
+        input {
+          height: 100%;
+          text-align: right;
+        }
+
+        .left {
+          display: flex;
+          align-items: center;
+
+          span {
+            color: #333333;
+            font-size: 32px;
+          }
+
+          i {
+            margin-right: 4px;
+            font-style: normal;
+            color: #FF4466;
+            font-size: 32px;
+          }
+        }
+
+        &:last-child {
+          .form-item__wrapper {
+            border: none;
+          }
+        }
+      }
+
+
+      .form-item__wrappers {
+        font-size: 32px;
+        .top {
+          padding: 20px 0;
+        }
+        .bottom {
+          padding: 5px 20px;
+        }
+      }
+    }
+  }
+
+  .form-item__imgs {
+    padding: 32px;
+
+    .form-item__title {
+      display: flex;
+      align-items: center;
+      margin-bottom: 34px;
+
+      h2 {
+        color: #333333;
+        font-weight: normal;
+        font-size: 32px;
+      }
+
+      i {
+        color: #999999;
+        font-size: 28px;
+        font-style: normal;
+      }
+    }
+
+    textarea {
+      width: 100%;
+    }
+  }
+
+  .form-type {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    height: 112px;
+    padding: 0 32px;
+
+    h2 {
+      font-weight: normal;
+      color: #333333;
+      font-size: 32px;
+    }
+
+    span {
+      color: #999999;
+      font-size: 28px;
+    }
+  }
+  .btn {
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    z-index: 11;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    margin: 0;
+    text-align: center;
+    color: #FFFFFF;
+    font-size: 32px;
+    background: #3192F4;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/residentDetail.vue b/src/project/grid/AppMonitoringObject/residentDetail.vue
new file mode 100644
index 00000000..6589ca9c
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/residentDetail.vue
@@ -0,0 +1,282 @@
+<template>
+  <div class="residentDetail">
+    <div class="item-wrapper">
+      <div class="item-header item-avatar">
+        <div class="left">
+          <!-- <img :src="info.photo" alt="" v-if="info.photo" /> -->
+          <img :src="$cdn + 'avatar.png'" />
+          <div class="left-right">
+            <h2>{{ info.name }}</h2>
+            <p>{{ info.phone }}</p>
+          </div>
+        </div>
+        <span>{{ $dict.getLabel('fpRelationship',info.householdRelation) }}</span>
+      </div>
+      <div class="item-info">
+        <label>现住地址</label>
+        <span>{{ info.countyName  +  info.townName + info.villageName }}</span>
+      </div>
+      <div class="item-info">
+        <label>详细地址</label>
+        <span>{{ info.currentAddress }}</span>
+      </div>
+      <div class="more-info">
+        <div class="item-info">
+          <label>身份证号</label>
+          <span>{{ info.idNumber }}</span>
+        </div>
+        <div class="item-info">
+          <label>性别</label>
+          <span>{{ $dict.getLabel('sex', info.sex) }}</span>
+        </div>
+        <div class="item-info">
+          <label>出生日期</label>
+          <span>{{ info.birthDate }}</span>
+        </div>
+        <div class="item-info">
+          <label>民族</label>
+          <span>{{ $dict.getLabel('fpNation', info.nation) }}</span>
+        </div>
+        <div class="item-info">
+          <label>政治面貌</label>
+          <span>{{ $dict.getLabel('fpPoliticalOutlook', info.politicsStatus) }}</span>
+        </div>
+        <div class="item-info">
+          <label>文化程度</label>
+          <span>{{ $dict.getLabel('fpEducation', info.education) }}</span>
+        </div>
+        <div class="item-info">
+          <label>在校生情况</label>
+          <span>{{ $dict.getLabel('fpStudentsInSchool', info.schoolStatus) }}</span>
+        </div>
+        <div class="item-info">
+          <label>健康状况</label>
+          <span>
+             <span v-for="(item, index) in healthyStatusList" :key="index"><span v-if="index > 0">,</span>{{$dict.getLabel("fpHealth", item)}}</span>
+          </span>
+
+          <!-- <span v-for="(item,index) in">{{ $dict.getLabel('fpHealth', info.healthyStatus) }}</span>  -->
+        </div>
+        <div class="item-info">
+          <label>残疾类别</label>
+          <span>{{ $dict.getLabel('fpDisabilityType', info.disabilityType) }}</span>
+        </div>
+        <div class="item-info">
+          <label>残疾证办证年度</label>
+          <span>{{ $dict.getLabel('fpYear', info.disabilityCertificateYear) }}</span>
+        </div>
+        <!-- 基础保障 -->
+        <h4 style="fon-size: 17px;font-weight: 600;margin-top: 8px;">基础保障</h4>
+        <div class="item-info">
+          <label>是否参加城乡居民基本医保</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.jcbxCxyiliao) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否参加城镇职工基本医保</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.jcbxCzyiliao) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否参加大病保险</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.jcbxDabing) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否参加商业补充医保</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.jcbxShangye) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否参加城乡居民养老保险</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.jcbxCxyanglao) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否参加城镇职工养老保险</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.jcbxCzyanglao) }}</span>
+        </div>
+        <div class="item-info">
+          <label>享受人身意外保险</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.jcbxRenshenyiwai) }}</span>
+        </div>
+        <div class="item-info">
+          <label>享受最低生活保障</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.bzcsNongcundibao) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否特困供养</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.bzcsTekungongyang) }}</span>
+        </div>
+        <div class="item-info">
+          <label>分散转集中供养</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.bzcsWubaohu) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否接受医疗救助</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.bzcsYiliaojiuzhu) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否接受其他健康扶助</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.bzcsQita) }}</span>
+        </div>
+        <!-- 务工就业 -->
+        <h4 style="fon-size: 17px;font-weight: 600;margin-top: 8px;">务工就业</h4>
+        <div class="item-info">
+          <label>劳动技能</label>
+          <span>{{ $dict.getLabel('fpLaborSkills', info.labourStatus) }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否会讲普通话</label>
+          <span>{{ $dict.getLabel('fpYesOrNo', info.mandarin) }}</span>
+        </div>
+        <div class="item-info">
+          <label>就业渠道</label>
+          <span>{{ $dict.getLabel('fpEmploymentChannels', info.employmentChannels) }}</span>
+        </div>
+        <div class="item-info">
+          <label>务工企业名称</label>
+          <span>{{ info.migrantEnterprises }}</span>
+        </div>
+        <div class="item-info">
+          <label>务工时间/月</label>
+          <span>{{ info.workeMonths }}</span>
+        </div>
+        <div class="item-info">
+          <label>公益性岗位</label>
+          <span>{{ info.publicWelfarePosts }}</span>
+        </div>
+        <div class="item-info">
+          <label>公益性岗位(月数)</label>
+          <span>{{ info.publicWelfarePostsMonths }}</span>
+        </div>
+        <div class="item-info">
+          <label>是否国外务工</label>
+          <span>{{ $dict.getLabel('fpYesOrNo',info.foreignWorkers) }}</span>
+        </div>
+        <div class="item-info">
+          <label>务工所在地</label>
+          <span>{{ info.foreignWorkersAddress }}</span>
+        </div>
+      </div>
+    </div>
+
+    <div class="btn" @click="toAdd" v-if="$permissions('app_apppreventionreturntopoverty_edit')">编辑</div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'residentDetail',
+  data() {
+    return {
+      id: '',
+      info: {},
+      healthyStatusList: []
+    }
+  },
+  onLoad(o) {
+    this.$dict.load('fpRelationship','sex','fpNation','fpPoliticalOutlook','fpYear','fpLaborSkills','fpEmploymentChannels')
+    this.id = o.id,
+    this.getInfo()
+    uni.$on('reload',()=>{
+      this.getInfo()
+    })
+  },
+  methods: {
+    getInfo() {
+      this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${this.id}`).then(res => {
+        if (res.code === 0) {
+          this.info = res.data
+          this.healthyStatusList = res.data.healthyStatus.split(',')
+
+        }
+      })
+    },
+    toAdd() {
+      uni.navigateTo({url: `./Add?id=${this.id}`})
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.residentDetail {
+  .item-wrapper {
+    background: #fff;
+    margin-bottom: 16px;
+    padding: 0 32px 130px;
+
+    .item-header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      height: 96px;
+
+      & > span {
+        color: #3975C6;
+        font-size: 32px;
+      }
+
+      .left {
+        display: flex;
+        align-items: center;
+
+        h2 {
+          color: #333333;
+          font-size: 32px;
+          font-weight: 500;
+        }
+
+        i {
+          font-style: normal;
+          color: #2EA222;
+          font-size: 32px;
+        }
+      }
+    }
+
+    .item-info {
+      display: flex;
+      justify-content: space-between;
+      padding: 14px 0;
+
+      label {
+        color: #999999;
+        font-size: 32px;
+      }
+
+      span {
+        max-width: 496px;
+        text-align: right;
+        color: #333333;
+        font-size: 32px;
+      }
+    }
+
+    .item-avatar {
+      height: 192px;
+
+      img {
+        width: 112px;
+        height: 112px;
+        margin-right: 24px;
+      }
+
+      .left-right {
+        p {
+          margin-top: 8px;
+          color: #999999;
+          font-size: 28px;
+        }
+      }
+    }
+  }
+  .btn {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    background: #3192F4;
+    color: #FFFFFF;
+  }
+}
+</style>
diff --git a/src/project/grid/AppMonitoringObject/serviceResult.vue b/src/project/grid/AppMonitoringObject/serviceResult.vue
new file mode 100644
index 00000000..3cb11f92
--- /dev/null
+++ b/src/project/grid/AppMonitoringObject/serviceResult.vue
@@ -0,0 +1,82 @@
+<template>
+  <div class="service-result">
+    <image src="./components/img/service-success.png" />
+    <h2> 申请成功，请等待管理员审批！</h2>
+    <!-- <div class="text">
+      <span>可在</span>
+      <i>我的-进度查询</i>
+      <span>中查看</span>
+    </div> -->
+    <div class="service-btn" hover-class="text-hover" @click="back">确定</div>
+  </div>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+
+      }
+    },
+
+    onLoad (query) {
+      uni.setNavigationBarTitle({
+        title: query.title
+      })
+    },
+
+    methods: {
+      back () {
+        uni.navigateBack({
+          delta: 2
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .service-result {
+    min-height: 100vh;
+    padding-top: 96rpx;
+    text-align: center;
+    background: #fff;
+
+    .service-btn {
+      width: 558rpx;
+      height: 88rpx;
+      line-height: 88rpx;
+      margin: 120rpx auto 0;
+      text-align: center;
+      background: #197DF0;
+      font-size: 36rpx;
+      color: #fff;
+      box-shadow: 0px 8rpx 16rpx 0px rgba(0, 0, 0, 0.02);
+      border-radius: 8rpx;
+    }
+
+    h2 {
+      margin-bottom: 32rpx;
+      color: #333333;
+      font-size: 36rpx;
+      font-weight: 600;
+    }
+
+    .text {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 28rpx;
+      color: #333;
+
+      i {
+        color: #467DFE;
+      }
+    }
+
+    image {
+      width: 192rpx;
+      height: 192rpx;
+    }
+  }
+</style>
diff --git a/src/project/grid/AppSpecialPeople/AppSpecialPeople.vue b/src/project/grid/AppSpecialPeople/AppSpecialPeople.vue
new file mode 100644
index 00000000..fc64e71c
--- /dev/null
+++ b/src/project/grid/AppSpecialPeople/AppSpecialPeople.vue
@@ -0,0 +1,501 @@
+<template>
+  <div class="AppSpecialPeople">
+    <template v-if="hasGridPermit">
+      <div class="tab-select">
+        <div class="item" :class="tabIndex == index ? 'active' : ''" v-for="(item, index) in tabs" :key="index"
+             @click="tabClick(index)">{{ item }}<span></span></div>
+      </div>
+      <div class="area-select">
+        <div class="select-content">
+          <div class="area-content fill">
+            <AiPagePicker type="gird" isMyGird @select="handleGridSelect">
+              <AiMore v-model="gridName" placeholder="选择网格"/>
+            </AiPagePicker>
+            <!--          <AiAreaPicker :areaId="user.areaId" v-model="areaId" @select="areaSelect" :name.sync="areaName">-->
+            <!--            <img src="./img/local-icon.png" alt=""/>-->
+            <!--            <span class="label" v-if="areaName">{{ areaName }}</span>-->
+            <!--            <span v-else>请选择</span>-->
+            <!--            <u-icon name="arrow-down" color="#666" size="24"/>-->
+            <!--          </AiAreaPicker>-->
+          </div>
+          <div class="search-input" v-if="tabIndex">
+            <img src="./img/search-icon.png" alt=""/>
+            <u-input type="text" placeholder="请输入姓名" placeholder-style="color:#999;font-size:13px;" height="18"
+                     v-model="search.name" @confirm="getUserList" :clearable="false" maxlength="6"/>
+          </div>
+        </div>
+      </div>
+      <div v-if="!tabIndex">
+        <div class="info-content">
+          <div class="title">特殊人群</div>
+          <div class="num-content">
+            <div class="num-item" v-for="(item, index) in statisticsList" :key="index">
+              <h3 v-text="item.value"/>
+              <p v-text="item.label"/>
+            </div>
+            <AiEmpty v-if="!statisticsList.length"/>
+          </div>
+        </div>
+        <div class="info-content">
+          <div class="title">本月新增</div>
+          <div class="num-content color-org">
+            <div class="num-item" v-for="(item, index) in statisticsListMon" :key="index">
+              <h3>{{ item.value }}</h3>
+              <p>{{ item.label }}</p>
+            </div>
+            <AiEmpty v-if="!statisticsListMon.length"/>
+          </div>
+        </div>
+      </div>
+      <div v-else>
+        <div class="item-content" v-for="(item, index) in userList" :key="index">
+          <div class="title" @click="showUserType(index)">
+            <h2>{{ item.label }}</h2>
+            <img src="./img/down-icon.png" alt="" :class="item.check ? 'img-active' : ''"/>
+          </div>
+          <div class="user-list" v-if="item.check">
+            <div class="user-item" v-for="(e, indexs) in item.value" :key="indexs" @click="showDetail(e)">
+              <div class="user-img">
+                <img src="./img/user-img.png" alt=""/>
+              </div>
+              <div class="user-info">
+                <p class="name">{{ e.name }}
+                  <span class="btn-icon" v-if="isAdmin || user.id == e.create_user_id">
+                  <img src="./img/edit-icon.png" alt="" @click.stop="toEdit(e,item.dictValue)">
+                  <img src="./img/del-icon.png" alt="" @click.stop="del(e,item.dictValue)">
+                </span>
+                </p>
+                <div class="phone">
+                  <span>{{ idNumberInit(e.idNumber) }}</span>
+                  <span>{{ e.phone }}</span>
+                </div>
+              </div>
+            </div>
+            <p class="text" v-if="!item.value.length">{{ '暂无' + item.label + '信息' }}</p>
+          </div>
+        </div>
+        <div class="footer" @click="toAdd">
+          <div class="btn">新增特殊人群信息</div>
+        </div>
+      </div>
+    </template>
+    <AiEmpty description="没有网格员权限<br>无法查看特殊人员信息~" v-else/>
+  </div>
+</template>
+
+<script>
+import {mapState} from "vuex";
+
+export default {
+  name: 'AppSpecialPeople',
+  appName: '特殊人群',
+  data() {
+    return {
+      areaName: '',
+      tabs: ['统计信息', '人员信息'],
+      tabIndex: 0,
+      addressArea: '',
+      statisticsList: [],
+      statisticsListMon: [],
+      userList: [],
+      gridName: "",
+      search: {name: ''}
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+    hasGridPermit() {
+      return this.user.girdCheckType != 0
+    },
+    isAdmin() {
+      return this.user.girdCheckType == 2
+    },
+  },
+  created() {
+    this.$dict.load('appSpecialTypeFive')
+  },
+  onShow() {
+    document.title = '特殊人群管理'
+    if (this.hasGridPermit) {
+      if (!this.search.girdId) {
+        this.search.girdId = this.user.girdId
+        this.gridName = this.user.girdName
+      }
+      this.getDatas()
+    }
+  },
+  methods: {
+    getDatas() {
+      this.getStatistic()
+      this.getStatisticMon()
+      this.getUserList()
+      this.$forceUpdate()
+    },
+    handleGridSelect(e) {
+      this.gridName = e?.[0]?.girdName
+      this.search.girdId = e?.[0]?.id
+      this.getDatas()
+    },
+    areaSelect(e) {
+      this.search.areaId = e
+      this.getDatas()
+    },
+    tabClick(index) {
+      this.tabIndex = index
+    },
+    getStatistic() {
+      this.statisticsList = []
+      this.$http.post(`/app/appapplicationinfo/specialStatistic`, null, {
+        params: {...this.search, type: 0, range: 0}
+      }).then((res) => {
+        if (res?.data) {
+          for (let i in res.data) {
+            let obj = {
+              label: i,
+              value: res.data[i],
+            }
+            this.statisticsList.push(obj)
+          }
+        }
+      })
+    },
+    getStatisticMon() {
+      this.statisticsListMon = []
+      this.$http.post(`/app/appapplicationinfo/specialStatistic`, null, {
+        params: {...this.search, type: 0, range: 1}
+      }).then((res) => {
+        if (res?.data) {
+          for (let i in res.data) {
+            let obj = {
+              label: i,
+              value: res.data[i],
+            }
+            this.statisticsListMon.push(obj)
+          }
+        }
+      })
+    },
+    getUserList() {
+      this.userList = []
+      this.$http.post(`/app/appapplicationinfo/queryPeople`, null, {
+        params: {...this.search, type: 0, status: 1}
+      }).then((res) => {
+        if (res?.data) {
+          this.userList = Object.keys(res.data).map(e => ({
+            label: e,
+            value: res.data[e],
+            check: false,
+          }))
+        }
+      })
+    },
+    toAdd() {
+      uni.navigateTo({url: './add'})
+    },
+    idNumberInit(idNumber) {
+      if (!idNumber) {
+        idNumber = ''
+      } else {
+        idNumber = idNumber.substring(0, 5) + '******' + idNumber.substring(12, 15)
+      }
+      return idNumber
+    },
+    showUserType(index) {
+      if (this.userList[index].check) {
+        this.userList[index].check = false
+      } else {
+        this.userList.map((item) => {
+          item.check = false
+        })
+        this.userList[index].check = true
+      }
+    },
+    toEdit(row) {
+      uni.navigateTo({
+        url: `./add?id=${row.id}&appId=${row.appId}`
+      })
+    },
+    del(row) {
+      this.$confirm('确定删除该数据?').then(() => {
+        uni.showLoading({})
+        let {id: ids, appId} = row
+        this.$http.post("/app/appapplicationinfo/delete", null, {
+          params: {ids, appId}
+        }).then((res) => {
+          if (res?.code == 0) {
+            this.$u.toast('删除成功！')
+            this.getUserList()
+          }
+          uni.hideLoading()
+        })
+      }).catch(() => {
+      })
+    },
+    showDetail(e) {
+      uni.navigateTo({url: `/apps/AppPeopleList/DetailCard?id=${e.resident_id}`})
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppSpecialPeople {
+  min-height: 100%;
+
+  .tab-select {
+    width: 100%;
+    height: 96px;
+    line-height: 96px;
+    background: #3975c6;
+    display: flex;
+
+    .item {
+      flex: 1;
+      text-align: center;
+      font-size: 28px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #cddcf0;
+    }
+
+    .active {
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      position: relative;
+      color: #fff;
+
+      span {
+        width: 48px;
+        height: 4px;
+        background: #fff;
+        position: absolute;
+        bottom: 14px;
+        left: 50%;
+        margin-left: -24px;
+      }
+    }
+  }
+
+  .area-select {
+    width: 100%;
+    background: #fff;
+    padding-left: 32px;
+    box-sizing: border-box;
+
+    .select-content {
+      width: 100%;
+      padding: 24px 32px 24px 0;
+      border-bottom: 1px solid #d8dde6;
+      display: flex;
+      justify-content: space-between;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #333;
+      line-height: 44px;
+      box-sizing: border-box;
+
+      .area-content {
+        line-height: 64px;
+
+        img {
+          width: 42px;
+          vertical-align: middle;
+          margin-right: 16px;
+        }
+
+        .u-icon {
+          margin-left: 6px;
+        }
+      }
+
+      .search-input {
+        width: 402px;
+        height: 64px;
+        background: #f5f5f5;
+        border-radius: 32px;
+        padding: 14px 32px 14px 64px;
+        box-sizing: border-box;
+        position: relative;
+
+        img {
+          width: 32px;
+          height: 32px;
+          margin-right: 12px;
+          position: absolute;
+          top: 18px;
+          left: 24px;
+        }
+
+        ::v-deep .u-input {
+          display: inline-block;
+          width: 240px;
+          font-size: 26px;
+        }
+      }
+    }
+  }
+
+  .info-content {
+    width: calc(100% - 64px);
+    background: #fff;
+    border-radius: 8px;
+    margin: 24px 32px 0;
+
+    .title {
+      padding-left: 32px;
+      line-height: 94px;
+      border-bottom: 1px solid #ddd;
+      font-size: 32px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #333;
+    }
+
+    .num-content {
+      overflow: hidden;
+
+      .num-item {
+        float: left;
+        width: 33%;
+        padding: 40px 0;
+        text-align: center;
+
+        h3 {
+          font-size: 64px;
+          font-family: DINAlternate-Bold, DINAlternate;
+          font-weight: bold;
+          color: #3192f4;
+          line-height: 74px;
+          margin-bottom: 10px;
+        }
+
+        p {
+          font-size: 28px;
+          font-family: PingFangSC-Medium, PingFang SC;
+          font-weight: 500;
+          color: #999;
+          line-height: 40px;
+        }
+      }
+    }
+
+    .color-org {
+      .num-item {
+        h3 {
+          color: #ff8700;
+        }
+      }
+    }
+  }
+
+  .item-content {
+    margin-bottom: 4px;
+
+    .title {
+      width: 100%;
+      height: 108px;
+      line-height: 108px;
+      background: #fff;
+      padding: 0 32px;
+      box-sizing: border-box;
+      display: flex;
+      justify-content: space-between;
+
+      h2 {
+        font-size: 32px;
+        font-family: PingFangSC-Semibold, PingFang SC;
+        font-weight: 600;
+        color: #333;
+      }
+
+      img {
+        width: 34px;
+        height: 34px;
+        margin-top: 38px;
+        transition: all 0.3s ease-in-out;
+      }
+
+      .img-active {
+        transform: rotate(180deg);
+      }
+    }
+
+    .user-list {
+      background-color: #fff;
+
+      .user-item {
+        padding: 24px 32px;
+        display: flex;
+
+        .user-img {
+          width: 112px;
+
+          img {
+            width: 80px;
+            height: 80px;
+          }
+        }
+
+        .user-info {
+          width: 100%;
+
+          .name {
+            font-size: 32px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 500;
+            color: #333;
+            line-height: 44px;
+            margin-bottom: 8px;
+
+            .btn-icon {
+              float: right;
+
+              img {
+                width: 48px;
+                height: 48px;
+                margin-left: 20px;
+                vertical-align: baseline;
+              }
+            }
+          }
+
+          .phone {
+            width: 100%;
+            font-size: 26px;
+            font-family: PingFangSC-Regular, PingFang SC;
+            color: #999;
+            line-height: 36px;
+            display: flex;
+            justify-content: space-between;
+          }
+        }
+      }
+    }
+  }
+
+  .text {
+    height: 96px;
+    line-height: 96px;
+    color: #999;
+    font-size: 28px;
+    text-align: center;
+  }
+
+  .footer {
+    width: 100%;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+  }
+
+  .btn {
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    background: #1365dd;
+    font-size: 32px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #fff;
+  }
+}
+</style>
diff --git a/src/project/grid/AppSpecialPeople/add.vue b/src/project/grid/AppSpecialPeople/add.vue
new file mode 100644
index 00000000..ef0f104b
--- /dev/null
+++ b/src/project/grid/AppSpecialPeople/add.vue
@@ -0,0 +1,620 @@
+<template>
+  <div class="add">
+    <div class="pad-l32">
+      <div class="item" v-if="!isEdit">
+        <span class="label"><span class="tips">*</span>类型</span>
+        <div class="value" @click="showType=true">
+          <AiMore v-model="appName"/>
+        </div>
+      </div>
+      <div class="info-content" v-for="(items, indexs) in formDataList" :key="indexs">
+        <div v-for="(item, index) in items" :key="index">
+          <!-- 初始化字段锁定 -->
+          <div class="item" v-if="!!formData[item.isInit]&&item.isInit!=item.fieldDbName">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value" v-if="item.dict"
+                 v-text="toString($dict.getLabel(item.dict, formData[item.fieldDbName]))"/>
+            <div class="value" v-else-if="item.type=='area'">
+              <AiAreaPicker :value="formData[item.fieldDbName]" isForm disabled/>
+            </div>
+            <div class="value" v-else-if="item.type=='upload'">
+              <template v-if="formData[item.fieldDbName]">
+                <ai-image v-for="(op,i) in [formData[item.fieldDbName]].flat()" :key="i" :src="op" preview/>
+              </template>
+              <span v-else>-</span>
+            </div>
+            <div class="value" v-else v-text="toString(formData[item.fieldDbName])"/>
+          </div>
+          <!-- input输入框 -->
+          <div class="item" v-else-if="item.type == 'input' || item.type == 'name' || item.type == 'phone'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value">
+              <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;"
+                       height="48" v-model="formData[item.fieldDbName]" :maxlength="item.maxLength"/>
+            </div>
+          </div>
+          <!-- number 输入框 -->
+          <div class="item" v-else-if="item.type == 'number'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value">
+              <u-input type="number" placeholder="请输入" input-align="right"
+                       placeholder-style="color:#999;font-size:16px;" height="48" v-model="formData[item.fieldDbName]"
+                       :maxlength="item.maxLength"/>
+            </div>
+          </div>
+          <!-- 身份证输入框 -->
+          <div class="item" v-else-if="item.type == 'idNumber'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value">
+              <u-input type="idcard" placeholder="请输入" input-align="right"
+                       placeholder-style="color:#999;font-size:16px;" height="48" v-model="formData[item.fieldDbName]"
+                       :maxlength="item.maxLength"/>
+            </div>
+          </div>
+          <!-- textarea输入框 富文本-->
+          <div class="textarea" v-else-if="item.type == 'textarea' || item.type == 'text' || item.type == 'rtf'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value">
+              <u-input type="textarea" placeholder="请输入请输入" placeholder-style="color:#999;font-size:16px;" height="200"
+                       v-model="formData[item.fieldDbName]" :maxlength="item.maxLength"/>
+            </div>
+          </div>
+          <!-- 字典下拉选择 -->
+          <div class="item" v-else-if="item.type == 'dict'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value" @click="selectClick(item.fieldDbName, item.dict)">
+              <AiMore :value="$dict.getLabel(item.dict, formData[item.fieldDbName])"/>
+            </div>
+          </div>
+          <!-- 单选radio -->
+          <div class="item" v-else-if="item.type == 'radio'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value">
+              <u-radio-group v-model="formData[item.fieldDbName]">
+                <u-radio :name="item.dictValue" v-for="(item, index) in $dict.getDict(item.dict)" :key="index">
+                  {{ item.dictName }}
+                </u-radio>
+              </u-radio-group>
+            </div>
+          </div>
+          <!-- 开关onOff -->
+          <div class="item" v-else-if="item.type == 'onOff'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value">
+              <u-switch v-model="formData[item.fieldDbName]" :active-value="1" :inactive-value="0"></u-switch>
+            </div>
+          </div>
+          <!-- 多选checkbox -->
+          <div class="textarea" v-else-if="item.type == 'checkbox'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value">
+              <u-checkbox-group>
+                <u-checkbox
+                    v-model="e.checked"
+                    v-for="(e, i) in item.checkList" :key="i"
+                    :name="item.dictValue"
+                    @change="checkboxChange(indexs, index, i)"
+                >{{ e.dictName }}
+                </u-checkbox>
+              </u-checkbox-group>
+            </div>
+          </div>
+          <!-- 附件 -->
+          <div class="textarea" v-else-if="item.type == 'upload'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value">
+              <AiUploader :multiple="true" type="image" :limit="9" placeholder="上传图片"
+                          :def.sync="formData[item.fieldDbName]"
+                          action="/admin/file/add2"/>
+            </div>
+          </div>
+          <!-- 地区选择 -->
+          <div class="item" v-else-if="item.type == 'area'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value" flex>
+              <AiAreaPicker @select="v=>formData[item.fieldDbName]=v" :name.sync="formData[item.fieldDbName+'_name']"
+                            all :value="formData[item.fieldDbName]" :valueLevel="item.areaPattern" isForm/>
+            </div>
+          </div>
+          <!-- 人员选择 -->
+          <div class="item" v-else-if="item.type == 'user'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value" @click="handleSelectUser(item.fieldDbName)">
+              <template v-if="!formData[item.fieldDbName].length">
+                <span>请选择</span>
+              </template>
+              <template v-else>
+                已选择<em>{{ formData[item.fieldDbName].map(e => e.name).slice(0, 2).join("、") }}</em>等<em>{{
+                  formData[item.fieldDbName].length
+                }}</em>人
+              </template>
+              <u-icon name="arrow-right" color="#ddd"></u-icon>
+            </div>
+          </div>
+          <!-- 日期选择 / 日期带时分秒选择 / 时间-时分秒选择 -->
+          <div class="item" v-else-if="item.type == 'date' || item.type == 'datetime' || item.type == 'time'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value" @click="dateClick(indexs, index)" flex>
+              <AiMore v-model="formData[item.fieldDbName]"/>
+            </div>
+          </div>
+          <!-- 居民档案选择 -->
+          <div class="item" v-else-if="item.type == 'resident'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value" flex>
+              <AiPagePicker @select="v=>handleSelectResident(v,item)" single>
+                <AiMore v-model="formData[item.fieldDbName + '_name']" :placeholder="item.fieldTips"/>
+              </AiPagePicker>
+            </div>
+          </div>
+          <!-- 网格选择 -->
+          <div class="item" v-else-if="item.type == 'gird'">
+            <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span>
+            <div class="value" flex>
+              <AiPagePicker type="gird" @select="v=>handleSelectGird(v,item)" isMyGird>
+                <AiMore v-model="formData[item.fieldDbName + '_name']" :placeholder="item.fieldTips"/>
+              </AiPagePicker>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <u-picker mode="time" v-model="dateShow" :params="deteParams" @confirm="dateConfirm">请选择</u-picker>
+    <u-select v-model="selectShow" mode="single-column" :list="selectList" label-name="dictName" value-name="dictValue"
+              @confirm="selectConfirm"></u-select>
+    <u-select v-model="showType" :list="typeList" label-name="applicationName" value-name="id"
+              @confirm="typeConfirm"></u-select>
+    <div class="footer" @click="submit" v-if="appId">
+      <div class="btn">保存</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {mapActions, mapState} from 'vuex'
+
+export default {
+  data() {
+    return {
+      appId: '',
+      appName: '',
+      showType: false,
+      typeList: [],
+      formDataList: [],
+      formData: {},
+      pageShow: false,
+      dateShow: false,
+      deteParams: {},
+      datePropIndex: '', //时间选择 formDataList索引
+      dateIndex: '', //时间选择 formDataList 数组里面的索引
+      selectName: '',
+      selectList: [],
+      selectShow: false,
+    }
+  },
+  computed: {
+    ...mapState(['user']),
+    isEdit() {
+      return !!this.$route.query.id
+    }
+  },
+  created() {
+    this.getType()
+  },
+  onShow() {
+    if (this.isEdit) {
+      document.title = "编辑人员"
+      if (!this.appId) {
+        let {appId: value} = this.$route.query
+        this.typeConfirm([{value}]).then(() => this.getDetail())
+      }
+    } else {
+      document.title = '新增人员'
+      if (this.$route.query.appId && !this.appId) {
+        let {appId: value, appName} = this.$route.query
+        this.typeConfirm([{value, label: decodeURIComponent(appName)}])
+      }
+    }
+  },
+  methods: {
+    ...mapActions(['selectEnterpriseContact']),
+    handleSelectUser(fieldDbName) {
+      this.selectEnterpriseContact({
+        fromDepartmentId: 0,
+        type: ["user"],
+        selectedUserIds: this.form[fieldDbName]?.map(e => e.id)
+      }).then(res => {
+        this.form[fieldDbName] = res?.userList || []
+      })
+    },
+    getType() {
+      this.$http.post(`/app/appapplicationinfo/queryApplicationListByType`, null, {
+        params: {type: 0, status: 1}
+      }).then((res) => {
+        if (res?.data) {
+          this.typeList = res.data
+        }
+      })
+    },
+    typeConfirm(e) {
+      this.appId = e[0].value
+      this.appName = e[0].label
+      return this.$http.post(`/app/appapplicationinfo/queryApplicationInfo?appId=${this.appId}`).then((res) => {
+        if (res?.data) {
+          this.formData = {}
+          let data = res.data
+          let dictList = []
+          let formList = {}
+          data.tableInfos.map((item) => {
+            let colItem
+            if (item.dictionaryCode) {
+              dictList.push(item.dictionaryCode)
+            }
+            if (item.dictionaryCode && item.type != 'radio' && item.type != 'checkbox' && item.type != 'onOff') {
+              colItem = {
+                ...item,
+                type: 'dict',
+                dict: item.dictionaryCode,
+                fieldValue: item.defaultValue || ''
+              }
+            } else if (item.type == 'radio') {
+              colItem = {
+                ...item,
+                dict: item.dictionaryCode,
+                fieldValue: item.defaultValue || ''
+              }
+            } else if (item.type == 'checkbox') {
+              colItem = {
+                ...item,
+                dict: item.dictionaryCode,
+                fieldValue: ''
+              }
+              if (item.defaultValue) {
+                colItem.fieldValue = item.defaultValue?.split('`')
+              }
+
+            } else if (item.type == 'onOff') {
+              colItem = {
+                ...item,
+                fieldValue: 0
+              }
+            } else if (item.type == 'number') {
+              colItem = {
+                ...item,
+                type: item.type,
+                min: item.minValue || '',
+                max: item.maxValue || '',
+                fieldValue: Number(item.defaultValue) || 0
+              }
+            } else if (item.type == 'upload' || item.type == 'user') {
+              colItem = {
+                ...item,
+                type: item.type,
+                fieldValue: []
+              }
+            } else if (item.type == 'area') {
+              colItem = {
+                ...item,
+                type: item.type,
+                fieldValue: "",
+              }
+            } else {
+              if (item.type == 'date') {
+                item.params = {year: true, month: true, day: true, hour: false, minute: false, second: false}
+              }
+              if (item.type == 'datetime') {
+                item.params = {year: true, month: true, day: true, hour: true, minute: true, second: true}
+              }
+              if (item.type == 'time') {
+                item.params = {year: false, month: false, day: false, hour: true, minute: true, second: true}
+              }
+
+              colItem = {
+                ...item,
+                type: item.type,
+              }
+              colItem.fieldValue = item.defaultValue || ''
+            }
+            formList[item.groupIndex]?.push(colItem) || (formList[item.groupIndex] = [colItem])
+            this.$set(this.formData, colItem.fieldDbName, colItem.fieldValue || "")
+          })
+          this.formDataList = Object.values(formList)
+
+          if (dictList.length) {
+            this.getDictList(dictList)
+          } else {
+            this.formDataList.map((item) => {
+              item.map((e) => {
+                if (e.type == 'onOff') { //开关
+                  this.formData[e.fieldDbName] = 0
+                }
+                if (e.type == 'area') { //地区
+                  this.formData[e.fieldDbName + '_name'] = this.user.areaName
+                }
+              })
+            })
+            this.$forceUpdate()
+            this.pageShow = true
+          }
+        }
+      })
+    },
+    getDictList(listName) {
+      this.$dict.load(listName.join(',')).then(() => {
+        this.formDataList.map((item) => {
+          item.map((e) => {
+            if (e.type == 'checkbox') {  //多选
+              var list = this.$dict.getDict(e.dict)
+              list.map((items) => {
+                items.checked = false
+              })
+              e.checkList = list
+            }
+            if (e.type == 'onOff') { //开关
+              this.formData[e.fieldDbName] = 0
+            }
+            if (e.type == 'area') { //地区
+              this.formData[e.fieldDbName + '_name'] = this.user.areaName
+            }
+          })
+        })
+        this.$forceUpdate()
+        this.pageShow = true
+      })
+    },
+    selectClick(name, dictName) {
+      this.selectName = name
+      this.selectList = this.$dict.getDict(dictName)
+      this.selectShow = true
+    },
+    selectConfirm(e) {
+      this.formData[this.selectName] = e[0].value
+    },
+    checkboxChange(indexs, index, i) {
+      this.formDataList[indexs][index].checkList[i].checked = !this.formDataList[indexs][index].checkList[i].checked
+      this.$forceUpdate()
+    },
+    dateClick(indexs, index) {
+      this.deteParams = this.formDataList[indexs][index].params
+      this.datePropIndex = indexs
+      this.dateIndex = index
+
+      this.$nextTick(() => {
+        this.dateShow = true
+      })
+    },
+    dateConfirm(e) {
+      var fieldDbName = this.formDataList[this.datePropIndex][this.dateIndex].fieldDbName
+      if (this.formDataList[this.datePropIndex][this.dateIndex].type == 'date') {  //年月日
+        this.formData[fieldDbName] = `${e.year}-${e.month}-${e.day}`
+      }
+      if (this.formDataList[this.datePropIndex][this.dateIndex].type == 'datetime') {  //年月日时分秒
+        this.formData[fieldDbName] = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}:${e.second}`
+      }
+      if (this.formDataList[this.datePropIndex][this.dateIndex].type == 'time') {  //时分秒
+        this.formData[fieldDbName] = `${e.hour}:${e.minute}:${e.second}`
+      }
+    },
+    submit() {
+      let isValid = true, form = JSON.parse(JSON.stringify(this.formData))
+      this.formDataList.map((item) => {
+        item?.map((items) => {
+          if (items.type == 'checkbox') { //多选
+            form[items.fieldDbName] = ''
+            let list = []
+            items.checkList.map((e) => {
+              if (e.checked) {
+                list.push(e.dictValue)
+              }
+            })
+            form[items.fieldDbName] = list?.toString()
+          }
+          if (items.type == 'upload') { //附件 只传id
+            let files = [];
+            [form[items.fieldDbName]]?.flat()?.map(item => item?.url&&files.push(item.url))
+            form[items.fieldDbName] = files?.toString()
+          }
+          // if (items.type == 'onOff') { //开关
+          //   form[items.fieldDbName] = form[items.fieldDbName] ? '1' : '0'
+          // }
+          if (items.type == 'area' && form[items.fieldDbName]) {
+            let area = []
+            area.push(form[items.fieldDbName])
+            area.push(form[items.fieldDbName + '_name'])
+            form[items.fieldDbName] = area.join('_')
+          }
+        })
+      })
+      this.formDataList.some((item) => {
+        return item.some((items) => {
+          if (items.mustFill == 1 && !form[items.fieldDbName]) {
+            isValid = false
+            return this.$u.toast(`${items.fieldName}为必填项`)
+          }
+        })
+      })
+
+      if (!isValid) return
+
+      this.$http.post(`/app/appapplicationinfo/addOrUpdate?appId=${this.appId}`, {
+        ...form
+      }).then(res => {
+        if (res?.code == 0) {
+          this.$u.toast('提交成功')
+          uni.navigateBack({
+            success: () => {
+              uni.$emit("selectType")
+            }
+          })
+        } else this.$u.toast(res?.msg || "提交失败,请联系管理员")
+      }).catch(err => {
+        this.$u.toast(err || "提交失败,请联系管理员")
+      })
+    },
+    handleSelectResident(resident, item) {
+      let info = resident?.[0] || {}
+      this.formData = {...this.formData, ...info}
+      this.formData[item.fieldDbName] = info.id
+      this.formData[item.fieldDbName + "_name"] = info.name
+      this.$forceUpdate()
+    },
+    toString(obj) {
+      return obj?.toString() || "-"
+    },
+    handleSelectGird(gird, item) {
+      let info = gird?.[0] || {}
+      this.formData[item.fieldDbName] = [info.id, info.girdName].join("_")
+      this.formData[item.fieldDbName + "_name"] = info.girdName
+      this.$forceUpdate()
+    },
+    getDetail() {
+      let {id, appId} = this.$route.query
+      return id ? this.$http.post("/app/appapplicationinfo/queryDetailById", null, {
+        params: {id, appId}
+      }).then(res => {
+        if (res?.data) {
+          this.formData = res.data
+          this.$forceUpdate()
+        }
+      }) : Promise.resolve()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.add {
+  padding-bottom: 112px;
+
+  .title {
+    width: 100%;
+    height: 96px;
+    line-height: 96px;
+    background: #FFF;
+    font-size: 32px;
+    font-weight: 500;
+    color: #262B36;
+    padding-right: 32px;
+    box-sizing: border-box;
+    overflow: hidden;
+
+    .tips {
+      display: inline-block;
+      width: 8px;
+      height: 32px;
+      background: #4E75FE;
+      box-shadow: 0 8px 24px 2px #C9D8FA;
+      border-radius: 4px;
+      vertical-align: middle;
+      margin-right: 22px;
+    }
+
+    .select {
+      float: right;
+      font-size: 30px;
+      color: #1365DD;
+    }
+  }
+
+  .item {
+    width: 100%;
+    padding: 34px 32px 34px 0;
+    background: #FFFFFF;
+    border-bottom: 1px solid #D8DDE6;
+    display: flex;
+    justify-content: space-between;
+    font-size: 32px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    color: #333;
+    line-height: 44px;
+    box-sizing: border-box;
+    position: relative;
+
+    .value {
+      .u-icon {
+        margin-left: 16px;
+      }
+
+      ::v-deep .u-input {
+        font-size: 32px;
+      }
+    }
+  }
+
+  .color-999 {
+    color: #999;
+  }
+
+  .tips {
+    display: inline-block;
+    width: 16px;
+    height: 44px;
+    font-size: 32px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    color: #F46;
+    line-height: 44px;
+  }
+
+  .textarea {
+    width: 100%;
+    padding: 34px 32px 34px 0;
+    background: #FFFFFF;
+    border-bottom: 1px solid #D8DDE6;
+
+    .label {
+      display: inline-block;
+      font-size: 32px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      color: #333;
+      line-height: 44px;
+      margin-bottom: 8px;
+    }
+
+    .value {
+      padding: 0 16px;
+    }
+  }
+
+  ::v-deep .default {
+    width: 160px !important;
+    height: 160px !important;
+  }
+
+  .area-icon {
+    vertical-align: super;
+    position: absolute;
+    top: 10px;
+    right: 0;
+  }
+
+  .footer {
+    width: 100%;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+  }
+
+  .btn {
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    background: #1365DD;
+    font-size: 32px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #FFF;
+  }
+
+  .line-bg {
+    width: 100%;
+    height: 16px;
+    background: #F5F5F5;
+  }
+
+  .pad-l32 {
+    padding-left: 32px;
+    background-color: #fff;
+  }
+}
+</style>
diff --git a/src/project/grid/AppSpecialPeople/img/del-icon.png b/src/project/grid/AppSpecialPeople/img/del-icon.png
new file mode 100644
index 00000000..0f536bfb
Binary files /dev/null and b/src/project/grid/AppSpecialPeople/img/del-icon.png differ
diff --git a/src/project/grid/AppSpecialPeople/img/down-icon.png b/src/project/grid/AppSpecialPeople/img/down-icon.png
new file mode 100644
index 00000000..b0db859f
Binary files /dev/null and b/src/project/grid/AppSpecialPeople/img/down-icon.png differ
diff --git a/src/project/grid/AppSpecialPeople/img/edit-icon.png b/src/project/grid/AppSpecialPeople/img/edit-icon.png
new file mode 100644
index 00000000..3b6bb392
Binary files /dev/null and b/src/project/grid/AppSpecialPeople/img/edit-icon.png differ
diff --git a/src/project/grid/AppSpecialPeople/img/local-icon.png b/src/project/grid/AppSpecialPeople/img/local-icon.png
new file mode 100644
index 00000000..3e23aff6
Binary files /dev/null and b/src/project/grid/AppSpecialPeople/img/local-icon.png differ
diff --git a/src/project/grid/AppSpecialPeople/img/search-icon.png b/src/project/grid/AppSpecialPeople/img/search-icon.png
new file mode 100644
index 00000000..e3cb75af
Binary files /dev/null and b/src/project/grid/AppSpecialPeople/img/search-icon.png differ
diff --git a/src/project/grid/AppSpecialPeople/img/user-img.png b/src/project/grid/AppSpecialPeople/img/user-img.png
new file mode 100644
index 00000000..ae49d85f
Binary files /dev/null and b/src/project/grid/AppSpecialPeople/img/user-img.png differ