From f3602f232daa7478813e58a17044c549249d8e4b Mon Sep 17 00:00:00 2001
From: Timi <imyeyu6@qq.com>
Date: Wed, 2 Sep 2026 12:56:22 +0800
Subject: [PATCH] add ProductTab

---
 src/layout/MainLayout.vue                 |  16 +++-
 src/pages/package/CustomerPackageList.vue |   2 +-
 src/pages/tabs/ProductTab.vue             | 106 ++++++++++++++++++++++
 src/pages/tabs/SettingTab.vue             |  29 ------
 src/pages/tabs/StoreTab.vue               |  99 ++++++++++----------
 src/router/index.ts                       |   2 +-
 src/router/routes/tabRoutes.ts            |  15 +++
 7 files changed, 185 insertions(+), 84 deletions(-)
 create mode 100644 src/pages/tabs/ProductTab.vue

diff --git a/src/layout/MainLayout.vue b/src/layout/MainLayout.vue
index 49c608c..7fd4338 100644
--- a/src/layout/MainLayout.vue
+++ b/src/layout/MainLayout.vue
@@ -28,8 +28,8 @@
 <script setup lang="ts">
 import AppNavBar from "@/components/navbar/index.vue";
 import PageTransition from "@/components/PageTransition.vue";
-import {useTabBarStore} from "@/store/tabBarStore";
-import { permissionCodes } from "@/utils/permission";
+import { useTabBarStore } from "@/store/tabBarStore";
+import { gaoRoleCodes, permissionCodes } from "@/utils/permission";
 import { useUserStore } from "timi-web-api";
 
 const route = useRoute();
@@ -53,6 +53,8 @@ type TabItem = {
 	text: string;
 	permission?: string | string[];
 	permissionMode?: "and" | "or";
+	role?: string | string[];
+	roleMode?: "and" | "or";
 };
 
 const tabVal = ref(route.path);
@@ -63,10 +65,14 @@ const tabList: TabItem[] = [
 		text: "客户",
 		permission: [permissionCodes.customer.create, permissionCodes.eventRecord.create]
 	},
+	{ value: "/product", icon: "layers", text: "产品", role: gaoRoleCodes.storeManager },
 	{ value: "/store", icon: "shop-3", text: "门店", permission: permissionCodes.stat.read },
 	{ value: "/management", icon: "setting-1", text: "管理" }
 ];
