Mybatis-Plus的分页插件
使用的是:Mybatis-Plus的分页插件
https://baomidou.gitee.io/mybatis-plus-doc/#/?id=%E7%AE%80%E4%BB%8B
1、Mapper.java
List<SysUser> selectPageUserList(Page page, SysUser user);
2、serviceImpl
public Page<SysUser> selectUserPage(SysUser user, Integer current, Integer pageSize) { Page<SysUser> page = new Page<SysUser>(current, pageSize);// 当前页,总条数 构造 page 对象 //sql优化,OptimizeCountSql默认为true,优化,不执行select count(1)操作 //page.setOptimizeCountSql(false); // 查询总记录数,默认是查询 // page.setSearchCount(false); // 注意!! 分页 total 是经过插件自动 回写 到传入 page 对象 return page.setRecords(baseMapper.selectPageUserList(page, user)); }
3、controller
@RequestMapping(value = "/list", method = RequestMethod.POST) @ResponseBody public ModelAndView doList(SysUser su, SplitPage splitPage){ ModelAndView mav = new ModelAndView("m/user/listUser"); Page<SysUser> pageInfo = sysUserService.selectUserPage(su,splitPage.getPageNumber(),splitPage.getPageSize()); PageInfo<SysUser> pageResult = new PageInfo<SysUser>(); pageResult.setPageSize(splitPage.getPageSize()); // 返回当前页码 pageResult.setPage(pageInfo.getCurrent()); // 返回总记录数 pageResult.setRecords(pageInfo.getTotal()); // 返回总页数 pageResult.setTotal(pageInfo.getPages()); // 返回查询数据 pageResult.setRows(pageInfo.getRecords()); mav.addObject("pageInfo",pageResult); return mav; } @RequestMapping(value = "/userData", method = RequestMethod.POST) @ResponseBody public ModelAndView getData(SysUser su, SplitPage splitPage){ ModelAndView mav = new ModelAndView("m/user/user :: userData"); Page<SysUser> pageInfo = sysUserService.selectUserPage(su,splitPage.getPageNumber(),splitPage.getPageSize()); PageInfo<SysUser> pageResult = new PageInfo<SysUser>(); pageResult.setPageSize(splitPage.getPageSize()); // 返回当前页码 pageResult.setPage(pageInfo.getCurrent()); // 返回总记录数 pageResult.setRecords(pageInfo.getTotal()); // 返回总页数 pageResult.setTotal(pageInfo.getPages()); // 返回查询数据 pageResult.setRows(pageInfo.getRecords()); mav.addObject("pageInfo",pageResult); return mav; }
4、html页面(thymeleaf)
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div th:fragment="page(url,searchForm,tablelist)" class="col-xs-12"> <div class="col-xs-6"> <div class="dataTables_info" id="dynamic-table_info" role="status" aria-live="polite"> 共<strong th:text="${pageInfo.records}"/>条数据 </div> </div> <div class="col-xs-6"> <div class="dataTables_paginate paging_simple_numbers" id="table_paginate"> <input th:hidden="true" id="pageNumber" name="pageNumber" th:value="${pageInfo.page}"/> <!-- 处理页数小于等于7 的情况 --> <ul th:if="${(pageInfo.total le 7)&&(pageInfo.total gt 0)}" class="pagination"> <li th:if="${pageInfo.page eq 1}" class="page-item disabled"><a class="page-link" href="#">上一页</a></li> <li th:if="${pageInfo.page gt 1}" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+${pageInfo.page}+'-1)'" >上一页</a> </li> <li th:each="index:${#numbers.sequence(1,pageInfo.total)}" th:classappend="${index eq pageInfo.page}?'active'" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\',\''+${index}+'\')'" th:text="${index}"></a> </li> <li th:if="${pageInfo.page eq pageInfo.total}" class="page-item disabled"> <a class="page-link" href="#">下一页</a> </li> <li th:if="${pageInfo.page lt pageInfo.total}" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+${pageInfo.page}+'+1)'">下一页</a> </li> </ul> <!-- 处理页数大于7 的情况 --> <ul th:if="${pageInfo.total gt 7}" class="pagination"> <li th:if="${pageInfo.page eq 1}" class="page-item disabled"> <a class="page-link" href="#">上一页</a> </li> <li th:if="${pageInfo.page gt 1}" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+${pageInfo.page}+'-1)'">上一页</a> </li> <!-- 首页 --> <li th:classappend="${pageInfo.page eq 1}?'active'" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+'1)'">1</a> </li> <!-- 当前页面小于等于7 --> <li th:if="${pageInfo.page le 4}" th:each="index:${#numbers.sequence(2,5)}" th:classappend="${index eq pageInfo.page}?'active'" class="page-item"> <a href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\',\''+${index}+'\')'" class="page-link" th:text="${index}"></a> </li> <li th:if="${pageInfo.page le 4}" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+'6)'">...</a> </li> <!-- 最后一页与当前页面之差小于等于3 --> <li th:if="${pageInfo.total-pageInfo.page le 3}" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+${pageInfo.total}+'-5)'">...</a> </li> <li th:if="${pageInfo.total-pageInfo.page le 3}" th:each="index:${#numbers.sequence(pageInfo.total-4,pageInfo.total-1)}" th:classappend="${index eq pageInfo.page}?'active'" class="page-item"> <a href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\',\''+${index}+'\')'" class="page-link" th:text="${index}"></a> </li> <!-- 最后一页与当前页面之差大于3 且当前页面大于4 --> <li th:if="${(pageInfo.page gt 4) && (pageInfo.total-pageInfo.page gt 3)}" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+${pageInfo.page}+'-2)'">...</a> </li> <li th:if="${(pageInfo.page gt 4) && (pageInfo.total-pageInfo.page gt 3)}" th:each="index:${#numbers.sequence(pageInfo.page-1,pageInfo.page+1)}" th:classappend="${index eq pageInfo.page}?'active'" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\',\''+${index}+'\')'" th:text="${index}"></a> </li> <li th:if="${(pageInfo.page gt 4) && (pageInfo.total-pageInfo.page gt 3)}" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+${pageInfo.page}+'+2)'">...</a> </li> <!-- 尾页 --> <li th:classappend="${pageInfo.page eq pageInfo.total}?'active'" class="page-item"> <a class="page-link"href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\',\''+${pageInfo.total}+'\')'" th:text="${pageInfo.total}"></a> </li> <li th:if="${pageInfo.page eq pageInfo.total}" class="page-item disabled"> <a class="page-link" href="#">下一页</a> </li> <li th:if="${pageInfo.page lt pageInfo.total}" class="page-item"> <a class="page-link" href="javascript:void(0);" th:onclick="'javascript:splitPageLink(\''+${url}+'\',\''+${searchForm}+'\',\''+${tablelist}+'\','+${pageInfo.page}+'+1)'">下一页</a> </li> </ul> </div> </div> </div> </body> </html>
5、js
function splitPageLink(url,searchForm,tablelist,toPage) { $("#table_paginate select[name=pageNumber],input[name=pageNumber] ").val(toPage); ajaxLoad(url,$.param({'pageNumber': toPage}) + '&' +$("#"+searchForm+"").serialize(),'lu_user_list'); }
function ajaxLoad(url,data,loadTable){ $.ajax({ type:"post", url:url, data: data, contentType:"application/x-www-form-urlencoded; charset=UTF-8", dataType: "html", async:false,//同步 success:function (result) { $("#"+loadTable+"").html(result); } }) }