feat(weChat): 添加视频请求处理和WebSocket监听功能

- 在weChat store中新增pendingVideoRequests状态和相关操作方法
- 实现WebSocket监听处理视频下载响应
- 重构ChatWindow组件，将视频处理逻辑移至store
- 优化消息分组和渲染逻辑

Cunkebao/src/store/module/weChat/weChat.data.ts

@@ -7,8 +7,22 @@ export interface WeChatState {
   // 当前聊天用户的消息列表（只存储当前聊天用户的消息）
   currentMessages: ChatRecord[];
 
-  setCurrentContact: (contract: ContractData | weChatGroup) => void;
   // 消息加载状态
   messagesLoading: boolean;
+
+  // 待处理的视频请求队列
+  pendingVideoRequests: Record<string, string>;
+
+  // Actions
+  setCurrentContact: (contract: ContractData | weChatGroup) => void;
   loadChatMessages: (contact: ContractData | weChatGroup) => Promise<void>;
+
+  // 视频请求相关方法
+  addPendingVideoRequest: (messageId: string, requestId: string) => void;
+  removePendingVideoRequest: (messageId: string) => void;
+  updateMessageWithVideo: (messageId: string, videoUrl: string) => void;
+  setMessageLoading: (messageId: string, isLoading: boolean) => void;
+
+  // WebSocket监听初始化
+  initWebSocketListener: () => void;
 }

Cunkebao/src/store/module/weChat/weChat.ts

@@ -5,6 +5,10 @@ import { WeChatState } from "./weChat.data";
 import { clearUnreadCount, updateConfig } from "@/pages/pc/ckbox/api";
 import { ContractData, weChatGroup } from "@/pages/pc/ckbox/data";
 import { addChatSession } from "@/store/module/ckchat/ckchat";
+import {
+  useWebSocketStore,
+  WebSocketMessage,
+} from "@/store/module/websocket/websocket";
 export const useWeChatStore = create<WeChatState>()(
   persist(
     (set, get) => ({
@@ -12,6 +16,7 @@ export const useWeChatStore = create<WeChatState>()(
       currentContract: null,
       currentMessages: [],
       messagesLoading: false,
+      pendingVideoRequests: {},
 
       // Actions
       setCurrentContact: (contract: ContractData | weChatGroup) => {
@@ -58,7 +63,7 @@ export const useWeChatStore = create<WeChatState>()(
       },
 
       setMessageLoading: loading => {
-        set({ messagesLoading: loading });
+        set({ messagesLoading: Boolean(loading) });
       },
 
       addMessage: message => {
@@ -80,11 +85,121 @@ export const useWeChatStore = create<WeChatState>()(
       getCurrentMessages: () => get().currentMessages,
       getMessagesLoading: () => get().messagesLoading,
 
+      // 视频请求相关方法
+      addPendingVideoRequest: (messageId: string, requestId: string) => {
+        set(state => ({
+          pendingVideoRequests: {
+            ...state.pendingVideoRequests,
+            [messageId]: requestId,
+          },
+        }));
+      },
+
+      removePendingVideoRequest: (messageId: string) => {
+        set(state => {
+          const newRequests = { ...state.pendingVideoRequests };
+          delete newRequests[messageId];
+          return { pendingVideoRequests: newRequests };
+        });
+      },
+
+      updateMessageWithVideo: (messageId: string, videoUrl: string) => {
+        set(state => ({
+          currentMessages: state.currentMessages.map(msg => {
+            if (msg.id === Number(messageId)) {
+              try {
+                const msgContent =
+                  typeof msg.content === "string"
+                    ? JSON.parse(msg.content)
+                    : msg.content;
+                return {
+                  ...msg,
+                  content: JSON.stringify({
+                    ...msgContent,
+                    videoUrl: videoUrl,
+                    isLoading: false,
+                  }),
+                };
+              } catch (e) {
+                console.error("解析消息内容失败:", e);
+              }
+            }
+            return msg;
+          }),
+        }));
+      },
+
+      setMessageLoadingStatus: (messageId: string, isLoading: boolean) => {
+        set(state => ({
+          currentMessages: state.currentMessages.map(msg => {
+            if (msg.id === Number(messageId)) {
+              try {
+                const originalContent = msg.content;
+                return {
+                  ...msg,
+                  content: JSON.stringify({
+                    ...JSON.parse(originalContent),
+                    isLoading: isLoading,
+                  }),
+                };
+              } catch (e) {
+                console.error("解析消息内容失败:", e);
+              }
+            }
+            return msg;
+          }),
+        }));
+      },
+
+      // WebSocket监听初始化
+      initWebSocketListener: () => {
+        const unsubscribe = useWebSocketStore.subscribe(state => {
+          const messages = state.messages as WebSocketMessage[];
+          const currentState = get();
+
+          // 只有当有待处理的视频请求时才处理
+          if (Object.keys(currentState.pendingVideoRequests).length === 0) {
+            return;
+          }
+
+          messages.forEach(message => {
+            if (message?.content?.cmdType === "CmdDownloadVideoResult") {
+              console.log("收到视频下载响应:", message.content);
+
+              // 检查是否是我们正在等待的视频响应
+              const messageId = Object.keys(
+                currentState.pendingVideoRequests,
+              ).find(
+                id =>
+                  currentState.pendingVideoRequests[id] ===
+                  message.content.friendMessageId,
+              );
+
+              if (messageId) {
+                console.log("找到对应的消息ID:", messageId);
+
+                // 从待处理队列中移除
+                currentState.removePendingVideoRequest(messageId);
+
+                // 更新消息内容，添加视频URL
+                currentState.updateMessageWithVideo(
+                  messageId,
+                  message.content.url,
+                );
+              }
+            }
+          });
+        });
+
+        return unsubscribe;
+      },
+
       clearAllData: () => {
         set({
           currentContract: null,
           currentMessages: [],
           messagesLoading: false,
+          pendingVideoRequests: {},
         });
       },
     }),