1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
| import type { ReactNode } from 'react';
| import {
| ApartmentOutlined,
| AppstoreOutlined,
| ContactsOutlined,
| DashboardOutlined,
| ProfileOutlined,
| SafetyCertificateOutlined,
| SafetyOutlined,
| TeamOutlined,
| UnorderedListOutlined,
| } from '@ant-design/icons';
| import Orders from '@/pages/business/orders';
| import CustomerList from '@/pages/customers/list';
| import Dashboard from '@/pages/dashboard';
| import Departments from '@/pages/system/departments';
| import Roles from '@/pages/system/roles';
| import Users from '@/pages/system/users';
|
| export interface AppRouteItem {
| /** 完整路径，同时作为菜单 key */
| path: string;
| title: string;
| icon?: ReactNode;
| /** 页面组件。仅作为分组的路由可以不传 */
| element?: ReactNode;
| hideInMenu?: boolean;
| children?: AppRouteItem[];
| }
|
| /**
| * 路由 / 菜单唯一数据源。
| * 新增页面时在这里配置即可，侧边栏、面包屑会自动生效。
| */
| export const appRoutes: AppRouteItem[] = [
| {
| path: '/dashboard',
| title: '工作台',
| icon: <DashboardOutlined />,
| element: <Dashboard />,
| },
| {
| path: '/customers',
| title: '客户管理',
| icon: <ContactsOutlined />,
| children: [
| {
| path: '/customers/list',
| title: '客户列表',
| icon: <UnorderedListOutlined />,
| element: <CustomerList />,
| },
| ],
| },
| {
| path: '/system',
| title: '用户与权限',
| icon: <SafetyCertificateOutlined />,
| children: [
| {
| path: '/system/users',
| title: '用户管理',
| icon: <TeamOutlined />,
| element: <Users />,
| },
| {
| path: '/system/roles',
| title: '角色管理',
| icon: <SafetyOutlined />,
| element: <Roles />,
| },
| {
| path: '/system/departments',
| title: '部门管理',
| icon: <ApartmentOutlined />,
| element: <Departments />,
| },
| ],
| },
| {
| path: '/business',
| title: '业务管理',
| icon: <AppstoreOutlined />,
| children: [
| {
| path: '/business/orders',
| title: '订单管理',
| icon: <ProfileOutlined />,
| element: <Orders />,
| },
| ],
| },
| ];
|
| /** 从路由树中找到某个路径的完整面包屑链路。 */
| export const findBreadcrumb = (
| pathname: string,
| routes: AppRouteItem[] = appRoutes,
| parent: AppRouteItem[] = [],
| ): AppRouteItem[] | null => {
| for (const route of routes) {
| const trail = [...parent, route];
| if (route.path === pathname) return trail;
| if (route.children) {
| const result = findBreadcrumb(pathname, route.children, trail);
| if (result) return result;
| }
| }
| return null;
| };
|
| /** 找到分组下第一个可访问的页面路径。 */
| export const findFirstPath = (item: AppRouteItem): string | null => {
| if (item.children?.length) {
| for (const child of item.children) {
| if (child.hideInMenu) continue;
| const target = findFirstPath(child);
| if (target) return target;
| }
| return null;
| }
|
| return item.path;
| };
|
|
