改名

src/project/pingchang/AppGetewayRegister/AppGetewayRegister.vue

@@ -0,0 +1,196 @@
+<template>
+  <div class="AppGetewayRegister">
+    <div class="title">
+      <h2>全部记录</h2>
+      <div class="right">
+        <span>共</span>
+        <i>{{ total }}</i>
+        <span>条</span>
+      </div>
+    </div>
+    <div class="home-list">
+      <div class="item" hover-class="bg-hover" @click="$linkTo(`./DetailGetway?id=${item.id}`)"
+           v-for="(item, index) in list" :key="index">
+        <div class="item-top">
+          <h2>{{ item.name }}</h2>
+          <span>{{ item.phone }}</span>
+        </div>
+        <p>{{ item.idNumber.replace(/^(\d{6})\d{8}(.{4}$)/g, `$1${Array(9).join('*')}$2`) }}</p>
+        <div class="item-info">
+          <div class="item-info__item">
+            <image src="/static/img/from-icon.png"/>
+            <span>{{ item.startAreaName }}</span>
+          </div>
+          <div class="item-info__item">
+            <image src="/static/img/to-icon.png"/>
+            <span>{{ item.arriveAreaName }}</span>
+          </div>
+          <div class="item-info__item">
+            <image src="/static/img/to-date.png"/>
+            <span>{{ item.arriveTime && item.arriveTime.substr(0, item.arriveTime.length - 3) }} 到达</span>
+          </div>
+          <div class="item-info__item">
+            <image src="/static/img/kakou.png"/>
+            <span>{{ item.gatewayName }}</span>
+          </div>
+        </div>
+      </div>
+      <AiEmpty v-if="list.length==0"/>
+    </div>
+    <div class="btn-wrapper">
+      <div class="btn" @click="toReport" hover-class="text-hover">添加卡口登记</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {mapState} from 'vuex'
+export default {
+  name: "AppGetewayRegister",
+  appName: "卡口登记",
+  data() {
+    return {
+      list: [],
+      current: 1,
+      total: 0
+    }
+  },
+
+  computed: {
+    ...mapState(['user'])
+  },
+
+  onLoad() {
+    this.$loading()
+    this.getList()
+    this.$dict.load('villageActivityStatus')
+    uni.$on('update', () => {
+      this.current = 1
+      this.$nextTick(() => {
+        this.getList()
+      })
+    })
+  },
+
+  methods: {
+    toReport() {
+      this.$linkTo('./AddGetway')
+    },
+    getList() {
+      this.$instance.post(`/app/appepidemicpreventionregisterinfo/list`, null, {
+        params: {
+          createUserId: this.user.id,
+          current: this.current,
+          size: 10,
+        }
+      }).then(res => {
+        uni.hideLoading()
+        if (res?.data) {
+          this.total = res.data.total
+          this.list = this.current == 1? res.data.records:[...this.list, ...res.data.records]
+        }
+      }).catch(() => {
+        uni.hideLoading()
+      })
+    }
+  },
+
+  onReachBottom() {
+    this.current++
+    this.getList()
+  }
+}
+</script>
+
+<style lang="scss" socped>
+.AppGetewayRegister {
+  padding: 0 0 150px 0;
+
+  .title {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 32px;
+    padding: 48px 32px 0 32px;
+
+    & > h2 {
+      font-size: 38px;
+      color: #333;
+      font-weight: 600;
+    }
+
+    .right {
+      display: flex;
+      align-items: center;
+
+      span {
+        color: #666666;
+        font-size: 28px;
+      }
+
+      i {
+        color: #4181FF;
+        font-style: normal;
+        font-size: 28px;
+      }
+    }
+  }
+
+  .item {
+    margin: 0 32px 24px;
+    padding: 32px;
+    border-radius: 16px;
+    background: #fff;
+
+    .item-info {
+      .item-info__item {
+        display: flex;
+        margin-bottom: 8px;
+        line-height: 1.3;
+
+        &:last-child {
+          margin-bottom: 0;
+        }
+
+        image {
+          position: relative;
+          top: 2px;
+          width: 32px;
+          height: 32px;
+          margin-right: 16px;
+        }
+
+        span {
+          flex: 1;
+          color: #333;
+          font-size: 28px;
+        }
+      }
+    }
+
+    .item-top {
+      display: flex;
+      align-items: center;
+      height: 50px;
+
+      h2 {
+        color: #333333;
+        font-size: 36px;
+        font-weight: 600;
+      }
+
+      span {
+        font-size: 28px;
+        color: #999999;
+        margin-left: 16px;
+      }
+    }
+
+    p {
+      margin: 14px 0 20px;
+      color: #999999;
+      font-size: 28px;
+    }
+  }
+}
+</style>