0
点赞
收藏
分享

微信扫一扫

基于Spring Boot+Vue的电影购票管理平台

杏花疏影1 03-20 16:00 阅读 2

目录

一、 绪论

1.1 开发背景

随着互联网技术的日益成熟和普及,线上购票服务在影视娱乐产业中逐渐成为主流。传统的实体影院购票方式存在排队等待和时间限制等不便之处,而线上购票平台能够为用户提供更加便捷的购票方式。用户只需通过电脑或手机等终端设备,即可轻松浏览最新的电影信息、实时查询场次和座位情况,并且在线完成选座和支付操作,极大地提高了购票的灵活性和便利性。

1.2 系统开发平台

影云线上购票管理平台的开发采用了Spring Boot作为后端框架,Spring Boot是一个快速构建应用的开源框架,简化了Spring应用的配置和部署过程。在前端方面,我们选用了Vue作为主要的前端展示框架,Vue是一个轻量级的前端框架,易于学习和使用。为了实现前后端分离架构,我们使用了Element UI作为前端组件库,可以快速构建美观的用户界面[2]。

1.3 系统开发环境

影云线上购票管理平台的开发环境如下:
(1)操作系统:Windows 10
(2)开发工具:IntelliJ IDEA、Visual Studio Code
(3)后端开发语言:Java 11
(4)前端开发语言:HTML、CSS、JavaScript
(5)数据库:MySQL 8.0
(6)版本管理工具:Git

二、 需求分析

2.1 问题描述

影院管理人员在日常运作中需要根据制片企业所给出的影片信息和放映信息对电影进行放映、宣传等工作,在传统的电影管理模式中,面临着电影信息更新不及时、信息错漏、与内容不符等问题,而在传统的方式中,出现这些问题时往往又难以更改,但是将数据引入到数据库中时,存储到计算机中,这些问题都能得到很好的解决,于是设计了电影管理模块,影院管理者能够对电影进行数据操作,让影院管理者能够根据需求,实时地修改电影的类型、名称、上下映时间、海报等信息。
观众的需求是电影发展的重要驱动力[6]。用户要能够访问到所有的目前上映的电影信息,以此能够能够根据自己的需求去对电影进行选择,用户有时可能仅想看正在热映的电影,让用户能够访问到当时正在热映的前三个电影,以及其余的电影按照电影评分排序,同时为了客户更好地找到自己喜欢的类型的电影,让客户能够按照自己的喜好和需求查看电影目录,当用户选择好需求以后要根据自己的位置和影院的位置和票价进行影院的选择,当用户选择好影院后还要进行观影时间段的选择,选择好观影的时间段后,则可以进行座位的选择,当用户选择好座位后,提交可以预览订单,确认订单无误后,则可点击确认支付进行订单提交,提示订单支付成功,之后用户则可在我的订单界面看到用户提交的订单,对自己的订单信息进行查看或者确认,若订单过多,还可根据电影名称进行筛选。

2.2 功能需求

根据以上客户提出的需求进行分析,需要在后台设计一个电影管理模块,实现对电影的增删改查功能,在前台设计了首页、目录页和我的订单页。

2.2.1 后台-电影管理模块

电影管理模块需要实现对电影的查询、添加、删除、修改功能、以便用户对电影信息进行查询和数据操作。影院管理人员可以根据电影名称、所属地区、所属类型查询电影。电影信息需要包括电影的基本信息以及电影的评分和一张电影的海报。

2.2.2 前台-首页

用户访问到首页时,页面上方有个卡片化的横幅,根据评分展示评分最高的前几部电影,之后在下面按照评分高低排序展示其余电影的卡片表单,在电影图片下方有查询和购票按钮。用户点击电影的图片或者查看按钮即可跳转到电影信息页面,展示电影的详细信息,点击购票按钮即可跳转到影院选择界面。

2.2.3 前台-目录页

