Post.html 42 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>主机管理</title>
  6. <meta name="renderer" content="webkit">
  7. <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  8. <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
  9. <meta http-equiv="pragma" content="no-cache">
  10. <meta http-equiv="Cache" content="no-cache">
  11. <meta http-equiv="cache-control" content="no-cache, must-revalidate">
  12. <meta http-equiv="expires" content="0">
  13. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  14. <!--引入 element-ui 的样式,-->
  15. <link rel="stylesheet" href="../css/element.css">
  16. <link rel="stylesheet" href="../css/style.css">
  17. <link rel="stylesheet" type="text/css" href="../css/post.css"/>
  18. <script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
  19. <script src="../js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
  20. <script src="../js/pako.js"></script>
  21. <script type="text/javascript">
  22. document.write('<script src="../js/yz/init.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
  23. document.write('<script src="../js/yz/shipLi.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
  24. document.write('<script src="../js/yz/defailt.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
  25. document.write('<script src="../js/yz/ajax.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
  26. document.write('<script src="../js/yz/configuration.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
  27. </script>
  28. <script>
  29. checkLogin();
  30. </script>
  31. </head>
  32. <body>
  33. <div style="height:60px;padding:7.5px 7.5px 0;position: relative;">
  34. <div class="tabUl">
  35. <div data-open="0" class="act_this">主机数据</div>
  36. <div data-open="2">齿轮箱系统</div>
  37. <div data-open="3">综合报警</div>
  38. <div data-open="1">综合报警</div>
  39. </div>
  40. <div style="position: absolute;bottom: 20px;right:20px;color: #fff;">
  41. 最后更新时间:<span id="endTime"></span>
  42. </div>
  43. </div>
  44. <div style="height:calc(100% - 60px);" id="openMD">
  45. <div class="_line">
  46. </div>
  47. <div class="yz_clm15" style="height:calc(100% - 60px);">
  48. <div class="yz_clm6" style="height: 100%;">
  49. <div class="Sense text-center flex flex-direction justify-around">
  50. <div style="height: 33%;" class="flex">
  51. <div class="flex-sub">
  52. <div>主机转速</div>
  53. <div style="height: calc(100% - 22px);" id="myChart1"></div>
  54. </div>
  55. <div class="flex-twice">
  56. <div>1-9#缸排气温度<span style="font-size: 12px;">(平均温度:<span class="Num" ID="GPW_v">0</span>℃)</span></div>
  57. <div style="height: calc(100% - 22px);" id="myChart2"></div>
  58. </div>
  59. </div>
  60. <div style="height: 35%;" id="bearTemp" class="padding-top-sm flex">
  61. <div style="writing-mode:tb-rl;line-height: 36px;">0-10#主轴承温度</div>
  62. <div style="width: calc(100% - 20px);height: 100%;" id="myChart3"></div>
  63. </div>
  64. <div style="height: 32%;">
  65. <div class="yz_clm15" style="height: 100%;">
  66. <div class="yz_clm6" style="height: 100%;">
  67. <div style="height: auto;" id="GangS">1-9#缸排气温度报警</div>
  68. <div class="flex swit_li flex-wrap padding-top-sm">
  69. </div>
  70. </div>
  71. <div class="yz_clm6" style="height: 100%;">
  72. <div style="height: auto;" id="ZhouS">0-10#主轴承温度报警</div>
  73. <div class="flex swit_li flex-wrap padding-top-sm">
  74. </div>
  75. </div>
  76. </div>
  77. </div>
  78. </div>
  79. </div>
  80. <div class="yz_clm6 post_clm" id="hasZy" style="height: 100%;padding: 0;">
  81. <div class="yz_clm15">
  82. <div class="yz_clm12">
  83. <div class="Sense flex">
  84. <div class="flex-twice">
  85. <div class="text-center">增压器信息</div>
  86. <div class="padding-lr-sm text-white Supercha" style="height: calc(100% - 20px);">
  87. </div>
  88. </div>
  89. <div class="flex-twice">
  90. <div class="text-center">涡轮排气温度</div>
  91. <div style="height: calc(100% - 20px);" class="text-center">
  92. <div class="flex" style="height: 50%;">
  93. <div class="flex-sub">
  94. <div class="_temp">
  95. <div class="_unit">
  96. <div>800</div>
  97. <div>600</div>
  98. <div>400</div>
  99. <div>200</div>
  100. <div>0</div>
  101. </div>
  102. <div class="li_shui" id="WL_J_h"></div>
  103. </div>
  104. <div>进口:<span class="text-yellow text-bold text-lg" id="WL_J_v">0</span>℃</div>
  105. </div>
  106. <div class="flex-sub">
  107. <div class="_temp">
  108. <div class="_unit">
  109. <div>800</div>
  110. <div>600</div>
  111. <div>400</div>
  112. <div>200</div>
  113. <div>0</div>
  114. </div>
  115. <div class="li_shui" id="WL_C_h"></div>
  116. </div>
  117. <div>出口:<span class="text-yellow text-bold text-lg" id="WL_C_v">0</span>℃</div>
  118. </div>
  119. </div>
  120. <div class="flex" style="height: 50%;">
  121. <div class="flex-sub">
  122. <div class="_temp">
  123. <div class="_unit">
  124. <div>350</div>
  125. <div>262.5</div>
  126. <div>175</div>
  127. <div>87.5</div>
  128. <div>0</div>
  129. </div>
  130. <div class="li_shui" id="WL_JS_h"></div>
  131. </div>
  132. <div>进口(上):<span class="text-yellow text-bold text-lg" id="WL_JS_v">0</span>℃</div>
  133. </div>
  134. <div class="flex-sub">
  135. <div class="_temp">
  136. <div class="_unit">
  137. <div>350</div>
  138. <div>262.5</div>
  139. <div>175</div>
  140. <div>87.5</div>
  141. <div>0</div>
  142. </div>
  143. <div class="li_shui" id="WL_JX_h"></div>
  144. </div>
  145. <div>进口(下):<span class="text-yellow text-bold text-lg" id="WL_JX_v">0</span>℃</div>
  146. </div>
  147. </div>
  148. </div>
  149. </div>
  150. <div class="flex-sub text-center">
  151. <div class="">燃油进机</div>
  152. <div style="height: calc(50% - 11px);">
  153. <div style="height: 86%;" id="myChart4"></div>
  154. <div>压力:<span class="text-yellow text-bold text-lg" id="RY_Y_v">0</span>kPa</div>
  155. </div>
  156. <div style="height: calc(50% - 11px);">
  157. <div class="_temp">
  158. <div class="_unit">
  159. <div>150</div>
  160. <div>100</div>
  161. <div>50</div>
  162. <div>0</div>
  163. </div>
  164. <div class="li_shui" id="RY_J_h"></div>
  165. </div>
  166. <div>温度:<span class="text-yellow text-bold text-lg" id="RY_J_v">0</span>℃</div>
  167. </div>
  168. </div>
  169. </div>
  170. </div>
  171. <div class="yz_clm12">
  172. <div class="Sense flex text-center">
  173. <div class="flex-sub">
  174. <div>滑油温度</div>
  175. <div style="height: calc(50% - 11px);">
  176. <div class="_temp">
  177. <div class="_unit">
  178. <div>100</div>
  179. <div>75</div>
  180. <div>50</div>
  181. <div>25</div>
  182. <div>0</div>
  183. </div>
  184. <div class="li_shui" id="HY_J_h"></div>
  185. </div>
  186. <div>进机:<span class="text-yellow text-bold text-lg" id="HY_J_v">0</span>℃</div>
  187. </div>
  188. <div style="height: calc(50% - 11px);">
  189. <div class="_temp">
  190. <div class="_unit">
  191. <div>100</div>
  192. <div>75</div>
  193. <div>50</div>
  194. <div>25</div>
  195. <div>0</div>
  196. </div>
  197. <div class="li_shui" id="HY_C_h"></div>
  198. </div>
  199. <div>出机:<span class="text-yellow text-bold text-lg" id="HY_C_v">0</span>℃</div>
  200. </div>
  201. </div>
  202. <div class="flex-twice">
  203. <div>循环水</div>
  204. <div style="height: calc(100% - 21px);" class="flex">
  205. <div class="flex-sub">
  206. <div style="height:50%;">
  207. <div class="_temp">
  208. <div class="_unit">
  209. <div>75</div>
  210. <div>50</div>
  211. <div>25</div>
  212. <div>0</div>
  213. </div>
  214. <div class="li_shui" id="GW_J_h"></div>
  215. </div>
  216. <div>进机:<span class="text-yellow text-bold text-lg" id="GW_J_v">0</span>℃</div>
  217. </div>
  218. <div style="height:50%;">
  219. <div class="_temp">
  220. <div class="_unit">
  221. <div>85</div>
  222. <div>56</div>
  223. <div>28</div>
  224. <div>0</div>
  225. </div>
  226. <div class="li_shui" id="GW_C_h"></div>
  227. </div>
  228. <div>出机:<span class="text-yellow text-bold text-lg" id="GW_C_v">0</span>℃</div>
  229. </div>
  230. </div>
  231. <div class="flex-sub" style="color: #ccc;">
  232. <div class="margin-bottom"><span class="_Num" id="GW_G_v">0.00</span>℃<br>出机温度过高</div>
  233. <div><i class="iconfont icon-cloud-state" id="sw_Q1H1"></i><br>进机温度报警</div>
  234. <div class="margin-tb"><i class="iconfont icon-cloud-state" id="sw_Q1H0"></i><br>出机温度报警</div>
  235. <div><i class="iconfont icon-cloud-state" id="sw_Q1I1"></i><br>出机温度过高</div>
  236. </div>
  237. </div>
  238. </div>
  239. <div class="flex-twice">
  240. <div>中央冷却水</div>
  241. <div style="height: calc(100% - 21px);overflow-y: auto;" class="padding-lr-sm text-white Interco text-left">
  242. </div>
  243. </div>
  244. </div>
  245. </div>
  246. </div>
  247. </div>
  248. <div class="yz_clm6 post_clm" id="notZy" style="height: 100%;padding: 0;display: none;">
  249. <div class="yz_clm15">
  250. <div class="yz_clm12">
  251. <div class="Sense flex">
  252. <div class="flex-sub text-center">
  253. <div class="">淡水压力</div>
  254. <div style="height: 60%;" id="myChart12"></div>
  255. <div><span class="text-yellow text-bold text-lg" id="DS_Y">0</span>MPa</div>
  256. </div>
  257. <div class="flex-sub text-center">
  258. <div class="">海水压力</div>
  259. <div style="height: 60%;" id="myChart13"></div>
  260. <div><span class="text-yellow text-bold text-lg" id="HS_Y">0</span>MPa</div>
  261. </div>
  262. <div class="flex-sub text-center">
  263. <div class="">燃油压力</div>
  264. <div style="height: 60%;" id="myChart14"></div>
  265. <div><span class="text-yellow text-bold text-lg" id="RY_YL">0</span>MPa</div>
  266. </div>
  267. <div class="flex-sub text-center">
  268. <div>燃油进机温度</div>
  269. <div class="_temp" style="height:60%;">
  270. <div class="_unit">
  271. <div>150</div>
  272. <div>100</div>
  273. <div>50</div>
  274. <div>0</div>
  275. </div>
  276. <div class="li_shui" id="RY_W_h"></div>
  277. </div>
  278. <div class="margin-top-xs"><span class="text-yellow text-bold text-lg" id="RY_W_v">0</span>℃</div>
  279. </div>
  280. </div>
  281. </div>
  282. <div class="yz_clm12">
  283. <div class="Sense flex text-center">
  284. <div class="flex-sub">
  285. <div>机油进机温度</div>
  286. <div class="_temp" style="height:60%;">
  287. <div class="_unit">
  288. <div>255</div>
  289. <div>204</div>
  290. <div>153</div>
  291. <div>102</div>
  292. <div>51</div>
  293. <div>0</div>
  294. </div>
  295. <div class="li_shui" id="JY_J_h"></div>
  296. </div>
  297. <div><span class="text-yellow text-bold text-lg" id="JY_J_v">0</span>℃</div>
  298. </div>
  299. <div class="flex-sub">
  300. <div>冷却液温度</div>
  301. <div class="_temp" style="height:60%;">
  302. <div class="_unit">
  303. <div>255</div>
  304. <div>204</div>
  305. <div>153</div>
  306. <div>102</div>
  307. <div>51</div>
  308. <div>0</div>
  309. </div>
  310. <div class="li_shui" id="LQ_W_h"></div>
  311. </div>
  312. <div><span class="text-yellow text-bold text-lg" id="LQ_W_v">0</span>℃</div>
  313. </div>
  314. <div class="flex-sub">
  315. <div>中冷后空气温度</div>
  316. <div class="_temp" style="height:60%;">
  317. <div class="_unit">
  318. <div>255</div>
  319. <div>204</div>
  320. <div>153</div>
  321. <div>102</div>
  322. <div>51</div>
  323. <div>0</div>
  324. </div>
  325. <div class="li_shui" id="ZL_H_h"></div>
  326. </div>
  327. <div><span class="text-yellow text-bold text-lg" id="ZL_H_v">0</span>℃</div>
  328. </div>
  329. <div class="flex-sub">
  330. <div>涡轮前排气温度</div>
  331. <div class="_temp" style="height:60%;">
  332. <div class="_unit">
  333. <div>800</div>
  334. <div>600</div>
  335. <div>400</div>
  336. <div>200</div>
  337. <div>0</div>
  338. </div>
  339. <div class="li_shui" id="WL_Q_h"></div>
  340. </div>
  341. <div><span class="text-yellow text-bold text-lg" id="WL_Q_v">0</span>℃</div>
  342. </div>
  343. <div class="flex-sub">
  344. <div>涡轮后排气温度</div>
  345. <div class="_temp" style="height:60%;">
  346. <div class="_unit">
  347. <div>800</div>
  348. <div>600</div>
  349. <div>400</div>
  350. <div>200</div>
  351. <div>0</div>
  352. </div>
  353. <div class="li_shui" id="WL_H_h"></div>
  354. </div>
  355. <div><span class="text-yellow text-bold text-lg" id="WL_H_v">0</span>℃</div>
  356. </div>
  357. </div>
  358. </div>
  359. </div>
  360. </div>
  361. </div>
  362. </div>
  363. <div style="height:calc(100% - 60px);display: none;" id="openBJ">
  364. <div class="yz_clm15 text-center" style="height:100%;">
  365. <div class="yz_clm6" style="height:100%;padding: 0;">
  366. <div class="yz_clm15 text-center" style="height:100%;padding: 0;">
  367. <div class="yz_clm6">
  368. <div class="Sense" style="overflow-y: auto;">
  369. <ul class="switch_ZJ switch_li">
  370. </ul>
  371. </div>
  372. </div>
  373. <div class="yz_clm6">
  374. <div class="Sense" style="overflow-y: auto;">
  375. <ul class="switch_AB switch_li">
  376. </ul>
  377. </div>
  378. </div>
  379. <div class="yz_clm12">
  380. <div class="Sense" style="overflow-y: auto;">
  381. <ul class="switch_YLI switch_li">
  382. </ul>
  383. </div>
  384. </div>
  385. </div>
  386. </div>
  387. <div class="yz_clm6" style="height:100%;">
  388. <div class="Sense" style="overflow-y: auto;">
  389. <ul class="switch_TJ switch_li">
  390. </ul>
  391. </div>
  392. </div>
  393. </div>
  394. </div>
  395. <div style="height:calc(100% - 60px);display: none;" id="openZP">
  396. <div class="yz_clm15 text-center" style="height:100%;">
  397. <div class="yz_clm6" style="height:100%;padding: 0;">
  398. <div class="yz_clm15 text-center" style="height:100%;padding: 0;">
  399. <div class="yz_clm12">
  400. <div class="Sense" style="overflow-y: auto;">
  401. <ul class="switch_1Z switch_li">
  402. </ul>
  403. </div>
  404. </div>
  405. <div class="yz_clm12">
  406. <div class="Sense" style="overflow-y: auto;">
  407. <ul class="switch_2Z switch_li">
  408. </ul>
  409. </div>
  410. </div>
  411. </div>
  412. </div>
  413. <div class="yz_clm6" style="height:100%;">
  414. <div class="Sense" style="overflow-y: auto;">
  415. <ul class="switch_3ZP switch_li">
  416. </ul>
  417. </div>
  418. </div>
  419. </div>
  420. </div>
  421. <div style="height:calc(100% - 60px);display: none;" id="openYK">
  422. <div class="yz_clm15 text-center Host" style="height:65%;">
  423. <div class="yz_clm3" style="height:100%;">
  424. <div class="Sense">
  425. <ul class="switch_YK switch_li">
  426. </ul>
  427. </div>
  428. </div>
  429. <div class="yz_clm6" style="height:100%;">
  430. <img src="../imgs/otherbg.png" style="height: 100%;" alt="">
  431. </div>
  432. <div class="yz_clm3" style="height:100%;">
  433. <div class="Sense flex">
  434. <div class="flex-sub">
  435. <div style="height: 50%;">
  436. <div>输出前轴承温度</div>
  437. <div class="flex align-center justify-center" style="height: calc(100% - 22px);">
  438. <div style="height:120px;">
  439. <div class="_temp">
  440. <div class="_unit">
  441. <div>150</div>
  442. <div>100</div>
  443. <div>50</div>
  444. <div>0</div>
  445. </div>
  446. <div class="li_shui" id="SC_Q_h"></div>
  447. </div>
  448. <div><span class="Num" style="font-size: 1.2rem;" id="SC_Q_v">0</span>℃</div>
  449. </div>
  450. </div>
  451. </div>
  452. <div style="height: 50%;">
  453. <div>正车推力轴承温度</div>
  454. <div class="flex align-center justify-center" style="height: calc(100% - 22px);">
  455. <div style="height:120px;">
  456. <div class="_temp">
  457. <div class="_unit">
  458. <div>150</div>
  459. <div>100</div>
  460. <div>50</div>
  461. <div>0</div>
  462. </div>
  463. <div class="li_shui" id="ZC_h"></div>
  464. </div>
  465. <div><span class="Num" style="font-size: 1.2rem;" id="ZC_v">0</span>℃</div>
  466. </div>
  467. </div>
  468. </div>
  469. </div>
  470. <div class="flex-sub">
  471. <div style="height: 50%;">
  472. <div>输出后轴承温度</div>
  473. <div class="flex align-center justify-center" style="height: calc(100% - 22px);">
  474. <div style="height:120px;">
  475. <div class="_temp">
  476. <div class="_unit">
  477. <div>150</div>
  478. <div>100</div>
  479. <div>50</div>
  480. <div>0</div>
  481. </div>
  482. <div class="li_shui" id="SC_H_h"></div>
  483. </div>
  484. <div><span class="Num" style="font-size: 1.2rem;" id="SC_H_v">0</span>℃</div>
  485. </div>
  486. </div>
  487. </div>
  488. <div style="height: 50%;">
  489. <div>倒车推力轴承温度</div>
  490. <div class="flex align-center justify-center" style="height: calc(100% - 22px);">
  491. <div style="height:120px;">
  492. <div class="_temp">
  493. <div class="_unit">
  494. <div>150</div>
  495. <div>100</div>
  496. <div>50</div>
  497. <div>0</div>
  498. </div>
  499. <div class="li_shui" id="DC_h"></div>
  500. </div>
  501. <div><span class="Num" style="font-size: 1.2rem;" id="DC_v">0</span>℃</div>
  502. </div>
  503. </div>
  504. </div>
  505. </div>
  506. </div>
  507. </div>
  508. </div>
  509. <div class="yz_clm15 text-center Innovation" style="height:65%;display: none;">
  510. <div class="yz_clm12" style="height:100%;">
  511. <div class="Sense flex align-center flex-wrap">
  512. <div class="flex Liquid flex-wrap" style="width: 100%;">
  513. </div>
  514. </div>
  515. </div>
  516. </div>
  517. <div class="yz_clm15 text-center" style="height:35%;">
  518. <div class="yz_clm4" style="height:100%;">
  519. <div class="Sense flex">
  520. <div class="flex-sub">
  521. <div>滤前工作油压力</div>
  522. <div id="myChart5" style="height:calc(100% - 24px);"></div>
  523. </div>
  524. <div class="flex-sub">
  525. <div>滤前压力</div>
  526. <div id="myChart6" style="height:calc(100% - 24px);"></div>
  527. </div>
  528. <div class="flex-sub">
  529. <div>滤后压力</div>
  530. <div id="myChart7" style="height:calc(100% - 24px);"></div>
  531. </div>
  532. </div>
  533. </div>
  534. <div class="yz_clm5" style="height:100%;">
  535. <div class="Sense flex">
  536. <div class="flex-sub">
  537. <div>滑油温度</div>
  538. <div class="flex align-center justify-center" style="height: calc(100% - 22px);">
  539. <div style="height:120px;">
  540. <div class="_temp">
  541. <div class="_unit">
  542. <div>150</div>
  543. <div>100</div>
  544. <div>50</div>
  545. <div>0</div>
  546. </div>
  547. <div class="li_shui" id="HY_h"></div>
  548. </div>
  549. <div><span class="Num" style="font-size: 1.2rem;" id="HY_v">0</span>℃</div>
  550. </div>
  551. </div>
  552. </div>
  553. <div class="flex-sub">
  554. <div>滑油压力</div>
  555. <div id="myChart10" style="height:calc(100% - 24px);"></div>
  556. </div>
  557. <div class="flex-sub text-left" style="color: #ccc;">
  558. <div class="_Air">
  559. <div class="text-center" style="color:#94d1ff;">空气瓶压力</div>
  560. <div class="margin-top">1#主<span class="Num margin-lr-sm" id="PY_O_v">0.36</span>Mpa</div>
  561. <div class="margin-tb-xs">2#主<span class="Num margin-lr-sm"" id="PY_T_v">0.36</span>Mpa</div>
  562. <div>甲板及杂用<span class="Num margin-lr-sm"" id="PY_J_v">0.36</span>Mpa</div>
  563. <div class="margin-tb-xs">控制<span class="Num margin-lr-sm"" id="PY_K_v">0.36</span>Mpa</div>
  564. </div>
  565. <div class="_OilS">
  566. <div class="margin-tb-xs"><i class="iconfont icon-cloud-state" id="sw_Q201"></i>低压报警</div>
  567. <div><i class="iconfont icon-cloud-state" id="sw_Q224"></i>低压降速</div>
  568. <div class="margin-tb-xs"><i class="iconfont icon-cloud-state" id="sw_Q223"></i>低压停机</div>
  569. <div><i class="iconfont icon-cloud-state" id="sw_Q201"></i>高温报警</div>
  570. <div class="margin-tb-xs"><i class="iconfont icon-cloud-state" id="sw_Q222"></i>备用泵启动</div>
  571. <div><i class="iconfont icon-cloud-state" id="sw_Q221"></i>备用泵停止</div>
  572. </div>
  573. </div>
  574. </div>
  575. </div>
  576. <div class="yz_clm3" style="height:100%;">
  577. <div class="Sense flex">
  578. <div class="flex-sub">
  579. <div>正车工作油压力</div>
  580. <div id="myChart8" style="height:calc(100% - 22px);"></div>
  581. </div>
  582. <div class="flex-sub">
  583. <div>倒车工作油压力</div>
  584. <div id="myChart9" style="height:calc(100% - 22px);"></div>
  585. </div>
  586. </div>
  587. </div>
  588. </div>
  589. </div>
  590. </body>
  591. <script>
  592. var _tempKey = {
  593. "00b":"WL_J_,800",
  594. "00e":"WL_C_,800",
  595. "00c":"WL_JS_,800",
  596. "00d":"WL_JX_,800",
  597. "00P1":"RY_J_,150",
  598. "00Q1":"HY_J_,150",
  599. "00R1":"HY_C_,150",
  600. "00h":"GW_J_,150",
  601. "00i":"GW_C_,150",
  602. "0M6":"HY_,150",
  603. "0M7":"SC_Q_,150",
  604. "0M8":"SC_H_,150",
  605. "0M9":"ZC_,150",
  606. "0MA":"DC_,150",
  607. "00L1":"QK_",
  608. "00M1":"KK_",
  609. "00w":"RHY_",
  610. "00K1":"RY_Y_",
  611. "00v":"GPW_",
  612. "01Z":"ZSY_",
  613. "01O":"HYC_",
  614. "00j":"GW_G_",
  615. "0V0":"PY_O_",
  616. "0V1":"PY_T_",
  617. "0V2":"PY_J_",
  618. "0V3":"PY_K_",
  619. "00N1":"ZYQ_",
  620. "0fB1":"ZYQZ_,count,0.1",
  621. "0fK1":"JY_J_,255",
  622. "0fL1":"LQ_W_,255",
  623. "0fN1":"ZL_H_,255",
  624. "0fW1":"WL_Q_,800",
  625. "0fX1":"WL_H_,800",
  626. "0fM1":"RY_W_,150"
  627. };
  628. var drogKey = ["Q1O_1","Q1H_1","Q1H_0","Q1I_1","Q11_1","Q1I_1","Q20_1_0","Q22_4_0","Q22_3_0","Q20_1_0","Q22_2_1","Q22_1_1"];
  629. var switchKey = {};
  630. var awData = {},timeId = null,allKey = null;
  631. var myChart1 = echarts.init(document.getElementById('myChart1'));
  632. var myChart2 = echarts.init(document.getElementById('myChart2'));
  633. var myChart3 = echarts.init(document.getElementById('myChart3'));
  634. var myChart4 = echarts.init(document.getElementById('myChart4'));
  635. var myChart5 = echarts.init(document.getElementById('myChart5'));
  636. var myChart6 = echarts.init(document.getElementById('myChart6'));
  637. var myChart7 = echarts.init(document.getElementById('myChart7'));
  638. var myChart8 = echarts.init(document.getElementById('myChart8'));
  639. var myChart9 = echarts.init(document.getElementById('myChart9'));
  640. var myChart10 = echarts.init(document.getElementById('myChart10'));
  641. var myChart12 = echarts.init(document.getElementById('myChart12'));
  642. var myChart13 = echarts.init(document.getElementById('myChart13'));
  643. var myChart14 = echarts.init(document.getElementById('myChart14'));
  644. function setoption1(_num,_key,_txt) {
  645. _num = isNaN(Number(_num,10))?0:_num;
  646. if(_txt != undefined){$("#"+_txt).text(_num);}
  647. option = {
  648. grid: {
  649. top: '0%',
  650. left: '0%',
  651. right: '0%',
  652. bottom: '0%',
  653. containLabel: true
  654. },
  655. tooltip: {
  656. formatter: '{a} <br/>{b} : '+(((_key == 2&&_num>3000)?"--":_num)+(_key == 2?'RPM':'MPa'))
  657. },
  658. series: [{
  659. min: 0,
  660. max: (_key == 2?1500:20),
  661. splitNumber:5,
  662. type: 'gauge',
  663. center: ['50%', '55%'],
  664. radius: _key == 0?'114%':'90%',
  665. detail: {
  666. show: _key == 0||_key == 4?false:true,
  667. formatter: ((_key == 2&&_num>3000)?"--":_num)+(_key == 2?'RPM':'MPa'),
  668. fontSize: 14,
  669. offsetCenter: [0, _key == 1?"36%":"90%"],
  670. color:"#fbbd08"
  671. },
  672. data: [{
  673. value: (_key == 2&&_num>3000)?0:_num
  674. }],
  675. axisLine: {
  676. lineStyle: {
  677. color: [
  678. [0.09, 'lime'],
  679. [0.82, '#1e90ff'],
  680. [1, '#ff4500']
  681. ],
  682. width: 5,
  683. shadowBlur: 10
  684. }
  685. },
  686. axisTick: {
  687. show: true,
  688. splitNumber: 5,
  689. distance: 4,
  690. length: 5,
  691. lineStyle: {
  692. color: "#eee",
  693. opacity: 1,
  694. width: 1,
  695. type: "solid",
  696. shadowBlur: 10,
  697. shadowColor: "#fff",
  698. },
  699. },
  700. axisLabel: {
  701. distance: 10,
  702. color: "#fff",
  703. fontSize: 7
  704. },
  705. pointer: {
  706. show: true,
  707. length: "70%",
  708. width: 5,
  709. },
  710. splitLine: {
  711. distance: 4,
  712. length: 5,
  713. lineStyle: {
  714. width: 2,
  715. color: '#fff',
  716. shadowBlur: 10
  717. }
  718. },
  719. title: {
  720. textStyle: {
  721. color: '#fff',
  722. }
  723. },
  724. }]
  725. };
  726. return option;
  727. }
  728. function setoption2(dataList,_aver,_max){
  729. option = {
  730. tooltip: {
  731. trigger: 'axis',
  732. axisPointer: {
  733. type: 'shadow'
  734. }
  735. },
  736. grid: {
  737. top: '16%',
  738. left: '0%',
  739. right: '0%',
  740. bottom: '3%',
  741. containLabel: true
  742. },
  743. xAxis: [
  744. {
  745. type: 'category',
  746. data: _aver,
  747. axisTick: {
  748. alignWithLabel: true
  749. },
  750. axisLine: {
  751. lineStyle: {
  752. color: '#fff',
  753. }
  754. },
  755. axisLabel: {
  756. textStyle: {
  757. fontSize:10,
  758. }
  759. }
  760. }
  761. ],
  762. yAxis: [
  763. {
  764. type: 'value',
  765. max: _max,
  766. splitLine: {
  767. lineStyle: {
  768. color: ['rgba(132, 132, 132, 0.0)']
  769. },
  770. },
  771. axisLine: {
  772. show: false,
  773. },
  774. axisLabel:{
  775. formatter: function(){
  776. return "";
  777. }
  778. }
  779. }
  780. ],
  781. series: [
  782. {
  783. name: '实时数据',
  784. type: 'bar',
  785. barWidth: '20',
  786. itemStyle:{
  787. normal: {
  788. label:{
  789. color:'#fff'
  790. },
  791. color: new echarts.graphic.LinearGradient(
  792. 0, 0, 0, 1,
  793. [
  794. {offset: 0, color: '#fe9a1a'},
  795. {offset: 1, color: '#fe421b'}
  796. ]
  797. )
  798. }
  799. },
  800. label: {
  801. normal: {
  802. show: true,
  803. position: 'top',
  804. color:'#94d1ff',
  805. fontSize:10,
  806. formatter: function (params) {
  807. var index = params.dataIndex;
  808. return dataList[index]+"℃"
  809. }
  810. }
  811. },
  812. data:dataList
  813. }
  814. ]
  815. };
  816. return option;
  817. }
  818. var nowSn = localStorage.getItem("shipSn");
  819. window.addEventListener('message',(data)=>{
  820. initF(1);
  821. })
  822. $(document).ready(function(){
  823. initF();
  824. })
  825. function initF(num){
  826. nowSn = localStorage.getItem("shipSn");
  827. if(nowSn == "381001400"){
  828. delete _tempKey["0M6"];
  829. _tempKey["0MB"] = "HY_,150";
  830. }else{
  831. delete _tempKey["0MB"];
  832. _tempKey["0M6"] = "HY_,150";
  833. }
  834. if(nowSn == "480000618"){
  835. $("#bearTemp").css({"height": "0","display":"none"});
  836. }else{
  837. $("#bearTemp").css({"height": "35%","display":"flex"});
  838. }
  839. allKey = Config((nowSn == "381001400"||nowSn == "480000618"?"381001400":"382001400"),nowSn)["Post"];
  840. firstData(0);
  841. $("div[data-open='3']").css("display",allKey["Disp"][0]);
  842. $("div[data-open='4']").css("display",allKey["Disp"][3]);
  843. $("._Air").css("display",allKey["Disp"][0]);
  844. $("._OilS").css("display",allKey["Disp"][0] == "none"?"block":"none");
  845. $("div[data-open='2']").text(allKey["anKey"][3]);
  846. $(".Host").css("display",allKey["Disp"][1]);
  847. $(".Innovation").css("display",allKey["Disp"][2]);
  848. $("._line").html(allKey["Line"]);
  849. $("#hasZy").css("display",allKey["Disp"][3] == "none"?"block":"none");
  850. $("#notZy").css("display",allKey["Disp"][3]);
  851. whoShow(0);
  852. switchKey = allKey["swKey"]["allSw"];
  853. }
  854. $(window).resize(function(){
  855. myChart1.resize();
  856. myChart2.resize();
  857. myChart3.resize();
  858. myChart4.resize();
  859. myChart5.resize();
  860. myChart6.resize();
  861. myChart7.resize();
  862. myChart8.resize();
  863. myChart9.resize();
  864. myChart10.resize();
  865. myChart12.resize();
  866. myChart13.resize();
  867. myChart14.resize();
  868. })
  869. function firstData(_num){
  870. if(_num == 0){yzkj.load("load1")};
  871. setTimeout(()=>{
  872. deviceList(function acb(_data){
  873. setView(_data);
  874. $("#endTime").text(_data["time"])
  875. if(_num == 0){yzkj.closeLoad("load1");}
  876. if(_data.mmsi == undefined){
  877. setTimeout(()=>{
  878. firstData(1);
  879. },60*1000)
  880. }
  881. })
  882. },100)
  883. }
  884. function setView(_obj){
  885. awData = _obj;
  886. setHie();
  887. setWarm();
  888. setGangZhou();
  889. setYWei();
  890. initData();
  891. myChart1.setOption(setoption1(_obj[allKey["anKey"][0]],2));
  892. if(nowSn == "480000618"){
  893. myChart2.setOption(setoption2([_obj["00S1"],_obj["00T1"],_obj["00U1"],_obj["00V1"],_obj["00W1"],_obj["00X1"],_obj["00Y1"],_obj["00Z1"]],['1号','2号', '3号', '4号', '5号', '6号', '7号', '8号'],500));
  894. myChart3.setOption(setoption2([_obj["00n"],_obj["00o"],_obj["00p"],_obj["00q"],_obj["00r"],_obj["00s"],_obj["00t"],_obj["00u"],_obj["00f"],_obj["00g"]],['1号','2号', '3号', '4号', '5号', '6号', '7号','8号','9号','10号',]));
  895. myChart12.setOption(setoption1(_obj["0fF1"],4,"DS_Y"));
  896. myChart13.setOption(setoption1(_obj["0fG1"],4,"HS_Y"));
  897. myChart14.setOption(setoption1(_obj["0fE1"],4,"RY_YL"));
  898. }else{
  899. myChart2.setOption(setoption2([_obj["00S1"],_obj["00T1"],_obj["00U1"],_obj["00V1"],_obj["00W1"],_obj["00X1"]],['1号','2号', '3号', '4号', '5号', '6号'],500));
  900. myChart3.setOption(setoption2([_obj["00m"],_obj["00n"],_obj["00o"],_obj["00p"],_obj["00q"],_obj["00r"],_obj["00s"],_obj["00t"]],['0号','1号','2号', '3号', '4号', '5号', '6号', '7号']));
  901. }
  902. myChart4.setOption(setoption1(_obj["00K1"],0));
  903. myChart5.setOption(setoption1(_obj[allKey["anKey"][2]],3));
  904. myChart6.setOption(setoption1(_obj["0M3"],3));
  905. myChart7.setOption(setoption1(_obj["0M4"],3));
  906. myChart8.setOption(setoption1(_obj["0M1"],3));
  907. myChart9.setOption(setoption1(_obj["0M2"],3));
  908. myChart10.setOption(setoption1(_obj["0M5"],3));
  909. }
  910. // 开关量没有html
  911. function initData(){
  912. for(var ite in switchKey){
  913. let _arr = switchKey[ite];
  914. let _str = "";
  915. for(var key in _arr){
  916. if(key == ""){
  917. _str += '<li>'+
  918. '<div style="color:#5793f3;font-weight:bold;">'+_arr[key]+'</div>'+
  919. '</li>';
  920. }else{
  921. let _ab = _arr[key].split(",");
  922. let _cd = key.split("-");
  923. let _sta = 0;
  924. if(awData[_cd[0]] != undefined&&awData[_cd[0]] != null&&awData[_cd[0]] != "N"){
  925. if(_cd[1] == undefined){
  926. _sta = awData[_cd[0]];
  927. }else{
  928. if(_cd[2] != undefined){
  929. if(_cd[2] == 0){
  930. _sta = awData[_cd[0]].substring(0,8) == "00000000"?0 : 1;
  931. }else{
  932. _sta = awData[_cd[0]].substring(8,16) == "00000000"?0 : 1;
  933. }
  934. }else{
  935. _sta = awData[_cd[0]].charAt(parseInt(_cd[1]));
  936. }
  937. }
  938. }else{
  939. _sta = 0;
  940. }
  941. if(_ab[1]==2){
  942. _sta = _sta == 0?1:0;
  943. }
  944. _str += '<li>'+
  945. '<div class="iconfont icon-cloud-state" style="color:'+(_sta == 1?(_ab[1]==1?'green':'red'):'')+'"></div>'+
  946. '<div>'+_ab[0]+'</div>'+
  947. '</li>';
  948. }
  949. }
  950. $("."+ite).html(_str);
  951. }
  952. }
  953. // 温度高度
  954. function setHie(){
  955. for(var key in _tempKey){
  956. let _acb = _tempKey[key].split(",");
  957. let _sta = awData[key] != undefined&&awData[key] != null&&awData[key] != "N"?parseFloat(awData[key]):0;
  958. _sta = _sta == -3200 ?0:_sta;
  959. $("#"+_acb[0]+"v").text(isNaN(Number(_sta,10))?"---":_sta);
  960. if(_acb[1] != undefined){
  961. if(_acb[1] == "count"){
  962. let _newn = isNaN(Number(_sta,10))?0:(_sta*parseFloat(_acb[2])).toFixed(2);
  963. $("#"+_acb[0]+"v").text(_newn>20000?0:_newn);
  964. }else{
  965. let _h = parseFloat(_sta / parseInt(_acb[1])).toFixed(2);
  966. let _nh = (_h > 1?1:_h)*100;
  967. $("#"+_acb[0]+"h").css("backgroundImage","linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) "+_nh+"%, #040D32 1%)");
  968. }
  969. }
  970. }
  971. }
  972. // 开关量有HTML
  973. function setWarm(){
  974. for(var i=0;i<drogKey.length;i++){
  975. let _cd = drogKey[i].split("_");
  976. let _sta = 0;
  977. if(awData[_cd[0]] != undefined&&awData[_cd[0]] != null&&awData[_cd[0]] != "N"){
  978. if(_cd[2] != undefined){
  979. let _sa = awData[_cd[0]].charAt(parseInt(_cd[1]));
  980. if(_cd[2] == 1){
  981. _sta = _sa == 0?0:2;
  982. }else{
  983. _sta = _sa == 0?0:1;
  984. }
  985. }else{
  986. if(_cd[1] == 0){
  987. _sta = awData[_cd[0]].substring(0,8) == "00000000"?0 : 1;
  988. }else{
  989. _sta = awData[_cd[0]].substring(8,16) == "00000000"?0 : 1;
  990. }
  991. }
  992. }else{
  993. _sta = 0;
  994. }
  995. $("#sw_"+_cd[0]+_cd[1]).css("color",_sta == 1?'red':(_sta == 2?'green':''));
  996. }
  997. // 增压器
  998. angSwi("Supercha");
  999. angSwi("Interco");
  1000. }
  1001. // 增压器、中冷器
  1002. function angSwi(_key){
  1003. let _who = allKey[_key],_html = "";
  1004. for(var i=0;i<2;i++){
  1005. let _in = i,_ab = _who[i];
  1006. if(i==1&&_ab.length==0){
  1007. break;
  1008. }
  1009. for(var j=0;j<_ab.length;j++){
  1010. let _cvb = _ab[j].split("_");
  1011. if(_in==0){
  1012. _html += `<div class="flex align-center margin-tb-sm">
  1013. <div style="width:120px">${_cvb[1]}</div>
  1014. <div class="_Num">${awData[_cvb[0]] != undefined&&!(isNaN(Number(awData[_cvb[0]],10)))?awData[_cvb[0]]:"---"}</div>${_cvb[2]}
  1015. </div>`
  1016. }else{
  1017. let _sta = 0;
  1018. if(awData[_cvb[0]] != undefined){
  1019. if(_cvb[1] == 0){
  1020. _sta = awData[_cvb[0]].substring(0,8) == "00000000"?0 : 1;
  1021. }else{
  1022. _sta = awData[_cvb[0]].substring(8,16) == "00000000"?0 : 1;
  1023. }
  1024. if(_cvb[3] != undefined){
  1025. _sta = _sta == 1?2:0;
  1026. }else{
  1027. _sta = _sta;
  1028. }
  1029. }else{
  1030. _sta = 0;
  1031. }
  1032. _html += `<div class="margin-top-sm text-gray"><i class="iconfont icon-cloud-state" style="color:${_sta == 1?'red':(_sta == 2?'green':'')}"></i>${_cvb[2]}</div>`;
  1033. }
  1034. }
  1035. }
  1036. $("."+_key).html(_html);
  1037. }
  1038. // 缸轴开关量
  1039. function setGangZhou(){
  1040. let _who = allKey["swKey"]["GangSw"],_hj = _who[0];
  1041. $("#GangS").text(_hj == "swi"?"1-9#缸排气温度报警":"NO.1-NO.6排气温差");
  1042. $("#ZhouS").text(_hj == "swi"?"0-10#主轴承温度报警":"0-7#主轴承温度过高停车");
  1043. for(var i=1;i<3;i++){
  1044. let _str = "",_acb = _who[i];
  1045. for(var j in _acb){
  1046. if(_hj == "swi"){
  1047. let _sta = 0,_cd = _acb[j].split("_");
  1048. if(_cd[2] == "no"){
  1049. // _sta = awData[_cd[0]].charAt(parseInt(_cd[1]));
  1050. _sta = 0;
  1051. }else{
  1052. console.log(_cd,awData[_cd[0]]);
  1053. _sta = 0;
  1054. // if(_cd[1] == 0){
  1055. // _sta = awData[_cd[0]].substring(0,8) == "00000000"?0 : 1;
  1056. // }else{
  1057. // _sta = awData[_cd[0]].substring(8,16) == "00000000"?0 : 1;
  1058. // }
  1059. }
  1060. _str += '<div><i class="iconfont icon-cloud-state" style="color:'+(_sta == 1?'red':'')+'"></i>'+j+'</div>'
  1061. }else{
  1062. if(i==1){
  1063. let _yth = awData[_acb[j]] == undefined?"---":awData[_acb[j]];
  1064. let _yth1 = awData["00v"] == undefined?"---":awData["00v"];
  1065. _str += '<div><span class="text-bold text-yellow">'+(!isNaN(Number(_yth,10))&&!isNaN(Number(_yth1,10))?(_yth - _yth1).toFixed(2):'---')+'</span><br>'+j+'</div>'
  1066. }else{
  1067. _str += '<div><span class="text-bold text-yellow">'+(awData[_acb[j]] != undefined&&!(isNaN(Number(awData[_acb[j]],10)))?awData[_acb[j]]:"---")+'</span><br>'+j+'</div>'
  1068. }
  1069. }
  1070. }
  1071. if(i==1){
  1072. $("#GangS+.swit_li").html(_str);
  1073. }else if(i == 2){
  1074. $("#ZhouS+.swit_li").html(_str);
  1075. }
  1076. }
  1077. }
  1078. // 创新液位
  1079. function setYWei(){
  1080. let _obj = allKey["YWei"];
  1081. if(_obj == null){
  1082. return;
  1083. }
  1084. let _str = "";
  1085. for(var i=0;i<_obj.length;i++){
  1086. let _ab = _obj[i];
  1087. if(_ab[0]){
  1088. let _e = awData[_ab[1]] == undefined? 0 : awData[_ab[1]];
  1089. let _e1 = awData[_ab[3]] == undefined? 0 : awData[_ab[3]];
  1090. let _heg = parseInt((parseFloat(_e)/8)*100)>100?100:parseInt((parseFloat(_e)/8)*100);
  1091. let _spa = _heg<19?0:"calc("+_heg+"% - 24px)";
  1092. let _heg1 = parseInt((parseFloat(_e1)/8)*100)>100?100:parseInt((parseFloat(_e1)/8)*100);
  1093. let _spa1 = _heg1<19?0:"calc("+_heg1+"% - 24px)";
  1094. let mol = [null,null];
  1095. let _a = _ab[5].split(",");
  1096. // 高位
  1097. let _c = awData[_a[0].split("_")[0]] == undefined ?0 : awData[_a[0].split("_")[0]].charAt(parseInt(_a[0].split("_")[1]));
  1098. let _d =_a[1]==undefined? 0 :(awData[_a[1].split("_")[0]] == undefined ?0 : awData[_a[1].split("_")[0]].charAt(parseInt(_a[1].split("_")[1])));
  1099. // 右
  1100. let _b = _ab[6].split(",");
  1101. // 高位
  1102. let _g = awData[_b[0].split("_")[0]] == undefined ?0 : awData[_b[0].split("_")[0]].charAt(parseInt(_b[0].split("_")[1]));
  1103. let _f =_b[1]==undefined? 0 :(awData[_b[1].split("_")[0]] == undefined ?0 : awData[_b[1].split("_")[0]].charAt(parseInt(_b[1].split("_")[1])));
  1104. // 容量
  1105. if((i==2||i==5)&&nowSn != "480000001"){
  1106. mol =[(awData[_ab[7]] == undefined? 0 : awData[_ab[7]]),(awData[_ab[8]] == undefined? 0 : awData[_ab[8]])];
  1107. }
  1108. _str += `<div>
  1109. <div style="font-size: 15px;">${_obj[i][2]}${mol[0] != null?'(<span class="text-yellow text-bold">'+mol[0]+'</span> m³)':''}</div>
  1110. <div class="margin-top-sm flex">
  1111. <div class="Range">
  1112. <span>8</span>
  1113. <span>6</span>
  1114. <span>4</span>
  1115. <span>2</span>
  1116. <span>0</span>
  1117. </div>
  1118. <div class="Liquidli">
  1119. <div style="height:${_heg}%;"></div>
  1120. <span style="bottom:${_spa};">${_e}<i>m</i></span>
  1121. </div>
  1122. ${ nowSn == "382001400"?
  1123. `<div class="Range" style="align-items: flex-start;">
  1124. <span></span>
  1125. <span></span>
  1126. <span></span>
  1127. <span><i class="${_c == 1?'text-red':''}">●</i>高</span>
  1128. <span><i class="${_d == 1?'text-red':''}">●</i>低</span>
  1129. </div>`:''
  1130. }
  1131. </div>
  1132. <div class="margin-top-lg" style="font-size: 15px;">${_obj[i][4]}${mol[1] != null?'(<span class="text-yellow text-bold">'+mol[1]+'</span> m³)':''}</div>
  1133. <div class="margin-top-sm flex">
  1134. <div class="Range">
  1135. <span>8</span>
  1136. <span>6</span>
  1137. <span>4</span>
  1138. <span>2</span>
  1139. <span>0</span>
  1140. </div>
  1141. <div class="Liquidli">
  1142. <div style="height:${_heg1}%;"></div>
  1143. <span style="bottom:${_spa1};">${_e1}<i>m</i></span>
  1144. </div>
  1145. ${ nowSn == "382001400"?
  1146. `<div class="Range" style="align-items: flex-start;">
  1147. <span></span>
  1148. <span></span>
  1149. <span></span>
  1150. <span><i class="${_g == 1?'text-red':''}">●</i>高</span>
  1151. <span><i class="${_f == 1?'text-red':''}">●</i>低</span>
  1152. </div>`:''
  1153. }
  1154. </div>
  1155. </div>`
  1156. }else{
  1157. let _sta = awData[_ab[1]] != undefined?parseFloat(awData[_ab[1]]):0;
  1158. let _h = parseFloat(_sta / 100).toFixed(2);
  1159. let _nh = (_h > 1?1:_h)*100;
  1160. let _sta1 = awData[_ab[3]] != undefined?parseFloat(awData[_ab[3]]):0;
  1161. let _h1 = parseFloat(_sta1 / 100).toFixed(2);
  1162. let _nh1 = (_h1 > 1?1:_h1)*100;
  1163. _str += `<div>
  1164. <div style="font-size: 15px;">${_obj[i][2]}</div>
  1165. <div class="flex align-center justify-center">
  1166. <div style="height:120px;">
  1167. <div class="_temp">
  1168. <div class="_unit">
  1169. <div>150</div>
  1170. <div>100</div>
  1171. <div>50</div>
  1172. <div>0</div>
  1173. </div>
  1174. <div class="li_shui" style="background-image:linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) ${_nh}%, #040D32 1%)"></div>
  1175. </div>
  1176. <div><span class="Num">${isNaN(Number(_sta))?"---":_sta}</span>℃</div>
  1177. </div>
  1178. </div>
  1179. <div class="margin-top-sm" style="font-size: 15px;">${_obj[i][4]}</div>
  1180. <div class="flex align-center justify-center">
  1181. <div style="height:120px;">
  1182. <div class="_temp">
  1183. <div class="_unit">
  1184. <div>150</div>
  1185. <div>100</div>
  1186. <div>50</div>
  1187. <div>0</div>
  1188. </div>
  1189. <div class="li_shui" style="background-image:linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) ${_nh1}%, #040D32 1%)"></div>
  1190. </div>
  1191. <div><span class="Num">${isNaN(Number(_sta1))?"---":_sta1}</span>℃</div>
  1192. </div>
  1193. </div>
  1194. </div>`
  1195. }
  1196. }
  1197. $(".Liquid").html(_str);
  1198. }
  1199. $(".tabUl div").on("click","",function(){
  1200. whoShow($(this).data("open"));
  1201. })
  1202. function whoShow(_id){
  1203. $(".tabUl>div").removeClass("act_this");
  1204. $(".tabUl>div[data-open='"+_id+"']").addClass("act_this");
  1205. let _sta = ["block","none","none","none"];
  1206. if(_id == 0){
  1207. _sta = ["block","none","none","none"];
  1208. }else if(_id == 1){
  1209. _sta = ["none","block","none","none"];
  1210. }else if(_id == 2){
  1211. _sta = ["none","none","block","none"];
  1212. }else if(_id == 3){
  1213. _sta = ["none","none","none","block"];
  1214. }
  1215. $("#openMD").css("display",_sta[0]);
  1216. $("#openBJ").css("display",_sta[1]);
  1217. $("#openYK").css("display",_sta[2]);
  1218. $("#openZP").css("display",_sta[3]);
  1219. myChart1.resize();
  1220. myChart2.resize();
  1221. myChart3.resize();
  1222. myChart4.resize();
  1223. myChart5.resize();
  1224. myChart6.resize();
  1225. myChart7.resize();
  1226. myChart8.resize();
  1227. myChart9.resize();
  1228. myChart10.resize();
  1229. myChart12.resize();
  1230. myChart13.resize();
  1231. myChart14.resize();
  1232. };
  1233. </script>
  1234. </html>