使用该分页对象需要导包
import org.springframework.data.domain.PageRequest;
import org.springframework.data.domain.Pageable;
hibernate dao 继承自CrudRepository<Entity,ID>
//查询所有该供应商商品
@Query("from CommodityEntity where supplierId=?1 ")
public List<CommodityEntity> findBySupplier(String supplier, Pageable page);
直接将Pageable 分页对象放入到dao层接口 不需要像supplier一样使用?1传入。
service 层方法参数
@Override
public List<CommodityEntity> findBySupplier(String supplier, int page ,int rows) {
//分页算法当前页-1
page=page-1;
//重要!将分页条件交给Pageable 分页对象,PageRequest.of(起始页 , 每页显示的条数);
Pageable p= PageRequest.of(page,rows);
//将参数传入到dao层中
return commodityDao.findBySupplier(supplier,p);
}
@Controller层
@RequestMapping("inquire/commodityList")
@ResponseBody //返回的时json字符串我们需要以json字符串接收
//这里传的参数name是条件参数name ,page和limit是layui table默认传输的分页数据,page当前页limit显示的页数
public Map <String ,Object> CommodityList( String name,String page ,String limit){
Map <String ,Object> map=new HashMap<>();
int Curr=Integer.parseInt(page);
int Limit=Integer.parseInt(limit);
String id="4028802b6d96dd62016d96dd6d220000";
List<CommodityEntity> list= (List<CommodityEntity>) Service.findBySupplier(id,name,Curr,Limit);
int count=Service.fbi(id,name);//查询所有条数,获取该数据的总条数
//layui分页数据返回格式,必须遵守
map.put("code",0); //code异常 返回0(成功),返回其他则异常
map.put("msg", (Curr-1)*Limit);//暂时不清楚/msg官网解释可为空
map.put("count",count);//总条数单独写一个方法,count获取总条数
map.put("data",list);//查询符合分页条件的数据 data为集合数据
return map;
}
layui table 松台数据表格接收
//首先在body中设置一个table 定义id待会使用
<table class="layui-table" lay-filter="test" id="dataTable">
</table>
<!--重点分页模块-->
<script>
//打开网页时加载 test()
window.onload = function () {
test();
}
function test() {
layui.use('table', function () {
var table = layui.table;
//第一个实例
table.render({
elem: '#dataTable' //table ID
, height:460 //表格高度
, url: 'http://localhost:8000/inquire/commodityList' //数据接口
, page: true //开启分页
//除了默认的page 和 limit 还可以定义条件,按照条件查询
, where: {
name: $("#name").val(),
}
//这里是返回的json数据值,将值填入field: 'name' 之中即可,cols会自动生成一个表数据
, cols: [[ //表头
//设置隐藏表单 为该表单添加样式隐藏style:‘display:none;’
{field: 'commodity', title: 'ID', width: 50,style:'display:none;'}
, {field: 'name', title: '商品名', width: 240}
, {field: 'money', title: '参考价格', width: 100}
, {field: 'specifications', title: '商品规格', width: 100}
//重点,如果说json中还有嵌套的对象就需要用到templet:'<div>{{d.type.types}}</div>'来定义
//field:中书写json中的对象名即可/
//具体参考博客 https://blog.youkuaiyun.com/leo_zexin/article/details/86319881
, {field: 'type', title: '商品类型', width: 300,templet:'<div>{{d.type.types}}</div>'}
//为每条表格数据后方添加(追加)操作按钮 toolbar:'#barDemo' 申明 为toolbar中添加那些按钮
//我们在下面书写一个script 为该script 定义id 为#barDemo
,{fixed: 'right',width:240,align:'left',toolbar:'#barDemo'}
]]
});
//隐藏表单头 详情:https://blog.youkuaiyun.com/qq_24024541/article/details/102498187
$('table.layui-table thead tr th:eq(0)').addClass('layui-hide');
});
}
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs">修改</a>
<a class="layui-btn layui-btn-xs">删除</a>
</script>