mybatis-pagehelper-ajax-log分页插件实现日志分页显示
使用分页插件(
pagehelper)显示日志
整理于2020年02月17日
使用有道云笔记md的第三天
开发工具:eclipse
- sm-pagehelper-ajax-log(noSpringMVC)
- ssm-pagehelper-ajax-log
目录
文章目录
-
- 目录
- 使用分页插件(```pagehelper```)显示日志
-
- sm(```noSpringMVC```)
-
- 1. ```spring```+```mybatis```+```pagehelper```+```ajax```(no```SpringMVC```) 分页显示日志信息（传参(无法排序)、调用静态方法(startPage()) 两种的方式）
-
- 1. 数据准备、导入```jar```、```web.xml```、```spring```配置文件(```applicationContext.xml```)
- 2.```pojo```
- 3.持久层```mapper```
- 4.业务层```service```
- 5.控制器```servlet```
- 6.视图层```jsp```
- ssm
-
- 2. ```ssm```+```pagehelper```+```ajax```分页显示日志信息
-
- 1. 数据准备、导入```jar```、```web.xml```、```spring```配置文件(```applicationContext.xml```)
- 2.```pojo```
- 3.持久层```mapper```(同上)
- 4.业务层```service```(同上)
- 5.控制器```controller```(同上)
- 6.视图层```jsp```
使用分页插件(pagehelper)显示日志
sm(noSpringMVC)
1. spring+mybatis+pagehelper+ajax(noSpringMVC) 分页显示日志信息（传参(无法排序)、调用静态方法(startPage()) 两种的方式）
1. 数据准备、导入
jar、web.xml、spring配置文件(applicationContext.xml)数据准备：登录注册项目的操作日志表
logCREATE TABLE `log` ( `id` int(11) NOT NULL AUTO_INCREMENT COMMENT '编号', `pageinfo` varchar(50) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci DEFAULT NULL COMMENT '用户操作信息', `ip` int(10) unsigned DEFAULT NULL COMMENT 'ip信息', `time` datetime DEFAULT NULL COMMENT '操作时间', PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=150 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci;导入jar包:
项目结构
web.xml
<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_4_0.xsd" version="4.0">
<display-name>webzyspring-mybatis-pagehelper-log-ajaxdisplay-name>
<welcome-file-list>
<welcome-file>index.htmlwelcome-file>
<welcome-file>index.htmwelcome-file>
<welcome-file>index.jspwelcome-file>
<welcome-file>default.htmlwelcome-file>
<welcome-file>default.htmwelcome-file>
<welcome-file>default.jspwelcome-file>
welcome-file-list>
<context-param>
<param-name>contextConfigLocationparam-name>
<param-value>classpath:applicationContext.xmlparam-value>
context-param>
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListenerlistener-class>
listener>
web-app>
applicationContext.xml
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:aop="http://www.springframework.org/schema/aop"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:jdbc="http://www.springframework.org/schema/jdbc"
xmlns:tx="http://www.springframework.org/schema/tx"
xsi:schemaLocation="http://www.springframework.org/schema/jdbc http://www.springframework.org/schema/jdbc/spring-jdbc.xsd
http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop.xsd
http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd">
<context:component-scan base-package="com.zy.service.impl">context:component-scan>
<context:property-placeholder location="classpath:db.properties"/>
<bean id="dataSource" class="org.springframework.jdbc.datasource.DriverManagerDataSource">
<property name="driverClassName" value="${jdbc.driver}">property>
<property name="url" value="${jdbc.url}">property>
<property name="username" value="${jdbc.username}">property>
<property name="password" value="${jdbc.password}">property>
bean>
<bean id="factory" class="org.mybatis.spring.SqlSessionFactoryBean">
<property name="dataSource" ref="dataSource">property>
<property name="typeAliasesPackage" value="com.zy.pojo">property>
<property name="plugins">
<array>
<bean class="com.github.pagehelper.PageInterceptor">
<property name="properties">
<value>
helperDialect=mysql
reasonable=true
supportMethodsArguments=true
value>
property>
bean>
array>
property>
bean>
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="basePackage" value="com.zy.mapper">property>
<property name="sqlSessionFactoryBeanName" value="factory">property>
bean>
<bean id="txManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
<property name="dataSource" ref="dataSource">property>
bean>
<tx:advice id="txAdvice" transaction-manager="txManager">
<tx:attributes>
<tx:method name="ins*"/>
<tx:method name="del*"/>
<tx:method name="upd*"/>
<tx:method name="*" read-only="true"/>
tx:attributes>
tx:advice>
<aop:config>
<aop:pointcut expression="execution(* com.zy.service.impl.*.*(..))" id="mypoint"/>
<aop:advisor advice-ref="txAdvice" pointcut-ref="mypoint"/>
aop:config>
<aop:aspectj-autoproxy proxy-target-class="true">aop:aspectj-autoproxy>
beans>
db.properties
jdbc.driver=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/dbtest?useSSL=false
jdbc.username=root
jdbc.password=root
log4j.properties
log4j.rootCategory=INFO, CONSOLE
#log4j.rootCategory=INFO, CONSOLE ,LOGFILE
log4j.appender.CONSOLE=org.apache.log4j.ConsoleAppender
log4j.appender.CONSOLE.layout=org.apache.log4j.PatternLayout
log4j.appender.CONSOLE.layout.ConversionPattern=%C %d{YYYY-MM-dd hh:mm:ss} %m %n
#log4j.appender.LOGFILE=org.apache.log4j.FileAppender
#log4j.appender.LOGFILE.File=D:/my.log
#log4j.appender.LOGFILE.Append=true
#log4j.appender.LOGFILE.layout=org.apache.log4j.PatternLayout
#log4j.appender.LOGFILE.layout.ConversionPattern=%m %n
2.
pojoLog.java
package com.zy.pojo;
public class Log {
int id;
String pageInfo;
String ip;
String time;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getPageInfo() {
return pageInfo;
}
public void setPageInfo(String pageInfo) {
this.pageInfo = pageInfo;
}
public String getIp() {
return ip;
}
public void setIp(String ip) {
this.ip = ip;
}
public String getTime() {
return time;
}
public void setTime(String time) {
this.time = time;
}
@Override
public String toString() {
return "Log [id=" + id + ", pageInfo=" + pageInfo + ", ip=" + ip + ", time=" + time + "]";
}
}
3.持久层
mapperLogMapper.java
package com.zy.mapper;
import java.util.List;
import org.apache.ibatis.annotations.Param;
import org.apache.ibatis.annotations.Select;
import com.zy.pojo.Log;
public interface LogMapper {
/**
* 使用调用静态方法的方式
* @return
*/
@Select("select * from log")
List<Log> selByPageStatic();
/**
* 使用传参的方式
* @param pageNum
* @param pageSize
* @return
*/
@Select("select * from log")
List<Log> selByPage(
@Param("pageNum") int pageNum,
@Param("pageSize") int pageSize);
}
4.业务层
serviceLogService.java
package com.zy.service;
import com.github.pagehelper.PageInfo;
import com.zy.pojo.Log;
public interface LogService {
/**
* 通过调用静态方法的方式
* @return
*/
PageInfo<Log> showLog();
/**
* 通过传参的方式
* @param pageNumStr
* @param pageSizeStr
* @return
*/
PageInfo<Log> showLog(int pageNum ,int pageSize );
}
LogServiceImpl.java
package com.zy.service.impl;
import javax.annotation.Resource;
import org.springframework.stereotype.Service;
import com.github.pagehelper.PageInfo;
import com.zy.mapper.LogMapper;
import com.zy.pojo.Log;
import com.zy.service.LogService;
@Service
public class LogServiceImpl implements LogService{
@Resource
private LogMapper mapper;
@Override
public PageInfo showLog() {
PageInfo pi = new PageInfo(mapper.selByPageStatic());
return pi;
}
@Override
public PageInfo showLog(int pageNum, int pageSize) {
PageInfo pi = new PageInfo(mapper.selByPage(pageNum, pageSize));
return pi;
}
}
5.控制器
servletShowLogServlet.java
package com.zy.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.web.context.WebApplicationContext;
import org.springframework.web.context.support.WebApplicationContextUtils;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.github.pagehelper.Page;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.zy.pojo.Log;
import com.zy.service.LogService;
import com.zy.service.impl.LogServiceImpl;
@WebServlet("/showLog")
public class ShowLogServlet extends HttpServlet{
private LogService logService;
@Override
public void init() throws ServletException {
WebApplicationContext wac = WebApplicationContextUtils.getWebApplicationContext(getServletContext());
logService = wac.getBean("logServiceImpl",LogServiceImpl.class);
}
@Override
protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
req.setCharacterEncoding("utf-8");
String pageNumStr = req.getParameter("pageNum");
String pageSizeStr = req.getParameter("pageSize");
String sortType = req.getParameter("sortType");
int pageNum = 1;
if (pageNumStr != null && !pageNumStr.equals("")) {
pageNum = Integer.parseInt(pageNumStr.trim());
}
int pageSize = 10;
if (pageSizeStr != null && !pageSizeStr.equals("")) {
pageSize = Integer.parseInt(pageSizeStr.trim());
}
PageInfo pi ;
if(sortType!=null && !sortType.trim().equals("") && //排序参数合法
(sortType.trim().equals("asc") ||sortType.trim().equals("desc")) ) {
PageHelper.startPage(pageNum,pageSize,"id "+sortType.trim());
pi = logService.showLog();
}else {
// PageHelper.startPage(pageNum,pageSize);
// pi = logService.showLog();
//如果没有排序参数的话，就使用传参的方式
pi = logService.showLog(pageNum, pageSize);
}
//获取到排序方式或者判断prePage与nextPage的大小就知道是按什么排序了
//String orderBy = ((Page)pi.getList()).getOrderBy();
//使用Ajax 设置响应内容
resp.setContentType("application/json;charset=utf-8");
PrintWriter out = resp.getWriter();
//对象转json
ObjectMapper mapper = new ObjectMapper();
out.println(mapper.writeValueAsString(pi));
out.flush();
out.close();
}
}
6.视图层
jspindex.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="UTF-8">
<title>日志显示title>
<style>
table.hovertable {
font-size: 13px;
color: #333;
border-width: 1px;
border-color: #999;
border-collapse: collapse;
width: auto;
margin: 0 auto;
}
table.hovertable th {
background-color: #c3dde0;
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
table.hovertable tr {
background-color: #d4e3e5;
}
table.hovertable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
text-align: center;
}
button {
border: 1px solid transparent;
color: #457eff;
background-color: #fff;
border-color: #457eff;
border-radius:10px;
}
button:hover {
border: 1px solid transparent;
border-color: #ffae00;
color: rgb(255, 0, 157);
}
/* 分页显示 - 切换当前页 的css 记得带上 a a:hover的样式 */
a {
text-decoration: none;
font-size: 14px;
color: #457eff;
}
a:hover {
text-decoration: none;
color: rgb(255, 0, 157);
}
.page {
/* line-height: 16px; */
text-align: right;
padding: 8px 0;
/* margin-right: 1px; */
height: 44px;
/* border: 1px solid #e6e6e6; */
border-top: none;
margin: 0;
}
.dataTables_paginate {
display: block;
height: 30px;
margin-bottom: 10px;
margin-top: 15px;
position: relative;
}
.page div {
float: right;
}
.page .Pcurrent {
color: #fff;
background: #20a53a;
cursor: default;
border-color: #20a53a;
}
.page span, .page a {
display: inline-block;
height: 28px;
line-height: 28px;
padding: 0 10px;
font-family: "Arial";
font-size: 13px;
color: #666;
float: left;
border: 1px solid #ececec;
border-right: none;
}
.page a:hover {
background: #e8e8e8;
color: #20a53a;
text-shadow: 0 1px 0 #fff;
cursor: pointer;
}
/* 设置每页显示的条数 */
.Pcount-item {
border-right: 1px solid #ececec;
}
input, textarea, select {
font-size: 100%;
font-family: inherit;
}
button, input, select, textarea {
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
button, select {
text-transform: none;
}
button, input, optgroup, select, textarea {
margin: 0;
font: inherit;
color: inherit;
}
style>
<script type="text/javascript" src="<%=path %>/js/jquery-3.4.1.js">script>
<script type="text/javascript">
$(function() {
//当前页
var pageNum = 1;
//当前页的数量
var pageSize = 10;
//当前页的数量
var size = 0;
//总数据条数
var total = 0;
//总页数
var pages = 0;
//导航页码数(默认为8)
var navigatePages = 0;
//导航页码(默认有8个)
var navigatepageNums = new Array();
//前一页
var prePage =1;
//下一页
var nextPage = 1;
//select数组(下拉框)
var select = ["10","50","100","200","500","1000","2000"];
//排序方式
var sortType = "desc";
//默认调用一次，加载数据
getMyData();
//首页
$("#navigate").on("click",".Pstart",function(){
pageNum = 1;
getMyData();
return false;
});
//尾页
$("#navigate").on("click",".Pend",function(){
pageNum = pages;
getMyData();
return false;
});
//上一页
$("#navigate").on("click",".Ppren",function() {
pageNum = prePage;
getMyData();
return false;
});
//下一页
$("#navigate").on("click",".Pnext",function() {
pageNum = nextPage;
getMyData();
return false;
});
//跳转到指定页
$("#navigate").on("click",".Pnum",function(){
pageNum = $(this).html();
getMyData();
return false;
});
//下拉框事件
$("#navigate").on("change","#pcount-item",function(){
//如果当前页大于或等于改变后的页就显示第一页
if(pageNum >= (total/$(this).val()+1)){
pageNum = 1;
}
pageSize = $(this).val();
getMyData();
return false;
});
//正序排序事件
$("#asc").on("click",function(){
sortType = "asc";
pageNum = 1;
getMyData();
return false;
});
//倒序排序事件
$("#desc").on("click",function(){
sortType = "desc";
pageNum = 1;
getMyData();
return false;
});
function getMyData(){
//$.post(url,参数,success回调方法,dataType)
$.post("showLog",{
"pageSize":pageSize,"pageNum":pageNum,"sortType":sortType},function(data){
pages = data.pages;
prePage = data.prePage;
nextPage = data.nextPage;
pageNum = data.pageNum;
pageSize = data.pageSize;
total = data.total;
// 日志表格
var result = "";
for (var i = 0; i < data.list.length; i++) {
result+="";
result+=""+data.list[i].id+" ";
result+=""+data.list[i].time+" ";
result+=""+data.list[i].ip+" ";
result+=""+data.list[i].pageInfo+" ";
result+=" ";
}
$("#mytbody").html(result);
//导航栏
var navigate = "";
if(!data.isFirstPage){
navigate += "首页上一页";
}
for (var i = 0; i < data.navigatepageNums.length; i++) {
if(data.navigatepageNums[i]==data.pageNum){
navigate += ""+data.navigatepageNums[i]+"";
}else{
navigate += ""+data.navigatepageNums[i]+"";
}
}
if(!data.isLastPage){
navigate += "下一页尾页";
}
navigate += "共"+data.pages+"页"+data.total+"条数据";
//下拉框
navigate += "每页;
for(var i = 0; i< select.length; i++){
//如果当前下拉框的值是当前页码，那么就选中该值
if(select[i]==pageSize){
navigate += "+select[i]+"";
}else{
navigate += "+select[i]+"";
}
}
navigate += "条 ";
$("#navigate").html(navigate);
})
}
});
script>
head>
<body>
<h3 align="center">使用mybatis-pagehelper插件分页h3>
<hr>
<div>
<table class="hovertable">
<tr>
<th>编号th>
<th>时间th>
<th>IPth>
<th>操作 th>
<th>
<button type="button" style="">
<a href="" id="asc" >⏫a>
button>
<button type="button" style="">
<a href="" id="desc" >⏬a>
button>
<button type="button">
<a href="<%=path%>/">返回主页a>
button>
th>
tr>
<tbody id="mytbody">tbody>
table>
div>
<br>
<div class="dataTables_paginate paging_bootstrap page logsBody" style="margin-bottom:0">
<div id="navigate">
div>
div>
body>
html>
ssm
2. ssm+pagehelper+ajax分页显示日志信息
1. 数据准备、导入
jar、web.xml、spring配置文件(applicationContext.xml)数据准备：登录注册项目的操作日志表
logCREATE TABLE `log` ( `id` int(11) NOT NULL AUTO_INCREMENT COMMENT '编号', `pageinfo` varchar(50) CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci DEFAULT NULL COMMENT '用户操作信息', `ip` int(10) unsigned DEFAULT NULL COMMENT 'ip信息', `time` datetime DEFAULT NULL COMMENT '操作时间', PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=150 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci;导入jar包:
项目结构
web.xml
<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_4_0.xsd" version="4.0">
<display-name>webzyspring-mybatis-pagehelper-log-ajaxdisplay-name>
<welcome-file-list>
<welcome-file>index.htmlwelcome-file>
<welcome-file>index.htmwelcome-file>
<welcome-file>index.jspwelcome-file>
<welcome-file>default.htmlwelcome-file>
<welcome-file>default.htmwelcome-file>
<welcome-file>default.jspwelcome-file>
welcome-file-list>
<context-param>
<param-name>contextConfigLocationparam-name>
<param-value>classpath:applicationContext.xmlparam-value>
context-param>
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListenerlistener-class>
listener>
<servlet>
<servlet-name>springmvcservlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServletservlet-class>
<init-param>
<param-name>contextConfigLocationparam-name>
<param-value>classpath:springmvc.xmlparam-value>
init-param>
<load-on-startup>1load-on-startup>
servlet>
<servlet-mapping>
<servlet-name>springmvcservlet-name>
<url-pattern>/url-pattern>
servlet-mapping>
<filter>
<filter-name>encodingfilter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilterfilter-class>
<init-param>
<param-name>encodingparam-name>
<param-value>utf-8param-value>
init-param>
filter>
<filter-mapping>
<filter-name>encodingfilter-name>
<url-pattern>/*url-pattern>
filter-mapping>
web-app>
applicationContext.xml
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:aop="http://www.springframework.org/schema/aop"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:jdbc="http://www.springframework.org/schema/jdbc"
xmlns:tx="http://www.springframework.org/schema/tx"
xsi:schemaLocation="http://www.springframework.org/schema/jdbc http://www.springframework.org/schema/jdbc/spring-jdbc.xsd
http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop.xsd
http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd">
<context:component-scan base-package="com.zy.service.impl">context:component-scan>
<context:property-placeholder location="classpath:db.properties"/>
<bean id="dataSource" class="org.springframework.jdbc.datasource.DriverManagerDataSource">
<property name="driverClassName" value="${jdbc.driver}">property>
<property name="url" value="${jdbc.url}">property>
<property name="username" value="${jdbc.username}">property>
<property name="password" value="${jdbc.password}">property>
bean>
<bean id="factory" class="org.mybatis.spring.SqlSessionFactoryBean">
<property name="dataSource" ref="dataSource">property>
<property name="typeAliasesPackage" value="com.zy.pojo">property>
<property name="plugins">
<array>
<bean class="com.github.pagehelper.PageInterceptor">
<property name="properties">
<value>
helperDialect=mysql
reasonable=true
supportMethodsArguments=true
value>
property>
bean>
array>
property>
bean>
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="basePackage" value="com.zy.mapper">property>
<property name="sqlSessionFactoryBeanName" value="factory">property>
bean>
<bean id="txManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
<property name="dataSource" ref="dataSource">property>
bean>
<tx:advice id="txAdvice" transaction-manager="txManager">
<tx:attributes>
<tx:method name="ins*"/>
<tx:method name="del*"/>
<tx:method name="upd*"/>
<tx:method name="*" read-only="true"/>
tx:attributes>
tx:advice>
<aop:config>
<aop:pointcut expression="execution(* com.zy.service.impl.*.*(..))" id="mypoint"/>
<aop:advisor advice-ref="txAdvice" pointcut-ref="mypoint"/>
aop:config>
<aop:aspectj-autoproxy proxy-target-class="true">aop:aspectj-autoproxy>
beans>
springmvc.xml
db.properties
jdbc.driver=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/dbtest?useSSL=false
jdbc.username=root
jdbc.password=root
log4j.properties
log4j.rootCategory=INFO, CONSOLE
#log4j.rootCategory=INFO, CONSOLE ,LOGFILE
log4j.appender.CONSOLE=org.apache.log4j.ConsoleAppender
log4j.appender.CONSOLE.layout=org.apache.log4j.PatternLayout
log4j.appender.CONSOLE.layout.ConversionPattern=%C %d{YYYY-MM-dd hh:mm:ss} %m %n
#log4j.appender.LOGFILE=org.apache.log4j.FileAppender
#log4j.appender.LOGFILE.File=D:/my.log
#log4j.appender.LOGFILE.Append=true
#log4j.appender.LOGFILE.layout=org.apache.log4j.PatternLayout
#log4j.appender.LOGFILE.layout.ConversionPattern=%m %n
2.
pojoLog.java
3.持久层
mapper(同上)LogMapper.java
4.业务层
service(同上)LogService.java
LogServiceImpl.java5.控制器
controller(同上)ShowLogServlet.java
package com.zy.controller;
import javax.annotation.Resource;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.zy.pojo.Log;
import com.zy.service.LogService;
@Controller
public class ShowLogController {
@Resource
private LogService logServiceImpl;
@RequestMapping("/showLog")
@ResponseBody
public PageInfo<Log> showByPage(String pageNum,String pageSize,String sortType) {
//初始化分页参数
int pageNumInt = 1;
if (pageNum != null && !pageNum.equals("")) {
pageNumInt = Integer.parseInt(pageNum.trim());
}
int pageSizeInt = 10;
if (pageSize != null && !pageSize.equals("")) {
pageSizeInt = Integer.parseInt(pageSize.trim());
}
PageInfo<Log> pi ;
if(sortType!=null && !sortType.trim().equals("") && //排序参数是否合法
(sortType.trim().equals("asc") ||sortType.trim().equals("desc")) ) {
PageHelper.startPage(pageNumInt,pageSizeInt,"id "+sortType.trim());
pi = logServiceImpl.showLog();
}else {
// PageHelper.startPage(pageNum,pageSize);
// pi = logService.showLog();
//如果没有排序参数的话，就使用传参的方式
pi = logServiceImpl.showLog(pageNumInt, pageSizeInt);
}
//获取到排序方式
//String orderBy = ((Page)pi.getList()).getOrderBy();
return pi;
}
}
6.视图层
jspindex.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
<base href="<%=basePath%>">
<meta charset="UTF-8">
<title>日志显示title>
<style>
table.hovertable {
font-size: 13px;
color: #333;
border-width: 1px;
border-color: #999;
border-collapse: collapse;
width: auto;
margin: 0 auto;
}
table.hovertable th {
background-color: #c3dde0;
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
table.hovertable tr {
background-color: #d4e3e5;
}
table.hovertable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
text-align: center;
}
button {
border: 1px solid transparent;
color: #457eff;
background-color: #fff;
border-color: #457eff;
border-radius:10px;
}
button:hover {
border: 1px solid transparent;
border-color: #ffae00;
color: rgb(255, 0, 157);
}
/* 分页显示 - 切换当前页 的css 记得带上 a a:hover的样式 */
a {
text-decoration: none;
font-size: 14px;
color: #457eff;
}
a:hover {
text-decoration: none;
color: rgb(255, 0, 157);
}
.page {
/* line-height: 16px; */
text-align: right;
padding: 8px 0;
/* margin-right: 1px; */
height: 44px;
/* border: 1px solid #e6e6e6; */
border-top: none;
margin: 0;
}
.dataTables_paginate {
display: block;
height: 30px;
margin-bottom: 10px;
margin-top: 15px;
position: relative;
}
.page div {
float: right;
}
.page .Pcurrent {
color: #fff;
background: #20a53a;
cursor: default;
border-color: #20a53a;
}
.page span, .page a {
display: inline-block;
height: 28px;
line-height: 28px;
padding: 0 10px;
font-family: "Arial";
font-size: 13px;
color: #666;
float: left;
border: 1px solid #ececec;
border-right: none;
}
.page a:hover {
background: #e8e8e8;
color: #20a53a;
text-shadow: 0 1px 0 #fff;
cursor: pointer;
}
/* 设置每页显示的条数 */
.Pcount-item {
border-right: 1px solid #ececec;
}
input, textarea, select {
font-size: 100%;
font-family: inherit;
}
button, input, select, textarea {
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
button, select {
text-transform: none;
}
button, input, optgroup, select, textarea {
margin: 0;
font: inherit;
color: inherit;
}
style>
<script type="text/javascript" src="<%=path %>/js/jquery-3.4.1.js">script>
<script type="text/javascript">
$(function() {
//当前页
var pageNum = 1;
//当前页的数量
var pageSize = 10;
//当前页的数量
var size = 0;
//总数据条数
var total = 0;
//总页数
var pages = 0;
//导航页码数(默认为8)
var navigatePages = 0;
//导航页码(默认有8个)
var navigatepageNums = new Array();
//前一页
var prePage =1;
//下一页
var nextPage = 1;
//select数组(下拉框)
var select = ["10","50","100","200","500","1000","2000"];
//排序方式
var sortType = "desc";
//默认调用一次，加载数据
getMyData();
//首页
$("#navigate").on("click",".Pstart",function(){
pageNum = 1;
getMyData();
return false;
});
//尾页
$("#navigate").on("click",".Pend",function(){
pageNum = pages;
getMyData();
return false;
});
//上一页
$("#navigate").on("click",".Ppren",function() {
pageNum = prePage;
getMyData();
return false;
});
//下一页
$("#navigate").on("click",".Pnext",function() {
pageNum = nextPage;
getMyData();
return false;
});
//跳转到指定页
$("#navigate").on("click",".Pnum",function(){
pageNum = $(this).html();
getMyData();
return false;
});
//下拉框事件
$("#navigate").on("change","#pcount-item",function(){
//如果当前页大于或等于改变后的页就显示第一页
if(pageNum >= (total/$(this).val()+1)){
pageNum = 1;
}
pageSize = $(this).val();
getMyData();
return false;
});
//正序排序事件
$("#asc").on("click",function(){
sortType = "asc";
pageNum = 1;
getMyData();
return false;
});
//倒序排序事件
$("#desc").on("click",function(){
sortType = "desc";
pageNum = 1;
getMyData();
return false;
});
function getMyData(){
//$.post(url,参数,success回调方法,dataType)
$.post("showLog",{
"pageSize":pageSize,"pageNum":pageNum,"sortType":sortType},function(data){
pages = data.pages;
prePage = data.prePage;
nextPage = data.nextPage;
pageNum = data.pageNum;
pageSize = data.pageSize;
total = data.total;
// 日志表格
var result = "";
for (var i = 0; i < data.list.length; i++) {
result+="";
result+=""+data.list[i].id+" ";
result+=""+data.list[i].time+" ";
result+=""+data.list[i].ip+" ";
result+=""+data.list[i].pageInfo+" ";
result+=" ";
}
$("#mytbody").html(result);
//导航栏
var navigate = "";
if(!data.isFirstPage){
navigate += "首页上一页";
}
for (var i = 0; i < data.navigatepageNums.length; i++) {
if(data.navigatepageNums[i]==data.pageNum){
navigate += ""+data.navigatepageNums[i]+"";
}else{
navigate += ""+data.navigatepageNums[i]+"";
}
}
if(!data.isLastPage){
navigate += "下一页尾页";
}
navigate += "共"+data.pages+"页"+data.total+"条数据";
//下拉框
navigate += "每页;
for(var i = 0; i< select.length; i++){
//如果当前下拉框的值是当前页码，那么就选中该值
if(select[i]==pageSize){
navigate += "+select[i]+"";
}else{
navigate += "+select[i]+"";
}
}
navigate += "条 ";
$("#navigate").html(navigate);
})
}
});
script>
head>
<body>
<h3 align="center">使用ssm-pagehelper插件分页-ajaxh3>
<hr>
<div>
<table class="hovertable">
<tr>
<th>编号th>
<th>时间th>
<th>IPth>
<th>操作 th>
<th>
<button type="button" style="">
<a href="" id="asc" >⏫a>
button>
<button type="button" style="">
<a href="" id="desc" >⏬a>
button>
<button type="button">
<a href="<%=path%>/">返回主页a>
button>
th>
tr>
<tbody id="mytbody">tbody>
table>
div>
<br>
<div class="dataTables_paginate paging_bootstrap page logsBody" style="margin-bottom:0">
<div id="navigate">
div>
div>
body>
html>