MyBatisPlusConfig 自动配置类
@Bean
public PaginationInterceptor paginationInterceptor() {
return new PaginationInterceptor();
}
Controller获取数据 以json返回
@PreAuthorize("hasAuthority('shsm:index')")
@PostMapping("/febb")
@ResponseBody
public Rjson febb(Integer page,Integer limit,String ches,String shrxm,String date1,String date2){
Page<ShShOdr> objectPage = new Page<>(page,limit);
QueryWrapper<ShShOdr> qw = new QueryWrapper<>();
//查收货人
if( StringUtils.isNotBlank(ches)){
qw.between("ddshsj",date1,date2)
.eq("ddshname",ches);
IPage<ShShOdr> shShOdrIPage = ssodrmp.selectPage(objectPage, qw);
return Rjson.build(0,"成功",shShOdrIPage.getRecords(),shShOdrIPage.getTotal());
}
//查送货人
if( StringUtils.isNotBlank(shrxm)){
qw.between("ddshsj",date1,date2)
.eq("ddshr",shrxm);
IPage<ShShOdr> shShOdrIPage = ssodrmp.selectPage(objectPage, qw);
return Rjson.build(0,"成功",shShOdrIPage.getRecords(),shShOdrIPage.getTotal());
}
//开始日 到 截至日
if( StringUtils.isBlank(date1)){
DateTime jitiandate = DateUtil.date(System.currentTimeMillis());
String s = Convert.toStr(jitiandate); // DateTime转String
Date date = DateUtil.parse(s);
Date beginOfDay = DateUtil.beginOfDay(date);
Date endOfDay = DateUtil.endOfDay(date);
qw.between("ddshsj",beginOfDay,endOfDay);
IPage<ShShOdr> shShOdrIPage = ssodrmp.selectPage(objectPage, qw);
return Rjson.build(0,"成功",shShOdrIPage.getRecords(),shShOdrIPage.getTotal());
}
//查全部
IPage<ShShOdr> shShOdrIPage = ssodrmp.selectPage(objectPage, null);
return Rjson.build(0,"成功",shShOdrIPage.getRecords(),shShOdrIPage.getTotal());
}
前端界面引入
<form class="layui-form layui-form-pane" action="">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">开始日</label>
<div class="layui-input-block">
<input type="text" name="date" id="date1" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">截至日</label>
<div class="layui-input-block">
<input type="text" name="date" id="date2" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">收货人姓名</label>
<div class="layui-input-inline">
<input id="ches" type="text" name="ches" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">送货人姓名</label>
<div class="layui-input-inline">
<input id="shrxm" type="text" name="shrxm" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<button id="reloadBtn" class="layui-btn" data-type="reload">立即提交</button>
</div>
</div>
</form>
<div class="card-body">
<table class="layui-hide" id="tableOne" lay-filter="tableOne" lay-data="{height:'full-20'}"></table>
</div>
调用js代码
<script>
layui.use(['form', 'layedit', 'laydate'], function() {
var form = layui.form
, layer = layui.layer
, layedit = layui.layedit
, laydate = layui.laydate;
//日期
laydate.render({
elem: '#date1',
});
laydate.render({
elem: '#date2',
});
})
</script>
<script>
layui.use(['laydate', 'laypage', 'layer', 'table', 'element', 'slider'], function(){
var table = layui.table;
table.render({
// 表格容器ID
elem: '#tableOne'
// 表格ID，必须设置，重载部分需要用到
, id: 'tableOne'
// 数据接口链接
, url:'/shsm/febb'
, method: 'post'
,initSort: {
field: 'id' //排序字段，对应 cols 设定的各字段名
,type: 'desc' //排序方式 asc: 升序、desc: 降序、null: 默认排序
}
,even: true //开启隔行背景
,height: 580 //容器高度
,loading: true
,totalRow: true
, cols: [ [
{field: 'id', title: 'id', align: 'center', width: 120,totalRowText: '合计'}
, {field: 'ddshname', title: '收货人姓名', align: 'center', width: 120}
, {field: 'ddshaddr', title: '地址', sort: true,align: 'center'}
, {field: 'ddshtel', title: '电话', sort: true, align: 'center', sort: true,}
, {field: 'ddzt', title: '订单状态', align: 'center', templet: '#sexTpl'}
, {field: 'ddshr', title: '送货人姓名', align: 'center', sort: true,}
, {field: 'ddqy', title: '订单区域', align: 'center', minWidth: 80}
, {field: 'ddmd', title: '订单门店', sort: true, align: 'center',}
, {field:'ddzje', title:'订单金额',sort: true,totalRow: true}
, {field: 'ddscsj', title: '订单生成时间', align: 'center', templet:'<div>{{ layui.util.toDateString(d.ddscsj, "yyyy-MM-dd HH:mm:ss") }}</div>',minWidth:150, sort: true}
, {field: 'ddshsj', title: '订单送货时间', align: 'center', templet:'<div>{{ layui.util.toDateString(d.ddshsj, "yyyy-MM-dd HH:mm:ss") }}</div>',minWidth:150, sort: true}
, {fixed: 'right', title:'操作', toolbar: '#barDemo', width:80}
] ]
, page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']//自定义分页布局
,limits:[20,50,100,200]
,skin: 'row' //表格风格
,limit: 20 //每页默认显示的数量
,first: false //不显示首页
,last: false //不显示尾页
}
});
//搜索
table.on('tool(tableOne)', function(obj){
var data = obj.data;
if(obj.event === 'ssxx'){
//详细 页面层
layer.open({
type: 2,
title: '查详',
shadeClose: true, //弹出框之外的地方是否可以点击 in a frame because it set 'X-Frame-Options' to 'deny'
offset: '10%',
area: ['60%', '80%'],
content: '/shsm/shmx/mid/' +data.mid
});
}
});
$("#reloadBtn").click(function (ev) {
var chest = $("#ches").val();
var shrxm = $("#shrxm").val();
var date1 = $("#date1").val() + ' 00:00:00';
var date2 = $("#date2").val()+ ' 23:59:59';
table.reload('tableOne', {
url:'/shsm/febb'
, method: 'post'
, where: {
ches: chest,
shrxm: shrxm,
date1: date1,
date2: date2,
} //设定异步数据接口的额外参数
})
return false;
});
});
</script>
<script type="text/html" id="sexTpl">
{{# if(d.ddzt === 0){ }}
<span style="color: #FF1493;">等待送货</span>
{{# } else { }}
<span style="color: #000;">[完成]</span>
{{# } }}
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs" lay-event="ssxx" style="color: #FFFFFF">查详</a>
</script>
