details.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269
  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. table th {
  16. /*color: #ffb800;*/
  17. }
  18. </style>
  19. <!-- 加载动画 -->
  20. <div class="page-loading">
  21. <div class="ball-loader">
  22. <span></span><span></span><span></span><span></span>
  23. </div>
  24. </div>
  25. <!-- 正文开始 -->
  26. <div class="layui-fluid">
  27. <div class="layui-card">
  28. <div class="layui-card-body">
  29. <div class="layui-card-header">
  30. 管养问题详情
  31. <div class="layui-inline pull-right" id="_btn">
  32. <button id="btnPrint1" class="layui-btn layui-btn-sm layui-btn-radius layui-btn-normal">
  33. <i class="layui-icon">&#xe66d;</i>打印
  34. </button>
  35. <button onclick="history.back()" class="layui-btn layui-btn-sm layui-btn-radius layui-btn-normal"><i
  36. class="layui-icon">&#xe65c;</i>返回
  37. </button>
  38. </div>
  39. </div>
  40. <div class="layui-card-body" id="divTablePrint">
  41. <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
  42. <div class="layui-tab-content" style="height: auto;padding-bottom: 80px">
  43. <div class="layui-tab-item layui-show">
  44. <div class="layui-row">
  45. <!--<script type="text/html">-->
  46. <div class="layui-col-xs12">
  47. <div class="layui-form">
  48. <table class="layui-table">
  49. <tbody>
  50. <tr>
  51. <th width="150">管养问题名称</th>
  52. <td id="hiddenDangerName"></td>
  53. <th width="150">管养问题来源</th>
  54. <td id="patrolSource">
  55. </td>
  56. </tr>
  57. <tr>
  58. <th width="150">管养问题发现时间</th>
  59. <td id="createdTime" colspan="3"></td>
  60. </tr>
  61. <tr>
  62. <th width="150">管养问题描述</th>
  63. <td id="hiddenDangerDesc" colspan="3" height="150">
  64. </td>
  65. </tr>
  66. <tr>
  67. <th width="150">管养问题地址</th>
  68. <td id="address" colspan="3" height="150">
  69. </td>
  70. </tr>
  71. <tr class="hidden-danger-img display-none">
  72. <th colspan="4" style="border-bottom: 0px">管养问题现场照片
  73. <p id="hiddenDangerImg" class="m-top10px"></p>
  74. </th>
  75. </tr>
  76. <tr>
  77. <th width="150">巡查岗位</th>
  78. <td id="patrolPosition"></td>
  79. <th width="150">巡查人</th>
  80. <td id="patrolAId"></td>
  81. </tr>
  82. <tr>
  83. <th width="150">上报岗位</th>
  84. <td id="upPosition"></td>
  85. <th width="150">上报处理人</th>
  86. <td id="upAId"></td>
  87. </tr>
  88. <tr>
  89. <th width="150">处理方式</th>
  90. <td id="solveType" colspan="3"></td>
  91. </tr>
  92. <tr>
  93. <th width="150">解决办法</th>
  94. <td id="solveDesc" colspan="3" height="150">
  95. </td>
  96. </tr>
  97. <tr class="solve-img display-none">
  98. <th colspan="4" style="border-bottom: 0px">解决完成拍照
  99. <p id="solveImg" class="m-top10px"></p>
  100. </th>
  101. </tr>
  102. <tr>
  103. <th width="150">状态</th>
  104. <td id="status" colspan="3"></td>
  105. </tr>
  106. </tbody>
  107. </table>
  108. </div>
  109. </div>
  110. <!--// </script>-->
  111. </div>
  112. </div>
  113. </div>
  114. </div>
  115. </div>
  116. </div>
  117. </div>
  118. <!-- js部分 -->
  119. <script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
  120. <script type="text/javascript" src="../../../assets/js/common.js?v=312"></script>
  121. <script type="text/javascript" src="../../../assets/libs/ckplayer/ckplayer.js"></script>
  122. <script>
  123. var hdangerId;
  124. var $;
  125. layui.use(['layer', 'form', 'printer', 'table', 'util', 'zTree', 'admin', 'uParas', 'element', 'laytpl'], function () {
  126. $ = layui.jquery;
  127. var layer = layui.layer;
  128. var form = layui.form;
  129. var util = layui.util;
  130. var printer = layui.printer;
  131. var admin = layui.admin;
  132. var uParas = layui.uParas;
  133. var element = layui.element, laytpl = layui.laytpl;
  134. var patrolId = uParas.getUrlParam("patrolId");
  135. // 打印当前页面
  136. $('#btnPrint1').click(function () {
  137. $('#_btn').attr("style", "display:none;");
  138. printer.print();
  139. $('#_btn').attr("style", "display:block;")
  140. });
  141. admin.req(uParas.baseUrl + '/ent/plus/patrolRecord/getById?id=' + patrolId, null, function (res) {
  142. var {code, data} = res;
  143. if (code == 1) {
  144. $('#hiddenDangerName').html(data.hiddenDangerName);
  145. $('#patrolSource').html(patrolSourceFilter(data));
  146. $('#createdTime').html(data.createdTime);
  147. $('#hiddenDangerDesc').html(data.hiddenDangerDesc);
  148. $('#address').html(data.address);
  149. $('#patrolPosition').html(data.positionName);
  150. $('#patrolAId').html(data.accountName);
  151. $('#upPosition').html(data.positionUpName);
  152. $('#upAId').html(data.accountUpName)
  153. $('#solveType').html(solveTypeFilter(data));
  154. $('#solveDesc').html(data.solveDesc);
  155. $('#status').html(statusFilter(data));
  156. if (data.hiddenDangerImg) {
  157. var hdImg = data.hiddenDangerImg.split(',');
  158. var hiddenDangerImgHtml = '';
  159. hdImg.forEach(function (item, index) {
  160. hiddenDangerImgHtml += `<a onclick="openImage('${item}');" style="margin-right: 10px;">
  161. <img style="width: 280px!important;height: 300px;max-width: 300px" src="${item}">
  162. </a>`
  163. });
  164. $('#hiddenDangerImg').html(hiddenDangerImgHtml);
  165. $('.hidden-danger-img').show();
  166. }
  167. if (data.solveImg) {
  168. var hdImg = data.solveImg.split(',');
  169. var solveImgHtml = '';
  170. hdImg.forEach(function (item, index) {
  171. solveImgHtml += `<a onclick="openImage('${item}');" style="margin-right: 10px;">
  172. <img style="width: 280px!important;height: 300px;max-width: 300px" src="${item}">
  173. </a>`
  174. });
  175. $('#solveImg').html(solveImgHtml);
  176. $('.solve-img').show();
  177. }
  178. }
  179. }, 'get');
  180. });
  181. function patrolSourceFilter(d) {
  182. var result = "";
  183. // 1 自己发现 2 上报 3 分发 4不合格
  184. if (d.patrolSource === 1) {
  185. result = "自行巡检"
  186. } else if (d.patrolSource === 2) {
  187. result = "上报"
  188. } else if (d.patrolSource === 3) {
  189. result = "分发"
  190. } else if (d.patrolSource === 4) {
  191. result = "不合格"
  192. }
  193. return result;
  194. }
  195. function solveTypeFilter(d) {
  196. var result = "";
  197. // 1 自行解决 2 上报
  198. if (d.solveType === 1) {
  199. result = "自行解决"
  200. } else if (d.solveType === 2) {
  201. result = "上报"
  202. } else if (d.solveType === 3) {
  203. result = "上报解决"
  204. }
  205. return result;
  206. }
  207. function statusFilter(d) {
  208. var result = "";
  209. // 1 未解决 2 撤销 3上报 4 解决
  210. if (d.status === 1) {
  211. result = "未解决"
  212. } else if (d.status === 2) {
  213. result = "已撤销"
  214. } else if (d.status === 3) {
  215. result = "已上报"
  216. } else if (d.status === 4) {
  217. result = "已解决"
  218. } else if (d.status === 6) {
  219. result = "合格"
  220. }
  221. return result;
  222. }
  223. function videoPlayer(url) {
  224. layer.open({
  225. type: 2,
  226. zIndex: 1000,
  227. title: "视频播放",
  228. shadeClose: true,
  229. area: ['650px', '530px'],
  230. content: "./videoPlayer.html?ipCameraUrl=" + url,
  231. fixed: false
  232. });
  233. }
  234. function showImg(src) {
  235. var imgHtml = "<img src='" + src + "' width='1000px' height='650'/>";
  236. layer.open({
  237. type: 1,
  238. shade: 0.1,
  239. offset: 'auto',
  240. area: [1000 + 'px', 650 + 'px'], // area: [width + 'px',height+'px'] //原图显示
  241. shadeClose: true,
  242. scrollbar: false,
  243. title: "图片附件预览", //不显示标题
  244. content: imgHtml, //捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响
  245. // cancel: function () {
  246. // layer.msg('捕获就是从页面已经存在的元素上,包裹layer的结构', { time: 5000, icon: 6 });
  247. // }
  248. });
  249. }
  250. </script>
  251. </body>
  252. </html>