核酸采样，社区管理

src/project/pingchang/AppCommunityManagement/AppCommunityManagement.vue

@@ -5,7 +5,7 @@
         inactive-color="#A1C1E8" :bar-style="barStyle" :active-item-style="activeStyle" active-color="#ffffff " @change="change">
       </u-tabs>
       <div class="top-search">
-        <u-search v-model="keyword" :clearabled="true" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" 
+        <u-search v-model="keyword" :clearabled="true" placeholder="请输入姓名/手机号/身份证号" :show-action="false" bg-color="#F5F5F5" 
           search-icon-color="#999" color="#999" height="58" @search="getListInit" @clear="getListInit">
         </u-search>
       </div>
@@ -13,37 +13,43 @@
         <div class="item">
           <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect" :name.sync="areaName" style="color: #666" selectRoot>
             <span style="margin-left: 4px" v-if="areaName">{{ areaName }}</span>
-            <span v-else>地区选择</span>
+            <span v-else style="color:#999;">地区选择</span>
             <u-icon name="arrow-down" color="#666" size="28" style="margin-left: 4px" />
           </AiAreaPicker>
         </div>
-        <div class="item">
-          <span>数据类型</span>
+        <div class="item" @click="showTypeSelect=true">
+          <span v-if="infoType === ''" style="color:#999;">数据类型</span>
+          <span v-else>{{ $dict.getLabel('EP_registerInfoType', infoType) }}</span>
           <u-icon name="arrow-down" color="#666" size="28" style="margin-left: 4px" />
         </div>
       </div>
     </AiTopFixed>
-    <div class="data-list">
-      <div class="item">
+    <div class="data-list" v-if="list && list.length">
+      <div class="item" v-for="(item, index) in list" :key="index" @click="toDetail(item.id)">
         <div class="top">
           <div class="title">
             <div class="name">
-              李主任
-              <span class="type">返乡登记</span>
+              {{item.name}}
+              <span class="type">{{$dict.getLabel('EP_registerInfoType', item.infoType)}}</span>
+            </div>
+            <div class="status" :class="'status'+item.queryType">
+              <span class="cir"></span>
+              <span v-if="item.queryType == 1">核酸采样{{item.nucleicAcidSamplingCount}}次</span>
+              <span v-else>核酸未采样</span>
             </div>
-            <div class="status status0"><span></span>核酸待采样</div>
           </div>
-          <p>429012********2341</p>
-          <p>1834912340</p>
-          <div class="btn" @click="toAdd()">排查</div>
-          <!-- <img src="./components/img/status-img.png" alt="" class="status-img"> -->
+          <p> {{item.idNumberText}}</p>
+          <p> {{item.phone}}</p>
+          <div class="btn" v-if="item.status != 2" @click="toEdit(item.id)">排查</div>
+          <img src="./components/img/status-img.png" alt="" class="status-img" v-else>
         </div>
         <div class="bottom">
-          <div class="text">管控人：<span>李在</span>2023-05-04 09:23</div>
+          <div class="text">管控人：<span> {{item.controllerUserName}}</span> {{item.createTime}}</div>
         </div>
       </div>
     </div>
-    <!-- <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty> -->
+    <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
+    <u-select v-model="showTypeSelect" :list="$dict.getDict('EP_registerInfoType')" label-name="dictName" value-name="dictValue" @confirm="typeConfirm"></u-select>
   </div>
 </template>
 
@@ -54,9 +60,13 @@ export default {
  appName: '社区管理',
   data() {
     return {
+      areaId: '',
+      areaName: '',
       current: 1,
       keyword: '',
       currentTabs: 0,
+      infoType: '',
+      showTypeSelect: false,
       tabList: [
         {
           name: '待管理',
@@ -76,16 +86,22 @@ export default {
       },
       activeStyle: {
         'font-weight' : '400',
-      }
+      },
+      list: []
     }
   },
   computed: {
     ...mapState(['user']),
   },
-  watch: {},
   onLoad() {
     this.areaId = this.user.areaId
     this.areaName = this.user.areaName
+    this.$dict.load('EP_CM_status', 'EP_registerInfoType').then(() => {
+      this.getListInit()
+    })
+     uni.$on('updateList', () => {
+      this.getListInit()
+    })
   },
   onShow() {
     document.title = '社区管理'
@@ -93,29 +109,40 @@ export default {
   methods: {
     getListInit() {
       this.current = 1
-      this.data = []
+      this.list = []
       this.getList()
     },
     getList() {
       this.$http.post('/app/appepidemicpreventioncommunitymanagement/list', null, {
-        params: { size: 10, current: this.current, status: this.currentTabs, areaId: this.areaId, name: this.keyword },
+        params: { size: 10, current: this.current, status: this.currentTabs, areaId: this.areaId, name: this.keyword, infoType: this.infoType },
       }).then((res) => {
         if (res.code == 0) {
-          this.data = this.current > 1 ? [...this.data, ...res.data.records] : res.data.records
+          res.data.records.map((item) => {
+            item.idNumberText = item.idNumber.replace(/(.{6}).*(.{4})/,"$1********$2")
+          })
+          this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records
         }
       })
     },
-    toAdd() {
-      uni.navigateTo({url: './Add'})
+    toDetail(id) {
+      uni.navigateTo({url: `./Detail?id=${id}`})
+    },
+    toEdit(id) {
+      uni.navigateTo({url: `./Add?id=${id}`})
     },
     change(index) {
       this.keyword = ''
       this.currentTabs = index
+      this.getListInit()
     },
     areaSelect(e) {
       this.areaId = e
       this.getListInit()
     },
+    typeConfirm(e) {
+      this.infoType = e[0].value
+      this.getListInit()
+    }
   },
   onReachBottom() {
     this.current++
@@ -193,7 +220,7 @@ export default {
             line-height: 20px;
             font-family: PingFangSC-Regular;
             font-size: 28px;
-            span {
+            .cir {
               display: inline-block;
               width: 8px;
               height: 8px;
@@ -203,13 +230,13 @@ export default {
           }
           .status0 {
             color: #FFA938;
-            span {
+            .cir {
               background-color: #FFA938;
             }
           }
           .status0 {
             color: #1CCEB0;
-            span {
+            .cir {
               background-color: #1CCEB0;
             }
           }