功能一览
- 登录 / 注册:JWT 无状态认证,禁用账号无法登录。
- 前后台分离:管理员走
/admin/*,普通用户走 /user/*,跨端访问本端 403。
- 用户管理:分页、关键字搜索、增删改查;逻辑删除;至少保留一名管理员。
- 动态菜单:后台侧栏与路由由
sys_menu 驱动,菜单管理可视化维护。
- 系统日志:登录日志 + 操作日志(Tab),支持分页与批量删除。
- 个人中心:头像上传、资料修改、修改密码(头像下拉进入)。
- 文件上传:
avatar / common 分类,删除时校验归属。
- 多页签与主题:后台 keep-alive 页签;6 种主题色 localStorage 记忆。
- 接口文档:SpringDoc Swagger 在线调试。
- 配套文档:
docs/00~06 需求、设计、接口、开发步骤与验收清单,可按需扩展业务模块。
核心亮点与创新点
| 亮点 | 亮点说明 |
|---|
| 前后台双端路由 | ADMIN / USER 角色隔离;后台动态菜单 + 前台固定导航,扩展业务时不混用菜单表 |
| JWT + 三层权限 | 菜单 / 路由 meta.roles / 接口 @PreAuthorize / 按钮 v-auth,无独立权限表,权限边界清晰 |
| 动态路由注入 | 新增后台页:routeMap + MenuPaths + 菜单 SQL,admin 重新登录即生效 |
| 操作审计闭环 | @Log 切面写操作日志;登录成功/失败写登录日志,问题排查可追溯 |
| Pinia 持久化 | 登录态与多页签按用户 ID、admin/user 分 scope 持久化,刷新不掉登录 |
| 文档一体化交付 | zip 含 docs/ 全套模板(需求、详细设计、库表、接口、验收),fork 后填 {{}} 即可定稿 |
系统技术栈
| 层次 | 技术 |
|---|
| 后端 | Java 21、Spring Boot 3、Spring Security、JWT、MyBatis-Plus |
| 前端 | Vue 3、Vite、Pinia、Element Plus、Vue Router |
| 数据 | MySQL 8 |
| 文档 | SpringDoc OpenAPI(Swagger UI) |
| 其它 | 统一 Result 响应、分页 PageResult、文件本地上传、操作/登录日志 |
前后端分离;开发环境 Vite 代理 /api、/uploads → 后端 9090。
数据库表概述
合计 5 张系统表(基座;业务表由 fork 后在 sql/system.sql 扩展)。
系统表
| 表名 | 说明 |
|---|
| sys_role | 角色(ADMIN、USER) |
| sys_user | 用户账号、资料、头像、逻辑删除 |
| sys_menu | 后台菜单(仅 /admin/* 路径) |
| sys_login_log | 登录成功/失败记录 |
| sys_operation_log | 操作日志(@Log 写入) |
关系说明
- 用户与角色字段
role 对应;一人一角,扩展角色需同步路由与鉴权。
- 前台路由不入
sys_menu,由 frontNav.js + dynamicRoutes.js 维护。
- 业务扩展时在
com.system 各层新增实体与接口,业务表建议带 user_id 做数据隔离。
难度与范围
| 项目 | 说明 |
|---|
| 等级 | 标准(standard) |
| 适合 | 需要「完整基座 + 自扩展 1~2 个业务模块」的通用项目场景(图书、预约、交易等) |
| 包含 | 登录权限、用户/菜单/日志、文件、前后台、Swagger、交付文档模板 |
| 不含 | 具体行业业务 CRUD(需学生在脚手架上演进) |
系统截图
登录页
左右分栏登录;左侧展示系统介绍,右侧表单支持注册跳转。内置演示账号:admin/admin(后台)、aaa/123、bbb/123(前台)。

用户前台(客户端)
USER 登录后进入 /user/*:顶栏站点名 + 居中菜单 + 用户下拉;首页为卡片式示例数据(通知、办事进度、服务入口),fork 后可直接改成你的业务首页。

管理后台(控制台)
ADMIN 登录后进入 /admin/*:深色侧栏动态菜单、顶栏多页签 keep-alive、控制台欢迎区与快捷入口;用户/菜单/日志等基座页面开箱即用。

角色与功能说明
内置 管理员(ADMIN)、普通用户(USER) 两种登录角色。
普通用户(USER)
登录后进入前台 /user/*,不可访问后台管理接口与页面。
认证与账号
| 功能 | 说明 |
|---|
| 注册 | 用户名注册,默认 USER 角色 |
| 登录 | 用户名 + 密码,JWT 下发 |
| 退出 | 清除 Token 与 Pinia 持久化 |
| 个人中心 | 昵称、邮箱、手机等资料 |
| 修改密码 | 校验原密码后更新 |
| 头像 | 上传头像并绑定 path |
前台
| 功能 | 说明 |
|---|
| 首页 | /user/home,内置「校园服务门户」示例卡片,fork 后替换为业务数据 |
| 顶栏导航 | frontNav.js 配置,扩展页写 userFixedChildren |
| 无权限页 | 访问受限时 403 提示 |
管理员(ADMIN)
登录后进入后台 /admin/*,侧栏菜单来自 sys_menu。
控制台
| 功能 | 说明 |
|---|
| 数据概览 | 控制台欢迎区 + 快捷入口(用户管理、系统日志、个人信息) |
用户管理
| 功能 | 说明 |
|---|
| 列表 | 分页、关键字搜索 |
| 新增/编辑 | 表单校验;角色 ADMIN/USER |
| 删除 | 逻辑删除;不可删当前登录账号;至少保留一名 ADMIN |
| 禁用 | status=0 后无法登录 |
菜单管理
| 功能 | 说明 |
|---|
| 树形维护 | 后台菜单 CRUD |
| 路径约束 | 须 /admin/ 开头且在 MenuPaths.ALLOWED 登记 |
| 内置保护 | 控制台、用户、日志、菜单四条内置菜单不可删改 path |
| 生效 | 保存后 admin 重新登录 加载动态路由 |
系统日志
| 功能 | 说明 |
|---|
| 登录日志 | 成功/失败、IP、时间 |
| 操作日志 | @Log 记录的模块与动作 |
| 清理 | 支持批量删除 |
文件(接口层)
| 功能 | 说明 |
|---|
| 上传 | avatar(≤2MB 图片)、common(业务附件,≤10MB) |
| 下载/预览 | 鉴权接口读流 |
| 删除 | 头像仅本人;common 仅 ADMIN |
其它