SpringBoot_Vue实现电影院售票系统

1.技术介绍
SpringBoot+Mybatis+mysql+Vue
开发工具：eclipse或IDEA
2.主要功能说明：
用户端：
注册、登录、首页、电影院、购票、支付、查看个人信息、查看订单
管理后台：
数据显示、用户管理、电影管理、影院管理、影厅管理、电影排片、评论管理、订单管理
3.部分代码展示
用户端首页

```java
<template>
<section class="home">
<header class="header">
<van-row type="flex">
<van-col span="4">
<van-dropdown-menu>
<van-dropdown-item v-model="value" :options="option"/>
</van-dropdown-menu>
</van-col>
<van-col span="20">
<van-search style="height: 3rem" shape="round" disabled
placeholder="请输入电影、影院名称"
@click="$router.push('/search')"/>
</van-col>
</van-row>
</header>
<MySwiper/>
<van-grid direction="horizontal" :column-num="2">
<van-grid-item icon="fire-o" text="正在热映" @click="$router.push('/movie')"/>
<van-grid-item icon="tv-o" text="影院" @click="$router.push('/cinema')"/>
</van-grid>
<main class="main_container">
<div>
<div class="op1"><span class="left">正在热映</span><span class="right"
@click="$router.push({path:'/movie',query:{hotMovie:1}})">共{{
movieList.length
}}部<van-icon
name="arrow"/></span></div>
<div class="movie_list">
<div class="item" v-for="(item,index) in movieList.slice(0,4)" :key="index">
<van-image width="5rem" height="6rem" fit="cover"
:src="getPoster(item.poster)"
@click="$router.push({path:'/movie_detail',query:{movie_id:item.movie_id}})"/>
<!--<img width="5rem" height="6rem" fit="cover"
:src="item.poster"
@click="$router.push({path:'/movie_detail',query:{movie_id:item.movie_id}})"/> -->
<div style="position: relative">
<div class="describe">
<span class="name ellipsis">{{ item.movie_name }}</span>
<span class="score" v-if="item.score"><i
class="interger">{{ item.score.toFixed(1).split('.')[0] }}</i>.<i class="fraction">{{
item.score.toFixed(1).split('.')[1]
}}分</i></span>
<span class="score" v-else>暂无评分</span>
</div>
</div>
<van-button size="mini" color="red"
@click="$router.push({path:'/select_cinema',query:{movie_id:item.movie_id}})">购买
</van-button>
</div>
</div>
</div>
<div>
<div class="op2"><span class="left">即将上映</span><span class="right"
@click="$router.push({path:'/movie',query:{hotMovie:0}})">共{{
notShowMovieList.length
}}部<van-icon
name="arrow"/></span></div>
<div class="movie_list">
<div class="item" v-for="(item,index) in notShowMovieList.slice(0,4)" :key="index">
<van-image width="5rem" height="6rem" fit="cover"
:src="getPoster(item.poster)"
@click="$router.push({path:'/movie_detail',query:{movie_id:item.movie_id}})"/>
<!-- <van-image width="5rem" height="6rem" fit="cover"
:src="item.poster"
@click="$router.push({path:'/movie_detail',query:{movie_id:item.movie_id}})"/> -->
<div style="position: relative">
<div class="peopleNumber">
<span class="num">{{ item.wish_num }}人想看</span>
</div>
</div>
<div class="presell">
<div class="name ellipsis">{{ item.movie_name }}</div>
<div class="info">
<span
class="date"
style="color: #ffb400;font-size: .725rem">{{
item.show_date.split('-')[1]
}}月{{
item.show_date.split('-')[2]
}}日</span>
<van-button size="mini" type="info"
@click="$router.push({path:'/select_cinema',query:{movie_id:item.movie_id}})">
预售
</van-button>
</div>
</div>
</div>
</div>
</div>
</main>
</section>
</template>
```
4.系统演示地址：
链接：https://pan.baidu.com/s/1v-1QDsCQ-hm8fF4HAA2QrQ
提取码：o735

标签：售票,Vue,SpringBoot,movie,click,item,push,router,id
来源： https://www.cnblogs.com/xiao123456789/p/16456525.html