conversationStore.getTotalUnread)
/**
- * 三个主 Tab 的配置,路径对应 /im/home/{conversation,friend,group}
- * icon 走通用 组件,支持 ep: / svg-icon: 前缀
- * 群聊用项目自带的 svg-icon:peoples(双人剪影)一眼区分单人 / 群体
+ * 三个主 Tab 的配置,name 对应路由 ImHomeConversation/Friend/Group
+ * 用 name 而非 path:path 后期容易变(前缀调整、嵌套加层),name 更稳定
+ * icon 走通用 组件,支持 iconify 全部前缀(ep: / ant-design: / svg-icon: 等)
+ * 群聊用 ant-design:team(三人组合):ep 没有"群体"图标,三人剪影跟 ep:user(单人)一眼区分单人 / 群体
*/
-// TODO @AI:改成 name 更合适把?
-// TODO @AI: 其他地方,是不是也能减少 path?主要 path 容易变!
const tabs = [
- { path: '/im/home/conversation', label: '消息', icon: 'ep:chat-dot-round' },
- { path: '/im/home/friend', label: '好友', icon: 'ep:user' },
- { path: '/im/home/group', label: '群聊', icon: 'svg-icon:peoples' } // TODO @AI:这个图标不是很好,看看怎么优化下;ep 里,有 group 概念的图标么?
+ { name: 'ImHomeConversation', label: '消息', icon: 'ep:chat-dot-round' },
+ { name: 'ImHomeFriend', label: '好友', icon: 'ep:user' },
+ { name: 'ImHomeGroup', label: '群聊', icon: 'ant-design:team' }
]
-/** 当前路由是否命中 Tab:完全匹配或 Tab 路径是当前路径前缀均算命中 */
-const isActive = (path: string) => route.path === path || route.path.startsWith(path + '/')
-
-// TODO @AI:方法注释
-const goTab = (path: string) => {
- if (route.path === path) {
- return
- }
- router.push(path)
-}
-
-// TODO @AI:改成 name 更合适把?
-const goProfile = () => router.push('/user/profile')
+/** 当前路由是否命中 Tab:直接比对 route.name */
+const isActive = (name: string) => route.name === name
const avatar = computed(() => userStore.getUser?.avatar || '')
@@ -111,6 +87,17 @@ const nicknameShort = computed(() => {
const name = userStore.getUser?.nickname || ''
return name ? name.slice(-1) : '我'
})
+
+/** 切换 Tab:当前 Tab 已选中时跳过,避免无意义的导航 */
+const goTab = (name: string) => {
+ if (route.name === name) {
+ return
+ }
+ router.push({ name })
+}
+
+/** 跳转个人中心(路由 name=Profile) */
+const goProfile = () => router.push({ name: 'Profile' })