u

code/link56/link56-frontend-new/src/views/im/components/GroupChatWindows.vue

@@ -7,6 +7,7 @@ import { useScrollWatcher } from '@/hooks/useScrollWatcher'
 import { queryGroupMessageApi, queryGroupUserApi } from '@/request/api/im'
 import { useUserStore } from '@/store/user'
 import { useWebSocket } from '@/store/websocket'
+import { MessageType } from '@/types/im'
 import { formatImTime } from '@/utils/time'
 import { generateUUID } from '@/utils/uuid'
 
@@ -22,6 +23,40 @@ onMounted(() => {
 
   websocket.onMessage(async (msg) => {
     const { from, type, data } = msg
+
+    if (type === MessageType.GROUP) {
+      // 自己发的
+      if (userId === data.senderId) {
+        messages.value.forEach((item) => {
+          if (item._tempId === data.tempId) {
+            item._status = 'sent'
+            item._tempId = ''
+            item.id = data.id
+          }
+        })
+      }
+      else {
+        if (props.group.groupId === from) {
+          const newData: ImGroupMessage = {
+            id: data.id,
+            groupId: data.groupId,
+            senderId: data.senderId,
+            senderName: data.senderName,
+            senderAvatar: data.senderAvatar,
+            content: data.content,
+            type: data.type,
+            sendTime: data.sendTime,
+          }
+
+          messages.value.push(newData)
+          // 更新未读数量，交给外部
+
+          // 等待 DOM 更新再滚动到底部
+          await nextTick()
+          scrollToLatestMessage()
+        }
+      }
+    }
   })
 })
 
@@ -52,6 +87,7 @@ watch(
       pagination.value = { pageSize: 10, loading: false, hasMore: true }
       loadMessages('down')
 
+      groupUsers.value = []
       loadGroupUsers()
     }
   },
@@ -106,8 +142,6 @@ async function loadMessages(direction = 'down') {
 
   pagination.value.loading = true
 
-  const userId = userStore.user.id
-
   let beforeTimestamp: number | null = null
   let beforeId: number | null = null
 
@@ -197,39 +231,44 @@ async function sendMessage() {
     ElMessage.warning('发送消息不能为空')
   }
 
-  // const userId = userStore.user.id
-  // const _tempId = generateUUID()
+  const userId = userStore.user.id
+  const groupId = props.group.groupId
+  const _tempId = generateUUID()
 
-  // const localMessage: ImPrivateMessage = {
-  //   id: -Date.now(),
-  //   senderId: userId,
-  //   receiverId: props.friend.friendId,
-  //   content,
-  //   type: 0,
-  //   sendTime: Date.now(),
-  //   _tempId,
-  //   _status: 'sending',
-  // }
+  const localMessage: ImGroupMessage = {
+    id: -Date.now(),
+    groupId,
+    senderId: userId,
+    senderAvatar: userStore.user.avatar,
+    senderName: userStore.user.name,
+    content,
+    type: 0,
+    sendTime: Date.now(),
+    _tempId,
+    _status: 'sending',
+  }
 
-  // messages.value.push(localMessage)
+  messages.value.push(localMessage)
 
-  // // 清空输入框
-  // if (chatInputRef.value) {
-  //   chatInputRef.value.innerHTML = ''
-  // }
+  // 清空输入框
+  if (chatInputRef.value) {
+    chatInputRef.value.innerHTML = ''
+  }
 
-  // const privateData: any = {
-  //   content,
-  //   type: 0,
-  //   tempId: _tempId,
-  // }
+  const sentData: any = {
+    content,
+    type: 0,
+    tempId: _tempId,
+    senderAvatar: userStore.user.avatar,
+    senderName: userStore.user.name,
+  }
 
-  // websocket.sendPrivate(props.friend.friendId, privateData)
+  websocket.sendGroup(groupId, sentData)
 
-  // chatInputValue.value = ''
-  // // 等待 DOM 更新再滚动到底部
-  // await nextTick()
-  // scrollToLatestMessage()
+  chatInputValue.value = ''
+  // 等待 DOM 更新再滚动到底部
+  await nextTick()
+  scrollToLatestMessage()
 }
 </script>