# 车管家4S店车辆维保管理系统

## 项目简介

基于 Spring Boot 与原生 HTML+CSS+JavaScript 的前后端分离技术，开发的功能完善的 B/S 架构车辆维保（4S 店）管理系统。该系统旨在为 4S 店提供一个集客户管理、车辆档案、维保流程、配件库存等功能于一体的高效信息化管理平台，同时为车主提供便捷的在线预约与查询服务。

**作者**: 杨璐
**学校**: 辽宁科技学院
**专业**: 计算机科学与技术
**班级**: 计BZ246
**学号**: 74133240622
**指导教师**: 刘慧宇
**日期**: 2025年1月

---

## 技术栈

### 后端技术
- **Spring Boot 2.7.18** - 核心框架
- **Spring Data JPA** - 数据访问层
- **MySQL 8.0** - 关系型数据库
- **Maven** - 项目管理工具
- **Lombok** - 简化Java代码
- **FastJSON** - JSON处理

### 前端技术
- **HTML5** - 页面结构
- **CSS3** - 样式设计
- **JavaScript (ES6)** - 交互逻辑
- **Fetch API** - HTTP请求

### 开发工具
- **IntelliJ IDEA / Eclipse** - 后端开发IDE
- **VS Code** - 前端开发编辑器
- **MySQL Workbench** - 数据库管理
- **Postman** - API测试

---

## 系统功能

### 1. 用户管理
- 用户注册与登录
- 角色管理（管理员、工作人员、客户）
- 用户信息维护
- 密码修改

### 2. 客户管理
- 客户档案管理
- 会员等级管理
- 积分管理
- 客户信息查询

### 3. 车辆档案管理
- 车辆信息登记
- 车辆档案查询
- 车辆保养记录
- 里程数管理

### 4. 维保工单管理
- 工单创建与分配
- 工单流转跟踪
- 故障诊断记录
- 费用计算
- 工单状态管理

### 5. 配件库存管理
- 配件信息管理
- 库存数量管理
- 库存预警
- 配件出入库记录

### 6. 预约管理
- 在线预约服务
- 预约确认
- 预约查询
- 预约取消

---

## 项目结构

```
car-maintenance-system/
├── backend/                          # Spring Boot后端
│   ├── src/
│   │   ├── main/
│   │   │   ├── java/
│   │   │   │   └── com/
│   │   │   │       └── carmaintenance/
│   │   │   │           ├── CarMaintenanceApplication.java  # 主应用程序
│   │   │   │           ├── config/                         # 配置类
│   │   │   │           │   └── WebConfig.java
│   │   │   │           ├── controller/                     # 控制器层
│   │   │   │           │   ├── AuthController.java
│   │   │   │           │   ├── UserController.java
│   │   │   │           │   ├── VehicleController.java
│   │   │   │           │   ├── ServiceOrderController.java
│   │   │   │           │   ├── PartsInventoryController.java
│   │   │   │           │   └── AppointmentController.java
│   │   │   │           ├── dto/                            # 数据传输对象
│   │   │   │           │   ├── Result.java
│   │   │   │           │   ├── LoginRequest.java
│   │   │   │           │   └── LoginResponse.java
│   │   │   │           ├── entity/                         # 实体类
│   │   │   │           │   ├── User.java
│   │   │   │           │   ├── Customer.java
│   │   │   │           │   ├── Vehicle.java
│   │   │   │           │   ├── ServiceOrder.java
│   │   │   │           │   ├── PartsInventory.java
│   │   │   │           │   ├── Appointment.java
│   │   │   │           │   └── ServiceItem.java
│   │   │   │           └── repository/                     # 数据访问层
│   │   │   │               ├── UserRepository.java
│   │   │   │               ├── CustomerRepository.java
│   │   │   │               ├── VehicleRepository.java
│   │   │   │               ├── ServiceOrderRepository.java
│   │   │   │               ├── PartsInventoryRepository.java
│   │   │   │               ├── AppointmentRepository.java
│   │   │   │               └── ServiceItemRepository.java
│   │   │   └── resources/
│   │   │       └── application.properties                  # 应用配置
│   │   └── test/
│   └── pom.xml                                             # Maven配置
│
├── frontend/                         # HTML+CSS+JS前端
│   ├── admin/                        # 管理员界面
│   │   └── dashboard.html
│   ├── staff/                        # 工作人员界面
│   │   └── dashboard.html
│   ├── customer/                     # 客户界面
│   │   └── dashboard.html
│   ├── css/                          # 样式文件
│   │   ├── common.css                # 通用样式
│   │   ├── login.css                 # 登录页样式
│   │   └── dashboard.css             # 仪表板样式
│   ├── js/                           # JavaScript文件
│   │   ├── config.js                 # 配置文件
│   │   ├── api.js                    # API调用工具
│   │   ├── login.js                  # 登录逻辑
│   │   └── admin-dashboard.js        # 管理员仪表板逻辑
│   └── login.html                    # 登录页面
│
├── database/                         # 数据库脚本
│   ├── schema.sql                    # 表结构SQL
│   └── data.sql                      # 初始数据SQL
│
└── README.md                         # 项目说明文档
```

