Spring Boot 3 + Vue 3 + MySQL 工程项目流程管理系统源码前后端分离实战

一、项目简介本项目是一套基于 Spring Boot 3 Vue 3 MySQL 的工程项目流程管理系统采用前后端分离架构。系统围绕工程项目全生命周期管理设计包含普通用户端和管理员端两大角色。普通用户可以浏览项目列表、查看项目详情与进度、查阅系统公告管理员负责用户、项目、项目类型、项目进度、公告等模块的增删改查全流程管理并配有数据统计看板与 ECharts 图表分析功能。二、技术栈技术说明后端框架Spring Boot 3.xORMMyBatis-Plus含分页插件权限控制自定义 AuthInterceptor拦截 /api/admin/、/api/user/、/api/common/前端框架Vue 3Composition API setup 语法状态管理PiniauserStore 管理用户登录状态前端路由Vue RoutercreateWebHistory 模式UI 组件库Element Plus表单、表格、对话框、上传、分页、进度条等图表库ECharts仪表盘饼图、柱状图构建工具Vite数据库MySQL 8.x文件上传MultipartFile存储至本地 uploads 目录密码加密MD5 工具类Md5Util跨域配置全局 CORS 允许所有来源、所有方法、携带凭证三、功能模块管理员端仪表盘总览展示项目总数、进行中项目数、已完工项目数、用户总数四个统计卡片实时反映系统核心数据。仪表盘图表使用 ECharts 饼图展示项目状态分布待审核/进行中/已完成等柱状图展示各项目类型的项目数量。仪表盘最新进度展示最近 8 条项目进度记录包含项目名称、进度标题、进度百分比、操作人、更新时间。用户管理分页查询用户列表支持按用户名/昵称/手机号搜索可新增、编辑、删除用户编辑时可修改用户名、昵称、手机号、邮箱、头像、角色、状态密码留空则不修改。项目管理分页查询项目列表支持按项目名称/负责人搜索可新增、编辑、删除项目编辑时填写项目名称、类型、起止日期、预算、地点、负责人、状态、进度、封面图、描述。项目类型管理查询所有项目类型按排序号正序可新增、编辑、删除类型删除时校验是否被项目引用防止误删。类型统计展示每个类型的项目数量用于图表数据源。进度管理分页查询进度记录支持按所属项目 ID 筛选、按标题搜索可新增、编辑、删除进度编辑时选择所属项目、填写进度标题、当前进度百分比滑块、操作人、进度图片、描述。进度自动更新项目状态添加进度时若进度 100 自动将项目状态设为 COMPLETED 0 设为 IN_PROGRESS。公告管理分页查询公告列表支持按标题搜索可新增、编辑、删除公告编辑时填写标题、发布人、封面图片、内容、状态发布/草稿、置顶开关。文件上传支持上传图片/文件返回访问 URL用于封面图、进度图等。退出登录清除 Session跳转登录页。普通用户端查看项目列表支持按类型 ID、状态、关键字搜索按创建时间倒序排列。查看项目详情展示项目名称、类型、描述、封面图、起止日期、预算、地点、负责人、状态、进度等完整信息。查看指定项目的进度记录列表按创建时间正序排列展示标题、描述、进度百分比、图片、操作人。查看公告列表仅显示已发布且状态为 1 的公告置顶公告优先、按创建时间倒序。查看公告详情展示公告标题、内容、封面图、发布人、发布时间。用户注册填写用户名、密码、昵称、手机号注册后角色默认为 USER状态为正常。用户登录支持用户名密码登录校验用户存在性、状态、密码登录后 Session 存储当前用户。快速登录页面提供管理员/用户一键登录按钮自动填充账号密码。查看个人资料获取当前登录用户信息不返回密码。修改个人资料可更新昵称、手机号、邮箱、头像、密码更新后刷新 Session。四、项目总结本系统技术选型主流且完整前后端分离架构清晰适合作为 Java Web 全栈开发的学习项目或中小型工程管理系统的二次开发基础。技术亮点包括Spring Boot 3 与 Vue 3 的最新生态组合、MyBatis-Plus 高效 CRUD 与分页、自定义拦截器实现接口权限控制、Pinia 管理前端登录状态、ECharts 数据可视化看板、以及进度自动联动项目状态等业务逻辑。适用于工程项目管理、企业流程管理、毕业设计、课程设计等场景。界面展示交付内容本项目为完整交付包含完整后端源码完整前端源码数据库初始化脚本SQL万字项目文档设计文档 / 论文可作课程设计、毕业设计参考获取完整源码完整前后端源码 数据库脚本 万字项目文档见 Gitee 仓库https://gitee.com/kangxihuang/src-K167