From bf9b911cb2d3ea8d177ed4f5406a3ac255b25169 Mon Sep 17 00:00:00 2001 From: AoXuan Date: Fri, 15 Aug 2025 15:32:10 +0800 Subject: [PATCH] =?UTF-8?q?refactor(Scheduler):=20=E9=87=8D=E6=9E=84?= =?UTF-8?q?=E8=B0=83=E5=BA=A6=E5=8F=B0=E7=95=8C=E9=9D=A2=E5=92=8C=E9=80=BB?= =?UTF-8?q?=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/views/Scheduler.vue | 311 ++++++++++++++++--------------- 1 file changed, 161 insertions(+), 150 deletions(-) diff --git a/frontend/src/views/Scheduler.vue b/frontend/src/views/Scheduler.vue index b88483e..1bb6822 100644 --- a/frontend/src/views/Scheduler.vue +++ b/frontend/src/views/Scheduler.vue @@ -2,17 +2,8 @@
- - + +
@@ -32,20 +23,9 @@
- - + + 自动代理 人工排查 @@ -63,82 +43,76 @@
- + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - + - +
- +
@@ -174,16 +148,11 @@ -
-
+ :key="`output-${task.websocketId}-${task.logs.length}`"> +
{{ log.time }} {{ log.message }}
@@ -201,23 +170,12 @@
- + - + @@ -230,19 +188,11 @@ - +

{{ currentMessage.content }}

