sewage.html 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta
  6. name="viewport"
  7. content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"
  8. />
  9. <meta
  10. name="format-detection"
  11. content="telephone=no,email=no,date=no,address=no"
  12. />
  13. <title>矿井水处理</title>
  14. <link rel="stylesheet" type="text/css" href="../../css/api.css" />
  15. <link rel="stylesheet" href="../../css/style.css" />
  16. <style>
  17. body,
  18. html {
  19. background: #009fe8;
  20. }
  21. .api_layout {
  22. padding: 7px;
  23. }
  24. .added-tax {
  25. background: #fff;
  26. font-size: 15px;
  27. color: #232627;
  28. border-radius: 10px;
  29. padding-top: 10px;
  30. padding-bottom: 5px;
  31. box-sizing: border-box;
  32. margin-bottom: 10px;
  33. }
  34. .added-tax label {
  35. margin-bottom: 8px;
  36. }
  37. .added-tax i {
  38. width: 32px;
  39. height: 34px;
  40. background: url('../../icon/gmcd.png') center no-repeat;
  41. background-size: contain;
  42. margin-right: 10px;
  43. }
  44. .added-tax-info {
  45. padding: 0 10px;
  46. }
  47. .added-tax-info li {
  48. position: relative;
  49. padding: 12px 0;
  50. align-items: flex-start;
  51. }
  52. .added-tax-info span {
  53. font-size: 14px;
  54. color: #7d7c7c;
  55. width: 56px;
  56. }
  57. .added-tax-info p {
  58. font-size: 14px;
  59. width: 77%;
  60. font-weight: 500;
  61. }
  62. .bg-ico {
  63. position: relative;
  64. width: 100%;
  65. height: 145px;
  66. background: url('../../image/sewage_bg.png') center no-repeat;
  67. background-size: cover;
  68. }
  69. .sewage-item {
  70. text-align: center;
  71. }
  72. .sewage-item:after {
  73. content: '';
  74. position: absolute;
  75. bottom: 0;
  76. left: 0;
  77. width: 100%;
  78. height: 1px;
  79. background: #e8e9ea;
  80. }
  81. .sewage-item span {
  82. color: #232627;
  83. }
  84. .sewage-item span:first-child {
  85. width: 50%;
  86. }
  87. .sewage-item p {
  88. width: 30%;
  89. background: #8adaff;
  90. }
  91. .sewage-item span:last-child {
  92. width: 20%;
  93. }
  94. .added-tax-info .item-title {
  95. padding-left: 7px;
  96. }
  97. .item-title {
  98. font-weight: bold;
  99. }
  100. .item-title:after {
  101. content: '';
  102. position: absolute;
  103. top: 10px;
  104. left: 0;
  105. width: 3px;
  106. height: 60%;
  107. background: #009fe8;
  108. }
  109. .added-tax-info .item-title:first-child:before {
  110. content: '';
  111. position: absolute;
  112. top: 0;
  113. left: 0;
  114. width: 100%;
  115. height: 1px;
  116. background: #e8e9ea;
  117. }
  118. .box i {
  119. width: 32px;
  120. height: 34px;
  121. background: url('../../icon/klc.png') center no-repeat;
  122. background-size: contain;
  123. margin-right: 10px;
  124. }
  125. .date {
  126. position: absolute;
  127. bottom: 7px;
  128. right: 7px;
  129. color: #fff;
  130. font-size: 15px;
  131. }
  132. </style>
  133. </head>
  134. <body>
  135. <div class="bg-ico">
  136. <p class="date"></p>
  137. </div>
  138. <div class="api_layout" id="incoice_wrap"></div>
  139. </body>
  140. </html>
  141. <script type="text/template" id="templateInvoice">
  142. <div class="added-tax">
  143. <label class="flex-center">
  144. <i></i>
  145. <span>高密沉淀</span>
  146. </label>
  147. <ul class="added-tax-info">
  148. <li class="item-title">矸石山调节池液位</li>
  149. <li class="sewage-item flex-start">
  150. <span>矸石山调节池A:</span>
  151. <p>{{=it.gss_TJC_A}}</p>
  152. <span>m</span>
  153. </li>
  154. <li class="sewage-item flex-start">
  155. <span>矸石山调节池B:</span>
  156. <p>{{=it.gss_TJC_B}}</p>
  157. <span>m</span>
  158. </li>
  159. <li class="item-title" style="margin-top:15px">外排水池液位</li>
  160. <li class="sewage-item flex-start">
  161. <span>外排水池A液位:</span>
  162. <p>{{=it.wpsc_YW_A}}</p>
  163. <span>m</span>
  164. </li>
  165. <li class="sewage-item flex-start">
  166. <span>外排水池B液位:</span>
  167. <p>{{=it.wpsc_YW_B}}</p>
  168. <span>m</span>
  169. </li>
  170. </ul>
  171. </div>
  172. <div class="added-tax box">
  173. <label class="flex-center">
  174. <i></i>
  175. <span>快滤池</span>
  176. </label>
  177. <ul class="added-tax-info">
  178. <li class="sewage-item flex-start">
  179. <span>滤池出水流量:</span>
  180. <p>{{=it.lccs_LL}}</p>
  181. <span>m3/h</span>
  182. </li>
  183. <li class="sewage-item flex-start">
  184. <span>滤池出水流量累积:</span>
  185. <p>{{=it.lccs_LL_LJ}}</p>
  186. <span>m3</span>
  187. </li>
  188. <li class="sewage-item flex-start">
  189. <span>矿井水进水瞬时流量:</span>
  190. <p>{{=it.kjs_JSSS_LL}}</p>
  191. <span>m3/h</span>
  192. </li>
  193. <li class="sewage-item flex-start">
  194. <span>矿井水进水流量累积:</span>
  195. <p>{{=it.ksc_JSLL_LJ}}</p>
  196. <span>m3</span>
  197. </li>
  198. </ul>
  199. </div>
  200. </script>
  201. <script type="text/javascript" src="../../script/api.js"></script>
  202. <script type="text/javascript" src="../../script/doT.min.js"></script>
  203. <script src="../../script/config.js" charset="utf-8"></script>
  204. <script type="text/javascript">
  205. apiready = function () {
  206. $api.html($api.dom('.date'), getNowFormatDate());
  207. setInterval(function () {
  208. $api.html($api.dom('.date'), getNowFormatDate());
  209. }, 1000);
  210. $apis.UILoading('', 'rgba(255,255,255,.5)');
  211. getGdWsclDataNewList();
  212. };
  213. function getGdWsclDataNewList() {
  214. $http.fnReuestDataNologing(
  215. jinfengUrlRouter.getGdWsclDataNewList,
  216. '',
  217. 'get',
  218. '',
  219. function (ret, err) {
  220. if (ret.status === 20000) {
  221. $apis.html(incoice_wrap, '#templateInvoice', ret.data);
  222. $apis.CloseUILoading();
  223. }
  224. }
  225. );
  226. }
  227. </script>