项目编号：BS-XX-173
一，项目简介
随着我国旅游设施网络购票平台的快速发展，各种基于互联网的企业与服务也在快速发展。网络购票平台改变了人们购票的方式，人们开始使用网络购票平台进行购票和预约。对于个人用户而言，相较于线下购票是设施，网络购票平台空间更大，更廉价，也更利于不同设备之间、不同地区之间的文件传输。互联网其中一个理念便是为了让各个用户更加便利，网络购票平台的出现促进了这一理念的发展。大量网络论坛推行网络购票平台进行设施传播，人们将自己锁游玩的地方、踩过的景点坑、珍藏的景色照片上传至网络上，并在论坛中发帖对景点进行描述、
二，环境介绍
语言环境：Java: jdk1.8
数据库：Mysql: mysql5.7
应用服务器：Tomcat: tomcat8.5.31
开发工具：IDEA或eclipse
后台开发技术：springboot+mybatis
前台开发技术：vue+elementui
三，系统展示
5.1 用户模块
5.1.1 注册与登录
用户前注册页面是Register.vue实现的，登录页面是由login.vue实现的。用户注册时首先输入的是用户名和密码，然后接收到系统发送的验证码成功输入验证码后前端将数据传入后端sysUser传到后端，后端接收后首先会判断输入的账号是否存在，密码是否符合范式规则，如果不不符合那么会弹出提示框告诉用户密码不合格或者账户已存在。如果密码和账户都通过那么会从gouyan_admin模块中的sysUserController类调用其中的方法在再调用UserService中的注册方法从而将数据传输的userMapper类中最后由userMapper将数据提交到数据完成注册。注册时密码在userservice中有spring自带的密码加密工具类完成了加密。这样可以保证用户的隐私和个人信息安全还有账户安全。然后最后登录后再跳转到登录页面。注册页面如图-所示
注册成功后就能开始登录了。输入用户名和密码后点击登录按钮前端会通过、/sysUser接口将数据传输到后端，首先会判断你的账户是否存在还有判断你的密码是否正确，如若出现问题那么会弹出提示框告诉你账号或者密码错误。正确的话那么会完成登人后跳转的首页welcome.Vue页面中。登录页面如图5-2所示。
图5-1 注册页面
图5-2 登录页面
5.1.2 用户信息
用户信息页面是由userinfo.vue页面实现的，在进入系统之后用户可以通过点击右上角的个人头像进入个人信息页面。前端会将你的用户id通过/sysUser/getuser接口传入后端获取到你的个人信息。前端接收到回传的信息后将信息渲染到页面上。界面实现效果图如5-3所示。
图5-3 用户信息页面
5.1.3用户信息添加和修改
用户信息修改也是通过userinfo.vue页面实现的，在用户信息也面补全信息或者修改用户名。修改信息通过保存按钮提交数据，通过/SysUser接口进行数据的修改，通过此接口可以完成调用服务层的修改方法从而完成修改。最后经过userMapper将数据的提交至数据完成修改。修改数据页面如图5-4所示。
图5-4 用户信息修改页面
5.1.4用户查看订单功能
用户查看订单功能是通过点击左侧的菜单栏进入订单详情页面，是通过BIllinfo。vue和userMenu.vue页面一同实现的。在进入订单详情页之后通过/sysBill/id接口带着ID值传输到后端。通过其控制层调用BIllService中查询订单方法去取得订单信息，然后回传到前端，前端获取回传的信息将数据渲染到前端页面供用户查看。订单详情页面如图5-5所示。
图5-5 订单详情页面
5.2 推荐模块
5.2.1 人气乐园轮播
登录第一个跳转的是乐园主页，映入眼帘的是评分比较高的人气乐园的轮播图。是通过/sysMoive接口跳转至后台用sysMovieController类调movieservice类中的查询计算方法然后将排满靠前的海底世界游玩项目数据查询出来然后回传到前端页面，再有welcome.Vue页面中的动画轮播方法进行轮播。该方法来源于elemnet——ui，中的watch方法进行动画轮播。页面图如5-6所示。
图5-6 轮播页面图
5.2.2 最高评分推荐
最高评分推荐功能是登录之后再主页的上方点击主页的评分标签，进入评分推荐的页面是将评分比较的不错的电影放入评分捡推荐中，这个功能是供movietop.vue实现的。点击进入后，前端会通过接口/movie将数据传入后台，后台通过movieservice的中的方法将评分电影查询出来。后台在将数据回传到前端，前端得到数据后再将数据渲染到页面供用户查看。评分推荐页面如图5-7所示。
图5-7 人气推荐页面图
5.2.3 口碑评分推荐
口碑推荐功能是登录之后再主页的上方点击主页的口碑标签，进入口碑推荐的页面是将口碑比较的不错的电影放入口碑捡推荐中，这个功能是供movie.vue实现的。点击进入后，前端会通过接口/movie将数据传入后台，后台通过movieservice的中的方法将口碑电影查询出来。后台在将数据回传到前端，前端得到数据后再将数据渲染到页面供用户查看。口碑推荐页面如图5-7所示。
图5-8 口碑推荐页面图
5.3 评论模块
5.3.1 评论功能
评论功能是给观看后的用户有评价的权利，如果海底世界自身十分优秀，那么用户肯定不会吝啬自己的评价者就是已相当于一次广告机会。评论功能是通过MovieInfo.vue进行实现的。用户评论完点击提交按钮那么前端会通过/movieinfo将数据传入后端.接收到数据movieservice会调用movieMapper方法将数据写入数据库，写入成功后会弹出提示框告诉用户已经评论成功。评论功能如图5-9所示。
图5-9 评论页面图
5.3.2 评分功能
评分功能是给观看后的用户有评分的权利，如果海底世界自身十分优秀，那么用户肯定不会吝啬自己的评价者就是已相当于一次广告机会。评分过高可以使该乐园上本平台的推荐位置。评分功能是通过MovieInfo.vue进行实现的。用户评论完点击提交按钮那么前端会通过/movieinfo将数据传入后端.接收到数据movieservice会调用movieMapper方法将数据写入数据库，写入成功后会弹出提示框告诉用户已经评论成功。评分功能如图5-10所示
图5-10 评分页面图
5.3.3 点赞功能
点赞功能是让用户对各种评价进行点赞，评分功能是通过MovieInfo.vue进行实现的。用户点赞完点击提交按钮那么前端会通过/movieinfo将数据传入后端.接收到数据movieservice会调用movieMapper方法将数据写入数据库，写入成功后会弹出提示框告诉用户已经点赞成功。点赞功能如图5-11所示
图5-11 点赞页面图
5.4 支付模块
5.4.1 支付功能
支付功能是通过ChooseSeat.vue 和BillDetail.vue实现用户点击购票后会跳转到支付页面叫观众进行选座购票。确定后会跳转至支付页面，支付成功通过/BillDetail接口调用/bill接口去调用service然后生成订单打印票。功能实现图如图5-12所示
图5-12 支付功能页面图
售票系统|基于springboot+vue+elementui实现海底世界售票系统（二）https://developer.aliyun.com/article/1423357
