feat: 首页优化&机器文件/文件夹上传实时进度通知修复

frontend/src/components/sysmsg/db/db-sql-exec-progress.ts

@@ -1,7 +1,7 @@
-import DbSqlExecProgress from './DbSqlExecProgress.vue';
-import { createOrUpdateNotification, completeNotification, activeNotifications } from '../global-notification-manager';
 import syssocket from '@/common/syssocket';
-import { reactive, nextTick } from 'vue';
+import { nextTick, reactive } from 'vue';
+import { activeNotifications, completeNotification, createOrUpdateNotification } from '../global-notification-manager';
+import DbSqlExecProgress from './DbSqlExecProgress.vue';
 
 // 存储SQL执行任务的取消方法
 const sqlExecAborters = new Map<string, { abort: () => void; progress?: any }>();
@@ -9,11 +9,32 @@ const sqlExecAborters = new Map<string, { abort: () => void; progress?: any }>()
 // 存储待注册的 abort 方法（等待 WebSocket 消息到达）
 const pendingSqlExecAborters = new Map<string, () => void>();
 
+export interface SqlExecProgress {
+    id: string;
+    title: string;
+    dbCode: string;
+    dbName: string;
+    executedStatements: number;
+    terminated: boolean;
+    status: string;
+    clientId: string;
+}
+
+const sqlExecStates = reactive<Map<string, SqlExecProgress>>(new Map());
+
+/**
+ * 注册数据库SQL执行进度消息处理
+ */
 export async function registerDbSqlExecProgress() {
     await syssocket.registerMsgHandler('sqlScriptRunProgress', function (message: any) {
         const content = message.params;
         const id = content.id;
 
+        const progress = sqlExecStates.get(id);
+        if (!progress) {
+            return;
+        }
+
         // SQL执行完成
         if (content.terminated) {
             completeNotification(id, 1000);
@@ -21,55 +42,62 @@ export async function registerDbSqlExecProgress() {
             return;
         }
 
-        // 构建组件props
-        const props = {
-            progress: reactive({
-                title: content.title || '',
-                executedStatements: content.executedStatements || 0,
-                terminated: content.terminated || false,
-                status: content.status || '',
-                dbCode: content.dbCode || '',
-                dbName: content.dbName || '',
-            }),
-            onCancel: () => {
-                const aborter = sqlExecAborters.get(id);
-                if (aborter) {
-                    aborter.abort();
-
-                    // 更新通知状态为取消
-                    if (aborter.progress) {
-                        nextTick(() => {
-                            aborter.progress.status = 'cancelled';
-                            aborter.progress.terminated = true;
-                        });
-
-                        // 延迟后关闭通知
-                        setTimeout(() => {
-                            completeNotification(id, 1000);
-                            sqlExecAborters.delete(id);
-                        }, 1500);
-                    } else {
-                        sqlExecAborters.delete(id);
-                    }
-                }
-            },
-        };
-
-        // 创建或更新通知
-        createOrUpdateNotification(id, 'sqlScriptRun', content, DbSqlExecProgress, props, {
-            title: message.title || 'db.sqlExecute',
-            onCancel: props.onCancel,
-        });
-
-        // 如果有待注册的 abort 方法，现在注册
-        const pendingAbort = pendingSqlExecAborters.get(id);
-        if (pendingAbort) {
-            sqlExecAborters.set(id, { abort: pendingAbort, progress: props.progress });
-            pendingSqlExecAborters.delete(id);
-        }
+        progress.executedStatements = content.executedStatements || 0;
+        progress.terminated = content.terminated || false;
+        progress.status = content.status || '';
+        return;
     });
 }
 
+/**
+ * 创建SQL执行进度通知
+ * @param id 执行ID
+ * @param data 进度数据
+ */
+export function createSqlExecNotification(id: string, data: SqlExecProgress) {
+    // 构建组件props
+    const props = {
+        progress: data,
+        onCancel: () => {
+            const aborter = sqlExecAborters.get(id);
+            if (aborter) {
+                aborter.abort();
+
+                // 更新通知状态为取消
+                if (aborter.progress) {
+                    nextTick(() => {
+                        aborter.progress.status = 'cancelled';
+                        aborter.progress.terminated = true;
+                    });
+
+                    // 延迟后关闭通知
+                    setTimeout(() => {
+                        completeNotification(id, 1000);
+                        sqlExecAborters.delete(id);
+                    }, 1500);
+                } else {
+                    sqlExecAborters.delete(id);
+                }
+            }
+        },
+    };
+
+    // 创建或更新通知
+    createOrUpdateNotification(id, 'sqlScriptRun', data, DbSqlExecProgress, props, {
+        title: data.title || 'db.sqlExecute',
+        onCancel: props.onCancel,
+    });
+
+    sqlExecStates.set(id, data);
+
+    // 如果有待注册的 abort 方法，现在注册
+    const pendingAbort = pendingSqlExecAborters.get(id);
+    if (pendingAbort) {
+        sqlExecAborters.set(id, { abort: pendingAbort, progress: props.progress });
+        pendingSqlExecAborters.delete(id);
+    }
+}
+
 /**
  * 注册SQL执行任务的取消方法
  * @param execId 执行ID