list.html 3.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <div class="layui-layout layui-layout-admin" style="padding-left: 20px;">
  2. <div class="layui-row" style="margin-top: 20px;">
  3. <div class="layui-col-xs6">
  4. <a class="layui-btn" data-type="tabAdd" href="/code/add">新增</a>
  5. </div>
  6. <div class="layui-col-xs6 search_text">
  7. <form class="layui-form" action="" onsubmit="javascript:return false;">
  8. <div class="demoTable">
  9. <div class="layui-inline" style="width: 40%">
  10. <input class="layui-input" name="code" id="code" autocomplete="off" placeholder="状态码" >
  11. </div>
  12. <button class="layui-btn" data-type="reload">查询</button>
  13. </div>
  14. </form>
  15. </div>
  16. </div>
  17. <table class="layui-hide" id="table_list" lay-filter="table_filter">
  18. </table>
  19. <script type="text/html" id="bar">
  20. <!-- <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a> -->
  21. <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  22. <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
  23. </script>
  24. </div>
  25. <script>
  26. layui.use(['table','form','element'], function(){
  27. var table = layui.table;
  28. var form = layui.form;
  29. var element = layui.element;
  30. //方法级渲染
  31. table.render({
  32. elem: '#table_list'
  33. ,url: '/code/table'
  34. ,cols: [[
  35. // {checkbox: true, fixed: true},
  36. {field:'id', title: 'ID', align:'center',sort: true, width:150}
  37. ,{field:'code',title: '状态码'}
  38. ,{field:'desc', title: '描述'}
  39. ,{field:'create_time', title: '创建时间'}
  40. ,{field:'update_time', title: '修改时间'}
  41. ,{fixed: 'right', width:160, align:'center', toolbar: '#bar'}
  42. ]]
  43. ,id: 'listReload'
  44. ,page: true
  45. ,height: "full-130"
  46. });
  47. var $ = layui.$, active = {
  48. reload: function(){
  49. table.reload('listReload', {
  50. where: {
  51. code: $('#code').val(),
  52. }
  53. });
  54. }
  55. };
  56. $('.demoTable .layui-btn').on('click', function(){
  57. var type = $(this).data('type');
  58. active[type] ? active[type].call(this) : '';
  59. });
  60. //监听工具条
  61. table.on('tool(table_filter)', function(obj){
  62. var data = obj.data;
  63. if(obj.event === 'detail'){
  64. //layer.msg('ID:'+ data.id + ' 的查看操作');
  65. } else if(obj.event === 'del'){
  66. layer.confirm('真的删除【'+data.code+'】么', function(index){
  67. var jsData = {'id':data.id}
  68. $.post('{{urlfor "CodeController.AjaxDel"}}', jsData, function (out) {
  69. if (out.status == 0) {
  70. layer.alert('删除成功了', {icon: 1},function(index){
  71. layer.close(index);
  72. window.location.reload();
  73. });
  74. } else {
  75. layer.msg(out.message)
  76. }
  77. }, "json");
  78. obj.del();
  79. layer.close(index);
  80. });
  81. } else if(obj.event === 'edit'){
  82. window.location.href="/code/edit?id="+data.id
  83. }
  84. });
  85. });
  86. </script>