大家好，又见面了，我是你们的朋友全栈君。

资源下载：
https://download.csdn.net/download/weixin_44893902/25706959

一、语言和环境

1. 实现语言：Java语言

2. 环境要求：eclipse/myeclipse /idea、maven、mysql

3. 使用技术：Spring、SpringMVC、MyBatis、连接池和 json 包自行选择

二、实现功能

密室逃脱游戏越来越受年轻人的喜欢,现在将各地密室游戏主题进行排名,评选2021年度最受玩家喜欢的密室主题。

说明：下列界面样式仅供参考，实际完成效果美观合理即可。

1、显示数据

根据图1格式,显示t_games表中所有的数据，并且按照【票数】列进行降序排序，其实【主题种类】一列在t_games表存的是数字,需结合t_gamesType表中对应id值显示出种类文字。每行数据后面有一个投票按钮可向对应主题进行投票。

2、查询数据

可根据【主题名称】和【主题类型】进行数据查询。若【主题名称】为空,则按照【主题类型】查询,若【主题名称】不为空,则需要根据【主题名称】进行模糊查询并且也要结合【主题类型】查询。【主题类型】需是下拉框,且里面的选项是从数据库表t_gamesType中查询出来。如图所示。

3、投票功能

点击【操作】列中的投票按钮,弹出一个二次确认框,再次点击确定,可为对应的主题投票,投票成功后,该数据票数+1，如图所示：

投票数据刷新后,若票数有变化,要按新的数据进行降序排序，如图所示：

4、新增主题

点击新增按钮，进入新增页面,主题种类中的选项需要去数据库中t_gamesType表查询，上线时间需要date控件，点击新增按钮后，将数据插入数据表中，新增主题票数默认为0，并返回主页面显示最新数据，如图所示：

三、数据库设计

1、创建数据库：gamesDB。

2、创建密室排行数据表（t_games）

结构如下：

表名：t_ games
实体名称：密室排行数据表
主键：id

四、推荐步骤

1、使用MySql创建数据库，创建对应的2张表，按照要求插入数据。

t_games表

t_gamesType表

2、使用开发工具创建项目，使用maven添加spring、springMVC、mybatis、连接池等相关依赖坐标。

3、完成MyBatis持久层功能操作，分别针对2个表完成对应的功能编写。

4、完成业务逻辑层接口、实现类的功能实现。

5、完成控制器对应的功能编写

6、创建界面分别和控制器进行交互实现相应的功能

7 斜体样式、部署项目到Tomcat，运行访问测试项目是否正常

五、实现代码

1、MySQL数据库

gamesdb.sql

/* Navicat MySQL Data Transfer Date: 2021-07-27 20:29:20 */
SET FOREIGN_KEY_CHECKS=0;
-- ----------------------------
-- Table structure for `t_games`
-- ----------------------------
DROP TABLE IF EXISTS `t_games`;
CREATE TABLE `t_games` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`games_name` varchar(255) DEFAULT NULL,
`games_type` int(11) DEFAULT NULL,
`producers` varchar(255) DEFAULT NULL,
`uptime` varchar(255) DEFAULT NULL,
`votes` int(11) unsigned zerofill DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8;
-- ----------------------------
-- Records of t_games
-- ----------------------------
INSERT INTO `t_games` VALUES ('1', '黑暗侵袭', '1', '911地下城', '2019-07-01', '00000005400');
INSERT INTO `t_games` VALUES ('2', '寂静之地', '1', '911地下城', '2021-04-10', '00000003421');
INSERT INTO `t_games` VALUES ('3', '潜伏', '2', '长沙支眼文化有限公司', '2020-06-20', '00000002339');
INSERT INTO `t_games` VALUES ('4', '复活石', '3', '对角巷', '2020-08-30', '00000002340');
INSERT INTO `t_games` VALUES ('5', '西游记', '1', '文化传媒', '2021-07-27', '00000000007');
-- ----------------------------
-- Table structure for `t_gamestype`
-- ----------------------------
DROP TABLE IF EXISTS `t_gamestype`;
CREATE TABLE `t_gamestype` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`type_name` varchar(50) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8;
-- ----------------------------
-- Records of t_gamestype
-- ----------------------------
INSERT INTO `t_gamestype` VALUES ('1', '恐怖');
INSERT INTO `t_gamestype` VALUES ('2', '谍战');
INSERT INTO `t_gamestype` VALUES ('3', '解谜');

