From af5a8d80bca9b8c08543238a370ea3c70c8c59b1 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 21 十一月 2024 11:09:21 +0800
Subject: [PATCH] Merge branch 'hc-dataproduct-v1112' into lsf-dataproduct-1024

---
 src/components/FYImageSelectDialog.vue |  100 ++++++++++++++++++++++++++++++++++++--------------
 1 files changed, 72 insertions(+), 28 deletions(-)

diff --git a/src/components/FYImageSelectDialog.vue b/src/components/FYImageSelectDialog.vue
index 99397d4..6816f4c 100644
--- a/src/components/FYImageSelectDialog.vue
+++ b/src/components/FYImageSelectDialog.vue
@@ -1,8 +1,8 @@
 <template>
   <el-dialog
     :model-value="dialogVisible"
-    @opened="$emit('update:dialogVisible', true)"
-    @closed="$emit('update:dialogVisible', false)"
+    @opened="handleOpen"
+    @closed="handleClose"
     width="66%"
     destroy-on-close
   >
@@ -40,14 +40,15 @@
           class="imgs"
         >
           <el-image
+            v-loading="img.loading"
             v-for="(img, i) in typeImgMap.get(activeId)"
             :key="i"
             :class="[img.isSelect ? 'selected' : 'noActive', 'image']"
             fit="cover"
             :src="img.url"
             @click="onSelect(img, i)"
-            @load="onOneImgLoadSuccess"
-            @error="onOneImgLoadError"
+            @load="onOneImgLoadSuccess(img)"
+            @error="onOneImgLoadError(img)"
           />
         </el-scrollbar>
         <el-row v-else justify="space-between">
@@ -58,7 +59,7 @@
   </el-dialog>
 </template>
 <script setup>
-import { ref, watch, computed } from 'vue';
+import { ref, watch, computed, onMounted, onUnmounted } from 'vue';
 
 const props = defineProps({
   dialogVisible: Boolean,
@@ -108,10 +109,12 @@
     loadedImgCount.value
   );
 });
-function onOneImgLoadError(e) {
+function onOneImgLoadError(img) {
+  img.loading = false
   loadedImgCount.value++;
 }
-function onOneImgLoadSuccess(e) {
+function onOneImgLoadSuccess(img) {
+  img.loading = false
   loadedImgCount.value++;
 }
 watch(
@@ -148,7 +151,28 @@
     img.isSelect = false;
   }
 }
-
+function handleOpen() {
+  // if (props.typeImgMap.get(activeId.value) == undefined) {
+  //     return;
+  //   }
+  //   props.typeImgMap.get(activeId.value).forEach((i) => {
+  //     if (i.isSelect == true) {
+  //       return;
+  //     }
+  //     props.defaultFile.forEach((imgItem) => {
+  //       if (imgItem.url == i.url) {
+  //         i.isSelect = true;
+  //         selectedImgUrlList.value.push(i);
+  //       }
+  //     });
+  //   });
+  emit('update:dialogVisible', true)
+}
+function handleClose() {
+  selectedImgUrlList.value.forEach(item => item.isSelect = false)
+  selectedImgUrlList.value = []
+  emit('update:dialogVisible', false)
+}
 function handleSubmit() {
   emit('submit', selectedImgUrlList.value);
   emit('update:dialogVisible', false);
@@ -168,27 +192,47 @@
   },
   { immediate: true }
 );
+// watch(
+//   () => props.defaultFile,
+//   (nV, oV) => {
+//     if (props.typeImgMap.get(activeId.value) == undefined) {
+//       return;
+//     }
+//     props.typeImgMap.get(activeId.value).forEach((i) => {
+//       if (i.isSelect == true) {
+//         return;
+//       }
+//       nV.forEach((imgItem) => {
+//         if (imgItem.url == i.url) {
+//           i.isSelect = true;
+//           selectedImgUrlList.value.push(i);
+//         }
+//       });
+//     });
+//   },
+//   { deep: true, immediate: true }
+// );
 
-watch(
-  () => props.typeImgMap,
-  (newMap, oldMap) => {
-    if (newMap.get(activeId.value) == undefined) {
-      return;
-    }
-    newMap.get(activeId.value).forEach((i) => {
-      if (i.isSelect == true) {
-        return;
-      }
-      props.defaultFile.forEach((imgItem) => {
-        if (imgItem.url == i.url) {
-          i.isSelect = true;
-          selectedImgUrlList.value.push(i);
-        }
-      });
-    });
-  },
-  { deep: true, immediate: true }
-);
+// watch(
+//   () => props.typeImgMap,
+//   (newMap, oldMap) => {
+//     if (newMap.get(activeId.value) == undefined) {
+//       return;
+//     }
+//     newMap.get(activeId.value).forEach((i) => {
+//       if (i.isSelect == true) {
+//         return;
+//       }
+//       props.defaultFile.forEach((imgItem) => {
+//         if (imgItem.url == i.url) {
+//           i.isSelect = true;
+//           selectedImgUrlList.value.push(i);
+//         }
+//       });
+//     });
+//   },
+//   { immediate: true }
+// );
 </script>
 <style scoped>
 .center {

--
Gitblit v1.9.3