feat: 机器终端支持文件&文件夹上传、支持选中文件下载

frontend/src/components/sysmsg/db/DbSqlExecProgress.vue

@@ -0,0 +1,41 @@
+<template>
+    <el-descriptions border size="small" :title="`${props.progress.title}`">
+        <el-descriptions-item label="时间">{{ state.elapsedTime }}</el-descriptions-item>
+        <el-descriptions-item label="已处理">{{ progress.executedStatements }}</el-descriptions-item>
+    </el-descriptions>
+</template>
+<script lang="ts" setup>
+import { onMounted, onUnmounted, reactive } from 'vue';
+import { formatTime } from 'element-plus/es/components/countdown/src/utils';
+
+const props = defineProps({
+    progress: {
+        type: Object,
+        default: () => ({
+            title: '',
+            executedStatements: 0,
+        }),
+    },
+});
+
+const state = reactive({
+    elapsedTime: '00:00:00',
+});
+
+let timer: any = undefined;
+const startTime = Date.now();
+
+onMounted(async () => {
+    timer = setInterval(() => {
+        const elapsed = Date.now() - startTime;
+        state.elapsedTime = formatTime(elapsed, 'HH:mm:ss');
+    }, 1000);
+});
+
+onUnmounted(async () => {
+    if (timer != undefined) {
+        clearInterval(timer); // 在Vue实例销毁前，清除我们的定时器
+        timer = undefined;
+    }
+});
+</script>

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

@@ -0,0 +1,56 @@
+import ProgressNotify from './DbSqlExecProgress.vue';
+import { ElNotification } from 'element-plus';
+import { h, reactive } from 'vue';
+import syssocket from '@/common/syssocket';
+
+const sqlExecNotifyMap: Map<string, any> = new Map();
+
+// 构建 props（私有函数，不导出）
+const buildProgressProps = (): any => {
+    return {
+        progress: {
+            title: {
+                type: String,
+            },
+            executedStatements: {
+                type: Number,
+            },
+        },
+    };
+};
+
+export async function registerDbSqlExecProgress() {
+    await syssocket.registerMsgHandler('sqlScriptRunProgress', function (message: any) {
+        const content = message.params;
+        const id = content.id;
+        let progress = sqlExecNotifyMap.get(id);
+        if (content.terminated) {
+            if (progress != undefined) {
+                progress.notification?.close();
+                sqlExecNotifyMap.delete(id);
+                progress = undefined;
+            }
+            return;
+        }
+
+        if (progress == undefined) {
+            progress = {
+                props: reactive(buildProgressProps()),
+                notification: undefined,
+            };
+        }
+
+        progress.props.progress.title = content.title;
+        progress.props.progress.executedStatements = content.executedStatements;
+        if (!sqlExecNotifyMap.has(id)) {
+            progress.notification = ElNotification({
+                duration: 0,
+                title: message.title,
+                message: h(ProgressNotify, progress.props),
+                type: 'info',
+                showClose: false,
+            });
+            sqlExecNotifyMap.set(id, progress);
+        }
+    });
+}

frontend/src/components/sysmsg/db/index.ts

@@ -0,0 +1,5 @@
+import { registerDbSqlExecProgress } from './db-sql-exec-progress';
+
+export function initDbSysMsgs() {
+    registerDbSqlExecProgress();
+}