risk-checklist.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8"/>
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  6. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  7. <title>风险清单</title>
  8. <link rel="stylesheet" href="../../../../assets/libs/layui/css/layui.css"/>
  9. <link rel="stylesheet" href="../../../../assets/module/admin.css?v=312"/>
  10. <link rel="stylesheet" href="../../../../assets/module/uParas.css?v=312"/>
  11. <style type="text/css">
  12. .layui-table-header .layui-table-cell {
  13. text-overflow: unset !important;
  14. overflow: unset !important;
  15. white-space: unset !important;
  16. height: auto;
  17. text-align: center;
  18. }
  19. </style>
  20. </head>
  21. <body>
  22. <!-- 加载动画 -->
  23. <div class="page-loading">
  24. <div class="ball-loader">
  25. <span></span><span></span><span></span><span></span>
  26. </div>
  27. </div>
  28. <!-- 正文开始 -->
  29. <div class="layui-fluid">
  30. <div class="layui-card">
  31. <div class="layui-card-body">
  32. <div class="layui-card-header">
  33. 风险管控措施清单
  34. <!-- <div class="layui-inline pull-right">
  35. <button onclick="history.back()" class="layui-btn layui-btn-sm layui-btn-radius layui-btn-normal"><i class="layui-icon">&#xe65c;</i>返回</button>
  36. </div>-->
  37. </div>
  38. <div class="layui-card-body">
  39. <div class="layui-form toolbar" lay-filter="filterForm">
  40. <div class="layui-form-item">
  41. <div class="layui-row">
  42. <div class="layui-inline layui-col-md3 text-left" style="margin-left: -20px;">
  43. <label class="layui-form-label" style="width: 40px;">部门</label>
  44. <div class="layui-input-inline mr0">
  45. <input type="text" id="groupName" name="groupName" value=""
  46. placeholder="点击选择"
  47. class="layui-input" readonly>
  48. <input type="hidden" id="groupId" name="groupId">
  49. <div id="menuContent" class="menuContent">
  50. <ul id="groupTree" class="ztree" style="margin-top:0;"></ul>
  51. </div>
  52. </div>
  53. </div>
  54. </div>
  55. </div>
  56. </div>
  57. <table class="layui-table" id="datatable" lay-filter="datatable"></table>
  58. </div>
  59. </div>
  60. </div>
  61. </div>
  62. <!-- js部分 -->
  63. <script type="text/javascript" src="../../../../assets/libs/layui/layui.js"></script>
  64. <script type="text/javascript" src="../../../../assets/js/common.js?v=312"></script>
  65. <script>
  66. layui.use(['layer', 'form', 'table', 'util', '_zTree', 'admin', 'uParas', 'tableX', 'soulTable'], function () {
  67. var $ = layui.jquery;
  68. var layer = layui.layer;
  69. var form = layui.form;
  70. var util = layui.util;
  71. var table = layui.table;
  72. var admin = layui.admin;
  73. var uParas = layui.uParas;
  74. var tableX = layui.tableX;
  75. var _zTree = layui._zTree;
  76. var data = layui.data(uParas.tableName);
  77. var groupId = data.user.gId;
  78. var soulTable = layui.soulTable;
  79. var changeGroup = {
  80. reload: function (data) {
  81. groupId = data.where.gId;
  82. // console.log("groupId......" + groupId);
  83. insTb.reload({where: {"gId": groupId}}, 'data');
  84. }
  85. };
  86. /***单位选择*/
  87. _zTree._init('/admin/common/getGroupLists', 'gId', 'groupParent', 'groupName', 'gId', 0, "groupTree", changeGroup, "menuContent", "groupName", "groupId", groupId);
  88. // 渲染表格数据
  89. var insTb = table.render({
  90. elem: '#datatable',
  91. url: uParas.baseUrl + '/ent/riskPoint/controlIndex',
  92. where: {"gId": groupId},
  93. page: false,
  94. toolbar: true,
  95. defaultToolbar: ['filter', { //自定义导出
  96. title: '导出',
  97. layEvent: 'LAYTABLE_EXPORT_EXCEL',
  98. icon: 'layui-icon-export'
  99. }, 'print'],
  100. cellMinWidth: 120,
  101. title: "风险管控措施清单",
  102. cols: [[
  103. {field: 'riskPointName', sort: false, title: '风险点名称', rowspan: '2', merge: true},
  104. // {field: '', title: '危险源', align: 'center', align: 'center', colspan: 3},
  105. {field: 'rootDangerSrcName', sort: false, title: '检查内容', rowspan: '2'},
  106. {field: 'dangerSrcName', sort: false, title: '标准要求', rowspan: '2'},
  107. {field: 'riskConsequence', sort: false, title: '可能导致后果', rowspan: 2},
  108. {
  109. field: 'riskLevel', align: 'center', sort: false, title: '风险等级', rowspan: 2,
  110. templet: function (d) {
  111. return setStatus(d);
  112. }
  113. },
  114. {field: 'riskCtrlLevelTitle', sort: false, title: '管控层级', rowspan: 2},
  115. {field: 'positionTitle', sort: false, title: '管控岗位', rowspan: 2},
  116. {field: 'personLiableName', sort: false, title: '责任人', rowspan: 2, merge: true},
  117. {field: '', title: '管控措施', align: 'center', colspan: 5},
  118. ], [
  119. // {field: 'rootDangerSrcName', sort: false, title: '根危险源'},
  120. // {field: 'parentDangerSrcName', sort: false, title: '一级危险源'},
  121. // {field: 'dangerSrcName', sort: false, title: '二级危险源'},
  122. {field: 'project', sort: false, title: '工程技术措施'},
  123. {field: 'manage', sort: false, title: '管理措施'},
  124. {field: 'education', sort: false, title: '教育措施'},
  125. {field: 'emergency', sort: false, title: '应急措施'},
  126. {field: 'protection', sort: false, title: '个体防护'}
  127. ]],
  128. done: function () {
  129. // tableX.merges('datatable', [0]); // 在done回调里面调用
  130. soulTable.render(this)
  131. }
  132. });
  133. //监听头工具栏事件
  134. table.on('toolbar(datatable)', function (obj) {
  135. var checkStatus = table.checkStatus(obj.config.id);
  136. switch (obj.event) {
  137. //自定义头工具栏右侧图标 - 导出
  138. case 'LAYTABLE_EXPORT_EXCEL':
  139. soulTable.export(insTb, {filename: '风险管控措施清单.xlsx'},
  140. {
  141. mergeData: true,
  142. // mergeDataColumn: [
  143. // 'riskPointName',
  144. // 'riskCode',
  145. // 'rootDangerSrcName',
  146. // 'parentDangerSrcName',
  147. // 'dangerSrcName',
  148. // 'riskReason',
  149. // 'riskConsequence',
  150. // 'riskLevel',
  151. // 'riskCtrlLevelTitle',
  152. // 'positionTitle',
  153. // 'personLiableName',
  154. // 'project',
  155. // 'manage',
  156. // 'education',
  157. // 'emergency',
  158. // 'protection'
  159. // ],
  160. dependKey: 'riskPointName',
  161. lineStyleConfig: [
  162. {
  163. field: 'riskPointName', // 字段名称
  164. type: '1', // 字段设置类型 1=>直接设置样式属性, 2=> 根据数值类型设置属性
  165. style: { // 样式属性
  166. bgColor: 'ffffff',
  167. color: '666666'
  168. }
  169. },
  170. {
  171. field: 'riskLevel', // 字段名称
  172. type: '2', // 字段设置类型 1=>直接设置样式属性, 2=> 根据数值类型设置属性
  173. numericType: [
  174. {
  175. typeNumber: 1,
  176. style: { // 样式属性
  177. bgColor: 'F3565D',
  178. color: '666666'
  179. }
  180. },
  181. {
  182. typeNumber: 2,
  183. style: { // 样式属性
  184. bgColor: 'FFA500',
  185. color: '666666'
  186. }
  187. },
  188. {
  189. typeNumber: 3,
  190. style: { // 样式属性
  191. bgColor: 'dfba49',
  192. color: '666666'
  193. }
  194. },
  195. {
  196. typeNumber: 4,
  197. style: { // 样式属性
  198. bgColor: '89C4F4',
  199. color: '666666'
  200. }
  201. }
  202. ],
  203. }
  204. ]
  205. }
  206. );
  207. break;
  208. }
  209. ;
  210. });
  211. //状态
  212. function setStatus(row) {
  213. if (row.riskLevel == 1) {
  214. return "<div style=\"background-color:#ff0000;\">重大</div>";
  215. } else if (row.riskLevel == 2) {
  216. return "<div style=\"background-color:#FF6100;\">较大</div>";
  217. } else if (row.riskLevel == 3) {
  218. return "<div style=\"background-color:#ffff00;\">一般</div>";
  219. } else {
  220. return "<div style=\"background-color:#0000ff;\">低</div>"
  221. }
  222. }
  223. });
  224. </script>
  225. </body>
  226. </html>