Startseite Erkunden Hilfe
Registrieren Anmelden
zhoufan
/
SQ12345_Web
Beobachten 1
Favorit hinzufügen 0
Fork 0
Code Issues 0 Pull-Requests 0 Commits 522 Releases 0 Wiki
Quellcode durchsuchen

no message

zhengbingbing vor 6 Jahren
Ursprung
5909ce83b4
Commit
697c25243f
2 geänderte Dateien mit 1473 neuen und 0 gelöschten Zeilen
Geteilte Ansicht Diff-Statistik anzeigen
  1. 722 0
      WebChart/index_20190702.html
  2. 751 0
      WebChart/js/index_20190701.js

+ 722 - 0
WebChart/index_20190702.html
Datei anzeigen 

@@ -0,0 +1,722 @@
1 
+<!DOCTYPE html>
2 
+<html>
3 
+
4 
+	<head>
5 
+		<meta charset="utf-8" />
6 
+		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
7 
+		<!--优先使用 IE 最新版本和 Chrome-->
8 
+		<meta name="renderer" content="webkit" />
9 
+		<script src="Script/Common/huayi.load.js"></script>
10 
+		<script src="Script/Common/huayi.config.js"></script>
11 
+		<link rel="stylesheet" href="css/swiper.min.css" />
12 
+		<link rel="stylesheet" href="css/animate.min.css" />
13 
+		<link rel="stylesheet" href="plugins/numbergd/globle.css" />
14 
+		<link rel="stylesheet" href="css/index.css" />
15 
+		<title>大数据首页</title>
16 
+		<style>
17 
+			.trafficVolume .orderCon_right>div{
18 
+				height: auto;
19 
+			}
20 
+			.trafficVolume .orderCon_right{
21 
+				position: relative;
22 
+			}
23 
+			.time_box{
24 
+				position: absolute;
25 
+			    right: -10px;
26 
+			    top: 125px;
27 
+			}
28 
+			.time_box_four{
29 
+				right: 180px;
30 
+			    top: 120px;
31 
+			    z-index: 1;
32 
+			}
33 
+			.time_box_leftTh{
34 
+				left: 180px;
35 
+			    top: 120px;
36 
+			    z-index: 1;
37 
+			}
38 
+			.time_box:before {
39 
+			    position: absolute;
40 
+			    right: 12px;
41 
+			    top: 7px;
42 
+			    z-index: 9999999;
43 
+			    content: "";
44 
+			    height: 0;
45 
+			    width: 0;
46 
+			    border:none;
47 
+			    /* border-right: 7px solid transparent; */
48 
+			    /* border-left: 7px solid transparent; */
49 
+			}
50 
+			.depart{
51 
+				height: 26px;
52 
+				line-height: 26px;
53 
+			}
54 
+		</style>
55 
+	</head>
56 
+
57 
+	<body>
58 
+		<!--导航栏开始-->
59 
+		<div id="nav" class="clearfix">
60 
+			<div class="nav_left"><img src="img/nav_l.png" alt="" /></div>
61 
+			<div class="nav_middle">
62 
+				<ul class="clearfix">
63 
+					<li>
64 
+						<a href="./sourceChannel.html"><img src="img/lyqd_0.png" alt="" /></a>
65 
+					</li>
66 
+					<li>
67 
+						<a href="./receiptDepartment.html"><img src="img/jdbm_0.png" alt="" /></a>
68 
+					</li>
69 
+					<li>
70 
+						<a href="javaScript:;"><img src="img/title.png" alt="" /></a>
71 
+					</li>
72 
+					<li>
73 
+						<a href="./TelephoneDetails.html"><img src="img/hwsl_0.png" alt="" /></a>
74 
+					</li>
75 
+					<li>
76 
+						<a href="./complaintsReport.html"><img src="img/tsjb_0.png" alt="" /></a>
77 
+					</li>
78 
+				</ul>
79 
+
80 
+			</div>
81 
+			<div class="nav_right"><img src="img/nav_r.png" alt="" /></div>
82 
+		</div>
83 
+		<!--导航栏结束-->
84 
+		<div id="wrap">
85 
+			<div class="swiper-container">
86 
+
87 
+				<div class="swiper-wrapper">
88 
+					<!--第一屏-->
89 
+					<div class="swiper-slide">
90 
+						<div class="orderStatistic slideCon_bg clearfix">
91 
+							<p class="slide_title slide_title1"></p>
92 
+							<div class="orderCon_left slide_left">
93 
+								<ul>
94 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
95 
+									<li>
96 
+										<img src="img/num_icon.png" alt="" />
97 
+										<p class="num_word">
98 
+											<span>受理量</span></br>
99 
+											<span></span>
100 
+											<span>118710</span>
101 
+										</p>
102 
+									</li>
103 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
104 
+									<li>
105 
+										<img src="img/num_icon.png" alt="" />
106 
+										<p class="num_word">
107 
+											<span>结案量</span></br>
108 
+											<span></span>
109 
+											<span>116704</span>
110 
+										</p>
111 
+									</li>
112 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
113 
+									<li>
114 
+										<img src="img/num_icon.png" alt="" />
115 
+										<p class="num_word">
116 
+											<span>结案率</span></br>
117 
+											<span></span>
118 
+											<span>98.31%</span>
119 
+										</p>
120 
+									</li>
121 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
122 
+									<li>
123 
+										<img src="img/num_icon.png" alt="" />
124 
+										<p class="num_word">
125 
+											<span>满意度</span></br>
126 
+											<span></span>
127 
+											<span>89.63%</span>
128 
+										</p>
129 
+									</li>
130 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
131 
+								</ul>
132 
+							</div>
133 
+							<div class="orderCon_middle slide_middle_first">
134 
+								<div class="map_bg">
135 
+									<div id="radarBox" class="ani" swiper-animate-effect="OutOpcity" swiper-animate-duration="infinite" swiper-animate-delay="3s">
136 
+										<div class="radar">
137 
+											<div class="radar_inner"></div>
138 
+										</div>
139 
+									</div>
140 
+									<div class="quanbgBox quan_SYQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
141 
+										<div class="quanbg">
142 
+											<span class="quan quan1 quan1a "></span>
143 
+											<span class="quan quan2 quan2a "></span>
144 
+											<span class="quan quan3 quan3a "></span>
145 
+											<span class="quan quan4"></span>
146 
+											<span class="quan quan1 quan1b "></span>
147 
+											<span class="quan quan2 quan2b "></span>
148 
+											<span class="quan quan3 quan3b "></span>
149 
+										</div>
150 
+										<span class="txt txt_SYQ">睢阳区</br>5174</span>
151 
+									</div>
152 
+									<div class="quanbgBox quan_MQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
153 
+										<div class="quanbg">
154 
+											<span class="quan quan1 quan1a "></span>
155 
+											<span class="quan quan2 quan2a "></span>
156 
+											<span class="quan quan3 quan3a "></span>
157 
+											<span class="quan quan4"></span>
158 
+											<span class="quan quan1 quan1b "></span>
159 
+											<span class="quan quan2 quan2b "></span>
160 
+											<span class="quan quan3 quan3b "></span>
161 
+										</div>
162 
+										<span class="txt txt_MQ">民权县</br>7634</span>
163 
+									</div>
164 
+									<div class="quanbgBox quan_SX ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
165 
+										<div class="quanbg">
166 
+											<span class="quan quan1 quan1a "></span>
167 
+											<span class="quan quan2 quan2a "></span>
168 
+											<span class="quan quan3 quan3a "></span>
169 
+											<span class="quan quan4"></span>
170 
+											<span class="quan quan1 quan1b "></span>
171 
+											<span class="quan quan2 quan2b "></span>
172 
+											<span class="quan quan3 quan3b "></span>
173 
+										</div>
174 
+										<span class="txt txt_SX">睢县</br>2285</span>
175 
+									</div>
176 
+									<div class="quanbgBox quan_NL ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
177 
+										<div class="quanbg">
178 
+											<span class="quan quan1 quan1a "></span>
179 
+											<span class="quan quan2 quan2a "></span>
180 
+											<span class="quan quan3 quan3a "></span>
181 
+											<span class="quan quan4"></span>
182 
+											<span class="quan quan1 quan1b "></span>
183 
+											<span class="quan quan2 quan2b "></span>
184 
+											<span class="quan quan3 quan3b "></span>
185 
+										</div>
186 
+										<span class="txt txt_NL">宁陵县</br>681</span>
187 
+									</div>
188 
+									<div class="quanbgBox quan_LYQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
189 
+										<div class="quanbg">
190 
+											<span class="quan quan1 quan1a "></span>
191 
+											<span class="quan quan2 quan2a "></span>
192 
+											<span class="quan quan3 quan3a "></span>
193 
+											<span class="quan quan4"></span>
194 
+											<span class="quan quan1 quan1b "></span>
195 
+											<span class="quan quan2 quan2b "></span>
196 
+											<span class="quan quan3 quan3b "></span>
197 
+										</div>
198 
+										<span class="txt txt_LYQ">梁园区</br>4253</span>
199 
+									</div>
200 
+									<div class="quanbgBox quan_KFQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
201 
+										<div class="quanbg">
202 
+											<span class="quan quan1 quan1a "></span>
203 
+											<span class="quan quan2 quan2a "></span>
204 
+											<span class="quan quan3 quan3a "></span>
205 
+											<span class="quan quan4"></span>
206 
+											<span class="quan quan1 quan1b "></span>
207 
+											<span class="quan quan2 quan2b "></span>
208 
+											<span class="quan quan3 quan3b "></span>
209 
+										</div>
210 
+										<span class="txt txt_KFQ">示范区</br>2773</span>
211 
+									</div>
212 
+									<div class="quanbgBox quan_ZC ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
213 
+										<div class="quanbg">
214 
+											<span class="quan quan1 quan1a "></span>
215 
+											<span class="quan quan2 quan2a "></span>
216 
+											<span class="quan quan3 quan3a "></span>
217 
+											<span class="quan quan4"></span>
218 
+											<span class="quan quan1 quan1b "></span>
219 
+											<span class="quan quan2 quan2b "></span>
220 
+											<span class="quan quan3 quan3b "></span>
221 
+										</div>
222 
+										<span class="txt txt_ZC">柘城县</br>3141</span>
223 
+									</div>
224 
+									<div class="quanbgBox quan_YCX ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
225 
+										<div class="quanbg">
226 
+											<span class="quan quan1 quan1a "></span>
227 
+											<span class="quan quan2 quan2a "></span>
228 
+											<span class="quan quan3 quan3a "></span>
229 
+											<span class="quan quan4"></span>
230 
+											<span class="quan quan1 quan1b "></span>
231 
+											<span class="quan quan2 quan2b "></span>
232 
+											<span class="quan quan3 quan3b "></span>
233 
+										</div>
234 
+										<span class="txt txt_YCX">虞城县</br>5452</span>
235 
+									</div>
236 
+									<div class="quanbgBox quan_XYX ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
237 
+										<div class="quanbg">
238 
+											<span class="quan quan1 quan1a "></span>
239 
+											<span class="quan quan2 quan2a "></span>
240 
+											<span class="quan quan3 quan3a "></span>
241 
+											<span class="quan quan4"></span>
242 
+											<span class="quan quan1 quan1b "></span>
243 
+											<span class="quan quan2 quan2b "></span>
244 
+											<span class="quan quan3 quan3b "></span>
245 
+										</div>
246 
+										<span class="txt txt_XYX">夏邑县</br>3735</span>
247 
+									</div>
248 
+									<!--<div class="quanbgBox quan_YCS ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
249 
+										<div class="quanbg">
250 
+											<span class="quan quan1 quan1a "></span>
251 
+											<span class="quan quan2 quan2a "></span>
252 
+											<span class="quan quan3 quan3a "></span>
253 
+											<span class="quan quan4"></span>
254 
+											<span class="quan quan1 quan1b "></span>
255 
+											<span class="quan quan2 quan2b "></span>
256 
+											<span class="quan quan3 quan3b "></span>
257 
+										</div>
258 
+										<span class="txt txt_YCS">永城市</span>
259 
+									</div>-->
260 
+								</div>
261 
+							</div>
262 
+
263 
+						</div>
264 
+					</div>
265 
+
266 
+					<!--第二屏  工单渠道来源-->
267 
+					<div class="swiper-slide">
268 
+						<div class="orderSource slideCon_bg clearfix">
269 
+							<div class="timeWrap lasttimeWrap timeWrapPosi">
270 
+							<div class="time_box pull-right form-inline time_box_leftTh">
271 
+								时间选择：
272 
+								<input type="text" id="time3" class="times" />
273 
+							</div>
274 
+								<div class="time_box pull-right form-inline time_box_four">
275 
+									地区选择：
276 
+									<select class="areaTwo selects" style="height: 30px;"></select>
277 
+								</div>
278 
+							</div>
279 
+							<p class="slide_title slide_title2"></p>
280 
+							<div class="source_left slide_left">
281 
+								<ul>
282 
+									<li class="clearfix">
283 
+										<!--<div class="source_kuang rectangle">
284 
+											<div class="pbout">
285 
+												<div class="percent_box">
286 
+												<div class="percent_out"></div>
287 
+											   <div class="percent_in"></div>
288 
+											   <div class="percent_word">
289 
+											   	   	<p>180</p>%
290 
+													<p style="margin-top: 16px;">占总量</p>
291 
+											   </div>
292 
+											</div>
293 
+											</div>
294 
+											<p class="num_word">
295 
+												<span>电话</span><span>2666</span>
296 
+											</p>
297 
+
298 
+										</div>-->
299 
+										<div class="line_wrap one_line line oneLeft_line"></div>
300 
+									</li>
301 
+									<li class="clearfix">
302 
+
303 
+										<div class="line_wrap line two_line twoLeft_line"></div>
304 
+									</li>
305 
+									<li class="clearfix">
306 
+										<div class="line_wrap line three_line threeLeft_line"></div>
307 
+
308 
+
309 
+									</li>
310 
+									<li class="clearfix">
311 
+										<div class="line_wrap line four_line fourLeft_line"></div>
312 
+									</li>
313 
+								</ul>
314 
+							</div>
315 
+							<div class="source_middle slide_middle">
316 
+								<div class="map_bg">
317 
+
318 
+								</div>
319 
+							</div>
320 
+							<div class="source_right slide_right">
321 
+								<ul>
322 
+									<li class="clearfix">
323 
+										<div class="line_wrap one_line line oneRight_line"></div>
324 
+
325 
+									</li>
326 
+									<li class="clearfix">
327 
+										<div class="line_wrap line two_line twoRight_line"></div>
328 
+
329 
+									</li>
330 
+									<li class="clearfix">
331 
+										<div class="line_wrap line three_line threeRight_line"></div>
332 
+									</li>
333 
+									<li class="clearfix">
334 
+										<div class="line_wrap line four_line fourRight_line">
335 
+										</div>
336 
+									</li>
337 
+								</ul>
338 
+							</div>
339 
+						</div>
340 
+					</div>
341 
+
342 
+					<!--第三屏  工单类型-->
343 
+					<div class="swiper-slide">
344 
+						<div class="slideCon_bg orderType clearfix">
345 
+							<div class="timeWrap lasttimeWrap timeWrapPosi">
346 
+								<div class="time_box pull-right form-inline time_box_four">
347 
+									地区选择：
348 
+									<select class="areaThree selects" style="height: 30px;"></select>
349 
+								</div>
350 
+							</div>
351 
+							<p class="slide_title slide_title3"></p>
352 
+							<div class="orderTtype_Con">
353 
+								<ul class="clearfix">
354 
+									<li class="active">
355 
+										<div class="typeWord">咨询</div>
356 
+										<img src="img/order_ZX.png" alt="" />
357 
+										<p class="typeWord_line">数据展示</p>
358 
+										<p class="order_count">2568</p>
359 
+										<p class="typeWord_line">今日咨询量</p>
360 
+										<p class="order_count">2568</p>
361 
+										<p class="typeWord_line">本月咨询量</p>
362 
+										<p class="order_count">2568</p>
363 
+										<p class="typeWord_line">咨询总量</p>
364 
+										<div class="persent_box">
365 
+											<div class="persent_kuang">20%</div>
366 
+										</div>
367 
+										<p class="persent_word">总计类型占比</p>
368 
+									</li>
369 
+									<li>
370 
+										<div class="typeWord">求助</div>
371 
+										<img src="img/order_QZ.png" alt="" />
372 
+										<p class="typeWord_line">数据展示</p>
373 
+										<p class="order_count">2568</p>
374 
+										<p class="typeWord_line">今日求助量</p>
375 
+										<p class="order_count">2568</p>
376 
+										<p class="typeWord_line">本月求助量</p>
377 
+										<p class="order_count">2568</p>
378 
+										<p class="typeWord_line">求助总量</p>
379 
+										<div class="persent_box">
380 
+											<div class="persent_kuang">20%</div>
381 
+										</div>
382 
+										<p class="persent_word">总计类型占比</p>
383 
+									</li>
384 
+									<li>
385 
+										<div class="typeWord">投诉</div>
386 
+										<img src="img/order_TS.png" alt="" />
387 
+										<p class="typeWord_line">数据展示</p>
388 
+										<p class="order_count">2568</p>
389 
+										<p class="typeWord_line">今日投诉量</p>
390 
+										<p class="order_count">2568</p>
391 
+										<p class="typeWord_line">本月投诉量</p>
392 
+										<p class="order_count">2568</p>
393 
+										<p class="typeWord_line">投诉总量</p>
394 
+										<div class="persent_box">
395 
+											<div class="persent_kuang">20%</div>
396 
+										</div>
397 
+										<p class="persent_word">总计类型占比</p>
398 
+									</li>
399 
+									<li>
400 
+										<div class="typeWord">建议</div>
401 
+										<img src="img/order_JY.png" alt="" />
402 
+										<p class="typeWord_line">数据展示</p>
403 
+										<p class="order_count">2568</p>
404 
+										<p class="typeWord_line">今日建议量</p>
405 
+										<p class="order_count">2568</p>
406 
+										<p class="typeWord_line">本月建议量</p>
407 
+										<p class="order_count">2568</p>
408 
+										<p class="typeWord_line">建议总量</p>
409 
+										<div class="persent_box">
410 
+											<div class="persent_kuang">20%</div>
411 
+										</div>
412 
+										<p class="persent_word">总计类型占比</p>
413 
+									</li>
414 
+									<li>
415 
+										<div class="typeWord">表扬</div>
416 
+										<img src="img/order_BY.png" alt="" />
417 
+										<p class="typeWord_line">数据展示</p>
418 
+										<p class="order_count">2568</p>
419 
+										<p class="typeWord_line">今日表扬量</p>
420 
+										<p class="order_count">2568</p>
421 
+										<p class="typeWord_line">本月表扬量</p>
422 
+										<p class="order_count">2568</p>
423 
+										<p class="typeWord_line">表扬总量</p>
424 
+										<div class="persent_box">
425 
+											<div class="persent_kuang">20%</div>
426 
+										</div>
427 
+										<p class="persent_word">总计类型占比</p>
428 
+									</li>
429 
+									<li>
430 
+										<div class="typeWord">其他</div>
431 
+										<img src="img/order_QT.png" alt="" />
432 
+										<p class="typeWord_line">数据展示</p>
433 
+										<p class="order_count">2568</p>
434 
+										<p class="typeWord_line">今日其他量</p>
435 
+										<p class="order_count">2568</p>
436 
+										<p class="typeWord_line">本月其他量</p>
437 
+										<p class="order_count">2568</p>
438 
+										<p class="typeWord_line">其他总量</p>
439 
+										<div class="persent_box">
440 
+											<div class="persent_kuang">20%</div>
441 
+										</div>
442 
+										<p class="persent_word">总计类型占比</p>
443 
+									</li>
444 
+								</ul>
445 
+
446 
+							</div>
447 
+						</div>
448 
+					</div>
449 
+
450 
+					<!--第四屏  工单状态-->
451 
+					<!-- <div class="swiper-slide"> -->
452 
+						<!-- <div class="timeWrap lasttimeWrap timeWrapPosi"> -->
453 
+							<!-- <div class="time_box pull-right form-inline time_box_leftTh"> -->
454 
+								<!-- 时间选择： -->
455 
+								<!-- <input type="text" id="time2" class="times" /> -->
456 
+							<!-- </div> -->
457 
+							<!-- <div class="time_box pull-right form-inline time_box_four"> -->
458 
+								<!-- 地区选择： -->
459 
+								<!-- <select class="areaFour selects" style="height: 30px;"></select> -->
460 
+							<!-- </div> -->
461 
+						<!-- </div> -->
462 
+						<!-- <div class="slideCon_bg orderState clearfix"> -->
463 
+							<!-- <p class="slide_title slide_title4"></p> -->
464 
+							<!-- <div class="orderCon_left slide_left"> -->
465 
+								<!-- <ul class="orderState_ul"> -->
466 
+									<!-- <li class="active"> -->
467 
+										<!-- <img src="img/state_YS.png" alt="" /> -->
468 
+										<!-- <div class="num_word"> -->
469 
+											<!-- <p>延时审核</p> -->
470 
+											<!-- <div id="state_yssh"></div> -->
471 
+										<!-- </div> -->
472 
+									<!-- </li> -->
473 
+									<!-- <li> -->
474 
+										<!-- <img src="img/state_YBL.png" alt="" /> -->
475 
+										<!-- <div class="num_word"> -->
476 
+											<!-- <p>已办理</p> -->
477 
+											<!-- <div id="state_ybl"></div> -->
478 
+										<!-- </div> -->
479 
+									<!-- </li> -->
480 
+									<!-- <li> -->
481 
+										<!-- <img src="img/state_YHF.png" alt="" /> -->
482 
+										<!-- <div class="num_word"> -->
483 
+											<!-- <p>已回访</p> -->
484 
+											<!-- <div id="state_yhf"></div> -->
485 
+										<!-- </div> -->
486 
+									<!-- </li> -->
487 
+									<!-- <li> -->
488 
+										<!-- <img src="img/state_YHF.png" alt="" /> -->
489 
+										<!-- <div class="num_word"> -->
490 
+											<!-- <p>重办待交办</p> -->
491 
+											<!-- <div id="state_cbdjb"></div> -->
492 
+										<!-- </div> -->
493 
+									<!-- </li> -->
494 
+									<!-- <li> -->
495 
+										<!-- <img src="img/state_CBZ.png" alt="" /> -->
496 
+										<!-- <div class="num_word"> -->
497 
+											<!-- <p>重办中</p> -->
498 
+											<!-- <div id="state_cbz"></div> -->
499 
+										<!-- </div> -->
500 
+									<!-- </li> -->
501 
+									<!-- <li> -->
502 
+										<!-- <img src="img/state_YJA.png" alt="" /> -->
503 
+										<!-- <div class="num_word"> -->
504 
+											<!-- <p>已结案</p> -->
505 
+											<!-- <div id="state_yja"></div> -->
506 
+										<!-- </div> -->
507 
+									<!-- </li> -->
508 
+								<!-- </ul> -->
509 
+							<!-- </div> -->
510 
+							<!-- <div class="orderCon_middle slide_middle"> -->
511 
+								<!-- <div class="earth_box"> -->
512 
+									<!-- <div class="earth_quan1"></div> -->
513 
+									<!-- <div class="earth_quan2"></div> -->
514 
+									<!-- <div class="earth_quan3"></div> -->
515 
+									<!-- <div class="earth"></div> -->
516 
+								<!-- </div> -->
517 
+							<!-- </div> -->
518 
+
519 
+							<!-- <div class="orderCon_right slide_right"> -->
520 
+								<!-- <ul class="orderState_ul"> -->
521 
+									<!-- <li> -->
522 
+										<!-- <img src="img/state_XZGD.png" alt="" /> -->
523 
+										<!-- <div class="num_word"> -->
524 
+											<!-- <p>新增工单</p> -->
525 
+											<!-- <div id="state_xzgd"></div> -->
526 
+										<!-- </div> -->
527 
+									<!-- </li> -->
528 
+
529 
+									<!-- <li> -->
530 
+										<!-- <img src="img/state_DJB.png" alt="" /> -->
531 
+										<!-- <div class="num_word"> -->
532 
+											<!-- <p>待交办</p> -->
533 
+											<!-- <div id="state_djb"></div> -->
534 
+										<!-- </div> -->
535 
+									<!-- </li> -->
536 
+									<!-- <li> -->
537 
+										<!-- <img src="img/state_DCS.png" alt="" /> -->
538 
+										<!-- <div class="num_word"> -->
539 
+											<!-- <p>待审核</p> -->
540 
+											<!-- <div id="state_dsh"></div> -->
541 
+										<!-- </div> -->
542 
+									<!-- </li> -->
543 
+									<!-- <li> -->
544 
+										<!-- <img src="img/state_DCS.png" alt="" /> -->
545 
+										<!-- <div class="num_word"> -->
546 
+											<!-- <p>待查收</p> -->
547 
+											<!-- <div id="state_dcs"></div> -->
548 
+										<!-- </div> -->
549 
+									<!-- </li> -->
550 
+									<!-- <li> -->
551 
+										<!-- <img src="img/state_THSH.png" alt="" /> -->
552 
+										<!-- <div class="num_word"> -->
553 
+											<!-- <p>退回审核</p> -->
554 
+											<!-- <div id="state_thsh"></div> -->
555 
+										<!-- </div> -->
556 
+									<!-- </li> -->
557 
+									<!-- <li> -->
558 
+										<!-- <img src="img/state_BLZ.png" alt="" /> -->
559 
+										<!-- <div class="num_word"> -->
560 
+											<!-- <p>办理中</p> -->
561 
+											<!-- <div id="state_blz"></div> -->
562 
+										<!-- </div> -->
563 
+									<!-- </li> -->
564 
+
565 
+								<!-- </ul> -->
566 
+							<!-- </div> -->
567 
+						<!-- </div> -->
568 
+
569 
+					<!-- </div> -->
570 
+
571 
+					<!--第五屏  话务量统计-->
572 
+					<div class="swiper-slide">
573 
+						<div class="slideCon_bg trafficVolume clearfix">
574 
+							<p class="slide_title slide_title5"></p>
575 
+							<div class="orderCon_left slide_left">
576 
+								<div class="keyW_t">
577 
+									投诉关键字
578 
+								</div>
579 
+								<div class="tagBox">
580 
+									<div class="tagcloud">
581 
+									</div>
582 
+								</div>
583 
+							</div>
584 
+							<div class="orderCon_right slide_right">
585 
+								<div class="timeWrap lasttimeWrap timeWrapPosi">
586 
+									<div class="time_box pull-right form-inline">
587 
+										日期
588 
+										<input type="text" id="test6" class="times lasttime" style="margin-right: 50px;"/>
589 
+										部门
590 
+										<select class="depart selects"></select>
591 
+									</div>
592 
+								</div>
593 
+
594 
+								<div class="keyBottom_left pull-left">
595 
+									<div class="table_box table_box_key">
596 
+										<table class="table">
597 
+											<colgroup>
598 
+												<col style="width: 120px;" />
599 
+												<col/>
600 
+											</colgroup>
601 
+											<thead class="thead">
602 
+												<tr>
603 
+													<td>部门名称</td>
604 
+													<td>数量</td>
605 
+													<td>占比</td>
606 
+												</tr>
607 
+											</thead>
608 
+										</table>
609 
+										<div class="scroll_table" style="width: 100%;height: 460px; overflow: hidden;">
610 
+											<table class="table">
611 
+												<colgroup>
612 
+													<col style="width: 120px;" />
613 
+													<col/>
614 
+												</colgroup>
615 
+												<tbody>
616 
+												</tbody>
617 
+											</table>
618 
+										</div>
619 
+									</div>
620 
+								</div>
621 
+							</div>
622 
+						</div>
623 
+						<!--<div class="slideCon_bg trafficVolume clearfix">
624 
+							<p class="slide_title slide_title5"></p>
625 
+							<div class="orderCon_left slide_left">
626 
+								<div class="tagBox">
627 
+									<div class="tagcloud">
628 
+										 <div>
629 
+										 	<p class="tag_title">文献综述</p>
630 
+										 	<p class="imgs">800</p>
631 
+										 	<p class="ts_count">投诉量</p>
632 
+										 </div>
633 
+										  <div>
634 
+										 	<p class="tag_title">对外投资</p>
635 
+										 	<p class="imgs">800</p>
636 
+										 	<p class="ts_count">投诉量</p>
637 
+										 </div>
638 
+										  <div>
639 
+										 	<p class="tag_title">机器人</p>
640 
+										 	<p class="imgs">800</p>
641 
+										 	<p class="ts_count">投诉量</p>
642 
+										 </div>
643 
+									      <div>
644 
+									      	<p class="tag_title">区块链</p>
645 
+										 	<p class="imgs">800</p>
646 
+										 	<p class="ts_count">投诉量</p>
647 
+									      </div>
648 
+									      <div>
649 
+									      	<p class="tag_title">计算机科学</p>
650 
+										 	<p class="imgs">800</p>
651 
+										 	<p class="ts_count">投诉量</p>
652 
+									      </div>
653 
+									      <div>
654 
+									      	<p class="tag_title">科技创新</p>
655 
+										 	<p class="imgs">800</p>
656 
+										 	<p class="ts_count">投诉量</p>
657 
+									      </div>
658 
+									      <div>
659 
+									      	<p class="tag_title">自动驾驶</p>
660 
+										 	<p class="imgs">800</p>
661 
+										 	<p class="ts_count">投诉量</p>
662 
+									      </div>
663 
+									      <div>
664 
+									      	<p class="tag_title">研究价值</p>
665 
+										 	<p class="imgs">800</p>
666 
+										 	<p class="ts_count">投诉量</p>
667 
+									      </div>
668 
+									      <div>
669 
+									      	<p class="tag_title">自然语言处理</p>
670 
+										 	<p class="imgs">800</p>
671 
+										 	<p class="ts_count">投诉量</p>
672 
+									      </div>
673 
+									      <div>
674 
+									      	<p class="tag_title">模式识别</p>
675 
+										 	<p class="imgs">800</p>
676 
+										 	<p class="ts_count">投诉量</p>
677 
+									      </div>
678 
+									</div>
679 
+								</div>
680 
+							</div>
681 
+							<div class="orderCon_right slide_right">
682 
+								<div class="timeWrap lasttimeWrap timeWrapPosi">
683 
+									<div class="time_box pull-right form-inline">
684 
+										地区选择：
685 
+										<select class="areaFive selects" style="height: 30px;"></select>
686 
+									</div>
687 
+								</div>
688 
+								<div class="right_top">
689 
+									<div id="huawu_tody" style="height: 300px; width: 100%;margin: 0 auto;">
690 
+
691 
+									</div>
692 
+								</div>
693 
+								<div class="right_bottom">
694 
+									<div id="jtv_num" style="height: 300px; width: 100%;margin: 0 auto;">
695 
+
696 
+									</div>
697 
+								</div>
698 
+							</div>
699 
+
700 
+						</div>-->
701 
+					</div>
702 
+
703 
+				</div>
704 
+
705 
+				<div class="swiper-button-prev"></div>
706 
+				<div class="swiper-pagination"></div>
707 
+				<div class="swiper-button-next"></div>
708 
+			</div>
709 
+
710 
+		</div>
711 
+		<script src="js/swiper.min.js"></script>
712 
+		<script src="js/swiper.animate1.0.3.min.js"></script>
713 
+		<!--<script src="js/jquery.waypoints.min.js"></script>
714 
+		<script src="js/jquery.countUp.js"></script>-->
715 
+		<script src="js/countUp.js"></script>
716 
+		<script src="plugins/numbergd/index.js"></script>
717 
+		<script src="js/tagcloud.js"></script>
718 
+		<script src="js/index.js"></script>
719 
+		<script src="js/setItervalTime.js"></script>
720 
+	</body>
721 
+
722 
+</html>

