新增消息序列号支持，优化消息发送和接收逻辑，更新消息状态处理，提升代码可读性和用户体验。

Touchkebao/src/pages/pc/ckbox/data.ts

@@ -194,6 +194,7 @@ export interface ChatRecord {
     wechatId: string;
     [key: string]: any;
   };
+  seq?: number;
   [key: string]: any;
 }
 

Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageEnter/index.tsx

@@ -9,7 +9,7 @@ import {
   MessageOutlined,
   LoadingOutlined,
 } from "@ant-design/icons";
-import { ContractData, weChatGroup } from "@/pages/pc/ckbox/data";
+import { ContractData, weChatGroup, ChatRecord } from "@/pages/pc/ckbox/data";
 import { useWebSocketStore } from "@/store/module/websocket/websocket";
 import { EmojiPicker } from "@/components/EmojiSeclection";
 import { EmojiInfo } from "@/components/EmojiSeclection/wechatEmoji";
@@ -18,6 +18,7 @@ import AudioRecorder from "@/components/Upload/AudioRecorder";
 import ToContract from "./components/toContract";
 import styles from "./MessageEnter.module.scss";
 import { useWeChatStore } from "@/store/module/weChat/weChat";
+import { useContactStore } from "@/store/module/weChat/contacts";
 const { Footer } = Layout;
 const { TextArea } = Input;
 
@@ -33,9 +34,8 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
   const EnterModule = useWeChatStore(state => state.EnterModule);
   const updateShowCheckbox = useWeChatStore(state => state.updateShowCheckbox);
   const updateEnterModule = useWeChatStore(state => state.updateEnterModule);
-  const updateTransmitModal = useWeChatStore(
-    state => state.updateTransmitModal,
-  );
+  const setTransmitModal = useContactStore(state => state.setTransmitModal);
+  const addMessage = useWeChatStore(state => state.addMessage);
   const showChatRecordModel = useWeChatStore(
     state => state.showChatRecordModel,
   );
@@ -55,6 +55,35 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
 
   const handleSend = async () => {
     if (!inputValue.trim()) return;
+    const messageId = +Date.now();
+    // 构造本地消息对象
+    const localMessage: ChatRecord = {
+      id: messageId, // 使用时间戳作为临时ID
+      wechatAccountId: contract.wechatAccountId,
+      wechatFriendId: contract?.chatroomId ? 0 : contract.id,
+      wechatChatroomId: contract?.chatroomId ? contract.id : 0,
+      tenantId: 0,
+      accountId: 0,
+      synergyAccountId: 0,
+      content: inputValue,
+      msgType: 1,
+      msgSubType: 0,
+      msgSvrId: "",
+      isSend: true, // 标记为发送中
+      createTime: new Date().toISOString(),
+      isDeleted: false,
+      deleteTime: "",
+      sendStatus: 1,
+      wechatTime: Date.now(),
+      origin: 0,
+      msgId: 0,
+      recalled: false,
+      seq: messageId,
+    };
+    // 先插入本地数据
+    addMessage(localMessage);
+
+    // 再发送消息到服务器
     const params = {
       wechatAccountId: contract.wechatAccountId,
       wechatChatroomId: contract?.chatroomId ? contract.id : 0,
@@ -62,6 +91,7 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
       msgSubType: 0,
       msgType: 1,
       content: inputValue,
+      seq: messageId,
     };
     sendCommand("CmdSendMessage", params);
     setInputValue("");
@@ -159,7 +189,7 @@ const MessageEnter: React.FC<MessageEnterProps> = ({ contract }) => {
     updateEnterModule("common");
   };
   const handTurnRignt = () => {
-    updateTransmitModal(true);
+    setTransmitModal(true);
   };
   const openChatRecordModel = () => {
     updateShowChatRecordModel(!showChatRecordModel);

Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/AudioMessage/AudioMessage.module.scss

@@ -104,10 +104,6 @@
   font-size: 11px;
   color: #666;
   margin-top: 2px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  cursor: help;
 }
 
 // 进度条容器

Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/AudioMessage/AudioMessage.tsx

@@ -215,13 +215,7 @@ const AudioMessage: React.FC<AudioMessageProps> = ({ audioUrl, msgId }) => {
         </div>
       </div>
       <div>
-        {audioText && (
-          <div className={styles.audioText} title={audioText}>
-            {audioText.length > 10
-              ? `${audioText.substring(0, 10)}...`
-              : audioText}
-          </div>
-        )}
+        {audioText && <div className={styles.audioText}>{audioText}</div>}
       </div>
     </>
   );

Touchkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/index.tsx

@@ -542,7 +542,7 @@ const MessageRecord: React.FC<MessageRecordProps> = ({ contract }) => {
     return messages
       .filter(msg => msg !== null && msg !== undefined) // 过滤掉null和undefined的消息
       .map(msg => ({
-        time: formatWechatTime(msg?.wechatTime),
+        time: formatWechatTime(String(msg?.wechatTime)),
         messages: [msg],
       }));
   };
@@ -636,6 +636,7 @@ const MessageRecord: React.FC<MessageRecordProps> = ({ contract }) => {
                   />
                 </div>
               )}