2、JAVA代码

gamesDB

(1) com.cst.controller【控制层】

① TGamesController,java

package com.cst.controller;
import java.util.List;
import javax.annotation.Resource;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import com.cst.entity.TGames;
import com.cst.service.TGamesService;
@Controller
public class TGamesController { 

@Resource
TGamesService tGamesService;
//查询所有数据，模糊查询
@RequestMapping("/tGamesList")
public String accountList(Model model,String keyword,String type){ 

List<TGames> selectAll = tGamesService.selectAll(keyword,type);
model.addAttribute("selectAll",selectAll);
return "games";
}
//进入添加的方法
@RequestMapping("/addGames")
public String addAccount() { 

return "addGames";
}	
//执行添加的操作
@RequestMapping("/addGamesDo")
public String addAccountDo(TGames games) { 

games.setVotes(0);
int users = tGamesService.insert(games);
if (users>0) { 

return "redirect:/tGamesList.do";
}else { 

return "forward:/addGames.do";
}
}
@RequestMapping("/updateGamesDo")
public String updateGamesDo(Integer id,Integer votes) { 

TGames games=new TGames();
int votes1=votes+1;
games.setId(id);
games.setVotes(votes1);
tGamesService.updateByPrimaryKey(games);
return "redirect:/tGamesList.do";
}
}

(2) com.cst.dao【数据库访问层】

① TGamesMapper.java

package com.cst.dao;
import com.cst.entity.TGames;
import java.util.List;
import org.apache.ibatis.annotations.Param;
public interface TGamesMapper { 

int deleteByPrimaryKey(Integer id);
int insert(TGames record);
TGames selectByPrimaryKey(Integer id);
List<TGames> selectAll(@Param("keyword")String keyword,@Param("type")String type);
int updateByPrimaryKey(TGames record);
}

② TGamestypeMapper.java

package com.cst.dao;
import com.cst.entity.TGamestype;
import java.util.List;
public interface TGamestypeMapper { 

int deleteByPrimaryKey(Integer id);
int insert(TGamestype record);
TGamestype selectByPrimaryKey(Integer id);
List<TGamestype> selectAll();
int updateByPrimaryKey(TGamestype record);
}

