From 2d900baad1ebbf11a20b620df5e5d8e12636d1fe Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Wed, 25 Dec 2024 21:55:20 +0800
Subject: [PATCH] =?UTF-8?q?feat(ReorganizeDialog):=20=E6=B7=BB=E5=8A=A0SSE?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=E4=BB=A5=E7=9B=91=E5=90=AC=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E6=95=B4=E7=90=86=E8=BF=9B=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/dialog/ReorganizeDialog.vue | 46 ++++++++++++++++++----
 1 file changed, 39 insertions(+), 7 deletions(-)

diff --git a/src/components/dialog/ReorganizeDialog.vue b/src/components/dialog/ReorganizeDialog.vue
index 960d34c8..6c92e310 100644
--- a/src/components/dialog/ReorganizeDialog.vue
+++ b/src/components/dialog/ReorganizeDialog.vue
@@ -42,6 +42,9 @@ const $toast = useToast()
 // TMDB选择对话框
 const mediaSelectorDialog = ref(false)
 
+// 加载进度SSE
+const progressEventSource = ref<EventSource>()
+
 // 整理进度条
 const progressDialog = ref(false)
 
@@ -145,6 +148,24 @@ async function handleTransferLog(logid: number, background: boolean = false) {
   }
 }
 
+// 使用SSE监听加载进度
+function startLoadingProgress() {
+  progressText.value = '请稍候 ...'
+  progressEventSource.value = new EventSource(`${import.meta.env.VITE_API_BASE_URL}system/progress/filetransfer`)
+  progressEventSource.value.onmessage = event => {
+    const progress = JSON.parse(event.data)
+    if (progress) {
+      progressText.value = progress.text
+      progressValue.value = progress.value
+    }
+  }
+}
+
+// 停止监听加载进度
+function stopLoadingProgress() {
+  progressEventSource.value?.close()
+}
+
 // 整理文件
 async function transfer(background: boolean = false) {
   if (!props.logids && !props.items) return
@@ -152,6 +173,11 @@ async function transfer(background: boolean = false) {
   // 显示进度条
   progressDialog.value = true
 
+  if (!background) {
+    // 开始监听进度
+    startLoadingProgress()
+  }
+
   // 文件整理
   if (props.items) {
     for (const item of props.items) {
@@ -166,20 +192,24 @@ async function transfer(background: boolean = false) {
     }
   }
 
+  if (!background) {
+    // 停止监听进度
+    stopLoadingProgress()
+  }
+
   // 关闭进度条
   progressDialog.value = false
   // 重新加载
   emit('done')
 }
 
-// 后台整理
-async function transferAsync() {
-  await transfer(true)
-}
-
 onMounted(() => {
   loadDirectories()
 })
+
+onUnmounted(() => {
+  stopLoadingProgress()
+})
 </script>
 
 <template>
@@ -361,10 +391,12 @@ onMounted(() => {
       </VCardText>
       <VCardActions class="pt-3">
         <VSpacer />
-        <VBtn variant="elevated" color="success" @click="transferAsync" prepend-icon="mdi-plus" class="px-5">
+        <VBtn variant="elevated" color="success" @click="transfer(true)" prepend-icon="mdi-plus" class="px-5">
           加入整理队列
         </VBtn>
-        <VBtn variant="elevated" @click="transfer" prepend-icon="mdi-arrow-right-bold" class="px-5"> 立即整理 </VBtn>
+        <VBtn variant="elevated" @click="transfer(false)" prepend-icon="mdi-arrow-right-bold" class="px-5">
+          立即整理
+        </VBtn>
       </VCardActions>
     </VCard>
     <!-- 手动整理进度框 -->