feat(weChat): 重构视频消息处理逻辑并优化加载状态管理

- 移除旧的待处理视频请求队列及相关方法
- 新增setVideoLoading和setVideoUrl方法简化视频状态管理
- 优化ChatWindow组件中的视频加载状态检测和滚动行为
- 添加CmdDownloadVideoResult消息处理器自动更新视频URL

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

@@ -10,19 +10,11 @@ export interface WeChatState {
   // 消息加载状态
   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;
+  // 视频消息处理方法
+  setVideoLoading: (messageId: number, isLoading: boolean) => void;
+  setVideoUrl: (messageId: number, videoUrl: string) => void;
 }

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

@@ -5,10 +5,7 @@ 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) => ({
@@ -16,7 +13,6 @@ export const useWeChatStore = create<WeChatState>()(
       currentContract: null,
       currentMessages: [],
       messagesLoading: false,
-      pendingVideoRequests: {},
 
       // Actions
       setCurrentContact: (contract: ContractData | weChatGroup) => {
@@ -85,43 +81,22 @@ 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) => {
+      // 视频消息处理方法
+      setVideoLoading: (messageId: number, isLoading: boolean) => {
         set(state => ({
           currentMessages: state.currentMessages.map(msg => {
-            if (msg.id === Number(messageId)) {
+            if (msg.id === messageId) {
               try {
-                const msgContent =
-                  typeof msg.content === "string"
-                    ? JSON.parse(msg.content)
-                    : msg.content;
+                const content = JSON.parse(msg.content);
+                // 更新加载状态
+                const updatedContent = { ...content, isLoading };
                 return {
                   ...msg,
-                  content: JSON.stringify({
-                    ...msgContent,
-                    videoUrl: videoUrl,
-                    isLoading: false,
-                  }),
+                  content: JSON.stringify(updatedContent),
                 };
               } catch (e) {
-                console.error("解析消息内容失败:", e);
+                console.error("更新视频加载状态失败:", e);
+                return msg;
               }
             }
             return msg;
@@ -129,77 +104,42 @@ export const useWeChatStore = create<WeChatState>()(
         }));
       },
 
-      setMessageLoadingStatus: (messageId: string, isLoading: boolean) => {
+      setVideoUrl: (messageId: number, videoUrl: string) => {
         set(state => ({
           currentMessages: state.currentMessages.map(msg => {
-            if (msg.id === Number(messageId)) {
+            if (msg.id === messageId) {
               try {
-                const originalContent = msg.content;
+                const content = JSON.parse(msg.content);
+                // 检查视频是否已经下载完毕，避免重复更新
+                if (content.videoUrl && content.videoUrl === videoUrl) {
+                  console.log("视频已下载，跳过重复更新:", messageId);
+                  return msg;
+                }
+
+                // 设置视频URL并清除加载状态
+                const updatedContent = {
+                  ...content,
+                  videoUrl,
+                  isLoading: false,
+                };
                 return {
                   ...msg,
-                  content: JSON.stringify({
-                    ...JSON.parse(originalContent),
-                    isLoading: isLoading,
-                  }),
+                  content: JSON.stringify(updatedContent),
                 };
               } catch (e) {
-                console.error("解析消息内容失败:", e);
+                console.error("更新视频URL失败:", e);
+                return msg;
               }
             }
             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: {},
         });
       },
     }),

Cunkebao/src/store/module/websocket/msgManage.ts

@@ -3,6 +3,8 @@ import { deepCopy } from "@/utils/common";
 import { WebSocketMessage } from "./websocket";
 import { getkfUserList, asyncKfUserList } from "@/store/module/ckchat/ckchat";
 import { Messages } from "./msg.data";
+
+import { useWeChatStore } from "@/store/module/weChat/weChat";
 // 消息处理器类型定义
 type MessageHandler = (message: WebSocketMessage) => void;
 
@@ -52,6 +54,10 @@ const messageHandlers: Record<string, MessageHandler> = {
     }
   },
 
+  CmdDownloadVideoResult: message => {
+    // 在这里添加具体的处理逻辑
+    useWeChatStore.getState().setVideoUrl(message.friendMessageId, message.url);
+  },
   // 可以继续添加更多处理器...
 };