/** * 自定义 tabBar 组件 * * 微信 custom-tab-bar 机制:tabBar 页面由框架自动挂载; * 非 tabBar 页面(如 board-customer/board-coach)可手动引用。 * * 支持 2/3 按钮动态布局,权限数据由外部注入(当前 mock 为 3 按钮)。 */ /** tab 路由映射(key → url + 是否为 tabBar 页面) */ const TAB_ROUTES: Record = { task: { url: '/pages/task-list/task-list', isTabBarPage: true }, board: { url: '/pages/board-finance/board-finance', isTabBarPage: true }, my: { url: '/pages/my-profile/my-profile', isTabBarPage: true }, } // TODO: 联调时从全局状态/接口获取权限,过滤可见 tab // 示例:const visibleKeys = getApp().globalData.visibleTabs || ['task', 'board', 'my'] const VISIBLE_KEYS = ['task', 'board', 'my'] /** 根据权限过滤后的 tab 列表 */ const TABS = [ { key: 'task', label: '任务', icon: '/assets/icons/tab-task-nav.svg', activeIcon: '/assets/icons/tab-task-nav-active.svg' }, { key: 'board', label: '看板', icon: '/assets/icons/tab-board-nav.svg', activeIcon: '/assets/icons/tab-board-nav-active.svg' }, { key: 'my', label: '我的', icon: '/assets/icons/tab-my-nav.svg', activeIcon: '/assets/icons/tab-my-nav-active.svg' }, ].filter((t) => VISIBLE_KEYS.includes(t.key)) Component({ properties: { /** 当前激活的 tab key */ active: { type: String, value: '', }, }, data: { tabs: TABS, tabCount: TABS.length, }, methods: { onTap(e: WechatMiniprogram.TouchEvent) { const key = e.currentTarget.dataset.key as string // 通过 properties 获取 active,避免 this.data 类型推断问题 if (key === (this as unknown as { data: { active: string } }).data.active) return const route = TAB_ROUTES[key] if (!route) return if (route.isTabBarPage) { wx.switchTab({ url: route.url }) } else { wx.navigateTo({ url: route.url }) } }, }, })