电影院购票系统
SpringBootVueMySQLMybatisPlusElementPlusECharts
采用前后端分离架构,覆盖从用户浏览电影、在线选座、下单支付到退票评价的完整业务流程。系统同时提供后台管理端,支持电影排片、影厅座位配置、订单管理和数据统计。
电影院购票系统 — 项目介绍文档
一、项目概述
本项目是一套电影院在线购票系统,采用前后端分离架构,覆盖从用户浏览电影、在线选座、下单支付到退票评价的完整业务流程。系统同时提供后台管理端,支持电影排片、影厅座位配置、订单管理和数据统计。
| 属性 | 说明 |
|---|---|
| 项目名称 | 电影院购票系统(Cinema Ticket System) |
| 架构模式 | B/S 前后端分离 |
| 后端技术 | Spring Boot 3.2 / MyBatis-Plus 3.5 / MySQL 8.0 / JWT |
| 前端技术 | Vue 3 / Element Plus / Pinia / Axios / ECharts / Vite |
| 开发语言 | Java 21 / JavaScript(ES6+) |
| 适用场景 | 计算机毕设、课程设计、源码学习与二次开发 |
二、技术架构
2.1 后端技术栈
| 类别 | 技术选型 | 版本 | 说明 |
|---|---|---|---|
| 核心框架 | Spring Boot | 3.2.3 | Java 企业级开发框架 |
| ORM 框架 | MyBatis-Plus | 3.5.5 | 增强版 MyBatis,简化 CRUD |
| 数据库 | MySQL | 8.0+ | 关系型数据库 |
| 安全认证 | jjwt(JWT) | 0.12.3 | 无状态 Token 认证 |
| 密码加密 | BCrypt(Hutool) | 5.8.26 | 慢哈希 + 随机盐值 |
| API 文档 | Knife4j(OpenAPI 3) | 4.4.0 | Swagger 增强 UI |
| 工具库 | Hutool | 5.8.26 | Java 通用工具集 |
| 构建工具 | Maven | 3.8+ | 依赖管理与项目构建 |
2.2 前端技术栈
| 类别 | 技术选型 | 版本 | 说明 |
|---|---|---|---|
| 核心框架 | Vue 3(Composition API) | 3.4.21 | 渐进式前端框架 |
| UI 组件库 | Element Plus | 2.6.3 | 企业级桌面端组件库 |
| 路由 | Vue Router | 4.3.0 | 单页应用路由管理 |
| 状态管理 | Pinia | 2.1.7 | Vue 官方状态管理库 |
| HTTP 客户端 | Axios | 1.15.2 | 基于 Promise 的 HTTP 库 |
| 图表 | ECharts | 5.5.0 | 数据可视化图表库 |
| 构建工具 | Vite | 5.2.0 | 下一代前端构建工具 |
2.3 架构图
┌─────────────────────────────────────────────────────────┐
│ 浏览器(Browser) │
├───────────────────────┬─────────────────────────────────┤
│ 前台页面(Portal) │ 后台管理(Admin) │
│ localhost:5173 │ localhost:5173/admin │
│ · 首页/电影浏览 │ · 仪表盘/数据统计 │
│ · 选座购票/支付 │ · 电影/排片 CRUD │
│ · 我的订单/评论 │ · 影厅/座位配置 │
│ · 个人中心 │ · 用户/订单管理 │
└───────────────────────┴─────────────────────────────────┘
│ HTTP /api/*
▼
┌─────────────────────────────────────────────────────────┐
│ Spring Boot 后端(localhost:8080) │
├─────────────┬──────────────┬──────────────┬──────────────┤
│ Interceptor │ Controller │ Service │ Mapper │
│ JWT认证 │ portal/ 前台 │ 业务逻辑 │ MyBatis-Plus│
│ 管理员鉴权 │ admin/ 后台 │ 事务管理 │ XML 自定义SQL│
└─────────────┴──────────────┴──────────────┴──────────────┘
│
▼
┌─────────────────────────────────────────────────────────┐
│ MySQL 8.0 │
└─────────────────────────────────────────────────────────┘
2.4 安全设计
- JWT 双拦截器:
JwtAuthInterceptor(认证)+AdminAuthInterceptor(鉴权),按路径和执行顺序分层控制 - 密码 BCrypt 加密:使用慢哈希算法加随机盐值,有效抵御彩虹表攻击
@Anonymous注解:标注公开接口(如注册、登录、电影查询),无需额外维护白名单- 同源代理:开发环境由 Vite proxy 将
/api转发到后端,避免跨域问题;生产环境建议 Nginx 反向代理
三、功能模块
3.1 前台功能(普通用户)
| 模块 | 功能点 | 说明 |
|---|---|---|
| 首页 | 热映轮播、分类快捷入口、搜索 | 展示海报轮播、电影分类导航、全局搜索框 |
| 电影浏览 | 热映列表、即将上映、分类筛选、关键词搜索、排序 | 多维度筛选,支持按评分/热度/上映日期排序 |
| 电影详情 | 基本信息、评分评论、场次列表 | 展示电影详情和当日排片 |
| 选座购票 | 实时座位图、多选座位、下单锁定 | 行级悲观锁+乐观双检,防并发超卖 |
| 支付 | 模拟支付宝/微信支付 | 15分钟倒计时,超时自动取消 |
| 我的订单 | 订单列表、状态筛选、订单详情 | 支持待支付/已支付/已退票/已完成/已取消筛选项 |
| 退票 | 开场前退票、自动退款 | 开场前30分钟可退,自动释放座位 |
| 评论 | 评分+文字评论、删除自己的评论 | 每人每部电影限评一次 |
| 个人中心 | 修改资料、头像上传、修改密码 | 昵称/邮箱/手机号/头像可编辑 |
3.2 后台功能(管理员)
| 模块 | 功能点 | 说明 |
|---|---|---|
| 仪表盘 | 今日/累计收入、订单数、用户数、票房趋势图、电影排行、上座率 | ECharts 可视化图表 |
| 电影管理 | 新增/编辑/删除/搜索/状态筛选、海报上传 | 逻辑删除,支持上下架 |
| 分类管理 | 分类增删改查 | 前端首页分类导航 |
| 影厅管理 | 创建/删除影厅、可视化座位图配置 | 支持通道/普通/情侣/VIP座位类型 |
| 排片管理 | 创建/取消场次、时间段冲突检测 | 自动计算散场时间(含清场间隔) |
| 用户管理 | 用户列表、启用/禁用、搜索 | 模糊搜索用户名 |
| 评论管理 | 评论列表、隐藏/显示切换 | 违规评论可隐藏。注:目前仅有后端接口(/admin/comments),后台管理页面尚未实现 |
| 订单管理 | 全部订单查询、按状态筛选、详情查看 | 管理端只读,不干预用户操作 |
四、项目亮点
4.1 并发安全:选座防超卖
创建订单时采用 三层并发控制:
- SELECT FOR UPDATE(行级悲观锁):锁定目标座位行,防止其他事务同时读取
- 乐观双检:
UPDATE WHERE status=0原子操作,更新时再次校验状态 - 乐观锁版本号:
schedule_seat.version字段,MyBatis-Plus@Version自动管理
4.2 订单过期自动处理
@Scheduled 定时任务每分钟执行:
- 释放超时未支付的锁定座位
- 将超时待支付订单标记为已过期
4.3 排片时间冲突检测
创建排片时自动检测影厅时段占用,防止同一影厅同一时段重复排片(使用时间段重叠检测算法)。
4.4 座位图可视化配置
管理员可自定义影厅行列数,支持四种座位类型(通道/普通/情侣/VIP),前端实时渲染可视化座位图,色块区分不同类型和售卖状态。
4.5 分类与排序
- 电影分类使用逗号分隔字符串存储,SQL 层
FIND_IN_SET函数直接过滤,保证分页准确 - 支持多维度排序:评分、热度、上映日期
4.6 RESTful API 设计
严格遵循 RESTful 规范,前后台接口清晰分离(前台 /movies、/orders 等,后台 /admin/**)。前端通过 axios baseURL=/api + Vite 代理将 /api 前缀剥离后转发到后端,配合 Knife4j 生成在线 API 文档。
4.7 代码规范性
- 全局统一异常处理(
GlobalExceptionHandler),错误码枚举化管理 - 分页统一返回结构(
PageResult),前端无需适配不同接口 - 所有数据库操作使用 Lambda 表达式构建条件,避免字段名硬编码
五、项目结构
cinema-ticket-system/
├── db/ # 数据库脚本
│ ├── init.sql # 初始化:建库建表 + 基础数据(管理员账号、电影分类)
│ └── demo.sql # 演示数据:用户/电影/影厅/场次/订单/支付/评论(可反复执行)
├── springboot/ # 后端 Spring Boot 项目
│ ├── src/main/java/com/example/
│ │ ├── common/ # 公共模块
│ │ │ ├── annotation/ # @Anonymous、@RequireRole 注解
│ │ │ ├── constant/ # 业务常量
│ │ │ ├── enums/ # 13 个枚举类
│ │ │ ├── exception/ # 全局异常处理 + 错误码
│ │ │ ├── BaseEntity.java # 基础实体(id + 时间戳)
│ │ │ ├── LogicDeleteEntity.java # 逻辑删除实体
│ │ │ ├── PageResult.java # 统一分页结果
│ │ │ ├── Result.java # 统一响应体
│ │ │ └── UserContext.java # 用户上下文工具
│ │ ├── config/ # 配置类
│ │ │ ├── CorsConfig.java # 跨域配置
│ │ │ ├── MybatisPlusConfig.java # MP 分页+乐观锁+自动填充
│ │ │ └── WebMvcConfig.java # 拦截器注册 + 静态资源
│ │ ├── controller/
│ │ │ ├── admin/ # 8 个后台控制器
│ │ │ ├── portal/ # 6 个前台控制器
│ │ │ └── FileController.java # 文件上传
│ │ ├── dto/ # 数据传输对象(7 个模块)
│ │ ├── entity/ # 11 个实体类
│ │ ├── mapper/ # 12 个 Mapper 接口
│ │ ├── security/ # JWT + 拦截器
│ │ │ ├── JwtUtils.java # Token 生成/解析
│ │ │ ├── JwtAuthInterceptor.java # 认证拦截器
│ │ │ └── AdminAuthInterceptor.java # 鉴权拦截器
│ │ ├── service/ # 10 个业务服务类
│ │ ├── task/ # 定时任务
│ │ ├── utils/ # 工具类
│ │ ├── vo/ # 视图对象(7 个模块)
│ │ └── MainApplication.java # 启动类
│ └── src/main/resources/
│ ├── mapper/ # 3 个 XML 自定义 SQL
│ └── application.yml # 主配置文件
├── vue/ # 前端 Vue 3 项目
│ └── src/
│ ├── api/ # API 封装
│ │ ├── admin/ # 后台接口(7 个模块 + index.js 汇总)
│ │ ├── portal/ # 前台接口(4 个模块)
│ │ └── request.js # Axios 拦截器(认证+错误处理)
│ ├── components/
│ │ └── common/MovieCard.vue # 电影卡片组件
│ ├── layouts/
│ │ ├── PortalLayout.vue # 前台布局(导航+页脚)
│ │ └── AdminLayout.vue # 后台布局(侧边栏+顶栏)
│ ├── router/index.js # 路由配置(28 条路由)
│ ├── stores/useUserStore.js # Pinia 用户状态
│ ├── utils/fileUrl.js # 文件路径工具
│ ├── views/
│ │ ├── portal/ # 前台页面(7 个模块 12 页)
│ │ └── admin/ # 后台页面(7 个模块 9 页)
│ └── main.js # 入口文件
└── uploads/ # 文件上传目录
└── demo/ # 演示图片(随仓库提交,供 init.sql / demo.sql 引用)
├── admin.webp # 默认头像(admin 及演示账号共用)
├── goat.png # 电影《奇迹梦之队》海报
├── pegasus.jpeg # 电影《飞驰人生3》海报
├── blades.jpg # 电影《镖人:风起大漠》海报
├── avatar3.jpg # 电影《阿凡达3》海报
└── test-poster-1~8.* # 测试海报
