系统技术架构设计

SpringBoot+Vue医院预约挂号系统采用前后端分离架构。后端基于SpringBoot框架，提供RESTful API接口，处理业务逻辑和数据持久化。前端使用Vue.js框架构建用户界面，通过Axios与后端交互。

后端主要技术栈：

• SpringBoot 2.7.x
• Spring Security
• MyBatis-Plus
• MySQL 8.0
• Redis缓存
• Swagger接口文档

前端主要技术栈：

• Vue 3.x
• Element Plus UI
• Vue Router
• Pinia状态管理
• Axios HTTP客户端

核心功能模块实现

用户认证模块 采用JWT实现无状态认证，Spring Security配置权限控制。后端创建JwtUtil工具类生成和验证token：

public class JwtUtil {
    private static final String SECRET_KEY = "hospital-secret";
    private static final long EXPIRATION = 86400000; // 24小时

    public static String generateToken(UserDetails userDetails) {
        return Jwts.builder()
                .setSubject(userDetails.getUsername())
                .setIssuedAt(new Date())
                .setExpiration(new Date(System.currentTimeMillis() + EXPIRATION))
                .signWith(SignatureAlgorithm.HS256, SECRET_KEY)
                .compact();
    }
}

挂号业务模块 实现科室管理、医生排班、预约挂号等核心功能。数据库设计关键表结构：

CREATE TABLE `appointment` (
  `id` bigint NOT NULL AUTO_INCREMENT,
  `patient_id` bigint NOT NULL,
  `doctor_id` bigint NOT NULL,
  `schedule_id` bigint NOT NULL,
  `status` tinyint NOT NULL COMMENT '0-待支付 1-已预约 2-已取消',
  `create_time` datetime NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

系统部署运行指南

后端部署准备

1. 安装JDK 1.8+和Maven 3.6+
2. 创建MySQL数据库并导入schema.sql
3. 配置application.yml中的数据库连接信息
4. 启动Redis服务

运行命令：

mvn clean package
java -jar target/hospital-system.jar

前端运行步骤

1. 安装Node.js 16.x+
2. 配置.env.development中的API基础路径
3. 安装依赖并启动开发服务器：

npm install
npm run dev

视频教程内容要点

1. 环境准备与工具安装演示

   • JDK、MySQL、Redis安装配置
   • Node.js和Vue CLI安装
   • IDE开发环境搭建

2. 数据库初始化操作

   • 执行SQL脚本创建表结构
   • 基础数据导入演示

3. 后端项目启动调试

   • Maven依赖加载过程
   • 应用配置文件详解
   • Swagger接口测试方法

4. 前端项目运行展示

   • 跨域问题解决方案
   • 页面组件结构解析
   • 接口联调实战演示

5. 生产环境打包部署

   • SpringBoot应用Docker化
   • Nginx前端项目部署
   • HTTPS证书配置指南

常见问题解决方案

跨域访问问题 后端配置CorsFilter解决开发环境跨域：

@Bean
public CorsFilter corsFilter() {
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    CorsConfiguration config = new CorsConfiguration();
    config.addAllowedOrigin("*");
    config.addAllowedHeader("*");
    config.addAllowedMethod("*");
    source.registerCorsConfiguration("/**", config);
    return new CorsFilter(source);
}

预约并发控制 使用Redis分布式锁防止超卖：

public boolean tryLock(String key) {
    String threadId = Thread.currentThread().getId();
    Boolean result = redisTemplate.opsForValue()
            .setIfAbsent(key, threadId, 30, TimeUnit.SECONDS);
    return Boolean.TRUE.equals(result);
}

系统完整代码和视频教程可通过GitHub仓库获取，包含详细的注释和文档说明。开发过程中建议使用Postman进行接口测试，利用Vue DevTools调试前端组件状态。