Home Explore Help
Register Sign In
linan
/
dgs.bigScreen
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Branch: master
Branches Tags
dgs.bigScreen
/
index.html

index.html 34 KB
Permalink History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152 
  1. <!DOCTYPE html>
    2. 

  2. <html lang="zh">
    3. 

  3. <head>
    4. 

  4.   <meta charset="utf-8">
    5. 

  5.   <title>首页</title>
    6. 

  6.   <link href="css/common.css" rel="stylesheet">
    7. 

  7.   <link href="css/index.css" rel="stylesheet">
    8. 

  8.   <link href="css/scrollBar.css" rel="stylesheet">
    9. 

  9.   <script type="text/javascript" src="js/echarts.min.js"></script>
    10. 

  10.   <script type="text/javascript" src="js/jquery-2.2.4.min.js"></script>
    11. 

  11.   <script type="text/javascript" src="js/common.js"></script>
    12. 

  12.  <script type="text/javascript" src="js/scroll.js"></script>
    13. 

  13. <script type="text/javascript" src="js/api.js"></script>
    14. 

  14. <script type="text/javascript" src="js/jsmpeg.min.js"></script>
    15. 

  15.   
    16. 

  16. </head>
    17. 

  17. <body>
    18. 

  18. 	<div class="header-wrapper">
    19. 

  19. 	  <div class="title">
    20. 

  20. 	  智能化综合管理平台
    21. 

  21. 	  <svg version="1.1" width="900" height='100'>
    22. 

  22. 	   <polygon points="" style="fill:transparent;stroke:#69F8FE;stroke-width:2"/>
    23. 

  23. 		</svg>
    24. 

  24. 	  </div>
    25. 

  25. 	  <div class="nav-bar">
    26. 

  26. 		<a class="item active" >首页</a>
    27. 

  27. 		<a class="item" href="fzfx.html">生产管理</a>
    28. 

  28. 		<a class="item" href="swfk.html">生物防控</a>
    29. 

  29. 		<a class="item" href="spjk.html">视频监控</a>
    30. 

  30. 		<a class="item" href="hbjc.html">环保监测</a>
    31. 

  31. 	  </div>
    32. 

  32. 	</div>
    33. 

  33. 	<div class="grid-wrapper">
    34. 

  34. 		<div class="left1">
    35. 

  35. 		
    36. 

  36. 			<div class="wrapper wrapper1">
    37. 

  37. 			  <div class="tab"><div class="tab-title">人员出入</div></div>
    38. 

  38. 			  <div class="wrapper-content">
    39. 

  39. 			  <div class="wide-border">
    40. 

  40. 				
    41. 

  41. 			  </div>
    42. 

  42. 			  <svg version="1.1" width="37" height="25" class="wide-border-line1">
    43. 

  43. 			  <g transform="translate(0.5 0.5)">
    44. 

  44. 			   <polyline points="0,24.5 0,0 37,23.5 " style="fill:#0E1E51;stroke:#53BAFD;stroke-width:1"/>
    45. 

  45. 			   
    46. 

  46. 			   </g>
    47. 

  47. 			   
    48. 

  48. 				</svg>
    49. 

  49. 				<svg version="1.1" width="90" height="25" class="wide-border-line2">
    50. 

  50. 			  <g transform="translate(0.5 0.5)">
    51. 

  51. 			   <polyline points="90,25 65,0 25,0 -1,23.5" style="fill:#0E1E51;stroke:#53BAFD;stroke-width:1"/>
    52. 

  52. 			   </g>
    53. 

  53. 				</svg>
    54. 

  54. 				<svg version="1.1" width="25" height="26" class="wide-border-line3">
    55. 

  55. 			 
    56. 

  56. 			   <line x1="0" y1="0" x2="26" y2="24.5"style="stroke:#53BAFD;stroke-width:1"/>
    57. 

  57. 			   
    58. 

  58. 				</svg>
    59. 

  59. 				<svg version="1.1" width="25" height="26" class="wide-border-line4">
    60. 

  60. 			 
    61. 

  61. 			   <line x1="0" y1="24" x2="25" y2="0"style="stroke:#53BAFD;stroke-width:1"/>
    62. 

  62. 			   
    63. 

  63. 				</svg>
    64. 

  64. 				<div id="device-status">
    65. 

  65. 						<div id="chart-snhjsj"></div>
    66. 

  66. 					<!--<div class="device-status-box">
    67. 

  67. 						<div class="chart-tab-t"><div class="chart-tab-title">人员出入统计</div></div>
    68. 

  68. 						<div id="chart-rycrtj"></div>
    69. 

  69. 					</div>-->
    70. 

  70. 				</div>
    71. 

  71. 			  </div>
    72. 

  72. 			</div>
    73. 

  73. 			<div class="wrapper wrapper1">
    74. 

  74. 			  <div class="tab"><div class="tab-title">行业新闻</div></div>
    75. 

  75. 			  <div class="wrapper-content">
    76. 

  76. 			  <div class="wide-border">
    77. 

  77. 				
    78. 

  78. 			  </div>
    79. 

  79. 			  <svg version="1.1" width="37" height="25" class="wide-border-line1">
    80. 

  80. 			  <g transform="translate(0.5 0.5)">
    81. 

  81. 			   <polyline points="0,24.5 0,0 37,23.5 " style="fill:#0E1E51;stroke:#53BAFD;stroke-width:1"/>
    82. 

  82. 			   
    83. 

  83. 			   </g>
    84. 

  84. 			   
    85. 

  85. 				</svg>
    86. 

  86. 				<svg version="1.1" width="90" height="25" class="wide-border-line2">
    87. 

  87. 			  <g transform="translate(0.5 0.5)">
    88. 

  88. 			   <polyline points="90,25 65,0 25,0 -1,23.5" style="fill:#0E1E51;stroke:#53BAFD;stroke-width:1"/>
    89. 

  89. 			   </g>
    90. 

  90. 				</svg>
    91. 

  91. 				<svg version="1.1" width="25" height="26" class="wide-border-line3">
    92. 

  92. 			 
    93. 

  93. 			   <line x1="0" y1="0" x2="26" y2="24.5"style="stroke:#53BAFD;stroke-width:1"/>
    94. 

  94. 			   
    95. 

  95. 				</svg>
    96. 

  96. 				<svg version="1.1" width="25" height="26" class="wide-border-line4">
    97. 

  97. 			 
    98. 

  98. 			   <line x1="0" y1="24" x2="25" y2="0"style="stroke:#53BAFD;stroke-width:1"/>
    99. 

  99. 			   
    100. 

  100. 				</svg>
    101. 

  101. 				<div class="news-box">
    102. 

  102. 						<div id="news-list">
    103. 

  103. 							
    104. 

  104. 						</div>
    105. 

  105. 					
    106. 

  106. 				</div>
    107. 

  107. 			  </div>
    108. 

  108. 			</div>
    109. 

  109. 		</div>
    110. 

  110. 		<div class="brief">
    111. 

  111. 			<div class="line1">
    112. 

  112. 			  <div class="cont datenow">2019-05-21</div>
    113. 

  113. 			  <div class="division"></div>
    114. 

  114. 			  <div class="cont">首页</div>
    115. 

  115. 			  <div class="division"></div>
    116. 

  116. 			  <div class="cont" id='dataSet'><img src="images/set.png" /></div>
    117. 

  117. 			</div>
    118. 

  118. 			<div class="line2">
    119. 

  119. 			  <div class="item">
    120. 

  120. 				<div class="bor wrapper">
    121. 

  121. 				  <div class="border-zhe">
    122. 

  122. 				  <div class="zhe-block zhe-block-rotate1"></div>
    123. 

  123. 				  <div class="zhe-block zhe-block-rotate2"></div>
    124. 

  124. 				  <div class="zhe-block zhe-block-rotate3"></div>
    125. 

  125. 				  <div class="zhe-block zhe-block-rotate4"></div>
    126. 

  126. 				  <div class="item-info-title">
    127. 

  127. 				  <span class="title">总存栏：</span>
    128. 

  128. 				  <span class="number">0</span>
    129. 

  129. 				  </div>
    130. 

  130. 				  </div>
    131. 

  131. 				</div>
    132. 

  132. 			  </div>
    133. 

  133. 			  <div class="item">
    134. 

  134. 				<div class="bor wrapper">
    135. 

  135. 				<div class="border-zhe">
    136. 

  136. 				  <div class="zhe-block zhe-block-rotate1"></div>
    137. 

  137. 				  <div class="zhe-block zhe-block-rotate2"></div>
    138. 

  138. 				  <div class="zhe-block zhe-block-rotate3"></div>
    139. 

  139. 				  <div class="zhe-block zhe-block-rotate4"></div>
    140. 

  140. 				  <div class="item-info-title">
    141. 

  141. 				  <span class="title">母猪存栏：</span>
    142. 

  142. 				  <span class="number">0</span>
    143. 

  143. 				  </div>
    144. 

  144. 				  </div>
    145. 

  145. 				</div>
    146. 

  146. 			  </div>
    147. 

  147. 			  <div class="item">
    148. 

  148. 				<div class="bor wrapper">
    149. 

  149. 				<div class="border-zhe">
    150. 

  150. 				  <div class="zhe-block zhe-block-rotate1"></div>
    151. 

  151. 				  <div class="zhe-block zhe-block-rotate2"></div>
    152. 

  152. 				  <div class="zhe-block zhe-block-rotate3"></div>
    153. 

  153. 				  <div class="zhe-block zhe-block-rotate4"></div>
    154. 

  154. 				  <div class="item-info-title">
    155. 

  155. 				  <span class="title">均产仔数：</span>
    156. 

  156. 				  <span class="number">0</span>
    157. 

  157. 				  </div>
    158. 

  158. 				  </div>
    159. 

  159. 				</div>
    160. 

  160. 			  </div>
    161. 

  161. 			  <div class="item">
    162. 

  162. 				<div class="bor wrapper">
    163. 

  163. 				<div class="border-zhe">
    164. 

  164. 				  <div class="zhe-block zhe-block-rotate1"></div>
    165. 

  165. 				  <div class="zhe-block zhe-block-rotate2"></div>
    166. 

  166. 				  <div class="zhe-block zhe-block-rotate3"></div>
    167. 

  167. 				  <div class="zhe-block zhe-block-rotate4"></div>
    168. 

  168. 				  <div class="item-info-title">
    169. 

  169. 				  <span class="title">PSY：</span>
    170. 

  170. 				  <span class="number">0</span>
    171. 

  171. 				  </div>
    172. 

  172. 				  </div>
    173. 

  173. 				</div>
    174. 

  174. 			  </div>
    175. 

  175. 			  <div class="item">
    176. 

  176. 				<div class="bor wrapper">
    177. 

  177. 				<div class="border-zhe">
    178. 

  178. 				  <div class="zhe-block zhe-block-rotate1"></div>
    179. 

  179. 				  <div class="zhe-block zhe-block-rotate2"></div>
    180. 

  180. 				  <div class="zhe-block zhe-block-rotate3"></div>
    181. 

  181. 				  <div class="zhe-block zhe-block-rotate4"></div>
    182. 

  182. 				  <div class="item-info-title">
    183. 

  183. 				  <span class="title">MSY：</span>
    184. 

  184. 				  <span class="number">0</span>
    185. 

  185. 				  </div>
    186. 

  186. 				  </div>
    187. 

  187. 				</div>
    188. 

  188. 			  </div>
    189. 

  189. 			  <div class="item">
    190. 

  190. 				<div class="bor wrapper">
    191. 

  191. 				<div class="border-zhe">
    192. 

  192. 				  <div class="zhe-block zhe-block-rotate1"></div>
    193. 

  193. 				  <div class="zhe-block zhe-block-rotate2"></div>
    194. 

  194. 				  <div class="zhe-block zhe-block-rotate3"></div>
    195. 

  195. 				  <div class="zhe-block zhe-block-rotate4"></div>
    196. 

  196. 				  <div class="item-info-title">
    197. 

  197. 				  <span class="title">料肉比：</span>
    198. 

  198. 				  <span class="number">0</span>
    199. 

  199. 				  </div>
    200. 

  200. 				  </div>
    201. 

  201. 				</div>
    202. 

  202. 			  </div>
    203. 

  203. 			</div>
    204. 

  204. 		</div>
    205. 

  205. 		<div class="img" id='img_map' style='position:relative;'>
    206. 

  206. 			
    207. 

  207. 			<div class='img_window' id="box" style="position:absolute;transform:scale(1)">
    208. 

  208. 			
    209. 

  209. 			<canvas id="diagonal" width="" height=""></canvas>
    210. 

  210. 			<img alt="" src="images/newmap.jpg" id="pic" usemap="#buildmap" style="">
    211. 

  211. 			
    212. 

  212. 			<map name="buildmap" id="buildmap"><!-- 三个鼠标点击的区域 -->
    213. 

  213. 				<!--老牧1区开始-->
    214. 

  214. 			  <area shape="poly" coords="614,220,620,216,681,259,676,263" href="#" alt="" />
    215. 

  215. 			  <area shape="poly" coords="602,227,608,223,669,266,663,270" href="#" alt="" />
    216. 

  216. 			  <area shape="poly" coords="590,233,597,230,657,272,650,276" href="#" alt="" />
    217. 

  217. 			  <area shape="poly" coords="578,240,586,236,646,280,640,285" href="#" alt="" />
    218. 

  218. 			  <area shape="poly" coords="566,246,574,243,635,289,629,292" href="#" alt="" />
    219. 

  219. 			  <area shape="poly" coords="555,253,562,249,622,295,617,300" href="#" alt="" />
    220. 

  220. 			  <area shape="poly" coords="542,260,549,257,610,304,604,308" href="#" alt="" />
    221. 

  221. 			  <area shape="poly" coords="530,267,537,264,597,311,591,316" href="#" alt="" />
    222. 

  222. 			  <area shape="poly" coords="517,275,524,271,585,319,578,323" href="#" alt="" />
    223. 

  223. 			  <area shape="poly" coords="504,282,511,278,570,327,564,332" href="#" alt="" />
    224. 

  224. 			  <!--老牧1区结束-->
    225. 

  225. 			  <!--老牧2区开始-->
    226. 

  226. 			  <area shape="poly" coords="540,162,547,160,585,203,578,207" href="#" alt="" />
    227. 

  227. 			  <area shape="poly" coords="526,167,533,164,571,208,563,211" href="#" alt="" />
    228. 

  228. 			  <area shape="poly" coords="513,171,521,169,557,213,550,216" href="#" alt="" />
    229. 

  229. 			  <area shape="poly" coords="499,176,506,174,543,218,535,221" href="#" alt="" />
    230. 

  230. 			  <area shape="poly" coords="485,179,492,178,528,223,521,226" href="#" alt="" />
    231. 

  231. 			  <area shape="poly" coords="471,184,478,183,514,228,507,231" href="#" alt="" />
    232. 

  232. 			  <area shape="poly" coords="457,189,463,187,498,233,491,236" href="#" alt="" />
    233. 

  233. 			  <area shape="poly" coords="442,193,450,190,483,239,476,241" href="#" alt="" />
    234. 

  234. 			  <area shape="poly" coords="427,198,435,196,467,243,460,245" href="#" alt="" />
    235. 

  235. 			  <area shape="poly" coords="412,202,420,200,452,249,445,251" href="#" alt="" />
    236. 

  236. 			  <!--老牧2区结束-->
    237. 

  237. 			  <!--老牧3区开始-->
    238. 

  238. 			  <area shape="poly" coords="397,207,405,205,436,253,429,256" href="#" alt="" />
    239. 

  239. 			  <area shape="poly" coords="382,212,389,210,421,259,414,262" href="#" alt="" />
    240. 

  240. 			  <area shape="poly" coords="367,217,375,215,404,264,397,267" href="#" alt="" />
    241. 

  241. 			  <area shape="poly" coords="348,223,356,221,385,270,377,274" href="#" alt="" />
    242. 

  242. 			  <area shape="poly" coords="333,228,341,226,369,276,361,279" href="#" alt="" />
    243. 

  243. 			  <area shape="poly" coords="317,232,325,232,353,282,344,284" href="#" alt="" />
    244. 

  244. 			  <area shape="poly" coords="301,238,309,235,336,287,327,290" href="#" alt="" />
    245. 

  245. 			  <area shape="poly" coords="285,244,292,242,318,293,309,296" href="#" alt="" />
    246. 

  246. 			  <area shape="poly" coords="271,247,278,244,304,298,295,301" href="#" alt="" />
    247. 

  247. 			  <area shape="poly" coords="257,252,265,249,289,303,281,306" href="#" alt="" />
    248. 

  248. 			  <area shape="poly" coords="246,255,253,253,278,307,270,309" href="#" alt="" />
    249. 

  249. 			  <area shape="poly" coords="231,260,241,258,264,311,255,314" href="#" alt="" />
    250. 

  250. 			  <area shape="poly" coords="232,288,240,285,251,308,242,311" href="#" alt="" />
    251. 

  251. 			  
    252. 

  252. 			  <!--老牧3区结束-->
    253. 

  253. 			  <!--老牧4区开始-->			  
    254. 

  254. 			  <area shape="poly" coords="898,192,912,167,919,170,906,194" href="#" alt="" />
    255. 

  255. 			  <area shape="poly" coords="879,224,893,199,901,202,888,226" href="#" alt="" />
    256. 

  256. 			  <area shape="poly" coords="882,186,895,164,903,167,890,189" href="#" alt="" />
    257. 

  257. 			  <area shape="poly" coords="863,220,877,194,885,197,872,222" href="#" alt="" />
    258. 

  258. 			  <area shape="poly" coords="865,182,879,159,886,162,873,184" href="#" alt="" />
    259. 

  259. 			  <area shape="poly" coords="845,213,860,189,867,192,853,217" href="#" alt="" />
    260. 

  260. 			  <area shape="poly" coords="848,177,862,154,870,157,856,179" href="#" alt="" />			  
    261. 

  261. 			  <area shape="poly" coords="829,208,844,184,851,187,837,211" href="#" alt="" />
    262. 

  262. 			  <!--老牧4区结束-->
    263. 

  263. 			  <!--老牧5区开始-->
    264. 

  264. 			  <area shape="poly" coords="891,294,906,256,919,260,905,297" href="#" alt="" />
    265. 

  265. 			  <area shape="poly" coords="865,286,882,243,906,250,886,294" href="#" alt="" />
    266. 

  266. 			  <area shape="poly" coords="842,283,852,262,868,267,859,289" href="#" alt="" />			  
    267. 

  267. 			  <area shape="poly" coords="821,277,833,255,848,261,837,282" href="#" alt="" />			  			  
    268. 

  268. 			  <area shape="poly" coords="852,259,862,238,879,243,869,262" href="#" alt="" />
    269. 

  269. 			  <area shape="poly" coords="834,253,843,232,860,238,850,258" href="#" alt="" />
    270. 

  270. 			  
    271. 

  271. 			  <!--老牧5区结束-->
    272. 

  272. 			  <!--新区保育开始-->
    273. 

  273. 			  <area shape="poly" coords="897,136,916,130,934,146,919,152" href="#" />		  
    274. 

  274. 			  <area shape="poly" coords="918,129,935,124,955,141,939,146" href="#" alt="" />
    275. 

  275. 			  <!--新区保育结束-->
    276. 

  276. 			  <!--天地猪舍开始-->
    277. 

  277. 			  <area shape="poly" coords="298,309,380,282,385,290,301,318" href="#" alt="" />
    278. 

  278. 			   <!--天地猪舍结束-->
    279. 

  279. 			</map>
    280. 

  280. 			
    281. 

  281. 			</div>
    282. 

  282. 		</div>
    283. 

  283. 		
    284. 

  284. 		<div id="right2" class="right2">
    285. 

  285. 		<div class="wrapper wrapper1">
    286. 

  286. 		  <div class="tab"><div class="tab-title">工作看板</div></div>
    287. 

  287. 		  <div class="wrapper-content">
    288. 

  288. 			  <div class="wide-border">
    289. 

  289. 				
    290. 

  290. 			  </div>
    291. 

  291. 			  <svg version="1.1" width="37" height="25" class="wide-border-line1">
    292. 

  292. 			  <g transform="translate(0.5 0.5)">
    293. 

  293. 			   <polyline points="0,24.5 0,0 37,23.5 " style="fill:#0E1E51;stroke:#53BAFD;stroke-width:1"/>
    294. 

  294. 			   
    295. 

  295. 			   </g>
    296. 

  296. 			   
    297. 

  297. 				</svg>
    298. 

  298. 				<svg version="1.1" width="90" height="25" class="wide-border-line2">
    299. 

  299. 			  <g transform="translate(0.5 0.5)">
    300. 

  300. 			   <polyline points="90,25 65,0 25,0 -1,23.5" style="fill:#0E1E51;stroke:#53BAFD;stroke-width:1"/>
    301. 

  301. 			   </g>
    302. 

  302. 				</svg>
    303. 

  303. 				<svg version="1.1" width="25" height="26" class="wide-border-line3">
    304. 

  304. 			 
    305. 

  305. 			   <line x1="0" y1="0" x2="26" y2="24.5"style="stroke:#53BAFD;stroke-width:1"/>
    306. 

  306. 			   
    307. 

  307. 				</svg>
    308. 

  308. 				<svg version="1.1" width="25" height="26" class="wide-border-line4">
    309. 

  309. 			 
    310. 

  310. 			   <line x1="0" y1="24" x2="25" y2="0"style="stroke:#53BAFD;stroke-width:1"/>
    311. 

  311. 			   
    312. 

  312. 				</svg>
    313. 

  313. 				<div class="cont">
    314. 

  314. 			<div class="item">
    315. 

  315. 			  <div class="title">待转保育</div>
    316. 

  316. 			  <div class="num">0</div>
    317. 

  317. 			</div>
    318. 

  318. 			<div class="item">
    319. 

  319. 			  <div class="title">待转育肥</div>
    320. 

  320. 			  <div class="num">0</div>
    321. 

  321. 			</div>
    322. 

  322. 			<div class="item">
    323. 

  323. 			  <div class="title">待配</div>
    324. 

  324. 			  <div class="num">0</div>
    325. 

  325. 			</div>
    326. 

  326. 			<div class="item">
    327. 

  327. 			  <div class="title">待妊娠</div>
    328. 

  328. 			  <div class="num">0</div>
    329. 

  329. 			</div>
    330. 

  330. 			<div class="item">
    331. 

  331. 			  <div class="title">待产</div>
    332. 

  332. 			  <div class="num">0</div>
    333. 

  333. 			</div>
    334. 

  334. 			<div class="item">
    335. 

  335. 			  <div class="title">待断奶</div>
    336. 

  336. 			  <div class="num">0</div>
    337. 

  337. 			</div>
    338. 

  338. 			<div class="item">
    339. 

  339. 			  <div class="title">免疫记录</div>
    340. 

  340. 			  <div class="num">0</div>
    341. 

  341. 			</div>
    342. 

  342. 			<div class="item">
    343. 

  343. 			  <div class="title">销售记录</div>
    344. 

  344. 			  <div class="num">0</div>
    345. 

  345. 			</div>
    346. 

  346. 			
    347. 

  347. 		  </div>
    348. 

  348. 		</div>
    349. 

  349. 		  
    350. 

  350. 		</div>
    351. 

  351. 		<div class="wrapper wrapper2">
    352. 

  352. 		  <div class="tab"><div class="tab-title">报警信息</div></div>
    353. 

  353. 		  
    354. 

  354. 		  <div class="wrapper-content">
    355. 

  355. 			  <div class="wide-border">
    356. 

  356. 				
    357. 

  357. 			  </div>
    358. 

  358. 			  <svg version="1.1" width="37" height="25" class="wide-border-line1">
    359. 

  359. 			  <g transform="translate(0.5 0.5)">
    360. 

  360. 			   <polyline points="0,24.5 0,0 37,23.5 " style="fill:#0E1E51;stroke:#53BAFD;stroke-width:1"/>
    361. 

  361. 			   
    362. 

  362. 			   </g>
    363. 

  363. 			   
    364. 

  364. 				</svg>
    365. 

  365. 				<svg version="1.1" width="90" height="25" class="wide-border-line2">
    366. 

  366. 			  <g transform="translate(0.5 0.5)">
    367. 

  367. 			   <polyline points="90,25 65,0 25,0 -1,23.5" style="fill:#0E1E51;stroke:#53BAFD;stroke-width:1"/>
    368. 

  368. 			   </g>
    369. 

  369. 				</svg>
    370. 

  370. 				<svg version="1.1" width="25" height="26" class="wide-border-line3">
    371. 

  371. 			 
    372. 

  372. 			   <line x1="0" y1="0" x2="26" y2="24.5"style="stroke:#53BAFD;stroke-width:1"/>
    373. 

  373. 			   
    374. 

  374. 				</svg>
    375. 

  375. 				<svg version="1.1" width="25" height="26" class="wide-border-line4">
    376. 

  376. 			 
    377. 

  377. 			   <line x1="0" y1="24" x2="25" y2="0"style="stroke:#53BAFD;stroke-width:1"/>
    378. 

  378. 			   
    379. 

  379. 				</svg>
    380. 

  380. 				<div class='warning-msg' id="alarmList">
    381. 

  381. 					<div class="msg"><img src="images/warning.png" />配怀舍一栋停电报警！</div>
    382. 

  382. 					<div class="msg"><img src="images/warning.png" />保育舍二栋超高温报警！</div>
    383. 

  383. 					<div class="msg"><img src="images/warning.png" />育肥舍一栋料线报警！</div>
    384. 

  384. 					<div class="msg"><img src="images/warning.png" />分娩舍四栋湿度异常报警！</div>
    385. 

  385. 					<div class="msg"><img src="images/warning.png" />育肥舍一栋料线报警！</div>
    386. 

  386. 				  
    387. 

  387. 				  </div>
    388. 

  388. 			  </div>
    389. 

  389. 		</div>
    390. 

  390. 	    </div>
    391. 

  391. 		<div class="bottom1" id="bottom1" >
    392. 

  392. 		<div class='single' style='width: 100%;height: 100%;position: relative;'>
    393. 

  393. 		<div class="pre"></div>
    394. 

  394. 		<div class="next"></div>
    395. 

  395. 		<ul class="list">
    396. 

  396. 		  
    397. 

  397. 		</ul>
    398. 

  398. 		</div>
    399. 

  399. 	  </div>
    400. 

  400. 	</div>
    401. 

  401. <div class='open-box-container windows-dataset'>
    402. 

  402. 	<div class='open-lauer-box'>
    403. 

  403. 		<div class="open-box-head"><span class="window-title"></span>参数配置</div>
    404. 

  404. 		<div class="open-box-body">
    405. 

  405. 			<table cellpadding="0" cellspacing="0" class="wsclset-dataTable">
    406. 

  406. 				<tbody>
    407. 

  407. 				<tr>
    408. 

  408. 					<td class="table-real-head">显示</td>
    409. 

  409. 					<td class="table-real-head">参数</td>
    410. 

  410. 					<td class="table-real-head">值</td>
    411. 

  411. 					<td class="table-real-head">显示</td>
    412. 

  412. 					<td class="table-real-head">参数</td>
    413. 

  413. 					<td class="table-real-head">值</td>
    414. 

  414. 				</tr>
    415. 

  415. 				<tr>
    416. 

  416. 					<td><input type="checkbox" checked/></td>
    417. 

  417. 					<td>总存栏</td>
    418. 

  418. 					<td><input type="text" class="param-dataset"></td>
    419. 

  419. 					<td><input type="checkbox" checked/></td>
    420. 

  420. 					<td>母猪存栏</td>
    421. 

  421. 

  422. 					<td><input type="text" class="param-dataset"></td>
    423. 

  423. 				</tr>
    424. 

  424. 				<tr>
    425. 

  425. 					<td><input type="checkbox" checked/></td>
    426. 

  426. 					<td>均产仔数</td>
    427. 

  427. 					<td><input type="text" class="param-dataset"></td>
    428. 

  428. 					<td><input type="checkbox" checked/></td>
    429. 

  429. 					<td>PSY</td>
    430. 

  430. 					<td><input type="text" class="param-dataset"></td>
    431. 

  431. 				</tr>
    432. 

  432. 				<tr>
    433. 

  433. 					<td><input type="checkbox" checked/></td>
    434. 

  434. 					<td>MSY</td>
    435. 

  435. 					<td><input type="text" class="param-dataset"></td>
    436. 

  436. 					<td><input type="checkbox" checked/></td>
    437. 

  437. 					<td>料肉比</td>
    438. 

  438. 					<td><input type="text" class="param-dataset"></td>
    439. 

  439. 				</tr>
    440. 

  440. 				<tr>
    441. 

  441. 					<td><input type="checkbox" /></td>
    442. 

  442. 					<td>年产胎次</td>
    443. 

  443. 					<td><input type="text" class="param-dataset"></td>
    444. 

  444. 					<td><input type="checkbox" /></td>
    445. 

  445. 					<td>返情率</td>
    446. 

  446. 					<td><input type="text" class="param-dataset"></td>
    447. 

  447. 				</tr>
    448. 

  448. 				<tr>
    449. 

  449. 					<td><input type="checkbox" /></td>
    450. 

  450. 					<td>配种数</td>
    451. 

  451. 					<td><input type="text" class="param-dataset"></td>
    452. 

  452. 					<td><input type="checkbox" /></td>
    453. 

  453. 					<td>受胎率</td>
    454. 

  454. 					<td><input type="text" class="param-dataset"></td>
    455. 

  455. 				</tr>
    456. 

  456. 				<tr>
    457. 

  457. 					<td><input type="checkbox" /></td>
    458. 

  458. 					<td>配娩率</td>
    459. 

  459. 					<td><input type="text" class="param-dataset"></td>
    460. 

  460. 					<td><input type="checkbox" /></td>
    461. 

  461. 					<td>达100Kg日龄</td>
    462. 

  462. 					<td><input type="text" class="param-dataset"></td>
    463. 

  463. 				</tr>
    464. 

  464. 			</tbody></table>
    465. 

  465. 		</div>
    466. 

  466. 	</div>
    467. 

  467. </div>
    468. 

  468. <div class="open-box-container window-ssqx">
    469. 

  469. 	<div class='open-lauer-box'>
    470. 

  470. 		<div class="open-box-head"><span class="window-title"></span>环境监测温度/湿度日曲线</div>
    471. 

  471. 		<div class="open-box-body">
    472. 

  472. 			<div id="chart-ssqx"></div>
    473. 

  473. 		</div>
    474. 

  474. 	</div>
    475. 

  475. </div>
    476. 

  476. <div class='open-box-container windows-spjk'>
    477. 

  477. 	<div class='open-lauer-box'>
    478. 

  478. 		<div class="open-box-head"><span class="window-title"></span>视频监控</div>
    479. 

  479. 		<div class="open-box-body">
    480. 

  480. 			<div id="play-box-0"></div>
    481. 

  481. 		</div>
    482. 

  482. 	</div>
    483. 

  483. </div>
    484. 

  484. <script type="text/javascript">
    485. 

  485. var dom_snhjsj = document.getElementById("chart-snhjsj");
    486. 

  486. 

  487. var dom_ssqx = document.getElementById("chart-ssqx");
    488. 

  488. var myChart_snhjsj = echarts.init(dom_snhjsj);
    489. 

  489. 

  490. 

  491. var myChart_ssqx = echarts.init(dom_ssqx);
    492. 

  492. var app = {};
    493. 

  493. option_snhjsj=null,option_ssqx=null;
    494. 

  494. 

  495. //人员出入详情
    496. 

  496. var moment = new Date();
    497. 

  497. var nowHour = moment.getHours();
    498. 

  498. var nowDate = getDate();
    499. 

  499. 

  500. var rycrUrl = "/analyse/uface/passCount";
    501. 

  501. var data_rycr_in=[];
    502. 

  502. var data_rycr_out=[];
    503. 

  503. var data_rycr_legend = [];
    504. 

  504. 

  505. var times = 0;
    506. 

  506. for(var i=0;i<=nowHour;++i){
    507. 

  507. 	
    508. 

  508. 	(function (i) {
    509. 

  509. 		var j = i+1;
    510. 

  510. 		var rycrParam = {
    511. 

  511. 			beginTime:nowDate+" "+(i<10?"0"+i:i)+":00:00",
    512. 

  512. 			endTime:nowDate+" "+(j<10?"0"+j:j)+":00:00",
    513. 

  513. 		};
    514. 

  514. 		data_rycr_legend[i] = (i<10?"0"+i:i)+":00"+"-"+(j<10?"0"+j:j)+":00";				
    515. 

  515. 		getData(rycrUrl,rycrParam).then(res => {
    516. 

  516. 			data_rycr_in[i] = res.inCount;
    517. 

  517. 			data_rycr_out[i] = res.outCount;			
    518. 

  518. 			//console.log(times,nowHour)
    519. 

  519. 			if(times==nowHour){
    520. 

  520. 				option_snhjsj.series[0].data = data_rycr_out;
    521. 

  521. 				option_snhjsj.series[1].data = data_rycr_in;
    522. 

  522. 				option_snhjsj.xAxis.data = data_rycr_legend;
    523. 

  523. 				myChart_snhjsj.setOption(option_snhjsj, true);
    524. 

  524. 			}
    525. 

  525. 			++times;
    526. 

  526. 		})
    527. 

  527. 	}(i))			
    528. 

  528. }
    529. 

  529. 

  530. //获取人员进出详情
    531. 

  531. 

  532. option_snhjsj = {
    533. 

  533. 	color:['#207bc4','#b93b6a'],
    534. 

  534.     tooltip : {
    535. 

  535.         trigger: 'axis',
    536. 

  536.         axisPointer : {            // 坐标轴指示器，坐标轴触发有效
    537. 

  537.             type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
    538. 

  538.         },
    539. 

  539. 		
    540. 

  540. 		
    541. 

  541.     },
    542. 

  542.     grid: {
    543. 

  543.         x: '3%',
    544. 

  544.         y: '13%',
    545. 

  545.         x2: '5%',
    546. 

  546. 		y2: '5%',
    547. 

  547.         containLabel: true
    548. 

  548. 		
    549. 

  549.     },
    550. 

  550. 	legend: {
    551. 

  551.         data: ['外出人数', '进入人数'],
    552. 

  552. 		icon:'circle',
    553. 

  553. 		itemGap: 5,
    554. 

  554. 		itemWidth:10,
    555. 

  555. 		top: '2%',
    556. 

  556. 		x:'center',
    557. 

  557. 		textStyle:{
    558. 

  558. 					
    559. 

  559. 		color:'#ccf5f9',
    560. 

  560. 		},
    561. 

  561.     },
    562. 

  562.     xAxis :{
    563. 

  563.             type : 'category',
    564. 

  564.             data : data_rycr_legend,
    565. 

  565.             axisTick: {
    566. 

  566.                 alignWithLabel: true
    567. 

  567.             },
    568. 

  568. 			axisLine: {
    569. 

  569. 					show: true,
    570. 

  570. 					lineStyle: {
    571. 

  571. 								type: 'solid',
    572. 

  572. 								color: '#4865e3',//左边线的颜色
    573. 

  573. 								width:'1'//坐标线的宽度
    574. 

  574. 					}
    575. 

  575. 			},
    576. 

  576. 			axisLabel: {
    577. 

  577. 				textStyle: {
    578. 

  578.                 color: '#ccf5f9',
    579. 

  579. 				
    580. 

  580. 				},
    581. 

  581. 				
    582. 

  582. 			}
    583. 

  583. 			
    584. 

  584.         },
    585. 

  585.     yAxis :{
    586. 

  586.             type : 'value',
    587. 

  587. 			scale: true,
    588. 

  588. 			axisLine: {
    589. 

  589. 					show: true,
    590. 

  590. 					lineStyle: {
    591. 

  591. 								type: 'solid',
    592. 

  592. 								color: '#4865e3',//左边线的颜色
    593. 

  593. 								width:'1'//坐标线的宽度
    594. 

  594. 					}
    595. 

  595. 			},
    596. 

  596. 			splitLine:{
    597. 

  597. 				lineStyle: {
    598. 

  598. 						type: 'solid',
    599. 

  599. 						color: 'rgba(72,101,227,0.7)',
    600. 

  600. 						width:'1'
    601. 

  601. 				}
    602. 

  602. 			},
    603. 

  603. 			axisLabel: {
    604. 

  604. 				textStyle: {
    605. 

  605.                 color: '#ccf5f9',
    606. 

  606. 				
    607. 

  607. 				},
    608. 

  608. 				
    609. 

  609. 			}
    610. 

  610.         },
    611. 

  611. 	dataZoom: [{
    612. 

  612. 				type: 'inside',
    613. 

  613. 				start: 80,
    614. 

  614. 				end: 100
    615. 

  615. 			}],
    616. 

  616.     series : [
    617. 

  617.         {
    618. 

  618.             name:"外出人数",
    619. 

  619.             type:'bar',
    620. 

  620.             barWidth: '30%',
    621. 

  621.             data:data_rycr_out,
    622. 

  622. 			itemStyle: {
    623. 

  623. 		        normal: {
    624. 

  624. 		        
    625. 

  625. 				label: {
    626. 

  626. 						show: true, //开启显示
    627. 

  627. 						position: 'top', //在上方显示
    628. 

  628. 						textStyle: { //数值样式
    629. 

  629. 								color: '#ccf5f9',
    630. 

  630. 								fontSize: 12
    631. 

  631. 							},
    632. 

  632. 						formatter: '{c}'
    633. 

  633. 						},
    634. 

  634. 						
    635. 

  635. 		         }
    636. 

  636. 		    },
    637. 

  637.         },
    638. 

  638. 		{
    639. 

  639.             name:"进入人数",
    640. 

  640.             type:'bar',
    641. 

  641.             barWidth: '30%',
    642. 

  642.             data:data_rycr_in,
    643. 

  643. 			itemStyle: {
    644. 

  644. 		        normal: {		
    645. 

  645. 				label: {
    646. 

  646. 						show: true, //开启显示
    647. 

  647. 						position: 'top', //在上方显示
    648. 

  648. 						textStyle: { //数值样式
    649. 

  649. 								color: '#ccf5f9',
    650. 

  650. 								fontSize: 12
    651. 

  651. 							},
    652. 

  652. 						formatter: '{c}'
    653. 

  653. 						}
    654. 

  654. 		         }
    655. 

  655. 		    },
    656. 

  656.         }
    657. 

  657.     ]
    658. 

  658. };
    659. 

  659. //人员出入统计
    660. 

  660. option_rycrtj = {
    661. 

  661. 	color:['#207bc4','#b93b6a'],
    662. 

  662.     tooltip : {
    663. 

  663.         trigger: 'axis',
    664. 

  664.         axisPointer : {            // 坐标轴指示器，坐标轴触发有效
    665. 

  665.             type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
    666. 

  666.         },
    667. 

  667. 		
    668. 

  668. 		
    669. 

  669.     },
    670. 

  670.     grid: {
    671. 

  671.         x: '3%',
    672. 

  672.         y: '13%',
    673. 

  673.         x2: '5%',
    674. 

  674. 		y2: '5%',
    675. 

  675.         containLabel: true
    676. 

  676. 		
    677. 

  677.     },
    678. 

  678. 	legend: {
    679. 

  679.         data: ['外出人数', '进入人数'],
    680. 

  680. 		icon:'circle',
    681. 

  681. 		itemGap: 5,
    682. 

  682. 		itemWidth:10,
    683. 

  683. 		top: '2%',
    684. 

  684. 		x:'center',
    685. 

  685. 		textStyle:{
    686. 

  686. 					
    687. 

  687. 		color:'#ccf5f9',
    688. 

  688. 		},
    689. 

  689.     },
    690. 

  690.     xAxis :{
    691. 

  691.             type : 'category',
    692. 

  692.             data : ['08:00-09:00', '09:00-10:00', '10:00-11:00', '11:00-12:00', '12:00-13:00', '13:00-14:00', '14:00-15:00', '15:00-16:00', '16:00-17:00', '17:00-18:00', '18:00-19:00', '19:00-20:00', '20:00-21:00'],
    693. 

  693.             axisTick: {
    694. 

  694.                 alignWithLabel: true
    695. 

  695.             },
    696. 

  696. 			axisLine: {
    697. 

  697. 					show: true,
    698. 

  698. 					lineStyle: {
    699. 

  699. 								type: 'solid',
    700. 

  700. 								color: '#4865e3',//左边线的颜色
    701. 

  701. 								width:'1'//坐标线的宽度
    702. 

  702. 					}
    703. 

  703. 			},
    704. 

  704. 			axisLabel: {
    705. 

  705. 				textStyle: {
    706. 

  706.                 color: '#ccf5f9',
    707. 

  707. 				
    708. 

  708. 				},
    709. 

  709. 				
    710. 

  710. 			}
    711. 

  711. 			
    712. 

  712.         },
    713. 

  713.     yAxis :{
    714. 

  714.             type : 'value',
    715. 

  715. 			scale: true,
    716. 

  716. 			axisLine: {
    717. 

  717. 					show: true,
    718. 

  718. 					lineStyle: {
    719. 

  719. 								type: 'solid',
    720. 

  720. 								color: '#4865e3',//左边线的颜色
    721. 

  721. 								width:'1'//坐标线的宽度
    722. 

  722. 					}
    723. 

  723. 			},
    724. 

  724. 			splitLine:{
    725. 

  725. 				lineStyle: {
    726. 

  726. 						type: 'solid',
    727. 

  727. 						color: 'rgba(72,101,227,0.7)',
    728. 

  728. 						width:'1'
    729. 

  729. 				}
    730. 

  730. 			},
    731. 

  731. 			axisLabel: {
    732. 

  732. 				textStyle: {
    733. 

  733.                 color: '#ccf5f9',
    734. 

  734. 				
    735. 

  735. 				},
    736. 

  736. 				
    737. 

  737. 			}
    738. 

  738.         },
    739. 

  739. 	dataZoom: [{
    740. 

  740. 				type: 'inside',
    741. 

  741. 				start: 0,
    742. 

  742. 				end: 20
    743. 

  743. 			}],
    744. 

  744.     series : [
    745. 

  745.         {
    746. 

  746.             name:"外出人数",
    747. 

  747.             type:'bar',
    748. 

  748.             barWidth: '30%',
    749. 

  749.             data:[45,56, 66,58,32,15,45,65,31,25,45,36,25],
    750. 

  750. 			itemStyle: {
    751. 

  751. 		        normal: {
    752. 

  752. 		        
    753. 

  753. 				label: {
    754. 

  754. 						show: true, //开启显示
    755. 

  755. 						position: 'top', //在上方显示
    756. 

  756. 						textStyle: { //数值样式
    757. 

  757. 								color: '#ccf5f9',
    758. 

  758. 								fontSize: 12
    759. 

  759. 							},
    760. 

  760. 						formatter: '{c}'
    761. 

  761. 						},
    762. 

  762. 						
    763. 

  763. 		         }
    764. 

  764. 		    },
    765. 

  765.         },
    766. 

  766. 		{
    767. 

  767.             name:"进入人数",
    768. 

  768.             type:'bar',
    769. 

  769.             barWidth: '30%',
    770. 

  770.             data:[56, 64,48,56,48,74,55,69,65,32,46,64,45],
    771. 

  771. 			itemStyle: {
    772. 

  772. 		        normal: {		
    773. 

  773. 				label: {
    774. 

  774. 						show: true, //开启显示
    775. 

  775. 						position: 'top', //在上方显示
    776. 

  776. 						textStyle: { //数值样式
    777. 

  777. 								color: '#ccf5f9',
    778. 

  778. 								fontSize: 12
    779. 

  779. 							},
    780. 

  780. 						formatter: '{c}'
    781. 

  781. 						}
    782. 

  782. 		         }
    783. 

  783. 		    },
    784. 

  784.         }
    785. 

  785.     ]
    786. 

  786. };
    787. 

  787. //实时曲线
    788. 

  788. var x_data = [['00:00','01:00','02:00','03:00','04:00','05:00'],['06:00','07:00','08:00','09:00','10:00','11:00'],['12:00','13:00','14:00','15:00','16:00','17:00'],['18:00','19:00','20:00','21:00','22:00','23:00']];
    789. 

  789. option_ssqx = {
    790. 

  790. 	 
    791. 

  791. 	tooltip: {
    792. 

  792.         trigger: 'axis',
    793. 

  793. 		formatter: "{a} <br/>{c} {b}"
    794. 

  794.             
    795. 

  795.     },
    796. 

  796. 	color:['#ef1a0f','#0fc6ef'],
    797. 

  797. 	legend: {
    798. 

  798.         data:['温度','湿度'],
    799. 

  799. 		selectedMode: 'single',
    800. 

  800. 		textStyle:{
    801. 

  801. 			color:"#fff",
    802. 

  802. 			fontSize:14
    803. 

  803. 		},
    804. 

  804. 		top:10,
    805. 

  805. 		selected:{
    806. 

  806.               '温度':true,
    807. 

  807.               '湿度':false
    808. 

  808.           }
    809. 

  809.     },
    810. 

  810. 	grid:{
    811. 

  811.             x:"10%",
    812. 

  812.             y:"10%",
    813. 

  813.             x2:"10%",
    814. 

  814.             y2:"10%",
    815. 

  815.                   
    816. 

  816.     },
    817. 

  817.     xAxis: {
    818. 

  818.         type: 'category',
    819. 

  819.         data: x_data[0],
    820. 

  820. 		axisLine: {
    821. 

  821.             show: true,
    822. 

  822. 			lineStyle: {
    823. 

  823.                         type: 'solid',
    824. 

  824.                         color: '#69F8FE',//左边线的颜色
    825. 

  825.                         width:'1'//坐标线的宽度
    826. 

  826.                 }
    827. 

  827.         },
    828. 

  828. 		axisTick:{
    829. 

  829. 			alignWithLabel:true
    830. 

  830. 		}
    831. 

  831.     },
    832. 

  832.     yAxis: {
    833. 

  833.         type: 'value',
    834. 

  834. 		boundaryGap: ['20%', '20%'],
    835. 

  835. 		max: function(value) {
    836. 

  836. 			return value.max + 20;
    837. 

  837. 		},
    838. 

  838. 		axisLine: {
    839. 

  839.             show: true,
    840. 

  840. 			lineStyle: {
    841. 

  841.                         type: 'solid',
    842. 

  842.                         color: '#69F8FE',//左边线的颜色
    843. 

  843.                         width:'1'//坐标线的宽度
    844. 

  844.                 }
    845. 

  845.         },
    846. 

  846. 		splitLine:{
    847. 

  847. 			lineStyle: {
    848. 

  848.                         type: 'solid',
    849. 

  849.                         color: '#69F8FE',//左边线的颜色
    850. 

  850.                         width:'1'//坐标线的宽度
    851. 

  851.                 }
    852. 

  852. 		}
    853. 

  853.     },
    854. 

  854.     series: [
    855. 

  855. 		{
    856. 

  856.             name:'温度',
    857. 

  857.             type:'line',
    858. 

  858.             
    859. 

  859. 			smooth: true,
    860. 

  860.             data:[],
    861. 

  861. 			
    862. 

  862.             lineStyle:{ 
    863. 

  863. 				normal:{
    864. 

  864.                     color:'#ef1a0f'  
    865. 

  865. 				}
    866. 

  866.             } 
    867. 

  867.                                 
    868. 

  868.         },
    869. 

  869. 		{
    870. 

  870.             name:'湿度',
    871. 

  871.             type:'line',
    872. 

  872.            
    873. 

  873. 			smooth: true,
    874. 

  874.             data:[ ],
    875. 

  875.             lineStyle:{ 
    876. 

  876. 				normal:{
    877. 

  877.                     color:'#0fc6ef'  
    878. 

  878. 				}
    879. 

  879.             } 
    880. 

  880.                                 
    881. 

  881.         }
    882. 

  882.     ]
    883. 

  883. };
    884. 

  884. if (option_snhjsj && typeof option_snhjsj === "object") {
    885. 

  885. 	
    886. 

  886.     myChart_snhjsj.setOption(option_snhjsj, true);
    887. 

  887. }
    888. 

  888. 

  889. if (option_ssqx && typeof option_ssqx === "object") {
    890. 

  890.     myChart_ssqx.setOption(option_ssqx, true);
    891. 

  891. }
    892. 

  892. 

  893. 	//s实时曲线自动切换
    894. 

  894. 	var j = 0;//当前显示曲线
    895. 

  895. 	
    896. 

  896. 	function changeSsqx(){
    897. 

  897. 		var selectLine = {};
    898. 

  898. 		var ssqx_option = option_ssqx;
    899. 

  899. 		var nums = ssqx_option.legend.data.length;
    900. 

  900. 		++j;
    901. 

  901. 		  if(j == nums){
    902. 

  902. 			j = 0;
    903. 

  903. 		  };
    904. 

  904. 		for(var i=0;i<nums;i++){    //legend中data的值，上面是写死的值，做自动切换时不要写死
    905. 

  905.           if(j==i){
    906. 

  906.             selectLine[ssqx_option.legend.data[i]] = true;
    907. 

  907.           }else{
    908. 

  908.             selectLine[ssqx_option.legend.data[i]] = false;
    909. 

  909.           }
    910. 

  910. 		  }
    911. 

  911. 		  
    912. 

  912. 		  myChart_ssqx.clear();
    913. 

  913. 		  ssqx_option.legend.selected = selectLine;
    914. 

  914. 	
    915. 

  915. 		  //ssqx_option.xAxis.data = x_data[j];
    916. 

  916. 		  myChart_ssqx.setOption(ssqx_option, true);
    917. 

  917.         
    918. 

  918. 	}
    919. 

  919. 	myChart_ssqx.on("legendselectchanged", obj => {
    920. 

  920.         
    921. 

  921. 		var nums = option_ssqx.legend.data.length;
    922. 

  922. 		for(var i=0;i<nums;i++){    // this.legendData是legend中data的值，上面是写死的值，做自动切换时不要写死
    923. 

  923.           if(obj.name==option_ssqx.legend.data[i]){
    924. 

  924.             j=i;
    925. 

  925.           }
    926. 

  926. 		}
    927. 

  927. 		
    928. 

  928. 	});
    929. 

  929. 	var t1 = window.setInterval("changeSsqx()",4000);
    930. 

  930. 	$('#chart-ssqx').mouseover(function(){
    931. 

  931. 		window.clearInterval(t1);//去掉定时器
    932. 

  932. 	})
    933. 

  933. 	$('#chart-ssqx').mouseout(function(){
    934. 

  934. 		t1 = window.setInterval("changeSsqx()",4000);
    935. 

  935. 	})
    936. 

  936. 	
    937. 

  937. 	//首页数据配置
    938. 

  938. 	var indexDataSetParam = {
    939. 

  939. 		id:3
    940. 

  940. 	};
    941. 

  941. 	var indexDataSetUrl = "/publics/sysconf/get";
    942. 

  942. 	getData(indexDataSetUrl,indexDataSetParam).then(res => {
    943. 

  943. 		var data = JSON.parse(res.conf.data);
    944. 

  944. 		var len = data.length;
    945. 

  945. 		for(var i=0;i<len;++i){
    946. 

  946. 			$('.brief>.line2 .item').eq(i).find(".title").text(data[i].key+"：");
    947. 

  947. 			$('.brief>.line2 .item').eq(i).find(".number").text(data[i].val);
    948. 

  948. 		}
    949. 

  949. 	})
    950. 

  950. 	
    951. 

  951. 	//工作看板
    952. 

  952. 	var warkDataSetParam = {
    953. 

  953. 		id:30002
    954. 

  954. 	};
    955. 

  955. 	getData(indexDataSetUrl,warkDataSetParam).then(res => {
    956. 

  956. 		var data = JSON.parse(res.conf.data);
    957. 

  957. 		var len = data.length;
    958. 

  958. 		for(var i=0;i<len;++i){
    959. 

  959. 			$('.right2 .item').eq(i).find(".title").text(data[i].key);
    960. 

  960. 			$('.right2 .item').eq(i).find(".num").text(data[i].val);
    961. 

  961. 		}
    962. 

  962. 	})
    963. 

  963. 	
    964. 

  964. 	
    965. 

  965. 	//行业新闻
    966. 

  966. 	var newsDataSetParam = {
    967. 

  967. 		id:30003
    968. 

  968. 	};
    969. 

  969. 	getData(indexDataSetUrl,newsDataSetParam).then(res => {
    970. 

  970. 		var data = JSON.parse(res.conf.data);
    971. 

  971. 		var len = data.length;
    972. 

  972. 		var html = "";
    973. 

  973. 		for(var i=0;i<len;++i){
    974. 

  974. 			html+='<div class="news-item"><div class="news-title">'+data[i].key+'</div><div class="news-content">'+data[i].val+'</div></div>'
    975. 

  975. 			
    976. 

  976. 		}
    977. 

  977. 		$("#news-list").html(html);
    978. 

  978. 	})
    979. 

  979. 	
    980. 

  980. 	//报警信息
    981. 

  981. 	var alarmParam = {
    982. 

  982. 		limit:20
    983. 

  983. 	};
    984. 

  984. 	
    985. 

  985. 	var alarmUrl = "/analyse/hm/device/warning-list";
    986. 

  986. 	getData(alarmUrl,alarmParam,"GET").then(res => {
    987. 

  987. 		//console.log(res)
    988. 

  988. 		var data =res;
    989. 

  989. 		var len = data.length;
    990. 

  990. 		var html = "";
    991. 

  991. 		for(var i=0;i<len;++i){
    992. 

  992. 			html+='<div class="msg"><img src="images/warning.png" />'+data[i].message+'</div>'
    993. 

  993. 			
    994. 

  994. 		}
    995. 

  995. 		$("#alarmList").html(html);
    996. 

  996. 	})
    997. 

  997. 	
    998. 

  998. 	//区域信息
    999. 

  999. 	var areaParam = {
    1000. 

  1000. 		code:"area-info",
    1001. 

  1001. 		hasSub:true
    1002. 

  1002. 	};
    1003. 

  1003. 	
    1004. 

  1004. 	var areaUrl = "/publics/treenode/getTreeByCode";
    1005. 

  1005. 	
    1006. 

  1006. 	var getTempUrl = "/device/device-mount-point/get-by-areaId";
    1007. 

  1007. 	var hasTempArr = [2,5,6,8,13,21,24,26,33,39,42,59,60,63,64];
    1008. 

  1008. 	var hasVideoArr = [1,2,4,5,10,11,13,14,21,24,26,33,34,42,45,46,47,48];
    1009. 

  1009. 	//获取某个区域当前温湿度
    1010. 

  1010. 	//areaId
    1011. 

  1011. 	//n：地图上的索引
    1012. 

  1012. 	//t:下方滚动的位置索引
    1013. 

  1013. 	function getDevice(areaId,n,i=0){
    1014. 

  1014. 		var getdeviceParam = {
    1015. 

  1015. 			areaId:areaId,
    1016. 

  1016. 			
    1017. 

  1017. 		};
    1018. 

  1018. 		
    1019. 

  1019. 		var getdeviceUrl = "/device/device-mount-point/get-by-areaId";
    1020. 

  1020. 		getData(getdeviceUrl,getdeviceParam,"GET").then(res => {
    1021. 

  1021. 			//console.log(i,res)
    1022. 

  1022. 			console.log(n,res)
    1023. 

  1023. 			var r = res.length;
    1024. 

  1024. 			//if(hasTempArr.indexOf(n)>=0){
    1025. 

  1025. 				for(var j = 0;j<r;++j){
    1026. 

  1026. 					
    1027. 

  1027. 					if((res[j].categoryId=="738712669431533568" || res[j].categoryId=="738712714163785728" )&& res[j].data!=undefined){
    1028. 

  1028. 						//监测设备
    1029. 

  1029. 						
    1030. 

  1030. 						$(".single .list li.buildEnv-"+i+" .temp").text(res[j].data.temperature)
    1031. 

  1031. 						$(".single .list li.buildEnv-"+i+" .humi").text(res[j].data.humidity)
    1032. 

  1032. 						$(".single .list li.buildEnv-"+i).attr("device-id",res[j].deviceId);
    1033. 

  1033. 						return;
    1034. 

  1034. 					}
    1035. 

  1035. 				}
    1036. 

  1036. 			//}			
    1037. 

  1037. 		})
    1038. 

  1038. 	}
    1039. 

  1039. 	function getVideoDevice(areaId,n){
    1040. 

  1040. 		var getdeviceParam = {
    1041. 

  1041. 			areaId:areaId,
    1042. 

  1042. 			
    1043. 

  1043. 		};
    1044. 

  1044. 		
    1045. 

  1045. 		var getdeviceUrl = "/device/device/listByAreaId";
    1046. 

  1046. 		getData(getdeviceUrl,getdeviceParam,"GET").then(res => {
    1047. 

  1047. 			//console.log(i,res)
    1048. 

  1048. 			console.log(n,res)
    1049. 

  1049. 			var r = res.length;
    1050. 

  1050. 			//if(hasTempArr.indexOf(n)>=0){
    1051. 

  1051. 				for(var j = 0;j<r;++j){
    1052. 

  1052. 					if(res[j].categoryId=="738713612176855040"){
    1053. 

  1053. 						//监控设备
    1054. 

  1054. 						$("#buildmap area").eq(n).attr("channel-data",res[j].meta.channel);
    1055. 

  1055. 						return;
    1056. 

  1056. 						
    1057. 

  1057. 					}
    1058. 

  1058. 					
    1059. 

  1059. 				}
    1060. 

  1060. 			//}			
    1061. 

  1061. 		})
    1062. 

  1062. 	}
    1063. 

  1063. 	
    1064. 

  1064. 	getData(areaUrl,areaParam).then(res => {
    1065. 

  1065. 		//console.log(res)
    1066. 

  1066. 		var buildinfo = res.childs;
    1067. 

  1067. 		var areaLen = buildinfo.length;
    1068. 

  1068. 		var h = "";
    1069. 

  1069. 		var t = 0;
    1070. 

  1070. 		for(var i=0;i<areaLen;++i){	
    1071. 

  1071. 			var k=0;//k表示area标签的索引
    1072. 

  1072. 			if(buildinfo[i].nodeName=="1牧区"){
    1073. 

  1073. 				k=0;
    1074. 

  1074. 			}else if(buildinfo[i].nodeName=="2牧区"){
    1075. 

  1075. 				k=10;
    1076. 

  1076. 			}else if(buildinfo[i].nodeName=="3牧区"){
    1077. 

  1077. 				k=20;
    1078. 

  1078. 			}else if(buildinfo[i].nodeName=="4牧区"){
    1079. 

  1079. 				k=33;
    1080. 

  1080. 			}else if(buildinfo[i].nodeName=="5牧区"){
    1081. 

  1081. 				k=41;
    1082. 

  1082. 			}else if(buildinfo[i].nodeName=="新区保育"){
    1083. 

  1083. 				k=47;
    1084. 

  1084. 			}else if(buildinfo[i].nodeName=="天地猪舍"){
    1085. 

  1085. 				/*$("#buildmap area").eq(49).attr("title",buildinfo[i].nodeName)
    1086. 

  1086. 				$("#buildmap area").eq(49).attr("data-nodeId",buildinfo[i].id)
    1087. 

  1087. 				h+='<li class="buildEnv-'+t+'" build-index="'+t+'">'
    1088. 

  1088. 				h+='<div class="leftbar"><div class="room_num">'+buildinfo[i].nodeName+'</div></div>'
    1089. 

  1089. 				h+='<div class="cont"><div class="line"><img src="images/temp-1.png" alt="">温度：<span class="temp">0</span>℃</div>'
    1090. 

  1090. 				h+='<div class="line"><img src="images/humidity.png" alt="">湿度：<span class="humi">0</span>RH</div></div></li>'
    1091. 

  1091. 				//获取当前温湿度
    1092. 

  1092. 				//
    1093. 

  1093. 				getDevice(buildinfo[i].id,49,t)
    1094. 

  1094. 				++t;*/
    1095. 

  1095. 				continue;
    1096. 

  1096. 			}else{
    1097. 

  1097. 				continue;
    1098. 

  1098. 			}
    1099. 

  1099. 			var l = buildinfo[i].childs.length;
    1100. 

  1100. 			
    1101. 

  1101. 			for(var j=0;j<l;++j){
    1102. 

  1102. 				var n = k+j;
    1103. 

  1103. 				if(k==0 && n>=10) break;//特殊处理
    1104. 

  1104. 				if(k==10 && n>=20) break;//特殊处理
    1105. 

  1105. 				if(k==20 && n>=33) break;//特殊处理
    1106. 

  1106. 				if(k==33 && n>=41) break;//特殊处理
    1107. 

  1107. 				$("#buildmap area").eq(n).attr("title",buildinfo[i].childs[j].nodeName)
    1108. 

  1108. 				$("#buildmap area").eq(n).attr("data-nodeId",buildinfo[i].childs[j].id)
    1109. 

  1109. 				if(hasTempArr.indexOf(n)>=0){
    1110. 

  1110. 					console.log(n)
    1111. 

  1111. 					h+='<li class="buildEnv-'+t+'" build-index="'+t+'">'
    1112. 

  1112. 					h+='<div class="leftbar"><div class="room_num">'+buildinfo[i].childs[j].nodeName+'</div></div>'
    1113. 

  1113. 					h+='<div class="cont"><div class="line"><img src="images/temp-1.png" alt="">温度：<span class="temp">0</span>℃</div>'
    1114. 

  1114. 					h+='<div class="line"><img src="images/humidity.png" alt="">湿度：<span class="humi">0</span>RH</div></div></li>';
    1115. 

  1115. 					console.log('我的',buildinfo[i].childs[j])
    1116. 

  1116. 					getDevice(buildinfo[i].childs[j].id,n,t)
    1117. 

  1117. 					//下方的轮播自增
    1118. 

  1118. 					++t;
    1119. 

  1119. 					//console.log(buildinfo[i].childs[j].nodeName)
    1120. 

  1120. 				}
    1121. 

  1121. 				if(hasVideoArr.indexOf(n)>=0){
    1122. 

  1122. 					getVideoDevice(buildinfo[i].childs[j].id,n)
    1123. 

  1123. 					//下方的轮播自增
    1124. 

  1124. 					
    1125. 

  1125. 				}
    1126. 

  1126. 			}
    1127. 

  1127. 		}
    1128. 

  1128. 		$(".single .list").html(h);
    1129. 

  1129. 		var single = $('.single').mySingleScroll({
    1130. 

  1130.                 speed: 2000
    1131. 

  1131.         });
    1132. 

  1132. 	})
    1133. 

  1133. </script>
    1134. 

  1134. 	<script src="js/scrollBar.js" type="text/javascript"></script>
    1135. 

  1135. 	<script>
    1136. 

  1136. 		$('.warning-msg').scrollBar({
    1137. 

  1137. 		barWidth: 5, //滚动条的宽度(这里根据需要写数值即可，不设置是10,即默认10px)
    1138. 

  1138. 		position: "y", //写“x”代表只出水平滚动条，写“y”表示只出垂直滚动条，写“x,y”则出水平和垂直滚动条（只有在内容超出容器时才出现滚动条）
    1139. 

  1139. 		wheelDis: 24 //滚轮滚动一次向下或向上滚动的距离，默认是15，可根据需要修改数值
    1140. 

  1140. 		})
    1141. 

  1141. 		$('#news-list').scrollBar({
    1142. 

  1142. 		barWidth: 5, //滚动条的宽度(这里根据需要写数值即可，不设置是10,即默认10px)
    1143. 

  1143. 		position: "y", //写“x”代表只出水平滚动条，写“y”表示只出垂直滚动条，写“x,y”则出水平和垂直滚动条（只有在内容超出容器时才出现滚动条）
    1144. 

  1144. 		wheelDis: 24 //滚轮滚动一次向下或向上滚动的距离，默认是15，可根据需要修改数值
    1145. 

  1145. 		})
    1146. 

  1146. 		
    1147. 

  1147. 

  1148. 		
    1149. 

  1149. 	</script>
    1150. 

  1150.   <script type="text/javascript" src="js/index.js"></script>
    1151. 

  1151. <body>
    1152. 

  1152. </html>
    1153.