From 8e70ea94ef06d6073561d1325f9ae975be3892e5 Mon Sep 17 00:00:00 2001
From: zly <zhongliangyuan@gdngsk.com>
Date: Tue, 24 Mar 2026 15:46:37 +0800
Subject: [PATCH] =?UTF-8?q?feat(componentDeployment):=20socket=E7=BE=8E?=
 =?UTF-8?q?=E5=8C=96=EF=BC=8C=E5=A2=9E=E5=8A=A0=E5=BA=8F=E5=8F=B7=E4=BB=A5?=
 =?UTF-8?q?=E5=8F=8A=E4=BF=A1=E6=81=AF=E6=8F=90=E5=8F=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/useWebSocket.ts                     |  4 ---
 .../componentDeployment/index.tsx             | 34 +++++++++++++++----
 .../componentTest/testInstance.tsx            |  1 -
 3 files changed, 27 insertions(+), 12 deletions(-)

diff --git a/src/hooks/useWebSocket.ts b/src/hooks/useWebSocket.ts
index 2549639..039b782 100644
--- a/src/hooks/useWebSocket.ts
+++ b/src/hooks/useWebSocket.ts
@@ -76,7 +76,6 @@ const useWebSocket = (options: WebSocketOptions = {}): WebSocketHook => {
       wsRef.current = ws;
 
       ws.onopen = (event) => {
-        console.log('WebSocket opened');
         setReadyState(WebSocket.OPEN);
         setIsConnected(true);
         reconnectAttemptsRef.current = 0;
@@ -84,7 +83,6 @@ const useWebSocket = (options: WebSocketOptions = {}): WebSocketHook => {
       };
 
       ws.onclose = (event) => {
-        console.log('WebSocket closed');
         setReadyState(WebSocket.CLOSED);
         setIsConnected(false);
         onClose?.(event);
@@ -99,13 +97,11 @@ const useWebSocket = (options: WebSocketOptions = {}): WebSocketHook => {
       };
 
       ws.onerror = (event) => {
-        console.log('WebSocket error', event);
         setIsConnected(false);
         onError?.(event);
       };
 
       ws.onmessage = (event) => {
-        console.log('WebSocket message', event);
         onMessage?.(event);
       };
 
diff --git a/src/pages/componentDevelopment/componentDeployment/index.tsx b/src/pages/componentDevelopment/componentDeployment/index.tsx
index bc0058a..23f3d3c 100644
--- a/src/pages/componentDevelopment/componentDeployment/index.tsx
+++ b/src/pages/componentDevelopment/componentDeployment/index.tsx
@@ -8,6 +8,7 @@ import ConfigTutorial from '@/pages/componentDevelopment/componentEnv/configTuto
 import { getComponentClassify } from '@/api/componentClassify';
 import useWebSocket from '@/hooks/useWebSocket';
 import { getToken } from '@/utils/auth';
+import { isJSON } from '@/utils/common';
 
 const ComponentDeployment = () => {
   const [searchKeyword, setSearchKeyword] = useState('');
@@ -21,6 +22,7 @@ const ComponentDeployment = () => {
   const [compileLogsMap, setCompileLogsMap] = useState<Record<string, string>>({});
   // 编译状态管理 - 按实例 ID 存储状态
   const [compileStatusMap, setCompileStatusMap] = useState<Record<string, 'idle' | 'running' | 'success' | 'failed' | 'canceled'>>({});
+  const compileLogSequenceRef = useRef<Record<string, number>>({});
   const currentCompileIdRef = useRef<string | null>(null);
 
   // WebSocket 连接 - 用于接收编译日志
@@ -30,11 +32,25 @@ const ComponentDeployment = () => {
       if (!id) return;
 
       try {
-        const data = typeof event.data === 'string' ? event.data : JSON.stringify(event.data);
-        setCompileLogsMap(prev => ({
-          ...prev,
-          [id]: prev[id] ? prev[id] + '\n' + data : data
-        }));
+        const currentSequence = (compileLogSequenceRef.current[id] || 0) + 1;
+        compileLogSequenceRef.current[id] = currentSequence;
+
+        if (isJSON(event.data)) {
+          const parseData = JSON.parse(event.data);
+          const message = parseData.message || event.data;
+          const sequenceMessage = `${currentSequence}. ${message}`;
+          setCompileLogsMap(prev => ({
+            ...prev,
+            [id]: prev[id] ? prev[id] + '\n' + sequenceMessage : sequenceMessage
+          }));
+        }
+        else {
+          const data = `${currentSequence}. ${event.data}`;
+          setCompileLogsMap(prev => ({
+            ...prev,
+            [id]: prev[id] ? prev[id] + '\n' + data : data
+          }));
+        }
       } catch (error) {
         console.error('解析 WebSocket 消息失败:', error);
       }
@@ -58,7 +74,8 @@ const ComponentDeployment = () => {
 
     if (window.location.host.includes('localhost')) {
       wsUrl = `${process.env.NEXT_PUBLIC_DEV_SOCKET_HOST}/ws/v1/bpms-workbench/instance-log?Authorization=Bearer ${getToken()}`;
-    } else {
+    }
+    else {
       wsUrl = `${protocol}//${host}/ws/v1/bpms-workbench/instance-log?Authorization=Bearer ${getToken()}`;
     }
 
@@ -86,6 +103,8 @@ const ComponentDeployment = () => {
   const subscribeInstanceLog = (instanceId: string) => {
     currentCompileIdRef.current = instanceId;
 
+    compileLogSequenceRef.current[instanceId] = 0;
+
     // 清空该实例之前的日志
     setCompileLogsMap(prev => ({
       ...prev,
@@ -103,7 +122,8 @@ const ComponentDeployment = () => {
         instanceId,
         type: 'subscribe'
       });
-    } else {
+    }
+    else {
       Message.warning('WebSocket 未连接，无法实时接收日志');
     }
   };
diff --git a/src/pages/componentDevelopment/componentTest/testInstance.tsx b/src/pages/componentDevelopment/componentTest/testInstance.tsx
index 0b518ed..9aec85c 100644
--- a/src/pages/componentDevelopment/componentTest/testInstance.tsx
+++ b/src/pages/componentDevelopment/componentTest/testInstance.tsx
@@ -111,7 +111,6 @@ const TestInstance = ({ instance, parentId, onBack }: { instance: any; parentId:
     else {
       // WebSocket连接前置
       const res: any = await startTestCase(instance.id);
-      console.log('res:', res);
 
       // 构建WebSocket URL，根据你的实际后端配置调整
       const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';