index.html 4.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. {extend name='../../admin/view/table'}
  2. {block name="button"}
  3. <!--{if auth("add")}-->
  4. <button class='layui-btn layui-btn-sm layui-btn-primary' data-table-id="DiscountTable" data-modal="{:url('add')}" data-title="添加折扣">添加折扣</button>
  5. <!--{/if}-->
  6. {/block}
  7. {block name="content"}
  8. <div class="layui-tab layui-tab-card">
  9. <ul class="layui-tab-title">
  10. {foreach ['index'=>'折扣管理','recycle'=>'回 收 站'] as $k=>$v}{if isset($type) and $type eq $k}
  11. <li data-open="{:url('index')}?type={$k}" class="layui-this color-green">{$v}</li>
  12. {else}
  13. <li data-open="{:url('index')}?type={$k}">{$v}</li>
  14. {/if}{/foreach}
  15. </ul>
  16. <div class="layui-tab-content">
  17. <table id="DiscountTable" data-url="{:sysuri()}" data-target-search="form.form-search"></table>
  18. </div>
  19. </div>
  20. {/block}
  21. {block name='script'}
  22. <script>
  23. $(function () {
  24. // 初始化表格组件
  25. $('#DiscountTable').layTable({
  26. even: true, height: 'full',
  27. sort: {field: 'sort desc,id', type: 'desc'},
  28. where: {type: '{$type|default="index"}'},
  29. cols: [[
  30. {field: 'id', title: 'ID', align: "center", width: 80},
  31. {field: 'sort', title: '排序权重', align: 'center', width: 100, sort: true, templet: '#SortInputTpl'},
  32. {field: 'name', title: '折扣名称', align: 'left', minWidth: 140},
  33. {
  34. field: 'items', title: '折扣方案', align: 'left', width: '33%', templet: function (d) {
  35. return (d.html = ''), d.items.forEach(function (item) {
  36. d.html += laytpl('<span class="layui-badge layui-bg-gray">VIP{{d.level}} 折扣 {{d.discount}}%</span>').render(item);
  37. }), d.html;
  38. }
  39. },
  40. {field: 'status', title: '状态', align: 'center', width: 110, templet: '#StatusSwitchTpl'},
  41. {field: 'create_at', title: '创建时间', align: 'center', minWidth: 170, sort: true},
  42. {toolbar: '#toolbar', title: '操作面板', align: 'center', minWidth: 80, fixed: 'right'},
  43. ]]
  44. });
  45. // 数据状态切换操作
  46. layui.form.on('switch(StatusSwitch)', function (obj) {
  47. var data = {id: obj.value, status: obj.elem.checked > 0 ? 1 : 0};
  48. $.form.load("{:url('state')}", data, 'post', function (ret) {
  49. if (ret.code < 1) $.msg.error(ret.info, 3, function () {
  50. $('#DiscountTable').trigger('reload');
  51. }); else {
  52. $('#DiscountTable').trigger('reload');
  53. }
  54. return false;
  55. }, false);
  56. });
  57. });
  58. </script>
  59. <!-- 列表排序权重模板 -->
  60. <script type="text/html" id="SortInputTpl">
  61. <input type="number" min="0" data-blur-number="0" data-action-blur="{:sysuri()}" data-value="id#{{d.id}};action#sort;sort#{value}" data-loading="false" value="{{d.sort}}" class="layui-input text-center">
  62. </script>
  63. <!-- 数据状态切换模板 -->
  64. <script type="text/html" id="StatusSwitchTpl">
  65. <!--{if auth("state")}-->
  66. <input type="checkbox" value="{{d.id}}" lay-skin="switch" lay-text="已激活|已禁用" lay-filter="StatusSwitch" {{-d.status>0?'checked':''}}>
  67. <!--{else}-->
  68. {{-d.status ? '<b class="color-green">已启用</b>' : '<b class="color-red">已禁用</b>'}}
  69. <!--{/if}-->
  70. </script>
  71. <!-- 数据操作工具条模板 -->
  72. <script type="text/html" id="toolbar">
  73. <!--{if auth("edit") and isset($type) and $type eq 'index'}-->
  74. <a class="layui-btn layui-btn-primary layui-btn-sm" data-title="编辑折扣" data-modal='{:url("edit")}?id={{d.id}}'>编 辑</a>
  75. <!--{/if}-->
  76. <!--{if auth("remove") and isset($type) and $type neq 'index'}-->
  77. <a class="layui-btn layui-btn-danger layui-btn-sm" data-action="{:url('remove')}" data-value="id#{{d.id}}" data-confirm="确定要删除折扣吗?">删 除</a>
  78. <!--{/if}-->
  79. </script>
  80. {/block}