From 05ba908a7fe6f0f94fec495da67779043f908f4c Mon Sep 17 00:00:00 2001
From: cherishsince <cherishsince@aliyun.com>
Date: Tue, 18 Jun 2024 14:35:42 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E5=A2=9E=E5=8A=A0=E3=80=91=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=20loading?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/ai/image/ImageTask.vue | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/views/ai/image/ImageTask.vue b/src/views/ai/image/ImageTask.vue
index 04e8cadb..85708783 100644
--- a/src/views/ai/image/ImageTask.vue
+++ b/src/views/ai/image/ImageTask.vue
@@ -22,6 +22,7 @@
 import {ImageApi, ImageDetailVO, ImageMjActionVO, ImageMjButtonsVO} from '@/api/ai/image';
 import ImageDetailDrawer from './ImageDetailDrawer.vue'
 import ImageTaskCard from './ImageTaskCard.vue'
+import {ElLoading} from "element-plus";
 
 const message = useMessage() // 消息弹窗
 
@@ -30,6 +31,7 @@ const imageListInterval = ref<any>() // image 列表定时器，刷新列表
 const isShowImageDetail = ref<boolean>(false) // 是否显示 task 详情
 const showImageDetailId = ref<number>(0) // 是否显示 task 详情
 const imageTaskRef = ref<any>() // ref
+const imageTaskLoadingInstance = ref<any>() // loading
 const imageTaskLoading = ref<boolean>(false) // loading
 const pageNo = ref<number>(1) // page no
 const pageSize = ref<number>(20) // page size
@@ -50,10 +52,17 @@ const handlerDrawerOpen = async () => {
 const getImageList = async () => {
   imageTaskLoading.value = true
   try {
+    imageTaskLoadingInstance.value = ElLoading.service({
+      target: imageTaskRef.value,
+      text: '加载中...'
+    })
     const { list } = await ImageApi.getImageList({pageNo: pageNo.value, pageSize: pageSize.value})
     imageList.value.push.apply(imageList.value, list)
   } finally {
-    imageTaskLoading.value = false
+    if (imageTaskLoadingInstance.value) {
+      imageTaskLoadingInstance.value.close();
+      imageTaskLoadingInstance.value = null;
+    }
   }
 }