<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <!--<head th:replace="common/common_header :: common_header"></head>--> <head> <meta charset="UTF-8"> <title>后台管理系统</title> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <link rel="shortcut icon" th:href="@{/images/logo.jpg}"/> <link rel="stylesheet" th:href="@{/js/layui/css/layui.css}"> <link rel="stylesheet" th:href="@{/js/layui/css/admin.css}"> <script type="text/javascript" th:src="@{/js/jquery-3.3.1.min.js}"></script> <script th:src="@{/js/layui/layui.js}" charset="utf-8"></script> <style type="text/css"> img { height: 25px; } </style> </head> <body> <div class="layui-fluid" > <div class="layui-card" id="queryDiv"> <div class="layui-form layui-card-header layuiadmin-card-header-auto"> <div class="layui-form-item"> <div class="layui-inline"> <button class="layui-btn layuiadmin-button-btn" lay-submit lay-filter="The-search"> <i class="layui-icon layui-icon-search layuiadmin-button-btn"> </i> </button> </div> <div class="layui-inline"> <button class="layui-btn layuiadmin-button-btn" onclick="javascript:location.replace(location.href);"> <i class="layui-icon layui-icon-refresh-3 layuiadmin-button-btn"> </i> </button> </div> </div> </div> </div> <div class="layui-card-body"> <table class="layui-hide" id="tableId" lay-filter="tableId"></table> </div> </div> <!--<script type="text/html" id="faultStatus">--> <!-- {{#if (d.faultStatus == 0) { }}--> <!-- <span class="layui-bg-green">正常</span>--> <!-- {{# }else if(d.faultStatus == 1){ }}--> <!-- <span class="layui-bg-red">故障</span>--> <!-- {{# } }}--> <!--</script>--> <script type="text/html" id="toolbarUtil"> <div class="layui-btn-container"> <button class="layui-btn layui-btn" lay-event="add"><i class="layui-icon layui-icon-add-1"></i>新增</button> <button class="layui-btn layui-btn-danger" lay-event="del"><i class="layui-icon layui-icon-delete"></i>批量删除 </button> </div> </script> <script type="text/html" id="table-handle"> <!-- <i class="layui-icon layui-icon-search" lay-event="detail" title="查看详情"></i>--> <i class="layui-icon layui-icon-edit" lay-event="edit" title="编辑"></i> <i class="layui-icon layui-icon-delete" lay-event="del" title="删除"></i> </script> <script type="text/html" id="discountType"> {{#if (d.discountType == 1) { }} <span>不包邮</span> {{# }else if(d.discountType == 2){ }} <span>包邮</span> {{# } }} </script> <script> $("#queryDiv").hide() var field = {}; var indexInter; layui.use(['table', 'form'], function () { var form = layui.form, table = layui.table; //监听搜索 form.on('submit(The-search)', function (data) { field = data.field; //执行重载 table.reload('tableId', { where: field , page: { curr: 1 } }); }); table.render({ elem: '#tableId' , url: 'getList' , method: 'post' , height: 530 , toolbar: '#toolbarUtil' //开启头部工具栏,并为其绑定左侧模板 , defaultToolbar: ['filter'] , cols: [ [ {type: 'checkbox', fixed: 'left', field: ''} , {field: 'totalPrice', title: '总金额', fixed: 'left'} , {field: 'reductionPrice', title: '减免金额', fixed: 'left'} , {field: 'discountType', title: '是否包邮', toolbar: '#discountType'} , {field: 'id', width: 100, fixed: 'right', title: '操作', toolbar: '#table-handle'} ] ] , cellMinWidth: 20 //全局定义常规单元格的最小宽度,layui 2.2.1 新增 , skin: 'line ' //表格风格 line (行边框风格)row (列边框风格)nob (无边框风格) , even: true //隔行换色 , limit: Number.MAX_VALUE //每页默认显示的数量 , method: 'post' //提交方式 , page: false // , page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档 // layout: ['count', 'prev', 'page', 'next', 'skip', 'limit'] //自定义分页布局 // , curr: 1 //设定初始在第 5 页 // , groups: 10 //只显示 1 个连续页码 // } // , limits: [10, 20, 50, 100] //每页条数的选择项,默认:[10,20,30,40,50,60,70,80,90]。 }); //头工具栏事件 table.on('toolbar(tableId)', function (obj) { var checkStatus = table.checkStatus(obj.config.id); switch (obj.event) { case 'add': var w = ($(window).width() * 0.6); var h = ($(window).height() * 0.6); layer.open({ type: 2 , title: '新增满减' , content: 'addOrEdit' , area: [w + 'px', h + 'px'] , fix: false //不固定 , maxmin: true , shadeClose: true , shade: 0.4 , btn: ['保存', '关闭'] , yes: function (index, layero) { var body = layer.getChildFrame('body', index); //得到iframe页面层的BODY var iframeBtn = body.find('#saveBtn');//得到iframe页面层的提交按钮 iframeBtn.click();//模拟iframe页面层的提交按钮点击 } }); break; case 'del': var data = checkStatus.data; var id = ''; if (data.length > 0) { for (var j = 0; j < data.length; j++) { id = id + "," + data[j].discountId; } } else { layer.msg("请至少选择一条数据!"); return false; } layer.confirm('确定要彻底删除选中的数据吗?', function (index) { $.ajax({ url: "delDiscountByIds", data: {"id": id}, type: "POST", dataType: "json", success: function (result) { if (result.code == 100) { layer.msg(result.msg, {icon: 6, time: 1000}, function () { table.reload('tableId'); layer.close(index); }); } else { layer.msg(result.msg, {icon: 5}); table.reload('tableId'); layer.close(index); } } }); }); break; } ; }); //监听行工具事件 table.on('tool(tableId)', function (obj) { var data = obj.data; //console.log(obj) if (obj.event === 'del') { layer.confirm('确定彻底删除吗?', function (index) { $.ajax({ url: "delDiscountByIds", data: {"id": obj.data.discountId}, type: "POST", dataType: "json", success: function (result) { if (result.code == 100) { layer.msg(result.msg, {icon: 6, time: 1000}, function () { table.reload('tableId'); layer.close(index); }); } else { layer.msg(result.msg, {icon: 5}); } } }); }); } else if (obj.event === 'edit') { var id = obj.data.discountId; var w = ($(window).width() * 0.6); var h = ($(window).height() * 0.6); layer.open({ type: 2 , title: '满减编辑' , content: 'addOrEdit?id=' + id , area: [w + 'px', h + 'px'] , fix: false //不固定 , maxmin: true , shadeClose: true , shade: 0.4 , btn: ['保存', '关闭'] , yes: function (index, layero) { var body = layer.getChildFrame('body', index); //得到iframe页面层的BODY var iframeBtn = body.find('#saveBtn');//得到iframe页面层的提交按钮 iframeBtn.click();//模拟iframe页面层的提交按钮点击 } }); } }); }); </script> </body> </html>