罗广辉
2026-04-24 648904d076ae6e17892b40675598b1c8dc474277
src/pages/inspectionTask/index.vue
@@ -1,63 +1,99 @@
<!-- 巡检任务 -->
<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>
  <view>
    <WebViewPlus :src="`${viewUrl}`" @webMessage="onPostMessage" />
  </view>
</template>
<script setup>
const pagingRef = ref(null);
import { getWebViewUrl } from "@/utils/index.js";
import WebViewPlus from "@/components/WebViewPlus.vue";
import { onHide, onShow } from "@dcloudio/uni-app";
import { useAppStore } from "@/store/index.js";
const dataList = ref([]);
const appStore = useAppStore();
const urls = [
  "https://picsum.photos/100/100?random=1",
  "https://picsum.photos/100/100?random=2",
  "https://picsum.photos/100/100?random=3",
  "https://picsum.photos/100/100?random=4",
  "https://picsum.photos/100/100?random=5",
  "https://picsum.photos/100/100?random=6",
  "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",
];
// const viewUrl = getWebViewUrl('/inspectionTask')
function queryList(pageNo, pageSize) {
  console.log("[ pageNo ] >", pageNo);
  console.log("[ pageSize ] >", pageSize);
  // 这里的pageNo和pageSize会自动计算好,直接传给服务器即可
  // 这里的请求只是演示,请替换成自己的项目的网络请求,并在网络请求回调中通过pagingRef.value.complete(请求回来的数组)将请求结果传给z-paging
  setTimeout(() => {
    // 1秒之后停止刷新动画
    const list = [];
    for (let i = 0; i < 30; i++)
      list.push(urls[uni.$u.random(0, urls.length - 1)]);
const updateKey = ref(0);
const sxListKey = ref(0);
const viewUrl = computed(() => {
  // #ifdef MP-WEIXIN
  return getWebViewUrl("/inspectionTask", {
    updateKey: updateKey.value,
    sxListKey: sxListKey.value,
    showAddBtn: 1,
  });
  // #endif
    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);
  //   });
  // #ifndef MP-WEIXIN
  return getWebViewUrl("/inspectionTask", {
    updateKey: updateKey.value,
    sxListKey: sxListKey.value,
    showAddBtn: 0,
  });
  // #endif
});
watch(
  () => [appStore.jobUpdateKey, appStore.deviceUpdateKey],
  () => {
    sxListKey.value = sxListKey.value + 1;
  }
);
function onPostMessage(data) {
  if (data.type === "taskDetails") {
    // #ifdef MP-WEIXIN
    // #endif
    // #ifndef MP-WEIXIN
    if ([1, 2].includes(data.rowItem.status)) {
      uni.navigateTo({
        url: `/subPackages/taskDetail/inProgress/index?wayLineJobInfoId=${data.rowItem.id}&batchNo=${data.rowItem.batch_no}`,
      });
    } else {
      uni.navigateTo({
        url: `/subPackages/taskDetail/execution/index?wayLineJobInfoId=${data.rowItem.id}&waylineJobId=${data.rowItem.wayline_job_id}&batch_no=${data.rowItem.batch_no}`,
      });
    }
    // #endif
  }
  if (data.type === "addTask") {
    // #ifdef MP-WEIXIN
    // #endif
  }
}
onShow(() => {
  const joinParams = uni.getStorageSync("joinParams");
  if (joinParams) {
    // 使用后清除
    console.log("是否打印", updateKey.value);
    updateKey.value = updateKey.value + 1;
    uni.removeStorageSync("joinParams");
  }
  // isApp.value = true
  // 清除数据
  const encodedData = encodeURIComponent(JSON.stringify({ device_sn: "" }));
  uni.setStorageSync("webview_params", encodedData);
  // #ifndef MP-WEIXIN
  uni.setTabBarItem({
    index: 2, // Tab 的索引(从0开始)
    visible: true,
    pagePath: "subPackages/taskDetail/addTask/index",
  });
  uni.setTabBarItem({
    index: 3, // Tab
    visible: false,
  });
  // #endif
});
onHide(() => {
  // isApp.value = false
});
</script>
<style scoped lang="scss"></style>