shuishen
2025-10-11 3fc27febccd04e2fcffbd2cdd16d2daafd0b3ca3
src/pages/inspectionTask/index.vue
@@ -1,25 +1,19 @@
 <!-- 巡检任务 -->
<!-- 巡检任务 -->
<template>
  <z-paging ref="pagingRef" v-model="dataList" @query="queryList">
    <view v-for="(item, index) in dataList" :key="index">
      <u-cell :title="`列表长度-${index + 1}`">
        <template #icon>
          <u-avatar
            shape="square"
            size="35"
            :src="item"
            custom-style="margin: -3px 5px -3px 0"
          />
        </template>
      </u-cell>
    </view>
  </z-paging>
  <TaskDetails v-model:active="active" v-if="active"/>
  <view v-else v-for="(item, index) in list" :key="index">
    <view @click="taskClick(item)">{{item.name}} - {{item.status}}</view>
  </view>
</template>
<script setup>
const pagingRef = ref(null)
import {onShow} from "@dcloudio/uni-app";
import {getJobListApi} from "@/api/inspectionTask.js";
import TaskDetails from "@/pages/inspectionTask/TaskDetails/TaskDetails.vue";
const dataList = ref([])
const pagingRef = ref(null);
const dataList = ref([]);
const urls = [
  "https://picsum.photos/100/100?random=1",
@@ -31,34 +25,48 @@
  "https://picsum.photos/100/100?random=7",
  "https://picsum.photos/100/100?random=8",
  "https://picsum.photos/100/100?random=9",
  "https://picsum.photos/100/100?random=10"
]
  "https://picsum.photos/100/100?random=10",
];
function queryList(pageNo, pageSize) {
  console.log("[ pageNo ] >", pageNo)
  console.log("[ pageSize ] >", pageSize)
  console.log("[ pageNo ] >", pageNo);
  console.log("[ pageSize ] >", pageSize);
  // 这里的pageNo和pageSize会自动计算好,直接传给服务器即可
  // 这里的请求只是演示,请替换成自己的项目的网络请求,并在网络请求回调中通过pagingRef.value.complete(请求回来的数组)将请求结果传给z-paging
  setTimeout(() => {
    // 1秒之后停止刷新动画
    const list = []
    const list = [];
    for (let i = 0; i < 30; i++)
      list.push(urls[uni.$u.random(0, urls.length - 1)])
      list.push(urls[uni.$u.random(0, urls.length - 1)]);
    pagingRef.value?.complete(list)
  }, 1000)
  // this.$request
  //   .queryList({ pageNo, pageSize })
  //   .then(res => {
  //     // 请勿在网络请求回调中给dataList赋值!!只需要调用complete就可以了
  //     pagingRef.value.complete(res.data.list);
  //   })
  //   .catch(res => {
  //     // 如果请求失败写pagingRef.value.complete(false),会自动展示错误页面
  //     // 注意,每次都需要在catch中写这句话很麻烦,z-paging提供了方案可以全局统一处理
  //     // 在底层的网络请求抛出异常时,写uni.$emit('z-paging-error-emit');即可
  //     pagingRef.value.complete(false);
  //   });
    pagingRef.value?.complete(list);
  }, 1000);
}
const params = ref({
  device_sn: null,
  order_by_create_time: false,
})
const sizeParams = ref({
  current: 1,
  size: 100,
})
const list = ref([])
function getJobList() {
  getJobListApi(params.value,sizeParams.value).then(res =>{
    list.value = res.data.data.records
  })
}
const active  = ref(null)
function taskClick(row) {
  active.value = row
  // uni.redirectTo({
  //   url: '/pages/inspectionTask/taskDetails/index'
  // })
}
onShow(()=>{
  getJobList()
})
</script>