用户可以通过电影的名称、类型和地区查询满足需求的电影表单,电影以卡片表单的方式展示,在下方有查看和购票按钮,用户通过点击查看按钮可跳转到影院详情界面,点击购票按钮可跳转到影院选择界面。

2.2.4 前台-我的订单

用户进入我的订单界面可以看到用户所购买的所有订单,用户可以输入电影名称,点击查询按钮,对订单根据电影名称进行查询操作。

2.2.5 前台-影院详情页

由目录页或首页通过点击电影图片或者点击图片下方的查看按钮跳转到这个页面,这个页面展示电影的图片、名称、语言、上下映时间、演员、简介等信息。页面上有个购票按钮,用户点击即可跳转至影院选择界面进行影院的选择。

2.2.6 前台-影院选择页

用户点击电影详细信息页面的购票按钮或者点击表单页面的购票按钮则可直接跳转到影院选择界面,进行影院的选择,此时用户可以根据影院的地址、自己的时间、影院票价等信息,选择观影的日期以及放映这个电影的影院,点击选择影院按钮后,即可跳转到放映厅选择界面。

2.2.7 前台-选座页

用户通过点击放映厅选择界面的选择放映厅后,则可以跳转到座位选择界面,选择座位,同时展示所选的电影、影院、放映厅信息,和已经选择的座位的信息。用户选择好座位后,点击确认选座后,即可跳转到订单预览界面。

2.2.8 前台-订单预览页

用户通过点击选座界面中的确认选座按钮即可跳转到订单预览界面。用户确认订单无误后即可跳转到支付成功界面,显示用户支付成功信息。

三、 系统设计

3.1 系统总体设计

系统架构总体上为前后端分离的B/S体系结构,系统后端采用MVC体系结构风格,拥有高内聚、低耦合的特点,增强了系统的可维护性,使系统的开发和后期的维护工作变得更加简单,让熟悉此体系结构风格的人能够很好地上手本项目,并对本项目进行进一步地修改、开发和维护。系统前端采用Vue框架和Element UI进行开发。
在这里插入图片描述

3.2 数据库设计

根据对项目的需求进行分析进行数据库设计,经过小组分析和讨论实体应当有电影图片、地区、类型、电影信息、影院信息、放映厅信息、排片信息、订单信息、用户等实体,他们之间还存在着一些联系。

3.2.1 数据库概念结构设计

根据以上分析得到的实体,绘制电影购票管理系统的E-R图,以下是整个系统的E-R图,
在这里插入图片描述

3.2.2 数据库逻辑结构设计

根据概念结构设计的结果设计出数据库的逻辑结构,并用下划线标注表示该表的主键,以下是整个电影购票管理系统的数据库逻辑结构:
影院(编号,名称,地址,电话)
放映厅(编号,影院编号,排数,每排座位数)
电影(编号,地区编号,名称,导演,演员,语言,上映时间,下映时间,时长,评分,介绍)
排片(编号,放映厅编号,电影编号,开场时间,散场时间,票价)
电影图片(编号,电影编号,名称,路径)
订单(编号,电影编号,用户编号,影院编号,放映厅编号,排片编号,座位号,价格,状态,用户名称,用户电话)
电影与类型(编号,电影编号,类型编号)
电影地区(编号,名称)
电影类型(编号,名称)
用户(编号,用户名,密码,名称,电话,邮箱,用户角色)

3.2.3 数据库物理结构设计