+ 751 - 0
WebChart/js/index_20190701.js
Datei anzeigen 

@@ -0,0 +1,751 @@
1 
+var areaFourVal="";
2 
+var dayTime="";
3 
+$(function() {
4 
+	// laydate.render({
5 
+		// elem: '#time2',
6 
+		// format: 'yyyy-MM-dd',
7 
+		// theme: '#114a97',
8 
+			// done: function(value, date) {
9 
+			// fourScreen(areaFourVal,value && value.split('-')[2]);
10 
+			// dayTime=value.split('-')[2];
11 
+		// }
12 
+	// });
13 
+	laydate.render({
14 
+		elem: '#time3',
15 
+		range: '~',
16 
+		theme: '#114a97',
17 
+		done: function(value, date) {
18 
+			var areaOneVal=$(".areaOne").val();
19 
+			twoScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1],areaOneVal)
20 
+		}
21 
+	});
22 
+	var mySwiper = new Swiper('.swiper-container', {
23 
+		loop: true,
24 
+		autoplay: {
25 
+			delay: 60000,
26 
+		},
27 
+		pagination: { /* 分页器*/
28 
+			el: '.swiper-pagination',
29 
+			clickable: true,
30 
+
31 
+		},
32 
+		navigation: {
33 
+			nextEl: '.swiper-button-next',
34 
+			prevEl: '.swiper-button-prev',
35 
+		},
36 
+		//				followFinger : false,
37 
+		//				speed:800,
38 
+		on: {
39 
+			init: function() {
40 
+				swiperAnimateCache(this); //隐藏动画元素
41 
+				swiperAnimate(this); //初始化完成开始动画
42 
+			},
43 
+			transitionEnd: function() {
44 
+				swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
45 
+
46 
+			},
47 
+		}
48 
+
49 
+	})
50 
+	Ajax();
51 
+})
52 
+var cityObj = {
53 
+		ele1: "sqs_count",
54 
+		ele2: "syq_count",
55 
+		ele3: "lyq_count",
56 
+		ele4: "ycs_count",
57 
+		ele5: "mqx_count",
58 
+		ele6: "sx_count",
59 
+		ele7: "nlx_count",
60 
+		ele8: "zcx_count",
61 
+		ele9: "ycx_count",
62 
+		ele10: "xyx_count",
63 
+		ele11: "cxyt_count",
64 
+		ele12: "djbl_count"
65 
+	}
66 
+	var vars = {};
67 
+	getCountUp(cityObj)
68 
+
69 
+	function getCountUp(obj1) {
70 
+		var options = {  
71 
+			useEasing: true,
72 
+			  useGrouping: true,
73 
+			  separator: ',',
74 
+			  decimal: '.',
75 
+		};
76 
+		$.each(obj1, function(k, v) {
77 
+			new CountUp(v, 0, 100, 0, 2, options).start()
78 
+			vars[v] = new CountUp(v, 0, 100, 0, 2, options)
79 
+		})
80 
+	}
81 
+
82 
+var myDate = new Date();
83 
+
84 
+function turn(aa) {
85 
+	if(aa < 10) {
86 
+		aa = "0" + aa;
87 
+	}
88 
+	return aa
89 
+}
90 
+
91 
+
92 
+	// 第三屏 第四屏 发光外框 定时
93 
+	(function() {
94 
+		var i = 0;
95 
+		var length = $(".orderState_ul >li").length;
96 
+		var j = 0;
97 
+		var length_1 = $(".orderTtype_Con li").length;
98 
+		setInterval(function() {
99 
+			if(i == length) {
100 
+				i = 0;
101 
+				$(".orderState_ul >li").removeClass('active');
102 
+			}
103 
+			$(".orderState_ul >li").eq(i).addClass('active').siblings().removeClass('active');
104 
+			if(i == 5) {
105 
+				$(".orderState_ul >li").eq(4).removeClass('active');
106 
+			}
107 
+			i++;
108 
+
109 
+			if(j == length_1) {
110 
+				j = 0;
111 
+			}
112 
+			$(".orderTtype_Con li").eq(j).addClass('active').siblings().removeClass('active');
113 
+			j++;
114 
+		}, 2000);
115 
+	})();
116 
+	//第一屏幕 开始
117 
+
118 
+	function oneScreen() {
119 
+		//			 	$('.gdmap-r ul').html('');
120 
+		//			 		var index = layer.load(1, { shade: [0.5,'#030303'] //0.1透明度的白色背景
121 
+		//			});
122 
+		$.ajax({
123 
+			type: "get",
124 
+			url: huayi.config.callcenter_url + "info/GetAreaCountByDate",
125 
+			async: true,
126 
+			dataType: 'json',
127 
+			data: {
128 
+				start: myDate.getFullYear() + "-" + turn(myDate.getMonth() + 1) + "-" + turn(myDate.getDate()),
129 
+				end: myDate.getFullYear() + "-" + turn(myDate.getMonth() + 1) + "-" + turn(myDate.getDate()),
130 
+			},
131 
+			success: function(data) {
132 
+				if(data.state.toLowerCase() == 'success') {
133 
+					// 	   			layer.close(index);
134 
+                    var con = data.data;
135 
+                    console.log(con);
136 
+					$(con).each(function(i, n) {
137 
+						if(n.AreaName.indexOf('商丘') != -1) {
138 
+							vars.sqs_count.update(n.Count);
139 
+						}
140 
+						if(n.AreaName.indexOf('睢阳') != -1) {
141 
+							vars.syq_count.update(n.Count);
142 
+						}
143 
+						if(n.AreaName.indexOf('梁园') != -1) {
144 
+							vars.lyq_count.update(n.Count);
145 
+						}
146 
+						if(n.AreaName.indexOf('永城') != -1) {
147 
+							vars.ycs_count.update(n.Count);
148 
+						}
149 
+						if(n.AreaName.indexOf('民权') != -1) {
150 
+							vars.mqx_count.update(n.Count);
151 
+						}
152 
+						if(n.AreaName.indexOf('睢县') != -1) {
153 
+							vars.sx_count.update(n.Count);
154 
+						}
155 
+						if(n.AreaName.indexOf('宁陵') != -1) {
156 
+							vars.nlx_count.update(n.Count);
157 
+						}
158 
+						if(n.AreaName.indexOf('柘城') != -1) {
159 
+							vars.zcx_count.update(n.Count);
160 
+						}
161 
+						if(n.AreaName.indexOf('虞城') != -1) {
162 
+							vars.ycx_count.update(n.Count);
163 
+						}
164 
+						if(n.AreaName.indexOf('夏邑') != -1) {
165 
+							vars.xyx_count.update(n.Count);
166 
+						}
167 
+						if(n.AreaName.indexOf('城乡一体') != -1) {
168 
+							vars.cxyt_count.update(n.Count);
169 
+						}
170 
+						if(n.AreaName.indexOf('当即办理') != -1) {
171 
+							vars.djbl_count.update(n.Count);
172 
+						}
173 
+					})
174 
+				}
175 
+			}
176 
+		});
177 
+	}
178 
+
179 
+	//第二屏
180 
+
181 
+	function twoScreen(start, end,areaTwoVal) {
182 
+		if(!areaTwoVal){
183 
+			areaTwoVal="sqs12345"
184 
+		}
185 
+		$.ajax({
186 
+			type: "get",
187 
+			url: huayi.config.callcenter_url + "info/GetSourceByDate",
188 
+			async: true,
189 
+			dataType: 'json',
190 
+			data: {
191 
+				start: start,
192 
+				end: end,
193 
+				branchcode:areaTwoVal
194 
+			},
195 
+			success: function(data) {
196 
+				if(data.state.toLowerCase() == 'success') {
197 
+					// 	   			layer.close(index);
198 
+					$('.orderSource ul li .rectangle').remove();
199 
+					var con = data.data;
200 
+
201 
+					$(con).each(function(i, n) {
202 
+						if(!n.Percent) {
203 
+							n.Percent = '0.00%'
204 
+						}
205 
+						if(n.Source.indexOf('信箱') != -1) {
206 
+							n.Source = '信箱'
207 
+						}
208 
+						if(n.Source.indexOf('APP') != -1) {
209 
+							n.Source = 'APP'
210 
+						}
211 
+						if(n.Source.indexOf('政务') != -1) {
212 
+							n.Source = '政务网'
213 
+						}
214 
+						var str = '<div class="source_kuang rectangle">' +
215 
+							'<div class="pbout">' +
216 
+							'<div class="percent_box">' +
217 
+							'<div class="percent_out"></div>	' +
218 
+							' <div class="percent_in"></div>' +
219 
+							' <div class="percent_word"><p>' + n.Percent.split('%')[0] + '</p>%<p style="margin-top: 16px;">占总量</p>' +
220 
+							'</div>' +
221 
+							'</div>' +
222 
+							'</div>' +
223 
+							'<p class="num_word">' +
224 
+							'<span>' + n.Source + '</span><span>' + n.Count + '</span>' +
225 
+							'</p>' +
226 
+							'</div>'
227 
+						$('.orderSource ul li').eq(i).prepend(str)
228 
+					})
229 
+				}
230 
+			}
231 
+		});
232 
+	}
233 
+
234 
+	//第三屏
235 
+
236 
+	function threeScreen(areaThreeVal) {
237 
+		if(!areaThreeVal){
238 
+			areaThreeVal="sqs12345"
239 
+		}
240 
+		$.ajax({
241 
+			type: "get",
242 
+			url: huayi.config.callcenter_url + "Info/GetTypeCountNew",
243 
+			data:{
244 
+				branchcode:areaThreeVal
245 
+			},
246 
+			async: true,
247 
+			dataType: 'json',
248 
+			success: function(data) {
249 
+				if(data.state.toLowerCase() == 'success') {
250 
+					$('.orderTtype_Con ul').html('');
251 
+					// 	   			layer.close(index);
252 
+					var con = data.data;
253 
+					var img_name = '';
254 
+					$(con).each(function(i, n) {
255 
+						if(n.TypeName.indexOf('咨询') != -1) {
256 
+							img_name = 'order_ZX.png'
257 
+						}
258 
+						if(n.TypeName.indexOf('求助') != -1) {
259 
+							img_name = 'order_QZ.png'
260 
+						}
261 
+						if(n.TypeName.indexOf('投诉') != -1) {
262 
+							img_name = 'order_TS.png'
263 
+						}
264 
+						if(n.TypeName.indexOf('建议') != -1) {
265 
+							img_name = 'order_JY.png'
266 
+						}
267 
+						if(n.TypeName.indexOf('表扬') != -1) {
268 
+							img_name = 'order_BY.png'
269 
+						}
270 
+						if(n.TypeName.indexOf('其他') != -1) {
271 
+							img_name = 'order_QT.png'
272 
+						}
273 
+						$('<li>' +
274 
+							'<div class="typeWord">' + n.TypeName + '</div>' +
275 
+							'<img src="img/' + img_name + '" alt="" />' +
276 
+							'<p class="typeWord_line">数据展示</p>' +
277 
+							'<p class="order_count">' + n.DayCount + '</p>' +
278 
+							'<p class="typeWord_line">今日' + n.TypeName + '量</p>' +
279 
+							'<p class="order_count">' + n.MonthCount + '</p>' +
280 
+							'<p class="typeWord_line">本月' + n.TypeName + '量</p>' +
281 
+							'<p class="order_count">' + n.TotalCount + '</p>' +
282 
+							'<p class="typeWord_line">' + n.TypeName + '总量</p>' +
283 
+							'<div class="persent_box">' +
284 
+							'<div class="persent_kuang">' + n.Percent + '</div>' +
285 
+							'</div>' +
286 
+							'<p class="persent_word">总计类型占比</p>' +
287 
+							'</li>').appendTo('.orderTtype_Con ul');
288 
+
289 
+					})
290 
+				}
291 
+			}
292 
+		});
293 
+	}
294 
+
295 
+	// //第四屏 数字滚动
296 
+	// function fourScreen(areaFourVal,dayTime) {
297 
+		// if(!areaFourVal){
298 
+			// areaFourVal="sqs12345"
299 
+		// }
300 
+		// $.ajax({
301 
+			// type: "get",
302 
+			// url: huayi.config.callcenter_url + "Info/GetStateCountByMonth",
303 
+			// data:{
304 
+				// branchcode:areaFourVal,
305 
+				// day:dayTime
306 
+			// },
307 
+			// async: true,
308 
+			// dataType: 'json',
309 
+			// success: function(data) {
310 
+				// if(data.state.toLowerCase() == 'success') {
311 
+					// // 	   			layer.close(index);
312 
+					// var con = data.data;
313 
+					// $(con).each(function(i, n) {
314 
+						// if(n.Name.indexOf('延时审核') != -1) {
315 
+							// $("#state_yssh").rollNum({
316 
+								// deVal: n.Count
317 
+							// });
318 
+						// }
319 
+						// if(n.Name.indexOf('已办理') != -1) {
320 
+							// $("#state_ybl").rollNum({
321 
+								// deVal: n.Count
322 
+							// });
323 
+						// }
324 
+						// if(n.Name.indexOf('已回访') != -1) {
325 
+
326 
+							// $("#state_yhf").rollNum({
327 
+								// deVal: n.Count
328 
+							// });
329 
+						// }
330 
+						// if(n.Name.indexOf('重办中') != -1) {
331 
+							// $("#state_cbz").rollNum({
332 
+								// deVal: n.Count
333 
+							// });
334 
+						// }
335 
+						// if(n.Name.indexOf('已结案') != -1) {
336 
+							// $("#state_yja").rollNum({
337 
+								// deVal: n.Count
338 
+							// });
339 
+						// }
340 
+						// if(n.Name.indexOf('新工单') != -1) {
341 
+							// $("#state_xzgd").rollNum({
342 
+								// deVal: n.Count
343 
+							// });
344 
+						// }
345 
+						// if(n.Name.indexOf('待交办') != -1) {
346 
+							// $("#state_djb").rollNum({
347 
+								// deVal: n.Count
348 
+							// });
349 
+						// }
350 
+						// if(n.Name.indexOf('待查收') != -1) {
351 
+							// $("#state_dcs").rollNum({
352 
+								// deVal: n.Count
353 
+							// });
354 
+						// }
355 
+						// if(n.Name.indexOf('退回审核') != -1) {
356 
+							// $("#state_thsh").rollNum({
357 
+								// deVal: n.Count
358 
+							// });
359 
+						// }
360 
+						// if(n.Name.indexOf('办理中') != -1) {
361 
+							// $("#state_blz").rollNum({
362 
+								// deVal: n.Count
363 
+							// });
364 
+						// }
365 
+						// if(n.Name.indexOf('待审核') != -1) {
366 
+							// $("#state_dsh").rollNum({
367 
+								// deVal: n.Count
368 
+							// });
369 
+						// }
370 
+						// if(n.Name.indexOf('重办待交办') != -1) {
371 
+							// $("#state_cbdjb").rollNum({
372 
+								// deVal: n.Count
373 
+							// });
374 
+						// }
375 
+					// });
376 
+				// }
377 
+			// }
378 
+		// });
379 
+
380 
+	// }
381 
+	//第五屏js
382 
+	function fiveScreen(areaFiveVal) {
383 
+		if(areaFiveVal){
384 
+			huawus(areaFiveVal);
385 
+			jtvs(areaFiveVal);
386 
+			keyWord(areaFiveVal);
387 
+		}else{
388 
+			areaFiveVal="sqs12345"
389 
+			huawus(areaFiveVal);
390 
+			jtvs(areaFiveVal);
391 
+			keyWord(areaFiveVal);
392 
+		}
393 
+	}
394 
+
395 
+	function huawus(areaFiveVal) {
396 
+		$.ajax({
397 
+			type: "get",
398 
+			url: huayi.config.callcenter_url + "info/GetTelCountByDate",
399 
+			async: true,
400 
+			dataType: "json",
401 
+			data: {
402 
+				date: myDate.getFullYear() + "-" + turn(myDate.getMonth() + 1) + "-" + turn(myDate.getDate()),
403 
+				branchcode:areaFiveVal
404 
+			},
405 
+			success: function(data) {
406 
+				if(data.state.toLowerCase() == "success") {
407 
+					//					layer.close(index);
408 
+					var con = data.data;
409 
+					huawu.setOption({
410 
+						series: [{
411 
+							data: [con.hwcon, con.lhcon, con.jtcon, con.pjthtimes]
412 
+//							data: [20, 100, 5, 80]
413 
+						}]
414 
+
415 
+					})
416 
+
417 
+				}
418 
+			}
419 
+
420 
+		});
421 
+
422 
+	}
423 
+
424 
+	function jtvs(areaFiveVal) {
425 
+		$.ajax({
426 
+			type: "get",
427 
+			url: huayi.config.callcenter_url + "info/GetTelRate24ByDate",
428 
+			async: true,
429 
+			dataType: 'json',
430 
+			data: {
431 
+				// 	   		date:$('#time4').val()
432 
+				branchcode:areaFiveVal
433 
+			},
434 
+			success: function(data) {
435 
+				if(data.state.toLowerCase() == 'success') {
436 
+					// 	   			layer.close(index);
437 
+					var con = data.data;
438 
+					// 	   			var part3=data.data.b;
439 
+					jtv_num.setOption({
440 
+						xAxis: {
441 
+							data: con.hours
442 
+						},
443 
+						series: [{
444 
+							data: con.rates
445 
+						}]
446 
+
447 
+					})
448 
+
449 
+				}
450 
+			}
451 
+		});
452 
+	}
453 
+//	$(".depart").change(function() {
454 
+//      keyWordDetail($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1]);
455 
+//	});
456 
+	//	第五屏
457 
+	$(".areaFive").change(function() {
458 
+      	var areaFiveVal=$(this).val();
459 
+    	fiveScreen(areaFiveVal);
460 
+	});
461 
+	//	第四屏
462 
+	// $(".areaFour").change(function() {
463 
+      	// var areaFourVal=$(this).val();
464 
+      	// fourScreen(areaFourVal,dayTime)
465 
+	// });
466 
+	//	第三屏
467 
+	$(".areaThree").change(function() {
468 
+      	var areaThreeVal=$(this).val();
469 
+    	threeScreen(areaThreeVal);
470 
+	});
471 
+	//	第二屏
472 
+	$(".areaTwo").change(function() {
473 
+      	var areaTwoVal=$(this).val();
474 
+    	twoScreen($('#time3').val() && $('#time3').val().split(' ~ ')[0], $('#time3').val() && $('#time3').val().split(' ~ ')[1],areaTwoVal);
475 
+	});
476 
+	//区县筛选
477 
+	deprtment ();
478 
+	function deprtment () {
479 
+		$.getJSON( huayi.config.callcenter_url +"CountyBranch/GetBranchListS", function(result) {
480 
+			if(result.state.toLowerCase() == "success") {
481 
+				goodslist = result.data;
482 
+//				第五屏
483 
+				$(".areaFive").empty();
484 
+				$(goodslist).each(function(i, n) {
485 
+					$('<option value="' + n.F_Code
486 
+					+ '">' + n.F_Name
487 
+					+ '</option>').appendTo($(".areaFive"));
488 
+				});
489 
+				//第4屏
490 
+				$(".areaFour").empty();
491 
+				$(goodslist).each(function(i, n) {
492 
+					$('<option value="' + n.F_Code
493 
+					+ '">' + n.F_Name
494 
+					+ '</option>').appendTo($(".areaFour"));
495 
+				});
496 
+				//第3屏
497 
+				$(".areaThree").empty();
498 
+				$(goodslist).each(function(i, n) {
499 
+					$('<option value="' + n.F_Code
500 
+					+ '">' + n.F_Name
501 
+					+ '</option>').appendTo($(".areaThree"));
502 
+				});
503 
+				//第2屏
504 
+				$(".areaTwo").empty();
505 
+				$(goodslist).each(function(i, n) {
506 
+					$('<option value="' + n.F_Code
507 
+					+ '">' + n.F_Name
508 
+					+ '</option>').appendTo($(".areaTwo"));
509 
+				});
510 
+			}
511 
+		});
512 
+	}
513 
+
514 
+	function keyWord(areaFiveVal) {
515 
+		$.ajax({
516 
+			type: "get",
517 
+			url: huayi.config.callcenter_url + "info/GetKeyCountByDateNew",
518 
+			async: true,
519 
+			dataType: 'json',
520 
+			data: {
521 
+				// 	   		date:$('#time4').val()
522 
+				branchcode:areaFiveVal
523 
+			},
524 
+			success: function(data) {
525 
+				if(data.state.toLowerCase() == 'success') {
526 
+					// 	   			layer.close(index);
527 
+					var con = data.data;
528 
+					$('.tagcloud').html('');
529 
+					//							var strs='<div class="tagcloud">'
530 
+					$(con).each(function(k, j) {
531 
+						if(k < 10) {
532 
+							var strs = '<div>' +
533 
+								'<p class="tag_title">' + j.关键字 + '</p>' +
534 
+								'<p class="imgs">' + j.投诉 + '</p>' +
535 
+								'<p class="ts_count">投诉量</p>' +
536 
+								'</div>'
537 
+							$('.tagcloud').append(strs);
538 
+						}
539 
+					})
540 
+
541 
+				}
542 
+			},
543 
+			complete: function(XMLHttpRequest) {
544 
+//						setTimeout(function(){
545 
+							tagcloud({
546 
+									selector: ".tagcloud", //元素选择器
547 
+									fontsize: 16, //基本字体大小, 单位px
548 
+									radius: 150, //滚动半径, 单位px
549 
+									mspeed: "normal", //滚动最大速度, 取值: slow, normal(默认), fast
550 
+									ispeed: "normal", //滚动初速度, 取值: slow, normal(默认), fast
551 
+									direction: 135, //初始滚动方向, 取值角度(顺时针360): 0对应top, 90对应left, 135对应right-bottom(默认)...
552 
+									keep: false //	鼠标移出组件后是否继续随鼠标滚动, 取值: false, true(默认) 对应 减速至初速度滚动, 随鼠标滚动
553 
+
554 
+								});
555 
+//						},100);
556 
+
557 
+			}
558 
+		});
559 
+	}
560 
+	//第五屏图表js
561 
+	var huawu = echarts.init(document.getElementById('huawu_tody'));
562 
+	huawu.setOption({
563 
+		tooltip: {
564 
+			trigger: 'axis',
565 
+			axisPointer: {
566 
+				type: false,
567 
+				label: {
568 
+					show: true,
569 
+					backgroundColor: '#030917'
570 
+				}
571 
+			},
572 
+		},
573 
+		grid: {
574 
+			left: '2%',
575 
+			right: '8%',
576 
+			bottom: '6%',
577 
+			containLabel: true
578 
+		},
579 
+		xAxis: {
580 
+			name: '类型',
581 
+			data: ["话务量(通)", "来电(通)", "接通量(通)", "平均通话时长(秒)"],
582 
+			axisLine: {
583 
+				lineStyle: {
584 
+					color: '#038de2'
585 
+				}
586 
+			},
587 
+			axisTick: {
588 
+				alignWithLabel: true,
589 
+				show: false
590 
+			},
591 
+			axisLabel: { //横轴字体颜色
592 
+				show: true,
593 
+				textStyle: {
594 
+					color: '#00daf4'
595 
+				}
596 
+			}
597 
+		},
598 
+		yAxis: {
599 
+			name: '数量',
600 
+			splitLine: {
601 
+				show: false
602 
+			},
603 
+			axisLine: {
604 
+				lineStyle: {
605 
+					color: '#038de2'
606 
+				}
607 
+			}
608 
+
609 
+		},
610 
+		series: [{
611 
+			name: '数量',
612 
+			type: 'bar',
613 
+			barWidth: 18,
614 
+			itemStyle: {
615 
+				normal: {
616 
+					color: new echarts.graphic.LinearGradient(
617 
+						0, 0, 0, 1, [{
618 
+								offset: 0,
619 
+								color: '#0285ff'
620 
+							},
621 
+							{
622 
+								offset: 1,
623 
+								color: '#0385ff24'
624 
+							}
625 
+						]
626 
+					)
627 
+				}
628 
+			},
629 
+			label: {
630 
+				normal: {
631 
+					show: true,
632 
+					position: 'top', //顶部数据显示位置
633 
+					textStyle: {
634 
+						color: '#fff' //顶部数据颜色
635 
+					},
636 
+					formatter: '{c}' // 这里是数据展示的时候显示的数据
637 
+				}
638 
+			},
639 
+			data: []
640 
+		}]
641 
+
642 
+	});
643 
+
644 
+	var jtv_num = echarts.init(document.getElementById('jtv_num'));
645 
+
646 
+	jtv_num.setOption({
647 
+	//	title: {
648 
+	//		text: '接通率统计',
649 
+	//		x: 'center',
650 
+	//		textStyle: {
651 
+	//			color: '#fff',
652 
+	//			fontSize: 18,
653 
+	//			fontWeight: 'normal'
654 
+	//		}
655 
+	//	},
656 
+	grid: {
657 
+		left: '6%',
658 
+		right: '8%',
659 
+		bottom: '6%',
660 
+		containLabel: true
661 
+	},
662 
+	tooltip: {
663 
+		trigger: 'axis',
664 
+		axisPointer: {
665 
+			type: 'shadow',
666 
+			label: {
667 
+				show: true,
668 
+				backgroundColor: '#333'
669 
+			}
670 
+		},
671 
+		formatter: function(datas) {
672 
+			var res = datas[0].name + '<br/>',
673 
+				val;
674 
+			for(var i = 0, length = datas.length; i < length; i++) {
675 
+				val = (datas[i].value) + '%';
676 
+				res += datas[i].seriesName + '：' + val + '<br/>';
677 
+			}
678 
+			return res;
679 
+		}
680 
+	},
681 
+	//	legend: {
682 
+	////		top: 30,
683 
+	//bottom:'bottom',
684 
+	//		data: ['接通率'],
685 
+	//		textStyle: {
686 
+	//			color: '#fff'
687 
+	//		}
688 
+	//	},
689 
+	xAxis: {
690 
+		name: '时',
691 
+		data: [],
692 
+		axisLine: {
693 
+			lineStyle: {
694 
+				color: '#038de2'
695 
+			}
696 
+		},
697 
+		axisTick: {
698 
+			alignWithLabel: true,
699 
+			show: false
700 
+		},
701 
+		axisLabel: { //横轴字体颜色
702 
+			show: true,
703 
+			textStyle: {
704 
+				color: '#00daf4'
705 
+			}
706 
+		}
707 
+
708 
+	},
709 
+	yAxis: {
710 
+		name: '比率',
711 
+		splitLine: {
712 
+			show: false
713 
+		},
714 
+		axisLine: {
715 
+			lineStyle: {
716 
+				color: '#038de2'
717 
+			}
718 
+		}
719 
+	},
720 
+	series: [{
721 
+		name: '接通率',
722 
+		type: 'bar',
723 
+		barWidth: 8,
724 
+		itemStyle: {
725 
+			normal: {
726 
+				color: new echarts.graphic.LinearGradient(
727 
+					0, 0, 0, 1, [{
728 
+							offset: 0,
729 
+							color: '#00e8fe'
730 
+						},
731 
+						{
732 
+							offset: 1,
733 
+							color: '#016fa4'
734 
+						}
735 
+					]
736 
+				)
737 
+			}
738 
+		},
739 
+//		data: [500, 10, 25, 78, 85, 89, 56, 120, 20, 230, 52, 85, 45, 46, 12, 600, 15, 18, 95, 150, 28, 134, 146, 145]
740 
+		data: []
741 
+	}]
742 
+
743 
+});
744 
+
745 
+	function Ajax() {
746 
+		oneScreen();
747 
+		twoScreen();
748 
+		threeScreen();
749 
+		//fourScreen();
750 
+		fiveScreen()
751 
+	}