运行结果
运行代码
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--引入组件库-->
<script src="js/jquery.min.js"></script>
<script src="js/vue.js"></script>
<script src="js/element.js"></script>
<script src="js/axios-0.18.0.js"></script>
<link rel="stylesheet" href="js/element.css">
<title>用户管理</title>
</head>
<body>
<div id="app">
<div v-if="tableData1.code==1">
<el-container style="height: 100vh; display: flex; flex-direction: row;">
<!--侧边栏-->
<el-aside width="200px" >
<el-menu background-color="#FEF5E4" text-color="#F09466" active-text-color="#ffd04b" style="position: absolute;top: 100px;">
<el-menu-item index="1">
<i class="el-icon-menu"></i>
<span slot="title">
用户管理
</span>
</el-menu-item>
<el-menu-item index="2">
<i class="el-icon-document"></i>
<span slot="title">
电影信息管理
</span>
</el-menu-item>
<el-menu-item index="3">
<i class="el-icon-document"></i>
<span slot="title">
场次管理
</span>
</el-menu-item>
<el-menu-item index="4">
<i class="el-icon-document"></i>
<span slot="title">
订单管理
</span>
</el-menu-item>
</el-menu>
</el-aside>
<el-container>
<!--头部-->
<el-header style="height:80px; position: sticky; top: 0;z-index: 10" >
<div>
<img src="./img/head.jpg" alt="">
影院管理系统
</div>
<el-button type="info" @click="back" style="height:40px; background-color: #D7A93A">退出</el-button>
</el-header>
<!--查询-->
<h1 align="center">场次管理</h1>
<p align="center">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="场次">
<el-input v-model="formInline.sessionid" placeholder="场次"></el-input>
</el-form-item>
<el-form-item label="电影">
<el-input v-model="formInline.movieid" placeholder="电影"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</p>
<!-- 主要内容区-->
<el-main style="flex: 1; overflow: auto;">
<el-table
:data="tableData.filter(data => !search || data.sessionid.toLowerCase().includes(search.toLowerCase()))"
style="width: 100%">
<el-table-column
label="场次"
prop="sessionid">
</el-table-column>
<el-table-column
label="电影"
prop="movieid">
</el-table-column>
<el-table-column
label="影厅号"
prop="theaterhallid">
</el-table-column>
<el-table-column
label="票价"
prop="ticketprice">
</el-table-column>
<el-table-column
label="放映时间"
prop="screeningdatetime">
</el-table-column>
<el-table-column
label="座位号"
prop="seatcount">
</el-table-column>
<el-table-column
align="right">
<template slot="header" slot-scope="scope">
<el-input
v-model="search"
size="mini"
placeholder="输入关键字搜索"/>
</template>
<template slot-scope="scope">
<!--编辑信息弹框-->
<el-dialog title="编辑场次信息" :visible.sync="editRule.editDialog" width="50%" center>
<el-form :model="editRule.ruleForm" label-width="100px">
<el-row :gutter="20">
<el-col :span="20">
<el-form-item label="场次编号" prop="sessionid">
<el-row :gutter="4">
<el-col :span="12" class="checkRule_list">
<el-input v-model="SreSession.sessionid" placeholder="请输入场次编号"></el-input>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="20">
<el-form-item label="电影编号" prop="movieid">
<el-row :gutter="4">
<el-col :span="12" class="checkRule_list">
<el-input v-model="SreSession.movieid" placeholder="请输入电影编号"></el-input>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="20">
<el-form-item label="影厅号" prop="theaterhallid">
<el-row :gutter="4">
<el-col :span="12" class="checkRule_list">
<el-input v-model="SreSession.theaterhallid" placeholder="请输入影厅号"></el-input>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="20">
<el-form-item label="放映日期" prop="screeningdatetime">
<el-row :gutter="4">
<el-col :span="12" class="checkRule_list">
<el-input v-model="SreSession.screeningdatetime" placeholder="请输入放映日期"></el-input>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="20">
<el-form-item label="票价" prop="ticketprice">
<el-row :gutter="4">
<el-col :span="12" class="checkRule_list">
<el-input v-model="SreSession.ticketprice" placeholder="请输入票价"></el-input>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="20">
<el-form-item label="座位号" prop="seatcount">
<el-row :gutter="4">
<el-col :span="12" class="checkRule_list">
<el-input v-model="SreSession.seatcount" placeholder="请输入座位号"></el-input>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
</el-form>
<span slot="footer" class="checkRule_footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="update">确 定</el-button>
</span>
</el-dialog>
<el-button size="mini" @click="handleEdit(scope.$index, scope.row)">Edit</el-button>
<el-button
size="mini"
type="danger"
@click="handleDelete(scope.row)">Delete</el-button>
</template>
</el-table-column>
</el-table>
<!--分页-->
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[4,6,8,10]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</el-card>
</el-main>
</el-container>
</el-container>
</div>
<div v-else-if="tableData1.code==0">
{{tableData1.code}}没有权限访问！
</div>
</div>
</body>
<script>
new Vue({
el: "#app",
data: {
search: '',
total:null,// 用于显示总条目数的变量
currentPage: 1,
pageSize: 10, // 默认每页显示15条数据
currentPageData: [], // 当前页显示的数据
tableData: [],
formInline:{
sessionid:'',
movieid:'',
},//编辑规则
editRule: {
editDialog: false, //弹窗
},
SreSession:{},
//验证是否发登录
tableData1: {
code:"" ,
msg:"" ,
data:""
},
},
methods:{
//退出
back(){
var URL='/scres/logout';
axios.get(URL).then(res=>{
location.href='login.html'
})
},
handleSizeChange(val) {
this.pageSize = val;
this.currentPage = 1; // 通常改变每页大小后，回到第一页
this.findAll();
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
this.currentPage = val;
this.findAll();
console.log(`当前页: ${val}`);
},
handleDelete(row) {
if (window.confirm("确定要删除该条数据吗？？？")) {
axios.delete(`/deleteScreSession?sessionid=${row.sessionid}`) // 假设row有一个SessionID属性
.then((response) => {
alert("删除成功");
this.findAll(); // 假设这个方法会从后端获取数据并更新UI
})
.catch((error) => {
console.error(error);
alert("删除失败，请稍后再试：" + error.message); // 显示更详细的错误信息
});
}
},
findAll() {
var url = `/scresession/${this.currentPage}/${this.pageSize}`
axios.get(url)
.then(res => {
this.tableData = res.data.data.rows; // 假设这里是实际数据的数组
this.total = res.data.data.total;
console.log(this.tableData);
console.log(this.total);
}).catch(error => {
console.error(error);
});
},
onSubmit() {
var url = `/scresession1/${this.currentPage}/${this.pageSize}?sessionid=${encodeURIComponent(this.formInline.sessionid)}&movieid=${encodeURIComponent(this.formInline.movieid)}`
console.log(this.formInline.sessionid);
console.log(this.formInline.movieid);
axios.get(url)
.then(res => {
this.tableData = res.data.data.rows;
this.total = res.data.data.total;
console.log(this.tableData);
console.log(this.total);
}).catch(err => {
console.error(err);
})
},
//编辑
handleEdit(index, row) {
this.editRule.editDialog = true;
var URL = `sessionfindById/${row.sessionid}`
axios.get(URL).then(response => {
if (response.data.code) {
this.SreSession = response.data.data;
}
}).catch(error => {
})
console.log(index, row);
},
//取消弹框
cancel() {
this.editRule.editDialog = false;
},
//弹框编辑信息并确认
update: function () {
var URL = 'editScreSession';
//put请求用于更新资源.url 是你想要更新的资源的地址;this.poet是包含更新后数据的对象，这个对象将被发送到服务器以更新资源。
axios.put(URL, this.SreSession).then(res => {
if (res.data.code) {
this.editRule.editDialog = false;
location.href = 'ScreeningSession.html';
} else {
alert(res.data.message);
}
}).catch(error => {
})
},
},
created() {
this.findAll();
},
mounted() {
//登录验证
var url = `/scres/index`
axios.get(url)
.then(response => {
this.tableData1 = response.data;
console.log(this.tableData1);
})
.catch(error=>{
console.error(error);
})
}
})
</script>
<style>
a {
color: white;
text-decoration: none;
}
.el-header {
background-color: #FEF5E4;
display: flex;
justify-content: space-between;
align-items: center;
color: #F09466;
font-size: 40px;
}
> div {
display: flex;
align-items: center;
}
img {
width: 55px;
border-radius: 50%;
background-color: #eee;
}
.el-aside {
background-color:#FEF5E4;
height: 100%;
}
body>.el-container {
margin-bottom: 40px;
}
.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
line-height: 260px;
}
.el-container:nth-child(7) .el-aside {
line-height: 280px;
}
</style>
</html>
ScreSessionMapper1.java
package com.example.Mapper;
import com.example.pojo.Manager;
import com.example.pojo.SreSession;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Param;
import java.util.List;
@Mapper
public interface ScreSessionMapper1 {
public List<SreSession> list_chaxun(@Param("sessionid") Integer sessionid, @Param("movieid") Integer movieid);
public List<SreSession> list();
public List<SreSession> findAll();
public int deleteScreSession(Integer sessionid);
public SreSession ScreSessionfindById(Integer sessionid);
public int add(SreSession sreSession);
public boolean editScreSession(SreSession sreSession);
public Manager getByManager(Manager manager);
}
ScreSessionMapper1.xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.example.mapper.ScreSessionMapper1">
<!-- 查询 -->
<select id="list" resultType="com.example.pojo.SreSession">
select * from screeningsession
</select>
<!-- 条件分页查询 -->
<select id="list_chaxun" resultType="com.example.pojo.SreSession">
select * from screeningsession
<where>
<if test="sessionid != null and sessionid != ''">
name like concat('%',#{sessionid},'%')
</if>
<if test="movieid != null and movieid != ''">
and movieid like concat('%',#{movieid},'%')
</if>
</where>
</select>
<!-- findAll -->
<select id="findAll" resultType="com.example.pojo.SreSession">
select * from screeningsession
</select>
<!-- 删除 -->
<delete id="deleteScreSession" parameterType="java.lang.Integer">
DELETE FROM screeningsession WHERE sessionid = #{sessionid}
</delete>
<!-- 增加-->
<select id="ScreSessionfindById" parameterType="java.lang.Integer" resultType="com.example.pojo.SreSession">
SELECT * FROM screeningsession WHERE sessionid = #{sessionid}
</select>
<!-- 添加一个SreSession -->
<insert id="add" parameterType="com.example.pojo.SreSession">
INSERT INTO screeningsession (sessionid, movieid,theaterhallid,screeningdatetime,ticketprice,seatcount) VALUES (#{sessionid}, #{movieid}, #{theaterhallid},#{screeningdatetime},#{ticketprice},#{seatcount},)
</insert>
<!-- 更新一个SreSession -->
<update id="editScreSession" parameterType="com.example.pojo.SreSession">
UPDATE screeningsession
SET sessionid = #{sessionid}, movieid = #{movieid}, theaterhallid = #{theaterhallid}, screeningdatetime = #{screeningdatetime},ticketprice = #{ticketprice},seatcount = #{seatcount},
WHERE sessionid = #{sessionid}
<!-- 注意：这里需要根据SreSession的可更新属性和数据库表的实际列进行替换 -->
</update>
<!--登录-->
<select id="getByManager" parameterType="com.example.pojo.Manager" resultType="com.example.pojo.Manager">
select * from manager where username=#{username} and password=#{password}
</select>
</mapper>
ScreSessionService .java
package com.example.Service;
import com.example.pojo.Manager;
import com.example.pojo.PageBean;
import com.example.pojo.SreSession;
import java.util.List;
public interface ScreSessionService {
/* public List<SreSession> list();
*/
public List<SreSession> findAll();
public SreSession scresessionfindById(Integer sessionid);
public int deleteScreSession(Integer sessionid);
public boolean addUser(SreSession sreSession);
public boolean editScreSession(SreSession sreSession);
public PageBean list(Integer page,Integer pageSize);
public PageBean list_chaxun(Integer page, Integer pageSize, Integer sessionid, Integer movieid);
public Manager login(Manager manager);
}
ScreSessionImpl.java
package com.example.Service.impl;
import com.example.Mapper.ScreSessionMapper;
import com.example.Service.ScreSessionService;
import com.example.pojo.Manager;
import com.example.pojo.PageBean;
import com.example.pojo.SreSession;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;
@Service
public class ScreSessionImpl implements ScreSessionService {
@Autowired
private ScreSessionMapper screSessionMapper;
/*@Override
public List<SreSession> list(){return screSessionMapper.list();}
//直接返回数据*/
@Override
public List<SreSession> findAll(){
return screSessionMapper.findAll();
}
//按照id查询
@Override
public SreSession scresessionfindById(Integer sessionid){return screSessionMapper.ScreSessionfindById(sessionid);}
//按id删除
@Override
public int deleteScreSession(Integer sessionid){return screSessionMapper.deleteScreSession(sessionid);}
/* //增加
@Override
public boolean addUser(SreSession sreSession){
int result=screSessionMapper.add(sreSession);
return result==1;
}*/
//增加
@Override
public boolean addUser(SreSession sreSession) {
int result = screSessionMapper.add(sreSession);
return result > 0;
}
//修改
@Override
public boolean editScreSession(SreSession sreSession){return screSessionMapper.editScreSession(sreSession);}
@Override
public PageBean list(Integer page, Integer pageSize){
// 当你调用了这个方法之后，紧接着执行的MyBatis查询（通常是一个 select 语句）就会自动被 PageHelper 插件处理，从而只返回指定页的数据。
// 例如，如果你调用了 PageHelper.startPage(2, 10);，然后执行了一个查询，那么你将得到第2页的数据，每页包含10条记录。这意味着你将得到数据库中第11到20条记录（假设记录是从1开始编号的）。
//设置分页参数
PageHelper.startPage(page,pageSize);
//执行分页查询
List<SreSession> scresessionList=screSessionMapper.findAll();
//获取分页结果 PageInfo是一个工具类，它接收一个查询结果列表作为参数，并自动分析这个列表来获取分页信息
PageInfo<SreSession> p=new PageInfo<>(scresessionList);
//封装PageBean
PageBean pageBean=new PageBean(p.getTotal(),p.getList());
System.out.println(page+pageSize);
return pageBean;
}
@Override
public PageBean list_chaxun(Integer page,Integer pageSize,Integer sessionid,Integer movieid){
//设置分页参数
PageHelper.startPage(page,pageSize);
List<SreSession> scresessionList=screSessionMapper.list_chaxun(sessionid,movieid);
//System.out.println(poetList);
//获取分页结果 PageInfo是一个工具类，它接收一个查询结果列表作为参数，并自动分析这个列表来获取分页信息
PageInfo<SreSession> p=new PageInfo<>(scresessionList);
//封装PageBean
PageBean pageBean=new PageBean(p.getTotal(),p.getList());
return pageBean;
}
//登录
@Override
public Manager login(Manager manager){
return screSessionMapper.getByManager(manager);
}
}
Manager.java
package com.example.pojo;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Manager {
private Integer id;
private String username;
private String password;
private String name;
private String gender;
private String position;
}
107
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