---

## 数据库设计

### 主要数据表

1. **users** - 用户表
2. **customers** - 客户信息表
3. **vehicles** - 车辆档案表
4. **service_orders** - 维保工单表
5. **parts_inventory** - 配件库存表
6. **parts_usage** - 配件使用记录表
7. **appointments** - 预约记录表
8. **service_items** - 服务项目表
9. **system_logs** - 系统日志表

### ER图说明

```
用户(User) 1---N 客户(Customer)
客户(Customer) 1---N 车辆(Vehicle)
车辆(Vehicle) 1---N 维保工单(ServiceOrder)
客户(Customer) 1---N 维保工单(ServiceOrder)
工单(ServiceOrder) N---N 配件(PartsInventory) [通过parts_usage]
客户(Customer) 1---N 预约(Appointment)
车辆(Vehicle) 1---N 预约(Appointment)
```

---

## 安装与部署

### 环境要求

- **JDK**: 1.8 或更高版本
- **Maven**: 3.6 或更高版本
- **MySQL**: 8.0 或更高版本
- **浏览器**: Chrome、Firefox、Edge 等现代浏览器

### 1. 数据库配置

#### 创建数据库

```bash
# 登录MySQL
mysql -u root -p

# 执行数据库脚本
source database/schema.sql
source database/data.sql
```

或者直接在MySQL客户端中执行：

```sql
-- 创建数据库
CREATE DATABASE car_maintenance_db DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

-- 导入schema.sql和data.sql文件内容
```

#### 修改数据库连接配置

编辑 `backend/src/main/resources/application.properties`:

```properties
spring.datasource.url=jdbc:mysql://localhost:3306/car_maintenance_db?useUnicode=true&characterEncoding=utf8&useSSL=false&serverTimezone=Asia/Shanghai
spring.datasource.username=root
spring.datasource.password=你的密码
```

### 2. 后端部署

#### 方式一：使用IDE运行

1. 使用 IntelliJ IDEA 或 Eclipse 打开 `backend` 文件夹
2. 等待 Maven 依赖下载完成
3. 运行 `CarMaintenanceApplication.java` 主类
4. 看到 "车管家4S店车辆维保管理系统启动成功!" 表示启动成功
5. 后端服务地址：http://localhost:8080/api

#### 方式二：使用Maven命令行

```bash
# 进入backend目录
cd backend

# 清理并打包
mvn clean package

# 运行jar包
java -jar target/car-maintenance-system-1.0.0.jar
```

### 3. 前端部署

#### 开发环境（使用Live Server）

1. 使用 VS Code 打开 `frontend` 文件夹
2. 安装 Live Server 插件
3. 右键点击 `login.html`，选择 "Open with Live Server"
4. 浏览器自动打开：http://localhost:5500/login.html

#### 生产环境（使用Nginx）

```nginx
server {
    listen 80;
    server_name yourdomain.com;

    root /path/to/car-maintenance-system/frontend;
    index login.html;

    location / {
        try_files $uri $uri/ =404;
    }

    # 代理后端API请求
    location /api/ {
        proxy_pass http://localhost:8080/api/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
}
```

---

## 使用说明

### 演示账号

系统提供了以下演示账号供测试使用：