-const list = computed(() => tabList.filter(item => !item.permission || userStore.hasPermissions(item.permission, item.permissionMode)));
+const list = computed(() => tabList.filter(item => (
+	(!item.permission || userStore.hasPermissions(item.permission, item.permissionMode))
+	&& (!item.role || userStore.hasRoles(item.role, item.roleMode))
+)));
 
 watch(() => route.path, (newPath: string) => {
 	tabVal.value = resolveTabValue(newPath);
@@ -94,6 +100,10 @@ function resolveTabValue(path: string): string {
 		return "/store";
 	}
 
+	if (path.startsWith("/product")) {
+		return "/product";
+	}
+
 	if (path.startsWith("/management")) {
 		return "/management";
 	}
diff --git a/src/pages/package/CustomerPackageList.vue b/src/pages/package/CustomerPackageList.vue
index 5d459c2..8cd4fff 100644
--- a/src/pages/package/CustomerPackageList.vue
+++ b/src/pages/package/CustomerPackageList.vue
@@ -71,7 +71,7 @@
 								class="line"
 								theme="primary"
 								variant="outline"
-								v-text="getPaymentStatusText(item.paymentStatus)"
+								:content="getPaymentStatusText(item.paymentStatus)"
 							/>
 							<div class="line" v-text="`成交价：${formatPackageAmount(item.saleAmount)}`" />
 						</div>
diff --git a/src/pages/tabs/ProductTab.vue b/src/pages/tabs/ProductTab.vue
new file mode 100644
index 0000000..459288a
--- /dev/null
+++ b/src/pages/tabs/ProductTab.vue
@@ -0,0 +1,106 @@
+<template>
+	<div class="product-tab">
+		<t-notice-bar
+			theme="error"
+			visible
+			content="产品库设计方案及实现未完成，套餐功能仍在测试中，可以试用反馈可改进问题，但不要实际落到业务使用。产品库实现后套餐模块会联动更新，会清除测试的套餐数据"
+		/>
+		<t-cell-group
+			v-for="(group, index) in visibleMenuGroupList"
+			:key="group.title"
+			:title="group.title"
+			theme="card"
+			v-entrance-transition="index * 70"
+		>
+			<t-cell
+				v-for="item in group.items"
+				:key="item.path"
+				class="item"
+				:title="item.title"
+				arrow
+				hover
+				@click="go(item.path)"
+			>
+				<template #leftIcon>
+					<t-icon :name="item.icon" size="1.75rem" />
+				</template>
+			</t-cell>
+		</t-cell-group>
+	</div>
+</template>
+
+<script setup lang="ts">
+import { useUserStore } from "timi-web-api";
+import { permissionCodes } from "@/utils/permission";
+
+type MenuItem = {
+	icon: string;
+	path: string;
+	title: string;
+	visible: boolean;
+};
+
+type MenuGroup = {
+	items: MenuItem[];
+	title: string;
+};
+
+defineOptions({
+	name: "ProductTab"
+});
+
+const router = useRouter();
+const userStore = useUserStore();
+
+const menuGroupList = computed<MenuGroup[]>(() => [
+	{
+		title: "套餐",
+		items: [
+			{
+				icon: "layers",
+				path: "/management/package-configs",
+				title: "套餐配置",
+				visible: userStore.hasPermissions(permissionCodes.packageConfig.read)
+			},
+			{
+				icon: "order-list",
+				path: "/management/customer-packages",
+				title: "客户套餐",
+				visible: userStore.hasPermissions(permissionCodes.customerPackage.read)
+			},
+			{
+				icon: "upload",
+				path: "/management/package-deliveries",
+				title: "发放记录",
+				visible: userStore.hasPermissions(permissionCodes.packageDelivery.read)
+			},
+			{
+				icon: "money",
+				path: "/management/fund-records",
+				title: "资金流水",
+				visible: userStore.hasPermissions(permissionCodes.fundRecord.read)
+			}
+		]
+	}
+]);
+
+const visibleMenuGroupList = computed<MenuGroup[]>(() => menuGroupList.value
+	.map(group => ({
+		...group,
+		items: group.items.filter(item => item.visible)
+	}))
+	.filter(group => group.items.length));
+
+async function go(path: string): Promise<void> {
+	await router.push(path);
+}
+</script>
+
+<style scoped lang="less">
+.product-tab {
+	gap: .5rem;
+	display: flex;
+	padding: calc(var(--app-nav-height)) 0 6rem;
+	flex-direction: column;
+}
+</style>
diff --git a/src/pages/tabs/SettingTab.vue b/src/pages/tabs/SettingTab.vue
index 3cc02da..a3b8a36 100644
--- a/src/pages/tabs/SettingTab.vue
+++ b/src/pages/tabs/SettingTab.vue
@@ -196,35 +196,6 @@ const menuGroupList = computed<MenuGroup[]>(() => [
 			}
 		]
 	},
-	{
-		title: "套餐",
-		items: [
-			{
-				icon: "layers",
-				path: "/management/package-configs",
-				title: "套餐配置",
-				visible: userStore.hasPermissions(permissionCodes.packageConfig.read)
-			},
-			{
-				icon: "order-list",
-				path: "/management/customer-packages",
-				title: "客户套餐",
-				visible: userStore.hasPermissions(permissionCodes.customerPackage.read)
-			},
-			{
-				icon: "upload",
-				path: "/management/package-deliveries",
-				title: "发放记录",
-				visible: userStore.hasPermissions(permissionCodes.packageDelivery.read)
-			},
-			{
-				icon: "money",
-				path: "/management/fund-records",
-				title: "资金流水",
-				visible: userStore.hasPermissions(permissionCodes.fundRecord.read)
-			}
-		]
-	},
 	{
 		title: "系统",
 		items: [
diff --git a/src/pages/tabs/StoreTab.vue b/src/pages/tabs/StoreTab.vue
index 104f76d..51f2cef 100644
--- a/src/pages/tabs/StoreTab.vue
+++ b/src/pages/tabs/StoreTab.vue
@@ -1,53 +1,53 @@
 <template>
 	<div class="store-tab">
-			<section v-entrance-transition v-if="canViewStore || canManageStore" class="store-header">
-				<t-cell-group class="store-card" theme="card">
-					<t-cell
-						v-if="canViewStore"
-						class="info"
-						:title="currentStoreStore.currentStoreName"
-						:description="currentStore?.address"
-					/>
-					<t-cell
-						v-if="canSelectStore"
-						class="action"
-						title="切换门店"
-						note="选择使用门店"
-						arrow
-						hover
-						@click="openStorePicker"
-					>
-						<template #leftIcon>
-							<t-icon name="swap" />
-						</template>
-					</t-cell>
-					<t-cell
-						v-if="canManageStore"
-						class="action"
-						title="门店管理"
-						note="管理门店资料和营业日"
-						arrow
-						hover
-						@click="goStoreManagement"
-					>
-						<template #leftIcon>
-							<t-icon name="shop-3" />
-						</template>
-					</t-cell>
-					<t-cell
-						v-if="canManageStoreDiary"
-						class="action"
-						title="门店日记"
-						note="记录门店经营和护理过程"
-						arrow
-						hover
-						@click="goStoreDiaryManagement"
-					>
-						<template #leftIcon>
-							<t-icon name="file" />
-						</template>
-					</t-cell>
-				</t-cell-group>
+		<section v-entrance-transition v-if="canViewStore || canManageStore" class="store-header">
+			<t-cell-group class="store-card" theme="card">
+				<t-cell
+					v-if="canViewStore"
+					class="info"
+					:title="currentStoreStore.currentStoreName"
+					:description="currentStore?.address"
+				/>
+				<t-cell
+					v-if="canSelectStore"
+					class="action"
+					title="切换门店"
+					note="选择使用门店"
+					arrow
+					hover
+					@click="openStorePicker"
+				>
+					<template #leftIcon>
+						<t-icon name="swap" />
+					</template>
+				</t-cell>
+				<t-cell
+					v-if="canManageStore"
+					class="action"
+					title="门店管理"
+					note="管理门店资料和营业日"
+					arrow
+					hover
+					@click="goStoreManagement"
+				>
+					<template #leftIcon>
+						<t-icon name="shop-3" />
+					</template>
+				</t-cell>
+				<t-cell
+					v-if="canManageStoreDiary"
+					class="action"
+					title="门店日记"
+					note="记录门店经营和护理过程"
+					arrow
+					hover
+					@click="goStoreDiaryManagement"
+				>
+					<template #leftIcon>
+						<t-icon name="file" />
+					</template>
+				</t-cell>
+			</t-cell-group>
 		</section>
 		<store-data-charts :key="`${currentStoreStore.currentStoreId}-${chartRefreshKey}`" />
 		<t-popup v-model="storePickerVisible" placement="bottom">
@@ -93,8 +93,7 @@ const canManageStore = computed(() => userStore.hasRoles([
 	gaoRoleCodes.storeManager
 ], "or") && userStore.hasPermissions(permissionCodes.store.read));
 const canManageStoreDiary = computed(() => userStore.hasRoles(gaoRoleCodes.storeManager)
-	&& !userStore.hasRoles(gaoRoleCodes.globalManager)
-	&& userStore.hasPermissions(permissionCodes.storeDiary.read));
+	&& userStore.hasPermissions(permissionCodes.storeDiary.create));
 
 // ---------- 门店切换 ----------
 
diff --git a/src/router/index.ts b/src/router/index.ts
index c16bf21..a2f4b20 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -129,7 +129,7 @@ async function resolveStoreAccessRedirect(to: RouteLocationNormalized): Promise<
 	const routeName = String(to.name || "");
 	const storeDiaryRouteNameList = ["StoreDiaryList", "StoreDiaryCreate", "StoreDiaryDetail", "StoreDiaryEdit"];
 	if (storeDiaryRouteNameList.includes(routeName)) {
-		if (!userStore.hasRoles(gaoRoleCodes.storeManager) || userStore.hasRoles(gaoRoleCodes.globalManager)) {
+		if (!userStore.hasRoles(gaoRoleCodes.storeManager)) {
 			return "/management";
 		}
 		const currentStoreStore = useCurrentStoreStore();
diff --git a/src/router/routes/tabRoutes.ts b/src/router/routes/tabRoutes.ts
index a138a99..bd9a2c3 100644
--- a/src/router/routes/tabRoutes.ts
+++ b/src/router/routes/tabRoutes.ts
@@ -1,5 +1,6 @@
 import type { RouteRecordRaw } from "vue-router";
 import HomeTab from "@/pages/tabs/HomeTab.vue";
+import ProductTab from "@/pages/tabs/ProductTab.vue";
 import SettingTab from "@/pages/tabs/SettingTab.vue";
 import StoreTab from "@/pages/tabs/StoreTab.vue";
 
@@ -32,6 +33,20 @@ const tabRoutes: RouteRecordRaw[] = [
 			darkBodyBackground: "#10161f"
 		}
 	},
+	{
+		path: "/product",
+		name: "ProductTab",
+		component: ProductTab,
+		meta: {
+			depth: 2,
+			navBarVisible: true,
+			navBarCanBack: false,
+			navBarTitle: "产品",
+			tabBarVisible: true,
+			bodyBackground: "#F5F5F8",
+			darkBodyBackground: "#10161f"
+		}
+	},
 	{
 		path: "/management",
 		name: "SettingTab",