index.html 66 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <link href="css/BigData.css" rel="stylesheet" type="text/css" />
  5. <link href="css/index.css" rel="stylesheet" type="text/css" />
  6. <link href="css/index01.css" rel="stylesheet" type="text/css" />
  7. <script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
  8. <link href="js/bstable/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
  9. <link href="js/bstable/css/bootstrap-table.css" rel="stylesheet" type="text/css" />
  10. <link href="css/Security_operation.css" rel="stylesheet" type="text/css" />
  11. <link rel="stylesheet" href="js/artDialog/skins/default.css" type="text/css"/>
  12. <script src="js/laydate.js"></script>
  13. <script src="js/Home_page.js"></script>
  14. <meta charset="UTF-8">
  15. <title>河长制监督系统</title>
  16. <style>
  17. .aui_title{background-color: #407fff !important;height: 32px;line-height: 32px;font-weight: 700;font-size: 14px}
  18. </style>
  19. </head>
  20. <body >
  21. <div class="data_bodey">
  22. <div class="index_nav" >
  23. <ul style="height: 30px; margin-bottom: 0px;">
  24. <li class="l_left total_chose_fr" onclick="analysis()">实时监测</li>
  25. <li class="l_left total_chose_pl" onclick="department()">生产分析</li>
  26. <li class="l_left total_chose_pl">销售分析</li>
  27. <li class="r_right total_chose_pl">安全分析</li>
  28. <li class="r_right total_chose_pl">人员分析</li>
  29. <li class="r_right total_chose_pl">管理分析</li>
  30. </ul>
  31. <div class="total_chose_box" style="display: none;">
  32. <div style="height: 32px;"></div>
  33. <span class="chose_tltle">请选择年份:</span>
  34. <select class="year_chose">
  35. <option>2017</option>
  36. <option>2016</option>
  37. <option>2015</option>
  38. <option>2014</option>
  39. <option>2013</option>
  40. <option>2012</option>
  41. </select>
  42. <span class="chose_tltle">请输入月份:</span>
  43. <input class="chose_text_in">
  44. <span class="chose_tltle">请选择区域:</span>
  45. <select class="year_chose">
  46. <option> 成都市</option>
  47. <option>自贡市</option>
  48. <option>攀枝花市</option>
  49. <option>泸州市</option>
  50. <option>德阳市</option>
  51. <option>绵阳市</option>
  52. <option>广元市</option>
  53. <option>遂宁市</option>
  54. <option>内江市</option>
  55. <option>乐山市</option>
  56. <option>南充市</option>
  57. <option>宜宾市</option>
  58. <option>广安市</option>
  59. <option>达州市</option>
  60. <option>巴中市</option>
  61. <option>雅安市</option>
  62. <option>眉山市</option>
  63. <option>资阳市</option>
  64. <option>阿坝州</option>
  65. <option>甘孜州</option>
  66. <option>凉山州</option>
  67. </select>
  68. <button class="chose_enter">确定</button>
  69. </div>
  70. <div class="clear"></div>
  71. </div>
  72. <div class="index_tabs" >
  73. <!--安防运作-->
  74. <div class="inner" style="height: 109%;">
  75. <div class="left_cage">
  76. <div class="dataAllBorder01 cage_cl" style="!important; height: 24%;">
  77. <img src="video/1.jpg" class="dataAllBorder02 video_cage">
  78. </div>
  79. <div class="dataAllBorder01 cage_cl" style="margin-top: 1.5% !important; height: 38%;">
  80. <div class="dataAllBorder02 video_cage">
  81. <img src="video/radi01.jpg" class="video_around video_around_chose" >
  82. <img src="video/radi02.jpg" class="video_around video_around_chose" >
  83. <img src="video/radi03.jpg" class="video_around video_around_chose" >
  84. <img src="video/radi04.jpg" class="video_around video_around_chose" >
  85. </div>
  86. </div>
  87. <div class="dataAllBorder01 cage_cl" style="margin-top: 1.5% !important; height: 32%; position: relative;">
  88. <div class="dataAllBorder02" style="padding: 1.2%; overflow: hidden">
  89. <div class="message_scroll_box">
  90. <div class="message_scroll">
  91. <div class="scroll_top">
  92. <span class="scroll_title">高锰酸盐超标警告</span>
  93. <span class="scroll_level scroll_level01">一级</span>
  94. <a class="localize"></a>
  95. <span class="scroll_timer">17-09-13/9:52</span>
  96. </div>
  97. <div class="msg_cage">
  98. <a class="localize_title"><span><label>编号</label>:GH32101</span><span class="right"><label>监测值</label>:1.1(mg/Ls)</span></a>
  99. </div>
  100. <div class="msg_cage">
  101. <a class="localize_msg">xx阳市沱江一段21号排污口处</a>
  102. </div>
  103. </div>
  104. <div class="message_scroll">
  105. <div class="scroll_top">
  106. <span class="scroll_title">总磷超标警告</span>
  107. <span class="scroll_level scroll_level03">三级</span>
  108. <a class="localize"></a>
  109. <span class="scroll_timer">17-09-13/9:52</span>
  110. </div>
  111. <div class="msg_cage">
  112. <a class="localize_title"><span><label>编号</label>:GH32101</span><span class="right"><label>监测值</label>:1.1(mg/Ls)</span></a>
  113. </div>
  114. <div class="msg_cage">
  115. <a class="localize_msg">xx阳市沱江一段21号排污口处</a>
  116. </div>
  117. </div>
  118. <div class="message_scroll">
  119. <div class="scroll_top">
  120. <span class="scroll_title">高锰酸盐超标警告</span>
  121. <span class="scroll_level scroll_level02">二级</span>
  122. <a class="localize"></a>
  123. <span class="scroll_timer">17-09-13/9:52</span>
  124. </div>
  125. <div class="msg_cage">
  126. <a class="localize_title"><span><label>编号</label>:GH32101</span><span class="right"><label>监测值</label>:1.1(mg/Ls)</span></a>
  127. </div>
  128. <div class="msg_cage">
  129. <a class="localize_msg">xx阳市沱江一段21号排污口处。</a>
  130. </div>
  131. </div>
  132. <div class="message_scroll">
  133. <div class="scroll_top">
  134. <span class="scroll_title">高锰酸盐超标警告</span>
  135. <span class="scroll_level scroll_level01">一级</span>
  136. <a class="localize"></a>
  137. <span class="scroll_timer">17-09-13/9:52</span>
  138. </div>
  139. <div class="msg_cage">
  140. <a class="localize_title"><span><label>编号</label>:GH32101</span><span class="right"><label>监测值</label>:1.1(mg/Ls)</span></a>
  141. </div>
  142. <div class="msg_cage">
  143. <a class="localize_msg">xx阳市沱江一段21号排污口处</a>
  144. </div>
  145. </div>
  146. </div>
  147. </div>
  148. <div class="scroll_tool_outbox">
  149. <div class="scroll_tool_box">
  150. <a class="scroll_tool" href="#">查看历史推送</a>
  151. </div>
  152. </div>
  153. </div>
  154. </div>
  155. <div class="center_cage">
  156. <div class="dataAllBorder01 cage_cl" style="!important; height: 62.7%; position: relative;">
  157. <div class="dataAllBorder02" style="position: relative; overflow: hidden;">
  158. <!--标题栏-->
  159. <div class="map_title_box" style="height: 6%">
  160. <div class="map_title_innerbox">
  161. <div class="map_title">XX实时监测地图</div>
  162. </div>
  163. </div>
  164. <!--//仓库-1,加油站-2,派出所-3,危化品企业-4,学校-5,医疗卫生-6,应急避难场所-7-->
  165. <div class="map" id="divMap" ></div>
  166. <!--地图显示信息选择-->
  167. <div class="display_type_box display_box" style="display: none;overflow:auto">
  168. <div class="display_type_center_box">
  169. <ul class="display_type_inner_box" id="layerList">
  170. <li class="display_type_msg"><input id="zt_4" type="checkbox" class="display_type_chose"/> XX监测</li>
  171. <li class="display_type_msg"><input id="zt_1" type="checkbox" class="display_type_chose"/>流量监测</li>
  172. <li class="display_type_msg"><input id="zt_5" type="checkbox" class="display_type_chose"/>水位监测</li>
  173. <li class="display_type_msg"><input id="zt_6" type="checkbox" class="display_type_chose"/>视频</li>
  174. <li class="display_type_msg"><input id="zt_2" type="checkbox" class="display_type_chose"/>车辆监测</li>
  175. <!--<li class="display_type_msg">&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;&#45;</li>-->
  176. </ul>
  177. </div>
  178. <div class="display_type_funct_box">
  179. <span class="display_type_funct display_type_funct_sure">确定</span>
  180. </div>
  181. </div>
  182. <!--城市选择-->
  183. <div class="city_chose_box display_box" style="display: none">
  184. <div class="display_type_center_box">
  185. <ul class="display_type_inner_box" id="ulCity">
  186. <li class="display_type_msg"> 成都市</li>
  187. <li class="display_type_msg">自贡市</li>
  188. <li class="display_type_msg">攀枝花市</li>
  189. <li class="display_type_msg">泸州市</li>
  190. <li class="display_type_msg">德阳市</li>
  191. <li class="display_type_msg">绵阳市</li>
  192. <li class="display_type_msg">广元市</li>
  193. <li class="display_type_msg">遂宁市</li>
  194. <li class="display_type_msg">内江市</li>
  195. <li class="display_type_msg">乐山市</li>
  196. <li class="display_type_msg">南充市</li>
  197. <li class="display_type_msg">宜宾市</li>
  198. <li class="display_type_msg">广安市</li>
  199. <li class="display_type_msg">达州市</li>
  200. <li class="display_type_msg">巴中市</li>
  201. <li class="display_type_msg">雅安市</li>
  202. <li class="display_type_msg">眉山市</li>
  203. <li class="display_type_msg">资阳市</li>
  204. <li class="display_type_msg">阿坝州</li>
  205. <li class="display_type_msg">甘孜州</li>
  206. <li class="display_type_msg">凉山州</li>
  207. </ul>
  208. </div>
  209. <div class="display_type_funct_box">
  210. <span class="display_type_funct display_type_funct_sure">确定</span>
  211. </div>
  212. </div>
  213. <!--轨迹回放-->
  214. <div class="trajectory_box" style="display: none" id="divRouteReview">
  215. <input class="trajectory" id="start" placeholder="开始时间">
  216. <input class="trajectory" id="end" placeholder="结束时间">
  217. <select class="ratio">
  218. <option>1倍</option>
  219. <option>2倍</option>
  220. <option>3倍</option>
  221. </select>
  222. <button class="playback" onClick="run()">回放</button>
  223. <button class="playback close_playback">关闭</button>
  224. </div>
  225. <!--缓冲区设置-->
  226. <div class="trajectory_box" style="display: none" id="divBufferSetting">
  227. <button class="playback" style="width:60px" onClick="setBufferCenter()">设置点</button>
  228. <input class="trajectory" id="txtBufferX" placeholder="坐标X">
  229. <input class="trajectory" id="txtBufferY" placeholder="坐标Y">
  230. <input value="10" class="trajectory" id="txtBufferDis" placeholder="缓冲距离">
  231. <select class="ratio">
  232. <option>米</option>
  233. <option>千米</option>
  234. </select>
  235. <button class="playback" onclick="executeBuffer();edit()" style="width:60px">分析</button>
  236. <button class="playback close_playback">关闭</button>
  237. </div>
  238. <!--矢量地图,云图切换-->
  239. <!--<ul class="map_change_box">-->
  240. <!--<li class="map_change map_change_chose VM_map" title="矢量地图" onclick="showLayer('vector')"></li>-->
  241. <!--<li class="map_change SCI_map" title="卫星云图" onclick="showLayer('image')" style="display: none;"></li>-->
  242. <!--</ul>-->
  243. <!--地图工具栏-->
  244. <div class="map_tool_outbox">
  245. <span class="map_tool" onClick="zoomFull()">
  246. <a class="map_tool_inner" title="全图" ></a>
  247. </span>
  248. <span class="map_tool" onClick="zoomOut()">
  249. <a class="map_tool_inner" title="放大" style="background-position-x:-36px"></a>
  250. </span>
  251. <span class="map_tool" onClick="zoomIn()">
  252. <a class="map_tool_inner" title="缩小" style="background-position-x:-72px"></a>
  253. </span>
  254. <span class="map_tool" onClick="showHeatMap()">
  255. <a class="map_tool_inner" title="倒退视图" style="background-position-x:-108px"></a>
  256. </span>
  257. <span class="map_tool">
  258. <a class="map_tool_inner" title="前进视图" style="background-position-x:-144px"></a>
  259. </span>
  260. <span class="map_tool">
  261. <a class="map_tool_inner display_type_btn" title="专题地图" style="background-position-x:-180px"></a>
  262. </span>
  263. <span class="map_tool">
  264. <a class="map_tool_inner city_chose_btn" title="城市定位" style="background-position-x:-432px"></a>
  265. </span>
  266. <span class="map_tool" id="btnBuffer">
  267. <a class="map_tool_inner" title="缓冲区分析" style="background-position-x:-216px"></a>
  268. </span>
  269. <span class="map_tool">
  270. <a class="map_tool_inner addition_check_btn check_btn" title="水质监测设备检索" style="background-position-x:-252px"></a>
  271. </span>
  272. <span class="map_tool">
  273. <a class="map_tool_inner chemistry_check_btn check_btn" onClick="chemistryCheck()" title="流量监测设备检索" style="background-position-x:-288px"></a>
  274. </span>
  275. <span class="map_tool">
  276. <a class="map_tool_inner enterprise_check_btn check_btn" onClick="enterpriseCheck()" title="水位监测设备检索" style="background-position-x:-324px"></a>
  277. </span>
  278. <span class="map_tool">
  279. <a class="map_tool_inner car_check_btn check_btn" onClick="carCheck()" title="车辆监测设备检索" style="background-position-x:-360px"></a>
  280. </span>
  281. <span class="map_tool">
  282. <a class="map_tool_inner" onClick="Search()" title="视频设备检索" style="background-position-x:-468px"></a>
  283. </span>
  284. <span class="map_tool">
  285. <a class="map_tool_inner" onClick="cancel()" id="fresh_tool" title="清空" style="background-position-x:-396px"></a>
  286. </span>
  287. <span class="map_tool">
  288. <input type="text" id="txtCoord" style="width:150px;visibility:hidden" />
  289. </span>
  290. </div>
  291. </div>
  292. </div>
  293. <div class="dataAllBorder01 cage_cl" style="margin-top: 0.6% !important; height: 32.1%;">
  294. <div class="dataAllBorder02" id="map_title_innerbox">
  295. <div class="map_title_box">
  296. <div class="map_title_innerbox">
  297. <div class="map_titl">空间分析数据</div>
  298. </div>
  299. <div >
  300. <select id="selLayer" style="width:100px;">
  301. <option value="">水质点位</option>
  302. </select>
  303. </div>
  304. </div>
  305. <table id="table" style="width: 100%"></table>
  306. </div>
  307. <div class="dataAllBorder02" id="map_title_innerbox1" style="display: none; position: relative;">
  308. <div class="map_title_box">
  309. <div class="map_title_innerbox">
  310. <div class="map_title" style="background-image: url(img/second_title.png);">警告周边污染条件扫描</div>
  311. </div>
  312. </div>
  313. <ul class="tab_msg_box">
  314. <li class="tab_msg tab_msg01 tab_msg_current">附近污染源</li>
  315. <li class="tab_msg tab_msg02">临近商户</li>
  316. </ul>
  317. <div class="table1">
  318. <table id="table1" style="width: 100%"></table>
  319. </div>
  320. <div class="table2" style=" display: none;">
  321. <table id="table2" style="width: 100%;"></table>
  322. </div>
  323. </div>
  324. </div>
  325. </div>
  326. <div class="right_cage">
  327. <!--顶部切换位置-->
  328. <div class="dataAllBorder01 cage_cl" style="!important; height: 24%">
  329. <div class="dataAllBorder02" id="cage_cl" >
  330. <div class="analysis">监测设备数量:</div>
  331. <ul class="data_show_box">
  332. <li class="data_cage">0</li>
  333. <li class="data_cage">0</li>
  334. <li class="data_cage" style="background-image: none;">,</li>
  335. <li class="data_cage funct_number">1</li>
  336. <li class="data_cage funct_number">5</li>
  337. <li class="data_cage funct_number">2</li>
  338. </ul>
  339. <div class="depart_number_box">
  340. <ul class="depart_number_cage">
  341. <li class="depart_name">水质监测类:</li>
  342. <li class="depart_number">3,238</li>
  343. </ul>
  344. <ul class="depart_number_cage">
  345. <li class="depart_name">流量监测类:</li>
  346. <li class="depart_number">1,630</li>
  347. </ul>
  348. <ul class="depart_number_cage" style="margin-bottom: 0px;">
  349. <li class="depart_name">水位测量类:</li>
  350. <li class="depart_number">4,251</li>
  351. </ul>
  352. <ul class="depart_number_cage" style="margin-bottom: 0px;">
  353. <li class="depart_name">车辆监测类:</li>
  354. <li class="depart_number">24</li>
  355. </ul>
  356. </div>
  357. </div>
  358. <div class="dataAllBorder02 over_hide" id="cage_cl1" style="display: none" >
  359. <div class="analysis">点位基础信息:</div>
  360. <ul class="location_msg_box">
  361. <li class="location_msg01 location_single">事件级别:<a href="#" style="color: #dc0000;">一级</a></li>
  362. <li class="location_msg02 location_single">事件级别:水质高猛酸盐超标</a></li>
  363. <li class="location_msg02 location_double">监测时间:<a href="#" style="color: #cdd6db;">2017-09-10<br>11:40</a></li>
  364. <li class="location_msg01 location_double">地址:沱江xx段31号</a></li>
  365. <!--<li class="location_msg01 location_single" style="width: 100%; height: 40%">案件关联:“131”抢劫、2014-05-13火灾、2013-12-08毒气 泄漏。</a></li>li-->
  366. </ul>
  367. </div>
  368. </div>
  369. <div class="dataAllBorder01 cage_cl check_increase" style=" margin-top: 1.5% !important;">
  370. <!--切换01-->
  371. <div class="dataAllBorder02 over_hide dataAllBorder20" id="over_hide">
  372. <table class="table table-bordered">
  373. <thead>
  374. <tr>
  375. <th style="width: 18%">点位名称</th>
  376. <th>高锰酸盐</th>
  377. <th>总磷</th>
  378. <th>氨氮</th>
  379. </tr>
  380. </thead>
  381. <tbody>
  382. <tr>
  383. <td>点位监测一</td>
  384. <td>1.1m/L</td>
  385. <td>0.3m/L</td>
  386. <td>1.3m/L</td>
  387. </tr>
  388. <tr>
  389. <td>点位监测一</td>
  390. <td>1.1m/L</td>
  391. <td>0.3m/L</td>
  392. <td>1.3m/L</td>
  393. </tr>
  394. <tr>
  395. <td>点位监测一</td>
  396. <td>1.1m/L</td>
  397. <td>0.3m/L</td>
  398. <td>1.3m/L</td>
  399. </tr>
  400. <tr>
  401. <td>点位监测一</td>
  402. <td>1.1m/L</td>
  403. <td>0.3m/L</td>
  404. <td>1.3m/L</td>
  405. </tr>
  406. <tr>
  407. <td>点位监测一</td>
  408. <td>1.1m/L</td>
  409. <td>0.3m/L</td>
  410. <td>1.3m/L</td>
  411. </tr>
  412. <tr>
  413. <td>点位监测一</td>
  414. <td>1.1m/L</td>
  415. <td>0.3m/L</td>
  416. <td>1.3m/L</td>
  417. </tr>
  418. <tr>
  419. <td>点位监测一</td>
  420. <td>1.1m/L</td>
  421. <td>0.3m/L</td>
  422. <td>1.3m/L</td>
  423. </tr>
  424. </tbody>
  425. </table>
  426. <table class="table table-bordered">
  427. <thead>
  428. <tr>
  429. <th style="width: 18%">类目</th>
  430. <th>归属</th>
  431. <th>程度</th>
  432. <th>范围(r=?)</th>
  433. </tr>
  434. </thead>
  435. <tbody>
  436. <tr>
  437. <td>保安</td>
  438. <td>地点分配</td>
  439. <td>综合治理</td>
  440. <td>全城</td>
  441. </tr>
  442. <tr>
  443. <td>流动人口</td>
  444. <td>危化品...</td>
  445. <td>潜伏性威胁</td>
  446. <td>车站</td>
  447. </tr>
  448. <tr>
  449. <td>典当</td>
  450. <td>居民盗窃</td>
  451. <td>财产维护</td>
  452. <td>-</td>
  453. </tr>
  454. </tbody>
  455. </table>
  456. </div>
  457. <!--切换02-->
  458. <div class="dataAllBorder02 over_hide dataAllBorder20" id="over_hide1" style="display: none">
  459. <table class="table table-bordered">
  460. <thead>
  461. <tr>
  462. <th style="width: 18%">类目</th>
  463. <th>危险级别</th>
  464. <th>储量</th>
  465. <th>范围(r=?)</th>
  466. </tr>
  467. </thead>
  468. <tbody>
  469. <tr>
  470. <td>过氧化钾</td>
  471. <td>三级</td>
  472. <td>5t</td>
  473. <td>200m-5km</td>
  474. </tr>
  475. <tr>
  476. <td>高锰酸钾</td>
  477. <td>三级...</td>
  478. <td>3t</td>
  479. <td>4km-80km</td>
  480. </tr>
  481. <tr>
  482. <td>硫化氢</td>
  483. <td>一级</td>
  484. <td>20t</td>
  485. <td>400m-2km</td>
  486. </tr>
  487. <tr>
  488. <td>浓硫酸</td>
  489. <td>一级</td>
  490. <td>10t</td>
  491. <td>1km</td>
  492. </tr>
  493. <tr>
  494. <td>王水</td>
  495. <td>一级</td>
  496. <td>4t</td>
  497. <td>2km</td>
  498. </tr>
  499. <tr>
  500. <td>石油原油</td>
  501. <td>一级</td>
  502. <td>3t</td>
  503. <td>500m-2km</td>
  504. </tr>
  505. <tr>
  506. <td>天然气</td>
  507. <td>一级</td>
  508. <td>10M2</td>
  509. <td>500m-10km</td>
  510. </tr>
  511. <tr>
  512. <td>三硝基甲苯</td>
  513. <td>一级</td>
  514. <td>5t</td>
  515. <td>200m-5km</td>
  516. </tr>
  517. <tr>
  518. <td>醛类催化品</td>
  519. <td>一级</td>
  520. <td>6t</td>
  521. <td>4km-80km</td>
  522. </tr>
  523. <tr>
  524. <td>煤炭</td>
  525. <td>一级</td>
  526. <td>11t</td>
  527. <td>400m-2km</td>
  528. </tr>
  529. </tbody>
  530. </table>
  531. </div>
  532. <!--水质检测设备切换03-->
  533. <div class="dataAllBorder02 addition_check_in" style="display: none;position: relative" >
  534. <div class="analysis" style="height: 34px;%">水质监测设备检索:</div>
  535. <div class="search_plate_box">
  536. <ul class="search_separate">
  537. <li class="search_title">设备类型:</li>
  538. <select class="search_input_box search_chose_box">
  539. <option>全部</option>
  540. </select>
  541. </ul>
  542. <ul class="search_separate">
  543. <li class="search_title">点位名称:</li>
  544. <li class="search_input_box"><input class="search_input" type="text"></li>
  545. </ul>
  546. <button class="search_btn">开始检索</button>
  547. </div>
  548. <!--检索结果板块-->
  549. <div class="search_sesult_box">
  550. <ul class="search_result">
  551. <li class="search_result_add danger_result">XZ-0168 68水质检测仪</li>
  552. <li class="danger_level level03">在线自动</li>
  553. <li class="search_location" title="定位"></li>
  554. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  555. <li class="search_result_car car_personal">VDSA52336</li>
  556. <li class="search_result_car car_time">上海海恒机电仪表有限公司</li>
  557. </ul>
  558. <ul class="search_result">
  559. <li class="search_result_add danger_result">XZ-0168 68水质检测仪</li>
  560. <li class="danger_level level03">在线自动</li>
  561. <li class="search_location" title="定位"></li>
  562. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  563. <li class="search_result_car car_personal">VDSA52336</li>
  564. <li class="search_result_car car_time">上海海恒机电仪表有限公司</li>
  565. </ul>
  566. <ul class="search_result">
  567. <li class="search_result_add danger_result">XZ-0168 68水质检测仪</li>
  568. <li class="danger_level level03">在线自动</li>
  569. <li class="search_location" title="定位"></li>
  570. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  571. <li class="search_result_car car_personal">VDSA52336</li>
  572. <li class="search_result_car car_time">上海海恒机电仪表有限公司</li>
  573. </ul>
  574. <ul class="search_result">
  575. <li class="search_result_add danger_result">XZ-0168 68水质检测仪</li>
  576. <li class="danger_level level03">在线自动</li>
  577. <li class="search_location" title="定位"></li>
  578. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  579. <li class="search_result_car car_personal">VDSA52336</li>
  580. <li class="search_result_car car_time">上海海恒机电仪表有限公司</li>
  581. </ul>
  582. <ul class="search_result">
  583. <li class="search_result_add danger_result">XZ-0168 68水质检测仪</li>
  584. <li class="danger_level level03">在线自动</li>
  585. <li class="search_location" title="定位"></li>
  586. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  587. <li class="search_result_car car_personal">VDSA52336</li>
  588. <li class="search_result_car car_time">上海海恒机电仪表有限公司</li>
  589. </ul>
  590. <ul class="search_result">
  591. <li class="search_result_add danger_result">XZ-0168 68水质检测仪</li>
  592. <li class="danger_level level03">在线自动</li>
  593. <li class="search_location" title="定位"></li>
  594. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  595. <li class="search_result_car car_personal">VDSA52336</li>
  596. <li class="search_result_car car_time">上海海恒机电仪表有限公司</li>
  597. </ul>
  598. </div>
  599. <!--翻页模块-->
  600. <div class="tcdPageCode"></div>
  601. </div>
  602. <!--流量监测04-->
  603. <div class="dataAllBorder02 chemistry_check_in" id="chemistry_check_in" style="display: none;position: relative" >
  604. <div class="analysis" style="height: 34px;">流量监测设备检索:</div>
  605. <div class="search_plate_box">
  606. <ul class="search_separate">
  607. <li class="search_title">设备类型:</li>
  608. <select class="search_input_box search_chose_box">
  609. <option>全部</option>
  610. </select>
  611. </ul>
  612. <ul class="search_separate">
  613. <li class="search_title">输入点位:</li>
  614. <li class="search_input_box"><input class="search_input" type="text"></li>
  615. </ul>
  616. <button class="search_btn">开始检索</button>
  617. </div>
  618. <!--检索结果板块-->
  619. <div class="search_sesult_box">
  620. <ul class="search_result">
  621. <li class="search_result_add danger_result">LDG-MK卫生型电磁流量计</li>
  622. <li class="danger_level level03">电磁流量计</li>
  623. <li class="search_location" title="定位"></li>
  624. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  625. <li class="search_result_car car_personal">VDSA52336</li>
  626. <li class="search_result_car car_time">浙江米科电子设备厂</li>
  627. </ul>
  628. <ul class="search_result">
  629. <li class="search_result_add danger_result">LDG-MK卫生型电磁流量计</li>
  630. <li class="danger_level level03">电磁流量计</li>
  631. <li class="search_location" title="定位"></li>
  632. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  633. <li class="search_result_car car_personal">VDSA52336</li>
  634. <li class="search_result_car car_time">浙江米科电子设备厂</li>
  635. </ul>
  636. <ul class="search_result">
  637. <li class="search_result_add danger_result">LDG-MK卫生型电磁流量计</li>
  638. <li class="danger_level level03">电磁流量计</li>
  639. <li class="search_location" title="定位"></li>
  640. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  641. <li class="search_result_car car_personal">VDSA52336</li>
  642. <li class="search_result_car car_time">浙江米科电子设备厂</li>
  643. </ul>
  644. <ul class="search_result">
  645. <li class="search_result_add danger_result">LDG-MK卫生型电磁流量计</li>
  646. <li class="danger_level level03">电磁流量计</li>
  647. <li class="search_location" title="定位"></li>
  648. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  649. <li class="search_result_car car_personal">VDSA52336</li>
  650. <li class="search_result_car car_time">浙江米科电子设备厂</li>
  651. </ul>
  652. <ul class="search_result">
  653. <li class="search_result_add danger_result">LDG-MK卫生型电磁流量计</li>
  654. <li class="danger_level level03">电磁流量计</li>
  655. <li class="search_location" title="定位"></li>
  656. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  657. <li class="search_result_car car_personal">VDSA52336</li>
  658. <li class="search_result_car car_time">浙江米科电子设备厂</li>
  659. </ul>
  660. <ul class="search_result">
  661. <li class="search_result_add danger_result">LDG-MK卫生型电磁流量计</li>
  662. <li class="danger_level level03">电磁流量计</li>
  663. <li class="search_location" title="定位"></li>
  664. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  665. <li class="search_result_car car_personal">VDSA52336</li>
  666. <li class="search_result_car car_time">浙江米科电子设备厂</li>
  667. </ul>
  668. </div>
  669. <!--翻页模块-->
  670. <div class="chemistry_tcdPageCode"></div>
  671. </div>
  672. <!--企业检索切换05-->
  673. <div class="dataAllBorder02 enterprise_check_in" id="enterprise_check_in" style="display: none;position: relative" >
  674. <div class="analysis" style="height: 34px;">水位监测设备检索:</div>
  675. <div class="search_plate_box">
  676. <ul class="search_separate">
  677. <li class="search_title">设备类型:</li>
  678. <select class="search_input_box search_chose_box">
  679. <option>全部</option>
  680. </select>
  681. </ul>
  682. <ul class="search_separate">
  683. <li class="search_title">点位名称:</li>
  684. <li class="search_input_box"><input class="search_input" type="text"></li>
  685. </ul>
  686. <button class="search_btn">开始检索</button>
  687. </div>
  688. <!--检索结果板块-->
  689. <div class="search_sesult_box">
  690. <ul class="search_result">
  691. <li class="search_result_add danger_result">PK150防雷水位监测</li>
  692. <li class="danger_level level03">无线</li>
  693. <li class="search_location" title="定位"></li>
  694. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  695. <li class="search_result_car car_personal">VDSA52336</li>
  696. <li class="search_result_car car_time">优科自动设备有限公司</li>
  697. </ul>
  698. <ul class="search_result">
  699. <li class="search_result_add danger_result">PK150防雷水位监测</li>
  700. <li class="danger_level level03">无线</li>
  701. <li class="search_location" title="定位"></li>
  702. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  703. <li class="search_result_car car_personal">VDSA52336</li>
  704. <li class="search_result_car car_time">优科自动设备有限公司</li>
  705. </ul>
  706. <ul class="search_result">
  707. <li class="search_result_add danger_result">PK150防雷水位监测</li>
  708. <li class="danger_level level03">无线</li>
  709. <li class="search_location" title="定位"></li>
  710. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  711. <li class="search_result_car car_personal">VDSA52336</li>
  712. <li class="search_result_car car_time">优科自动设备有限公司</li>
  713. </ul>
  714. <ul class="search_result">
  715. <li class="search_result_add danger_result">PK150防雷水位监测</li>
  716. <li class="danger_level level03">无线</li>
  717. <li class="search_location" title="定位"></li>
  718. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  719. <li class="search_result_car car_personal">VDSA52336</li>
  720. <li class="search_result_car car_time">优科自动设备有限公司</li>
  721. </ul>
  722. <ul class="search_result">
  723. <li class="search_result_add danger_result">PK150防雷水位监测</li>
  724. <li class="danger_level level03">无线</li>
  725. <li class="search_location" title="定位"></li>
  726. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  727. <li class="search_result_car car_personal">VDSA52336</li>
  728. <li class="search_result_car car_time">优科自动设备有限公司</li>
  729. </ul>
  730. <ul class="search_result">
  731. <li class="search_result_add danger_result">PK150防雷水位监测</li>
  732. <li class="danger_level level03">无线</li>
  733. <li class="search_location" title="定位"></li>
  734. <li class="search_eddit" title="生命周期" onClick="showLife()"></li>
  735. <li class="search_result_car car_personal">VDSA52336</li>
  736. <li class="search_result_car car_time">优科自动设备有限公司</li>
  737. </ul>
  738. </div>
  739. <!--翻页模块-->
  740. <div class="enterprise_tcdPageCode"></div>
  741. </div>
  742. <!--车辆检索切换06-->
  743. <div class="dataAllBorder02" id="car_check_in" style="display: none;position: relative" >
  744. <div class="analysis" style="height: 34px;">车辆检索:</div>
  745. <div class="search_plate_box">
  746. <ul class="search_separate">
  747. <li class="search_title">车牌号码:</li>
  748. <li class="search_input_box"><input class="search_input" type="text"></li>
  749. </ul>
  750. <ul class="search_separate">
  751. <li class="search_title">车主姓名:</li>
  752. <li class="search_input_box"><input class="search_input" type="text"></li>
  753. </ul>
  754. <button class="search_btn">检索</button>
  755. </div>
  756. <!--检索结果板块-->
  757. <div class="search_sesult_box">
  758. <ul class="search_result">
  759. <li class="search_result_add">川A·K5H12(陈浩)</li>
  760. <li class="search_location" title="定位" ></li>
  761. <li class="search_guiji" title="轨迹回放"></li>
  762. <li class="search_result_car car_personal">福特(福克斯两厢)</li>
  763. <li class="search_result_car car_time">乘用车(5座)</li>
  764. </ul>
  765. <ul class="search_result">
  766. <li class="search_result_add">川A·14AG2(张正涛)</li>
  767. <li class="search_location" title="定位" ></li>
  768. <li class="search_guiji" title="轨迹回放"></li>
  769. <li class="search_result_car car_personal">福特(金牛座)</li>
  770. <li class="search_result_car car_time">乘用车(5座)</li>
  771. </ul>
  772. <ul class="search_result">
  773. <li class="search_result_add">川B·2563K(李雪)</li>
  774. <li class="search_location" title="定位" ></li>
  775. <li class="search_guiji" title="轨迹回放"></li>
  776. <li class="search_result_car car_personal">上海大众(迈腾)</li>
  777. <li class="search_result_car car_time">乘用车(5座)</li>
  778. </ul>
  779. <ul class="search_result">
  780. <li class="search_result_add">川A·SH273(刘红)</li>
  781. <li class="search_location" title="定位" ></li>
  782. <li class="search_guiji" title="轨迹回放"></li>
  783. <li class="search_result_car car_personal">菲亚特(菲翔)</li>
  784. <li class="search_result_car car_time">乘用车(5座)</li>
  785. </ul>
  786. <ul class="search_result">
  787. <li class="search_result_add">川A·K5H12(陈浩)</li>
  788. <li class="search_location" title="定位" ></li>
  789. <li class="search_guiji" title="轨迹回放"></li>
  790. <li class="search_result_car car_personal">奔驰(C200)</li>
  791. <li class="search_result_car car_time">乘用车(5座)</li>
  792. </ul>
  793. <ul class="search_result">
  794. <li class="search_result_add">川A·K5H12(张起国)</li>
  795. <li class="search_location" title="定位"></li>
  796. <li class="search_guiji" title="轨迹回放"></li>
  797. <li class="search_result_car car_personal">东风商用车(天龙)</li>
  798. <li class="search_result_car car_time">载货卡车(100t)</li>
  799. </ul>
  800. </div>
  801. <!--翻页模块-->
  802. <div class="car_tcdPageCode"></div>
  803. </div>
  804. </div>
  805. <div class="dataAllBorder01 cage_cl check_decrease" style="margin-top: 1.5% !important; height: 32%; position: relative;">
  806. <div class="dataAllBorder02 over_hide" style="padding: 1.2%;">
  807. <div class="analysis">2018年xx市水质分类占比:</div>
  808. <div class="danger_contain_box">
  809. <div id="container_huan" style="height: 90%;width: 100%"></div>
  810. </div>
  811. <div class="danger_depart_box">
  812. <ul class="danger_depart">
  813. <li class="danger_ico" style="background-image: url(img/images/pic_ico_01.png); background-position-x: 0px"></li>
  814. <li class="data_name">一类水质</li>
  815. <li class="data data01">652</li>
  816. <li class="data data02">↑&nbsp&nbsp1.2%</li>
  817. </ul>
  818. <ul class="danger_depart">
  819. <li class="danger_ico" style="background-image: url(img/images/pic_ico_02.png); background-position-x: 0px"></li>
  820. <li class="data_name">二类水质</li>
  821. <li class="data data01">97</li>
  822. <li class="data data02" style="color: #ff2865;">↓&nbsp&nbsp0.3%</li>
  823. </ul>
  824. <ul class="danger_depart danger_depart01">
  825. <li class="danger_ico" style="background-image: url(img/images/pic_ico_03.png); background-position-x: 0px"></li>
  826. <li class="data_name">三类水质</li>
  827. <li class="data data01">423</li>
  828. <li class="data data02">↑&nbsp&nbsp1%</li>
  829. </ul>
  830. <ul class="danger_depart danger_depart01">
  831. <li class="danger_ico" style="background-image: url(img/images/pic_ico_01.png); background-position-x: 0px"></li>
  832. <li class="data_name">四类水质</li>
  833. <li class="data data01">218</li>
  834. <li class="data data02">↑&nbsp&nbsp0.3%</li>
  835. </ul>
  836. </div>
  837. </div>
  838. </div>
  839. </div>
  840. </div>
  841. </div>
  842. </div>
  843. <script src="https://www.jq22.com/jquery/echarts-4.2.1.min.js"></script>
  844. <script src="js/index.js"></script>
  845. <script src="js/bstable/js/bootstrap.min.js"></script>
  846. <script src="https://cdn.bootcdn.net/ajax/libs/bootstrap-table/1.16.0/bootstrap-table.js"></script>
  847. <script type="text/javascript" src="js/jquery.pagination.js"></script>
  848. <script src="js/bstable/js/bootstrap-table-zh-CN.min.js"></script>
  849. <script src="js/Home_page.js"></script>
  850. <script src="js/artDialog/artDialog.js"></script>
  851. <script src="js/artDialog/plugins/iframeTools.source.js"></script>
  852. <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=5ieMMexWmzB9jivTq6oCRX9j&callback"></script>
  853. <script src="js/mapNew.js"></script>
  854. <script>
  855. var number;
  856. $(function() {
  857. if (window.screen.height <= 768) {
  858. number = 4;
  859. } else if (window.screen.height > 768 && window.screen.height <= 900) {
  860. number = 6
  861. } else if (window.screen.height > 1080) {
  862. number = 8
  863. }
  864. });
  865. function people(){
  866. art.dialog.open('people_page.html',
  867. {title: '详情信息', width: '60%', height: '60%',shade: 0.5,mask:true});
  868. }
  869. function Search(){
  870. art.dialog.open('search_page.html',
  871. {title: '查询表格页', width: '60%', height: '60%',shade: 0.5,mask:true});
  872. }
  873. function Search1(){
  874. art.dialog.open('history_page.html',
  875. {title: '历史记录', width: '60%', height: '60%',shade: 0.5,mask:true});
  876. }
  877. function analysis(){
  878. art.dialog.open('analysis.html',
  879. {title: '统计分析页', width: '900px', height: '60%',shade: 0.5,mask:true});
  880. }
  881. function department(){
  882. art.dialog.open('department.html',
  883. {title: '统计分析页', width: '60%', height: '60%',shade: 0.5,mask:true});
  884. }
  885. function showCompanyDetai() {
  886. window.open('http://123.146.170.78:8888/conmpanyTail.html');
  887. }
  888. function showWHPDetai() {
  889. window.open('http://123.146.170.78:8888/goodsTail.html');
  890. }
  891. function showCarDetai() {
  892. window.open('http://123.146.170.78:8888/carTail.html');
  893. }
  894. // 翻页模块
  895. $(".tcdPageCode").createPage({
  896. pageCount:5,
  897. current:1,
  898. backFn:function(p){}
  899. });
  900. $(".chemistry_tcdPageCode").createPage({
  901. pageCount:4,
  902. current:1,
  903. backFn:function(p){}
  904. });
  905. $(".enterprise_tcdPageCode").createPage({
  906. pageCount:4,
  907. current:1,
  908. backFn:function(p){}
  909. });
  910. $(".car_tcdPageCode").createPage({
  911. pageCount:4,
  912. current:1,
  913. backFn:function(p){}
  914. });
  915. $(function () {
  916. $(".tit02Diva a").each(function (index) {
  917. $(this).on("click",function () {
  918. $(".data_map").eq(index).fadeIn().siblings(".data_map").stop().hide();
  919. $(this).prev('i').removeClass('i_crlieAction');
  920. $(this).siblings('a').prev('i').addClass('i_crlieAction');
  921. })
  922. });
  923. BootstrapTable();
  924. Echarts();
  925. $("#fresh_tool").click(function(event){
  926. event.stopPropagation();
  927. cancel();
  928. })
  929. });
  930. function EventClick(){
  931. $(".check_increase").removeClass("check_increase_act");
  932. $("#over_hide1").show().siblings().hide();
  933. $(".check_decrease").show();
  934. $("#cage_cl").hide();
  935. $("#map_title_innerbox").hide();
  936. $("#cage_cl1").show();
  937. // $("#over_hide").show();
  938. $("#map_title_innerbox1").show();
  939. $(".addition_check_in").hide();
  940. $("#car_check_in").hide();
  941. BootstrapTable();
  942. }
  943. function cancel(e){
  944. $(".check_increase").removeClass("check_increase_act");
  945. $("#over_hide").show().siblings().hide();
  946. $(".check_decrease").show();
  947. $("#cage_cl").show();
  948. $("#cage_cl1").hide();
  949. // $("#cage_cl").show();
  950. // $("#over_hide1").show();
  951. // $("#map_title_innerbox").show();
  952. BootstrapTable();
  953. }
  954. // 地址检索
  955. $(".addition_check_btn").click(function () {
  956. $(".check_increase").addClass("check_increase_act");
  957. $(".check_decrease").hide()
  958. $(".addition_check_in").show().siblings().hide()
  959. });
  960. // 危化品检索
  961. function chemistryCheck() {
  962. $(".check_increase").addClass("check_increase_act");
  963. $(".check_decrease").hide()
  964. $("#chemistry_check_in").show().siblings().hide()
  965. }
  966. // 企业检索
  967. function enterpriseCheck() {
  968. $(".check_increase").addClass("check_increase_act");
  969. $(".check_decrease").hide()
  970. $("#enterprise_check_in").show().siblings().hide()
  971. }
  972. // 车辆检索
  973. function carCheck() {
  974. $(".check_increase").addClass("check_increase_act");
  975. $(".check_decrease").hide()
  976. $("#car_check_in").show().siblings().hide()
  977. }
  978. function BootstrapTable() {
  979. $('#table').bootstrapTable({
  980. method: "get",
  981. striped: true,
  982. singleSelect: false,
  983. url: "json/DGCar.json",
  984. dataType: "json",
  985. pagination: true, //分页
  986. pageSize: number,
  987. pageNumber: 1,
  988. search: false, //显示搜索框
  989. contentType: "application/x-www-form-urlencoded",
  990. queryParams: null,
  991. columns: [
  992. // {
  993. // title: "车辆编号",
  994. // field: 'id',
  995. // width:80,
  996. // align: 'center',
  997. // valign: 'middle'
  998. // },
  999. {
  1000. title: '点位编号',
  1001. field: 'carno',
  1002. width:80,
  1003. align: 'center',
  1004. valign: 'middle'
  1005. },
  1006. // {
  1007. // title: '所属区域',
  1008. // field: 'company',
  1009. // align: 'center',
  1010. // valign: 'middle'
  1011. // },
  1012. {
  1013. title: '位置',
  1014. field: 'content',
  1015. align: 'center'
  1016. },
  1017. {
  1018. title: '实时数据',
  1019. field: 'speed',
  1020. width:80,
  1021. align: 'center'
  1022. },
  1023. {
  1024. title: '操作',
  1025. field: 'load',
  1026. align: 'center',
  1027. formatter: function (value, row) {
  1028. var e = '<a href="javascript:void(0)" title="" onclick="Search1()">历史记录</a> ';
  1029. var d = '<a href="javascript:void(0)" title="" onclick="addLocal(\'' + row.id + '\')">定位</a> ';
  1030. return e + d;
  1031. }
  1032. }
  1033. ]
  1034. });
  1035. $('#table1').bootstrapTable({
  1036. method: "get",
  1037. striped: true,
  1038. singleSelect: false,
  1039. url: "json/note1.json",
  1040. dataType: "json",
  1041. pagination: true, //分页
  1042. pageSize: number,
  1043. pageNumber: 1,
  1044. search: false, //显示搜索框
  1045. contentType: "application/x-www-form-urlencoded",
  1046. queryParams: null,
  1047. columns: [
  1048. {
  1049. title: "污染源",
  1050. field: 'id',
  1051. align: 'center',
  1052. valign: 'middle'
  1053. },
  1054. {
  1055. title: '辐射距离',
  1056. field: 'title',
  1057. align: 'center',
  1058. valign: 'middle'
  1059. },
  1060. {
  1061. title: '污染范围',
  1062. field: 'type',
  1063. align: 'center',
  1064. valign: 'middle'
  1065. },
  1066. {
  1067. title: '污染类型',
  1068. field: 'person',
  1069. align: 'center'
  1070. }
  1071. ]
  1072. });
  1073. $('#table2').bootstrapTable({
  1074. method: "get",
  1075. striped: true,
  1076. singleSelect: false,
  1077. url: "json/note2.json",
  1078. dataType: "json",
  1079. pagination: true, //分页
  1080. pageSize: number,
  1081. pageNumber: 1,
  1082. search: false, //显示搜索框
  1083. contentType: "application/x-www-form-urlencoded",
  1084. queryParams: null,
  1085. columns: [
  1086. {
  1087. title: "污染源",
  1088. field: 'id',
  1089. align: 'center',
  1090. valign: 'middle'
  1091. },
  1092. {
  1093. title: '辐射距离',
  1094. field: 'title',
  1095. align: 'center',
  1096. valign: 'middle'
  1097. },
  1098. {
  1099. title: '污染范围',
  1100. field: 'type',
  1101. align: 'center',
  1102. valign: 'middle'
  1103. },
  1104. {
  1105. title: '污染类型',
  1106. field: 'person',
  1107. align: 'center'
  1108. }
  1109. ]
  1110. });
  1111. }
  1112. function Echarts() {
  1113. var myChart = echarts.init($("#container_huan")[0]);
  1114. var option = {
  1115. tooltip: {
  1116. trigger: 'item',
  1117. formatter: "{a} <br/>{b}: {c} ({d}%)"
  1118. },
  1119. legend: {
  1120. orient: 'vertical',
  1121. x: 'left',
  1122. data:['一类水质','二类水质','三类水质','四类水质','五类水质'],
  1123. textStyle:{
  1124. color:"#e9ebee"
  1125. }
  1126. },
  1127. series: [
  1128. {
  1129. name:'行业数据',
  1130. type:'pie',
  1131. center:['80%','50%'],
  1132. radius: ['50%', '80%'],
  1133. avoidLabelOverlap: false,
  1134. label: {
  1135. normal: {
  1136. show: false,
  1137. position: 'center'
  1138. },
  1139. emphasis: {
  1140. show: true,
  1141. textStyle: {
  1142. fontSize: '30',
  1143. fontWeight: 'bold'
  1144. }
  1145. }
  1146. },
  1147. itemStyle: {
  1148. normal: {
  1149. label: {
  1150. show: false
  1151. },
  1152. labelLine: {
  1153. show: false
  1154. }
  1155. }
  1156. },
  1157. data:[
  1158. {value:335, name:'一类水质'},
  1159. {value:310, name:'二类水质'},
  1160. {value:234, name:'三类水质'},
  1161. {value:135, name:'四类水质'},
  1162. {value:1548, name:'五类水质'}
  1163. ]
  1164. }
  1165. ]
  1166. };
  1167. myChart.setOption(option);
  1168. }
  1169. function TimeControl(){
  1170. $(".message_scroll_box").animate({marginTop:96},800,
  1171. function(){
  1172. $(".message_scroll_box").css({marginTop:0}); //把顶部的边界清零
  1173. $(".message_scroll_box .message_scroll:first").before($(".message_scroll_box .message_scroll:last")); //在第一个新闻后面插入最后一个新闻
  1174. });
  1175. }
  1176. var T=setInterval(TimeControl,2300); //开始定时
  1177. $(".message_scroll_box").mouseenter(function(){
  1178. clearInterval(T); //停止定时
  1179. })
  1180. .mouseleave(function(){
  1181. T=setInterval(TimeControl,2500); //再次定时
  1182. })
  1183. </script>
  1184. <!--轨迹回放时间日期选择-->
  1185. <script>
  1186. !function(){
  1187. laydate.skin('danlan');//切换皮肤,请查看skins下面皮肤库
  1188. laydate({elem: '#demo'});
  1189. laydate({elem: '#demo1'});//绑定元素
  1190. }();
  1191. //日期范围限制
  1192. var start = {
  1193. elem: '#start',
  1194. format: 'YYYY-MM-DD',
  1195. min: laydate.now(), //设定最小日期为当前日期
  1196. max: '2099-06-16', //最大日期
  1197. istime: true,
  1198. istoday: false,
  1199. choose: function(datas){
  1200. end.min = datas; //开始日选好后,重置结束日的最小日期
  1201. end.start = datas //将结束日的初始值设定为开始日
  1202. }
  1203. };
  1204. var end = {
  1205. elem: '#end',
  1206. format: 'YYYY-MM-DD',
  1207. min: laydate.now(),
  1208. max: '2099-06-16',
  1209. istime: true,
  1210. istoday: false,
  1211. choose: function(datas){
  1212. start.max = datas; //结束日选好后,充值开始日的最大日期
  1213. }
  1214. };
  1215. laydate(start);
  1216. laydate(end);
  1217. function edit() {
  1218. layer.open({
  1219. type: 2,
  1220. title: '存储详情',
  1221. shade: 0.5,
  1222. skin: 'layui-layer-rim',
  1223. area: ['700px', '400px'],
  1224. shadeClose: true,
  1225. closeBtn: 1,
  1226. content: 'saveFindTail.html'
  1227. });
  1228. }
  1229. //生命周期
  1230. function listCrile(){
  1231. art.dialog.open('analysis.html',
  1232. {title: '统计分析页', width: '60%', height: '60%',shade: 0.5,mask:true});
  1233. }
  1234. $(".search_eddit").click(function(){
  1235. listCrile();
  1236. })
  1237. </script>
  1238. </body>
  1239. </html>