卡口登记 删除

src/project/pingchang/AppCheckpointRegistration/AppCheckpointRegistration.vue

@@ -40,19 +40,29 @@
       </div>
     </AiTopFixed>
     <div class="user-list">
-      <div class="item" @click="toUser(item)" v-for="(item,index) in list" :key="index">
-        <div class="top">
-          <h2 class="name">{{item.name}}<span class="status" :class="'status'+item.riskLevel">{{ $dict.getLabel('EP_riskLevel', item.riskLevel) }}</span></h2>
-          <p class="color-999">{{item.idNumber}}</p>
-          <p><img src="./components/img/org-icon.png" alt=""><span class="start-name">{{item.startAreaName}}</span></p>
-          <p><img src="./components/img/blue-icon.png" alt=""><span class="start-name">{{item.arriveAreaName}}</span></p>
-          <p><img src="./components/img/time-icon.png" alt="">{{item.arriveTime}}</p>
-          <img :src="statusImgList[item.handleType]" alt="" class="status-img">
+      <u-swipe-action style="margin-bottom: 16px;"
+        :show="item.show"
+        :index="index"
+        v-for="(item,index) in list"
+        :key="item.id"
+        @click="onClick"
+        @open="onOpen"
+        @content-click="toUser(item)"
+        :options="options">
+        <div class="item">
+          <div class="top">
+            <h2 class="name">{{item.name}}<span class="status" :class="'status'+item.riskLevel">{{ $dict.getLabel('EP_riskLevel', item.riskLevel) }}</span></h2>
+            <p class="color-999">{{item.idNumber}}</p>
+            <p><img src="./components/img/org-icon.png" alt=""><span class="start-name">{{item.startAreaName}}</span></p>
+            <p><img src="./components/img/blue-icon.png" alt=""><span class="start-name">{{item.arriveAreaName}}</span></p>
+            <p><img src="./components/img/time-icon.png" alt="">{{item.arriveTime}}</p>
+            <img :src="statusImgList[item.handleType]" alt="" class="status-img">
+          </div>
+          <div class="bottom" v-if="item.handleType>0">
+            <div class="text">处置人：<span>{{item.handleUserName}}</span></div>
+          </div>
         </div>
-        <div class="bottom" v-if="item.handleType>0">
-          <div class="text">处置人：<span>{{item.handleUserName}}</span></div>
-        </div>
-      </div>
+      </u-swipe-action>
     </div>
     <AiEmpty v-if="!list.length"></AiEmpty>
     <u-select v-model="showGateSelect" :list="gateList" label-name="name" value-name="id" @confirm="gatewayconfirm"></u-select>
@@ -86,6 +96,14 @@ export default {
         require('./components/img/status4.png'), 
         require('./components/img/status5.png'), 
         require('./components/img/status6.png'), 
+      ],
+      options: [
+        {
+          text: '删除',
+          style: {
+            backgroundColor: '#dd524d'
+          }
+        }
       ]
     }
   },
@@ -122,6 +140,16 @@ export default {
         }
       })
     },
+    del(id) {
+      this.$confirm(`确认删除该数据`).then(() => {
+        this.$http.post(`/app/appepidemicpreventionregisterinfo/delete?id=${id}`).then((res) => {
+          if (res.code == 0) {
+            this.$u.toast('删除成功')
+            this.getListInit()
+          }
+        })
+      })
+    },
     getTotal() {
       this.$http.post(`/app/appepidemicpreventionregisterinfo/listStatistics?areaId=${this.areaId}`).then((res) => {
         if (res.code == 0) {
@@ -160,7 +188,18 @@ export default {
       this.gatewayName = ''
       this.gatewayId = ''
       this.getListInit()
-    }
+    },
+    onClick(index) {
+      this.del(this.list[index].id)
+    },
+    onOpen(index) {
+      this.list[index].show = true
+      this.list.map((val, i) => {
+        if(index != i) {
+          this.list[i].show = false
+        }
+      })
+    },
   },
   onReachBottom() {
     this.current ++
@@ -268,7 +307,6 @@ export default {
     padding: 32px 32px 0;
     .item{
       background-color: #fff;
-      margin-bottom: 24px;
       border-radius: 16px;
       .top {
         padding: 32px 32px 24px;