detail.html 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313
  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/formSelects/formSelects-v4.css"/>
  10. <link rel="stylesheet" href="../../../assets/module/admin.css?v=312"/>
  11. <link rel="stylesheet" href="../../../assets/module/uParas.css?v=312"/>
  12. </head>
  13. <body>
  14. <style type="text/css">
  15. </style>
  16. <!-- 加载动画 -->
  17. <div class="page-loading">
  18. <div class="ball-loader">
  19. <span></span><span></span><span></span><span></span>
  20. </div>
  21. </div>
  22. <!-- 正文开始 -->
  23. <div class="layui-fluid">
  24. <div class="layui-card">
  25. <div class="layui-card-body">
  26. <div class="layui-card-header">
  27. 任务定义详情
  28. <div class="layui-inline pull-right">
  29. <button onclick="history.back()" class="layui-btn layui-btn-sm layui-btn-radius layui-btn-normal"><i class="layui-icon">&#xe65c;</i>返回</button>
  30. </div>
  31. </div>
  32. <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
  33. <div class="layui-tab-content" style="height: auto;">
  34. <div class="layui-tab-item layui-show">
  35. <div class="layui-row">
  36. <div class="layui-col-xs12">
  37. <div class="layui-form">
  38. <table class="layui-table">
  39. <thead>
  40. </thead>
  41. <tbody>
  42. <tr>
  43. <th width="150">任务名称</th>
  44. <td id="riskCheckDefTitle"></td>
  45. <th width="150">任务分类</th>
  46. <td id="checkMode">
  47. </td>
  48. </tr>
  49. <tr>
  50. <th width="150">执行部门</th>
  51. <td id="groupName"></td>
  52. <th width="150">执行岗位</th>
  53. <td id="positionName"></td>
  54. </tr>
  55. <tr>
  56. <th width="150">检查频率</th>
  57. <td id="checkType"></td>
  58. <th width="150">任务状态</th>
  59. <td id="status"></td>
  60. </tr>
  61. <tr>
  62. <th width="150">计划开始时间</th>
  63. <td id="startTime"></td>
  64. <th width="150">计划结束时间</th>
  65. <td id="endTime"></td>
  66. </tr>
  67. <tr>
  68. <th width="150">实际开始时间</th>
  69. <td id="executeTime"></td>
  70. <th width="150">实际完成时间</th>
  71. <td id="finishTime"></td>
  72. </tr>
  73. <tr>
  74. <th width="150">参与人员</th>
  75. <td id="riskCheckParticipantName"></td>
  76. <th width="150">检查类型</th>
  77. <td id="riskCheckTypeName"></td>
  78. </tr>
  79. <tr>
  80. <th width="150">描述</th>
  81. <td id="riskCheckDefDesc" colspan="3"></td>
  82. </tr>
  83. </tbody>
  84. </table>
  85. </div>
  86. </div>
  87. </div>
  88. <div class="layui-card-header">
  89. 任务列表
  90. </div>
  91. <!--检查记录-->
  92. <table class="layui-table text-left" id="datatable" lay-filter="datatable"></table>
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. </div>
  98. </div>
  99. <!--数据TPL-->
  100. <script type="text/html" id="checkModeTpl">
  101. {{# if(d.checkMode != null && d.checkMode == '1'){ }}
  102. 现场检查
  103. {{# } else { }}
  104. 基础检查
  105. {{# } }}
  106. </script>
  107. <!-- js部分 -->
  108. <script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
  109. <script type="text/javascript" src="../../../assets/js/common.js?v=312"></script>
  110. <script>
  111. layui.use(['layer', 'form', 'table', 'util', 'zTree', 'admin', 'uParas', 'element'], function () {
  112. var $ = layui.jquery;
  113. var layer = layui.layer;
  114. var form = layui.form;
  115. var util = layui.util;
  116. var admin = layui.admin;
  117. var table = layui.table;
  118. var uParas = layui.uParas;
  119. var element = layui.element;
  120. var scheduleId = uParas.getUrlParam("scheduleId");
  121. admin.req(uParas.baseUrl + '/ent/riskCheckedSchdule/detail/' + scheduleId, null, function (res) {
  122. if (res.code == 1) {
  123. var schduleDto = res.data;
  124. if (schduleDto != null) {
  125. $("#riskCheckDefTitle").text(schduleDto.riskCheckDefTitle);
  126. if (schduleDto.checkMode == '1') {
  127. if (schduleDto.checkType == 'fixed') {
  128. $("#checkMode").text("【常规】现场任务");
  129. }else if (schduleDto.checkType == 'random') {
  130. $("#checkMode").text("【临时】现场任务");
  131. }
  132. } else if (schduleDto.checkMode == '2') {
  133. if (schduleDto.checkType == 'fixed') {
  134. $("#checkMode").text("【常规】基础任务");
  135. }else if (schduleDto.checkType == 'random') {
  136. $("#checkMode").text("【临时】基础任务");
  137. }
  138. }
  139. $("#groupName").text(schduleDto.groupName);
  140. $("#positionName").text(schduleDto.riskCheckPositionName);
  141. //检查频率
  142. var checkCycle = "";
  143. if (schduleDto.checkType == 'random') {
  144. checkCycle = "临时性检查,无固定频率";
  145. } else {
  146. if (schduleDto.scheduleFrequency == 'year') {
  147. checkCycle = schduleDto.scheduleCount + "次/年";
  148. } else if (schduleDto.scheduleFrequency == 'half_year') {
  149. checkCycle = schduleDto.scheduleCount + "次/半年";
  150. } else if (schduleDto.scheduleFrequency == 'quarter') {
  151. checkCycle = schduleDto.scheduleCount + "次/季度";
  152. } else if (schduleDto.scheduleFrequency == 'month') {
  153. checkCycle = schduleDto.scheduleCount + "次/月";
  154. } else if (schduleDto.scheduleFrequency == 'week') {
  155. checkCycle = schduleDto.scheduleCount + "次/周";
  156. } else if (schduleDto.scheduleFrequency == 'day') {
  157. checkCycle = schduleDto.scheduleCount + "次/天";
  158. }
  159. }
  160. $("#checkType").text(checkCycle);
  161. //任务状态
  162. var statusStr = "";
  163. if (schduleDto.status === 2) {
  164. statusStr = "已检查";
  165. } else if (schduleDto.status === 1) {
  166. statusStr = "进行中";
  167. } else if (schduleDto.status === 0) {
  168. statusStr = "未检查";
  169. if (schduleDto.checkType === "random") {
  170. var curTime = new Date();
  171. var endtime = new Date(schduleDto.endTime);
  172. if (curTime >= endtime) {
  173. statusStr = "已逾期";
  174. }
  175. }
  176. } else if (schduleDto.status === 3) {
  177. statusStr = "已逾期";
  178. } else {
  179. statusStr = "未知"
  180. }
  181. $("#status").text(statusStr);
  182. $("#startTime").text(schduleDto.startTime);
  183. $("#endTime").text(schduleDto.endTime);
  184. if (schduleDto.executeTime != null) {
  185. $("#executeTime").text(schduleDto.executeTime);
  186. } else {
  187. $("#executeTime").text("未开始检查");
  188. }
  189. if (schduleDto.finishTime != null) {
  190. $("#finishTime").text(schduleDto.finishTime);
  191. } else {
  192. $("#finishTime").text("未检查完成");
  193. }
  194. //$("#finishTime").text(schduleDto.finishTime);
  195. $("#riskCheckParticipantName").text(schduleDto.riskCheckParticipantName);
  196. $("#riskCheckTypeName").text(schduleDto.riskCheckTypeName);
  197. $("#riskCheckDefDesc").text(schduleDto.riskCheckDefDesc);
  198. }
  199. initTable()
  200. }
  201. }, 'get');
  202. /**子任务列表*/
  203. function initTable() {
  204. // 渲染表格
  205. insTb = table.render({
  206. elem : '#datatable',
  207. url : uParas.baseUrl + '/ent/riskCheckedSchdule/querySonLevelTaskByPage',
  208. where: {
  209. "scheduleId":scheduleId
  210. },
  211. page : true,
  212. toolbar: true,
  213. title:'任务列表',
  214. cellMinWidth: 100,
  215. cols : [[
  216. {type : 'numbers' , title :'序号'} ,
  217. // {field: 'checkMode' ,sort:false , title:'任务类型',templet:'#checkModeTpl' },
  218. // {field: 'riskCheckTypeName' , sort:false , title:'检查类型'},
  219. {field: 'checkDefName', sort:false , title:'安全专业检查表'},
  220. {field: 'groupName' , sort:false , title:'执行单位'},
  221. {field: 'riskCheckPositionName', sort: false, title: '执行岗位',width: 100, },
  222. {field: 'executorName', sort: false, title: '执行人员',width: 100,},
  223. // {field: 'riskCheckGroupName', sort: false, title: '受检部门' },
  224. {field: 'status' , sort:false , title:'状态',width: 100, templet:function (d) {
  225. return setStatus(d);
  226. }},
  227. {field: 'frequency' , sort:false , title:'检查频率',width: 100, templet:function (d) {
  228. return setFrequency(d);
  229. }},
  230. {field: 'startTime' , sort:false , title:'开始时间',width:160 },
  231. {field: 'endTime' , sort:false , title:'结束时间',width:160 },
  232. {align: 'center', title:'操作', width: 110,fixed:'right',width: 100,
  233. templet: function (d) {
  234. return setOperation(d);
  235. }
  236. }
  237. ]]
  238. });
  239. }
  240. //状态
  241. function setStatus(row){
  242. if (row.status === 2) {
  243. return "<i class=\"layui-icon\" style=\"color: limegreen;\">&#xe617; 已检查</i> ";
  244. } else if (row.status === 1) {
  245. return "<i class=\"layui-icon\" style=\"color: #b854d4\">&#xe617; 检查中</i> ";
  246. } else if (row.status === 0) {
  247. return "<i class=\"layui-icon\" style=\"color: darkgrey;\">&#xe617; 未检查</i> ";
  248. } else if (row.status === 3) {
  249. return "<i class=\"layui-icon\" style=\"color: indianred\">&#xe617; 已逾期</i> ";
  250. } else {
  251. return "未知"
  252. }
  253. }
  254. //频率
  255. function CycleFunction(row) {
  256. if (row.checkType === 'random') {
  257. var startTime = row.startTime;
  258. var endTime = row.endTime;
  259. return "1次/临时";
  260. } else {
  261. var arrKey = ['year', 'half_year', 'quarter', 'month', 'week', 'day'];
  262. var arrVal = ['年', '半年', '季度', '月', '星期', '天'];
  263. var i = $.inArray(row.scheduleFrequency, arrKey);
  264. if (i === -1) {
  265. return "";
  266. }
  267. return row.scheduleCount + '次/' + arrVal[i];
  268. }
  269. }
  270. //状态
  271. function setFrequency(row){
  272. var totalCheckCount = row.totalCheckCount;
  273. var scheduleCurrentCount = row.scheduleCurrentCount;
  274. var scheduleFrequency = row.scheduleFrequency;
  275. return '<i class="layui-icon" style="color: limegreen;">'+ scheduleCurrentCount +'</i>' + " / " + totalCheckCount + " "+scheduleFrequency;
  276. }
  277. //操作
  278. function setOperation(row) {
  279. var html = '';
  280. html += '<a class="layui-btn layui-btn-xs bg-c-add" lay-event="baseDetail" >检查记录</a>';
  281. return html;
  282. }
  283. // 工具条点击事件
  284. table.on('tool(datatable)', function (obj) {
  285. var data = obj.data;
  286. var layEvent = obj.event;
  287. if(layEvent == 'baseDetail'){ // 详情
  288. //记录明细
  289. detail(data);
  290. }
  291. });
  292. //goto 记录明细
  293. function detail(data) {
  294. location.href = "./taskCheckRecord.html" +
  295. "?scheduleId="+data.scheduleId;
  296. }
  297. });
  298. </script>
  299. </body>
  300. </html>