③ TGamesMapper.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.cst.dao.TGamesMapper" >
<resultMap id="BaseResultMap" type="com.cst.entity.TGames" >
<id column="id" property="id" jdbcType="INTEGER" />
<result column="games_name" property="gamesName" jdbcType="VARCHAR" />
<result column="games_type" property="gamesType" jdbcType="INTEGER" />
<result column="producers" property="producers" jdbcType="VARCHAR" />
<result column="uptime" property="uptime" jdbcType="VARCHAR" />
<result column="votes" property="votes" jdbcType="INTEGER" />
<result column="type_name" property="typeName" jdbcType="VARCHAR" />
</resultMap>
<delete id="deleteByPrimaryKey" parameterType="java.lang.Integer" >
delete from t_games
where id = #{id,jdbcType=INTEGER}
</delete>
<insert id="insert" parameterType="com.cst.entity.TGames" >
insert into t_games (id, games_name, games_type, 
producers, uptime, votes
)
values (#{id,jdbcType=INTEGER}, #{gamesName,jdbcType=VARCHAR}, #{gamesType,jdbcType=INTEGER}, 
#{producers,jdbcType=VARCHAR}, #{uptime,jdbcType=VARCHAR}, #{votes,jdbcType=INTEGER}
)
</insert>
<update id="updateByPrimaryKey" parameterType="com.cst.entity.TGames" >
update t_games
set votes = #{votes,jdbcType=INTEGER}
where id = #{id,jdbcType=INTEGER}
</update>
<select id="selectByPrimaryKey" resultMap="BaseResultMap" parameterType="java.lang.Integer" >
select id, games_name, games_type, producers, uptime, votes
from t_games
where id = #{id,jdbcType=INTEGER}
</select>
<select id="selectAll" resultMap="BaseResultMap" >
select g.id, games_name, type_name, producers, uptime, votes
from t_games g,t_gamestype t where g.games_type=t.id
<if test="keyword!=null and keyword!=''">
and games_name like concat('%', #{keyword}, '%')
</if>
<if test="type!=null and type!=''">
and type_name=#{type}
</if>
order by votes desc
</select>
</mapper>

④ TGamestypeMapper.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.cst.dao.TGamestypeMapper" >
<resultMap id="BaseResultMap" type="com.cst.entity.TGamestype" >
<id column="id" property="id" jdbcType="INTEGER" />
<result column="type_name" property="typeName" jdbcType="VARCHAR" />
</resultMap>
<delete id="deleteByPrimaryKey" parameterType="java.lang.Integer" >
delete from t_gamestype
where id = #{id,jdbcType=INTEGER}
</delete>
<insert id="insert" parameterType="com.cst.entity.TGamestype" >
insert into t_gamestype (id, type_name)
values (#{id,jdbcType=INTEGER}, #{typeName,jdbcType=VARCHAR})
</insert>
<update id="updateByPrimaryKey" parameterType="com.cst.entity.TGamestype" >
update t_gamestype
set type_name = #{typeName,jdbcType=VARCHAR}
where id = #{id,jdbcType=INTEGER}
</update>
<select id="selectByPrimaryKey" resultMap="BaseResultMap" parameterType="java.lang.Integer" >
select id, type_name
from t_gamestype
where id = #{id,jdbcType=INTEGER}
</select>
<select id="selectAll" resultMap="BaseResultMap" >
select id, type_name
from t_gamestype
</select>
</mapper>

(3) com.cst.entity 【存放实体的包】

① TGames.java

package com.cst.entity;
public class TGames { 

private Integer id;
private String gamesName;
private Integer gamesType;
private String producers;
private String uptime;
private Integer votes;
private String typeName;
public String getTypeName() { 

return typeName;
}
public void setTypeName(String typeName) { 

this.typeName = typeName == null ? null : typeName.trim();
}
public Integer getId() { 

return id;
}
public void setId(Integer id) { 

this.id = id;
}
public String getGamesName() { 

return gamesName;
}
public void setGamesName(String gamesName) { 

this.gamesName = gamesName == null ? null : gamesName.trim();
}
public Integer getGamesType() { 

return gamesType;
}
public void setGamesType(Integer gamesType) { 

this.gamesType = gamesType;
}
public String getProducers() { 

return producers;
}
public void setProducers(String producers) { 

this.producers = producers == null ? null : producers.trim();
}
public String getUptime() { 

return uptime;
}
public void setUptime(String uptime) { 

this.uptime = uptime == null ? null : uptime.trim();
}
public Integer getVotes() { 

return votes;
}
public void setVotes(Integer votes) { 

this.votes = votes;
}
}

② TGamestype.java

package com.cst.entity;
public class TGamestype { 

private Integer id;
private String typeName;
public Integer getId() { 

return id;
}
public void setId(Integer id) { 

this.id = id;
}
public String getTypeName() { 

return typeName;
}
public void setTypeName(String typeName) { 

this.typeName = typeName == null ? null : typeName.trim();
}
}

(4) com.cst.generator【实体类自动生成包】

① Generator.java

package genter;
import java.io.IOException;
import java.io.InputStream;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;
import org.mybatis.generator.api.MyBatisGenerator;
import org.mybatis.generator.config.Configuration;
import org.mybatis.generator.config.xml.ConfigurationParser;
import org.mybatis.generator.exception.InvalidConfigurationException;
import org.mybatis.generator.exception.XMLParserException;
import org.mybatis.generator.internal.DefaultShellCallback;
public class Generator { 

/* * targetRuntime="MyBatis3Simple", 不生成Example */
public void generateMyBatis() { 

//MBG执行过程中的警告信息
List<String> warnings = new ArrayList<String>();
//当生成的代码重复时，覆盖原代码
boolean overwrite = true ;
String generatorFile = "/generatorConfig.xml";
//String generatorFile = "/generator/generatorConfigExample.xml";
//读取MBG配置文件
InputStream is = Generator.class.getResourceAsStream(generatorFile);
ConfigurationParser cp = new ConfigurationParser(warnings);
Configuration config;
try { 

config = cp.parseConfiguration(is);
DefaultShellCallback callback = new DefaultShellCallback(overwrite);
//创建MBG
MyBatisGenerator myBatisGenerator = new MyBatisGenerator(config, callback, warnings);
//执行生成代码
myBatisGenerator.generate(null);
} catch (IOException e) { 

e.printStackTrace();
} catch (XMLParserException e) { 

e.printStackTrace();
} catch (InvalidConfigurationException e) { 

e.printStackTrace();
} catch (SQLException e) { 

e.printStackTrace();
} catch (InterruptedException e) { 

e.printStackTrace();
}
for (String warning : warnings) { 

System.out.println(warning);
}
}
public static void main(String[] args) { 

Generator generator = new Generator();
generator.generateMyBatis();
}
}

(5) com.cst.service【与页面进行交互】

① TGamesService.java

package com.cst.service;
import java.util.List;
import com.cst.entity.TGames;
import com.cst.entity.TGamestype;
public interface TGamesService { 

int insert(TGames record);
List<TGames> selectAll(String keyword,String type);
int updateByPrimaryKey(TGames record);
}

(6) com.cst.service.imp【service的实现类】

① TGServiceImpl.java

package com.cst.service.imp;
import java.util.List;
import javax.annotation.Resource;
import org.springframework.stereotype.Service;
import com.cst.dao.TGamesMapper;
import com.cst.entity.TGames;
import com.cst.entity.TGamestype;
import com.cst.service.TGamesService;
@Service
public class TGServiceImpl implements TGamesService{ 

@Resource
TGamesMapper tgamesMapper; 
@Override
public List<TGames> selectAll(String keyword,String type) { 

// TODO Auto-generated method stub
List<TGames> tGamesList=tgamesMapper.selectAll(keyword,type);
return tGamesList;
}
@Override
public int insert(TGames record) { 

// TODO Auto-generated method stub
int add=tgamesMapper.insert(record);
return add;
}
@Override
public int updateByPrimaryKey(TGames record) { 

// TODO Auto-generated method stub
int updateByPrimaryKey = tgamesMapper.updateByPrimaryKey(record);
return updateByPrimaryKey;
}
}

3、JSP页面

(1) Index.jsp【设置默认打开页面】

<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
</head>
<body>
<%
String path=request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
%>
<script type="text/javascript"> window.location.href="<%=basePath%>/tGamesList.do"; </script>
</body>
</html>

(2) games.jsp【主页面】

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
%>
<style> .wrap{ 
 width: 80%; margin: 0 auto; } h1 { 
 width:40%; margin:0 auto; } a{ 
 text-decoration: none; } p{ 
 text-align: right; } h2{ 
 position:relative; left:40%; } tr:hover{ 
 background: orange; } img{ 
 width:100%; height:100%; } </style>
</head>
<body>
<div style="width: 70%;margin: 0 auto;">
<h2>2021年密室逃脱主题排行榜</h2>
<fieldset>
<legend>搜索</legend>
<div style="margin:10px">
<form action="tGamesList.do" >
主题名称：<input type="text" name="keyword" id="keyword" value="" />
类型：<select name="type">
<option selected="selected" value="">请选择</option>
<option value="恐怖">恐怖</option>
<option value="谍战">谍战</option>
<option value="解谜">解谜</option>
</select>
<input type="submit" value="搜索"/>
<a href="addGames.do"><input type="button" value="新增"/></a>
</form>
</div>
</fieldset>
<hr/>
<table width="100%" border="1px" cellpadding="5" cellspacing="0">
<tr style="background-color: gray;">
<td width="10%" align="center" >编号</td>
<td width="15%" align="center">主题名称</td>
<td width="10%" align="center">主题种类</td>
<td width="20%" align="center">出品方</td>
<td width="15%" align="center">上线时间</td>
<td width="10%" align="center">票数</td>
<td align="center" width="15%">操作</td>
</tr>
<c:forEach items="${selectAll}" var="games">
<tr align="center">
<td>
${games.id}
</td>
<td>
${games.gamesName}
</td>
<td>
${games.typeName}
</td>
<td>
${games.producers}
</td>
<td>
${games.uptime}
</td>
<td>
${games.votes}
</td>
<td>
<a href="#" onclick="delAccount(${games.id},${games.votes})">投票</a>&nbsp;&nbsp;&nbsp;&nbsp;
</td>
</tr>
</c:forEach>
<tr style="text-align: center;background-color: white;">
<td colspan="6"></td>
<td>
共计${selectAll.size()}条数据
</td>
</tr>
</table>
</div>
</body>
<script src="<%=request.getContextPath()%>/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript"> function delAccount(id,votes) { 
 if(confirm("确定投票吗？")){ 
 location.href="updateGamesDo.do?id="+id+"&votes="+votes; } } </script>
</html>

(3) addGames.jsp【添加页面】

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css"> body{ 
 width: 100%; } .wrap_table{ 
 width: 40%; margin: 0 auto; text-align: center; } table{ 
 text-align: center; margin: 0 auto; } </style>
</head>
<body>
<div class="wrap_table">
<h2>新增密室逃脱主题</h2>
<form action="addGamesDo.do" method="post">
<table border="1" cellspacing="" cellpadding="">
<tr>
<td>名称：</td>
<td><input type="text" name="gamesName" id="name" value="" /></td>
<tr>
<td>类型</td>
<td>
<select name="gamesType">
<option selected="selected" value="">请选择</option>
<option value="1">恐怖</option>
<option value="2">谍战</option>
<option value="3">解谜</option>
</select>
</td>
</tr>
<tr>
<td>出品方：</td>
<td><input type="text" name="producers" id="producers" value="" /></td>
</tr>
<tr>
<td>上线时间：</td>
<td><input type="date" name="uptime" id="number" value="" /></td>
</tr>
<tr>
<td colspan="2">
<input type="button" name="" id="button" onclick="addAccount()" value="确定" />
<input type="reset" name="" id="" value="重置" />
</td>
</tr>
</table>
</form>
</div>
<script type="text/javascript"> function addAccount() { 
 var name = document.getElementById("name").value; var number = document.getElementById("number").value; var money = document.getElementById("producers").value; var button = document.getElementById("button"); console.log(button) if(name==""){ 
 alert("名称不能为空！"); return false; }else if(number==""){ 
 alert("日期不能为空！"); return false; }else if(money==""){ 
 alert("出品方不能为空！"); return false; }else{ 
 button.setAttribute("type","submit"); } } </script>
</body>
</html>

(4) web.xml【xml配置】

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
<display-name>gamesDB</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<!--spring容器 -->
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:spring/applicationContext-*.xml</param-value>
</context-param>
<!-- 监听器，加载spring配置 -->
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<!-- 前端控制器 -->
<servlet>
<servlet-name>springmvc</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:spring/spring-mvc.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>springmvc</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>
<!-- 设置post请求的字符编码过滤器 -->
<filter>
<filter-name>CharacterEncodingFilter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>CharacterEncodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
</web-app>