<style>.btn-container { margin-bottom: 10px; }.layui-table-cell .layui-form-checkbox[lay-skin=primary] { top: 5px; }
</style><div class="layui-fluid"><div class="layui-card"><div class="layui-card-header">xx记录</div><div class="layui-card-body"><div class="btn-container layui-form"><!-- 组别搜索 --><div class="btn-container"><button class="layui-btn layui-btn-normal" onclick="add()">添加xx记录</button></div><table id="table" lay-filter="table" lay-data="{id: table}"></table></div></div></div>
</div><div class="layui-card-body" id="record-user" hidden="hidden"><div class="layui-form layui-form-pane" lay-filter = 'datafile'><div class="layui-form-item"><label class="layui-form-label">xx账号</label><div class="layui-input-inline"><select name="xxxx" lay-verify="xxx"><option value="">请选择xx账号</option>{foreach $xxx as $key => $vo}<option value="{$vo.id}">{$vo.xxxx}</option>{/foreach}</select></div></div><div class="layui-form-item" ><label class="layui-form-label">xx信息</label><div class="layui-input-inline"><input type="text" name="xxx" required placeholder="请输入xx信息" class="layui-input"></div></div></div>
</div><script>layui.use(['table', 'form'], function() {var table = layui.table;var form  = layui.form;var tableIns = table.render({elem: "#table",url: "{:url('xxx')}",page: true,　　　　　　　//这是重点　　　　　　　cellMinWidth:70,done: function(res) {},cols: [[// {type: 'checkbox', fixed: 'left'},
                {field: 'id', title: 'ID', sort: true, align: 'center'},{field: 'xx', title: 'xx', sort: true, align: 'center'},{field: 'xx', title: 'xx', sort: true, align: 'center'},{field: 'xx', title: 'xx', sort: true, align: 'center'},{title: '操作', align: 'center', sort: true, templet: '#operation', fixed: 'right'}]]});// 监听工具栏
        table.on('tool(table)', function(o) {var d   = o.data,lEv = o.event,tr  = o.trif (parseInt('{$xx_power}') != 0) {layer.msg('您没有权限操作', { icon: 5, time: 1200 });return false;}if (lEv == 'detail') pop(d);if (lEv == 'deleted') deleted(d);})// 类型搜索
        form.on('select(type)', function(data) {search(tableIns);});$(document).on('click','#seach',function(){nameseach(tableIns);});});// 添加var add = function() {var title = 'xx记录添加'layer.open({type:1,title: title,content: $('#record-user'),btn:['确定','取消'],area:['350px','35%'],yes:function(res){// 判断输入框是否为空if ($('[name=xxx]').val().length == 0){layer.alert('不能存在空的输入框', { icon: 5 });return ;}var d = {xx: $('[name=xx]').val(),xx: $('[name=xx]').val(),}var u = '{:url("xx")}'layer.load(2);$.post(u, d, function(res) {// 清除弹出层
                    layer.closeAll()if (res.code == 0) {layer.msg('添加成功', {icon: 6, time: 1500}, function() {window.location.reload()})return ;}layer.msg('添加失败', {icon: 5, time: 1500})})}});}// 修改var pop = function(data) {var title ='xx编辑'var html  = '<div class="layui-form">'html += '<div class="layui-form-item" >'html += '<label class="layui-form-label">xx账户</label>'html += '<div class="layui-input-block">'html += '<input type="text" name="xx" required placeholder="xxxxx" class="layui-input" disabled>'html += '</div>'html += '</div>'html += '<div class="layui-form-item">'html += '<label class="layui-form-label">xxx</label>'html += '<div class="layui-input-inline">'html += '<input type="text" name="xx" required placeholder="xxxx" class="layui-input">'html += '</div>'html += '</div>'html += '</div>'layer.open({title: title,content: html,yes: function(res) {// 判断输入框是否为空if ($('[name=xx]').val().length == 0){layer.alert('不能存在空的输入框', { icon: 5 });return ;}var d = {xxx: $('[name=xxx]').val(),}var u = '{:url("xxx")}'d.id = data.idlayer.load(2);$.post(u, d, function(res) {// 清除弹出层
                    layer.closeAll()if (res.code == 0) {layer.msg('修改成功', {icon: 6, time: 1500}, function() {window.location.reload()})return ;}layer.msg('修改失败', {icon: 5, time: 1500})})}});// 设置数据if (data != null) {$('[name=xxxx]').val(data.xxx)$('[name=xxx]').val(data.xxx)}}// 删除var deleted = function(data) {layer.confirm('确认删除该数据?', function() {layer.closeAll()$.ajax({url : "{:url('xxx')}",type : "POST",data : {'xx' : data.xx,},dataType : 'json' ,success : function(res){console.log(res);if(res.code == 0){layer.msg("删除成功", {icon: 6}, function() {location.reload();});} else{layer.msg("删除失败", {icon: 5});}}});});}
</script>
<script type="text/html" id="operation"><a class="layui-btn layui-btn-xs" lay-event="detail">编辑</a><a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="deleted">删除</a>
</script>