From 6f9cb4f8f205ea9567d7865bf16ea73b4135a23e Mon Sep 17 00:00:00 2001
From: cherishsince <cherishsince@aliyun.com>
Date: Fri, 28 Jun 2024 16:41:12 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E8=A7=A3=E5=86=B3todo=E3=80=91?=
 =?UTF-8?q?=E5=A6=82=E6=9E=9C=E6=9C=89=E7=94=9F=E6=88=90=E4=B8=AD=E7=9A=84?=
 =?UTF-8?q?=E5=9B=BE=E7=89=87=EF=BC=8C=E8=BD=AE=E8=AF=A2=E6=94=B9=E6=88=90?=
 =?UTF-8?q?=20get=20=E6=8E=A5=E5=8F=A3=E5=8E=BB=E8=BD=AE=E8=AF=A2=EF=BC=8C?=
 =?UTF-8?q?=E4=B8=8D=E5=9F=BA=E4=BA=8E=20page=20=E8=BD=AE=E8=AF=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/ai/image/index.ts        |  4 ++++
 src/views/ai/image/ImageTask.vue | 35 ++++++++++++++++++++++++++++----
 2 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/src/api/ai/image/index.ts b/src/api/ai/image/index.ts
index cb5a5afd..75103182 100644
--- a/src/api/ai/image/index.ts
+++ b/src/api/ai/image/index.ts
@@ -64,6 +64,10 @@ export const ImageApi = {
   getImageMy: async (id: number) => {
     return await request.get({ url: `/ai/image/get-my?id=${id}` })
   },
+  // 获取我的图片
+  getImageMyIds: async (params) => {
+    return await request.get({ url: `/ai/image/get-my-ids`, params})
+  },
   // 生成图片
   drawImage: async (data: ImageDrawReqVO) => {
     return await request.post({ url: `/ai/image/draw`, data })
diff --git a/src/views/ai/image/ImageTask.vue b/src/views/ai/image/ImageTask.vue
index 38bf7483..992120bd 100644
--- a/src/views/ai/image/ImageTask.vue
+++ b/src/views/ai/image/ImageTask.vue
@@ -26,7 +26,7 @@
   />
 </template>
 <script setup lang="ts">
-import {ImageApi, ImageRespVO, ImageMjActionVO, ImageMjButtonsVO} from '@/api/ai/image';
+import {ImageApi, ImageMjActionVO, ImageMjButtonsVO, ImageRespVO} from '@/api/ai/image';
 import ImageDetailDrawer from './ImageDetailDrawer.vue'
 import ImageTaskCard from './ImageTaskCard.vue'
 import {ElLoading, LoadingOptionsResolved} from "element-plus";
@@ -34,7 +34,7 @@ import {ElLoading, LoadingOptionsResolved} from "element-plus";
 const message = useMessage() // 消息弹窗
 
 const imageList = ref<ImageRespVO[]>([]) // image 列表
-const watchImageList = ref<ImageRespVO[]>([]) // 监听的 image list，一般是生成中，需要轮训
+const watchImages = ref<{}>({}) // 监听的 image list，一般是生成中，需要轮训
 const imageListInterval = ref<any>() // image 列表定时器，刷新列表
 const isShowImageDetail = ref<boolean>(false) // 是否显示 task 详情
 const showImageDetailId = ref<number>(0) // 是否显示 task 详情
@@ -72,6 +72,13 @@ const getImageList = async (apply:boolean = false) => {
       imageList.value = list
     }
     pageTotal.value = total
+    // 需要 watch 的数据
+    imageList.value.map(item => {
+      if (item.status === 10) {
+        watchImages.value[item.id] = item
+      }
+    })
+
   } finally {
     if (imageTaskLoadingInstance.value) {
       imageTaskLoadingInstance.value.close();
@@ -80,6 +87,26 @@ const getImageList = async (apply:boolean = false) => {
   }
 }
 
+/**
+ * 获取 - image 列表
+ */
+const refreshWatchImages = async () => {
+  const imageIds = Object.keys(watchImages.value)
+  if (imageIds.length < 1) {
+    return
+  }
+  const res  = await ImageApi.getImageMyIds({ids: imageIds.join(',')}) as ImageRespVO[]
+  res.forEach(image => {
+    const index = imageList.value.findIndex(oldImage => image.id === oldImage.id)
+    if (index !== -1) {
+      // 更新 imageList
+      imageList.value[index] = image
+      // 删除 watchImages
+      delete watchImages.value[image.id];
+    }
+  })
+}
+
 /**  图片 - btn click  */
 const handlerImageBtnClick = async (type, imageDetail: ImageRespVO) => {
   // 获取 image detail id
@@ -145,8 +172,8 @@ onMounted(async () => {
   await getImageList()
   // 自动刷新 image 列表
   imageListInterval.value = setInterval(async () => {
-    await getImageList(false)
-  }, 1000 * 20)
+    await refreshWatchImages()
+  }, 1000 * 3)
 })
 
 /** 组件取消挂在的时候 */