# 100free springboot vue 实验室预约管理系统

**Repository Path**: hljhwsoft/springboot-sysyy

## Basic Information

- **Project Name**: 100free springboot vue 实验室预约管理系统
- **Description**: 100free springboot vue 实验室预约管理系统
- **Primary Language**: Java
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-04-17
- **Last Updated**: 2026-04-17

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 100free springboot vue 实验室预约管理系统
# 实验室预约管理系统![输入图片说明](81cbea9e-70bc-431f-bab3-b4f286025ea8.png)

## 系统简介

实验室预约管理系统是一个基于Spring Boot和Vue 3的前后端分离系统，用于管理实验室的预约和使用情况。系统支持用户预约实验室、查看课程安排、管理个人信息等功能，同时为管理员提供用户管理、实验室管理、课程管理、预约管理和数据统计等功能。

## 技术栈

- **后端**：Spring Boot 3, MyBatis, Lombok
- **前端**：Vue 3, Vue Router, ECharts, Axios
- **数据库**：MySQL 8.0

## 项目结构

```
springboot 实验室预约管理系统/
├── backend/             # 后端项目
│   ├── src/main/java/com/example/labreservation/  # 后端代码
│   │   ├── entity/      # 实体类
│   │   ├── mapper/      # MyBatis映射器
│   │   ├── service/     # 业务逻辑
│   │   ├── controller/  # API接口
│   │   └── Application.java  # 应用入口
│   ├── src/main/resources/   # 资源文件
│   │   ├── mapper/      # MyBatis XML文件
│   │   └── application.yml  # 配置文件
│   └── pom.xml          # Maven依赖
├── frontend/            # 前端项目
│   ├── src/             # 前端代码
│   │   ├── views/       # 页面组件
│   │   │   ├── admin/   # 管理员页面
│   │   │   ├── Login.vue  # 登录页面
│   │   │   ├── Home.vue   # 主页面
│   │   │   └── ...      # 其他页面
│   │   ├── router/      # 路由配置
│   │   ├── main.ts      # 应用入口
│   │   └── App.vue      # 根组件
│   ├── index.html       # HTML模板
│   ├── package.json     # npm依赖
│   └── vite.config.ts   # Vite配置
└── README.md            # 项目说明
```

## 系统功能

### 用户功能

1. **公告查看**：查看系统发布的公告信息
2. **个人信息查看**：查看和修改个人基本信息
3. **实验室查看**：查看所有实验室的基本信息
4. **实验室课程安排**：查看特定实验室的课程安排
5. **课程查看**：查看所有课程的基本信息
6. **实验室预约**：按照日期和时间段预约实验室
7. **我的预约**：查看个人的预约记录和状态

### 管理员功能

1. **用户管理**：添加、编辑、删除用户，管理用户权限
2. **实验室管理**：添加、编辑、删除实验室，管理实验室状态
3. **课程管理**：添加、编辑、删除课程信息
4. **实验室课程安排管理**：为实验室分配课程，管理课程时间
5. **实验室预约管理**：审核用户的预约申请，管理预约状态
6. **综合统计**：使用ECharts实现数据可视化，展示系统运行情况

## 数据库设计

### 表结构

1. **user**：用户表
   - id：用户ID
   - username：用户名
   - password：密码（明文存储）
   - name：姓名
   - role：角色（user/admin）
   - email：邮箱
   - phone：电话

2. **laboratory**：实验室表
   - id：实验室ID
   - name：实验室名称
   - location：位置
   - capacity：容量
   - equipment：设备
   - status：状态（available/unavailable）

3. **course**：课程表
   - id：课程ID
   - name：课程名称
   - teacher：教师
   - credits：学分
   - description：描述

4. **lab_course**：实验室课程安排表
   - id：安排ID
   - lab_id：实验室ID
   - course_id：课程ID
   - day_of_week：星期
   - start_time：开始时间
   - end_time：结束时间
   - semester：学期
   - year：年份

5. **reservation**：预约表
   - id：预约ID
   - user_id：用户ID
   - lab_id：实验室ID
   - date：预约日期
   - start_time：开始时间
   - end_time：结束时间
   - purpose：预约目的
   - status：状态（pending/approved/rejected）

6. **notice**：公告表
   - id：公告ID
   - title：标题
   - content：内容
   - create_time：创建时间
   - author：发布者

## 快速开始

### 后端启动

1. 确保MySQL数据库已启动，创建名为`100sysyy`的数据库，密码设置为`abc123`
2. 进入backend目录，执行`mvn spring-boot:run`启动后端服务
3. 后端服务将在`http://localhost:8080`运行

### 前端启动

1. 进入frontend目录，执行`npm install`安装依赖
2. 执行`npm run dev`启动前端开发服务器
3. 前端服务将在`http://localhost:3000`运行

### 登录测试

- **管理员账号**：admin / 123456
- **普通用户账号**：user / 123456

## 注意事项

1. 密码存储为明文，生产环境中应使用加密存储
2. 系统使用前后端分离架构，前端通过Axios调用后端API
3. 主外键关联显示为名称，不显示ID，提升用户体验
4. 系统界面采用左侧导航、抽屉菜单的布局
5. 登录界面采用左右结构，黑黄色主题，符合实验室风格

## 测试数据

系统初始化时会自动创建以下测试数据：

### 用户

- 管理员：admin / 123456
- 普通用户：user / 123456

### 实验室

- 实验室1：计算机实验室1，位置：A栋101，容量：50人
- 实验室2：计算机实验室2，位置：A栋102，容量：40人
- 实验室3：物理实验室，位置：B栋201，容量：30人

### 课程

- 课程1：Java程序设计，教师：张老师，学分：4
- 课程2：数据库原理，教师：李老师，学分：3
- 课程3：操作系统，教师：王老师，学分：4

### 公告

- 公告1：系统上线通知，内容：实验室预约管理系统已正式上线，欢迎使用！

## 系统截图

### 登录界面

![登录界面](https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=Spring%20Boot%20Vue%20laboratory%20reservation%20system%20login%20page%20with%20left%20and%20right%20structure%2C%20black%20and%20yellow%20theme%2C%20school%20style%2C%20professional%20design&image_size=landscape_16_9)

### 主界面

![主界面](https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=Spring%20Boot%20Vue%20laboratory%20reservation%20system%20main%20interface%20with%20left%20navigation%20menu%2C%20drawer%20menu%2C%20professional%20design&image_size=landscape_16_9)

### 实验室预约

![实验室预约](https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=Spring%20Boot%20Vue%20laboratory%20reservation%20form%20with%20date%20and%20time%20selection%2C%20professional%20design&image_size=landscape_16_9)

### 综合统计

![综合统计](https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=Spring%20Boot%20Vue%20laboratory%20reservation%20system%20statistics%20dashboard%20with%20ECharts%20visualization%2C%20professional%20design&image_size=landscape_16_9)