feat: 调试单聊完成

src/pages/chat/chat-input/index.vue

@@ -194,7 +194,6 @@ const handleClickOutside = (event) => {
 
   if (!isChatInputCompEl) {
     showTool.value = false
-    console.log(inputRef.value.$el.blur, 'inputValue.valueblur')
     inputRef.value.$el.blur()
   }
 };
@@ -251,6 +250,8 @@ onMounted(() => {
     box-sizing: border-box;
     justify-content: center;
     align-content: center;
+    justify-items: center;
+    align-items: center;
   }
 }
 

src/pages/chat/chat-message/index.vue

@@ -41,6 +41,7 @@ import TextMessage from "~/pages/chat/chat-message/text-message/index.vue";
 import ImageMessage from "~/pages/chat/chat-message/image-message/index.vue";
 import AudioMessage from "~/pages/chat/chat-message/audio-message/index.vue";
 import LinkMessage from "~/pages/chat/chat-message/link-message/index.vue";
+import {findHyperlinks} from "~/pages/chat/chat-message/link-message/handle";
 
 const userInfoStore = useUserInfoStore();
 const {userInfo} = storeToRefs(userInfoStore);
@@ -55,11 +56,9 @@ const props = defineProps({
 const msg = computed(() => {
   try {
     const {createTime, getUserId, sendUserId, messageContent, messageType} = props.message
-    console.log(messageType, 'props.message')
-    console.log(sendUserId, userInfo?.value, 'userInfouserInfouserInfo', sendUserId === userInfo?.value.pass)
     return {
       messageContent: messageContent,
-      type: getMessageType(messageType),
+      type: getMessageType(messageType, messageContent),
       viewType: sendUserId === userInfo?.value.pass ? 0 : 1,
       createTime: createTime,
       showName: props.message?.showName
@@ -69,8 +68,9 @@ const msg = computed(() => {
     return null
   }
 })
-const getMessageType = (messageType) => {
+const getMessageType = (messageType, messageContent) => {
   const types = ['text', 'image', 'audio', 'video', 'link']
+  if(messageType === 0 && findHyperlinks(messageContent)) return types[4]
   return types[messageType]
 }
 </script>

src/pages/chat/single.vue

@@ -19,6 +19,7 @@
       </template>
     </van-nav-bar>
     <template v-if="showPage">
+
       <van-list
           ref="chatListRef"
           class="flex-1 overflow-y-auto px-12 flex flex-col"
@@ -32,10 +33,11 @@
           {{ followStatus }}在对方关注或回复前，最多只能发送1条信息
         </div>
       </van-list>
-<!--      <van-pull-refresh v-model="refreshing" @refresh="loadMore">-->
-<!--        -->
-<!--      </van-pull-refresh>-->
-      <ChatInput :operates="['image']" @focus="scrollToBottom" @send="handleSendMessage"></ChatInput>
+<!--  <van-pull-refresh v-model="refreshing" @refresh="loadMore" class="flex-1">
+      </van-pull-refresh>-->
+<!--      <div class="fixed bottom-0 left-0 right-0 w-full">-->
+        <ChatInput :operates="['image']" @focus="scrollToBottom" @send="handleSendMessage"></ChatInput>
+<!--      </div>-->
     </template>
     <template v-else>
       <div class="flex-1 grid place-items-center text-black-9">
@@ -111,7 +113,7 @@ const getChatList = async (type = 'init') => {
     })
     pageNum.value = page;
     await handleResponse(res);
-    currConversationChatList.value = handleChatList(res.data?.dataList)
+    currConversationChatList.value = handleChatList(res.data?.data)
     console.log(currConversationChatList.value, 'currConversationChatList')
     if (type === 'init') await scrollToBottom()
     await getFollowStatus()
@@ -145,6 +147,7 @@ const sendTextMessage = async (text) => {
     const isLink = !!findHyperlinks(text)
     if (isLink) msg.messageType = 4;
     currConversationChatList.value.push(msg)
+    await scrollToBottom()
     const res = await chatsStore.sendSocketMessage(msg)
     console.log('luck:', res)
   } catch (e) {
@@ -179,6 +182,7 @@ const sendImageMessage = async (file) => {
       }
     }
    currConversationChatList.value.push(msg)
+    await scrollToBottom()
    await chatsStore.sendSocketMessage(msg)
   } catch (e) {
     console.error(e, '??')
@@ -201,7 +205,7 @@ const handleSendMessage = async ({type, messageContent}) => {
 
         break;
     }
-    await scrollToBottom()
+
   } catch (e) {
 
   } finally {
@@ -210,12 +214,14 @@ const handleSendMessage = async ({type, messageContent}) => {
 }
 
 const scrollToBottom = async () => {
-  await nextTick(); // 确保DOM已经更新
-  const listElement = chatListRef.value?.$el;
-  if (listElement) {
-    const scrollContainer = listElement;
-    scrollContainer.scrollTop = scrollContainer.scrollHeight;
-  }
+ setTimeout(async () => {
+   await nextTick(); // 确保DOM已经更新
+   const listElement = chatListRef.value?.$el;
+   if (listElement) {
+     const scrollContainer = listElement;
+     scrollContainer.scrollTop = scrollContainer.scrollHeight;
+   }
+ }, 200)
 };
 
 // 获取我与对方的关注情况
@@ -258,10 +264,11 @@ function getLocalId() {
 onMounted(() => {
   initGroupId()
   XYWebSocket.SocketEventsBus.on(XYWebSocket.SocketEvents.chatEvent, async (chat) => {
-    console.log('XYWebSocket', chat)
-    if (chat.groupId && chat.groupId === groupId.value) {
-     // await getChatList()
+    const isCurrGroupId = chat.groupId && chat.groupId === groupId.value;
+    const isOtherUserMessage = chat.sendUserId && chatsStore.isRealMessage(chat.sendUserId)
+    if (isCurrGroupId && isOtherUserMessage) {
       currConversationChatList.value.push(chat)
+      await scrollToBottom()
     }
   })
 })

src/pages/profile/my-news/index.vue

@@ -136,7 +136,7 @@
               <p class="line-clamp-1 h-20 text-sm text-black-6 leading-3xl">
                 {{
                   chatList[1]?.lastMessage
-                    ? messageShowName(chatList[1]?.lastMessage?.messageContent)
+                    ? messageContentParse(chatList[1]?.lastMessage?.messageContent)
                     : ''
                 }}
               </p>
@@ -442,10 +442,12 @@ const onSelect = (action) => {
   if (action.text === '添加用户') onChatPage('/chat/user-add', {})
 }
 
+
 const goDetails = (type, item) => {
   console.log(type, item, 'itemitem')
   switch (type) {
     case 'single': // 单聊消息
+      readMessage(item.groupId)
       navigateTo({
         path: '/chat/single', query: {
           getUserId: item?.toUserId,
@@ -459,6 +461,16 @@ const goDetails = (type, item) => {
   }
 }
 
+const readMessage = async (groupId) => {
+  const res = await request('/website/tourMessage/updateRead', {
+    query: {
+      groupId: groupId
+    }
+  })
+  await handleResponse(res, false)
+  await chatsStore.getChatList()
+}
+
 // 消息的内容转换
 function messageShowName(messageContent) {
   try {

src/stores/useChats.js

@@ -1,6 +1,9 @@
 import {XYWebSocket} from "~/utils/XYWebSocket";
 
 export const useChatsStore = defineStore('chats', () => {
+  const userInfoStore = useUserInfoStore();
+  const {userInfo} = storeToRefs(userInfoStore);
+
   let socket = null;
   const initWebSocket = (url) => {
     if (!socket) {
@@ -40,6 +43,10 @@ export const useChatsStore = defineStore('chats', () => {
     return await request('/website/tourMessage/getMessageByGroupId', {query})
   }
 
+  const isRealMessage = (sendUserId) => {
+    return sendUserId !== userInfo.value.pass
+  }
+
 
   // 会话列表
   let chatList = ref([]);
@@ -96,5 +103,8 @@ export const useChatsStore = defineStore('chats', () => {
     chatListLoading,
     getChatList,
 
+
+    isRealMessage
+
   }
 })

src/utils/XYWebSocket.ts

@@ -59,9 +59,9 @@ export namespace XYWebSocket {
                 /**
                  * 2、 服务端主动发起消息
                  */
-                if (!web_request_id) {
+                // if (!web_request_id) {
                     SocketEventsBus.emit(SocketEvents.chatEvent, messagePackage)
-                }
+                // }
             } catch (e) {
 
             }