diff --git a/src/views/im/home/components/ToolBar.vue b/src/views/im/home/components/ToolBar.vue
index 122b66e8a..2ef5e24a7 100644
--- a/src/views/im/home/components/ToolBar.vue
+++ b/src/views/im/home/components/ToolBar.vue
@@ -3,7 +3,9 @@
ToolBar:IM 左侧工具栏
布局:顶部头像 → 中间三 Tab(消息/好友/群聊)→ 底部设置
-->
-
+
-
-
+
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
@@ -64,6 +64,7 @@ import Icon from '@/components/Icon/src/Icon.vue'
import { useUserStore } from '@/store/modules/user'
import { useConversationStore } from '../store/conversationStore'
import { useFriendStore } from '../store/friendStore'
+import { useImUiStore } from '../store/uiStore'
import UserAvatar from './user/UserAvatar.vue'
defineOptions({ name: 'ImToolBar' })
@@ -73,21 +74,25 @@ const router = useRouter()
const userStore = useUserStore()
const conversationStore = useConversationStore()
const friendStore = useFriendStore()
+const uiStore = useImUiStore()
const totalUnread = computed(() => conversationStore.getTotalUnread) // 消息 Tab 的红点:所有非免打扰会话的未读总和
const unhandledRequestCount = computed(() => friendStore.getUnhandledRequestCount) // 通讯录 Tab 的红点:未处理好友申请数(接收方=我)
const tabs = [
- { name: 'ImHomeConversation', label: '消息', icon: 'ep:chat-round' },
- { name: 'ImHomeContact', label: '通讯录', icon: 'mingcute:contacts-line' }
+ { name: 'ImHomeConversation', icon: 'ep:chat-round' },
+ { name: 'ImHomeContact', icon: 'mingcute:contacts-line' }
] // 两个主 Tab;用路由 name 而非 path,避免前缀 / 嵌套调整后失效
/** 当前路由是否命中 Tab:直接比对 route.name */
const isActive = (name: string) => route.name === name
-/** 切换 Tab:当前 Tab 已选中时跳过,避免无意义的导航 */
+/** 切换 Tab:当前已选中时,消息 Tab 触发"滚动到下一个未读"(对齐微信 PC),其它 Tab 无动作 */
const goTab = (name: string) => {
if (route.name === name) {
+ if (name === 'ImHomeConversation') {
+ uiStore.requestNextUnreadJump()
+ }
return
}
router.push({ name })
diff --git a/src/views/im/home/pages/conversation/components/conversation/ConversationItem.vue b/src/views/im/home/pages/conversation/components/conversation/ConversationItem.vue
index 17db6420c..3c95dc3e6 100644
--- a/src/views/im/home/pages/conversation/components/conversation/ConversationItem.vue
+++ b/src/views/im/home/pages/conversation/components/conversation/ConversationItem.vue
@@ -2,10 +2,11 @@
-
+
+
{{ conversation.unreadCount > 99 ? '99+' : conversation.unreadCount }}
+
+
diff --git a/src/views/im/home/pages/conversation/index.vue b/src/views/im/home/pages/conversation/index.vue
index 9c867d3a5..9819069ff 100644
--- a/src/views/im/home/pages/conversation/index.vue
+++ b/src/views/im/home/pages/conversation/index.vue
@@ -96,10 +96,11 @@
diff --git a/src/views/im/home/store/uiStore.ts b/src/views/im/home/store/uiStore.ts
index 509f9060c..1e4be9707 100644
--- a/src/views/im/home/store/uiStore.ts
+++ b/src/views/im/home/store/uiStore.ts
@@ -1,5 +1,5 @@
import { defineStore, acceptHMRUpdate } from 'pinia'
-import { reactive } from 'vue'
+import { reactive, ref } from 'vue'
import { ImFriendAddSource } from '../../utils/constants'
import type { GroupLite, User } from '../types'
@@ -116,6 +116,17 @@ export const useImUiStore = defineStore('imUiStore', () => {
contextMenu.onSelect = null
}
+ // ==================== 消息 Tab 跳转下一未读 ====================
+ // 在 ImHomeConversation 页面再次点击工具栏「消息」时触发;
+ // 通过递增 nonce 让 conversation/index.vue 的 watch 感知后执行滚动 + 高亮
+
+ const nextUnreadJumpNonce = ref(0)
+
+ /** 请求滚动到下一个未读会话(含免打扰) */
+ function requestNextUnreadJump() {
+ nextUnreadJumpNonce.value++
+ }
+
return {
userInfoCard,
openUserInfoCard,
@@ -128,7 +139,10 @@ export const useImUiStore = defineStore('imUiStore', () => {
contextMenu,
openContextMenu,
- closeContextMenu
+ closeContextMenu,
+
+ nextUnreadJumpNonce,
+ requestNextUnreadJump
}
})