根据数据库的逻辑结构设计的结果进行数据库的物理结构设计,设计数据库数据表,
影院信息表:
序号 字段 类型 键 备注
1 id bigint 主键 id
2 name varchar(150) 影院名称
3 address varchar(150) 影院地址
4 phone varchar(50) 联系电话
根据逻辑结构设计的结果实现的数据库的电影信息表,
序号 字段 类型 键 备注
1 id bigint 主键 id
2 region_id bigint 外键 电影地区id
3 name varchar(50) 电影名称
4 director varchar(50) 导演
5 actor varchar(150) 演员
6 language varchar(50) 语言
7 show_time datetime 上映时间
8 off_show_time datetime 下映时间
9 duration varchar(50) 时长
10 mark double 评分
11 introduction varchar(150) 简介
根据逻辑结构设计的结果实现的数据库的订单信息表,
序号 字段 类型 键 备注
1 id bigint 主键 id
2 movie_id bigint 外键 电影信息id
3 room_id bigint 外键 放映厅id
4 user_id bigint 外键 用户id
5 cinema_id bigint 外键 影院信息id
6 arrange_id bigint 外键 排片信息id
7 sit_number int 座位号
8 money decimal(10,0) 金额
9 status tinyint(1) 订单状态
10 name varchar(50) 用户姓名
11 phone varchar(50) 用户电话

四、系统实现

4.1 电影管理模块实现

以下是后台电影管理模块的界面,用户可以输入电影名称,选择所属地区,选择所属类型,对电影信息进行筛选,所属地区、类型由前端发出请求查询数据库得到,当用户进入页面时,发出请求获取地区、类型、表单数据,当用户点击了列表左侧的多选框时,查看旁边便会多出一个红色的删除按钮
在这里插入图片描述

4.2 首页模块

前台首页界面上方展示最热门的三部电影,下面展示正在热映的电影列表,可以根据下面的翻页器实现翻页功能。点击图片下方的查看按钮即可跳转到电影详情界面,点击购票按钮即可跳转到影院选择界面。点击电影图片可以跳转到电影详情界面,根据设计得出的首页模块页面
在这里插入图片描述

4.3 目录页模块

目录页最上方展示一个电影查询输入框,一排由查询数据库中信息生成的电影地区选择项和另一排电影类型选择项,下方展示和首页一样的电影卡片列表,列表功能与首页类似,不再赘述。当用户选择地区或类型后,被选择的地区和类型便会被染为绿色
在这里插入图片描述

4.4 电影详情模块

电影详情界面上方展示电影的海报和基本信息,下方展示电影的剧情介绍和演员信息表。在上方展示信息的地方有一个橙色的购票按钮,点击即可跳转到影院选择界面。
在这里插入图片描述

4.5 影院选择模块

影院选择界面与电影详情界面类似,上方还是显示类似的信息,但是新增了电影票房的显示,购票按钮换成了查看电影详情按钮,下方展示影院列表供用户选择。用户点击选择影院按钮,即可跳转到放映厅选择界面
在这里插入图片描述

4.6 座位选择模块

当用户选择好放映厅后,可以跳转至座位选座模块。座位选择模块上方展示客户购票进度条以及未选座、已选座、不可选的座位的图标,在下方左半部分展示座椅选择区域,在下方右半部分展示电影、影院、放映厅,票价,总价,已选的座位信息,以及确认选座按钮。用户选择点击空白的座位会变成绿色,代表已选座,再次点击会变成白色,代表可选,红色代表不可选。用户选择座位会在座位栏生成显示x排x座标签。当用户选择好至少一个座位后,点击确认选座即可跳转至订单预览界面
在这里插入图片描述

4.7 订单预览模块

用户可以通过座位选择模块的确认选座跳转至订单预览界面。订单预览界面上方展示用户购票进度条,。下方展示订单预览信息以及实际支付的价格和确认支付的按钮,当用户点击确认支付时即完成了支付,以此来模拟用户支付,之后则会跳转至订单提交成功界面。
在这里插入图片描述

4.8 我的订单模块

用户可以通过我的订单模块查询到自己的订单列表,并且可以通过电影名称查询到包含输入的电影名称的订单
在这里插入图片描述

五、 系统测试

5.1 测试规划和设计

