完成自己项目分页显示、条件查询、添加、删除、修改等功能)
项目功能总结一、项目概述本项目是一个基于Spring Boot Vue 2 Element Plus的宠物管理系统实现了完整的用户认证、权限管理和用户信息管理功能。二、技术栈层级技术后端Spring Boot 3.x, MyBatis, SQL Server前端Vue 2 (部分页面已升级 Vue 3 Element Plus)认证JWT (JSON Web Token)分页PageHelper构建Maven三、已实现功能模块1. 用户认证模块功能说明注册新用户注册填写用户名、密码、姓名、电话、邮箱、地址等信息登录JWT 令牌认证登录成功后返回 Token 并存储在 localStorage登出清除 Token 和用户信息跳转回登录页2. 用户管理模块仅管理员功能说明用户列表分页展示所有用户信息ID、用户名、姓名、角色、电话、邮箱条件搜索按用户名、姓名、角色、电话、邮箱多条件模糊查询新增用户管理员添加新用户设置用户名、姓名、角色等信息编辑用户管理员修改已有用户信息用户名不可修改删除用户管理员删除用户带确认弹窗3. 权限控制模块功能说明角色区分管理员和普通用户两种角色路由守卫未登录自动跳转登录页非管理员无权访问用户管理Token 拦截请求拦截器自动携带 JWT Token 进行身份验证4. 仪表盘模块功能说明统计概览显示用户总数、宠物总数等统计数据系统信息展示系统版本、服务器状态、数据库状态等信息快捷功能快捷入口添加用户、添加宠物、财务系统、系统设置四、数据库表结构users表字段名类型说明idINT主键自增usernameVARCHAR(50)用户名唯一passwordVARCHAR(100)密码nameVARCHAR(50)姓名roleVARCHAR(20)角色管理员/普通用户phoneVARCHAR(20)电话emailVARCHAR(100)邮箱addressVARCHAR(200)地址created_atDATETIME创建时间五、页面路由页面路径说明登录页/login.html用户登录使用 JWT 认证注册页/register.html新用户注册仪表盘/index.html系统概览、统计信息、快捷功能用户管理/user_listAll.html管理员分页管理用户六、功能流程图用户访问 → 未登录 → 跳转登录页 → 输入账号密码 → JWT 验证 登录成功 → 存储 Token → 跳转仪表盘 管理员权限 → 用户管理 → 增/删/改/查 普通用户权限 → 仪表盘部分功能受限七、API 接口列表方法路径说明权限POST/api/auth/login用户登录公开POST/api/auth/register用户注册公开GET/api/users/page分页查询用户管理员GET/api/users查询所有用户管理员GET/api/users/{id}根据 ID 查询用户管理员POST/api/users新增用户管理员PUT/api/users修改用户管理员DELETE/api/users/{id}删除用户管理员八、后续可扩展功能密码加密目前密码明文存储可升级为 BCrypt 加密宠物管理宠物信息的增删改查财务管理财务数据统计和报表系统设置系统参数配置操作日志记录用户操作行为九、页面最终效果管理员登录主面板普通用户无权修改查看用户信息管理员增删改查