+
               <Avatar
                 size={32}
                 src={currentKf.avatar}
@@ -643,6 +644,21 @@ const MessageRecord: React.FC<MessageRecordProps> = ({ contract }) => {
                 className={styles.messageAvatar}
               />
               <div>{parseMessageContent(msg?.content, msg, msg?.msgType)}</div>
+              {/* 发送状态 loading 图标 */}
+              {msg.sendStatus === 1 && (
+                <div
+                  style={{
+                    marginRight: "8px",
+                    display: "flex",
+                    alignItems: "center",
+                  }}
+                >
+                  <LoadingOutlined
+                    spin
+                    style={{ fontSize: "16px", color: "#1890ff" }}
+                  />
+                </div>
+              )}
             </>
           )}
         </div>

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

@@ -101,4 +101,6 @@ export interface WeChatState {
   // ==================== 消息接收处理 ====================
   /** 接收新消息处理 */
   receivedMsg: (message: ChatRecord) => void;
+  /** 查找消息 */
+  findMessageBySeq: (seq: number) => ChatRecord | undefined;
 }

Touchkebao/src/store/module/weChat/weChat.ts

@@ -84,6 +84,9 @@ export const useWeChatStore = create<WeChatState>()(
           }
         }
       },
+      findMessageBySeq: (seq: number) => {
+        return get().currentMessages.find(msg => msg.seq === seq);
+      },
       /** 更新指定消息内容 */
       updateMessage: (messageId, updates) => {
         set(state => ({

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

@@ -11,6 +11,8 @@ type MessageHandler = (message: WebSocketMessage) => void;
 const addMessage = useWeChatStore.getState().addMessage;
 const recallMessage = useWeChatStore.getState().recallMessage;
 const receivedMsg = useWeChatStore.getState().receivedMsg;
+const findMessageBySeq = useWeChatStore.getState().findMessageBySeq;
+const updateMessage = useWeChatStore.getState().updateMessage;
 const updateMomentCommonLoading =
   useWeChatStore.getState().updateMomentCommonLoading;
 const addMomentCommon = useWeChatStore.getState().addMomentCommon;
@@ -41,13 +43,18 @@ const messageHandlers: Record<string, MessageHandler> = {
   },
   // 发送消息响应
   CmdSendMessageResp: message => {
-    console.log("发送消息响应", message);
-    addMessage(message.friendMessage || message.chatroomMessage);
-    // 在这里添加具体的处理逻辑
+    const msg = findMessageBySeq(message.seq);
+    if (msg) {
+      updateMessage(message.seq, {
+        sendStatus: 1,
+        id: message.friendMessage?.id || message.chatroomMessage?.id,
+      });
+    }
   },
   CmdSendMessageResult: message => {
-    console.log("发送消息结果", message);
-    // 在这里添加具体的处理逻辑
+    updateMessage(message.friendMessageId, {
+      sendStatus: 0,
+    });
   },
   // 接收消息响应
   CmdReceiveMessageResp: message => {