一个轻量级全栈文档管理系统 Vue 3 + Spring Boot 3.0 实现

PLC技术网抖音群

前言

在企业日常运营中，文档管理常常面临版本混乱、访问不便、反馈脱节等问题。传统的文件夹共享或邮件传递方式已难以满足高效协作的需求。为此，我们开发了一套轻量但功能完整的在线文档管理系统——它不仅支持文档上传与预览，还能通过二维码实现移动端快速访问，并打通用户反馈闭环。整个系统采用现代化全栈技术构建，兼顾安全性、易用性与可维护性，适用于中小团队或内部知识库场景。

项目介绍

本系统是一套企业级文档管理解决方案，采用前后端分离架构，包含两个核心部分：

PC 后台管理系统：供管理员进行文档、用户、反馈的集中管理；

H5 移动端预览页面：用户扫码即可查看文档并提交意见，无需登录。

系统默认提供超级管理员与普通管理员两种角色，支持细粒度权限控制，所有操作均有安全防护。项目完全开源，部署简单，开箱即用。

项目功能

1、用户认证与权限管理

基于 JWT 实现登录态，支持多角色权限控制，密码采用 BCrypt 加密存储。

2、文档全生命周期管理

支持 .doc/.docx 文件上传、按出厂编号筛选、逻辑删除及列表分页查询。

3、二维码自动生成

每份文档自动绑定唯一二维码，扫码直达 H5 预览页；支持重新生成。

4、意见反馈闭环

H5 端匿名提交反馈，后台统一查看、标记处理状态，形成有效沟通链路。

5、响应式体验

PC 管理端与 H5 预览页均适配不同设备，界面简洁直观。

6、API 文档集成

通过 Knife4j 自动生成交互式接口文档，便于调试与二次开发。

项目特点

1、安全可靠：JWT 认证 + Spring Security 权限控制 + 文件类型校验 + SQL 注入防护。

2、移动端友好：二维码一键跳转 H5，无需安装 App，降低使用门槛。

3、开箱即用：提供初始化 SQL 脚本、默认账号、详细部署文档，10 分钟完成本地运行。

4、结构清晰：前后端代码模块化组织，注释完整，适合学习或二次开发。

5、无外部依赖：不依赖第三方云服务，所有功能本地闭环，数据完全自主可控。

项目技术

后端技术栈

核心框架：Spring Boot 3.2.0

安全框架：Spring Security 6.x + JWT 0.12.3

ORM 框架：MyBatis-Plus 3.5.5

数据库：MySQL 8.0+

工具库：Apache POI 5.2.5（Word 处理）、ZXing 3.5.2（二维码生成）

API 文档：Knife4j 4.4.0

前端技术栈

框架：Vue 3.4+

构建工具：Vite 5.0+

状态管理：Pinia 2.1+

路由：Vue Router 4.2+

UI 组件：Element Plus 2.5+

HTTP 客户端：Axios 1.6+

项目效果

启动后端服务（http://localhost:8080）和前端（http://localhost:8081）

使用默认账号登录：

账号	密码	角色
admin	123456	超级管理员
testuser	123456	普通管理员

超级管理员可管理用户、文档、反馈；

普通管理员仅能操作文档和反馈；

手机浏览器扫描文档二维码，即可进入 H5 预览页并提交意见；

所有 API 接口均可在  http://localhost:8080/doc.html  在线测试。

注意：生产环境务必修改默认密码并更换 JWT 密钥！

项目源码

项目采用标准前后端分离结构：

ODM_System/

├── backend/                                # 后端项目

│    ├── src/main/java/com/document/

│    │    ├── config/                     # 安全、CORS、Swagger 配置

│    │    ├── controller/               # REST 控制器

│    │    ├── service/                    # 业务逻辑

│    │    ├── mapper/                     # MyBatis 映射

│    │    ├── entity/                     # 实体类

│    │    ├── util/                        # JWT、二维码、文件工具

│    │    ├── security/                  # 认证过滤器

│    │    └── exception/                 # 全局异常处理

│    ├── src/main/resources/application.yml

│    └── db/init.sql                     # 数据库初始化脚本

│

├── frontend/                              # 前端项目

│    ├── src/

│    │    ├── api/                          # 接口封装

│    │    ├── views/admin/              # 后台页面

│    │    ├── views/h5/                  # H5 预览页

│    │    ├── router/                     # 路由

│    │    ├── store/                       # Pinia 状态

│    │    └── utils/                       # Axios 封装

│    └── vite.config.js

│

└── DEPLOYMENT.md                        # 详细部署指南

GitHub 开源地址（示例）：

后端：yourname/odm-backend

前端：yourname/odm-frontend

Gitee：https://gitee.com/cold-and-warm/odm_-system

总结

这套文档管理系统虽小，却涵盖了企业级应用的核心要素：安全、权限、文件处理、移动端适配与用户反馈。它没有过度设计，也没有冗余功能，一切以"实用"为出发点。对于希望快速开发内部知识平台的团队，或正在学习 Vue 3 + Spring Boot 3.0 全栈开发的开发来说，它是一个不错的参考项目。

关键词

文档管理系统、Vue  3、Spring Boot 3.0、JWT、二维码、H5预览、Element Plus、MyBatis-Plus、全栈开发、企业级

作者：小码编匠

出处：gitee.com/smallcore/DotNetCore

声明：网络内容，仅供学习，尊重版权，侵权速删，歉意致谢！

END

往

期

精

彩

不用金蝶了！这个开源系统把ERP、CRM、HRM全包了

8张表搞定企业流程：轻量、零代码的国产开源工作流

免费开源的物联网大屏平台：支持多数据源低代码

基于Vue3TypeScriptVite的管理系统前端框架，高效又好看

离线人脸识别实战：YOLOv3检测人脸，FaceNet提特征，SVM做分类

别再调云端接口！用YOLOLPRNet搞定中文车牌识别

一款基于Actor模型开发的数据流程编排工具

一套开源监控系统，插件化搞定日志、指标和告警

一个支持多存储平台的企业级网盘系统，多存储断点续传分片上传

开源企业级报表系统：在线设计动态数据源绑定

告别老旧脚手架：全新Vue3后台模板，前后端源码全开源

从零到上线：一个支持Docker自动部署的全栈权限管理系统开源方案

工业级CAE软件如何做？看这个开源增量集成仿真引擎

拖拽即视：零代码打造数据可视化大屏

基于SpringBoot和Vue3的工业自动化控制系统（管理和调试PLC）

开源SSL证书管理工具，让你的网站证书永不过期

一款轻量级的在线团队协作工具，文档、思维导图、任务、知识库全支持

一个平台，多种可能：支持H5、小程序与大屏的全端开发

开源推荐｜一款支持细粒度权限控制的个人信息管理系统

免费开源的Vue2仪表盘工具，ElementUIEChartsG2Plot全上阵

告别卡顿！告别延迟！近乎零延迟的AI视频流服务器

Vue3threejs打造三维机房监控大屏：实时、直观、可交付

Vue3TS打造的工业低代码组态平台，拖拽即出大屏

一个高性能、可扩展的自研分布式小文件存储系统

一个开箱即用的AI智能体开发平台

不用Flask、不搞Web，这个Python人脸识别项目直接跑出结果

开源图像标注神器：支持YOLO导出AI辅助迭代训练

备注【开源】

方便大家交流、资源共享和共同成长

纯技术交流群、需要的小伙伴请扫码

有收获？不妨分享让更多人受益

关注「程序员开源栈」，共同提升技术实力

点分享

点收藏

点在看

点点赞

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！