layui.use(['form', 'table', 'laydate'], function(){ var form = layui.form; var table = layui.table; var laydate = layui.laydate; laydate.render({ elem: '#begin_time' //指定元素 }); laydate.render({ elem: '#end_time' //指定元素 }); var renderTable = function () { table.render({ id: 'list' ,elem: '#kefu' ,url: '/api/ApiKefuList' //数据接口 ,method:'post' ,cellMinWidth: 80 //全局定义常规单元格的最小宽度 ,page: true //开启分页 ,cols: [[ //表头 {title: '序号', type: 'numbers', fixed: 'left', width: 80} ,{field: 'sale_id', title: '客服ID', width: 200} ,{field: 'sale_name', title: '客服名称', width: 200} ,{field: 'email', title: '邮箱', width: 300} ,{field: 'operator_name', title: '操作人名称', width: 200} ,{field: 'status', title: '审核状态', templet: '#status', width: 200} ,{field: 'create_time', title: '创建时间', width: 200} ,{title: '操作', align:'center', fixed: 'right', toolbar: '#list_action', width: 218} ]] ,limit: 10 ,limits: [10, 20, 50,] }); }; renderTable(); form.on('submit(load)', function(data) { //执行重载 table.reload('list', { page: { curr: 1 } ,where: data.field }); return false; }); $('.add').click(function() { layer.open({ area: ['400px', '200px'], title: '新增客服', type: 1, content: $('#kefu-action'), btn: ['确认', '取消'], yes: function(index) { var email = $('.kefu-email').val(); if (!email) { layer.tips('请输入邮箱', $('.kefu-email')); return false; } $.ajax({ url : '/api/ApiAddKefu', type: 'post', data: {email: email}, dataType: 'json', success: function(resp) { if (resp.errcode == 0) { layer.close(index); layer.msg(resp.errmsg); renderTable(); // 重新加载table return false; } layer.msg(resp.errmsg); }, error: function(err) { console.log(err) } }) layer.msg('新增客服中...', {icon: 16, time: 0, shade: 0.3}); // 阻止重复提交 return false; }, cancel: function(index) { layer.close(index); } }) $('.kefu-email').val(''); }) // tool操作 table.on('tool(kefu)', function(obj){ //注:tool是工具条事件名,test是table原始容器的属性lay-filter="对应的值" var data = obj.data; //获得当前行数据 var layEvent = obj.event; //获得 lay-event 对应的值(也可以是表头的 event 参数对应的值) var url = ''; var title = ''; var content = ''; var datax = {}; datax.id = data.id; if(layEvent === 'edit') { url = '/api/ApiEditKefu'; title = '编辑客服'; content = $('#kefu-action'); } else if (layEvent === 'del') { url = '/api/ApiDelKefu'; title = '删除客服'; content = '<div style="margin: 40px;">确定删除该客服吗?</div>'; datax.status = data.status; } else if (layEvent === 'top') { url = '/api/ApiTopKefu'; title = '置顶客服'; content = '<div style="margin: 40px;">确定置顶该客服吗?</div>'; } layer.open({ area: ['400px', '200px'], title: title, type: 1, content: content, btn: ['确认', '取消'], yes: function(index) { if (layEvent == 'edit') { var email = $('.kefu-email').val(); if (!email) { layer.tips('请输入邮箱', $('.kefu-email')); return false; } datax.email = email; } $.ajax({ url : url, type: 'post', data: datax, dataType: 'json', success: function(resp) { if (resp.errcode == 0) { layer.close(index); layer.msg(resp.errmsg); renderTable(); // 重新加载table return false; } layer.msg(resp.errmsg); }, error: function(err) { console.log(err) } }) layer.msg(title+'中...', {icon: 16, time: 0, shade: 0.3}); // 阻止重复提交 return false; }, cancel: function(index) { layer.close(index); } }) if (layEvent == 'edit') { $('.kefu-email').val(data.email); } }); });