feat:tabbar

src/sheep/components/crud/crud-layout/crud-layout.vue

@@ -93,6 +93,10 @@ function initBackStyle() {
 function tabbarChange(index: number) {
 	const target = tabbarStore.tabbarList[index]
 	if (!target) return
+	if (target.pagePath === "/pages/root/dashboard") {
+		// 从业务导航返回工作台时，让首页根 Tabbar 同步选中“首页”。
+		tabbarStore.setRootActiveIndex(0)
+	}
 	jump(target.pagePath, {}, 3)
 }
 

src/sheep/stores/tabbar.ts

@@ -118,16 +118,62 @@ const TABBAR_CONSTANT: Array<TabbarItem> = [
 		launchParam: ["integrated"],
 		auth: ["user"],
 	},
+	{
+		pagePath: "/pages/integrated/notice/index",
+		text: "通知公告",
+		iconPath: "/static/tabbar/notice.png",
+		selectedIconPath: "/static/tabbar/notice-select.png",
+		launchParam: ["notice"],
+		auth: ["user"],
+	},
+	{
+		pagePath: "/pages/integrated/feedback/index",
+		text: "意见反馈",
+		iconPath: "/static/tabbar/feedback.png",
+		selectedIconPath: "/static/tabbar/feedback-select.png",
+		launchParam: ["feedback"],
+		auth: ["user"],
+	},
 	{
 		pagePath: "/pages/tabbar/my",
 		text: "我的",
 		iconPath: "/static/tabbar/my.png",
 		selectedIconPath: "/static/tabbar/my-select.png",
-		launchParam: ["canteen", "selfMerchant", "onlineShop", "coopMerchant", "integrated", "prosperityShop", "prosperityShopMchList"],
+		launchParam: [
+			"canteen",
+			"selfMerchant",
+			"onlineShop",
+			"coopMerchant",
+			"integrated",
+			"prosperityShop",
+			"prosperityShopMchList",
+			"notice",
+			"feedback",
+		],
 		auth: ["user", "merchant", "doorAdmin"],
 	},
 ]
 
+const WORKBENCH_TABBAR_ITEM: TabbarItem = {
+	pagePath: "/pages/root/dashboard",
+	text: "工作台",
+	iconPath: "/static/tabbar/home.png",
+	selectedIconPath: "/static/tabbar/home-select.png",
+	launchParam: [],
+	auth: [],
+}
+
+function getTabbarLaunchParam(url?: string) {
+	const launchParam = getLaunchParam(url)
+	if (launchParam) return launchParam
+	if (!url) return ""
+
+	// 常用功能也可能直接配置 Tabbar 页面路径，需要由页面反推出所属业务场景。
+	const pagePath = url.split("?")[0]
+	const tabbarItem = TABBAR_CONSTANT.find((item) => item.pagePath === pagePath)
+	return tabbarItem?.launchParam[0] || ""
+}
+
 const defaultRootTabbarList: Array<TabbarItem> = [
 	{
 		pagePath: "/pages/root/dashboard",
@@ -166,13 +212,17 @@ export const useTabbarStore = defineStore("tabbarStore", {
 	}),
 	getters: {
 		isDashboardPage(state) {
-			return `/${state.currentRoute}` === "/pages/root/dashboard" || `/${state.currentRoute}` === "/pages/tabbar/my"
+			const currentRoute = state.currentRoute.startsWith("/") ? state.currentRoute : `/${state.currentRoute}`
+			return currentRoute === "/pages/root/dashboard" || currentRoute === "/pages/tabbar/my"
 		},
 		isTabbar(state) {
-			return state.tabbarList.some((item) => item.pagePath === `/${state.currentRoute}`)
+			const currentRoute = state.currentRoute.startsWith("/") ? state.currentRoute : `/${state.currentRoute}`
+			// 工作台只作为业务 Tabbar 的返回入口，进入页面后仍展示首页自己的根 Tabbar。
+			return currentRoute !== WORKBENCH_TABBAR_ITEM.pagePath && state.tabbarList.some((item) => item.pagePath === currentRoute)
 		},
 		activeIndex(state) {
-			return state.tabbarList.findIndex((item) => item.pagePath === `/${state.currentRoute}`)
+			const currentRoute = state.currentRoute.startsWith("/") ? state.currentRoute : `/${state.currentRoute}`
+			return state.tabbarList.findIndex((item) => item.pagePath === currentRoute)
 		},
 		pageTabbarList(state) {
 			return state.tabbarList.map((item) => {
@@ -196,22 +246,25 @@ export const useTabbarStore = defineStore("tabbarStore", {
 	},
 	actions: {
 		async componetTabbarList(launchParam?: string) {
-			let _launchParam = ""
-			if (launchParam) {
-				_launchParam = getLaunchParam(launchParam)
-			} else {
-				_launchParam = getLaunchParam()
-			}
-			if (this.launchParam === _launchParam) return
+			const _launchParam = getTabbarLaunchParam(launchParam)
+			const hasMyTabbar = this.tabbarList.some((item) => item.pagePath === "/pages/tabbar/my")
+			const hasWorkbenchTabbar = this.tabbarList.some((item) => item.pagePath === WORKBENCH_TABBAR_ITEM.pagePath)
+			// 热更新或旧状态中可能已有相同场景但尚未加入工作台，此时仍需重新组装。
+			if (this.launchParam === _launchParam && (!hasMyTabbar || hasWorkbenchTabbar)) return
 			const appInfo = await getAppInfo()
 			if (!_launchParam || !appInfo) return
 			const tabbarList: Array<TabbarItem> = []
-			TABBAR_CONSTANT.forEach((item, index) => {
+			TABBAR_CONSTANT.forEach((item) => {
 				const visible = item.launchParam.includes(_launchParam)
 				if (visible) {
 					tabbarList.push(item)
 				}
 			})
+			const myTabbarIndex = tabbarList.findIndex((item) => item.pagePath === "/pages/tabbar/my")
+			if (myTabbarIndex !== -1) {
+				// 仅对带“我的”的业务导航生效，并保证“工作台”紧邻其左侧。
+				tabbarList.splice(myTabbarIndex, 0, WORKBENCH_TABBAR_ITEM)
+			}
 			this.tabbarList = tabbarList
 			this.launchParam = _launchParam
 		},