index.html 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title></title>
  6. <meta http-equiv="pragma" content="no-cache"/>
  7. <meta http-equiv="cache-control" content="no-cache,must-revalidate"/>
  8. <meta http-equiv="expires" content="0"/>
  9. <meta name="renderer" content="webkit">
  10. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  11. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  12. {% include '/common/layui_css.html' %}
  13. </head>
  14. <body>
  15. <div class="layuimini-container">
  16. <div class="layuimini-main">
  17. <fieldset class="table-search-fieldset">
  18. <legend>搜索信息</legend>
  19. <div style="margin: 10px 10px 10px 10px">
  20. <form class="layui-form layui-form-pane" action="">
  21. <div class="layui-form-item">
  22. <div class="layui-inline">
  23. <label class="layui-form-label">平台</label>
  24. <div class="layui-input-inline">
  25. <select name="type">
  26. <option value=""></option>
  27. <option value="ztn-data">省大数据平台</option>
  28. </select>
  29. </div>
  30. </div>
  31. <div class="layui-inline">
  32. <label class="layui-form-label">指标名称</label>
  33. <div class="layui-input-inline">
  34. <input type="text" name="name" autocomplete="off" class="layui-input">
  35. </div>
  36. </div>
  37. <div class="layui-inline">
  38. <button type="button" class="layui-btn layui-btn-primary" data-type="reload" lay-submit
  39. lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
  40. </div>
  41. </div>
  42. </form>
  43. </div>
  44. </fieldset>
  45. <table class="layui-hide" id="test" lay-filter="test"></table>
  46. <script type="text/html" id="toolbarDemo">
  47. <div class="layui-btn-container">
  48. <button class="layui-btn layui-btn-normal layui-btn-sm" lay-event="btn_add">新增</button>
  49. <button class="layui-btn layui-btn-danger layui-btn-sm" lay-event="btn_delete">删除</button>
  50. </div>
  51. </script>
  52. <script type="text/html" id="barDemo">
  53. <a class="layui-btn layui-btn-xs" lay-event="edit">详情</a>
  54. </script>
  55. </div>
  56. </div>
  57. {% include '/common/layui_js.html' %}
  58. <script>
  59. layui.use(['layer', 'miniTab','table','form'], function () {
  60. var $ = layui.$,
  61. form = layui.form,
  62. layer = layui.layer,
  63. miniTab = layui.miniTab,
  64. table = layui.table;
  65. var loadingIndex;
  66. var param = {};
  67. miniTab.listen();
  68. table.render({
  69. elem: '#test'
  70. ,url:'index.json'
  71. ,toolbar: '#toolbarDemo'
  72. ,defaultToolbar: []
  73. ,cols: [[
  74. {type:'checkbox'}
  75. ,{type:'numbers'}
  76. ,{field:'name', title:'接口名称', minWidth: 380}
  77. ,{field:'type', title:'平台', width:130}
  78. ,{field:'state', title:'状态', width:120}
  79. ,{field:'rank', title:'排序', width:80}
  80. ,{field:'log_time', title:'最近运行时间', width:180}
  81. ,{field:'log_status', title:'日志状态', width:110}
  82. ,{field:'row_count', title:'记录数', width:80}
  83. ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:120}
  84. ]]
  85. ,page: true
  86. ,limit: 40
  87. ,where: {
  88. time:new Date()
  89. }
  90. });
  91. form.on('submit(data-search-btn)', function (data) {
  92. console.log(data.field);
  93. param = data.field;
  94. table.reload('test', {
  95. page: { curr: 1 }
  96. , where: data.field
  97. }, 'data');
  98. return false;
  99. });
  100. table.on('toolbar(test)', function(obj) {
  101. var checkStatus = table.checkStatus(obj.config.id);
  102. if(obj.event == 'btn_add') {
  103. layer.open({
  104. type: 2,
  105. title: '新增',
  106. area: ['700px', '550px'],
  107. fixed: true,
  108. maxmin: false,
  109. content: 'add.html',
  110. end:function(){
  111. location.reload();
  112. }
  113. });
  114. }
  115. if(obj.event == 'btn_delete') {
  116. var data = checkStatus.data;
  117. if(data.length == 0) {
  118. var index = layer.alert('请勾选接口', {
  119. icon: 2,
  120. }, function () {
  121. layer.close(index);
  122. });
  123. return false;
  124. }
  125. else {
  126. var id_list = [];
  127. data.forEach(function (item) {
  128. id_list.push(item.id);
  129. });
  130. layer.confirm('确认删除接口?', function (index) {
  131. $.post("delete.html", JSON.stringify({ ids: id_list}), function(r) {
  132. if(r.ret == 0) {
  133. layer.close(index);
  134. location.reload();
  135. }
  136. else {
  137. layer.alert(r.msg, { icon: 2 });
  138. }
  139. });
  140. });
  141. return false;
  142. }
  143. }
  144. });
  145. table.on('tool(test)', function (obj) {
  146. var data = obj.data;
  147. if (obj.event === 'edit') {
  148. miniTab.openNewTabByIframe({
  149. href: "ywtg/jkjc/zcqk/jkzc/edit.html?id="+data.id,
  150. title: '接口详情',
  151. });
  152. }
  153. });
  154. });
  155. </script>
  156. </body>
  157. </html>