# maven工程
## pom.xml
```xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.bootssmjsp</groupId>
<artifactId>bootssmjsp</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>jar</packaging>
<name>bootssmjsp Maven Webapp</name>
<!-- FIXME change it to the project's website -->
<url>http://www.example.com</url>
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<maven.compiler.source>1.7</maven.compiler.source>
<maven.compiler.target>1.7</maven.compiler.target>
</properties>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.0.5.RELEASE</version>
</parent>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-redis</artifactId>
</dependency>
<dependency>
<groupId>org.mybatis.spring.boot</groupId>
<artifactId>mybatis-spring-boot-starter</artifactId>
<version>2.2.0</version>
</dependency>
<!-- 添加包 -->
<dependency>
<groupId>org.apache.tomcat</groupId>
<artifactId>tomcat-dbcp</artifactId>
<version>8.5.43</version>
</dependency>
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
</dependency>
<dependency>
<groupId>com.oracle.database.jdbc</groupId>
<artifactId>ojdbc6</artifactId>
<version>11.2.0.4</version>
</dependency>
<dependency>
<groupId>log4j</groupId>
<artifactId>log4j</artifactId>
<version>1.2.16</version>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>8.0.14</version>
</dependency>
<dependency>
<groupId>org.aspectj</groupId>
<artifactId>aspectjweaver</artifactId>
<version>1.8.13</version>
</dependency>
<dependency>
<groupId>redis.clients</groupId>
<artifactId>jedis</artifactId>
<version>2.9.0</version>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<!-- spring war启动 提示Caused by: java.lang.ClassNotFoundException: org.apache.commons.fileupload.FileItemFactory -->
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.2</version>
</dependency>
</dependencies>
<build>
<finalName>bootssmjsp</finalName>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
```
## boot配置(src\main\resources\application.properties)
```properties
debug=true
#server.port=8090
server.tomcat.uri-encoding=UTF-8
#server.servlet.context-path=/boot
spring.mvc.view.prefix=/WEB-INF/jsp/
spring.mvc.view.suffix=.jsp
#spring.thymeleaf.enabled=false
#spring.thymeleaf.cache=false
mybatis.mapper-locations=classpath:com/bootssmjsp/mapper/*.xml
mybatis.type-aliases-package=com.bootssmjsp.model
spring.datasource.url=jdbc:oracle:thin:@localhost:1521:xe
spring.datasource.username=hr
spring.datasource.password=123456
spring.datasource.driver-class-name=oracle.jdbc.driver.OracleDriver
#spring.servlet.multipart.enabled=true
#spring.servlet.multipart.file-size-threshold=1MB
#spring.servlet.multipart.location=D:/upload/imgs/
#spring.resources.static-locations=file:${spring.servlet.multipart.location},classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/
```
## log4j日志配置(带日期)
```properties
log4j.rootLogger=DEBUG,A1,A2
#输出到控制台
log4j.appender.A1=org.apache.log4j.ConsoleAppender
log4j.appender.A1.layout=org.apache.log4j.PatternLayout
log4j.appender.A1.layout.ConversionPattern=%d{yyyy-MM-dd HH:mm:ss} [%p] [%l] %m%n
#输出到日志文件
log4j.appender.A2=org.apache.log4j.DailyRollingFileAppender
log4j.appender.A2.File=D:/log/log4j_
log4j.appender.A2.DatePattern=yyyy-MM-dd'.log'
log4j.appender.A2.Append=true
log4j.appender.A2.layout=org.apache.log4j.PatternLayout
log4j.appender.A2.layout.ConversionPattern=%d{yyyy-MM-dd HH:mm:ss} [%p] [%l] %m%n
```
## boot日志配置
```xml
<?xml version="1.0" encoding="UTF-8"?>
<configuration debug="false">
<!--定义日志文件的存储地址 勿在 LogBack 的配置中使用相对路径-->
<!--/代表项目在电脑磁盘的根目录 此时日志被输出到了E盘(我的项目在E盘)下的home文件夹中-->
<property name="LOG_HOME" value="D:/log" />
<!-- 控制台输出 -->
<appender name="STDOUT" class="ch.qos.logback.core.ConsoleAppender">
<encoder class="ch.qos.logback.classic.encoder.PatternLayoutEncoder">
<!--格式化输出:%d表示日期,%thread表示线程名,%-5level:级别从左显示5个字符宽度%msg:日志消息,%n是换行符-->
<pattern>%d{yyyy-MM-dd HH:mm:ss.SSS} [%thread] %-5level %logger{50} - %msg%n</pattern>
</encoder>
</appender>
<!-- 按照每天生成日志文件 -->
<appender name="FILE" class="ch.qos.logback.core.rolling.RollingFileAppender">
<rollingPolicy class="ch.qos.logback.core.rolling.TimeBasedRollingPolicy">
<!--日志文件输出的文件名-->
<FileNamePattern>${LOG_HOME}/logback_%d{yyyy-MM-dd}.log</FileNamePattern>
<!--日志文件保留天数-->
<MaxHistory>30</MaxHistory>
</rollingPolicy>
<encoder class="ch.qos.logback.classic.encoder.PatternLayoutEncoder">
<!--格式化输出:%d表示日期,%thread表示线程名,%-5level:级别从左显示5个字符宽度%msg:日志消息,%n是换行符-->
<pattern>%d{yyyy-MM-dd HH:mm:ss.SSS} [%thread] %-5level %logger{50} - %msg%n</pattern>
</encoder>
<!--日志文件最大的大小-->
<triggeringPolicy class="ch.qos.logback.core.rolling.SizeBasedTriggeringPolicy">
<MaxFileSize>10MB</MaxFileSize>
</triggeringPolicy>
</appender>
<!-- 日志输出级别 -->
<root level="DEBUG">
<appender-ref ref="STDOUT" />
<appender-ref ref="FILE" />
</root>
</configuration>
```
## 程序入口
```java
package com.bootssmjsp;
import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
@SpringBootApplication
@MapperScan(basePackages = "com.bootssmjsp.mapper")
//@ServletComponentScan(basePackages = "com.bootssmjsp.filter")
public class BootSsmJsp {
@RequestMapping("/")
String home() {
return "redirect:/stu";
}
public static void main(String[] args) {
SpringApplication.run(BootSsmJsp.class, args);
}
}
```
# 代码
## 表格seats
## 前端src/main/webapp/html
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<style>
/* .seat_label{
width: 20px;
height: 20px;
float: left;
} */
.room_seat{
border: 2px solid gainsboro;
border-radius: 5px;
width: 20px;
height: 20px;
float: left;
margin-right: 10px;
background-color: #45a049;
margin-bottom: 5px;
}
.room_seat.selected{
background-color: #FF0000 !important;
}
.room_seat.done{
background-color: #cccccc;
}
.room_seat.fault{
background-color: #ffff00;
}
</style>
</head>
<body>
<div id="seat-content">
</div>
<script>
const test=[{"a":"aa1","b":"bb1"},{"a":"aa2","b":"bb3"}]
var s=""
for (var i = 0; i < test.length; i++) {
s+=`<zsz>${test[i].a}</zsz>`
}
var lstSeat=null;
// const seats=[
// {
// seat:[
// {
// row:0,
// col:0,
// status:0
// } ,
// {
// row:0,
// col:1,
// status:1
// },
// {
// row:0,
// col:2,
// status:2
// }
//
// ]
// },
// {
// // row:2,
// seat:[
// {
// row:1,
// col:0,
// status:0
// } ,
// {
// row:1,
// col:1,
// status:1
// },
// {
// row:1,
// col:2,
// status:0
// },
// {
// row:1,
// col:3,
// status:2
// },
// {
// row:1,
// col:4,
// status:1
// }
// ]
// }
// ]//座位信息
function initSeats() {
// 接口获取座位信息数据
let content=''// 座位html
lstSeat.forEach(el=>{
let row='<div style="clear: left"></div>'
el.seat.forEach(seat=>{
row+=`<div class="room_seat ${ seat.status==0?'':(seat.status==1?'done':(seat.status==2?'fault':'selected'))}" data-seat-row="${seat.row}" data-seat-col="${seat.col}"></div>`
})
content+=row
})
$('#seat-content').html(content)
}
$(function () {
$.ajax(
{url:"http://localhost:8080/stu/seat",
async:false,
success:function(res){
lstSeat=res;
}
})
initSeats()
// 座位点击事件
$('#seat-content').on('click','.room_seat',function () {
const seat=this.dataset;
console.log(seat.seatRow+''+seat.seatCol);
console.log($(this).data("seatRow")+""+$(this).data("seatCol") )
// if(confirm('你确认选择该座位吗')){
this.classList.add('selected')
// }
})
})
</script>
</body>
</html>
```
## 业务控制器(src/main/java/com/bootssmjsp/controller/...)
```java
@CrossOrigin
@RequestMapping("/seat")
@ResponseBody
List seat() throws ServletException, IOException {
List lst = stuService.getSeats();
log.debug(lst);
return lst;
}
```
## 业务逻辑层
```java
List getSeats(); //接口
@Override
public List getSeats() { //实现
return studentMapper.getSeat();
}
```
## 数据库层
```java
public interface StudentMapper extends IMapper{
public List<Object> getStu(Map map);
public List<Object> getSeat();
}
```
## xml配置(src/main/resources/com/bootssmjsp/mapper/StudentMapper.mxl)
```xml
<select id="getSeat" resultMap="SeatSet">
select *from seats
</select>
<resultMap type="Map" id="SeatSet">
<id property="row" column="rid" />
<collection property="seat" javaType="List" ofType="java.util.Map">
<result property="row" column="rid"></result>
<result property="col" column="colid"></result>
<result property="status" column="status"></result>
</collection>
</resultMap>
```
# 效果

2108

被折叠的 条评论
为什么被折叠?



