记一个layui数据表格操作

2019-12-10 14:10:24  卢浮宫  版权声明:本文为站长原创文章,转载请写明出处


一、前言

    随笔记录下layui动态数据表格的相关操作

    因为之前是使用的工具条,但是一个动态条件处理不方便没所以就不说了。


二、上代码,单纯记录下


        layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#orderDataTable'
,url: requestUrl
,page: true
,cols: [[
{field: '', title: '序号',width:80,templet: function(d){ return (d.LAY_INDEX); }}
,{field: 'orderNo', title: '货单号'}
,{field: 'shippingMarks', title: '唛头'}
,{field: 'cusCode', title: '客户编码'}
,{field: 'userName', title: '业务员'}
,{field: 'cargoNum', title: '关联数量(件)'}
,{field: 'orderStateName', title: '确认状态'}
,{field: 'arrivedTime', title: '收货时间'}
,{title: '操作',width:300,templet:function (d) {
var button;
var confirm = '<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="orderConfirm">确认到齐</a>';
var press= '<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="orderPress">催办</a>';
var detail= '<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">详情</a>';
var edit = '<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>';
var del = '<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>';
if(d.orderStateName === "待确认") {
button = confirm + press + detail + edit + del;
}else{
button = press + detail + edit + del;
}
return button;
}}
]]
});
table.on('tool(orderDataTable)', function(obj) {
var layEvent = obj.event;
var id = obj.data.id;
if(layEvent === 'orderConfirm'){
// 确认到齐
xa.orderId = id;
xa.getOrderInfo(id,'orderConfirm');
}else if(layEvent === 'orderPress'){
// 催办
xa.getOrderInfo(id,'orderPress');
}else if(layEvent === 'detail'){
// 明细
xa.getOrderInfo(id,'detail');
}else if(layEvent === 'edit'){
// 编辑
xa.getOrderInfo(id,'edit');
}else{
// 删除
layer.confirm('真的删除'+obj.data.orderNo+"吗?", function(index){
obj.del(); //删除对应行(tr)的DOM结构,并更新缓存
layer.close(index);
//向服务端发送删除指令
xa.doDel(id);
});
}
})
});




更多精彩请关注guangmuhua.com


最新评论:

挺好看的
2020-03-11 17:15:50
1楼