《NestJS 实战:RBAC 系统管理模块开发 (一)》

前言

大家好,我是 elk!经过之前「从0搭建NestJS后端服务」系列的学习,我们已经拥有了一个坚实的后端基础骨架。现在,是时候为它注入业务灵魂了! 本系列我们将聚焦于企业应用中至关重要的 系统管理模块 ,使用 RBAC(基于角色的访问控制) 权限模型,从前端界面到后端逻辑,实现一套完整的解决方案。

如果你只关注后端逻辑也没关系,我们将提供清晰的接口定义,你可以方便地使用 Apifox 等工具进行测试。当然,结合配套的前端管理界面(基于我之前开发的 Vue2 项目)进行开发,体验会更完整。

功能模块规划

本次系统管理模块将涵盖以下核心功能:

  • 菜单管理: 定义系统导航结构和权限标识。
  • 用户管理: 管理系统用户账号、信息及状态。
  • 角色管理: 定义角色并分配权限(菜单、数据等)。
  • 部门管理: 构建组织架构树。
  • 字典管理: 维护系统常用枚举值、状态码等静态数据。

前后端目录结构预览

  • 前端界面 (Vue2 项目) 主要结构:
bash 复制代码
- 系统管理
    ├── 菜单管理
    ├── 用户管理
    ├── 角色管理
    ├── 部门管理
    └── 字典管理
  • 后端服务 (NestJS 项目) 核心目录 (src/modules/system/):
bash 复制代码
system/
├── menu/                 # 菜单模块
│   ├── dto/              # 数据传输对象
│   │   ├── create-menu.dto.ts
│   │   ├── list-menu.dto.ts
│   │   └── update-menu.dto.ts
│   ├── entities/         # 实体定义 (TypeORM)
│   │   └── menu.entity.ts
│   ├── menu.controller.ts # 控制器 (路由)
│   ├── menu.module.ts     # 模块定义
│   └── menu.service.ts    # 业务逻辑服务
├── user/                 # 用户模块 (结构类似 menu/)
├── role/                 # 角色模块 (结构类似 menu/)
├── dept/                 # 部门模块 (结构类似 menu/)
└── dict/                 # 字典模块 (结构类似 menu/)

user, role, dept, dict 目录结构将与 menu 保持一致,包含各自的 dto, entities, controller, module, service 文件。

界面概念图 (示意):

数据库设计 (核心表)

基于 RBAC 模型和功能需求,我们设计了以下核心数据库表:

  1. 基础实体表 (4张):

    • sys_menu (菜单表): 存储菜单/权限项信息 (名称、路由、图标、类型、排序、父ID等)。
    • sys_user (用户表): 存储用户账号信息 (用户名、密码、昵称、邮箱、手机、部门ID、状态等)。
    • sys_role (角色表): 存储角色信息 (角色名、角色标识、描述、状态等)。
    • sys_dept (部门表): 存储部门信息 (部门名、负责人、联系电话、状态、父ID等,构成树形结构)。
    • sys_dict_type (字典类型表): 存储字典分类 (类型名、类型标识、状态、描述等)。
  2. 字典数据表 (1张):

    • sys_dict_data (字典数据表): 存储具体的字典键值对 (字典标签、字典值、排序、状态、关联的 dict_type_id 等)。
  3. 关联关系表 (3张):

    • sys_user_role (用户-角色关联表): user_id 关联 sys_user.id, role_id 关联 sys_role.id
    • sys_role_menu (角色-菜单关联表): role_id 关联 sys_role.id, menu_id 关联 sys_menu.id (定义角色权限)。
    • sys_role_dept (角色-部门数据权限关联表 - 可选但推荐 ): role_id 关联 sys_role.id, dept_id 关联 sys_dept.id (用于实现基于部门的数据范围控制)。

数据库关系图 (ER Diagram 示意):

前后端协作方式

  • 后端 (NestJS): 负责提供清晰、规范的 RESTful API 接口,实现核心业务逻辑、数据存取和权限校验。
  • 前端 (Vue2): 负责构建用户界面,调用后端 API 进行数据交互和展示,实现用户操作流程。
  • 接口调试: 所有后端 API 将提供详细的文档说明(或通过 Swagger 生成),方便使用
  • Apifox、Postman 等工具进行独立测试。即使不运行前端项目,也能完整验证后端功能。

下篇预告

准备工作就绪!下一篇,我们将正式动手编码,从 菜单管理 (Menu Module) 开始! 我们将深入探讨:

  1. 菜单实体 (MenuEntity) 的定义与字段设计。
  2. 创建、查询、更新、删除菜单的 DTO (Data Transfer Object) 设计。
  3. 菜单 CRUD 接口 (MenuController) 的实现。
  4. 菜单层级结构(树形)的处理逻辑 (MenuService)。
  5. 与前端接口的联调要点。

敬请期待!感谢大家的关注与支持!

相关推荐
文心快码BaiduComate12 小时前
文心快码3.5S实测插件开发,Architect模式令人惊艳
前端·后端·架构
Kimser12 小时前
基于 VxeTable 的高级表格选择组件
前端·vue.js
摸着石头过河的石头12 小时前
JavaScript 防抖与节流:提升应用性能的两大利器
前端·javascript
酸菜土狗12 小时前
让 ECharts 图表跟随容器自动放大缩小
前端
_大学牲12 小时前
FuncAvatar: 你的头像氛围感神器 🤥🤥🤥
前端·javascript·程序员
葡萄城技术团队12 小时前
SpreadJS 性能飙升秘籍:底层优化技术深度拆解
前端
brzhang12 小时前
我且问你,如果有人用 AI 抄你的产品,爱卿又当如何应对?
前端·后端·架构
533_13 小时前
[element-ui] el-tree 组件鼠标双击事件
前端·javascript·vue.js
Q_Q196328847513 小时前
python+uniapp基于微信美食点餐系统小程序
spring boot·python·微信·django·flask·uni-app·node.js
KIKIiiiiiiii13 小时前
微信个人号开发中如何高效实现API二次开发
java·前端·python·微信