feat(admin): 整合财务模块导航为侧边栏子菜单与顶部联动Tab

- 侧边栏收敛：将散落在运营分组下的销售毛利、商品与成本、钱包管理、收支明细整合入「财务」二级子菜单，并支持智能展开与角色权限隔离 - 顶部导航联动：新增 FinanceSubNav 通用组件，在销售毛利、商品与成本中心、钱包管理、收支明细 4 个页面顶部统一提供一键切换 Tab - 语义规范化：将原“财务”流水页面标题明确为“收支明细”，消除模块与页面的命名歧义 - 验证方式：npm run check 全量检查通过（Prettier、ESLint、tsc、单测 100% 通过），构建产物已同步至运行容器并验证路由与交互
2026-10-25 20:39:11 +08:00
parent eaffae4af0
commit dfc01db4ae
10 changed files with 203 additions and 75 deletions
@@ -0,0 +1,93 @@
+import {
+  AccountBookOutlined,
+  ApartmentOutlined,
+  LineChartOutlined,
+  WalletOutlined,
+} from '@ant-design/icons'
+import { Tabs } from 'antd'
+import type { TabsProps } from 'antd'
+import { useLocation, useNavigate } from 'react-router'
+import { getAdminRole } from '@/utils/admin-auth'
+
+export const FINANCE_NAV_ITEMS = [
+  {
+    key: '/admin/sales-profit',
+    label: '销售毛利',
+    icon: <LineChartOutlined />,
+  },
+  {
+    key: '/admin/cost-center',
+    label: '商品与成本中心',
+    icon: <ApartmentOutlined />,
+  },
+  {
+    key: '/admin/fund',
+    label: '钱包管理',
+    icon: <WalletOutlined />,
+  },
+  {
+    key: '/admin/finance',
+    label: '收支明细',
+    icon: <AccountBookOutlined />,
+  },
+] as const
+
+type FinanceNavKey = (typeof FINANCE_NAV_ITEMS)[number]['key']
+
+type FinanceSubNavProps = {
+  current?: FinanceNavKey
+}
+
+export default function FinanceSubNav({ current }: FinanceSubNavProps) {
+  const location = useLocation()
+  const navigate = useNavigate()
+  const role = getAdminRole()
+
+  // 客服角色无完整财务权限，不展示财务联动 Tab
+  if (role === 'support') {
+    return null
+  }
+
+  const activeKey =
+    current ||
+    FINANCE_NAV_ITEMS.find((item) => location.pathname.startsWith(item.key))?.key ||
+    '/admin/sales-profit'
+
+  const tabItems: TabsProps['items'] = FINANCE_NAV_ITEMS.map((item) => ({
+    key: item.key,
+    label: (
+      <span
+        style={{
+          display: 'inline-flex',
+          alignItems: 'center',
+          gap: 6,
+          fontSize: 15,
+          fontWeight: 500,
+        }}
+      >
+        {item.icon}
+        {item.label}
+      </span>
+    ),
+  }))
+
+  return (
+    <div
+      className="finance-sub-nav-wrapper"
+      style={{
+        background: '#fff',
+        padding: '6px 16px 0',
+        borderRadius: 8,
+        border: '1px solid #f0f0f0',
+        marginBottom: 4,
+      }}
+    >
+      <Tabs
+        activeKey={activeKey}
+        onChange={(key) => navigate(key)}
+        items={tabItems}
+        style={{ marginBottom: -1 }}
+      />
+    </div>
+  )
+}