系统测试是尽可能发现系统中存在的缺陷,而使系统的所实现的功能满足用户的需求,因此系统测试需要根据影云线上购票管理平台的用户需求进行测试用例的设计,并最终根据测试所得到的结果与用户的需求进行对比,得出系统的功能是否符合用户的需求。
系统测试范围是对电影管理模块的添加、删除、编辑、查询等功能,对添加、编辑的表单验证进行测试,对电影目录页的电影按名、按地区、按类型查询功能进行测试,对用户购票流程进行测试。
测试方法采用黑盒测试的方法对电影管理模块、电影目录页、用户购票流程进行测试,黑盒测试的方法是把系统当做一个黑盒子,不需要关注系统内部的代码结构,只需要关系最终用户的功能是否实现,因此更贴近用户实际的使用场景,于是采用了此测试方法来进行测试,测试的过程中不仅需要包含用户合理的操作如:在电影管理模块中按照提示输入数据并最终点击确定,还要包括不合理的操作如:用户啥也不输入,或者是输入不符合输入提示要求的数据点击添加,系统需要对用户的合理的输入数据进行正确的处理,还需要对用户的不合理的输入数据进行正确的处理,保证系统正常、可靠地运行,而不至于崩溃。

5.2 模块测试

5.3 测试总结

以上就是对电影管理、电影目录页、用户购票模块的功能测试,通过执行设计的测试用例。
电影管理模块执行增、删、改、查的测试用例能够正常实现对应的功能,实现结果与预期结果一致,满足用户的需求。
电影目录页经过测试能够实现对电影的查询和分类查询功能与预期结果一致,满足用户的需求。
用户购票流程功能正常,能够正常选座,生成订单,提交订单,执行结果与预期结果一致,满足用户的需求。
综上所述,系统所实现的功能经过测试满足用户的需求。

六、 总结与展望

6.1 总结

经过的和组员的共同努力把这个项目完成了,虽然在其中遇到了很多问题,例如:时间回显后无法修改,时间传值给后端后会少8小时,前后端分离图片数据传递,因为异步造成的与预期不一致等问题,但是最后这些困难都被克服了。经过这次实训,加深了对Java的基础知识的认识,其中学习到的Lambda表达式在对集合数据处理的时候极大地加快了编码效率。随着Spring Boot、MyBaits、MyBatis-Plus的引入使项目功能开发更加集中于业务逻辑的编写。随着Vue框架的引入,前端的数据处理更加地方便。随着Element UI的引入,前端的界面布局,数据展示,表单编写界面更加美观,更快捷地实现界面的样式,虽然在前端编写一些功能函数调用时因为遇到了一些问题,导致项目开发效率极大地下降,但是好在最终还是发现了问题并得到了解决。总的来说,通过这次实训,一次练习项目的编写,一次真正从需求分析开始的项目的编写,逐步地提高了编码能力,和解决问题能力,最终完成本次项目。
本论文的主要工作有:
1、电影信息管理模块的需求分析、设计、实现介绍、测试,并实现了对电影信息的增删改查和电影图片的前后端分离的传输。
2、前台首页、目录页的原型设计和界面实现及目录页测试的介绍,实现了电影的展示及电影信息查看、购票跳转。
3、影院选择界面的原型设计和界面实现的介绍,实现了影院列表的展示和分页。
4、选座界面的原型设计和座位生成实现的介绍,实现了用户所选的电影、影院、放映厅信息的展示和放映厅座位的展示以及用户所选座位的生成。
5、订单预览界面的原型设计和订单预览表单生成的介绍,实现了用户预览订单的功能。
6、我的订单界面的原型设计和界面的实现的介绍和测试查看的验证,实现了用户通过我的订单查看用户的订单的功能。

6.2 展望

目前因为技术原因,还无法实现支付功能,但是随着技术的不断积累,能力的不断提高,一定可以实现本项目的支付功能,把项目的排版优化,把数据查询的效率提高,使项目的界面更加好看,更加高效。

七、源码获取

大家点赞、收藏、关注、评论啦 ,私信获取联系方式

举报

相关推荐

0 条评论