Просмотр исходного кода

1.规范化发送与接收的消息体 2.识别同门店的消息,让其显示在同侧

shizhongqi 11 месяцев назад
Родитель
Сommit
f31902f86f
2 измененных файлов с 34 добавлено и 34 удалено
  1. 22 21
      hdApp/src/admin/chat/chatPage.vue
  2. 12 13
      mallApp/src/pages/chat/chatPage.vue

+ 22 - 21
hdApp/src/admin/chat/chatPage.vue

@@ -607,7 +607,7 @@ export default {
       }
     },
 
-    // 处理WebSocket消息
+    // 处理 WebSocket 消息
     handleWebSocketMessage(data) {
       console.log('---------- data: ', data);
       try {
@@ -627,22 +627,23 @@ export default {
           }
         }
 
-        // 检查是否是自己发送的消息,避免重复显示
-        //  const isMyMessage = messageData.username === this.currentUser.username && messageData.userId === this.currentUser.id;
-        // 如果是自己发送的消息,不重复添加(因为发送时已经添加了)
-        //   if (isMyMessage) {
-        //     console.log("忽略自己发送的消息回显");
-        //     return;
-        //   }
+        let isMine = false;
+        // 检查是否是本店但是他人发送的消息
+        const messageShopId = parseInt(messageData.shopId);
+        const currentShopId = parseInt(this.currentUser.shopId);
+        const isShopMessage = messageShopId === currentShopId && messageShopId > 0;
+        if (isShopMessage) {
+          isMine = true;
+        }
 
         // 创建消息对象
         const newMessage = {
-          id: 'msg_' + Date.now() + '_' + Math.random(),
+          id: 'msg_receive_' + Math.floor(Date.now() / 1000) + '_' + Math.floor(Math.random() * 100000) + 1,
+          isMine: isMine, // 标记是否是本店发送的消息
           message: messageData.message || messageData || '',
-          time: this.getCurrentTime(),
-          isMine: false, // 既然不是自己的消息,就标记为false
           username: messageData.name || messageData.username || '未知用户',
-          avatar: messageData.avatar || this.$constant.imgUrl + '/retail/default-img.png'
+          avatar: messageData.avatar || this.$constant.imgUrl + '/retail/default-img.png',
+          time: this.getCurrentTime(),
         };
 
         console.log('收到 ---------- newMessage: ', newMessage);
@@ -673,24 +674,24 @@ export default {
       }
 
       const messageContent = this.inputText.trim();
+      const avatar = this.currentUser.avatar || this.$constant.imgUrl + '/retail/default-img.png';
+      const timestamp = Math.floor(Date.now() / 1000);
 
       try {
         // 立即在本地显示发送的消息(右侧)
         const myMessage = {
-          id: 'msg_' + Date.now() + '_local',
-          message: messageContent,
-          time: this.getCurrentTime(),
+          id: 'msg_local_' + timestamp + '_' + Math.floor(Math.random() * 100000) + 1,
           isMine: true,
+          message: messageContent,
           username: this.currentUser.username,
-          avatar: this.currentUser.avatar
+          avatar: avatar,
+          time: this.getCurrentTime(),
         };
 
         // 添加到消息列表
         this.messageList.push(myMessage);
-
         // 清空输入框
         this.inputText = '';
-
         // 滚动到底部
         this.$nextTick(() => {
           this.scrollToBottom(); // 用户操作时使用动画
@@ -701,9 +702,9 @@ export default {
           receiver: this.currentUser.customId,
           message: messageContent,
           username: this.currentUser.username,
-          shopId: this.currentUser.shopId, // 门店使用shopId,客户使用customId
-          avatar: this.currentUser.avatar,
-          timestamp: Date.now()
+          avatar: avatar,
+          shopId: this.currentUser.shopId, // 发送者:门店使用shopId,客户使用customId
+          timestamp: timestamp
         };
 
         const json = JSON.stringify(messageData);

+ 12 - 13
mallApp/src/pages/chat/chatPage.vue

@@ -664,7 +664,7 @@ export default {
           }
         }
         // 检查是否是自己发送的消息,避免重复显示
-        // const isMyMessage = messageData.username === this.currentUser.username && messageData.userId === this.currentUser.id;
+        // const isMyMessage =  messageData.customId === this.currentUser.customId;
         // 如果是自己发送的消息,不重复添加(因为发送时已经添加了)
         // if (isMyMessage) {
         //   console.log("忽略自己发送的消息回显");
@@ -673,7 +673,7 @@ export default {
 
         // 创建消息对象
         const newMessage = {
-          id: "msg_" + Date.now() + "_" + Math.random(),
+          id: "msg_receive_" + Math.floor(Date.now() / 1000) + "_" + Math.floor(Math.random() * 100000) + 1,
           message: messageData.message || messageData || "",
           time: this.getCurrentTime(),
           isMine: false, // 既然不是自己的消息,就标记为false
@@ -711,24 +711,24 @@ export default {
       }
 
       const messageContent = this.inputText.trim();
+      const avatar = this.currentUser.avatar || this.$constant.imgUrl + '/retail/default-img.png';
+      const timestamp = Math.floor(Date.now() / 1000);
 
       try {
         // 立即在本地显示发送的消息(右侧)
         const myMessage = {
-          id: "msg_" + Date.now() + "_local",
-          message: messageContent,
-          time: this.getCurrentTime(),
+          id: "msg_local_" + timestamp + '_' + Math.floor(Math.random() * 100000) + 1,
           isMine: true,
+          message: messageContent,
           username: this.currentUser.username,
-          avatar: this.currentUser.avatar,
+          avatar: avatar,
+          time: this.getCurrentTime(),
         };
 
         // 添加到消息列表
         this.messageList.push(myMessage);
-
         // 清空输入框
         this.inputText = "";
-
         // 滚动到底部
         this.$nextTick(() => {
           this.scrollToBottom(); // 用户操作时使用动画
@@ -739,9 +739,9 @@ export default {
           receiver: this.currentUser.shopId,
           message: messageContent,
           username: this.currentUser.username,
-          customId: this.currentUser.customId, // 客户使用customId,门店使用shopId
-          avatar: this.currentUser.avatar,
-          timestamp: Date.now(),
+          avatar: avatar,
+          customId: this.currentUser.customId, // 发送者:客户使用customId (门店使用shopId)
+          timestamp: timestamp
         };
 
         const json = JSON.stringify(messageData);
@@ -785,8 +785,7 @@ export default {
     scrollToBottom(enableAnimation = true) {
       this.scrollWithAnimation = enableAnimation;
       if (this.messageList.length > 0) {
-        this.scrollIntoView =
-          "message-" + this.messageList[this.messageList.length - 1].id;
+        this.scrollIntoView = "message-" + this.messageList[this.messageList.length - 1].id;
       }
     },