基于SpringBoot+Vue3的自习室预约管理系统
项目概述
该系统是一个基于SpringBoot+Vue3的自习室预约管理系统，支持管理员和普通用户两种角色，实现自习室信息管理、在线预约、留言互动、公告发布等全流程自习室管理功能。
项目技术栈
前后端分离
后端：
Springboot2 + Mybatis
前端：
Vue3 + ElementUI + Axios
数据库：
MySQL
版本要求
JDK 1.8
MySQL 5.7
Node.js 16
Maven 3.8+
Navicat 16+
数据库表：9 张表
难度系数：
项目目录结构
一、java后端服务
1. 后端核心代码 (src/main/java/com/cl/)
1
2
3
4
5
6
7
8
9
10
11
com.cl/
├── annotation/ # 自定义注解
├── config/ # 配置类（数据源、拦截器等）
├── controller/ # 控制器层（API接口）
├── dao/ # 数据访问层（MyBatis接口）
├── entity/ # 实体类（数据库表映射）
├── interceptor/ # 拦截器（权限、日志等）
├── service/ # 业务逻辑层
├── utils/ # 工具类库
└── SpringbootSchemaApplication # 启动类
2. 资源文件 (src/main/resources/)
1
2
3
4
5
6
7
resources/
├── client/ # 可能存放客户端相关配置
├── manage/ # 管理端相关资源
├── mapper/ # MyBatis XML映射文件
├── static/ # 静态资源（CSS/JS/图片等）
└── application.yml # 主配置文件
二、vue后台管理系统
1. 核心配置文件
1
2
3
4
5
6
babel.config.js # Babel转译配置
vue.config.js # Vue CLI配置
package.json # 项目依赖和脚本
.env.development # 开发环境配置
.env.production # 生产环境配置
2. 源码目录 (src/)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
src/
├── assets/ # 静态资源（图片、样式等）
├── components/ # 公共组件
├── router/ # 路由配置
├── store/ # Vuex状态管理
├── utils/ # 工具函数
├── views/ # 页面组件
│ ├── config/ # 系统配置相关页面
│ ├── gonggao/ # 公告管理
│ ├── messages/ # 消息管理
│ ├── users/ # 用户管理
│ ├── yonghu/ # 用户相关
│ ├── yuyuezixishi/ # 自习室预约
│ ├── zixishixinxi/ # 自习室信息
│ ├── forget.vue # 忘记密码
│ ├── HomeView.vue # 首页
│ ├── index.vue # 入口页
│ ├── login.vue # 登录页
│ └── updatepassword.vue # 修改密码
├── App.vue # 根组件
└── main.js # 入口文件
3. 公共资源
1
2
3
public/ # 纯静态资源（不会被webpack处理）
node_modules/ # 依赖包目录
三、vue前台用户端
1. 核心配置文件
1
2
3
4
5
6
7
8
babel.config.js # Babel转译配置
vue.config.js # Vue CLI配置
package.json # 项目依赖和脚本
.env.development # 开发环境配置
.env.production # 生产环境配置
.gitignore # Git忽略配置
README.md # 项目说明文档
2. 源码目录 (src/)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
src/
├── assets/ # 静态资源（图片、样式等）
├── components/ # 公共组件
├── router/ # 路由配置
├── store/ # Vuex状态管理
├── utils/ # 工具函数
├── views/ # 页面组件（主要视图）
└── pages/ # 额外的页面目录
├── gonggao/ # 公告相关
├── messages/ # 消息中心
├── yonghu/ # 用户中心
├── yuyuezixishi/ # 自习室预约
├── zixishixinxi/ # 自习室信息
├── forget.vue # 忘记密码
├── home.vue # 首页
├── login.vue # 登录页
└── index.vue # 索引页
3. 公共资源
1
2
3
public/ # 纯静态资源（不会被webpack处理）
node_modules/ # 依赖包目录
项目数据库
数据库概述
数据库名
zixishi
字符集
utf8mb4
排序规则
utf8mb4_general_ci
主要数据表
| 表名 | 表描述 |
|---|---|
| config | 配置表 |
| gonggao | 公告表 |
| messages | 留言板表 |
| yonghu | 用户表 |
| yuyuezixishi | 预约自习室表 |
| zixishixinxi | 自习室信息表 |
| users | 管理员表 |
| token | 令牌表 |
| menu | 菜单表 |
项目功能介绍
后台管理系统
登录
管理员登录系统
修改密码
修改管理员密码
退出登录
安全退出系统
留言管理
管理用户留言和回复
预约自习室管理
管理用户预约记录
公告管理
发布和管理系统公告
自习室信息管理
管理自习室基本信息
用户管理
管理系统用户信息
轮播图管理
管理首页轮播图
前台用户端
注册
新用户注册功能
登录
用户登录系统
退出登录
安全退出系统
首页浏览
浏览自习室信息列表
自习室信息
查看自习室详情，预约自习室
留言板
发表留言，查看回复信息
公告页面
查看公告列表和详情
个人中心
修改用户信息，修改密码，已预约自习室查询