巡检记录接口对接

wuye-manager-uniapp/pageSubPack/inspection/inspection_record.vue

@@ -3,43 +3,53 @@
   <view class="page_padding">
     <view class="inspection_record_box flex-1 flex flex-col">
       <navBar @clickLeft="navBack" title="巡检记录"></navBar>
-
       <TabsComponents :tabslist="tabslist" @update="handleChangeTabs"></TabsComponents>
+      <view class="timebox">
+        <view class="daybox flex items-center">
+          <uni-datetime-picker
+            type="date"
+            :clear-icon="false"
+            @change="handleChangeTime"
+            v-model="queryParmas.date"
+          >
+            <view class="day">{{ showDate }}</view>
+          </uni-datetime-picker>
+          <view class="searchiconbox flex items-center">
+            <view class="arrow"> </view>
+            <view class="arrow1"> </view>
+          </view>
+        </view>
+      </view>
       <scroll-view
         class="record_body record-list"
         scroll-y
-        lower-threshold="60"
+        lower-threshold="160"
         @scrolltolower="scrolltolower"
       >
-        <!-- v-for -->
-        <view class="record_item" v-for="(item, index) in list" :key="index">
-          <view class="time">
-            <view>{{ item.day }}</view>
+        <view
+          class="record_list_item"
+          v-for="(ite, index) in list"
+          :key="index"
+          @tap="handleTap(ite)"
+        >
+          <view class="title flex items-center">
+            <view class="title_name"> {{ ite.taskName }} </view>
+            <view class="title_status" v-if="isComputed(ite.taskStatus)"> 已巡检 </view>
+            <view class="title_status noinspection" v-else> 未巡检 </view>
           </view>
-          <view class="record_list_box">
-            <!-- v-for -->
-            <view class="record_list_item" v-for="(ite, ind) in item.list" :key="ind">
-              <view class="title flex items-center">
-                <view class="title_name"> {{ ite.title }} </view>
-                <view class="title_status" v-if="ite.status === 0"> 已巡检 </view>
-                <view class="title_status noinspection" v-else> 未巡检 </view>
-              </view>
-              <view class="items">
-                <!-- v-for -->
-                <view class="item" v-for="(it, inde) in ite.items" :key="inde">
-                  <text>{{ it }}</text>
-                </view>
-              </view>
-              <view class="time">
-                <text>巡检时间：</text>
-                <text>{{ ite.time }}</text>
-              </view>
-              <view class="time user">
-                <text>巡检人：</text>
-                <text>{{ ite.user }}</text>
-              </view>
+          <view class="items" v-if="ite.points">
+            <view class="item" v-for="(itemname, itemindex) in ite.itemslist" :key="itemindex">
+              <text>{{ itemname }}</text>
             </view>
           </view>
+          <view class="time">
+            <text>巡检时间：</text>
+            <text>{{ ite.taskTime }}</text>
+          </view>
+          <view class="time user">
+            <text>巡检人：</text>
+            <text>{{ ite.inspectorName }}</text>
+          </view>
         </view>
       </scroll-view>
     </view>
@@ -49,62 +59,48 @@
 <script setup lang="ts">
 import TabsComponents from '@/components/tabs/tabs.vue'
 import navBar from '@/components/navbar/navbar.vue'
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
+import { getInspectionList } from '@/api/insepction.js'
+import { parseTime } from '@/utils/time.js'
+import { onShow } from '@dcloudio/uni-app'
+
+const isComputed = (status: string) => {
+  const awaitlist = ['未完成', '待执行', '执行中']
+  return !awaitlist.includes(status)
+}
+
 const tabslist = [
   {
     name: '全部',
-    value: 0
+    value: 2
   },
   {
     name: '未巡检',
-    value: 1
+    value: 0
   },
   {
     name: ' 已巡检',
-    value: 2
+    value: 1
   }
 ]
-function handleChangeTabs(val: number) {}
+
 // ---------------------------------------------------------------------
 
 // ---------------------------------------------------------------------
-const list = ref([
-  {
-    day: '10月11日',
-    list: [
-      {
-        title: '标题1',
-        status: 0,
-        items: ['设备巡检'],
-        time: '07:00:00-09:00:00',
-        user: '李兴'
-      },
-      {
-        title: '标题3',
-        status: 0,
-        items: ['设备巡检'],
-        time: '07:00:00-09:00:00',
-        user: '湖色'
-      }
-    ]
-  }
-])
-
+const list = ref([])
 const queryParmas = ref({
+  date: '',
+  status: 2,
   pageNum: 1,
-  pageSize: 5
+  pageSize: 10
+})
+const showDate = computed(() => {
+  return parseTime(queryParmas.value.date, '{m}月{d}日')
 })
 const isLoading = ref(false) // 加载锁
 const hasMore = ref(true) // 是否还有更多数据
