前端:
<table id="LAY-user-manage" lay-filter="LAY-user-manage" class="layui-hide"></table>
<script th:inline="none">//"[[" 和 thymeleaf模板解析冲突,用th:inline="none"解决
layui.config({
base: '/layuiAdmin/src/layuiadmin/' //静态资源所在路径
}).extend({
index: 'lib/index' //主入口模块
}).use(['index', 'useradmin', 'table'], function(){
var $ = layui.$
,form = layui.form
,table = layui.table;
//table列表渲染
table.render({
elem:'#LAY-user-manage',
height: 'full-200',
url:'/admin/cases/list',
title:'解决方案表',
page:true,//开启分页
limit:5,//默认每页显示条数
limtis: [3,5,10]//可选的每页显示条数
cols:[[
{type:'checkbox',fixed:'left'}
,{field:'id', width:80, sort: true,title:'ID'}
,{field:'title', width:200, title: '标题'}
,{field:'pic',width:250,title:'封面图片',templet:'#imgtmp'}
,{field:'content', minWidth:400, title: '内容' }
,{field:'sort', width:100, title: '分类' }
,{fixed: 'right', width: 165, align:'center', toolbar: '#table-useradmin-webuser'}
]]
});
</script>
Mapper
public interface CasesMapper {
@Select("select * from cases order by id desc limit #{startNum}, #{limit}")
public List<Cases> findAllCases(Integer startNum,Integer limit);
//获取数据总条数
@Select("select count(id) from cases")
public int countId();
}
Service
import com.ncyteng.dazheng.entity.Cases;
import java.util.List;
public interface CasesService {
public List<Cases> findAllCases(Integer page,Integer limit);
public int countId();
}
ServiceImpl
@Service
public class CasesServiceImpl implements CasesService {
@Resource
private CasesMapper casesMapper;
@Override
public List<Cases> findAllCases(Integer page,Integer limit) {
int startNum = (page - 1) * limit;
return casesMapper.findAllCases(startNum,limit);
}
@Override
public int countId() {
return casesMapper.countId();
}
}
Controller
layui table组件自动在URL中传递page和limit值,直接接收,
@Controller
@RequestMapping("/admin/cases")
public class CasesController {
@Resource
private CasesService casesService;
//映射list.html
@GetMapping("/")
public String listIndex() {
return "/admin/cases/list";
}
//list传值url
@GetMapping("/list")
@ResponseBody
//变量名需要同步layui,或者在前端配置变量名
public Map findAllCases(@RequestParam(defaultValue = "1") Integer page,@RequestParam(defaultValue = "10") Integer limit) {
System.out.println(page+","+limit);
List<Cases> allCases = casesService.findAllCases(page,limit);
int count = casesService.countId();
Map<String, Object> res = new HashMap<>();
res.put("code", "0");
res.put("msg", "上传成功");
res.put("data", allCases);
res.put("count", count);//layui会自动接收所有数据条数count并处理成分页
return res;
}
}
controller必须传递count总数,不然layui接收以后不能计算总共需要多少页,分页会失败