| 角色 | 用户名 | 密码 | 说明 |
|------|--------|------|------|
| 管理员 | admin | 123456 | 拥有所有权限 |
| 工作人员 | staff001 | 123456 | 处理工单和维保 |
| 客户 | customer001 | 123456 | 查看车辆和预约 |

### 登录流程

1. 打开浏览器访问系统首页
2. 输入用户名和密码
3. 选择对应的登录角色
4. 点击"登录"按钮
5. 系统自动跳转到对应角色的仪表板

### 管理员功能

- **系统概览**: 查看系统统计数据
- **用户管理**: 管理所有系统用户
- **车辆管理**: 管理所有车辆档案
- **工单管理**: 管理所有维保工单
- **配件管理**: 管理配件库存
- **预约管理**: 管理客户预约

### 工作人员功能

- 查看分配给自己的工单
- 更新工单状态
- 记录维修诊断
- 添加使用配件
- 完成工单

### 客户功能

- 查看自己的车辆
- 查看维保记录
- 在线预约服务
- 查看预约状态
- 查询工单进度

---

## API接口文档

### 认证接口

#### 用户登录
```
POST /api/auth/login
Content-Type: application/json

Request Body:
{
    "username": "admin",
    "password": "123456"
}

Response:
{
    "code": 200,
    "message": "登录成功",
    "data": {
        "token": "TOKEN_1_1704614400000",
        "userInfo": {
            "userId": 1,
            "username": "admin",
            "realName": "系统管理员",
            "phone": "13800138000",
            "email": "admin@carmaintenance.com",
            "role": "admin"
        }
    }
}
```

### 车辆管理接口

#### 获取所有车辆
```
GET /api/vehicles
Authorization: Bearer {token}

Response:
{
    "code": 200,
    "message": "操作成功",
    "data": [...]
}
```

#### 根据ID获取车辆
```
GET /api/vehicles/{id}
Authorization: Bearer {token}
```

#### 创建车辆
```
POST /api/vehicles
Content-Type: application/json
Authorization: Bearer {token}

Request Body:
{
    "customerId": 1,
    "licensePlate": "京A12345",
    "brand": "奔驰",
    "model": "C200L",
    "color": "黑色",
    "vin": "LBVCU31J7DR123456"
}
```

### 工单管理接口

#### 获取所有工单
```
GET /api/orders
Authorization: Bearer {token}
```

#### 创建工单
```
POST /api/orders
Content-Type: application/json
Authorization: Bearer {token}

Request Body:
{
    "vehicleId": 1,
    "customerId": 1,
    "serviceType": "maintenance",
    "appointmentTime": "2025-01-10T09:00:00",
    "faultDescription": "车辆到5000公里，需要小保养"
}
```

---

## 常见问题

### 1. 后端启动失败

**问题**: 端口被占用
**解决**: 修改 `application.properties` 中的 `server.port` 为其他端口

**问题**: 数据库连接失败
**解决**: 检查MySQL是否启动，确认用户名密码是否正确

### 2. 前端无法连接后端

**问题**: CORS跨域错误
**解决**: 检查 `WebConfig.java` 中的CORS配置，确保前端地址在允许列表中

**问题**: API请求404
**解决**: 确认后端服务已启动，检查 `config.js` 中的 `BASE_URL` 配置

### 3. 登录失败

**问题**: 用户名或密码错误
**解决**: 使用演示账号，或检查数据库中的用户数据

---

## 开发团队

**作者**: 杨璐
**学校**: 辽宁科技学院
**专业**: 计算机科学与技术
**班级**: 计BZ246
**指导教师**: 刘慧宇

---

## 许可证

本项目为毕业设计作品，仅供学习和研究使用。

---

## 更新日志

### v1.0.0 (2025-01-07)
- 完成系统架构设计
- 实现用户认证功能
- 实现车辆档案管理
- 实现维保工单管理
- 实现配件库存管理
- 实现预约管理功能
- 完成前端页面设计
- 完成数据库设计

---

## 联系方式

如有问题或建议，请联系：

- 邮箱: 学生邮箱
- 学校: 辽宁科技学院
- 院系: 电子与信息工程学院

---

**祝使用愉快！**