- +
@@ -252,10 +202,8 @@ import { ref, reactive, onMounted, onUnmounted, h, nextTick, computed } from 'vue' import { message, notification } from 'ant-design-vue' import { - PlusOutlined, PlayCircleOutlined, StopOutlined, - ClearOutlined, } from '@ant-design/icons-vue' import { Service } from '@/api/services/Service' import type { ComboBoxItem } from '@/api/models/ComboBoxItem' @@ -305,13 +253,13 @@ const taskOptions = ref([]) // 任务表单(弹窗用) const taskForm = reactive({ taskId: null, - mode: '自动代理' as TaskCreateIn.mode, + mode: '自动代理' as TaskCreateIn['mode'], }) // 快速任务表单(右上角用) const quickTaskForm = reactive({ taskId: null, - mode: '自动代理' as TaskCreateIn.mode, + mode: '自动代理' as TaskCreateIn['mode'], }) // 运行中的任务 @@ -546,7 +494,11 @@ const connectWebSocket = (task: RunningTask) => { task.websocket = ws ws.onopen = () => { - task.status = '运行中' + // 更新任务状态 + const taskIndex = currentTab.value.runningTasks.findIndex(t => t.websocketId === task.websocketId) + if (taskIndex >= 0) { + currentTab.value.runningTasks[taskIndex].status = '运行中' + } addTaskLog(task, '已连接到任务服务器', 'success') } @@ -561,13 +513,21 @@ const connectWebSocket = (task: RunningTask) => { } ws.onclose = () => { - task.status = '已断开' + // 更新任务状态 + const taskIndex = currentTab.value.runningTasks.findIndex(t => t.websocketId === task.websocketId) + if (taskIndex >= 0) { + currentTab.value.runningTasks[taskIndex].status = '已断开' + currentTab.value.runningTasks[taskIndex].websocket = null + } addTaskLog(task, '与服务器连接已断开', 'warning') - task.websocket = null } ws.onerror = error => { - task.status = '连接错误' + // 更新任务状态 + const taskIndex = currentTab.value.runningTasks.findIndex(t => t.websocketId === task.websocketId) + if (taskIndex >= 0) { + currentTab.value.runningTasks[taskIndex].status = '连接错误' + } addTaskLog(task, '连接发生错误', 'error') console.error('WebSocket错误:', error) } @@ -579,32 +539,58 @@ const connectWebSocket = (task: RunningTask) => { } // 处理WebSocket消息 const handleWebSocketMessage = (task: RunningTask, data: any) => { + // 添加详细的调试日志 + console.log('收到WebSocket消息:', data) + console.log('消息类型:', data.type) + console.log('消息数据:', data.data) + + // 找到任务在当前调度台中的索引,确保实时更新 + const taskIndex = currentTab.value.runningTasks.findIndex(t => t.websocketId === task.websocketId) + if (taskIndex === -1) { + console.log('未找到任务索引,websocketId:', task.websocketId) + return + } + switch (data.type) { case 'Update': - // 界面更新信息 - 更新任务队列和用户队列 + console.log('处理Update消息') + // 界面更新信息 - 更新用户队列 if (data.data) { - // 更新任务队列 - if (data.data.task_list) { - task.taskQueue = data.data.task_list.map((item: any) => ({ - name: item.name || item.id || '未知任务', + console.log('data.data存在:', data.data) + // 更新用户队列 - 只显示 task_list 中的 name 字段 + if (data.data.task_list && Array.isArray(data.data.task_list)) { + console.log('找到task_list,长度:', data.data.task_list.length) + console.log('task_list内容:', data.data.task_list) + + // 直接更新响应式数组中的用户队列 + const newUserQueue = data.data.task_list.map((item: any) => ({ + name: item.name || '未知任务', status: item.status || '未知', })) + + console.log('映射后的用户队列:', newUserQueue) + currentTab.value.runningTasks[taskIndex].userQueue = newUserQueue + + // 强制触发响应式更新 + nextTick(() => { + console.log('nextTick后的用户队列:', currentTab.value.runningTasks[taskIndex].userQueue) + }) + + // 添加调试日志,确认数据更新 + console.log('用户队列已更新:', currentTab.value.runningTasks[taskIndex].userQueue) + console.log('当前任务对象:', currentTab.value.runningTasks[taskIndex]) + } else { + console.log('task_list不存在或不是数组') } - // 更新用户队列 - if (data.data.task_list) { - task.userQueue = data.data.task_list.map((user: any) => ({ - name: user.name || user.username || user.id || '未知用户', - status: user.status || '未知', - })) - } - - // 其他更新信息记录到日志 + // 其他更新信息记录到日志,但不显示 task_list 的原始数据 for (const [key, value] of Object.entries(data.data)) { - if (key !== 'taskQueue' && key !== 'userQueue') { - addTaskLog(task, `${key}: ${value}`, 'info') + if (key !== 'task_list') { + addTaskLog(currentTab.value.runningTasks[taskIndex], `${key}: ${value}`, 'info') } } + } else { + console.log('data.data不存在') } break @@ -652,16 +638,19 @@ const handleWebSocketMessage = (task: RunningTask, data: any) => { case 'Signal': // 状态信号 if (data.data?.Accomplish !== undefined) { - task.status = data.data.Accomplish ? '已完成' : '已失败' - addTaskLog(task, `任务${task.status}`, data.data.Accomplish ? 'success' : 'error') + const newStatus = data.data.Accomplish ? '已完成' : '已失败' + + // 更新任务状态 + currentTab.value.runningTasks[taskIndex].status = newStatus + addTaskLog(currentTab.value.runningTasks[taskIndex], `任务${newStatus}`, data.data.Accomplish ? 'success' : 'error') // 检查是否所有任务都完成了 checkAllTasksCompleted() // 断开连接 - if (task.websocket) { - task.websocket.close() - task.websocket = null + if (currentTab.value.runningTasks[taskIndex].websocket) { + currentTab.value.runningTasks[taskIndex].websocket.close() + currentTab.value.runningTasks[taskIndex].websocket = null } } break @@ -840,6 +829,28 @@ const getTaskStatusColor = (status: string) => { } } +// 获取队列项状态颜色 +const getQueueItemStatusColor = (status: string) => { + switch (status) { + case '运行': + case '运行中': + return 'processing' + case '完成': + case '已完成': + return 'success' + case '失败': + case '已失败': + return 'error' + case '等待': + case '待执行': + return 'default' + case '暂停': + return 'warning' + default: + return 'default' + } +} + // 任务选项过滤 const filterTaskOption = (input: string, option: any) => { return option.label.toLowerCase().includes(input.toLowerCase())