160 lines
4.1 KiB
Markdown
160 lines
4.1 KiB
Markdown
|
# 综述
|
|||
|
|
|
|||
|
|
目前菜单鉴权由套餐管理提供，由租户购买套餐->分发授权到角色，个人的权限是角色授权与套餐包授权的交集。
|
|||
|
|
|
|||
|
|
本脚本方案依赖 `appList` ， `navList` 和 `menuList` 三个模块生成完整的路由和菜单管理。
|
|||
|
|
|
|||
|
|
- `appList` 负责管理功能模块与下属的页面列表
|
|||
|
|
- `navList` 负责管理由 `appName` 组合成的复合菜单
|
|||
|
|
- `menuList` 负责使用 `appName` 和 `navName` 组合完整的菜单列表，控制菜单排序
|
|||
|
|
|
|||
|
|
最终生成 **禁止手动修改生成产物！**
|
|||
|
|
|
|||
|
|
- scripts/package/sql/sys_app.sql // 提供给后端做应用权限管理
|
|||
|
|
- scripts/package/sql/sys_function.sql // 提供给后端做应用权限管理
|
|||
|
|
- src/i18n/pages/route/zh-cn.ts // 路由i18n信息
|
|||
|
|
- src/i18n/pages/route/en.ts // 路由i18n信息
|
|||
|
|
- src/router/modules.ts // 作为前端路由集合
|
|||
|
|
- src/router/menus.ts // 作为前端菜单集合
|
|||
|
|
- src/router/powers.ts // 作为授权树集合
|
|||
|
|
|
|||
|
|
### appList
|
|||
|
|
|
|||
|
|
- 描述
|
|||
|
|
应用程序列表
|
|||
|
|
|
|||
|
|
- 数据结构
|
|||
|
|
数组
|
|||
|
|
|
|||
|
|
- 属性说明
|
|||
|
|
|
|||
|
|
```ts
|
|||
|
|
interface AppItem {
|
|||
|
|
name: string; // 应用程序名称
|
|||
|
|
zhCn: string; // 应用程序中文名称
|
|||
|
|
en: string; // 应用程序英文名称
|
|||
|
|
functions?: string[]; // 额外功能点列表（可能不存在）
|
|||
|
|
pages?: PageItem[]; // 应用程序页面列表（可能不存在）
|
|||
|
|
}
|
|||
|
|
interface PageItem {
|
|||
|
|
name: string; // 应用程序名称
|
|||
|
|
zhCn: string; // 应用程序中文名称
|
|||
|
|
en: string; // 应用程序英文名称
|
|||
|
|
path: string; // 路由地址
|
|||
|
|
component: () => Promise<typeof import('**/*.vue')>; // 组件地址 路径为src下的有效路径
|
|||
|
|
meta: {
|
|||
|
|
icon: string; // 页面图标
|
|||
|
|
parentName?: PageItem['name']; // 页面父节点名称（可能不存在）
|
|||
|
|
isDev: boolean; // 页面开发中忽略授权信息
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
- 示例数据
|
|||
|
|
|
|||
|
|
```typescript
|
|||
|
|
[
|
|||
|
|
{
|
|||
|
|
name: 'task',
|
|||
|
|
zhCn: '任务中心',
|
|||
|
|
en: 'Task Center',
|
|||
|
|
functions: ['shutdown'],
|
|||
|
|
pages: [
|
|||
|
|
{
|
|||
|
|
name: 'taskPending',
|
|||
|
|
zhCn: '待办任务',
|
|||
|
|
en: 'Pending Task',
|
|||
|
|
path: '/task/pending',
|
|||
|
|
component: '/@/views/flow/task/pending.vue',
|
|||
|
|
meta: {
|
|||
|
|
icon: 'fa fa-flag-checkered',
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: 'taskStarted',
|
|||
|
|
zhCn: '发起任务',
|
|||
|
|
en: 'Started Task',
|
|||
|
|
path: '/task/started',
|
|||
|
|
component: '/@/views/flow/task/started.vue',
|
|||
|
|
meta: {
|
|||
|
|
icon: 'fa fa-plane',
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
},
|
|||
|
|
];
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
如上述示例 functions 的值为['shutdown'] 那么它最终生成的功能点为: task_view、task_add、task_edit、task_del、task_shutdown.
|
|||
|
|
|
|||
|
|
```typescript
|
|||
|
|
{
|
|||
|
|
name: 'meiyun_packageSample',
|
|||
|
|
zhCn: '包装样品',
|
|||
|
|
en: 'Package Samples',
|
|||
|
|
},
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
如上述示例 appList 的值可以没有 pages，那么它仅仅产生功能点，而不产生对应路由
|
|||
|
|
|
|||
|
|
### menuList
|
|||
|
|
|
|||
|
|
- 描述
|
|||
|
|
用于针对 appList 来进行路由组装的菜单列表
|
|||
|
|
|
|||
|
|
- 数据结构
|
|||
|
|
数组
|
|||
|
|
|
|||
|
|
- 属性说明
|
|||
|
|
appName: 必须包含，appList 的节点 name
|
|||
|
|
subApps: 可能包含，子应用列表，作用与 appName 相同
|
|||
|
|
- 作用
|
|||
|
|
把所有的 pages 的路由都包含进来
|
|||
|
|
如果 pages 里的路由 meta 包含了 parentName，则不会产生 menu
|
|||
|
|
- 示例数据
|
|||
|
|
|
|||
|
|
```typescript
|
|||
|
|
[
|
|||
|
|
{
|
|||
|
|
appName: 'meiyun_product',
|
|||
|
|
subApps: [
|
|||
|
|
'meiyun_formula',
|
|||
|
|
'meiyun_formulaMakeupDemo',
|
|||
|
|
'meiyun_formulaComparison',
|
|||
|
|
'meiyun_sampleTesting',
|
|||
|
|
'meiyun_packMaterialProofing',
|
|||
|
|
'meiyun_material',
|
|||
|
|
'meiyun_manufacturer',
|
|||
|
|
'meiyun_supplier',
|
|||
|
|
'meiyun_formulation_review',
|
|||
|
|
'meiyun_packing',
|
|||
|
|
],
|
|||
|
|
},
|
|||
|
|
];
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 开发过程
|
|||
|
|
|
|||
|
|
```flow
|
|||
|
|
start=>start: 开始
|
|||
|
|
cond1=>condition: 是否已存在app(是或否?)
|
|||
|
|
sub1=>operation: 在appList中添加app
|
|||
|
|
cond2=>condition: 是否已存在page(是或否?)
|
|||
|
|
sub2=>operation: 在app中添加page
|
|||
|
|
cond3=>condition: 是否需要添加进navList(是或否?)
|
|||
|
|
sub3=>operation: 在navList中添加app
|
|||
|
|
cond4=>condition: 是否需要添加进menuList(是或否?)
|
|||
|
|
sub4=>operation: 在menuList中添加app或nav
|
|||
|
|
sub5=>operation: 执行scripts/package/build.sh生成相关信息
|
|||
|
|
e=>end: 结束框
|
|||
|
|
start->cond1
|
|||
|
|
cond1(no)->sub1->cond2
|
|||
|
|
cond1(yes)->cond2
|
|||
|
|
cond2(no)->sub2->cond3
|
|||
|
|
cond2(yes)->cond3
|
|||
|
|
cond3(yes)->sub3->cond4
|
|||
|
|
cond3(no)->cond4
|
|||
|
|
cond4(yes)->sub4->sub5
|
|||
|
|
cond4(no)->sub5->e
|
|||
|
|
```
|