log_list.html 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>操作日志</title>
  7. <link rel="stylesheet" href="../../lib/layui/css/layui.css">
  8. <style>
  9. body { padding: 15px; }
  10. .search-form { margin-bottom: 15px; padding: 15px; background: #fff; border-radius: 4px; }
  11. </style>
  12. </head>
  13. <body>
  14. <div class="search-form">
  15. <form class="layui-form layui-form-pane" lay-filter="searchForm">
  16. <div class="layui-form-item">
  17. <div class="layui-inline">
  18. <label class="layui-form-label">操作模块</label>
  19. <div class="layui-input-inline">
  20. <input type="text" name="title" placeholder="请输入操作模块" class="layui-input">
  21. </div>
  22. </div>
  23. <div class="layui-inline">
  24. <label class="layui-form-label">操作人</label>
  25. <div class="layui-input-inline">
  26. <input type="text" name="operator" placeholder="请输入操作人" class="layui-input">
  27. </div>
  28. </div>
  29. <div class="layui-inline">
  30. <label class="layui-form-label">操作类型</label>
  31. <div class="layui-input-inline">
  32. <select name="businessType" class="layui-select">
  33. <option value="">全部</option>
  34. <option value="0">其他</option>
  35. <option value="1">新增</option>
  36. <option value="2">修改</option>
  37. <option value="3">删除</option>
  38. <option value="4">查询</option>
  39. <option value="5">登录</option>
  40. </select>
  41. </div>
  42. </div>
  43. <div class="layui-inline">
  44. <button type="button" class="layui-btn" id="btnSearch"><i class="layui-icon layui-icon-search"></i> 搜索</button>
  45. <button type="reset" class="layui-btn layui-btn-primary">重置</button>
  46. </div>
  47. </div>
  48. </form>
  49. </div>
  50. <table id="tableList" lay-filter="tableList"></table>
  51. <script type="text/html" id="toolbar">
  52. <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="detail"><i class="layui-icon layui-icon-about"></i> 详情</a>
  53. </script>
  54. <script type="text/html" id="businessTypeTpl">
  55. {{# var types = ['其他', '新增', '修改', '删除', '查询', '登录']; }}
  56. {{# = types[d.businessType] || '其他' }}
  57. </script>
  58. <script type="text/html" id="statusTpl">
  59. {{# if(d.status === 0) { }}
  60. <span class="layui-badge layui-bg-green">成功</span>
  61. {{# } else { }}
  62. <span class="layui-badge layui-bg-red">失败</span>
  63. {{# } }}
  64. </script>
  65. <script src="../../lib/layui/layui.js"></script>
  66. <script src="../../js/config.js"></script>
  67. <script src="../../js/common.js"></script>
  68. <script>
  69. layui.use(['table', 'layer', 'form'], function() {
  70. var table = layui.table;
  71. var layer = layui.layer;
  72. var form = layui.form;
  73. var tableIns = TableRender.init({
  74. elem: '#tableList',
  75. url: Config.api.operLog.page,
  76. cols: [[
  77. { field: 'title', title: '操作模块', width: 150 },
  78. { field: 'businessType', title: '操作类型', width: 100, templet: '#businessTypeTpl' },
  79. { field: 'operator', title: '操作人', width: 120 },
  80. { field: 'ip', title: 'IP地址', width: 140 },
  81. { field: 'location', title: '操作地点', width: 150 },
  82. { field: 'status', title: '状态', width: 100, templet: '#statusTpl' },
  83. { field: 'createTime', title: '操作时间', width: 170, templet: function(d) { return Common.formatDate(d.createTime); } },
  84. { fixed: 'right', title: '操作', width: 80, align: 'center', toolbar: '#toolbar' }
  85. ]]
  86. });
  87. $('#btnSearch').click(function() {
  88. table.reload('tableList', {
  89. where: form.val('searchForm'),
  90. page: { curr: 1 }
  91. });
  92. });
  93. table.on('tool(tableList)', function(obj) {
  94. var data = obj.data;
  95. var event = obj.event;
  96. if (event === 'detail') {
  97. Common.open({
  98. title: '日志详情',
  99. area: ['700px', '500px'],
  100. content: 'log_detail.html?id=' + data.id
  101. });
  102. }
  103. });
  104. });
  105. </script>
  106. </body>
  107. </html>