diff --git a/src/components/rightBox/chatBox/ChatMain.vue b/src/components/rightBox/chatBox/ChatMain.vue index 15e8beda..d21d02dc 100644 --- a/src/components/rightBox/chatBox/ChatMain.vue +++ b/src/components/rightBox/chatBox/ChatMain.vue @@ -549,21 +549,21 @@ const debouncedScrollOperations = useDebounceFn(async (container: HTMLElement) = } }, 16) -// 监听会话切换(仅切换数据,不清空 DOM) +// 监听会话切换(仅处理 UI 相关逻辑) +// 注意:消息数据的重置和加载已经在 global.ts 的 changeRoom() 中统一处理,这里只处理 UI 相关的逻辑 watch( () => globalStore.currentSession!, async (value, oldValue) => { - if (oldValue.roomId !== value.roomId) { + if (oldValue?.roomId !== value?.roomId) { // 使用音频管理器停止所有音频 audioManager.stopAll() - // 重置并刷新当前房间的消息 - await chatStore.resetAndRefreshCurrentRoomMessages() - // 如果不是群聊,清空置顶公告 if (!isGroup.value) { topAnnouncement.value = null } + await nextTick() + // 滚动到底部 scrollToBottom() } } diff --git a/src/hooks/useMessage.ts b/src/hooks/useMessage.ts index ab971779..dee040ec 100644 --- a/src/hooks/useMessage.ts +++ b/src/hooks/useMessage.ts @@ -25,24 +25,18 @@ export const useMessage = () => { }) /** 处理点击选中消息 */ - const handleMsgClick = async (item: SessionItem) => { + const handleMsgClick = (item: SessionItem) => { msgBoxShow.value = true // 更新当前会话信息 globalStore.updateCurrentSessionRoomId(item.roomId) - await chatStore.changeRoom() } /** * 预加载聊天室 * @param roomId */ - const preloadChatRoom = async (roomId: string = '1') => { + const preloadChatRoom = (roomId: string = '1') => { globalStore.updateCurrentSessionRoomId(roomId) - try { - await chatStore.changeRoom() - } catch (error) { - console.error('尝试进入聊天室时出现错误:', error) - } } /** @@ -71,7 +65,10 @@ export const useMessage = () => { // 选择下一个或上一个会话 const nextIndex = Math.min(currentIndex, updatedSessions.length - 1) - handleMsgClick(updatedSessions[nextIndex]) + const nextSession = updatedSessions[nextIndex] + if (nextSession) { + handleMsgClick(nextSession) + } } /** 处理双击事件 */ diff --git a/src/stores/chat.ts b/src/stores/chat.ts index 74bd166d..d612e7ca 100644 --- a/src/stores/chat.ts +++ b/src/stores/chat.ts @@ -137,12 +137,26 @@ export const useChatStore = defineStore( } }) + /** + * 切换聊天室 + * @description + * 当用户切换到不同的聊天室时调用此方法,执行完整的房间切换流程。 + * 该方法会清空旧房间的消息数据,重新加载新房间的消息,并处理相关的状态重置。 + */ const changeRoom = async () => { const currentWindowLabel = WebviewWindow.getCurrent() if (currentWindowLabel.label !== 'home' && currentWindowLabel.label !== 'mobile-home') { return } + const roomId = globalStore.currentSession!.roomId + + // 1. 清空当前房间的旧消息数据 + if (messageMap[roomId]) { + messageMap[roomId] = {} + } + + // 2. 重置消息加载状态 currentMessageOptions.value = { isLast: false, isLoading: false, @@ -158,7 +172,7 @@ export const useChatStore = defineStore( try { // 从服务器加载消息 - await getMsgList(pageSize, true) + await getPageMsg(pageSize, roomId, '') } catch (error) { console.error('无法加载消息:', error) currentMessageOptions.value = { @@ -762,7 +776,12 @@ export const useChatStore = defineStore( } } - // 重置当前聊天室的消息并刷新最新消息 + /** + * 重置并刷新当前聊天室的消息列表 + * @description + * 清空当前聊天室的所有本地消息缓存,并从服务器重新获取最新的消息列表。 + * 主要用于需要强制刷新消息的场景,确保显示的是最新的服务器数据。 + */ const resetAndRefreshCurrentRoomMessages = async () => { if (!globalStore.currentSession!.roomId) return diff --git a/src/stores/global.ts b/src/stores/global.ts index 10d94ee2..ad46fa63 100644 --- a/src/stores/global.ts +++ b/src/stores/global.ts @@ -110,21 +110,30 @@ export const useGlobalStore = defineStore( // 监听当前会话变化,添加防重复触发逻辑 watch(currentSessionRoomId, async (val, oldVal) => { + if (!val || val === oldVal) { + return + } + + try { + await chatStore.changeRoom() + } catch (error) { + console.error('[global] 切换会话时加载消息失败:', error) + } + const webviewWindowLabel = WebviewWindow.getCurrent() if (webviewWindowLabel.label !== 'home' && webviewWindowLabel.label !== '/mobile/message') { return } - // 只有当房间ID真正发生变化时才执行操作 - if (currentSession.value.unreadCount > 0 && (!oldVal || val! !== oldVal)) { + + const session = chatStore.getSession(val) + if (session?.unreadCount) { info(`[global]当前会话发生实际变化: ${oldVal} -> ${val}`) // 清理已读数查询队列 clearQueue() // 延攱1秒后开始查询已读数 setTimeout(readCountQueue, 1000) - // 标记该房间的消息为已读 - markMsgRead(val! || '1') - // 更新会话的已读状态 - chatStore.markSessionRead(val! || '1') + markMsgRead(val) + chatStore.markSessionRead(val) } })