-const total = ref(21)
-function scrolltolower() {
-  // 必须加这两个判断！
-  if (isLoading.value || !hasMore.value) {
-    return
-  }
-  queryParmas.value.pageNum += 1
-  getlist()
-}
+const total = ref(0)
+
 function getlist() {
   // 1. 如果正在加载或没有更多数据，直接返回
   if (isLoading.value || !hasMore.value) return
@@ -114,51 +110,76 @@ function getlist() {
     title: '加载中',
     mask: true
   })
-  const { pageNum, pageSize } = queryParmas.value
-
-  const startId = (pageNum - 1) * pageSize + 1
-  const arr = Array.from({ length: pageSize }).map((_, index) => {
-    const realId = startId + index // ✅ 修复 ID 错误
-
-    // ✅ 随机生成 0、1、2
-    const randomStatus = Math.floor(Math.random() * 2)
-    return {
-      day: '10月' + realId + '日',
-      list: [
-        {
-          title: '标题1',
-          status: randomStatus,
-          items: ['设备巡检'],
-          time: '07:00:00-09:00:00',
-          user: '李兴'
-        },
-        {
-          title: '标题3',
-          status: randomStatus,
-          items: ['设备巡检'],
-          time: '07:00:00-09:00:00',
-          user: '湖色'
-        }
-      ]
-    }
+  const { pageNum, pageSize, date } = queryParmas.value
+  getInspectionList({
+    pageSize,
+    pageNum,
+    date
   })
-
-  // 追加数据（正确方式）
-  list.value = [...list.value, ...arr]
-  // 判断是否还有更多
-  hasMore.value = list.value.length < total.value
-  isLoading.value = false
-  uni.hideLoading()
+    .then(res => {
+      list.value = res.rows
+      let items: Set<string> = new Set()
+      res.rows.forEach(item => {
+        if (!item.points || item.points.length <= 0) return
+        item.points.forEach(ite => {
+          ite.itemNames.forEach(it => items.add(it))
+        })
+        item.itemslist = Array.from(items)
+        console.log(item.itemslist)
+      })
+      hasMore.value = list.value.length < res.total
+      total.value = res.total
+    })
+    .finally(() => {
+      isLoading.value = false
+      uni.hideLoading()
+    })
 }
-getlist()
-function resetList() {
-  list.value = []
-  queryParmas.value.pageNum = 1
+
+function handleChangeTime(event: string) {
   hasMore.value = true
+  queryParmas.value.date = event
+  getlist()
+}
+
+function handleTap(ite) {
+  if (isComputed(ite.taskStatus)) {
+    uni.navigateTo({
+      url: '/pageSubPack/inspection/inspection_main?id=' + ite.id
+    })
+  } else {
+    uni.navigateTo({
+      url: '/pageSubPack/inspection/inspection_upload?id=' + ite.id
+    })
+  }
+}
+
+function scrolltolower() {
+  if (isLoading.value || !hasMore.value) {
+    return
+  }
+  queryParmas.value.pageNum += 1
+  getlist()
+}
+
+function handleChangeTabs(val: number) {
+  queryParmas.value.status = val
+  queryParmas.value.pageNum = 1
+  queryParmas.value.pageSize = 10
   getlist()
 }
 // ---------------------------------------------------------------------
 
+function init() {
+  queryParmas.value.date = parseTime(new Date(), '{y}-{m}-{d}')
+  getlist()
+}
+
+onShow(() => {
+  hasMore.value = true
+  console.log('show')
+  init()
+})
 // 返回上一页
 const navBack = () => {
   uni.navigateBack()
@@ -174,91 +195,121 @@ const navBack = () => {
   height: 100vh;
   overflow: hidden;
   box-sizing: border-box;
-  .record_body {
+  .timebox {
+    width: 178rpx;
+    height: 48rpx;
+    background: #ffffff;
+    border-radius: 24rpx;
+    text-align: center;
+    line-height: 48rpx;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #666666;
+    margin-bottom: 20rpx;
     margin-top: 20rpx;
+    .daybox {
+      height: 100%;
+      box-sizing: border-box;
+      position: relative;
+      .day {
+        flex: 1;
+        font-size: 28rpx;
+        text-align: left;
+        padding-left: 15rpx;
+      }
+      .searchiconbox {
+        width: 38rpx;
+        height: 48rpx;
+        padding-right: 10rpx;
+        flex-direction: column;
+        justify-content: center;
+        .arrow,
+        .arrow1 {
+          border: 1rpx solid #ccc;
+          width: 8rpx;
+          height: 8rpx;
+        }
+        .arrow {
+          border-right-color: transparent;
+          border-top-color: transparent;
+          transform: rotateZ(135deg);
+        }
+        .arrow1 {
+          border-left-color: transparent;
+          border-bottom-color: transparent;
+          transform: rotateZ(135deg);
+        }
+      }
+    }
+  }
+
+  .record_body {
     flex: 1;
     overflow: hidden;
     overflow-y: auto;
     box-sizing: border-box;
-    .record_item {
-      & > .time {
-        width: 168rpx;
-        height: 48rpx;
-        background: #ffffff;
-        border-radius: 24rpx;
-        text-align: center;
-        line-height: 48rpx;
+
+    .record_list_item {
+      margin-bottom: 20rpx;
+      background: #ffffff;
+      border-radius: 16rpx;
+      box-sizing: border-box;
+      padding: 32rpx;
+      // 巡检标题
+      .title {
         font-weight: 400;
-        font-size: 28rpx;
-        color: #666666;
+        font-size: 32rpx;
+        color: #222222;
+        line-height: 40rpx;
+        height: 40rpx;
+        margin-bottom: 25rpx;
 
-        margin-bottom: 20rpx;
-      }
-      .record_list_box {
-        margin-bottom: 20rpx;
-        .record_list_item {
-          margin-bottom: 20rpx;
-          background: #ffffff;
-          border-radius: 16rpx;
-          box-sizing: border-box;
-          padding: 32rpx;
-          // 巡检标题
-          .title {
-            font-weight: 400;
-            font-size: 32rpx;
-            color: #222222;
-            line-height: 40rpx;
-            height: 40rpx;
-            margin-bottom: 25rpx;
+        .title_status {
+          width: 86rpx;
+          height: 30rpx;
+          background: #4d5dfa;
+          border-radius: 198rpx 198rpx 198rpx 198rpx;
+          text-align: center;
+          font-weight: 400;
+          font-size: 20rpx;
+          color: #ffffff;
+          line-height: 30rpx;
+          margin-left: 5rpx;
 
-            .title_status {
-              width: 86rpx;
-              height: 30rpx;
-              background: #4d5dfa;
-              border-radius: 198rpx 198rpx 198rpx 198rpx;
-              text-align: center;
-              font-weight: 400;
-              font-size: 20rpx;
-              color: #ffffff;
-              line-height: 30rpx;
-              margin-left: 5rpx;
-
-              &.noinspection {
-                background-color: #ccc;
-              }
-            }
-          }
-
-          // 巡检项目
-          .items {
-            margin-bottom: 20rpx;
-            display: flex;
-            align-items: center;
-            flex-wrap: wrap;
-            .item {
-              padding: 0 10rpx;
-              height: 42rpx;
-              border-radius: 8rpx 8rpx 8rpx 8rpx;
-              border: 1rpx solid #4d5dfa;
-
-              font-weight: 400;
-              font-size: 24rpx;
-              color: #4d5dfa;
-              text-align: center;
-              line-height: 42rpx;
-              margin-right: 20rpx;
-              margin-bottom: 10rpx;
-            }
-          }
-
-          // 巡检人 巡检时间
-          & > .time {
-            font-weight: 400;
-            font-size: 28rpx;
-            color: #999999;
+          &.noinspection {
+            background-color: #ccc;
           }
         }
       }
+
+      // 巡检项目
+      .items {
+        margin-bottom: 20rpx;
+        display: flex;
+        align-items: center;
+        flex-wrap: wrap;
+        .item {
+          padding: 0 10rpx;
+          height: 42rpx;
+          border-radius: 8rpx 8rpx 8rpx 8rpx;
+          border: 1rpx solid #4d5dfa;
+
+          font-weight: 400;
+          font-size: 24rpx;
+          color: #4d5dfa;
+          text-align: center;
+          line-height: 42rpx;
+          margin-right: 20rpx;
+          margin-bottom: 10rpx;
+        }
+      }
+
+      // 巡检人 巡检时间
+      & > .time {
+        font-weight: 400;
+        font-size: 28rpx;
+        color: #999999;
+      }
     }
   }
 }