fix(websocket): 解决WebSocket重连后频道订阅丢失问题

- 移除调试用的console.log语句
- 添加channelSubscriptions集合跟踪频道订阅状态
- 在WebSocket连接建立时恢复之前的频道订阅
- 添加refreshAfterSocketReconnect函数用于重连后刷新数据
- 在组件挂载时监听socket open事件并绑定重连刷新逻辑
- 在组件卸载时移除socket open事件监听器

src/plugins/websocket.js

@@ -17,6 +17,7 @@ class WebSocketManager {
     this.processingMessages = false;
     this.maxQueueSize = 100;
     this.status = false;
+    this.channelSubscriptions = new Set();
   }
 
   connect() {
@@ -33,6 +34,7 @@ class WebSocketManager {
       this.status = true;
       this.startHeartbeat();
       this.processMessageQueue();
+      this.restoreChannelSubscriptions();
       this.dispatch('open');
     };
 
@@ -159,13 +161,31 @@ class WebSocketManager {
   }
 
   send(payload) {
+    if (payload?.type === 'channel_subscription' && payload.channel) {
+      if (payload.action === 'subscribe') {
+        this.channelSubscriptions.add(payload.channel);
+      } else if (payload.action === 'unsubscribe') {
+        this.channelSubscriptions.delete(payload.channel);
+      }
+    }
     if (this.ws && this.ws.readyState === 1) {
       this.ws.send(JSON.stringify(payload));
-    } else {
+    } else if (payload?.type !== 'channel_subscription') {
       console.warn('WebSocket 未连接，消息发送失败');
     }
   }
 
+  restoreChannelSubscriptions() {
+    if (!this.ws || this.ws.readyState !== 1) return;
+    this.channelSubscriptions.forEach((channel) => {
+      this.ws.send(JSON.stringify({
+        type: 'channel_subscription',
+        action: 'subscribe',
+        channel,
+      }));
+    });
+  }
+
   close() {
     this.isManualClose = true;
     this.status = false;

src/views/inspection/runTask/index.vue

@@ -501,7 +501,6 @@ const subscribeDebounced = debounce(async (sub) => {
         // 清理旧回调
         if (socketChannelCallbacks.value[channel]) {
             socket.off(channel, socketChannelCallbacks.value[channel]);
-            console.log('清理旧回调:', channel);
         }
 
         const callback = (data) => {
@@ -555,15 +554,21 @@ const handleOpenLog = async (row) => {
         logDialogData.value = res.rows
     }
 }
+const refreshAfterSocketReconnect = () => {
+    getList()
+    getHistoryList()
+}
 onMounted(() => {
     getTaskData();
     getList();
     getHistoryList();
     subscribeDebounced(true)
+    socket?.on('open', refreshAfterSocketReconnect)
 })
 
 onUnmounted(() => {
     subscribeDebounced(false)
+    socket?.off('open', refreshAfterSocketReconnect)
 })
 </script>
 <style lang="scss" scoped>

src/views/intelligenceTest/runningTask/index.vue

@@ -543,11 +543,9 @@ const subscribeDebounced = debounce(async (sub) => {
         // 清理旧回调
         if (socketChannelCallbacks.value[channel]) {
             socket.off(channel, socketChannelCallbacks.value[channel]);
-            console.log('清理旧回调:', channel);
         }
 
         const callback = (data) => {
-            console.log('data', data)
             if (data !== '500') {
                 if (data.status !== 0) {
                     const steps = pointList_runningTask.value[data.taskId] || []
@@ -598,6 +596,10 @@ const handleOpenLog = async (row) => {
         logDialogData.value = res.rows
     }
 }
+const refreshAfterSocketReconnect = () => {
+    getList()
+    getHistoryList()
+}
 onMounted(() => {
     getTaskData();
     getPhoneData();
@@ -605,10 +607,12 @@ onMounted(() => {
     getList();
     getHistoryList();
     subscribeDebounced(true)
+    socket?.on('open', refreshAfterSocketReconnect)
 })
 
 onUnmounted(() => {
     subscribeDebounced(false)
+    socket?.off('open', refreshAfterSocketReconnect)
 })
 </script>
 <style lang="scss" scoped>