details.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263
  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 class="hidden-danger-img display-none">
  67. <th colspan="4" style="border-bottom: 0px">管养问题现场照片
  68. <p id="hiddenDangerImg" class="m-top10px"></p>
  69. </th>
  70. </tr>
  71. <tr>
  72. <th width="150">巡查岗位</th>
  73. <td id="patrolPosition"></td>
  74. <th width="150">巡查人</th>
  75. <td id="patrolAId"></td>
  76. </tr>
  77. <tr>
  78. <th width="150">上报岗位</th>
  79. <td id="upPosition"></td>
  80. <th width="150">上报处理人</th>
  81. <td id="upAId"></td>
  82. </tr>
  83. <tr>
  84. <th width="150">处理方式</th>
  85. <td id="solveType" colspan="3"></td>
  86. </tr>
  87. <tr>
  88. <th width="150">解决办法</th>
  89. <td id="solveDesc" colspan="3" height="150">
  90. </td>
  91. </tr>
  92. <tr class="solve-img display-none">
  93. <th colspan="4" style="border-bottom: 0px">解决完成拍照
  94. <p id="solveImg" class="m-top10px"></p>
  95. </th>
  96. </tr>
  97. <tr>
  98. <th width="150">状态</th>
  99. <td id="status" colspan="3"></td>
  100. </tr>
  101. </tbody>
  102. </table>
  103. </div>
  104. </div>
  105. <!--// </script>-->
  106. </div>
  107. </div>
  108. </div>
  109. </div>
  110. </div>
  111. </div>
  112. </div>
  113. <!-- js部分 -->
  114. <script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
  115. <script type="text/javascript" src="../../../assets/js/common.js?v=312"></script>
  116. <script type="text/javascript" src="../../../assets/libs/ckplayer/ckplayer.js"></script>
  117. <script>
  118. var hdangerId;
  119. var $;
  120. layui.use(['layer', 'form', 'printer', 'table', 'util', 'zTree', 'admin', 'uParas', 'element', 'laytpl'], function () {
  121. $ = layui.jquery;
  122. var layer = layui.layer;
  123. var form = layui.form;
  124. var util = layui.util;
  125. var printer = layui.printer;
  126. var admin = layui.admin;
  127. var uParas = layui.uParas;
  128. var element = layui.element, laytpl = layui.laytpl;
  129. var patrolId = uParas.getUrlParam("patrolId");
  130. // 打印当前页面
  131. $('#btnPrint1').click(function () {
  132. $('#_btn').attr("style", "display:none;");
  133. printer.print();
  134. $('#_btn').attr("style", "display:block;")
  135. });
  136. admin.req(uParas.baseUrl + '/ent/parkPatrolRecord/getById?id=' + patrolId, null, function (res) {
  137. var {code, data} = res;
  138. if (code == 1) {
  139. console.log(data)
  140. $('#hiddenDangerName').html(data.hiddenDangerName);
  141. $('#patrolSource').html(patrolSourceFilter(data));
  142. $('#createdTime').html(data.createdTime);
  143. $('#hiddenDangerDesc').html(data.hiddenDangerDesc);
  144. $('#patrolPosition').html(data.positionName);
  145. $('#patrolAId').html(data.accountName);
  146. $('#upPosition').html(data.positionUpName);
  147. $('#upAId').html(data.accountUpName)
  148. $('#solveType').html(solveTypeFilter(data));
  149. $('#solveDesc').html(data.solveDesc);
  150. $('#status').html(statusFilter(data));
  151. if (data.hiddenDangerImg) {
  152. var hdImg = data.hiddenDangerImg.split(',');
  153. var hiddenDangerImgHtml = '';
  154. hdImg.forEach(function (item, index) {
  155. hiddenDangerImgHtml += `<a onclick="openImage('${item}');" style="margin-right: 10px;">
  156. <img style="width: 280px!important;height: 300px;max-width: 300px" src="${item}">
  157. </a>`
  158. });
  159. $('#hiddenDangerImg').html(hiddenDangerImgHtml);
  160. $('.hidden-danger-img').show();
  161. }
  162. if (data.solveImg) {
  163. var hdImg = data.solveImg.split(',');
  164. var solveImgHtml = '';
  165. hdImg.forEach(function (item, index) {
  166. solveImgHtml += `<a onclick="openImage('${item}');" style="margin-right: 10px;">
  167. <img style="width: 280px!important;height: 300px;max-width: 300px" src="${item}">
  168. </a>`
  169. });
  170. $('.solve-img').html(solveImgHtml);
  171. $('.solve-img').show();
  172. }
  173. }
  174. }, 'get');
  175. });
  176. function patrolSourceFilter(d) {
  177. var result = "";
  178. // 1 自己发现 2 上报 3 分发 4不合格
  179. if (d.patrolSource === 1) {
  180. result = "自行巡检"
  181. } else if (d.patrolSource === 2) {
  182. result = "上报"
  183. } else if (d.patrolSource === 3) {
  184. result = "分发"
  185. } else if (d.patrolSource === 4) {
  186. result = "不合格"
  187. }
  188. return result;
  189. }
  190. function solveTypeFilter(d) {
  191. var result = "";
  192. // 1 自行解决 2 上报
  193. if (d.solveType === 1) {
  194. result = "自行解决"
  195. } else if (d.solveType === 2) {
  196. result = "上报"
  197. } else if (d.solveType === 3) {
  198. result = "上报解决"
  199. }
  200. return result;
  201. }
  202. function statusFilter(d) {
  203. var result = "";
  204. // 1 未解决 2 撤销 3上报 4 解决
  205. if (d.status === 1) {
  206. result = "未解决"
  207. } else if (d.status === 2) {
  208. result = "已撤销"
  209. } else if (d.status === 3) {
  210. result = "已上报"
  211. } else if (d.status === 4) {
  212. result = "已解决"
  213. }
  214. return result;
  215. }
  216. function videoPlayer(url) {
  217. layer.open({
  218. type: 2,
  219. zIndex: 1000,
  220. title: "视频播放",
  221. shadeClose: true,
  222. area: ['650px', '530px'],
  223. content: "./videoPlayer.html?ipCameraUrl=" + url,
  224. fixed: false
  225. });
  226. }
  227. function showImg(src) {
  228. var imgHtml = "<img src='" + src + "' width='1000px' height='650'/>";
  229. layer.open({
  230. type: 1,
  231. shade: 0.1,
  232. offset: 'auto',
  233. area: [1000 + 'px', 650 + 'px'], // area: [width + 'px',height+'px'] //原图显示
  234. shadeClose: true,
  235. scrollbar: false,
  236. title: "图片附件预览", //不显示标题
  237. content: imgHtml, //捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响
  238. // cancel: function () {
  239. // layer.msg('捕获就是从页面已经存在的元素上,包裹layer的结构', { time: 5000, icon: 6 });
  240. // }
  241. });
  242. }
  243. </script>
  244. </body>
  245. </html>