946 lines
80 KiB
Markdown
946 lines
80 KiB
Markdown
# HoneyBox 后台管理系统 - 业务流程图
|
||
|
||
## 系统概述
|
||
|
||
后台管理系统(HoneyBox.Admin)是一个基于 ASP.NET Core + Vue3 + Element Plus 的 RBAC 权限管理系统,用于管理 HoneyBox 抽奖盲盒平台的后台运营。
|
||
|
||
---
|
||
|
||
## 一、系统架构总览
|
||
|
||
```
|
||
┌─────────────────────────────────────────────────────────────────────────────┐
|
||
│ HoneyBox 后台管理系统 │
|
||
├─────────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
|
||
│ │ 认证模块 │ │ 用户管理 │ │ 角色管理 │ │ 菜单管理 │ │
|
||
│ │ (Auth) │ │ (AdminUser) │ │ (Role) │ │ (Menu) │ │
|
||
│ └──────┬──────┘ └──────┬──────┘ └──────┬──────┘ └──────┬──────┘ │
|
||
│ │ │ │ │ │
|
||
│ ┌──────┴──────┐ ┌──────┴──────┐ ┌──────┴──────┐ ┌──────┴──────┐ │
|
||
│ │ 部门管理 │ │ 权限管理 │ │ 操作日志 │ │ 个人中心 │ │
|
||
│ │(Department) │ │(Permission) │ │(OperationLog)│ │ (Profile) │ │
|
||
│ └─────────────┘ └─────────────┘ └─────────────┘ └─────────────┘ │
|
||
│ │
|
||
└─────────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
---
|
||
|
||
## 二、用户认证流程
|
||
|
||
### 2.1 登录流程
|
||
|
||
```
|
||
┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐
|
||
│ 用户 │ │ 前端 │ │ 后端 │ │ 数据库 │
|
||
└────┬─────┘ └────┬─────┘ └────┬─────┘ └────┬─────┘
|
||
│ │ │ │
|
||
│ 1. 打开登录页 │ │ │
|
||
│───────────────>│ │ │
|
||
│ │ │ │
|
||
│ │ 2. 请求验证码 │ │
|
||
│ │───────────────>│ │
|
||
│ │ │ 生成验证码 │
|
||
│ │ │ 存入缓存(5min)│
|
||
│ │ 验证码图片 │ │
|
||
│ │<───────────────│ │
|
||
│ 显示验证码 │ │ │
|
||
│<───────────────│ │ │
|
||
│ │ │ │
|
||
│ 3. 输入账号 │ │ │
|
||
│ 密码+验证码│ │ │
|
||
│───────────────>│ │ │
|
||
│ │ 4. 提交登录 │ │
|
||
│ │───────────────>│ │
|
||
│ │ │ 校验验证码 │
|
||
│ │ │ 校验密码 │
|
||
│ │ │ 生成双Token │
|
||
│ │ │───────────────>│ 存储RefreshToken
|
||
│ │ AccessToken │ │
|
||
│ │ RefreshToken │ │
|
||
│ │ UserInfo │<───────────────│
|
||
│ │<───────────────│ │
|
||
│ │ │ │
|
||
│ │ 5. 存储Token │ │
|
||
│ │ 获取用户菜单 │ │
|
||
│ │───────────────>│ │
|
||
│ │ 菜单树 │ │
|
||
│ │<───────────────│ │
|
||
│ │ 生成动态路由 │ │
|
||
│ 跳转首页 │ │ │
|
||
│<───────────────│ │ │
|
||
```
|
||
|
||
|
||
### 2.2 Token 刷新流程
|
||
|
||
```
|
||
┌──────────┐ ┌──────────┐ ┌──────────┐
|
||
│ 前端 │ │ 后端 │ │ 数据库 │
|
||
└────┬─────┘ └────┬─────┘ └────┬─────┘
|
||
│ │ │
|
||
│ API请求 │ │
|
||
│ (AccessToken) │ │
|
||
│───────────────>│ │
|
||
│ │ │
|
||
│ 401 Token过期 │ │
|
||
│<───────────────│ │
|
||
│ │ │
|
||
│ 刷新Token请求 │ │
|
||
│ (RefreshToken)│ │
|
||
│───────────────>│ │
|
||
│ │ 验证Token │
|
||
│ │───────────────>│
|
||
│ │ Token有效 │
|
||
│ │<───────────────│
|
||
│ │ 生成新Token │
|
||
│ │ 更新数据库 │
|
||
│ │───────────────>│
|
||
│ 新AccessToken │ │
|
||
│ 新RefreshToken│ │
|
||
│<───────────────│ │
|
||
│ │ │
|
||
│ 重试原请求 │ │
|
||
│───────────────>│ │
|
||
│ 正常响应 │ │
|
||
│<───────────────│ │
|
||
```
|
||
|
||
### 2.3 登出流程
|
||
|
||
```
|
||
┌──────────┐ ┌──────────┐ ┌──────────┐
|
||
│ 用户 │ │ 前端 │ │ 后端 │
|
||
└────┬─────┘ └────┬─────┘ └────┬─────┘
|
||
│ │ │
|
||
│ 点击退出 │ │
|
||
│───────────────>│ │
|
||
│ │ 调用登出API │
|
||
│ │───────────────>│
|
||
│ │ │ 撤销RefreshToken
|
||
│ │ 成功 │
|
||
│ │<───────────────│
|
||
│ │ │
|
||
│ │ 清除本地Token │
|
||
│ │ 重置路由状态 │
|
||
│ 跳转登录页 │ │
|
||
│<───────────────│ │
|
||
```
|
||
|
||
---
|
||
|
||
## 三、RBAC 权限管理流程
|
||
|
||
### 3.1 权限模型关系
|
||
|
||
```
|
||
┌─────────────────────────────────────────────────────────────────────────────┐
|
||
│ RBAC 权限模型 │
|
||
├─────────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
|
||
│ │ AdminUser│ N:N │ Role │ N:N │ Menu │ │
|
||
│ │ 管理员 │────────>│ 角色 │────────>│ 菜单 │ │
|
||
│ └────┬─────┘ └────┬─────┘ └──────────┘ │
|
||
│ │ │ │
|
||
│ │ N:1 │ N:N │
|
||
│ ▼ ▼ │
|
||
│ ┌──────────┐ ┌──────────┐ │
|
||
│ │Department│ │Permission│ │
|
||
│ │ 部门 │ │ 权限 │ │
|
||
│ └────┬─────┘ └──────────┘ │
|
||
│ │ │
|
||
│ │ N:N │
|
||
│ ▼ │
|
||
│ ┌──────────┐ │
|
||
│ │ Menu │ (部门可分配专属菜单) │
|
||
│ └──────────┘ │
|
||
│ │
|
||
└─────────────────────────────────────────────────────────────────────────────┘
|
||
|
||
权限来源优先级:用户专属菜单 > 角色菜单 > 部门菜单
|
||
```
|
||
|
||
### 3.2 用户菜单获取流程
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 用户菜单权限计算流程 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 获取用户 │ │
|
||
│ │ 基本信息 │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ ┌─────────────┐ ┌─────────────┐ │
|
||
│ │ 用户专属菜单│ │ 用户角色 │ │ 用户部门 │ │
|
||
│ │ (直接分配) │ │ 的菜单权限 │ │ 的菜单权限 │ │
|
||
│ └──────┬──────┘ └──────┬──────┘ └──────┬──────┘ │
|
||
│ │ │ │ │
|
||
│ └───────────────────┼───────────────────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 合并去重 │ │
|
||
│ │ 构建菜单树 │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 返回用户 │ │
|
||
│ │ 可访问菜单 │ │
|
||
│ └─────────────┘ │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
|
||
---
|
||
|
||
## 四、管理员用户管理流程
|
||
|
||
### 4.1 创建管理员流程
|
||
|
||
```
|
||
┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐
|
||
│ 操作员 │ │ 前端 │ │ 后端 │ │ 数据库 │
|
||
└────┬─────┘ └────┬─────┘ └────┬─────┘ └────┬─────┘
|
||
│ │ │ │
|
||
│ 1. 进入用户 │ │ │
|
||
│ 管理页面 │ │ │
|
||
│───────────────>│ │ │
|
||
│ │ 获取用户列表 │ │
|
||
│ │───────────────>│ │
|
||
│ │ │───────────────>│
|
||
│ │ 用户列表 │ │
|
||
│ │<───────────────│<───────────────│
|
||
│ 显示列表 │ │ │
|
||
│<───────────────│ │ │
|
||
│ │ │ │
|
||
│ 2. 点击新增 │ │ │
|
||
│───────────────>│ │ │
|
||
│ 弹出表单 │ │ │
|
||
│<───────────────│ │ │
|
||
│ │ │ │
|
||
│ 3. 填写信息 │ │ │
|
||
│ - 用户名 │ │ │
|
||
│ - 密码 │ │ │
|
||
│ - 真实姓名 │ │ │
|
||
│ - 邮箱/手机 │ │ │
|
||
│ - 部门 │ │ │
|
||
│ - 状态 │ │ │
|
||
│───────────────>│ │ │
|
||
│ │ 4. 提交创建 │ │
|
||
│ │───────────────>│ │
|
||
│ │ │ 检查用户名 │
|
||
│ │ │ 是否重复 │
|
||
│ │ │───────────────>│
|
||
│ │ │ │
|
||
│ │ │ 密码加密 │
|
||
│ │ │ 创建用户 │
|
||
│ │ │───────────────>│
|
||
│ │ 创建成功 │ │
|
||
│ │<───────────────│ │
|
||
│ 刷新列表 │ │ │
|
||
│<───────────────│ │ │
|
||
```
|
||
|
||
### 4.2 分配角色流程
|
||
|
||
```
|
||
┌──────────┐ ┌──────────┐ ┌──────────┐
|
||
│ 操作员 │ │ 前端 │ │ 后端 │
|
||
└────┬─────┘ └────┬─────┘ └────┬─────┘
|
||
│ │ │
|
||
│ 点击分配角色 │ │
|
||
│───────────────>│ │
|
||
│ │ 获取所有角色 │
|
||
│ │───────────────>│
|
||
│ │ 角色列表 │
|
||
│ │<───────────────│
|
||
│ │ │
|
||
│ │ 获取用户已有 │
|
||
│ │ 角色 │
|
||
│ │───────────────>│
|
||
│ │ 已分配角色ID │
|
||
│ │<───────────────│
|
||
│ │ │
|
||
│ 显示角色选择 │ │
|
||
│ (已选中已有) │ │
|
||
│<───────────────│ │
|
||
│ │ │
|
||
│ 勾选/取消角色 │ │
|
||
│───────────────>│ │
|
||
│ │ 提交角色分配 │
|
||
│ │───────────────>│
|
||
│ │ │ 更新用户角色
|
||
│ │ 分配成功 │ 关联表
|
||
│ │<───────────────│
|
||
│ 提示成功 │ │
|
||
│<───────────────│ │
|
||
```
|
||
|
||
|
||
---
|
||
|
||
## 五、角色管理流程
|
||
|
||
### 5.1 角色 CRUD 流程
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 角色管理操作 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 角色列表页面 │ │
|
||
│ │ ┌─────────┬─────────┬─────────┬─────────┬─────────┬─────────┐ │ │
|
||
│ │ │ 角色名称│ 角色编码│ 描述 │ 状态 │ 排序 │ 操作 │ │ │
|
||
│ │ ├─────────┼─────────┼─────────┼─────────┼─────────┼─────────┤ │ │
|
||
│ │ │超级管理员│ admin │ 最高权限│ 启用 │ 1 │编辑|删除│ │ │
|
||
│ │ │运营人员 │ operator│ 运营管理│ 启用 │ 2 │编辑|删除│ │ │
|
||
│ │ │客服人员 │ service │ 客服处理│ 启用 │ 3 │编辑|删除│ │ │
|
||
│ │ └─────────┴─────────┴─────────┴─────────┴─────────┴─────────┘ │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │
|
||
│ 操作流程: │
|
||
│ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ │
|
||
│ │ 新增 │───>│ 填写 │───>│ 保存 │───>│ 刷新 │ │
|
||
│ │ 角色 │ │ 表单 │ │ 数据 │ │ 列表 │ │
|
||
│ └────────┘ └────────┘ └────────┘ └────────┘ │
|
||
│ │
|
||
│ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ │
|
||
│ │ 编辑 │───>│ 加载 │───>│ 修改 │───>│ 保存 │ │
|
||
│ │ 角色 │ │ 数据 │ │ 表单 │ │ 更新 │ │
|
||
│ └────────┘ └────────┘ └────────┘ └────────┘ │
|
||
│ │
|
||
│ ┌────────┐ ┌────────┐ ┌────────┐ │
|
||
│ │ 删除 │───>│ 确认 │───>│ 执行 │ (检查是否有用户使用该角色) │
|
||
│ │ 角色 │ │ 弹窗 │ │ 删除 │ │
|
||
│ └────────┘ └────────┘ └────────┘ │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
### 5.2 角色分配菜单流程
|
||
|
||
```
|
||
┌──────────┐ ┌──────────┐ ┌──────────┐
|
||
│ 操作员 │ │ 前端 │ │ 后端 │
|
||
└────┬─────┘ └────┬─────┘ └────┬─────┘
|
||
│ │ │
|
||
│ 点击分配菜单 │ │
|
||
│───────────────>│ │
|
||
│ │ 获取菜单树 │
|
||
│ │───────────────>│
|
||
│ │ 完整菜单树 │
|
||
│ │<───────────────│
|
||
│ │ │
|
||
│ │ 获取角色已有 │
|
||
│ │ 菜单 │
|
||
│ │───────────────>│
|
||
│ │ 已分配菜单ID │
|
||
│ │<───────────────│
|
||
│ │ │
|
||
│ 显示菜单树 │ │
|
||
│ (勾选已分配) │ │
|
||
│<───────────────│ │
|
||
│ │ │
|
||
│ 勾选菜单节点 │ │
|
||
│ (支持全选/ │ │
|
||
│ 半选状态) │ │
|
||
│───────────────>│ │
|
||
│ │ 提交菜单分配 │
|
||
│ │───────────────>│
|
||
│ │ │ 更新角色菜单
|
||
│ │ 分配成功 │ 关联表
|
||
│ │<───────────────│
|
||
│ 提示成功 │ │
|
||
│<───────────────│ │
|
||
```
|
||
|
||
### 5.3 角色分配权限流程
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 角色权限分配界面 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ 角色:运营人员 │
|
||
│ ┌────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 权限模块 权限项 │ │
|
||
│ ├────────────────────────────────────────────────────────────────┤ │
|
||
│ │ 用户管理 ☑ 查看用户 ☑ 创建用户 ☐ 删除用户 │ │
|
||
│ │ 角色管理 ☑ 查看角色 ☐ 创建角色 ☐ 删除角色 │ │
|
||
│ │ 菜单管理 ☑ 查看菜单 ☐ 创建菜单 ☐ 删除菜单 │ │
|
||
│ │ 部门管理 ☑ 查看部门 ☐ 创建部门 ☐ 删除部门 │ │
|
||
│ │ 日志管理 ☑ 查看日志 ☐ 导出日志 │ │
|
||
│ └────────────────────────────────────────────────────────────────┘ │
|
||
│ │
|
||
│ [保存] [取消] │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
|
||
---
|
||
|
||
## 六、菜单管理流程
|
||
|
||
### 6.1 菜单类型说明
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 菜单类型 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ 类型1: 目录 (Directory) │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 📁 系统管理 │ │
|
||
│ │ ├── 📄 用户管理 │ │
|
||
│ │ ├── 📄 角色管理 │ │
|
||
│ │ └── 📄 菜单管理 │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ - 不对应具体页面,仅作为分组容器 │
|
||
│ - 有 path 但无 component │
|
||
│ │
|
||
│ 类型2: 菜单 (Menu) │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 📄 用户管理 → /system/user → system/user/index │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ - 对应具体页面 │
|
||
│ - 有 path 和 component │
|
||
│ │
|
||
│ 类型3: 按钮 (Button) │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 🔘 新增用户 → permission: "system:user:create" │ │
|
||
│ │ 🔘 删除用户 → permission: "system:user:delete" │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ - 不显示在菜单中 │
|
||
│ - 用于按钮级权限控制 │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
### 6.2 菜单树结构示例
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 后台菜单树结构 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ 📊 控制台 (Dashboard) │
|
||
│ └── 📄 首页 (/dashboard) │
|
||
│ │
|
||
│ 📁 系统管理 (/system) │
|
||
│ ├── 📄 用户管理 (/system/user) │
|
||
│ │ ├── 🔘 新增用户 (system:user:create) │
|
||
│ │ ├── 🔘 编辑用户 (system:user:update) │
|
||
│ │ ├── 🔘 删除用户 (system:user:delete) │
|
||
│ │ ├── 🔘 分配角色 (system:user:assign-role) │
|
||
│ │ └── 🔘 重置密码 (system:user:reset-password) │
|
||
│ │ │
|
||
│ ├── 📄 角色管理 (/system/role) │
|
||
│ │ ├── 🔘 新增角色 (system:role:create) │
|
||
│ │ ├── 🔘 编辑角色 (system:role:update) │
|
||
│ │ ├── 🔘 删除角色 (system:role:delete) │
|
||
│ │ └── 🔘 分配菜单 (system:role:assign-menu) │
|
||
│ │ │
|
||
│ ├── 📄 菜单管理 (/system/menu) │
|
||
│ │ ├── 🔘 新增菜单 (system:menu:create) │
|
||
│ │ ├── 🔘 编辑菜单 (system:menu:update) │
|
||
│ │ └── 🔘 删除菜单 (system:menu:delete) │
|
||
│ │ │
|
||
│ ├── 📄 部门管理 (/system/department) │
|
||
│ │ ├── 🔘 新增部门 (system:department:create) │
|
||
│ │ ├── 🔘 编辑部门 (system:department:update) │
|
||
│ │ └── 🔘 删除部门 (system:department:delete) │
|
||
│ │ │
|
||
│ ├── 📄 权限管理 (/system/permission) │
|
||
│ │ │
|
||
│ └── 📄 操作日志 (/system/log) │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
|
||
---
|
||
|
||
## 七、部门管理流程
|
||
|
||
### 7.1 部门树结构
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 部门组织架构 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ 🏢 总公司 (HQ) │
|
||
│ │ │
|
||
│ ├── 🏬 运营部 (OPS) │
|
||
│ │ ├── 👥 运营一组 │
|
||
│ │ └── 👥 运营二组 │
|
||
│ │ │
|
||
│ ├── 🏬 技术部 (TECH) │
|
||
│ │ ├── 👥 前端组 │
|
||
│ │ ├── 👥 后端组 │
|
||
│ │ └── 👥 测试组 │
|
||
│ │ │
|
||
│ ├── 🏬 客服部 (CS) │
|
||
│ │ ├── 👥 售前客服 │
|
||
│ │ └── 👥 售后客服 │
|
||
│ │ │
|
||
│ └── 🏬 财务部 (FIN) │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
### 7.2 部门与菜单关联
|
||
|
||
```
|
||
┌──────────┐ ┌──────────┐ ┌──────────┐
|
||
│ 操作员 │ │ 前端 │ │ 后端 │
|
||
└────┬─────┘ └────┬─────┘ └────┬─────┘
|
||
│ │ │
|
||
│ 选择部门 │ │
|
||
│ 点击分配菜单 │ │
|
||
│───────────────>│ │
|
||
│ │ 获取菜单树 │
|
||
│ │───────────────>│
|
||
│ │ 菜单树 │
|
||
│ │<───────────────│
|
||
│ │ │
|
||
│ │ 获取部门已有 │
|
||
│ │ 菜单 │
|
||
│ │───────────────>│
|
||
│ │ 已分配菜单ID │
|
||
│ │<───────────────│
|
||
│ │ │
|
||
│ 显示菜单树 │ │
|
||
│ 勾选部门菜单 │ │
|
||
│<───────────────│ │
|
||
│ │ │
|
||
│ 保存分配 │ │
|
||
│───────────────>│ │
|
||
│ │ 提交分配 │
|
||
│ │───────────────>│
|
||
│ │ 成功 │
|
||
│ │<───────────────│
|
||
│ 提示成功 │ │
|
||
│<───────────────│ │
|
||
|
||
说明:部门菜单是该部门下所有用户的基础菜单权限
|
||
```
|
||
|
||
---
|
||
|
||
## 八、操作日志流程
|
||
|
||
### 8.1 日志记录流程
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 操作日志记录机制 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌─────────────┐ │
|
||
│ │ API 请求 │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ ┌─────────────────────────────────────────┐ │
|
||
│ │ 权限过滤器 │────>│ [OperationLog] 特性标记的接口 │ │
|
||
│ └──────┬──────┘ └─────────────────────────────────────────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 执行业务 │ │
|
||
│ │ 逻辑 │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 日志过滤器 │ 记录: │
|
||
│ │ (After) │ - 用户ID/用户名 │
|
||
│ │ │ - 模块名称 │
|
||
│ │ │ - 操作类型 │
|
||
│ │ │ - 请求方法/URL │
|
||
│ │ │ - 请求参数 │
|
||
│ │ │ - IP地址 │
|
||
│ │ │ - UserAgent │
|
||
│ │ │ - 执行时长 │
|
||
│ │ │ - 执行状态 │
|
||
│ │ │ - 错误信息(如有) │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 异步写入 │ │
|
||
│ │ 数据库 │ │
|
||
│ └─────────────┘ │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
|
||
### 8.2 日志查询界面
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 操作日志查询 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ 筛选条件: │
|
||
│ ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐ │
|
||
│ │ 关键词搜索 │ │ 模块筛选 │ │ 开始日期 │ │ 结束日期 │ [查询] │
|
||
│ └────────────┘ └────────────┘ └────────────┘ └────────────┘ │
|
||
│ │
|
||
│ ┌────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 操作人 │ 模块 │ 操作 │ 方法 │ URL │ 状态 │ 时间 │ │
|
||
│ ├────────┼────────┼────────┼──────┼────────────┼──────┼─────────┤ │
|
||
│ │ admin │用户管理│创建用户│ POST │/admin/users│ 成功 │10:30:25 │ │
|
||
│ │ admin │角色管理│分配菜单│ PUT │/admin/roles│ 成功 │10:28:15 │ │
|
||
│ │ ops01 │用户管理│重置密码│ PUT │/admin/users│ 成功 │10:25:00 │ │
|
||
│ │ admin │登录认证│用户登录│ POST │/admin/login│ 成功 │10:20:30 │ │
|
||
│ └────────┴────────┴────────┴──────┴────────────┴──────┴─────────┘ │
|
||
│ │
|
||
│ < 1 2 3 4 5 ... 10 > │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
---
|
||
|
||
## 九、前端动态路由生成流程
|
||
|
||
### 9.1 路由生成流程
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 前端动态路由生成 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 用户登录 │ │
|
||
│ │ 成功 │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 调用 │ GET /admin/menus/user │
|
||
│ │ getUserMenus│ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 后端返回 │ 返回用户可访问的菜单树 │
|
||
│ │ 菜单树 │ (合并角色+部门+用户专属菜单) │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 遍历菜单树 │ 跳过 menuType=3 (按钮) │
|
||
│ │ 生成路由 │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 路由转换规则: │ │
|
||
│ │ │ │
|
||
│ │ 菜单数据 路由配置 │ │
|
||
│ │ ───────── ───────── │ │
|
||
│ │ parentId: 0 component: Layout │ │
|
||
│ │ path: "/system" → path: "/system" │ │
|
||
│ │ name: "系统管理" meta: { title: "系统管理" } │ │
|
||
│ │ │ │
|
||
│ │ parentId: 1 component: () => import(...) │ │
|
||
│ │ path: "user" → path: "user" │ │
|
||
│ │ component: "system/user" meta: { title: "用户管理" } │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ router. │ 动态添加路由 │
|
||
│ │ addRoute() │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 添加 404 │ 兜底路由 │
|
||
│ │ 路由 │ path: '/:pathMatch(.*)*' │
|
||
│ └─────────────┘ │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
|
||
---
|
||
|
||
## 十、权限控制流程
|
||
|
||
### 10.1 后端 API 权限控制
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 后端权限控制流程 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌─────────────┐ │
|
||
│ │ API 请求 │ │
|
||
│ │ (带Token) │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ JWT 认证 │ 验证 Token 有效性 │
|
||
│ │ 中间件 │ 解析用户信息 │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ ┌─────────────────────────────────────────┐ │
|
||
│ │ 权限过滤器 │────>│ [AdminPermission("system:user:create")]│ │
|
||
│ │ │ │ 检查用户是否拥有该权限 │ │
|
||
│ └──────┬──────┘ └─────────────────────────────────────────┘ │
|
||
│ │ │
|
||
│ │ 有权限 │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 执行业务 │ │
|
||
│ │ Controller │ │
|
||
│ └──────┬──────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────┐ │
|
||
│ │ 返回结果 │ │
|
||
│ └─────────────┘ │
|
||
│ │
|
||
│ 无权限时: │
|
||
│ ┌─────────────┐ │
|
||
│ │ 返回 403 │ { code: 403, message: "无权限访问" } │
|
||
│ │ Forbidden │ │
|
||
│ └─────────────┘ │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
### 10.2 前端按钮权限控制
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 前端按钮权限控制 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ 方式1: v-permission 指令 │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ <el-button v-permission="'system:user:create'">新增用户</el-button>│ │
|
||
│ │ │ │
|
||
│ │ // 指令实现 │ │
|
||
│ │ if (!userPermissions.includes(permission)) { │ │
|
||
│ │ el.parentNode?.removeChild(el) // 移除元素 │ │
|
||
│ │ } │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │
|
||
│ 方式2: hasPermission 函数 │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ <el-button v-if="hasPermission('system:user:delete')"> │ │
|
||
│ │ 删除用户 │ │
|
||
│ │ </el-button> │ │
|
||
│ │ │ │
|
||
│ │ // 函数实现 │ │
|
||
│ │ const hasPermission = (permission: string) => { │ │
|
||
│ │ return userStore.permissions.includes(permission) │ │
|
||
│ │ } │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │
|
||
│ 权限数据来源: │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 登录响应 → userInfo.permissions → ['system:user:create', ...] │ │
|
||
│ │ 存储到 userStore.permissions │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
---
|
||
|
||
## 十一、完整业务操作示例
|
||
|
||
### 11.1 新增运营人员完整流程
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────┐
|
||
│ 新增运营人员完整操作流程 │
|
||
├──────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ 步骤1: 创建角色 (如果不存在) │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 系统管理 → 角色管理 → 新增 │ │
|
||
│ │ - 角色名称: 运营人员 │ │
|
||
│ │ - 角色编码: operator │ │
|
||
│ │ - 状态: 启用 │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ 步骤2: 为角色分配菜单权限 │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 角色列表 → 运营人员 → 分配菜单 │ │
|
||
│ │ 勾选: ☑ 控制台 ☑ 用户管理(查看) ☑ 订单管理 ☑ 商品管理 │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ 步骤3: 创建管理员账号 │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 系统管理 → 用户管理 → 新增 │ │
|
||
│ │ - 用户名: ops001 │ │
|
||
│ │ - 密码: ******** │ │
|
||
│ │ - 真实姓名: 张三 │ │
|
||
│ │ - 部门: 运营部 │ │
|
||
│ │ - 状态: 启用 │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ 步骤4: 为用户分配角色 │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 用户列表 → ops001 → 分配角色 │ │
|
||
│ │ 勾选: ☑ 运营人员 │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ 步骤5: 用户登录验证 │
|
||
│ ┌─────────────────────────────────────────────────────────────────┐ │
|
||
│ │ ops001 登录后只能看到: │ │
|
||
│ │ - 控制台 │ │
|
||
│ │ - 用户管理 (仅查看) │ │
|
||
│ │ - 订单管理 │ │
|
||
│ │ - 商品管理 │ │
|
||
│ └─────────────────────────────────────────────────────────────────┘ │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
|
||
---
|
||
|
||
## 十二、系统数据流总览
|
||
|
||
```
|
||
┌──────────────────────────────────────────────────────────────────────────────────────┐
|
||
│ HoneyBox Admin 数据流总览 │
|
||
├──────────────────────────────────────────────────────────────────────────────────────┤
|
||
│ │
|
||
│ ┌─────────────────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 前端 (Vue3 + Element Plus) │ │
|
||
│ │ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │ │
|
||
│ │ │ Views │ │ Store │ │ Router │ │ API │ │ Utils │ │ │
|
||
│ │ │ 页面 │ │ 状态 │ │ 路由 │ │ 接口 │ │ 工具 │ │ │
|
||
│ │ └────┬─────┘ └────┬─────┘ └────┬─────┘ └────┬─────┘ └────┬─────┘ │ │
|
||
│ │ │ │ │ │ │ │ │
|
||
│ │ └─────────────┴─────────────┴──────┬──────┴─────────────┘ │ │
|
||
│ └──────────────────────────────────────────┼──────────────────────────────────┘ │
|
||
│ │ │
|
||
│ │ HTTP/HTTPS │
|
||
│ │ (JWT Bearer) │
|
||
│ ▼ │
|
||
│ ┌─────────────────────────────────────────────────────────────────────────────┐ │
|
||
│ │ 后端 (ASP.NET Core) │ │
|
||
│ │ │ │
|
||
│ │ ┌──────────────────────────────────────────────────────────────────────┐ │ │
|
||
│ │ │ Controllers 层 │ │ │
|
||
│ │ │ AuthController │ AdminUserController │ RoleController │ ... │ │ │
|
||
│ │ └────────────────────────────────────────────────────────────────┬─────┘ │ │
|
||
│ │ │ │ │
|
||
│ │ ┌──────────────────────────────────────────────────────────────────────┐ │ │
|
||
│ │ │ Filters 层 │ │ │
|
||
│ │ │ AdminAuthFilter │ AdminPermissionAttribute │ OperationLogAttribute│ │ │
|
||
│ │ └────────────────────────────────────────────────────────────────┬─────┘ │ │
|
||
│ │ │ │ │
|
||
│ │ ┌──────────────────────────────────────────────────────────────────────┐ │ │
|
||
│ │ │ Services 层 │ │ │
|
||
│ │ │ AuthService │ AdminUserService │ RoleService │ MenuService │ ...│ │ │
|
||
│ │ └────────────────────────────────────────────────────────────────┬─────┘ │ │
|
||
│ │ │ │ │
|
||
│ │ ┌──────────────────────────────────────────────────────────────────────┐ │ │
|
||
│ │ │ Data 层 │ │ │
|
||
│ │ │ AdminDbContext (EF Core) │ │ │
|
||
│ │ └────────────────────────────────────────────────────────────────┬─────┘ │ │
|
||
│ └──────────────────────────────────────────────────────────────────┼──────────┘ │
|
||
│ │ │
|
||
│ ▼ │
|
||
│ ┌─────────────────────────────────────────────────────────────────────────────┐ │
|
||
│ │ SQL Server 数据库 │ │
|
||
│ │ ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐ │ │
|
||
│ │ │admin_users │ │ roles │ │ menus │ │departments │ │ │
|
||
│ │ └────────────┘ └────────────┘ └────────────┘ └────────────┘ │ │
|
||
│ │ ┌────────────┐ ┌────────────┐ ┌────────────┐ ┌────────────┐ │ │
|
||
│ │ │ user_roles │ │role_menus │ │permissions │ │refresh_tokens│ │ │
|
||
│ │ └────────────┘ └────────────┘ └────────────┘ └────────────┘ │ │
|
||
│ │ ┌────────────┐ ┌────────────┐ │ │
|
||
│ │ │operation_ │ │dept_menus │ │ │
|
||
│ │ │ logs │ │ │ │ │
|
||
│ │ └────────────┘ └────────────┘ │ │
|
||
│ └─────────────────────────────────────────────────────────────────────────────┘ │
|
||
│ │
|
||
└──────────────────────────────────────────────────────────────────────────────────────┘
|
||
```
|
||
|
||
---
|
||
|
||
## 十三、API 接口清单
|
||
|
||
| 模块 | 接口 | 方法 | 说明 |
|
||
|------|------|------|------|
|
||
| 认证 | /admin/auth/captcha | POST | 获取验证码 |
|
||
| 认证 | /admin/auth/login | POST | 登录 |
|
||
| 认证 | /admin/auth/refresh | POST | 刷新Token |
|
||
| 认证 | /admin/auth/logout | POST | 登出 |
|
||
| 认证 | /admin/auth/info | GET | 获取当前用户信息 |
|
||
| 认证 | /admin/auth/password | PUT | 修改密码 |
|
||
| 用户 | /admin/users | GET | 用户列表(分页) |
|
||
| 用户 | /admin/users | POST | 创建用户 |
|
||
| 用户 | /admin/users/{id} | GET | 用户详情 |
|
||
| 用户 | /admin/users/{id} | PUT | 更新用户 |
|
||
| 用户 | /admin/users/{id} | DELETE | 删除用户 |
|
||
| 用户 | /admin/users/{id}/roles | GET/PUT | 用户角色 |
|
||
| 用户 | /admin/users/{id}/menus | GET/PUT | 用户专属菜单 |
|
||
| 角色 | /admin/roles | GET | 角色列表(分页) |
|
||
| 角色 | /admin/roles/all | GET | 所有角色 |
|
||
| 角色 | /admin/roles | POST | 创建角色 |
|
||
| 角色 | /admin/roles/{id} | PUT | 更新角色 |
|
||
| 角色 | /admin/roles/{id} | DELETE | 删除角色 |
|
||
| 角色 | /admin/roles/{id}/menus | GET/PUT | 角色菜单 |
|
||
| 角色 | /admin/roles/{id}/permissions | GET/PUT | 角色权限 |
|
||
| 菜单 | /admin/menus | GET | 菜单树 |
|
||
| 菜单 | /admin/menus/user | GET | 当前用户菜单 |
|
||
| 菜单 | /admin/menus | POST | 创建菜单 |
|
||
| 菜单 | /admin/menus/{id} | PUT | 更新菜单 |
|
||
| 菜单 | /admin/menus/{id} | DELETE | 删除菜单 |
|
||
| 部门 | /admin/departments | GET | 部门树 |
|
||
| 部门 | /admin/departments | POST | 创建部门 |
|
||
| 部门 | /admin/departments/{id} | PUT | 更新部门 |
|
||
| 部门 | /admin/departments/{id} | DELETE | 删除部门 |
|
||
| 部门 | /admin/departments/{id}/menus | GET/PUT | 部门菜单 |
|
||
| 权限 | /admin/permissions | GET | 权限列表 |
|
||
| 权限 | /admin/permissions/by-module | GET | 按模块分组 |
|
||
| 权限 | /admin/permissions | POST | 创建权限 |
|
||
| 权限 | /admin/permissions/{id} | PUT | 更新权限 |
|
||
| 权限 | /admin/permissions/{id} | DELETE | 删除权限 |
|
||
| 日志 | /admin/logs | GET | 操作日志列表 |
|
||
| 日志 | /admin/logs/{id} | GET | 日志详情 |
|
||
|
||
---
|
||
|
||
## 十四、总结
|
||
|
||
HoneyBox 后台管理系统是一个完整的 RBAC 权限管理系统,核心功能包括:
|
||
|
||
1. **双 Token 认证**:AccessToken + RefreshToken,支持无感刷新
|
||
2. **图形验证码**:防止暴力破解
|
||
3. **多维度权限**:用户 → 角色 → 菜单/权限,支持部门级和用户级专属菜单
|
||
4. **动态路由**:根据用户权限动态生成前端路由
|
||
5. **操作日志**:完整记录用户操作行为
|
||
6. **按钮级权限**:前后端双重权限校验
|