From 8261814811c45e583bf421ba57725e691bbebeb9 Mon Sep 17 00:00:00 2001
From: raoyongjun <2641346316@qq.com>
Date: Thu, 2 May 2024 18:59:26 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E6=94=B9=E6=A1=86=E9=80=89?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/Header/RecycleModal.vue | 29 ++++++++++++++-----
 1 file changed, 22 insertions(+), 7 deletions(-)

diff --git a/src/layout/components/Header/RecycleModal.vue b/src/layout/components/Header/RecycleModal.vue
index 5dc2c95..6e593fb 100644
--- a/src/layout/components/Header/RecycleModal.vue
+++ b/src/layout/components/Header/RecycleModal.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type Masonry from 'masonry-layout'
 import { useDialog, useMessage } from 'naive-ui'
-import { computed, nextTick, onBeforeMount, onMounted, onUpdated, reactive, ref, unref, watch } from 'vue'
+import { computed, getCurrentInstance, nextTick, onBeforeMount, onMounted, onUpdated, reactive, ref, unref, watch } from 'vue'
 
 import { useInfiniteScroll } from '@vueuse/core'
 import imagesloaded from 'imagesloaded'
@@ -197,6 +197,12 @@ async function featchList() {
   }
 }
 
+const app = getCurrentInstance()
+
+const updateHtml = debounce(() => {
+  app?.appContext.app.$waterfall?.forceUpdate()
+}, 1600)
+
 async function loadMore() {
   if (loading || el.value == null)
     return
@@ -218,7 +224,8 @@ async function loadMore() {
   else {
     listData.value = listData.value.concat(more)
     console.log('listData.value出来了2222222222', listData.value, pagination.pageNo)
-    waterfallRef.value?.mix()
+    // waterfallRef.value?.mix()
+    updateHtml()
   }
   // layout()
 }
@@ -296,6 +303,8 @@ function imUpdateSelectIds(x: number, y: number, w: number, h: number) {
       selectedApproveItems.value.push(item)
     }
   })
+
+  updateHtml()
 }
 
 function isSelected(pictureId: number) {
@@ -401,6 +410,7 @@ function removeListeners() {
   on(el.value!, 'mousemove', moveHandler)
   on(document, 'mouseup', upHandler)
   // on(elwc.value!, 'mouseup', upHandler)
+  updateHtml()
 }
 
 function afterEnter() {
@@ -499,7 +509,8 @@ function setBatch(value) {
     batch.value = !value
   else
     batch.value = value
-  waterfallRef.value?.resize()
+  // waterfallRef.value?.resize()
+  updateHtml()
   if (value === false) {
     selectIds.value = []
     selectedApproveItems.value.forEach(item => (item.checked = false))
@@ -516,6 +527,10 @@ const showActions = computed(() => {
   return selectedApproveItems.value.length > 0 && batch
 })
 
+watch(() => showActions.value, () => {
+  updateHtml()
+})
+
 function onCheckChange(checked: any, item: any) {
   item.checked = checked
   const index = selectedApproveItems.value.indexOf(item)
@@ -779,13 +794,13 @@ watch(() => show.value, async (newVal) => {
                     alt="加载错误"
                     @click="
                       ($event) => {
-                        previewHandler(index, $event, item.serverThumbnailUrl, item.imgUrl);
+                        previewHandler(index, $event, item.thumburl, item.imgUrl);
                       }
                     "
                   >
                   <n-image
                     ref="imageRef"
-                    :src="item?.serverThumbnailUrl ? item.serverThumbnailUrl : item.imgUrl"
+                    :src="item?.thumburl ? item.thumburl : item.imgUrl"
                     :preview-src="item.imgUrl"
                     :fallback-src="bgLoadingImg"
                     class="img "
@@ -840,13 +855,13 @@ watch(() => show.value, async (newVal) => {
                     alt="加载错误"
                     @click="
                       ($event) => {
-                        previewHandler(index, $event, item.serverThumbnailUrl, item.imgUrl);
+                        previewHandler(index, $event, item.thumburl, item.imgUrl);
                       }
                     "
                   >
                   <n-image
                     ref="imageRef"
-                    :src="item?.serverThumbnailUrl ? item.serverThumbnailUrl : item.imgUrl"
+                    :src="item?.thumburl ? item.thumburl : item.imgUrl"
                     :preview-src="item.imgUrl"
                     :fallback-src="bgLoadingImg"
                     class="img "