src/views/worksheet/aside/Aside.vue

@@ -1,18 +1,16 @@
 <script lang="ts" setup>
-import { getAllfieldList, getfieldList } from "@/api/home/filter";
-import { useWindowSizeFn } from "@/hooks/event/useWindowSizeFn";
-import { useUser } from "@/store/modules/user";
-import { useWorkOrder } from "@/store/modules/workOrder";
-import { getViewportOffset } from "@/utils/domUtils";
-import { debounce } from 'lodash-es';
+import { debounce } from 'lodash-es'
 import {
-computed, defineEmits, defineOptions,
+computed,
+defineOptions,
 inject,
 nextTick,
 onMounted,
 ref,
 unref,
-watch
+toRaw,
+watch,
+defineEmits
 } from "vue";
 import CustomFieldModalVue from "../modal/CustomFieldModal.vue";
 import WorkSheetList from "./WorkSheetList.vue";

src/views/worksheet/components/PictureWall.vue

@@ -1,10 +1,3 @@
-<!-- 使用示例 -->
-<!-- 
-<n-spin :show="loading">
-  <div ref="el" class="scroll"></div>
-  <PictureWall :taskDetailInfo="taskDetailInfo" :loading="loading" :el="el" @toggle="toggleLoading"></PictureWall>
-</n-spin> 
--->
 <script lang="ts" setup>
 import { audit } from '@/api/task/task';
 import {
@@ -28,21 +21,8 @@ const props = defineProps({
     type: Object,
     default: () => ({}),
   },
-  el: {
-    type: Object as () => HTMLDivElement | null,
-    default: () => (null),
-  },
-  loading: {
-    type: Boolean,
-    default: () => (false),
-  },
 });
-
-const emit = defineEmits<{
-  (e: 'toggle', loading: boolean)
-}>()
-
-const { taskDetailInfo, el, loading } = toRefs(props)
+const { taskDetailInfo } = toRefs(props)
 
 const batch = ref(false); // 批量审批状态
 const selectItems = ref<any[]>([]);
@@ -85,9 +65,12 @@ const selectTask = ref<any>(null);
 const overTask = ref<any>(null);
 const confrimModalRef = ref(null);
 const listData = ref<any[]>([]);
+const loading = ref(false);
+const el = ref<HTMLDivElement | null>(null);
 const selectedSortName = ref('');
 const notPassModalRef = ref(null)
-const canLoadMore = ref(true);
+
+let canloadMore = true;
 
 let processItems: any[] = [];
 
@@ -101,44 +84,41 @@ function reset() {
   taskpagination.pageNo = 0;
   taskpagination.pageSize = 20;
   listData.value.length = 0;
-  emit('toggle', false)
-  canLoadMore.value = true;
+  loading.value = false;
+  canloadMore = true;
 }
 
 async function refreshHandler() {
   reset();
-  console.log('refreshHandler')
   useInfiniteScroll(
     el as any,
     () => {
-      console.log(el)
-      console.log(11111111)
+
       loadMore();
     },
-    { distance: 10, interval: 1500, canLoadMore: () => canLoadMore.value }
+    { distance: 10, canLoadMore: () => canloadMore }
   );
 }
 
 async function loadMore() {
   if (loading.value || el.value == null) return;
-    const more = await fetchList();
+  const more = await featchList();
   listData.value.push(...more);
 }
 
-async function fetchList() {
-  console.log(3333)
-  emit('toggle', true)
+async function featchList() {
+  loading.value = true;
   try {
     taskpagination.pageNo += 1;
     const { data, total, pageCount } = await getPictureSimilarityList(
       { ...taskpagination, ...sortBy, checkDuplicateId: workStore.activeId, pictureId: taskDetailInfo.value.id }
     );
     totalCount.value = total;
-    canLoadMore.value = pageCount >= taskpagination.pageNo && pageCount > 0;
+    canloadMore = pageCount >= taskpagination.pageNo && pageCount > 0;
 
     return data;
   } catch (error) {
-    canLoadMore.value = false;
+    canloadMore = false;
     return [];
   }
 }
@@ -150,12 +130,12 @@ const layout = debounce(() => {
 
   _imagesload.on("done", (instance) => {
     if (!el.value) return;
-    emit('toggle', false)
+    loading.value = false;
   });
 
   _imagesload.on("fail", (instance) => {
     message.error("图片错误");
-    emit('toggle', false)
+    loading.value = false;
   });
 }, 300);
 
@@ -169,7 +149,9 @@ watch(
         totalCount.value = 0;
         return;
       }
-      refreshHandler()
+      reset();
+      const more = await featchList();
+      listData.value.push(...more);
     }
   }, { deep: true, immediate: true }
 );