axios 封装
1
import Axios from "axios";
当前权限管理流程
  1. 默认初始化所有路由数据，并未添加路由表
  2. 通过后台数据筛选路路由添加路由表
  3. 其实还好菜单信息完全配置在后台只维护映射，前端添加
    后端同时添加映射信息（麻烦点）
1
2
3
4
5
6
7
8
9
10
11
12
graph LR

初始化==>sToken{是否有token}
sToken-->|无| 跳转登录页面
sToken-->|有| sRouter{是否有权限路由}
sRouter-->|有| 正常路由跳转
sRouter-->|无| rRouter{请求路由}

rRouter-->|失败| 报错
rRouter-->|成功| fRouter[筛选路由]
fRouter--> rsRouter[重组路由收据]
rsRouter--> 正常跳转
框架权限管理流程
配置路由本身有角色信息
1
2
3
4
5
6
7
8
9
10
11
graph LR

初始化==>sToken{是否有token}
sToken-->|无| 跳转登录页面
sToken-->|有| sRouter{是否路由存在}
sRouter-->|有| 正常路由跳转
sRouter-->|无| userInfo{请求用户信息}
userInfo-->|失败| 抛出异常
userInfo--> fRouter[筛选路由]
fRouter--> rsRouter[重组路由收据]
rsRouter--> 正常跳转
新路由想法（参考网络）
  1. 前端添加数据结构，后端维护相应简单的数据结构
  2. 页面中转
vue.config.js
  • 复写
    • 清除已有数据
  • 修改
暂定
  1. 入口
  2. 配置
  3. 路由
  4. api
  5. 权限
  6. utils
  7. 请求
  8. 鉴权
  9. 异常上报
  10. 按需引入
可视化
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
graph LR

start[初始化]-->mountC[加载组件]
start-->mountS[初始化状态]
start-->mountP[加载缓存]
mountC-->begin[开始]
mountS-->begin[开始]
mountP-->begin[开始]
begin-->view[初始化界面]
view-->addDrag[添加拖动]

drag[拖动]-->drop[放置]
drop-->over[添加over事件]
over-->clone[克隆组件]
clone-->key[添加唯一key]
over--> 显示边框
点击-->attr[根据唯一key切换状态]
attr-->store[调整更改store]
store-->界面变化
save-->prev[保存状态]
prev-->reload[重新加载状态]