# 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 指令 │ │ ┌─────────────────────────────────────────────────────────────────┐ │ │ │ 新增用户│ │ │ │ │ │ │ │ // 指令实现 │ │ │ │ if (!userPermissions.includes(permission)) { │ │ │ │ el.parentNode?.removeChild(el) // 移除元素 │ │ │ │ } │ │ │ └─────────────────────────────────────────────────────────────────┘ │ │ │ │ 方式2: hasPermission 函数 │ │ ┌─────────────────────────────────────────────────────────────────┐ │ │ │ │ │ │ │ 删除用户 │ │ │ │ │ │ │ │ │ │ │ │ // 函数实现 │ │ │ │ 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. **按钮级权限**:前后端双重权限校验