居民审核

src/apps/AppPeopleList.vue/ExamineList.vue

@@ -14,8 +14,8 @@
         <u-search v-model="keyword" :clearabled="true" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="handerSearch" @clear="handerClear"></u-search>
       </div>
     </AiTopFixed>
-    <div v-if="data.family && data.family.length > 0">
-      <div class="card" v-for="(item, i) in data.family" :key="i" @click="toDetailPeople(item)">
+    <div v-if="datas && datas.length > 0" class="list-content">
+      <div class="card" v-for="(item, i) in datas" :key="i" @click="toDetailPeople(item)">
         <div class="photos">
           <img :src="item.photo" alt="" v-if="item.photo" />
           <img src="./components/img/44.png" alt="" v-else />
@@ -29,6 +29,7 @@
               <span class="householdNames" v-else>
                 {{ $dict.getLabel('householdRelation', item.householdRelation) }}
               </span>
+              <span class="audit-status" :class="'status'+item.auditStatus">{{ $dict.getLabel('auditStatus', item.auditStatus) }}</span>
             </div>
 
             <div class="rightTop-rights">
@@ -57,7 +58,7 @@ export default {
   data() {
     return {
       id: '',
-      data: [],
+      datas: [],
       resident: {},
       areaId: '',
       areaName: '',
@@ -70,38 +71,76 @@ export default {
         },
       ],
       currentTabs: 0,
+      keyword: ''
     }
   },
   computed: {
     ...mapState(['user']),
   },
+  onLoad() {
+    this.$dict.load('householdRelation', 'auditStatus').then(() => {
+      this.getList()
+    })
+  },
   onShow() {
     document.title = '居民档案审核'
   },
   methods: {
-    change(index) {
-      this.data = []
-      // this.keyword = ''
-      this.currentTabs = index
-      // this.current = 1
-      // this.getList()
+    getListInit() {
+      this.current = 1
+      this.datas = []
+      this.getList()
     },
-    getDetail() {
-      this.$http.post(`/app/appresident/detail?id=${this.id}`).then((res) => {
+    getList() {
+      var auditType = 0 // 0待处理; 2已处理
+      if(this.currentTabs == 1) {
+        auditType = 2
+      }
+      this.$http.post('/app/appresident/list', null, {
+        params: {
+          size: 10,
+          current: this.current,
+          con: this.keyword,
+          areaId: this.areaId,
+          auditType
+        },
+      })
+      .then((res) => {
         if (res.code == 0) {
-          this.data = res.data
-          this.$forceUpdate()
-          this.$nextTick(() => {
-            this.resident = res.data.resident
-            this.$forceUpdate()
-          })
+          this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records
+
+          this.pages = res.data.pages
         }
       })
     },
 
+    change(index) {
+      this.currentTabs = index
+      this.getListInit()
+    },
+
     toDetailPeople(item) {
       uni.navigateTo({ url: `./DetailPeople?id=${item.id}` })
     },
+
+    seachObj(e) {
+      this.areaId = e
+      this.getListInit()
+    },
+
+    handerSearch(e) {
+      this.keyword = e
+      this.getListInit()
+    },
+
+    handerClear() {
+      this.keyword = ''
+      this.getListInit()
+    },
+  },
+  onReachBottom() {
+    this.current = this.current + 1
+    this.getList()
   },
 }
 </script>
@@ -109,12 +148,18 @@ export default {
 <style scoped lang="scss">
 .ExamineList {
   height: 100%;
+  .list-content{
+    padding: 0 60px;
+    background-color: #fff;
+  }
   .card {
     display: flex;
     box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.08);
     border-radius: 16px;
     padding: 48px 32px;
     margin-bottom: 32px;
+    background: url(http://respub.sinoecare.net/20211222/装饰2-20211222162934.png) no-repeat;
+    background-size: 100% 100%;
     .photos {
       img {
         width: 96px;
@@ -141,6 +186,8 @@ export default {
             font-size: 26px;
             font-weight: 500;
             color: #5aad6a;
+            display: inline-block;
+            width: 100px;
           }
           .fileStatuss {
             display: inline-block;
@@ -174,16 +221,6 @@ export default {
       }
     }
   }
-  .card:nth-child(2n-1) {
-    // background: royalblue;
-    background: url(http://respub.sinoecare.net/20211222/装饰-20211222162743.png) no-repeat;
-    background-size: 100% 100%;
-  }
-  .card:nth-child(2n) {
-    // background: pink;
-    background: url(http://respub.sinoecare.net/20211222/装饰2-20211222162934.png) no-repeat;
-    background-size: 100% 100%;
-  }
   .middle {
     display: flex;
     padding: 24px 32px;
@@ -205,6 +242,28 @@ export default {
   ::v-deep .content{
     padding: 0;
   }
+
+  .audit-status{
+    display: inline-block;
+    padding: 0 8px;
+    line-height: 40px;
+    background: #EAF0FE;
+    border-radius: 8px;
+    font-size: 24px;
+    font-family: PingFangSC-Regular, PingFang SC;
+  }
+  .status1{
+    color: #3E95FF;
+    background-color: #EAF0FE;
+  }
+  .status0{
+    color: #5AAD6A;
+    background-color: #E9FFED;
+  }
+  .status2{
+    color: #f46;
+    background-color: #FFECEF;
+  }
   
 }
 </style>