Начало Каталог Помощ
Регистрация Вход
zhoufan
/
XYX12345_Web
Наблюдаван 1
Харесван 0
Разклонения 0
Код Задачи 0 Заявки за сливане 0 Ревизии 76 Версии 0 Уики
Преглед на файлове

新野大屏，管理系统五级归口，增删改查

miaofuhao преди 6 години
родител
c268d19113
ревизия
4340d1a6fb
променени са 19 файла, в които са добавени 4243 реда и са изтрити 36 реда
Разделен изглед Покажи статистика за разликите
  1. 3 1
      WebChart_2.0/Script/Common/huayi.config.js
  2. 2 0
      WebChart_2.0/Script/Common/huayi.http.js
  3. 81 0
      WebChart_2.0/TelephoneDetails1.html
  4. 58 0
      WebChart_2.0/comment/ComHeader5.html
  5. 58 0
      WebChart_2.0/comment/ComHeader6.html
  6. 323 0
      WebChart_2.0/complaintsReport1.html
  7. 1 1
      WebChart_2.0/index1.html
  8. 504 0
      WebChart_2.0/page1.html
  9. 579 0
      WebChart_2.0/page2.html
  10. 535 0
      WebChart_2.0/page3.html
  11. 535 0
      WebChart_2.0/page4.html
  12. 535 0
      WebChart_2.0/page5.html
  13. 23 24
      WebChart_2.0/plugins/numbergd/index.html
  14. 178 0
      WebChart_2.0/receiptDepartment1.html
  15. 245 0
      WebChart_2.0/sourceChannel1.html
  16. 119 0
      WebUI/CallCenterWeb.UI/SystemManager/css/fivePoints.css
  17. 117 0
      WebUI/CallCenterWeb.UI/SystemManager/fivePoints.html
  18. 346 0
      WebUI/CallCenterWeb.UI/SystemManager/js/fivePoints.js
  19. 1 10
      WebUI/CallCenterWeb.UI/login.html

+ 3 - 1
WebChart_2.0/Script/Common/huayi.config.js
Целия файл 

@@ -14,5 +14,7 @@ huayi.config = {
14 14 
     headurl1: "/comment/ComHeader1.html",
15 15 
     headurl2: "/comment/ComHeader2.html",
16 16 
     headurl3: "/comment/ComHeader3.html",
17 
-    headurl4: "/comment/ComHeader4.html"
17 
+    headurl4: "/comment/ComHeader4.html",
18 
+    headurl5: "/comment/ComHeader5.html",
19 
+    headurl6: "/comment/ComHeader6.html"
18 20 
 };

+ 2 - 0
WebChart_2.0/Script/Common/huayi.http.js
Целия файл 

@@ -549,6 +549,8 @@ helper.init = {
549 549 
         $("#nav2").load(hostPath+huayi.config.headurl2);
550 550 
         $("#nav3").load(hostPath+huayi.config.headurl3);
551 551 
         $("#nav4").load(hostPath+huayi.config.headurl4);
552 
+        $("#nav5").load(hostPath+huayi.config.headurl5);
553 
+        $("#nav6").load(hostPath+huayi.config.headurl6);
552 554 
 //      $(".footer").load(hostPath +huayi.config.footurl);
553 555 
     },
554 556 
     setajax: function (isload) { /// 配置AJAX

+ 81 - 0
WebChart_2.0/TelephoneDetails1.html
Целия файл 

@@ -0,0 +1,81 @@
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/index.css" />
12 
+		<title>话务量详情页</title>
13 
+		<style>
14 
+			#time1{
15 
+				width: 199px;
16 
+			}
17 
+			.phone_bottom >div:last-child{
18 
+				width: 40%;
19 
+				margin-left: 1%;
20 
+				 background: url(img/jd_bg3.png) no-repeat center;
21 
+				 background-size: 100% 100%;
22 
+			}
23 
+			.phone_bottom >div:first-child{
24 
+				 background: url(img/jd_bg2.png) no-repeat center;
25 
+				 background-size: 100% 100%;
26 
+				width: 59%;
27 
+			}
28 
+		</style>
29 
+	</head>
30 
+
31 
+	<body>
32 
+		<!--导航栏开始-->
33 
+		<div id="nav6" class="clearfix navSt">
34 
+
35 
+		</div>
36 
+		<!--导航栏结束-->
37 
+		<div id="wrap" class="container">
38 
+				<div class="phone_top">
39 
+				<div class="legend_bar clearfix">
40 
+					<div class="title_word pull-left">
41 
+						<span class="col-line"></span> 坐席话务量
42 
+					</div>
43 
+					<div class="time_box pull-right form-inline">
44 
+						日期<input type="text" id="time1" class="times" />
45 
+					</div>
46 
+				</div>
47 
+				<div id="sitProportion" style=" width: 100%;height: 400px;"></div>
48 
+			</div>
49 
+			<!--<div class="row">-->
50 
+				<div class="phone_bottom clearfix">
51 
+				<div class="bottom_left pull-left">
52 
+					<div class="legend_bar clearfix">
53 
+					<div class="title_word pull-left">
54 
+						<span class="col-line"></span> 话务量实时统计数据
55 
+					</div>
56 
+
57 
+
58 
+				</div>
59 
+					<!--话务量实时统计-->
60 
+					<div id="phoneTimeCount" style="width: 100%;height: 390px;"></div>
61 
+				</div>
62 
+				<div class="bottom_right pull-left">
63 
+					<div class="legend_bar clearfix">
64 
+					<div class="title_word pull-left">
65 
+						<span class="col-line"></span> 今日话务量数据
66 
+					</div>
67 
+
68 
+
69 
+				</div>
70 
+					<!--今日话务量数据-->
71 
+					<div id="todyPhoneCount" style="width: 100%;height: 390px;"></div>
72 
+				</div>
73 
+
74 
+			</div>
75 
+			<!--</div>-->
76 
+		</div>
77 
+		<script src="js/TelephoneDetails.js"></script>
78 
+		<script src="js/setItervalTime.js"></script>
79 
+	</body>
80 
+
81 
+</html>

+ 58 - 0
WebChart_2.0/comment/ComHeader5.html
Целия файл 

@@ -0,0 +1,58 @@
1 
+<div class="nav_left"><img src="img/nav_l.png" alt="" /></div>
2 
+<div class="nav_middle">
3 
+	<ul class="clearfix" id="navcon_box">
4 
+		<li>
5 
+			<a href="sourceChannel.html"><img src="img/lyqd_0.png" alt="" /></a>
6 
+		</li>
7 
+		<li>
8 
+			<a href="receiptDepartment.html"><img src="img/jdbm_0.png" alt="" /></a>
9 
+		</li>
10 
+		<li class="proTab">
11 
+			<a><img src="img/title1.png" alt="" /></a>
12 
+			<!--<a href="index1.html"><img src="../img/title1.png" alt="" /></a>-->
13 
+			<!--<img src="img/title1.png" alt="" />-->
14 
+		</li>
15 
+		<li>
16 
+			<a href="TelephoneDetails.html"><img src="img/hwsl_0.png" alt="" /></a>
17 
+		</li>
18 
+		<li>
19 
+			<a href="complaintsReport.html"><img src="img/tsjb_0.png" alt="" /></a>
20 
+		</li>
21 
+	</ul>
22 
+</div>
23 
+<div class="nav_right"><img src="img/nav_r.png" alt="" /></div>
24 
+<script>
25 
+	var urlText = window.location.pathname;
26 
+	var strs = urlText.split('/');
27 
+	var urlfile = strs[strs.length - 1];
28 
+	var imgsrc = '';
29 
+	if(urlfile == 'sourceChannel.html') {
30 
+		imgsrc = 'img/lyqd_1.png';
31 
+	}
32 
+	if(urlfile == 'receiptDepartment.html') {
33 
+		imgsrc = 'img/jdbm_1.png'
34 
+	}
35 
+	if(urlfile == 'TelephoneDetails.html') {
36 
+		imgsrc = 'img/hwsl_1.png'
37 
+	}
38 
+	if(urlfile == 'complaintsReport.html') {
39 
+		imgsrc = 'img/tsjb_1.png'
40 
+	}
41 
+	if(urlfile == 'index1.html') {
42 
+		imgsrc = 'img/title1.png'
43 
+	}
44 
+	$('#navcon_box li').each(function(i, n) {
45 
+		if($(n).find('a').attr('href') == urlfile) {
46 
+			$(n).find('img').attr('src', imgsrc);
47 
+		}
48 
+	})
49 
+
50 
+	$(".proTab").click(function() {
51 
+		$(".Popout_bj").fadeIn();
52 
+		$(".Popout_div").fadeIn();
53 
+	})
54 
+	$(".icon_del").click(function() {
55 
+		$(".Popout_bj").hide();
56 
+		$(".Popout_div").hide();
57 
+	})
58 
+</script>

+ 58 - 0
WebChart_2.0/comment/ComHeader6.html
Целия файл 

@@ -0,0 +1,58 @@
1 
+<div class="nav_left"><img src="img/nav_l.png" alt="" /></div>
2 
+<div class="nav_middle">
3 
+	<ul class="clearfix" id="navcon_box">
4 
+		<li>
5 
+			<a href="sourceChannel1.html"><img src="img/lyqd_0.png" alt="" /></a>
6 
+		</li>
7 
+		<li>
8 
+			<a href="receiptDepartment1.html"><img src="img/jdbm_0.png" alt="" /></a>
9 
+		</li>
10 
+		<li class="proTab">
11 
+			<a href="page2.html"><img src="img/title1.png" alt="" /></a>
12 
+			<!--<a href="index1.html"><img src="../img/title1.png" alt="" /></a>-->
13 
+			<!--<img src="img/title1.png" alt="" />-->
14 
+		</li>
15 
+		<li>
16 
+			<a href="TelephoneDetails1.html"><img src="img/hwsl_0.png" alt="" /></a>
17 
+		</li>
18 
+		<li>
19 
+			<a href="complaintsReport1.html"><img src="img/tsjb_0.png" alt="" /></a>
20 
+		</li>
21 
+	</ul>
22 
+</div>
23 
+<div class="nav_right"><img src="img/nav_r.png" alt="" /></div>
24 
+<script>
25 
+	var urlText = window.location.pathname;
26 
+	var strs = urlText.split('/');
27 
+	var urlfile = strs[strs.length - 1];
28 
+	var imgsrc = '';
29 
+	if(urlfile == 'sourceChannel1.html') {
30 
+		imgsrc = 'img/lyqd_1.png';
31 
+	}
32 
+	if(urlfile == 'receiptDepartment1.html') {
33 
+		imgsrc = 'img/jdbm_1.png'
34 
+	}
35 
+	if(urlfile == 'TelephoneDetails1.html') {
36 
+		imgsrc = 'img/hwsl_1.png'
37 
+	}
38 
+	if(urlfile == 'complaintsReport1.html') {
39 
+		imgsrc = 'img/tsjb_1.png'
40 
+	}
41 
+	if(urlfile == 'page2.html') {
42 
+		imgsrc = 'img/title1.png'
43 
+	}
44 
+	$('#navcon_box li').each(function(i, n) {
45 
+		if($(n).find('a').attr('href') == urlfile) {
46 
+			$(n).find('img').attr('src', imgsrc);
47 
+		}
48 
+	})
49 
+
50 
+	$(".proTab").click(function() {
51 
+		$(".Popout_bj").fadeIn();
52 
+		$(".Popout_div").fadeIn();
53 
+	})
54 
+	$(".icon_del").click(function() {
55 
+		$(".Popout_bj").hide();
56 
+		$(".Popout_div").hide();
57 
+	})
58 
+</script>

+ 323 - 0
WebChart_2.0/complaintsReport1.html
Целия файл 

@@ -0,0 +1,323 @@
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/index.css" />
12 
+		<title>投诉举报</title>
13 
+		<style>
14 
+			.selects {
15 
+				height: initial;
16 
+			}
17 
+
18 
+			#time1{
19 
+				width: 155px;
20 
+			}
21 
+			#time2,
22 
+			#time3 {
23 
+				width: 198px;
24 
+			}
25 
+			.selects_box:before {
26 
+				z-index: 1;
27 
+			}
28 
+			.phone_bottom>div:last-child {
29 
+				width: 44%;
30 
+				margin-left: 1%;
31 
+				background: url(img/jd_bg3.png) no-repeat center;
32 
+				background-size: 100% 100%;
33 
+			}
34 
+
35 
+			.phone_bottom>div:first-child {
36 
+				background: url(img/jd_bg2.png) no-repeat center;
37 
+				background-size: 100% 100%;
38 
+				width: 55%;
39 
+			}
40 
+
41 
+			.phone_bottom>div:first-child table {
42 
+				width: 95%;
43 
+				margin: 0 auto;
44 
+				color: #fff;
45 
+				font-size: 12px;
46 
+			}
47 
+
48 
+			.table_box {
49 
+				margin-top: 30px;
50 
+			}
51 
+			.table>thead>tr>td {
52 
+				border-top: 2px solid #3160a2;
53 
+			}
54 
+			.table>tbody>tr>td{
55 
+				border-top: 1px solid #3160a2;
56 
+				color: #00e9ff;
57 
+			}
58 
+			.table>tbody>tr>td:first-child{
59 
+				color: #fff;
60 
+			}
61 
+			table thead, tbody tr {
62 
+	            display:table;
63 
+	            width:100%;
64 
+	            table-layout:fixed;
65 
+	        }
66 
+	       .table>tbody>tr>td:last-child{
67 
+	        	color: #95e193;
68 
+	        }
69 
+	       .table>tbody>tr>td:nth-last-child(2){
70 
+	        	color: #ec6969!important;
71 
+	        }
72 
+			.quadrangle {
73 
+				display: inline-block;
74 
+				width: 9px;
75 
+				height: 20px;
76 
+				background: #69e1a9;
77 
+				transform: skewX(20deg);
78 
+			}
79 
+
80 
+			.bottom_right li {
81 
+				position: relative;
82 
+				width: 134px;
83 
+				text-align: right;
84 
+				height: 20px;
85 
+				line-height: 15px;
86 
+				margin-top: 35px;
87 
+				margin-left: 30px;
88 
+			}
89 
+
90 
+			.bottom_right ul li:nth-of-type(1) {
91 
+				margin-top: 40px;
92 
+				background: url(img/sbx_line0.png) no-repeat;
93 
+			}
94 
+
95 
+			.bottom_right ul li:nth-of-type(2) {
96 
+				background: url(img/sbx_line1.png) no-repeat;
97 
+			}
98 
+
99 
+			.bottom_right ul li:nth-of-type(3) {
100 
+				background: url(img/sbx_line2.png) no-repeat;
101 
+			}
102 
+
103 
+			.bottom_right ul li:nth-of-type(4) {
104 
+				background: url(img/sbx_line3.png) no-repeat;
105 
+			}
106 
+
107 
+			.bottom_right ul li:nth-of-type(5) {
108 
+				background: url(img/sbx_line4.png) no-repeat;
109 
+			}
110 
+
111 
+			.bottom_right ul li:nth-of-type(6) {
112 
+				background: url(img/sbx_line5.png) no-repeat;
113 
+			}
114 
+
115 
+			.type_name {
116 
+				color: #00e9ff;
117 
+			}
118 
+
119 
+			.type_count {
120 
+				color: #fff;
121 
+				margin-left: 25px;
122 
+			}
123 
+		</style>
124 
+	</head>
125 
+
126 
+	<body>
127 
+		<!--导航栏开始-->
128 
+		<div id="nav6" class="clearfix navSt">
129 
+
130 
+		</div>
131 
+		<!--导航栏结束-->
132 
+		<div id="wrap" class="container">
133 
+			<div class="phone_top">
134 
+				<div class="legend_bar clearfix">
135 
+					<div class="title_word pull-left">
136 
+						<span class="col-line"></span> 投诉类别统计
137 
+					</div>
138 
+					<div class="time_box pull-right form-inline">
139 
+						日期<input type="text" id="time2" class="times" />
140 
+					</div>
141 
+				</div>
142 
+				<div id="part_1" style="width: 100%;height: 400px;"></div>
143 
+			</div>
144 
+			<!--<div class="row">-->
145 
+			<div class="phone_bottom clearfix">
146 
+				<div class="bottom_left pull-left">
147 
+					<div class="legend_bar clearfix">
148 
+						<div class="title_word pull-left">
149 
+							<span class="col-line"></span> 投诉关键字统计
150 
+						</div>
151 
+
152 
+					</div>
153 
+					<!--投诉关键字统计-->
154 
+					<div class="table_box" style="width: 100%;height: 390px;">
155 
+						<table class="table">
156 
+							<colgroup>
157 
+								<col style="width: 120px;" />
158 
+								<col/>
159 
+							</colgroup>
160 
+							<thead>
161 
+								<tr>
162 
+									<td>关键字</td>
163 
+									<td>咨询</td>
164 
+									<td>求助</td>
165 
+									<td>建议</td>
166 
+									<td>表扬</td>
167 
+									<td>其他</td>
168 
+									<td>投诉量</td>
169 
+									<td>合计</td>
170 
+									<td>排名</td>
171 
+								</tr>
172 
+							</thead>
173 
+						</table>
174 
+						<div id="scroll_table" style="width: 100%;height: 300px; overflow: hidden;">
175 
+							<table class="table">
176 
+								<colgroup>
177 
+									<col style="width: 120px;" />
178 
+									<col/>
179 
+								</colgroup>
180 
+								<tbody>
181 
+<!-- 									<tr>
182 
+										<td>工作效率</td>
183 
+										<td><span class="text_color1">0</span></td>
184 
+										<td><span class="text_color1">0</span></td>
185 
+										<td><span class="text_color1">0</span></td>
186 
+										<td><span class="text_color1">0</span></td>
187 
+										<td><span class="text_color1">0</span></td>
188 
+										<td><span class="text_color2">0</span></td>
189 
+										<td><span class="text_color3">0</span></td>
190 
+									</tr>
191 
+									<tr>
192 
+										<td>服务态度</td>
193 
+										<td><span class="text_color1">0</span></td>
194 
+										<td><span class="text_color1">0</span></td>
195 
+										<td><span class="text_color1">0</span></td>
196 
+										<td><span class="text_color1">0</span></td>
197 
+										<td><span class="text_color1">0</span></td>
198 
+										<td><span class="text_color2">0</span></td>
199 
+										<td><span class="text_color3">0</span></td>
200 
+									</tr>
201 
+									<tr>
202 
+										<td>咨询建议</td>
203 
+										<td><span class="text_color1">0</span></td>
204 
+										<td><span class="text_color1">0</span></td>
205 
+										<td><span class="text_color1">0</span></td>
206 
+										<td><span class="text_color1">0</span></td>
207 
+										<td><span class="text_color1">0</span></td>
208 
+										<td><span class="text_color2">0</span></td>
209 
+										<td><span class="text_color3">0</span></td>
210 
+									</tr>
211 
+									<tr>
212 
+										<td>房产物业</td>
213 
+										<td><span class="text_color1">0</span></td>
214 
+										<td><span class="text_color1">0</span></td>
215 
+										<td><span class="text_color1">0</span></td>
216 
+										<td><span class="text_color1">0</span></td>
217 
+										<td><span class="text_color1">0</span></td>
218 
+										<td><span class="text_color2">0</span></td>
219 
+										<td><span class="text_color3">0</span></td>
220 
+									</tr>
221 
+									<tr>
222 
+										<td>城市交通</td>
223 
+										<td><span class="text_color1">0</span></td>
224 
+										<td><span class="text_color1">0</span></td>
225 
+										<td><span class="text_color1">0</span></td>
226 
+										<td><span class="text_color1">0</span></td>
227 
+										<td><span class="text_color1">0</span></td>
228 
+										<td><span class="text_color2">0</span></td>
229 
+										<td><span class="text_color3">0</span></td>
230 
+									</tr>
231 
+									<tr>
232 
+										<td>环境保护</td>
233 
+										<td><span class="text_color1">0</span></td>
234 
+										<td><span class="text_color1">0</span></td>
235 
+										<td><span class="text_color1">0</span></td>
236 
+										<td><span class="text_color1">0</span></td>
237 
+										<td><span class="text_color1">0</span></td>
238 
+										<td><span class="text_color2">0</span></td>
239 
+										<td><span class="text_color3">0</span></td>
240 
+									</tr>
241 
+									<tr>
242 
+										<td>市政管理</td>
243 
+										<td><span class="text_color1">0</span></td>
244 
+										<td><span class="text_color1">0</span></td>
245 
+										<td><span class="text_color1">0</span></td>
246 
+										<td><span class="text_color1">0</span></td>
247 
+										<td><span class="text_color1">0</span></td>
248 
+										<td><span class="text_color2">0</span></td>
249 
+										<td><span class="text_color3">0</span></td>
250 
+									</tr>
251 
+									<tr>
252 
+										<td>水电气暖</td>
253 
+										<td><span class="text_color1">0</span></td>
254 
+										<td><span class="text_color1">0</span></td>
255 
+										<td><span class="text_color1">0</span></td>
256 
+										<td><span class="text_color1">0</span></td>
257 
+										<td><span class="text_color1">0</span></td>
258 
+										<td><span class="text_color2">0</span></td>
259 
+										<td><span class="text_color3">0</span></td>
260 
+									</tr>
261 
+									<tr>
262 
+										<td>部门效能</td>
263 
+										<td><span class="text_color1">0</span></td>
264 
+										<td><span class="text_color1">0</span></td>
265 
+										<td><span class="text_color1">0</span></td>
266 
+										<td><span class="text_color1">0</span></td>
267 
+										<td><span class="text_color1">0</span></td>
268 
+										<td><span class="text_color2">0</span></td>
269 
+										<td><span class="text_color3">0</span></td>
270 
+									</tr>
271 
+									<tr>
272 
+										<td>办事效率</td>
273 
+										<td><span class="text_color1">0</span></td>
274 
+										<td><span class="text_color1">0</span></td>
275 
+										<td><span class="text_color1">0</span></td>
276 
+										<td><span class="text_color1">0</span></td>
277 
+										<td><span class="text_color1">0</span></td>
278 
+										<td><span class="text_color2">0</span></td>
279 
+										<td><span class="text_color3">0</span></td>
280 
+									</tr> -->
281 
+								</tbody>
282 
+
283 
+							</table>
284 
+
285 
+						</div>
286 
+
287 
+					</div>
288 
+				</div>
289 
+
290 
+				<div class="bottom_right pull-left">
291 
+					<div class="legend_bar clearfix">
292 
+						<div class="title_word pull-left">
293 
+							<span class="col-line"></span> 投诉分类统计
294 
+						</div>
295 
+					</div>
296 
+					<div class="clearfix">
297 
+						<ul class="pull-left complaint_type" style=" width:35%;">
298 
+							<li>
299 
+								<span class="type_name">咨询</span> <span class="type_count">0</span>
300 
+							</li>
301 
+							<li>
302 
+								<span class="type_name">建议</span> <span class="type_count">0</span>
303 
+							</li>
304 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
305 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
306 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
307 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
308 
+						</ul>
309 
+						<!--投诉分类统计-->
310 
+						<div class="pull-right" id="part3" style=" width: 65%;height: 340px;"></div>
311 
+					</div>
312 
+
313 
+				</div>
314 
+
315 
+			</div>
316 
+			<!--</div>-->
317 
+		</div>
318 
+		<script src="js/ScrollDiv.js"></script>
319 
+		<script src="js/complaintsReport.js"></script>
320 
+		<script src="js/setItervalTime.js"></script>
321 
+	</body>
322 
+
323 
+</html>

+ 1 - 1
WebChart_2.0/index1.html
Целия файл 

@@ -44,7 +44,7 @@
44 44
45 45 
 	<body>
46 46 
 		<!--导航栏开始-->
47 
-		<div id="nav1" class="clearfix navSt">
47 
+		<div id="nav5" class="clearfix navSt">
48 48 
 		</div>
49 49 
 		<!--导航栏结束-->
50 50 
 		<div id="wrap">

+ 504 - 0
WebChart_2.0/page1.html
Целия файл 

@@ -0,0 +1,504 @@
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 
+			.slide_right {
18 
+				position: relative;
19 
+			}
20 
+
21 
+			.slide_right .timeWrap input {
22 
+				width: 195px;
23 
+			}
24 
+
25 
+			.slide_right .timeWrap {
26 
+				position: absolute;
27 
+				top: 56px;
28 
+				left: -63px;
29 
+			}
30 
+			.timeWrapPosi{
31 
+				top: 160px !important;
32 
+
33 
+			}
34 
+			.slide_right .twotimeWarp {
35 
+				top: -149px;
36 
+				left: -22px;
37 
+			}
38 
+
39 
+			.slide_right .lasttimeWrap {
40 
+				right: -2px;
41 
+			}
42 
+		</style>
43 
+	</head>
44 
+
45 
+	<body>
46 
+		<!--导航栏开始-->
47 
+		<div id="nav" class="clearfix navSt">
48 
+		</div>
49 
+		<!--导航栏结束-->
50 
+		<div id="wrap">
51 
+			<div class="swiper-container swiper-no-swiping">
52 
+				<div class="swiper-wrapper">
53 
+					<!--第一屏  工单统计-->
54 
+					<div class="swiper-slide">
55 
+
56 
+						<div class="orderStatistic slideCon_bg clearfix">
57 
+							<p class="slide_title slide_title1"></p>
58 
+							<div class="orderCon_left slide_left">
59 
+								<ul>
60 
+									<li>
61 
+										<img src="img/num_icon.png" alt="" />
62 
+										<p class="num_word">
63 
+											<span>新野县</span>
64 
+											<span class="order_count4" id="xyx_count">0</span>
65 
+										</p>
66 
+									</li>
67 
+									<li>
68 
+										<img src="img/num_icon.png" alt="" />
69 
+										<p class="num_word">
70 
+											<span>汉城</span>
71 
+											<span class="order_count4" id="hc_count">0</span>
72 
+										</p>
73 
+									</li>
74 
+									<li>
75 
+										<img src="img/num_icon.png" alt="" />
76 
+										<p class="num_word">
77 
+											<span>汉华</span>
78 
+											<span class="order_count4" id="hh_count">0</span>
79 
+										</p>
80 
+									</li>
81 
+									<li>
82 
+										<img src="img/num_icon.png" alt="" />
83 
+										<p class="num_word">
84 
+											<span>城郊乡</span>
85 
+											<span class="order_count6" id="cjx_count">0</span>
86 
+										</p>
87 
+									</li>
88 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
89 
+									<li>
90 
+										<img src="img/num_icon.png" alt="" />
91 
+										<p class="num_word">
92 
+											<span>上港乡</span>
93 
+											<span class="order_count1" id="sgx_count">0</span>
94 
+										</p>
95 
+									</li>
96 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
97 
+									<li>
98 
+										<img src="img/num_icon.png" alt="" />
99 
+										<p class="num_word">
100 
+											<span>上庄乡</span>
101 
+											<span class="order_count2" id="szx_count">0</span>
102 
+										</p>
103 
+									</li>
104 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
105 
+									<li>
106 
+										<img src="img/num_icon.png" alt="" />
107 
+										<p class="num_word">
108 
+											<span>王集镇</span>
109 
+											<span class="order_count3" id="wjz_count">0</span>
110 
+										</p>
111 
+									</li>
112 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
113 
+
114 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
115 
+									<li>
116 
+										<img src="img/num_icon.png" alt="" />
117 
+										<p class="num_word">
118 
+											<span>新甸铺镇</span>
119 
+											<span class="order_count5" id="xdpz_count">0</span>
120 
+										</p>
121 
+									</li>
122 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
123 
+
124 
+
125 
+								</ul>
126 
+							</div>
127 
+							<div class="orderCon_middle slide_middle">
128 
+								<div class="map_bg">
129 
+									<div id="radarBox" class="ani" swiper-animate-effect="OutOpcity" swiper-animate-duration="infinite" swiper-animate-delay="3s">
130 
+										<div class="radar">
131 
+											<div class="radar_inner"></div>
132 
+										</div>
133 
+									</div>
134 
+									<!-- <div class="quanbgBox quan_SYQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
135 
+										<div class="quanbg">
136 
+											<span class="quan quan1 quan1a "></span>
137 
+											<span class="quan quan2 quan2a "></span>
138 
+											<span class="quan quan3 quan3a "></span>
139 
+											<span class="quan quan4"></span>
140 
+											<span class="quan quan1 quan1b "></span>
141 
+											<span class="quan quan2 quan2b "></span>
142 
+											<span class="quan quan3 quan3b "></span>
143 
+										</div>
144 
+										<span class="txt txt_SYQ">睢阳区</span>
145 
+									</div>
146 
+								 -->
147 
+								</div>
148 
+							</div>
149 
+
150 
+							<div class="orderCon_right slide_right">
151 
+								<div class="timeWrap">
152 
+									<div class="time_box pull-right form-inline">
153 
+										日期<input type="text" id="time1" class="times" />
154 
+									</div>
155 
+								</div>
156 
+								<ul>
157 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
158 
+
159 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
160 
+									<li>
161 
+										<img src="img/num_icon.png" alt="" />
162 
+										<p class="num_word">
163 
+											<span>歪子镇</span>
164 
+											<span class="order_count1" id="wzz_count">0</span>
165 
+										</p>
166 
+									</li>
167 
+									<li>
168 
+										<img src="img/num_icon.png" alt="" />
169 
+										<p class="num_word">
170 
+											<span>樊集乡</span>
171 
+											<span class="order_count2" id="fjx_count">0</span>
172 
+										</p>
173 
+									</li>
174 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
175 
+									<li>
176 
+										<img src="img/num_icon.png" alt="" />
177 
+										<p class="num_word">
178 
+											<span>五星镇</span>
179 
+											<span class="order_count3" id="wxz_count">0</span>
180 
+										</p>
181 
+									</li>
182 
+									<li>
183 
+										<img src="img/num_icon.png" alt="" />
184 
+										<p class="num_word">
185 
+											<span>前高庙乡</span>
186 
+											<span class="order_count3" id="qgmx_count">0</span>
187 
+										</p>
188 
+									</li>
189 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
190 
+									<li>
191 
+										<img src="img/num_icon.png" alt="" />
192 
+										<p class="num_word">
193 
+											<span>王庄镇</span>
194 
+											<span class="order_count4" id="wzz_count1">0</span>
195 
+										</p>
196 
+									</li>
197 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
198 
+									<li>
199 
+										<img src="img/num_icon.png" alt="" />
200 
+										<p class="num_word">
201 
+											<span>沙堰镇</span>
202 
+											<span class="order_count5" id="syz_count">0</span>
203 
+										</p>
204 
+									</li>
205 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
206 
+									<li>
207 
+										<img src="img/num_icon.png" alt="" />
208 
+										<p class="num_word">
209 
+											<span>溧河铺镇</span>
210 
+											<span class="order_count6" id="lhpz_count">0</span>
211 
+										</p>
212 
+									</li>
213 
+									<li>
214 
+										<img src="img/num_icon.png" alt="" />
215 
+										<p class="num_word">
216 
+											<span>施庵镇</span>
217 
+											<span class="order_count6" id="saz_count">0</span>
218 
+										</p>
219 
+									</li>
220 
+									<!-- 施庵镇、前高庙乡 -->
221 
+								</ul>
222 
+							</div>
223 
+
224 
+						</div>
225 
+					</div>
226 
+
227 
+					<!--第二屏  工单渠道来源-->
228 
+					<div class="swiper-slide">
229 
+						<div class="orderSource slideCon_bg clearfix">
230 
+							<p class="slide_title slide_title2"></p>
231 
+							<div class="source_left slide_left">
232 
+								<ul>
233 
+
234 
+									<li class="clearfix" style="margin-top: 120px;">
235 
+										<div class="source_kuang rectangle">
236 
+											<div class="pbout">
237 
+												<div class="percent_box">
238 
+												<div class="percent_out"></div>
239 
+												<div class="percent_in"></div>
240 
+												<div class="percent_word"><p>0%</p></div>
241 
+											</div>
242 
+										</div>
243 
+										<p class="num_word">
244 
+											<span>12345</span>
245 
+											<span>0</span>
246 
+										</p>
247 
+										</div>
248 
+										<div class="line_wrap line two_line twoLeft_line"></div>
249 
+									</li>
250 
+									<li class="clearfix" style="margin-top: 120px;">
251 
+										<div class="source_kuang rectangle">
252 
+											<div class="pbout">
253 
+												<div class="percent_box">
254 
+												<div class="percent_out"></div>
255 
+												<div class="percent_in"></div>
256 
+												<div class="percent_word"><p>0%</p></div>
257 
+											</div>
258 
+										</div>
259 
+										<p class="num_word">
260 
+											<span>信访局</span>
261 
+											<span>0</span>
262 
+										</p>
263 
+										</div>
264 
+										<div class="line_wrap line four_line fourLeft_line"></div>
265 
+									</li>
266 
+								</ul>
267 
+							</div>
268 
+							<div class="source_middle slide_middle">
269 
+								<div class="map_bg1">
270 
+
271 
+								</div>
272 
+							</div>
273 
+							<div class="source_right slide_right">
274 
+								<div class="timeWrap twotimeWarp">
275 
+									<div class="time_box pull-right form-inline">
276 
+										日期<input type="text" id="time2" class="times" />
277 
+									</div>
278 
+								</div>
279 
+								<ul>
280 
+
281 
+									<li class="clearfix" style="margin-top: 120px;">
282 
+										<div class="line_wrap line two_line twoRight_line"></div>
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"><p>0%</p></div>
289 
+											</div>
290 
+										</div>
291 
+										<p class="num_word">
292 
+											<span>纪委监委</span>
293 
+											<span>0</span>
294 
+										</p>
295 
+										</div>
296 
+										<div class="line_wrap line two_line twoLeft_line"></div>
297 
+									</li>
298 
+									<li class="clearfix" style="margin-top: 120px;">
299 
+										<div class="source_kuang rectangle">
300 
+											<div class="pbout">
301 
+												<div class="percent_box">
302 
+												<div class="percent_out"></div>
303 
+												<div class="percent_in"></div>
304 
+												<div class="percent_word"><p>0%</p></div>
305 
+											</div>
306 
+										</div>
307 
+										<p class="num_word">
308 
+											<span>县委组织部</span>
309 
+											<span>0</span>
310 
+										</p>
311 
+										</div>
312 
+										<div class="line_wrap line four_line fourRight_line">
313 
+										</div>
314 
+									</li>
315 
+
316 
+								</ul>
317 
+							</div>
318 
+						</div>
319 
+					</div>
320 
+
321 
+					<!--第四屏  工单状态-->
322 
+					<div class="swiper-slide">
323 
+
324 
+						<div class="slideCon_bg orderState clearfix">
325 
+							<p class="slide_title slide_title4"></p>
326 
+
327 
+							<div class="orderCon_left slide_left">
328 
+								<ul class="orderState_ul">
329 
+									<li>
330 
+										<img src="img/state_XZGD.png" alt="" />
331 
+										<div class="num_word">
332 
+											<p>新增工单</p>
333 
+											<div id="state_xzgd"></div>
334 
+										</div>
335 
+									</li>
336 
+
337 
+									<li>
338 
+										<img src="img/state_DJB.png" alt="" />
339 
+										<div class="num_word">
340 
+											<p>待交办</p>
341 
+											<div id="state_djb"></div>
342 
+										</div>
343 
+									</li>
344 
+									<li>
345 
+										<img src="img/state_DCS.png" alt="" />
346 
+										<div class="num_word">
347 
+											<p>待查收</p>
348 
+											<div id="state_dcs"></div>
349 
+										</div>
350 
+									</li>
351 
+									<li>
352 
+										<img src="img/state_THSH.png" alt="" />
353 
+										<div class="num_word">
354 
+											<p>退回审核</p>
355 
+											<div id="state_thsh"></div>
356 
+										</div>
357 
+									</li>
358 
+									<li>
359 
+										<img src="img/state_BLZ.png" alt="" />
360 
+										<div class="num_word">
361 
+											<p>办理中</p>
362 
+											<div id="state_blz"></div>
363 
+										</div>
364 
+									</li>
365 
+
366 
+								</ul>
367 
+							</div>
368 
+
369 
+							<div class="orderCon_middle slide_middle">
370 
+
371 
+								<div class="earth_box">
372 
+									<div class="earth_quan1"></div>
373 
+									<div class="earth_quan2"></div>
374 
+									<div class="earth_quan3"></div>
375 
+									<div class="earth"></div>
376 
+								</div>
377 
+							</div>
378 
+
379 
+							<div class="orderCon_right slide_right">
380 
+								<div class="timeWrap" style="left: 5px;">
381 
+									<div class="time_box pull-right form-inline">
382 
+										日期<input type="text" id="time4" class="times" />
383 
+									</div>
384 
+								</div>
385 
+								<ul class="orderState_ul">
386 
+									<li class="active">
387 
+										<img src="img/state_YS.png" alt="" />
388 
+										<div class="num_word">
389 
+											<p>延时审核</p>
390 
+											<div id="state_yssh"></div>
391 
+										</div>
392 
+									</li>
393 
+									<li>
394 
+										<img src="img/state_YBL.png" alt="" />
395 
+										<div class="num_word">
396 
+											<p>已办理</p>
397 
+											<div id="state_ybl"></div>
398 
+										</div>
399 
+									</li>
400 
+									<li>
401 
+										<img src="img/state_YHF.png" alt="" />
402 
+										<div class="num_word">
403 
+											<p>已回访</p>
404 
+											<div id="state_yhf"></div>
405 
+										</div>
406 
+									</li>
407 
+									<li>
408 
+										<img src="img/state_CBZ.png" alt="" />
409 
+										<div class="num_word">
410 
+											<p>重办中</p>
411 
+											<div id="state_cbz"></div>
412 
+										</div>
413 
+									</li>
414 
+									<li>
415 
+										<img src="img/state_YJA.png" alt="" />
416 
+										<div class="num_word">
417 
+											<p>已结案</p>
418 
+											<div id="state_yja"></div>
419 
+										</div>
420 
+									</li>
421 
+								</ul>
422 
+
423 
+							</div>
424 
+						</div>
425 
+
426 
+					</div>
427 
+
428 
+					<!--第五屏  话务量统计-->
429 
+					<div class="swiper-slide">
430 
+
431 
+
432 
+						<div class="slideCon_bg trafficVolume clearfix">
433 
+							<p class="slide_title slide_title5"></p>
434 
+							<div class="orderCon_left slide_left">
435 
+								<div class="keyW_t">
436 
+									投诉关键字
437 
+								</div>
438 
+								<div class="tagBox">
439 
+									<div class="tagcloud">
440 
+									</div>
441 
+								</div>
442 
+							</div>
443 
+							<div class="orderCon_right slide_right">
444 
+								<div class="timeWrap lasttimeWrap timeWrapPosi">
445 
+									<div class="time_box pull-right form-inline" style="margin-right: 135px;">
446 
+										日期
447 
+										<input type="text" id="test6" class="times lasttime" style="margin-right: 50px;"/>
448 
+									</div>
449 
+								</div>
450 
+
451 
+								<div class="keyBottom_left pull-left">
452 
+									<div class="table_box table_box_key">
453 
+										<table class="table">
454 
+											<colgroup>
455 
+												<col style="width: 120px;" />
456 
+												<col/>
457 
+											</colgroup>
458 
+											<thead class="thead">
459 
+												<tr>
460 
+													<td style="width: 60%; text-align: center;">部门名称</td>
461 
+													<td style="width: 20%; text-align: center;">数量</td>
462 
+													<td style="width: 20%; text-align: center;">占比</td>
463 
+												</tr>
464 
+											</thead>
465 
+										</table>
466 
+										<div class="scroll_table" style="width: 100%;height: 460px; overflow: hidden;">
467 
+											<table class="table">
468 
+												<colgroup>
469 
+													<col style="width: 120px;" />
470 
+													<col/>
471 
+												</colgroup>
472 
+												<tbody>
473 
+												</tbody>
474 
+											</table>
475 
+										</div>
476 
+									</div>
477 
+								</div>
478 
+							</div>
479 
+						</div>
480 
+					</div>
481 
+
482 
+
483 
+				</div>
484 
+
485 
+				<div class="swiper-button-prev"></div>
486 
+				<div class="swiper-pagination"></div>
487 
+				<div class="swiper-button-next"></div>
488 
+
489 
+			</div>
490 
+
491 
+		</div>
492 
+
493 
+
494 
+		<script src="js/swiper.min.js"></script>
495 
+		<script src="js/swiper.animate1.0.3.min.js"></script>
496 
+		<script src="js/countUp.js"></script>
497 
+		<script src="plugins/numbergd/index.js"></script>
498 
+		<script src="js/tagcloud.js"></script>
499 
+		<script src="js/ScrollDiv.js"></script>
500 
+		<script src="js/index.js"></script>
501 
+		<script src="js/setItervalTime.js"></script>
502 
+	</body>
503 
+
504 
+</html>

+ 579 - 0
WebChart_2.0/page2.html
Целия файл 

@@ -0,0 +1,579 @@
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>新野县12345监控平台</title>
16 
+		<style>
17 
+			.slide_right {
18 
+				position: relative;
19 
+			}
20 
+
21 
+			.slide_right .timeWrap input {
22 
+				width: 195px;
23 
+			}
24 
+
25 
+			.slide_right .timeWrap {
26 
+				position: absolute;
27 
+				top: 56px;
28 
+				left: -63px;
29 
+			}
30 
+			.timeWrapPosi{
31 
+				top: 160px !important;
32 
+
33 
+			}
34 
+			.slide_right .twotimeWarp {
35 
+				top: -149px;
36 
+				left: -22px;
37 
+			}
38 
+
39 
+			.slide_right .lasttimeWrap {
40 
+				right: -2px;
41 
+			}
42 
+		</style>
43 
+	</head>
44 
+
45 
+	<body>
46 
+		<!--导航栏开始-->
47 
+		<div id="nav6" class="clearfix navSt"></div>
48 
+
49 
+		<!--导航栏结束-->
50 
+		<div id="wrap">
51 
+			<div class="swiper-container swiper-no-swiping">
52 
+				<div class="swiper-wrapper">
53 
+					<!--第一屏  工单统计-->
54 
+					<div class="swiper-slide">
55 
+
56 
+						<div class="orderStatistic slideCon_bg clearfix">
57 
+							<p class="slide_title slide_title1"></p>
58 
+							<div class="orderCon_left slide_left">
59 
+								<ul>
60 
+									<li>
61 
+										<img src="img/num_icon.png" alt="" />
62 
+										<p class="num_word">
63 
+											<span>新野县</span>
64 
+											<span class="order_count4" id="xyx_count">0</span>
65 
+										</p>
66 
+									</li>
67 
+									<li>
68 
+										<img src="img/num_icon.png" alt="" />
69 
+										<p class="num_word">
70 
+											<span>汉城</span>
71 
+											<span class="order_count4" id="hc_count">0</span>
72 
+										</p>
73 
+									</li>
74 
+									<li>
75 
+										<img src="img/num_icon.png" alt="" />
76 
+										<p class="num_word">
77 
+											<span>汉华</span>
78 
+											<span class="order_count4" id="hh_count">0</span>
79 
+										</p>
80 
+									</li>
81 
+									<li>
82 
+										<img src="img/num_icon.png" alt="" />
83 
+										<p class="num_word">
84 
+											<span>城郊乡</span>
85 
+											<span class="order_count6" id="cjx_count">0</span>
86 
+										</p>
87 
+									</li>
88 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
89 
+									<li>
90 
+										<img src="img/num_icon.png" alt="" />
91 
+										<p class="num_word">
92 
+											<span>上港乡</span>
93 
+											<span class="order_count1" id="sgx_count">0</span>
94 
+										</p>
95 
+									</li>
96 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
97 
+									<li>
98 
+										<img src="img/num_icon.png" alt="" />
99 
+										<p class="num_word">
100 
+											<span>上庄乡</span>
101 
+											<span class="order_count2" id="szx_count">0</span>
102 
+										</p>
103 
+									</li>
104 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
105 
+									<li>
106 
+										<img src="img/num_icon.png" alt="" />
107 
+										<p class="num_word">
108 
+											<span>王集镇</span>
109 
+											<span class="order_count3" id="wjz_count">0</span>
110 
+										</p>
111 
+									</li>
112 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
113 
+
114 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
115 
+									<li>
116 
+										<img src="img/num_icon.png" alt="" />
117 
+										<p class="num_word">
118 
+											<span>新甸铺镇</span>
119 
+											<span class="order_count5" id="xdpz_count">0</span>
120 
+										</p>
121 
+									</li>
122 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
123 
+
124 
+
125 
+								</ul>
126 
+							</div>
127 
+							<div class="orderCon_middle slide_middle">
128 
+								<div class="map_bg">
129 
+									<div id="radarBox" class="ani" swiper-animate-effect="OutOpcity" swiper-animate-duration="infinite" swiper-animate-delay="3s">
130 
+										<div class="radar">
131 
+											<div class="radar_inner"></div>
132 
+										</div>
133 
+									</div>
134 
+									<!-- <div class="quanbgBox quan_SYQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
135 
+										<div class="quanbg">
136 
+											<span class="quan quan1 quan1a "></span>
137 
+											<span class="quan quan2 quan2a "></span>
138 
+											<span class="quan quan3 quan3a "></span>
139 
+											<span class="quan quan4"></span>
140 
+											<span class="quan quan1 quan1b "></span>
141 
+											<span class="quan quan2 quan2b "></span>
142 
+											<span class="quan quan3 quan3b "></span>
143 
+										</div>
144 
+										<span class="txt txt_SYQ">睢阳区</span>
145 
+									</div>
146 
+								 -->
147 
+								</div>
148 
+							</div>
149 
+
150 
+							<div class="orderCon_right slide_right">
151 
+								<div class="timeWrap">
152 
+									<div class="time_box pull-right form-inline">
153 
+										日期<input type="text" id="time1" class="times" />
154 
+									</div>
155 
+								</div>
156 
+								<ul>
157 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
158 
+
159 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
160 
+									<li>
161 
+										<img src="img/num_icon.png" alt="" />
162 
+										<p class="num_word">
163 
+											<span>歪子镇</span>
164 
+											<span class="order_count1" id="wzz_count">0</span>
165 
+										</p>
166 
+									</li>
167 
+									<li>
168 
+										<img src="img/num_icon.png" alt="" />
169 
+										<p class="num_word">
170 
+											<span>樊集乡</span>
171 
+											<span class="order_count2" id="fjx_count">0</span>
172 
+										</p>
173 
+									</li>
174 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
175 
+									<li>
176 
+										<img src="img/num_icon.png" alt="" />
177 
+										<p class="num_word">
178 
+											<span>五星镇</span>
179 
+											<span class="order_count3" id="wxz_count">0</span>
180 
+										</p>
181 
+									</li>
182 
+									<li>
183 
+										<img src="img/num_icon.png" alt="" />
184 
+										<p class="num_word">
185 
+											<span>前高庙乡</span>
186 
+											<span class="order_count3" id="qgmx_count">0</span>
187 
+										</p>
188 
+									</li>
189 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
190 
+									<li>
191 
+										<img src="img/num_icon.png" alt="" />
192 
+										<p class="num_word">
193 
+											<span>王庄镇</span>
194 
+											<span class="order_count4" id="wzz_count1">0</span>
195 
+										</p>
196 
+									</li>
197 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
198 
+									<li>
199 
+										<img src="img/num_icon.png" alt="" />
200 
+										<p class="num_word">
201 
+											<span>沙堰镇</span>
202 
+											<span class="order_count5" id="syz_count">0</span>
203 
+										</p>
204 
+									</li>
205 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
206 
+									<li>
207 
+										<img src="img/num_icon.png" alt="" />
208 
+										<p class="num_word">
209 
+											<span>溧河铺镇</span>
210 
+											<span class="order_count6" id="lhpz_count">0</span>
211 
+										</p>
212 
+									</li>
213 
+									<li>
214 
+										<img src="img/num_icon.png" alt="" />
215 
+										<p class="num_word">
216 
+											<span>施庵镇</span>
217 
+											<span class="order_count6" id="saz_count">0</span>
218 
+										</p>
219 
+									</li>
220 
+									<!-- 施庵镇、前高庙乡 -->
221 
+								</ul>
222 
+							</div>
223 
+
224 
+						</div>
225 
+					</div>
226 
+
227 
+					<!--第二屏  工单渠道来源-->
228 
+					<div class="swiper-slide">
229 
+						<div class="sourceCon orderSource slideCon_bg clearfix">
230 
+							<p class="slide_title slide_title2"></p>
231 
+							<div class="source_left slide_left">
232 
+								<ul>
233 
+									<li class="clearfix">
234 
+										<div class="line_wrap one_line line oneLeft_line"></div>
235 
+									</li>
236 
+									<li class="clearfix">
237 
+										<div class="line_wrap line two_line twoLeft_line"></div>
238 
+									</li>
239 
+									<li class="clearfix">
240 
+										<div class="line_wrap line three_line threeLeft_line"></div>
241 
+									</li>
242 
+									<li class="clearfix">
243 
+										<div class="line_wrap line four_line fourLeft_line"></div>
244 
+									</li>
245 
+									<li class="clearfix">
246 
+										<div class="line_wrap line five_line fiveLeft_line"></div>
247 
+									</li>
248 
+									<li class="clearfix">
249 
+										<div class="line_wrap line six_line sixLeft_line"></div>
250 
+									</li>
251 
+								</ul>
252 
+							</div>
253 
+							<div class="source_middle slide_middle">
254 
+								<div class="map_bg">
255 
+
256 
+								</div>
257 
+							</div>
258 
+							<div class="source_right slide_right">
259 
+								<div class="timeWrap twotimeWarp">
260 
+									<div class="time_box pull-right form-inline">
261 
+										日期<input type="text" id="time2" class="times" />
262 
+									</div>
263 
+								</div>
264 
+								<ul>
265 
+									<li class="clearfix">
266 
+										<div class="line_wrap one_line line oneRight_line"></div>
267 
+
268 
+									</li>
269 
+									<li class="clearfix">
270 
+										<div class="line_wrap line two_line twoRight_line"></div>
271 
+
272 
+									</li>
273 
+									<li class="clearfix">
274 
+										<div class="line_wrap line three_line threeRight_line"></div>
275 
+									</li>
276 
+									<li class="clearfix">
277 
+										<div class="line_wrap line four_line fourRight_line">
278 
+										</div>
279 
+									</li>
280 
+									<li class="clearfix">
281 
+										<div class="line_wrap line five_line fiveRight_line"></div>
282 
+									</li>
283 
+									<li class="clearfix">
284 
+										<div class="line_wrap line six_line sixRight_line"></div>
285 
+									</li>
286 
+								</ul>
287 
+							</div>
288 
+						</div>
289 
+					</div>
290 
+
291 
+					<!--第三屏  工单类型-->
292 
+					<div class="swiper-slide">
293 
+						<div class="slideCon_bg orderType clearfix">
294 
+							<p class="slide_title slide_title3"></p>
295 
+							<div class="timeWrap twotimeWarp" style="float: right; margin-right: 200px;">
296 
+								<div class="time_box pull-right form-inline time_box_three">
297 
+									日期<input type="text" id="time3" class="times" />
298 
+								</div>
299 
+							</div>
300 
+							<div class="orderTtype_Con">
301 
+								<ul class="clearfix">
302 
+									<li class="active">
303 
+										<div class="typeWord">咨询</div>
304 
+										<img src="img/order_ZX.png" alt="" />
305 
+										<p class="typeWord_line">数据展示</p>
306 
+										<p class="order_count">0</p>
307 
+										<p class="typeWord_line">今日咨询量</p>
308 
+										<p class="order_count">0</p>
309 
+										<p class="typeWord_line">本月咨询量</p>
310 
+										<p class="order_count">0</p>
311 
+										<p class="typeWord_line">咨询总量</p>
312 
+										<div class="persent_box">
313 
+											<div class="persent_kuang">0</div>
314 
+										</div>
315 
+										<p class="persent_word">总计类型占比</p>
316 
+									</li>
317 
+									<li>
318 
+										<div class="typeWord">求助</div>
319 
+										<img src="img/order_QZ.png" alt="" />
320 
+										<p class="typeWord_line">数据展示</p>
321 
+										<p class="order_count">0</p>
322 
+										<p class="typeWord_line">今日求助量</p>
323 
+										<p class="order_count">0</p>
324 
+										<p class="typeWord_line">本月求助量</p>
325 
+										<p class="order_count">0</p>
326 
+										<p class="typeWord_line">求助总量</p>
327 
+										<div class="persent_box">
328 
+											<div class="persent_kuang">0</div>
329 
+										</div>
330 
+										<p class="persent_word">总计类型占比</p>
331 
+									</li>
332 
+									<li>
333 
+										<div class="typeWord">投诉</div>
334 
+										<img src="img/order_TS.png" alt="" />
335 
+										<p class="typeWord_line">数据展示</p>
336 
+										<p class="order_count">0</p>
337 
+										<p class="typeWord_line">今日投诉量</p>
338 
+										<p class="order_count">0</p>
339 
+										<p class="typeWord_line">本月投诉量</p>
340 
+										<p class="order_count">0</p>
341 
+										<p class="typeWord_line">投诉总量</p>
342 
+										<div class="persent_box">
343 
+											<div class="persent_kuang">0</div>
344 
+										</div>
345 
+										<p class="persent_word">总计类型占比</p>
346 
+									</li>
347 
+									<li>
348 
+										<div class="typeWord">建议</div>
349 
+										<img src="img/order_JY.png" alt="" />
350 
+										<p class="typeWord_line">数据展示</p>
351 
+										<p class="order_count">0</p>
352 
+										<p class="typeWord_line">今日建议量</p>
353 
+										<p class="order_count">0</p>
354 
+										<p class="typeWord_line">本月建议量</p>
355 
+										<p class="order_count">0</p>
356 
+										<p class="typeWord_line">建议总量</p>
357 
+										<div class="persent_box">
358 
+											<div class="persent_kuang">0</div>
359 
+										</div>
360 
+										<p class="persent_word">总计类型占比</p>
361 
+									</li>
362 
+									<li>
363 
+										<div class="typeWord">表扬</div>
364 
+										<img src="img/order_BY.png" alt="" />
365 
+										<p class="typeWord_line">数据展示</p>
366 
+										<p class="order_count">0</p>
367 
+										<p class="typeWord_line">今日表扬量</p>
368 
+										<p class="order_count">0</p>
369 
+										<p class="typeWord_line">本月表扬量</p>
370 
+										<p class="order_count">0</p>
371 
+										<p class="typeWord_line">表扬总量</p>
372 
+										<div class="persent_box">
373 
+											<div class="persent_kuang">0</div>
374 
+										</div>
375 
+										<p class="persent_word">总计类型占比</p>
376 
+									</li>
377 
+									<li>
378 
+										<div class="typeWord">其他</div>
379 
+										<img src="img/order_QT.png" alt="" />
380 
+										<p class="typeWord_line">数据展示</p>
381 
+										<p class="order_count">0</p>
382 
+										<p class="typeWord_line">今日其他量</p>
383 
+										<p class="order_count">0</p>
384 
+										<p class="typeWord_line">本月其他量</p>
385 
+										<p class="order_count">0</p>
386 
+										<p class="typeWord_line">其他总量</p>
387 
+										<div class="persent_box">
388 
+											<div class="persent_kuang">0</div>
389 
+										</div>
390 
+										<p class="persent_word">总计类型占比</p>
391 
+									</li>
392 
+								</ul>
393 
+
394 
+							</div>
395 
+						</div>
396 
+					</div>
397 
+
398 
+					<!--第四屏  工单状态-->
399 
+					<div class="swiper-slide">
400 
+
401 
+						<div class="slideCon_bg orderState clearfix">
402 
+							<p class="slide_title slide_title4"></p>
403 
+
404 
+							<div class="orderCon_left slide_left">
405 
+								<ul class="orderState_ul">
406 
+									<li>
407 
+										<img src="img/state_XZGD.png" alt="" />
408 
+										<div class="num_word">
409 
+											<p>新增工单</p>
410 
+											<div id="state_xzgd"></div>
411 
+										</div>
412 
+									</li>
413 
+
414 
+									<li>
415 
+										<img src="img/state_DJB.png" alt="" />
416 
+										<div class="num_word">
417 
+											<p>待交办</p>
418 
+											<div id="state_djb"></div>
419 
+										</div>
420 
+									</li>
421 
+									<li>
422 
+										<img src="img/state_DCS.png" alt="" />
423 
+										<div class="num_word">
424 
+											<p>待查收</p>
425 
+											<div id="state_dcs"></div>
426 
+										</div>
427 
+									</li>
428 
+									<li>
429 
+										<img src="img/state_THSH.png" alt="" />
430 
+										<div class="num_word">
431 
+											<p>退回审核</p>
432 
+											<div id="state_thsh"></div>
433 
+										</div>
434 
+									</li>
435 
+									<li>
436 
+										<img src="img/state_BLZ.png" alt="" />
437 
+										<div class="num_word">
438 
+											<p>办理中</p>
439 
+											<div id="state_blz"></div>
440 
+										</div>
441 
+									</li>
442 
+
443 
+								</ul>
444 
+							</div>
445 
+
446 
+							<div class="orderCon_middle slide_middle">
447 
+
448 
+								<div class="earth_box">
449 
+									<div class="earth_quan1"></div>
450 
+									<div class="earth_quan2"></div>
451 
+									<div class="earth_quan3"></div>
452 
+									<div class="earth"></div>
453 
+								</div>
454 
+							</div>
455 
+
456 
+							<div class="orderCon_right slide_right">
457 
+								<div class="timeWrap" style="left: 5px;">
458 
+									<div class="time_box pull-right form-inline">
459 
+										日期<input type="text" id="time4" class="times" />
460 
+									</div>
461 
+								</div>
462 
+								<ul class="orderState_ul">
463 
+									<li class="active">
464 
+										<img src="img/state_YS.png" alt="" />
465 
+										<div class="num_word">
466 
+											<p>延时审核</p>
467 
+											<div id="state_yssh"></div>
468 
+										</div>
469 
+									</li>
470 
+									<li>
471 
+										<img src="img/state_YBL.png" alt="" />
472 
+										<div class="num_word">
473 
+											<p>已办理</p>
474 
+											<div id="state_ybl"></div>
475 
+										</div>
476 
+									</li>
477 
+									<li>
478 
+										<img src="img/state_YHF.png" alt="" />
479 
+										<div class="num_word">
480 
+											<p>已回访</p>
481 
+											<div id="state_yhf"></div>
482 
+										</div>
483 
+									</li>
484 
+									<li>
485 
+										<img src="img/state_CBZ.png" alt="" />
486 
+										<div class="num_word">
487 
+											<p>重办中</p>
488 
+											<div id="state_cbz"></div>
489 
+										</div>
490 
+									</li>
491 
+									<li>
492 
+										<img src="img/state_YJA.png" alt="" />
493 
+										<div class="num_word">
494 
+											<p>已结案</p>
495 
+											<div id="state_yja"></div>
496 
+										</div>
497 
+									</li>
498 
+								</ul>
499 
+
500 
+							</div>
501 
+						</div>
502 
+
503 
+					</div>
504 
+
505 
+					<!--第五屏  话务量统计-->
506 
+					<div class="swiper-slide">
507 
+						<div class="slideCon_bg trafficVolume clearfix">
508 
+							<p class="slide_title slide_title5"></p>
509 
+							<div class="orderCon_left slide_left">
510 
+								<div class="keyW_t">
511 
+									投诉关键字
512 
+								</div>
513 
+								<div class="tagBox">
514 
+									<div class="tagcloud">
515 
+									</div>
516 
+								</div>
517 
+							</div>
518 
+							<div class="orderCon_right slide_right">
519 
+								<div class="timeWrap lasttimeWrap timeWrapPosi">
520 
+									<div class="time_box pull-right form-inline" style="margin-right: 135px;">
521 
+										日期
522 
+										<input type="text" id="test6" class="times lasttime" style="margin-right: 50px;"/>
523 
+
524 
+									</div>
525 
+								</div>
526 
+
527 
+								<div class="keyBottom_left pull-left">
528 
+									<div class="table_box table_box_key">
529 
+										<table class="table">
530 
+											<colgroup>
531 
+												<col style="width: 120px;" />
532 
+												<col/>
533 
+											</colgroup>
534 
+											<thead class="thead">
535 
+												<tr>
536 
+													<td style="width: 60%; text-align: center;">部门名称</td>
537 
+													<td style="width: 20%; text-align: center;">数量</td>
538 
+													<td style="width: 20%; text-align: center;">占比</td>
539 
+												</tr>
540 
+											</thead>
541 
+										</table>
542 
+										<div class="scroll_table" style="width: 100%;height: 460px; overflow: hidden;">
543 
+											<table class="table">
544 
+												<colgroup>
545 
+													<col style="width: 120px;" />
546 
+													<col/>
547 
+												</colgroup>
548 
+												<tbody>
549 
+												</tbody>
550 
+											</table>
551 
+										</div>
552 
+									</div>
553 
+								</div>
554 
+							</div>
555 
+						</div>
556 
+					</div>
557 
+
558 
+
559 
+				</div>
560 
+
561 
+				<div class="swiper-button-prev"></div>
562 
+				<div class="swiper-pagination"></div>
563 
+				<div class="swiper-button-next"></div>
564 
+
565 
+			</div>
566 
+
567 
+		</div>
568 
+
569 
+		<script src="js/swiper.min.js"></script>
570 
+		<script src="js/swiper.animate1.0.3.min.js"></script>
571 
+		<script src="js/countUp.js"></script>
572 
+		<script src="plugins/numbergd/index.js"></script>
573 
+		<script src="js/tagcloud.js"></script>
574 
+		<script src="js/ScrollDiv.js"></script>
575 
+		<script src="js/index.js"></script>
576 
+		<script src="js/setItervalTime.js"></script>
577 
+	</body>
578 
+
579 
+</html>

+ 535 - 0
WebChart_2.0/page3.html
Целия файл 

@@ -0,0 +1,535 @@
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 
+			.slide_right {
18 
+				position: relative;
19 
+			}
20 
+
21 
+			.slide_right .timeWrap input {
22 
+				width: 195px;
23 
+			}
24 
+
25 
+			.slide_right .timeWrap {
26 
+				position: absolute;
27 
+				top: 56px;
28 
+				left: -63px;
29 
+			}
30 
+			.timeWrapPosi{
31 
+				top: 160px !important;
32 
+
33 
+			}
34 
+			.slide_right .twotimeWarp {
35 
+				top: -149px;
36 
+				left: -22px;
37 
+			}
38 
+
39 
+			.slide_right .lasttimeWrap {
40 
+				right: -2px;
41 
+			}
42 
+		</style>
43 
+	</head>
44 
+
45 
+	<body>
46 
+		<!--导航栏开始-->
47 
+		<div id="nav3" class="clearfix navSt"></div>
48 
+		<!--导航栏结束-->
49 
+		<div id="wrap">
50 
+			<div class="swiper-container swiper-no-swiping">
51 
+				<div class="swiper-wrapper">
52 
+					<!--第一屏  工单统计-->
53 
+					<div class="swiper-slide">
54 
+
55 
+						<div class="orderStatistic slideCon_bg clearfix">
56 
+							<p class="slide_title slide_title1"></p>
57 
+							<div class="orderCon_left slide_left">
58 
+								<ul>
59 
+									<li>
60 
+										<img src="img/num_icon.png" alt="" />
61 
+										<p class="num_word">
62 
+											<span>新野县</span>
63 
+											<span class="order_count4" id="xyx_count">0</span>
64 
+										</p>
65 
+									</li>
66 
+									<li>
67 
+										<img src="img/num_icon.png" alt="" />
68 
+										<p class="num_word">
69 
+											<span>汉城</span>
70 
+											<span class="order_count4" id="hc_count">0</span>
71 
+										</p>
72 
+									</li>
73 
+									<li>
74 
+										<img src="img/num_icon.png" alt="" />
75 
+										<p class="num_word">
76 
+											<span>汉华</span>
77 
+											<span class="order_count4" id="hh_count">0</span>
78 
+										</p>
79 
+									</li>
80 
+									<li>
81 
+										<img src="img/num_icon.png" alt="" />
82 
+										<p class="num_word">
83 
+											<span>城郊乡</span>
84 
+											<span class="order_count6" id="cjx_count">0</span>
85 
+										</p>
86 
+									</li>
87 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
88 
+									<li>
89 
+										<img src="img/num_icon.png" alt="" />
90 
+										<p class="num_word">
91 
+											<span>上港乡</span>
92 
+											<span class="order_count1" id="sgx_count">0</span>
93 
+										</p>
94 
+									</li>
95 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
96 
+									<li>
97 
+										<img src="img/num_icon.png" alt="" />
98 
+										<p class="num_word">
99 
+											<span>上庄乡</span>
100 
+											<span class="order_count2" id="szx_count">0</span>
101 
+										</p>
102 
+									</li>
103 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
104 
+									<li>
105 
+										<img src="img/num_icon.png" alt="" />
106 
+										<p class="num_word">
107 
+											<span>王集镇</span>
108 
+											<span class="order_count3" id="wjz_count">0</span>
109 
+										</p>
110 
+									</li>
111 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
112 
+
113 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
114 
+									<li>
115 
+										<img src="img/num_icon.png" alt="" />
116 
+										<p class="num_word">
117 
+											<span>新甸铺镇</span>
118 
+											<span class="order_count5" id="xdpz_count">0</span>
119 
+										</p>
120 
+									</li>
121 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
122 
+
123 
+
124 
+								</ul>
125 
+							</div>
126 
+							<div class="orderCon_middle slide_middle">
127 
+								<div class="map_bg">
128 
+									<div id="radarBox" class="ani" swiper-animate-effect="OutOpcity" swiper-animate-duration="infinite" swiper-animate-delay="3s">
129 
+										<div class="radar">
130 
+											<div class="radar_inner"></div>
131 
+										</div>
132 
+									</div>
133 
+									<!-- <div class="quanbgBox quan_SYQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
134 
+										<div class="quanbg">
135 
+											<span class="quan quan1 quan1a "></span>
136 
+											<span class="quan quan2 quan2a "></span>
137 
+											<span class="quan quan3 quan3a "></span>
138 
+											<span class="quan quan4"></span>
139 
+											<span class="quan quan1 quan1b "></span>
140 
+											<span class="quan quan2 quan2b "></span>
141 
+											<span class="quan quan3 quan3b "></span>
142 
+										</div>
143 
+										<span class="txt txt_SYQ">睢阳区</span>
144 
+									</div>
145 
+								 -->
146 
+								</div>
147 
+							</div>
148 
+
149 
+							<div class="orderCon_right slide_right">
150 
+								<div class="timeWrap">
151 
+									<div class="time_box pull-right form-inline">
152 
+										日期<input type="text" id="time1" class="times" />
153 
+									</div>
154 
+								</div>
155 
+								<ul>
156 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
157 
+
158 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
159 
+									<li>
160 
+										<img src="img/num_icon.png" alt="" />
161 
+										<p class="num_word">
162 
+											<span>歪子镇</span>
163 
+											<span class="order_count1" id="wzz_count">0</span>
164 
+										</p>
165 
+									</li>
166 
+									<li>
167 
+										<img src="img/num_icon.png" alt="" />
168 
+										<p class="num_word">
169 
+											<span>樊集乡</span>
170 
+											<span class="order_count2" id="fjx_count">0</span>
171 
+										</p>
172 
+									</li>
173 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
174 
+									<li>
175 
+										<img src="img/num_icon.png" alt="" />
176 
+										<p class="num_word">
177 
+											<span>五星镇</span>
178 
+											<span class="order_count3" id="wxz_count">0</span>
179 
+										</p>
180 
+									</li>
181 
+									<li>
182 
+										<img src="img/num_icon.png" alt="" />
183 
+										<p class="num_word">
184 
+											<span>前高庙乡</span>
185 
+											<span class="order_count3" id="qgmx_count">0</span>
186 
+										</p>
187 
+									</li>
188 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
189 
+									<li>
190 
+										<img src="img/num_icon.png" alt="" />
191 
+										<p class="num_word">
192 
+											<span>王庄镇</span>
193 
+											<span class="order_count4" id="wzz_count1">0</span>
194 
+										</p>
195 
+									</li>
196 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
197 
+									<li>
198 
+										<img src="img/num_icon.png" alt="" />
199 
+										<p class="num_word">
200 
+											<span>沙堰镇</span>
201 
+											<span class="order_count5" id="syz_count">0</span>
202 
+										</p>
203 
+									</li>
204 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
205 
+									<li>
206 
+										<img src="img/num_icon.png" alt="" />
207 
+										<p class="num_word">
208 
+											<span>溧河铺镇</span>
209 
+											<span class="order_count6" id="lhpz_count">0</span>
210 
+										</p>
211 
+									</li>
212 
+									<li>
213 
+										<img src="img/num_icon.png" alt="" />
214 
+										<p class="num_word">
215 
+											<span>施庵镇</span>
216 
+											<span class="order_count6" id="saz_count">0</span>
217 
+										</p>
218 
+									</li>
219 
+									<!-- 施庵镇、前高庙乡 -->
220 
+								</ul>
221 
+							</div>
222 
+
223 
+						</div>
224 
+					</div>
225 
+
226 
+					<!--第二屏  工单渠道来源-->
227 
+					<div class="swiper-slide">
228 
+						<div class="orderSource slideCon_bg clearfix">
229 
+							<p class="slide_title slide_title2"></p>
230 
+							<div class="source_left slide_left">
231 
+								<ul>
232 
+									<li class="clearfix" style="margin-top: 60px;">
233 
+										<div class="source_kuang rectangle">
234 
+											<div class="pbout">
235 
+												<div class="percent_box">
236 
+												<div class="percent_out"></div>
237 
+												<div class="percent_in"></div>
238 
+												<div class="percent_word"><p>0%</p></div>
239 
+											</div>
240 
+										</div>
241 
+										<p class="num_word">
242 
+											<span>电话反映</span>
243 
+											<span>0</span>
244 
+										</p>
245 
+										</div>
246 
+										<div class="line_wrap line two_line twoLeft_line"></div>
247 
+									</li>
248 
+
249 
+									<li class="clearfix" style="margin-top: 120px;">
250 
+										<div class="source_kuang rectangle">
251 
+											<div class="pbout">
252 
+												<div class="percent_box">
253 
+												<div class="percent_out"></div>
254 
+												<div class="percent_in"></div>
255 
+												<div class="percent_word"><p>0%</p></div>
256 
+											</div>
257 
+										</div>
258 
+										<p class="num_word">
259 
+											<span>上门反映</span>
260 
+											<span>0</span>
261 
+										</p>
262 
+										</div>
263 
+										<div class="line_wrap line four_line fourLeft_line"></div>
264 
+									</li>
265 
+
266 
+									<li class="clearfix" style="margin-top: 120px;">
267 
+										<div class="source_kuang rectangle">
268 
+											<div class="pbout">
269 
+												<div class="percent_box">
270 
+												<div class="percent_out"></div>
271 
+												<div class="percent_in"></div>
272 
+												<div class="percent_word"><p>0%</p></div>
273 
+											</div>
274 
+										</div>
275 
+										<p class="num_word">
276 
+											<span>信件反映</span>
277 
+											<span>0</span>
278 
+										</p>
279 
+										</div>
280 
+										<div class="line_wrap line six_line sixLeft_line"></div>
281 
+									</li>
282 
+								</ul>
283 
+							</div>
284 
+							<div class="source_middle slide_middle">
285 
+								<div class="map_bg2">
286 
+
287 
+								</div>
288 
+							</div>
289 
+							<div class="source_right slide_right">
290 
+								<div class="timeWrap twotimeWarp">
291 
+									<div class="time_box pull-right form-inline">
292 
+										日期<input type="text" id="time2" class="times" />
293 
+									</div>
294 
+								</div>
295 
+								<ul>
296 
+
297 
+									<li class="clearfix" style="margin-top: 60px;">
298 
+										<div class="source_kuang rectangle">
299 
+											<div class="pbout">
300 
+												<div class="percent_box">
301 
+												<div class="percent_out"></div>
302 
+												<div class="percent_in"></div>
303 
+												<div class="percent_word"><p>0%</p></div>
304 
+											</div>
305 
+										</div>
306 
+										<p class="num_word">
307 
+											<span>电子信箱</span>
308 
+											<span>0</span>
309 
+										</p>
310 
+										</div>
311 
+										<div class="line_wrap line two_line twoRight_line"></div>
312 
+									</li>
313 
+
314 
+									<li class="clearfix" style="margin-top: 120px;">
315 
+										<div class="source_kuang rectangle">
316 
+											<div class="pbout">
317 
+												<div class="percent_box">
318 
+												<div class="percent_out"></div>
319 
+												<div class="percent_in"></div>
320 
+												<div class="percent_word"><p>0%</p></div>
321 
+											</div>
322 
+										</div>
323 
+										<p class="num_word">
324 
+											<span>网络反映</span>
325 
+											<span>0</span>
326 
+										</p>
327 
+										</div>
328 
+										<div class="line_wrap line four_line fourRight_line"></div>
329 
+									</li>
330 
+
331 
+									<li class="clearfix" style="margin-top: 120px;">
332 
+										<div class="source_kuang rectangle">
333 
+											<div class="pbout">
334 
+												<div class="percent_box">
335 
+												<div class="percent_out"></div>
336 
+												<div class="percent_in"></div>
337 
+												<div class="percent_word"><p>0%</p></div>
338 
+											</div>
339 
+										</div>
340 
+										<p class="num_word">
341 
+											<span>其他渠道</span>
342 
+											<span>0</span>
343 
+										</p>
344 
+										</div>
345 
+										<div class="line_wrap line six_line sixRight_line"></div>
346 
+									</li>
347 
+								</ul>
348 
+							</div>
349 
+						</div>
350 
+					</div>
351 
+
352 
+					<!--第四屏  工单状态-->
353 
+					<div class="swiper-slide">
354 
+
355 
+						<div class="slideCon_bg orderState clearfix">
356 
+							<p class="slide_title slide_title4"></p>
357 
+
358 
+							<div class="orderCon_left slide_left">
359 
+								<ul class="orderState_ul">
360 
+									<li>
361 
+										<img src="img/state_XZGD.png" alt="" />
362 
+										<div class="num_word">
363 
+											<p>新增工单</p>
364 
+											<div id="state_xzgd"></div>
365 
+										</div>
366 
+									</li>
367 
+
368 
+									<li>
369 
+										<img src="img/state_DJB.png" alt="" />
370 
+										<div class="num_word">
371 
+											<p>待交办</p>
372 
+											<div id="state_djb"></div>
373 
+										</div>
374 
+									</li>
375 
+									<li>
376 
+										<img src="img/state_DCS.png" alt="" />
377 
+										<div class="num_word">
378 
+											<p>待查收</p>
379 
+											<div id="state_dcs"></div>
380 
+										</div>
381 
+									</li>
382 
+									<li>
383 
+										<img src="img/state_THSH.png" alt="" />
384 
+										<div class="num_word">
385 
+											<p>退回审核</p>
386 
+											<div id="state_thsh"></div>
387 
+										</div>
388 
+									</li>
389 
+									<li>
390 
+										<img src="img/state_BLZ.png" alt="" />
391 
+										<div class="num_word">
392 
+											<p>办理中</p>
393 
+											<div id="state_blz"></div>
394 
+										</div>
395 
+									</li>
396 
+
397 
+								</ul>
398 
+							</div>
399 
+
400 
+							<div class="orderCon_middle slide_middle">
401 
+
402 
+								<div class="earth_box">
403 
+									<div class="earth_quan1"></div>
404 
+									<div class="earth_quan2"></div>
405 
+									<div class="earth_quan3"></div>
406 
+									<div class="earth"></div>
407 
+								</div>
408 
+							</div>
409 
+
410 
+							<div class="orderCon_right slide_right">
411 
+								<div class="timeWrap" style="left: 5px;">
412 
+									<div class="time_box pull-right form-inline">
413 
+										日期<input type="text" id="time4" class="times" />
414 
+									</div>
415 
+								</div>
416 
+								<ul class="orderState_ul">
417 
+									<li class="active">
418 
+										<img src="img/state_YS.png" alt="" />
419 
+										<div class="num_word">
420 
+											<p>延时审核</p>
421 
+											<div id="state_yssh"></div>
422 
+										</div>
423 
+									</li>
424 
+									<li>
425 
+										<img src="img/state_YBL.png" alt="" />
426 
+										<div class="num_word">
427 
+											<p>已办理</p>
428 
+											<div id="state_ybl"></div>
429 
+										</div>
430 
+									</li>
431 
+									<li>
432 
+										<img src="img/state_YHF.png" alt="" />
433 
+										<div class="num_word">
434 
+											<p>已回访</p>
435 
+											<div id="state_yhf"></div>
436 
+										</div>
437 
+									</li>
438 
+									<li>
439 
+										<img src="img/state_CBZ.png" alt="" />
440 
+										<div class="num_word">
441 
+											<p>重办中</p>
442 
+											<div id="state_cbz"></div>
443 
+										</div>
444 
+									</li>
445 
+									<li>
446 
+										<img src="img/state_YJA.png" alt="" />
447 
+										<div class="num_word">
448 
+											<p>已结案</p>
449 
+											<div id="state_yja"></div>
450 
+										</div>
451 
+									</li>
452 
+								</ul>
453 
+
454 
+							</div>
455 
+						</div>
456 
+
457 
+					</div>
458 
+
459 
+					<!--第五屏  话务量统计-->
460 
+					<div class="swiper-slide">
461 
+
462 
+
463 
+						<div class="slideCon_bg trafficVolume clearfix">
464 
+							<p class="slide_title slide_title5"></p>
465 
+							<div class="orderCon_left slide_left">
466 
+								<div class="keyW_t">
467 
+									投诉关键字
468 
+								</div>
469 
+								<div class="tagBox">
470 
+									<div class="tagcloud">
471 
+									</div>
472 
+								</div>
473 
+							</div>
474 
+							<div class="orderCon_right slide_right">
475 
+								<div class="timeWrap lasttimeWrap timeWrapPosi">
476 
+									<div class="time_box pull-right form-inline" style="margin-right: 135px;">
477 
+										日期
478 
+										<input type="text" id="test6" class="times lasttime" style="margin-right: 50px;"/>
479 
+
480 
+									</div>
481 
+								</div>
482 
+
483 
+								<div class="keyBottom_left pull-left">
484 
+									<div class="table_box table_box_key">
485 
+										<table class="table">
486 
+											<colgroup>
487 
+												<col style="width: 120px;" />
488 
+												<col/>
489 
+											</colgroup>
490 
+											<thead class="thead">
491 
+												<tr>
492 
+													<td style="width: 60%; text-align: center;">部门名称</td>
493 
+													<td style="width: 20%; text-align: center;">数量</td>
494 
+													<td style="width: 20%; text-align: center;">占比</td>
495 
+												</tr>
496 
+											</thead>
497 
+										</table>
498 
+										<div class="scroll_table" style="width: 100%;height: 460px; overflow: hidden;">
499 
+											<table class="table">
500 
+												<colgroup>
501 
+													<col style="width: 120px;" />
502 
+													<col/>
503 
+												</colgroup>
504 
+												<tbody>
505 
+												</tbody>
506 
+											</table>
507 
+										</div>
508 
+									</div>
509 
+								</div>
510 
+							</div>
511 
+						</div>
512 
+					</div>
513 
+
514 
+
515 
+				</div>
516 
+
517 
+				<div class="swiper-button-prev"></div>
518 
+				<div class="swiper-pagination"></div>
519 
+				<div class="swiper-button-next"></div>
520 
+
521 
+			</div>
522 
+
523 
+		</div>
524 
+
525 
+		<script src="js/swiper.min.js"></script>
526 
+		<script src="js/swiper.animate1.0.3.min.js"></script>
527 
+		<script src="js/countUp.js"></script>
528 
+		<script src="plugins/numbergd/index.js"></script>
529 
+		<script src="js/tagcloud.js"></script>
530 
+		<script src="js/ScrollDiv.js"></script>
531 
+		<script src="js/index.js"></script>
532 
+		<script src="js/setItervalTime.js"></script>
533 
+	</body>
534 
+
535 
+</html>

+ 535 - 0
WebChart_2.0/page4.html
Целия файл 

@@ -0,0 +1,535 @@
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 
+			.slide_right {
18 
+				position: relative;
19 
+			}
20 
+
21 
+			.slide_right .timeWrap input {
22 
+				width: 195px;
23 
+			}
24 
+
25 
+			.slide_right .timeWrap {
26 
+				position: absolute;
27 
+				top: 56px;
28 
+				left: -63px;
29 
+			}
30 
+			.timeWrapPosi{
31 
+				top: 160px !important;
32 
+
33 
+			}
34 
+			.slide_right .twotimeWarp {
35 
+				top: -149px;
36 
+				left: -22px;
37 
+			}
38 
+
39 
+			.slide_right .lasttimeWrap {
40 
+				right: -2px;
41 
+			}
42 
+		</style>
43 
+	</head>
44 
+
45 
+	<body>
46 
+		<!--导航栏开始-->
47 
+		<div id="nav2" class="clearfix navSt">
48 
+		</div>
49 
+		<!--导航栏结束-->
50 
+		<div id="wrap">
51 
+			<div class="swiper-container swiper-no-swiping">
52 
+				<div class="swiper-wrapper">
53 
+					<!--第一屏  工单统计-->
54 
+					<div class="swiper-slide">
55 
+
56 
+						<div class="orderStatistic slideCon_bg clearfix">
57 
+							<p class="slide_title slide_title1"></p>
58 
+							<div class="orderCon_left slide_left">
59 
+								<ul>
60 
+									<li>
61 
+										<img src="img/num_icon.png" alt="" />
62 
+										<p class="num_word">
63 
+											<span>新野县</span>
64 
+											<span class="order_count4" id="xyx_count">0</span>
65 
+										</p>
66 
+									</li>
67 
+									<li>
68 
+										<img src="img/num_icon.png" alt="" />
69 
+										<p class="num_word">
70 
+											<span>汉城</span>
71 
+											<span class="order_count4" id="hc_count">0</span>
72 
+										</p>
73 
+									</li>
74 
+									<li>
75 
+										<img src="img/num_icon.png" alt="" />
76 
+										<p class="num_word">
77 
+											<span>汉华</span>
78 
+											<span class="order_count4" id="hh_count">0</span>
79 
+										</p>
80 
+									</li>
81 
+									<li>
82 
+										<img src="img/num_icon.png" alt="" />
83 
+										<p class="num_word">
84 
+											<span>城郊乡</span>
85 
+											<span class="order_count6" id="cjx_count">0</span>
86 
+										</p>
87 
+									</li>
88 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
89 
+									<li>
90 
+										<img src="img/num_icon.png" alt="" />
91 
+										<p class="num_word">
92 
+											<span>上港乡</span>
93 
+											<span class="order_count1" id="sgx_count">0</span>
94 
+										</p>
95 
+									</li>
96 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
97 
+									<li>
98 
+										<img src="img/num_icon.png" alt="" />
99 
+										<p class="num_word">
100 
+											<span>上庄乡</span>
101 
+											<span class="order_count2" id="szx_count">0</span>
102 
+										</p>
103 
+									</li>
104 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
105 
+									<li>
106 
+										<img src="img/num_icon.png" alt="" />
107 
+										<p class="num_word">
108 
+											<span>王集镇</span>
109 
+											<span class="order_count3" id="wjz_count">0</span>
110 
+										</p>
111 
+									</li>
112 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
113 
+
114 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
115 
+									<li>
116 
+										<img src="img/num_icon.png" alt="" />
117 
+										<p class="num_word">
118 
+											<span>新甸铺镇</span>
119 
+											<span class="order_count5" id="xdpz_count">0</span>
120 
+										</p>
121 
+									</li>
122 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
123 
+
124 
+
125 
+								</ul>
126 
+							</div>
127 
+							<div class="orderCon_middle slide_middle">
128 
+								<div class="map_bg">
129 
+									<div id="radarBox" class="ani" swiper-animate-effect="OutOpcity" swiper-animate-duration="infinite" swiper-animate-delay="3s">
130 
+										<div class="radar">
131 
+											<div class="radar_inner"></div>
132 
+										</div>
133 
+									</div>
134 
+									<!-- <div class="quanbgBox quan_SYQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
135 
+										<div class="quanbg">
136 
+											<span class="quan quan1 quan1a "></span>
137 
+											<span class="quan quan2 quan2a "></span>
138 
+											<span class="quan quan3 quan3a "></span>
139 
+											<span class="quan quan4"></span>
140 
+											<span class="quan quan1 quan1b "></span>
141 
+											<span class="quan quan2 quan2b "></span>
142 
+											<span class="quan quan3 quan3b "></span>
143 
+										</div>
144 
+										<span class="txt txt_SYQ">睢阳区</span>
145 
+									</div>
146 
+								 -->
147 
+								</div>
148 
+							</div>
149 
+
150 
+							<div class="orderCon_right slide_right">
151 
+								<div class="timeWrap">
152 
+									<div class="time_box pull-right form-inline">
153 
+										日期<input type="text" id="time1" class="times" />
154 
+									</div>
155 
+								</div>
156 
+								<ul>
157 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
158 
+
159 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
160 
+									<li>
161 
+										<img src="img/num_icon.png" alt="" />
162 
+										<p class="num_word">
163 
+											<span>歪子镇</span>
164 
+											<span class="order_count1" id="wzz_count">0</span>
165 
+										</p>
166 
+									</li>
167 
+									<li>
168 
+										<img src="img/num_icon.png" alt="" />
169 
+										<p class="num_word">
170 
+											<span>樊集乡</span>
171 
+											<span class="order_count2" id="fjx_count">0</span>
172 
+										</p>
173 
+									</li>
174 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
175 
+									<li>
176 
+										<img src="img/num_icon.png" alt="" />
177 
+										<p class="num_word">
178 
+											<span>五星镇</span>
179 
+											<span class="order_count3" id="wxz_count">0</span>
180 
+										</p>
181 
+									</li>
182 
+									<li>
183 
+										<img src="img/num_icon.png" alt="" />
184 
+										<p class="num_word">
185 
+											<span>前高庙乡</span>
186 
+											<span class="order_count3" id="qgmx_count">0</span>
187 
+										</p>
188 
+									</li>
189 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
190 
+									<li>
191 
+										<img src="img/num_icon.png" alt="" />
192 
+										<p class="num_word">
193 
+											<span>王庄镇</span>
194 
+											<span class="order_count4" id="wzz_count1">0</span>
195 
+										</p>
196 
+									</li>
197 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
198 
+									<li>
199 
+										<img src="img/num_icon.png" alt="" />
200 
+										<p class="num_word">
201 
+											<span>沙堰镇</span>
202 
+											<span class="order_count5" id="syz_count">0</span>
203 
+										</p>
204 
+									</li>
205 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
206 
+									<li>
207 
+										<img src="img/num_icon.png" alt="" />
208 
+										<p class="num_word">
209 
+											<span>溧河铺镇</span>
210 
+											<span class="order_count6" id="lhpz_count">0</span>
211 
+										</p>
212 
+									</li>
213 
+									<li>
214 
+										<img src="img/num_icon.png" alt="" />
215 
+										<p class="num_word">
216 
+											<span>施庵镇</span>
217 
+											<span class="order_count6" id="saz_count">0</span>
218 
+										</p>
219 
+									</li>
220 
+									<!-- 施庵镇、前高庙乡 -->
221 
+								</ul>
222 
+							</div>
223 
+
224 
+						</div>
225 
+					</div>
226 
+
227 
+					<!--第二屏  工单渠道来源-->
228 
+					<div class="swiper-slide">
229 
+						<div class="orderSource slideCon_bg clearfix">
230 
+							<p class="slide_title slide_title2"></p>
231 
+							<div class="source_left slide_left">
232 
+								<ul>
233 
+
234 
+									<li class="clearfix" style="margin-top: 60px;">
235 
+										<div class="source_kuang rectangle">
236 
+											<div class="pbout">
237 
+												<div class="percent_box">
238 
+												<div class="percent_out"></div>
239 
+												<div class="percent_in"></div>
240 
+												<div class="percent_word"><p>0%</p></div>
241 
+											</div>
242 
+										</div>
243 
+										<p class="num_word">
244 
+											<span>电话反映</span>
245 
+											<span>0</span>
246 
+										</p>
247 
+										</div>
248 
+										<div class="line_wrap line two_line twoLeft_line"></div>
249 
+									</li>
250 
+
251 
+									<li class="clearfix" style="margin-top: 120px;">
252 
+										<div class="source_kuang rectangle">
253 
+											<div class="pbout">
254 
+												<div class="percent_box">
255 
+												<div class="percent_out"></div>
256 
+												<div class="percent_in"></div>
257 
+												<div class="percent_word"><p>0%</p></div>
258 
+											</div>
259 
+										</div>
260 
+										<p class="num_word">
261 
+											<span>上门反映</span>
262 
+											<span>0</span>
263 
+										</p>
264 
+										</div>
265 
+										<div class="line_wrap line four_line fourLeft_line"></div>
266 
+									</li>
267 
+
268 
+									<li class="clearfix" style="margin-top: 120px;">
269 
+										<div class="source_kuang rectangle">
270 
+											<div class="pbout">
271 
+												<div class="percent_box">
272 
+												<div class="percent_out"></div>
273 
+												<div class="percent_in"></div>
274 
+												<div class="percent_word"><p>0%</p></div>
275 
+											</div>
276 
+										</div>
277 
+										<p class="num_word">
278 
+											<span>信件反映</span>
279 
+											<span>0</span>
280 
+										</p>
281 
+										</div>
282 
+										<div class="line_wrap line six_line sixLeft_line"></div>
283 
+									</li>
284 
+								</ul>
285 
+							</div>
286 
+							<div class="source_middle slide_middle">
287 
+								<div class="map_bg2">
288 
+
289 
+								</div>
290 
+							</div>
291 
+							<div class="source_right slide_right">
292 
+								<div class="timeWrap twotimeWarp">
293 
+									<div class="time_box pull-right form-inline">
294 
+										日期<input type="text" id="time2" class="times" />
295 
+									</div>
296 
+								</div>
297 
+								<ul>
298 
+
299 
+									<li class="clearfix" style="margin-top: 60px;">
300 
+										<div class="source_kuang rectangle">
301 
+											<div class="pbout">
302 
+												<div class="percent_box">
303 
+												<div class="percent_out"></div>
304 
+												<div class="percent_in"></div>
305 
+												<div class="percent_word"><p>0%</p></div>
306 
+											</div>
307 
+										</div>
308 
+										<p class="num_word">
309 
+											<span>电子信箱</span>
310 
+											<span>0</span>
311 
+										</p>
312 
+										</div>
313 
+										<div class="line_wrap line two_line twoRight_line"></div>
314 
+									</li>
315 
+
316 
+									<li class="clearfix" style="margin-top: 120px;">
317 
+										<div class="source_kuang rectangle">
318 
+											<div class="pbout">
319 
+												<div class="percent_box">
320 
+												<div class="percent_out"></div>
321 
+												<div class="percent_in"></div>
322 
+												<div class="percent_word"><p>0%</p></div>
323 
+											</div>
324 
+										</div>
325 
+										<p class="num_word">
326 
+											<span>网络反映</span>
327 
+											<span>0</span>
328 
+										</p>
329 
+										</div>
330 
+										<div class="line_wrap line four_line fourRight_line"></div>
331 
+									</li>
332 
+
333 
+									<li class="clearfix" style="margin-top: 120px;">
334 
+										<div class="source_kuang rectangle">
335 
+											<div class="pbout">
336 
+												<div class="percent_box">
337 
+												<div class="percent_out"></div>
338 
+												<div class="percent_in"></div>
339 
+												<div class="percent_word"><p>0%</p></div>
340 
+											</div>
341 
+										</div>
342 
+										<p class="num_word">
343 
+											<span>其他渠道</span>
344 
+											<span>0</span>
345 
+										</p>
346 
+										</div>
347 
+										<div class="line_wrap line six_line sixRight_line"></div>
348 
+									</li>
349 
+								</ul>
350 
+							</div>
351 
+						</div>
352 
+					</div>
353 
+
354 
+					<!--第四屏  工单状态-->
355 
+					<div class="swiper-slide">
356 
+
357 
+						<div class="slideCon_bg orderState clearfix">
358 
+							<p class="slide_title slide_title4"></p>
359 
+
360 
+							<div class="orderCon_left slide_left">
361 
+								<ul class="orderState_ul">
362 
+									<li>
363 
+										<img src="img/state_XZGD.png" alt="" />
364 
+										<div class="num_word">
365 
+											<p>新增工单</p>
366 
+											<div id="state_xzgd"></div>
367 
+										</div>
368 
+									</li>
369 
+
370 
+									<li>
371 
+										<img src="img/state_DJB.png" alt="" />
372 
+										<div class="num_word">
373 
+											<p>待交办</p>
374 
+											<div id="state_djb"></div>
375 
+										</div>
376 
+									</li>
377 
+									<li>
378 
+										<img src="img/state_DCS.png" alt="" />
379 
+										<div class="num_word">
380 
+											<p>待查收</p>
381 
+											<div id="state_dcs"></div>
382 
+										</div>
383 
+									</li>
384 
+									<li>
385 
+										<img src="img/state_THSH.png" alt="" />
386 
+										<div class="num_word">
387 
+											<p>退回审核</p>
388 
+											<div id="state_thsh"></div>
389 
+										</div>
390 
+									</li>
391 
+									<li>
392 
+										<img src="img/state_BLZ.png" alt="" />
393 
+										<div class="num_word">
394 
+											<p>办理中</p>
395 
+											<div id="state_blz"></div>
396 
+										</div>
397 
+									</li>
398 
+
399 
+								</ul>
400 
+							</div>
401 
+
402 
+							<div class="orderCon_middle slide_middle">
403 
+
404 
+								<div class="earth_box">
405 
+									<div class="earth_quan1"></div>
406 
+									<div class="earth_quan2"></div>
407 
+									<div class="earth_quan3"></div>
408 
+									<div class="earth"></div>
409 
+								</div>
410 
+							</div>
411 
+
412 
+							<div class="orderCon_right slide_right">
413 
+								<div class="timeWrap" style="left: 5px;">
414 
+									<div class="time_box pull-right form-inline">
415 
+										日期<input type="text" id="time4" class="times" />
416 
+									</div>
417 
+								</div>
418 
+								<ul class="orderState_ul">
419 
+									<li class="active">
420 
+										<img src="img/state_YS.png" alt="" />
421 
+										<div class="num_word">
422 
+											<p>延时审核</p>
423 
+											<div id="state_yssh"></div>
424 
+										</div>
425 
+									</li>
426 
+									<li>
427 
+										<img src="img/state_YBL.png" alt="" />
428 
+										<div class="num_word">
429 
+											<p>已办理</p>
430 
+											<div id="state_ybl"></div>
431 
+										</div>
432 
+									</li>
433 
+									<li>
434 
+										<img src="img/state_YHF.png" alt="" />
435 
+										<div class="num_word">
436 
+											<p>已回访</p>
437 
+											<div id="state_yhf"></div>
438 
+										</div>
439 
+									</li>
440 
+									<li>
441 
+										<img src="img/state_CBZ.png" alt="" />
442 
+										<div class="num_word">
443 
+											<p>重办中</p>
444 
+											<div id="state_cbz"></div>
445 
+										</div>
446 
+									</li>
447 
+									<li>
448 
+										<img src="img/state_YJA.png" alt="" />
449 
+										<div class="num_word">
450 
+											<p>已结案</p>
451 
+											<div id="state_yja"></div>
452 
+										</div>
453 
+									</li>
454 
+								</ul>
455 
+
456 
+							</div>
457 
+						</div>
458 
+
459 
+					</div>
460 
+
461 
+					<!--第五屏  话务量统计-->
462 
+					<div class="swiper-slide">
463 
+						<div class="slideCon_bg trafficVolume clearfix">
464 
+							<p class="slide_title slide_title5"></p>
465 
+							<div class="orderCon_left slide_left">
466 
+								<div class="keyW_t">
467 
+									投诉关键字
468 
+								</div>
469 
+								<div class="tagBox">
470 
+									<div class="tagcloud">
471 
+									</div>
472 
+								</div>
473 
+							</div>
474 
+							<div class="orderCon_right slide_right">
475 
+								<div class="timeWrap lasttimeWrap timeWrapPosi">
476 
+									<div class="time_box pull-right form-inline" style="margin-right: 135px;">
477 
+										日期
478 
+										<input type="text" id="test6" class="times lasttime" style="margin-right: 50px;"/>
479 
+
480 
+									</div>
481 
+								</div>
482 
+
483 
+								<div class="keyBottom_left pull-left">
484 
+									<div class="table_box table_box_key">
485 
+										<table class="table">
486 
+											<colgroup>
487 
+												<col style="width: 120px;" />
488 
+												<col/>
489 
+											</colgroup>
490 
+											<thead class="thead">
491 
+												<tr>
492 
+													<td style="width: 60%; text-align: center;">部门名称</td>
493 
+													<td style="width: 20%; text-align: center;">数量</td>
494 
+													<td style="width: 20%; text-align: center;">占比</td>
495 
+												</tr>
496 
+											</thead>
497 
+										</table>
498 
+										<div class="scroll_table" style="width: 100%;height: 460px; overflow: hidden;">
499 
+											<table class="table">
500 
+												<colgroup>
501 
+													<col style="width: 120px;" />
502 
+													<col/>
503 
+												</colgroup>
504 
+												<tbody>
505 
+												</tbody>
506 
+											</table>
507 
+										</div>
508 
+									</div>
509 
+								</div>
510 
+							</div>
511 
+						</div>
512 
+					</div>
513 
+
514 
+
515 
+				</div>
516 
+
517 
+				<div class="swiper-button-prev"></div>
518 
+				<div class="swiper-pagination"></div>
519 
+				<div class="swiper-button-next"></div>
520 
+
521 
+			</div>
522 
+
523 
+		</div>
524 
+
525 
+		<script src="js/swiper.min.js"></script>
526 
+		<script src="js/swiper.animate1.0.3.min.js"></script>
527 
+		<script src="js/countUp.js"></script>
528 
+		<script src="plugins/numbergd/index.js"></script>
529 
+		<script src="js/tagcloud.js"></script>
530 
+		<script src="js/ScrollDiv.js"></script>
531 
+		<script src="js/index.js"></script>
532 
+		<script src="js/setItervalTime.js"></script>
533 
+	</body>
534 
+
535 
+</html>

+ 535 - 0
WebChart_2.0/page5.html
Целия файл 

@@ -0,0 +1,535 @@
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 
+			.slide_right {
18 
+				position: relative;
19 
+			}
20 
+
21 
+			.slide_right .timeWrap input {
22 
+				width: 195px;
23 
+			}
24 
+
25 
+			.slide_right .timeWrap {
26 
+				position: absolute;
27 
+				top: 56px;
28 
+				left: -63px;
29 
+			}
30 
+			.timeWrapPosi{
31 
+				top: 160px !important;
32 
+
33 
+			}
34 
+			.slide_right .twotimeWarp {
35 
+				top: -149px;
36 
+				left: -22px;
37 
+			}
38 
+
39 
+			.slide_right .lasttimeWrap {
40 
+				right: -2px;
41 
+			}
42 
+		</style>
43 
+	</head>
44 
+
45 
+	<body>
46 
+		<!--导航栏开始-->
47 
+		<div id="nav4" class="clearfix navSt">
48 
+		</div>
49 
+		<!--导航栏结束-->
50 
+		<div id="wrap">
51 
+			<div class="swiper-container swiper-no-swiping">
52 
+				<div class="swiper-wrapper">
53 
+					<!--第一屏  工单统计-->
54 
+					<div class="swiper-slide">
55 
+
56 
+						<div class="orderStatistic slideCon_bg clearfix">
57 
+							<p class="slide_title slide_title1"></p>
58 
+							<div class="orderCon_left slide_left">
59 
+								<ul>
60 
+									<li>
61 
+										<img src="img/num_icon.png" alt="" />
62 
+										<p class="num_word">
63 
+											<span>新野县</span>
64 
+											<span class="order_count4" id="xyx_count">0</span>
65 
+										</p>
66 
+									</li>
67 
+									<li>
68 
+										<img src="img/num_icon.png" alt="" />
69 
+										<p class="num_word">
70 
+											<span>汉城</span>
71 
+											<span class="order_count4" id="hc_count">0</span>
72 
+										</p>
73 
+									</li>
74 
+									<li>
75 
+										<img src="img/num_icon.png" alt="" />
76 
+										<p class="num_word">
77 
+											<span>汉华</span>
78 
+											<span class="order_count4" id="hh_count">0</span>
79 
+										</p>
80 
+									</li>
81 
+									<li>
82 
+										<img src="img/num_icon.png" alt="" />
83 
+										<p class="num_word">
84 
+											<span>城郊乡</span>
85 
+											<span class="order_count6" id="cjx_count">0</span>
86 
+										</p>
87 
+									</li>
88 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
89 
+									<li>
90 
+										<img src="img/num_icon.png" alt="" />
91 
+										<p class="num_word">
92 
+											<span>上港乡</span>
93 
+											<span class="order_count1" id="sgx_count">0</span>
94 
+										</p>
95 
+									</li>
96 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
97 
+									<li>
98 
+										<img src="img/num_icon.png" alt="" />
99 
+										<p class="num_word">
100 
+											<span>上庄乡</span>
101 
+											<span class="order_count2" id="szx_count">0</span>
102 
+										</p>
103 
+									</li>
104 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
105 
+									<li>
106 
+										<img src="img/num_icon.png" alt="" />
107 
+										<p class="num_word">
108 
+											<span>王集镇</span>
109 
+											<span class="order_count3" id="wjz_count">0</span>
110 
+										</p>
111 
+									</li>
112 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
113 
+
114 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
115 
+									<li>
116 
+										<img src="img/num_icon.png" alt="" />
117 
+										<p class="num_word">
118 
+											<span>新甸铺镇</span>
119 
+											<span class="order_count5" id="xdpz_count">0</span>
120 
+										</p>
121 
+									</li>
122 
+									<!--<li class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
123 
+
124 
+
125 
+								</ul>
126 
+							</div>
127 
+							<div class="orderCon_middle slide_middle">
128 
+								<div class="map_bg">
129 
+									<div id="radarBox" class="ani" swiper-animate-effect="OutOpcity" swiper-animate-duration="infinite" swiper-animate-delay="3s">
130 
+										<div class="radar">
131 
+											<div class="radar_inner"></div>
132 
+										</div>
133 
+									</div>
134 
+									<!-- <div class="quanbgBox quan_SYQ ani" swiper-animate-effect="showTxt" swiper-animate-duration=".5s" swiper-animate-delay="3.5s">
135 
+										<div class="quanbg">
136 
+											<span class="quan quan1 quan1a "></span>
137 
+											<span class="quan quan2 quan2a "></span>
138 
+											<span class="quan quan3 quan3a "></span>
139 
+											<span class="quan quan4"></span>
140 
+											<span class="quan quan1 quan1b "></span>
141 
+											<span class="quan quan2 quan2b "></span>
142 
+											<span class="quan quan3 quan3b "></span>
143 
+										</div>
144 
+										<span class="txt txt_SYQ">睢阳区</span>
145 
+									</div>
146 
+								 -->
147 
+								</div>
148 
+							</div>
149 
+
150 
+							<div class="orderCon_right slide_right">
151 
+								<div class="timeWrap">
152 
+									<div class="time_box pull-right form-inline">
153 
+										日期<input type="text" id="time1" class="times" />
154 
+									</div>
155 
+								</div>
156 
+								<ul>
157 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4s">-->
158 
+
159 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="4.5s">-->
160 
+									<li>
161 
+										<img src="img/num_icon.png" alt="" />
162 
+										<p class="num_word">
163 
+											<span>歪子镇</span>
164 
+											<span class="order_count1" id="wzz_count">0</span>
165 
+										</p>
166 
+									</li>
167 
+									<li>
168 
+										<img src="img/num_icon.png" alt="" />
169 
+										<p class="num_word">
170 
+											<span>樊集乡</span>
171 
+											<span class="order_count2" id="fjx_count">0</span>
172 
+										</p>
173 
+									</li>
174 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5s">-->
175 
+									<li>
176 
+										<img src="img/num_icon.png" alt="" />
177 
+										<p class="num_word">
178 
+											<span>五星镇</span>
179 
+											<span class="order_count3" id="wxz_count">0</span>
180 
+										</p>
181 
+									</li>
182 
+									<li>
183 
+										<img src="img/num_icon.png" alt="" />
184 
+										<p class="num_word">
185 
+											<span>前高庙乡</span>
186 
+											<span class="order_count3" id="qgmx_count">0</span>
187 
+										</p>
188 
+									</li>
189 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="5.5s">-->
190 
+									<li>
191 
+										<img src="img/num_icon.png" alt="" />
192 
+										<p class="num_word">
193 
+											<span>王庄镇</span>
194 
+											<span class="order_count4" id="wzz_count1">0</span>
195 
+										</p>
196 
+									</li>
197 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6s">-->
198 
+									<li>
199 
+										<img src="img/num_icon.png" alt="" />
200 
+										<p class="num_word">
201 
+											<span>沙堰镇</span>
202 
+											<span class="order_count5" id="syz_count">0</span>
203 
+										</p>
204 
+									</li>
205 
+									<!--<li class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.3s" swiper-animate-delay="6.5s">-->
206 
+									<li>
207 
+										<img src="img/num_icon.png" alt="" />
208 
+										<p class="num_word">
209 
+											<span>溧河铺镇</span>
210 
+											<span class="order_count6" id="lhpz_count">0</span>
211 
+										</p>
212 
+									</li>
213 
+									<li>
214 
+										<img src="img/num_icon.png" alt="" />
215 
+										<p class="num_word">
216 
+											<span>施庵镇</span>
217 
+											<span class="order_count6" id="saz_count">0</span>
218 
+										</p>
219 
+									</li>
220 
+									<!-- 施庵镇、前高庙乡 -->
221 
+								</ul>
222 
+							</div>
223 
+
224 
+						</div>
225 
+					</div>
226 
+
227 
+					<!--第二屏  工单渠道来源-->
228 
+					<div class="swiper-slide">
229 
+						<div class="orderSource slideCon_bg clearfix">
230 
+							<p class="slide_title slide_title2"></p>
231 
+							<div class="source_left slide_left">
232 
+								<ul>
233 
+									<li class="clearfix" style="margin-top: 60px;">
234 
+										<div class="source_kuang rectangle">
235 
+											<div class="pbout">
236 
+												<div class="percent_box">
237 
+												<div class="percent_out"></div>
238 
+												<div class="percent_in"></div>
239 
+												<div class="percent_word"><p>0%</p></div>
240 
+											</div>
241 
+										</div>
242 
+										<p class="num_word">
243 
+											<span>电话反映</span>
244 
+											<span>0</span>
245 
+										</p>
246 
+										</div>
247 
+										<div class="line_wrap line two_line twoLeft_line"></div>
248 
+									</li>
249 
+
250 
+									<li class="clearfix" style="margin-top: 120px;">
251 
+										<div class="source_kuang rectangle">
252 
+											<div class="pbout">
253 
+												<div class="percent_box">
254 
+												<div class="percent_out"></div>
255 
+												<div class="percent_in"></div>
256 
+												<div class="percent_word"><p>0%</p></div>
257 
+											</div>
258 
+										</div>
259 
+										<p class="num_word">
260 
+											<span>上门反映</span>
261 
+											<span>0</span>
262 
+										</p>
263 
+										</div>
264 
+										<div class="line_wrap line four_line fourLeft_line"></div>
265 
+									</li>
266 
+
267 
+									<li class="clearfix" style="margin-top: 120px;">
268 
+										<div class="source_kuang rectangle">
269 
+											<div class="pbout">
270 
+												<div class="percent_box">
271 
+												<div class="percent_out"></div>
272 
+												<div class="percent_in"></div>
273 
+												<div class="percent_word"><p>0%</p></div>
274 
+											</div>
275 
+										</div>
276 
+										<p class="num_word">
277 
+											<span>信件反映</span>
278 
+											<span>0</span>
279 
+										</p>
280 
+										</div>
281 
+										<div class="line_wrap line six_line sixLeft_line"></div>
282 
+									</li>
283 
+								</ul>
284 
+							</div>
285 
+							<div class="source_middle slide_middle">
286 
+								<div class="map_bg2">
287 
+
288 
+								</div>
289 
+							</div>
290 
+							<div class="source_right slide_right">
291 
+								<div class="timeWrap twotimeWarp">
292 
+									<div class="time_box pull-right form-inline">
293 
+										日期<input type="text" id="time2" class="times" />
294 
+									</div>
295 
+								</div>
296 
+								<ul>
297 
+
298 
+									<li class="clearfix" style="margin-top: 60px;">
299 
+										<div class="source_kuang rectangle">
300 
+											<div class="pbout">
301 
+												<div class="percent_box">
302 
+												<div class="percent_out"></div>
303 
+												<div class="percent_in"></div>
304 
+												<div class="percent_word"><p>0%</p></div>
305 
+											</div>
306 
+										</div>
307 
+										<p class="num_word">
308 
+											<span>电子信箱</span>
309 
+											<span>0</span>
310 
+										</p>
311 
+										</div>
312 
+										<div class="line_wrap line two_line twoRight_line"></div>
313 
+									</li>
314 
+
315 
+									<li class="clearfix" style="margin-top: 120px;">
316 
+										<div class="source_kuang rectangle">
317 
+											<div class="pbout">
318 
+												<div class="percent_box">
319 
+												<div class="percent_out"></div>
320 
+												<div class="percent_in"></div>
321 
+												<div class="percent_word"><p>0%</p></div>
322 
+											</div>
323 
+										</div>
324 
+										<p class="num_word">
325 
+											<span>网络反映</span>
326 
+											<span>0</span>
327 
+										</p>
328 
+										</div>
329 
+										<div class="line_wrap line four_line fourRight_line"></div>
330 
+									</li>
331 
+
332 
+									<li class="clearfix" style="margin-top: 120px;">
333 
+										<div class="source_kuang rectangle">
334 
+											<div class="pbout">
335 
+												<div class="percent_box">
336 
+												<div class="percent_out"></div>
337 
+												<div class="percent_in"></div>
338 
+												<div class="percent_word"><p>0%</p></div>
339 
+											</div>
340 
+										</div>
341 
+										<p class="num_word">
342 
+											<span>其他渠道</span>
343 
+											<span>0</span>
344 
+										</p>
345 
+										</div>
346 
+										<div class="line_wrap line six_line sixRight_line"></div>
347 
+									</li>
348 
+								</ul>
349 
+							</div>
350 
+						</div>
351 
+					</div>
352 
+
353 
+					<!--第四屏  工单状态-->
354 
+					<div class="swiper-slide">
355 
+
356 
+						<div class="slideCon_bg orderState clearfix">
357 
+							<p class="slide_title slide_title4"></p>
358 
+
359 
+							<div class="orderCon_left slide_left">
360 
+								<ul class="orderState_ul">
361 
+									<li>
362 
+										<img src="img/state_XZGD.png" alt="" />
363 
+										<div class="num_word">
364 
+											<p>新增工单</p>
365 
+											<div id="state_xzgd"></div>
366 
+										</div>
367 
+									</li>
368 
+
369 
+									<li>
370 
+										<img src="img/state_DJB.png" alt="" />
371 
+										<div class="num_word">
372 
+											<p>待交办</p>
373 
+											<div id="state_djb"></div>
374 
+										</div>
375 
+									</li>
376 
+									<li>
377 
+										<img src="img/state_DCS.png" alt="" />
378 
+										<div class="num_word">
379 
+											<p>待查收</p>
380 
+											<div id="state_dcs"></div>
381 
+										</div>
382 
+									</li>
383 
+									<li>
384 
+										<img src="img/state_THSH.png" alt="" />
385 
+										<div class="num_word">
386 
+											<p>退回审核</p>
387 
+											<div id="state_thsh"></div>
388 
+										</div>
389 
+									</li>
390 
+									<li>
391 
+										<img src="img/state_BLZ.png" alt="" />
392 
+										<div class="num_word">
393 
+											<p>办理中</p>
394 
+											<div id="state_blz"></div>
395 
+										</div>
396 
+									</li>
397 
+
398 
+								</ul>
399 
+							</div>
400 
+
401 
+							<div class="orderCon_middle slide_middle">
402 
+
403 
+								<div class="earth_box">
404 
+									<div class="earth_quan1"></div>
405 
+									<div class="earth_quan2"></div>
406 
+									<div class="earth_quan3"></div>
407 
+									<div class="earth"></div>
408 
+								</div>
409 
+							</div>
410 
+
411 
+							<div class="orderCon_right slide_right">
412 
+								<div class="timeWrap" style="left: 5px;">
413 
+									<div class="time_box pull-right form-inline">
414 
+										日期<input type="text" id="time4" class="times" />
415 
+									</div>
416 
+								</div>
417 
+								<ul class="orderState_ul">
418 
+									<li class="active">
419 
+										<img src="img/state_YS.png" alt="" />
420 
+										<div class="num_word">
421 
+											<p>延时审核</p>
422 
+											<div id="state_yssh"></div>
423 
+										</div>
424 
+									</li>
425 
+									<li>
426 
+										<img src="img/state_YBL.png" alt="" />
427 
+										<div class="num_word">
428 
+											<p>已办理</p>
429 
+											<div id="state_ybl"></div>
430 
+										</div>
431 
+									</li>
432 
+									<li>
433 
+										<img src="img/state_YHF.png" alt="" />
434 
+										<div class="num_word">
435 
+											<p>已回访</p>
436 
+											<div id="state_yhf"></div>
437 
+										</div>
438 
+									</li>
439 
+									<li>
440 
+										<img src="img/state_CBZ.png" alt="" />
441 
+										<div class="num_word">
442 
+											<p>重办中</p>
443 
+											<div id="state_cbz"></div>
444 
+										</div>
445 
+									</li>
446 
+									<li>
447 
+										<img src="img/state_YJA.png" alt="" />
448 
+										<div class="num_word">
449 
+											<p>已结案</p>
450 
+											<div id="state_yja"></div>
451 
+										</div>
452 
+									</li>
453 
+								</ul>
454 
+
455 
+							</div>
456 
+						</div>
457 
+
458 
+					</div>
459 
+
460 
+					<!--第五屏  话务量统计-->
461 
+					<div class="swiper-slide">
462 
+
463 
+
464 
+						<div class="slideCon_bg trafficVolume clearfix">
465 
+							<p class="slide_title slide_title5"></p>
466 
+							<div class="orderCon_left slide_left">
467 
+								<div class="keyW_t">
468 
+									投诉关键字
469 
+								</div>
470 
+								<div class="tagBox">
471 
+									<div class="tagcloud">
472 
+									</div>
473 
+								</div>
474 
+							</div>
475 
+							<div class="orderCon_right slide_right">
476 
+								<div class="timeWrap lasttimeWrap timeWrapPosi">
477 
+									<div class="time_box pull-right form-inline" style="margin-right: 135px;">
478 
+										日期
479 
+										<input type="text" id="test6" class="times lasttime" style="margin-right: 50px;"/>
480 
+									</div>
481 
+								</div>
482 
+
483 
+								<div class="keyBottom_left pull-left">
484 
+									<div class="table_box table_box_key">
485 
+										<table class="table">
486 
+											<colgroup>
487 
+												<col style="width: 120px;" />
488 
+												<col/>
489 
+											</colgroup>
490 
+											<thead class="thead">
491 
+												<tr>
492 
+													<td style="width: 60%; text-align: center;">部门名称</td>
493 
+													<td style="width: 20%; text-align: center;">数量</td>
494 
+													<td style="width: 20%; text-align: center;">占比</td>
495 
+												</tr>
496 
+											</thead>
497 
+										</table>
498 
+										<div class="scroll_table" style="width: 100%;height: 460px; overflow: hidden;">
499 
+											<table class="table">
500 
+												<colgroup>
501 
+													<col style="width: 120px;" />
502 
+													<col/>
503 
+												</colgroup>
504 
+												<tbody>
505 
+												</tbody>
506 
+											</table>
507 
+										</div>
508 
+									</div>
509 
+								</div>
510 
+							</div>
511 
+						</div>
512 
+					</div>
513 
+
514 
+
515 
+				</div>
516 
+
517 
+				<div class="swiper-button-prev"></div>
518 
+				<div class="swiper-pagination"></div>
519 
+				<div class="swiper-button-next"></div>
520 
+
521 
+			</div>
522 
+
523 
+		</div>
524 
+
525 
+		<script src="js/swiper.min.js"></script>
526 
+		<script src="js/swiper.animate1.0.3.min.js"></script>
527 
+		<script src="js/countUp.js"></script>
528 
+		<script src="plugins/numbergd/index.js"></script>
529 
+		<script src="js/tagcloud.js"></script>
530 
+		<script src="js/ScrollDiv.js"></script>
531 
+		<script src="js/index.js"></script>
532 
+		<script src="js/setItervalTime.js"></script>
533 
+	</body>
534 
+
535 
+</html>

+ 23 - 24
WebChart_2.0/plugins/numbergd/index.html
Целия файл 

@@ -1,28 +1,27 @@
1 1 
 <!DOCTYPE html>
2 2 
 <html lang="zh-CN">
3 
-<head>
4 
-    <meta charset="utf-8"/>
5 
-    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
6 
-    <!--优先使用 IE 最新版本和 Chrome-->
7 
-    <meta name="renderer" content="webkit"/>
8 
-    <meta name="keywords" content="Title"/>
9 
-    <link href="globle.css" rel="stylesheet">
10 
-    <script src="../../js/jquery.min.js"></script>
11 
-    <script type="text/javascript" src="index.js"></script>
12 
-    <title>数字滚动</title>
13 
-</head>
14 
-<body>
15 
-    <div id="dataNums" > </div>
16 
-<script>
17 
-    $(function(){
18 
-
19 
-    		 $("#dataNums").rollNum({
20 
-            deVal:parseInt(Math.random()*1000)
21 
-        });
3 
+	<head>
4 
+		<meta charset="utf-8" />
5 
+		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
6 
+		<!--优先使用 IE 最新版本和 Chrome-->
7 
+		<meta name="renderer" content="webkit" />
8 
+		<meta name="keywords" content="Title" />
9 
+		<link href="globle.css" rel="stylesheet">
10 
+		<script src="../../js/jquery.min.js"></script>
11 
+		<script type="text/javascript" src="index.js"></script>
12 
+		<title>数字滚动</title>
13 
+	</head>
14 
+	<body>
15 
+		<div id="dataNums"></div>
16 
+		<script>
17 
+			$(function() {
18 
+				setInterval(function() {
19 
+					$("#dataNums").rollNum({
20 
+						deVal: parseInt(Math.random() * 1000)
21 
+					});
22 
+				}, 5000);
22 23
23 
-
24 
-
25 
-    });
26 
-</script>
27 
-</body>
24 
+			});
25 
+		</script>
26 
+	</body>
28 27 
 </html>

+ 178 - 0
WebChart_2.0/receiptDepartment1.html
Целия файл 

@@ -0,0 +1,178 @@
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/index.css" />
12 
+		<title>接单部门</title>
13 
+		<style>
14 
+			.selects{
15 
+    			height: initial;
16 
+
17 
+			}
18 
+			#phone_time{
19 
+				width: 199px;
20 
+			}
21 
+			.selects_box:before{
22 
+				z-index: 1;
23 
+			}
24 
+			.phone_bottom >div:last-child{
25 
+				width: 44%;
26 
+				margin-left: 1%;
27 
+				 background: url(img/jd_bg3.png) no-repeat center;
28 
+				 background-size: 100% 100%;
29 
+			}
30 
+			.phone_bottom >div:first-child{
31 
+				 background: url(img/jd_bg2.png) no-repeat center;
32 
+				 background-size: 100% 100%;
33 
+				width: 55%;
34 
+			}
35 
+			.phone_bottom >div:first-child table{
36 
+				width: 95%;
37 
+				margin: 0 auto;
38 
+				color: #fff;
39 
+				font-size: 12px;
40 
+			}
41 
+			.table_box{
42 
+				margin-top: 30px;
43 
+			}
44 
+			.table>tbody>tr>td{
45 
+				border-top: 1px solid #3160a2;
46 
+				color: #00e9ff;
47 
+			}
48 
+			.table>thead>tr>td{
49 
+				border-top: 2px solid #3160a2;
50 
+			}
51 
+			.table>tbody>tr>td:first-child{
52 
+				color: #fff;
53 
+			}
54 
+			table thead, tbody tr {
55 
+	            display:table;
56 
+	            width:100%;
57 
+	            table-layout:fixed;
58 
+	        }
59 
+	       .table>tbody>tr>td:last-child{
60 
+	        	color: #95e193;
61 
+	        }
62 
+	       .table>tbody>tr>td:nth-last-child(2){
63 
+	        	color: #ec6969!important;
64 
+	        }
65 
+		</style>
66 
+	</head>
67 
+
68 
+	<body>
69 
+		<!--导航栏开始-->
70 
+		<div id="nav6" class="clearfix navSt">
71 
+
72 
+		</div>
73 
+		<!--导航栏结束-->
74 
+		<div id="wrap" class="container">
75 
+				<div class="phone_top">
76 
+				<div class="legend_bar clearfix">
77 
+					<div class="title_word pull-left">
78 
+						<span class="col-line"></span> 工单状态统计
79 
+					</div>
80 
+					<div class="time_box pull-right form-inline">
81 
+						日期<input type="text" id="phone_time" class="times"/>
82 
+					</div>
83 
+					<!--<div class="time_box pull-right form-inline selects_box">
84 
+						筛选<select name="" class="selects" id="">
85 
+							<option value="">全部</option>
86 
+							<option value="">已审核</option>
87 
+							<option value="">未审核</option>
88 
+							<option value="">未审核</option>
89 
+							<option value="">未审核</option>
90 
+						</select>
91 
+					</div>-->
92 
+				</div>
93 
+				<div id="phoneTimeCount" style="width: 100%;height: 400px;"></div>
94 
+			</div>
95 
+			<!--<div class="row">-->
96 
+				<div class="phone_bottom clearfix">
97 
+				<div class="bottom_left pull-left">
98 
+					<div class="legend_bar clearfix">
99 
+					<div class="title_word pull-left">
100 
+						<span class="col-line"></span> 各部门受理工单情况统计
101 
+					</div>
102 
+					<div class="pull-right form-inline" style="color: #FFFFFF; margin-right: 40px;">
103 
+						部门 :<select class="selects" id="dep"></select>
104 
+					</div>
105 
+
106 
+				</div>
107 
+					<!--各部门受理工单情况统计-->
108 
+					<!--<div id="phoneTimeCount" style="width: 100%;height: 390px;"></div>-->
109 
+					<div class="table_box" style="width: 100%;height: 390px;">
110 
+						<table class="table">
111 
+							<colgroup>
112 
+				                <col style="width: 120px;"/>
113 
+				                <col/>
114 
+						    </colgroup>
115 
+						    <thead class="thead">
116 
+								<tr>
117 
+									<td>部门名称</td>
118 
+									<td>咨询</td>
119 
+									<td>求助</td>
120 
+									<td>建议</td>
121 
+									<td>表扬</td>
122 
+									<td>其他</td>
123 
+									<td>合计工单</td>
124 
+									<td>占比</td>
125 
+								</tr>
126 
+							</thead>
127 
+						</table>
128 
+						<div id="scroll_table"  style="width: 100%;height: 300px; overflow: hidden;">
129 
+							<table class="table">
130 
+							<colgroup>
131 
+									<col style="width: 120px;"/>
132 
+									<col/>
133 
+						    </colgroup>
134 
+							<tbody>
135 
+								<!-- <tr>
136 
+									<td>市公安局</td>
137 
+									<td><span class="text_color1">0</span></td>
138 
+									<td><span class="text_color1">0</span></td>
139 
+									<td><span class="text_color1">0</span></td>
140 
+									<td><span class="text_color1">0</span></td>
141 
+									<td><span class="text_color1">0</span></td>
142 
+									<td><span class="text_color2">0</span></td>
143 
+									<td><span class="text_color3">0%</span></td>
144 
+								</tr>
145 
+								<tr>
146 
+									<td>市公安局</td>
147 
+									<td><span class="text_color1">0</span></td>
148 
+									<td><span class="text_color1">0</span></td>
149 
+									<td><span class="text_color1">0</span></td>
150 
+									<td><span class="text_color1">0</span></td>
151 
+									<td><span class="text_color1">0</span></td>
152 
+									<td><span class="text_color2">0</span></td>
153 
+									<td><span class="text_color3">0%</span></td>
154 
+								</tr> -->
155 
+							</tbody>
156 
+						</table>
157 
+						</div>
158 
+					</div>
159 
+				</div>
160 
+				<div class="bottom_right pull-left">
161 
+					<div class="legend_bar clearfix">
162 
+					<div class="title_word pull-left">
163 
+						<span class="col-line"></span> 工单处理时间分布
164 
+					</div>
165 
+				</div>
166 
+					<!--话务量实时统计-->
167 
+					<div id="sitProportion" style=" width: 95%;height: 385px;"></div>
168 
+				</div>
169 
+
170 
+			</div>
171 
+			<!--</div>-->
172 
+		</div>
173 
+		<script src="js/ScrollDiv.js"></script>
174 
+		<script src="js/receiptDepartment.js"></script>
175 
+		<script src="js/setItervalTime.js"></script>
176 
+	</body>
177 
+
178 
+</html>

+ 245 - 0
WebChart_2.0/sourceChannel1.html
Целия файл 

@@ -0,0 +1,245 @@
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/index.css" />
12 
+		<title>来源渠道</title>
13 
+		<style>
14 
+			.selects {
15 
+				height: initial;
16 
+			}
17 
+
18 
+			#time2,
19 
+			#time3 {
20 
+				width: 198px;
21 
+			}
22 
+			.phone_bottom>div:last-child {
23 
+				width: 49%;
24 
+				margin-left: 1%;
25 
+				background: url(img/jd_bg2.png) no-repeat center;
26 
+				background-size: 100% 100%;
27 
+			}
28 
+
29 
+			.phone_bottom>div:first-child {
30 
+				background: url(img/jd_bg2.png) no-repeat center;
31 
+				background-size: 100% 100%;
32 
+				width: 50%;
33 
+			}
34 
+
35 
+			.phone_bottom>div:first-child table {
36 
+				width: 95%;
37 
+				margin: 0 auto;
38 
+				color: #fff;
39 
+				font-size: 12px;
40 
+			}
41 
+
42 
+			.table_box {
43 
+				margin-top: 30px;
44 
+			}
45 
+
46 
+			.table>tbody>tr>td {
47 
+				border-top: 1px solid #3160a2;
48 
+			}
49 
+
50 
+			.table>thead>tr>td {
51 
+				border-top: 2px solid #3160a2;
52 
+			}
53 
+
54 
+			.text_color1 {
55 
+				color: #00e9ff;
56 
+			}
57 
+
58 
+			.text_color2 {
59 
+				color: #ec6969;
60 
+			}
61 
+
62 
+			.text_color3 {
63 
+				color: #95e193;
64 
+			}
65 
+
66 
+			table thead,
67 
+			tbody tr {
68 
+				display: table;
69 
+				width: 100%;
70 
+				table-layout: fixed;
71 
+			}
72 
+
73 
+			.quadrangle {
74 
+				display: inline-block;
75 
+				width: 9px;
76 
+				height: 20px;
77 
+				background: #69e1a9;
78 
+				transform: skewX(20deg);
79 
+			}
80 
+
81 
+			.bottom_right li {
82 
+				position: relative;
83 
+				width: 134px;
84 
+				height: 20px;
85 
+				line-height: 15px;
86 
+				margin-top: 20px;
87 
+
88 
+			}
89 
+			.bottom_right ul.complaint_typeL li{
90 
+				text-align: right;
91 
+					margin-left: 30px;
92 
+			}
93 
+			.bottom_right ul.complaint_typeR li{
94 
+					text-align: left;
95 
+					/*margin-right: 25px;*/
96 
+			}
97 
+
98 
+			.bottom_right ul li:nth-of-type(1) {
99 
+				margin-top: 50px;
100 
+				background: url(img/sbx_line0.png) no-repeat;
101 
+			}
102 
+
103 
+			.bottom_right ul li:nth-of-type(2) {
104 
+				background: url(img/sbx_line1.png) no-repeat;
105 
+			}
106 
+			.bottom_right ul.complaint_typeR li:nth-of-type(1) {
107 
+				background: url(img/sbx_liner0.png) no-repeat;
108 
+			}
109 
+			.bottom_right ul.complaint_typeR li:nth-of-type(2) {
110 
+				background: url(img/sbx_liner1.png) no-repeat;
111 
+			}
112 
+
113 
+			.bottom_right ul li:nth-of-type(3) {
114 
+				background: url(img/sbx_line2.png) no-repeat;
115 
+			}
116 
+			.bottom_right ul.complaint_typeR li:nth-of-type(3) {
117 
+				background: url(img/sbx_liner2.png) no-repeat;
118 
+			}
119 
+			.bottom_right ul li:nth-of-type(4) {
120 
+				background: url(img/sbx_line3.png) no-repeat;
121 
+			}
122 
+			.bottom_right ul.complaint_typeR li:nth-of-type(4) {
123 
+				background: url(img/sbx_liner3.png) no-repeat;
124 
+			}
125 
+			.bottom_right ul li:nth-of-type(5) {
126 
+				background: url(img/sbx_line4.png) no-repeat;
127 
+			}
128 
+			.bottom_right ul.complaint_typeR li:nth-of-type(5) {
129 
+				background: url(img/sbx_liner4.png) no-repeat;
130 
+			}
131 
+			.bottom_right ul li:nth-of-type(6) {
132 
+				background: url(img/sbx_line5.png) no-repeat;
133 
+			}
134 
+			.bottom_right ul li:nth-of-type(7) {
135 
+				background: url(img/sbx_line5.png) no-repeat;
136 
+			}
137 
+			.bottom_right ul li:nth-of-type(8) {
138 
+				background: url(img/sbx_line5.png) no-repeat;
139 
+			}
140 
+			.bottom_right ul.complaint_typeR li:nth-of-type(6) {
141 
+				background: url(img/sbx_liner5.png) no-repeat;
142 
+			}
143 
+			.bottom_right ul.complaint_typeR li:nth-of-type(7) {
144 
+				background: url(img/sbx_liner5.png) no-repeat;
145 
+			}
146 
+			.bottom_right ul.complaint_typeR li:nth-of-type(8) {
147 
+				background: url(img/sbx_liner5.png) no-repeat;
148 
+			}
149 
+			.type_name {
150 
+				color: #00e9ff;
151 
+			}
152 
+
153 
+			.type_count {
154 
+				color: #fff;
155 
+				margin-left: 18px;
156 
+			}
157 
+			.time_box_posi{
158 
+				position: absolute;
159 
+				top: 30px;
160 
+				right: -10px;
161 
+			}
162 
+			.time_box_posi:before{
163 
+				left: 195px;
164 
+			}
165 
+		</style>
166 
+	</head>
167 
+
168 
+	<body>
169 
+		<!--导航栏开始-->
170 
+		<div id="nav6" class="clearfix navSt">
171 
+
172 
+		</div>
173 
+		<!--导航栏结束-->
174 
+		<div id="wrap" class="container">
175 
+			<div class="phone_top">
176 
+				<div class="legend_bar clearfix " style="position: relative;">
177 
+					<div class="title_word pull-left">
178 
+						<span class="col-line"></span> 受理群众区域统计
179 
+					</div>
180 
+					<div class="time_box pull-right form-inline">
181 
+						日期<input type="text" id="time2" class="times" />
182 
+					</div>
183 
+				</div>
184 
+				<div id="part_1" style="width: 100%;height: 400px;"></div>
185 
+			</div>
186 
+			<!--<div class="row">-->
187 
+			<div class="phone_bottom clearfix">
188 
+				<div class="bottom_left pull-left">
189 
+					<div class="legend_bar clearfix">
190 
+						<div class="title_word pull-left">
191 
+							<span class="col-line"></span> 渠道来源统计
192 
+						</div>
193 
+
194 
+					</div>
195 
+					<!--渠道来源统计-->
196 
+					<div id="source" style="width: 100%; height: 390px;"></div>
197 
+
198 
+				</div>
199 
+
200 
+				<div class="bottom_right pull-left">
201 
+					<div class="legend_bar clearfix">
202 
+						<div class="title_word pull-left">
203 
+							<span class="col-line"></span> 受理区域统计
204 
+						</div>
205 
+					</div>
206 
+					<div class="clearfix">
207 
+						<ul class="pull-left complaint_typeL" style=" width:25%;">
208 
+							<li>
209 
+								<span class="type_name">咨询</span> <span class="type_count">0</span>
210 
+							</li>
211 
+							<li>
212 
+								<span class="type_name">建议</span> <span class="type_count">0</span>
213 
+							</li>
214 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
215 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
216 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
217 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
218 
+							li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
219 
+						</ul>
220 
+						<!--投诉分类统计-->
221 
+						<div class="pull-left" id="part3" style=" width: 50%;height: 340px;"></div>
222 
+
223 
+						<ul class="pull-left complaint_typeR" style=" width:25%;">
224 
+							<li>
225 
+								<span class="type_name">咨询</span> <span class="type_count">0</span>
226 
+							</li>
227 
+							<li>
228 
+								<span class="type_name">建议</span> <span class="type_count">0</span>
229 
+							</li>
230 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
231 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
232 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
233 
+							<li> <span class="type_name">咨询</span> <span class="type_count">0</span></li>
234 
+						</ul>
235 
+					</div>
236 
+				</div>
237 
+
238 
+			</div>
239 
+			<!--</div>-->
240 
+		</div>
241 
+		<script src="js/sourceChannel.js"></script>
242 
+		<script src="js/setItervalTime.js"></script>
243 
+	</body>
244 
+
245 
+</html>

+ 119 - 0
WebUI/CallCenterWeb.UI/SystemManager/css/fivePoints.css
Целия файл 

@@ -0,0 +1,119 @@
1 
+			.box {
2 
+				width: 30%;
3 
+			}
4 
+			.delModel .box,.zdlist_delModel .box{
5 
+				    width: 23%;
6 
+			}
7 
+			/*.boxCon {
8 
+				width: 100%;
9 
+				background: #fff;
10 
+				/*text-align: center;*/
11 
+				/*padding: 10px 15px;
12 
+				height: 340px;
13 
+				overflow-y: auto;*/
14 
+			/*}*/
15 
+
16 
+			.boxCon table {
17 
+				width: 100%;
18 
+			}
19 
+
20 
+
21 
+			.inpBox {
22 
+				border: 1px solid #a9a9a9;
23 
+				height: 27px;
24 
+				width: 37%;;
25 
+				display: inline-block;
26 
+				position: relative;
27 
+				vertical-align: middle;
28 
+			}
29 
+
30 
+			.inps1,
31 
+			.inps4{
32 
+				width: 100%;
33 
+				height: 24px;
34 
+				outline: none;
35 
+				border: 0;
36 
+				border-image-width: 0;
37 
+				padding: 0;
38 
+				padding-left: 3px;
39 
+			}
40 
+			.changeCode,.addzdz,.addSort{
41 
+				width: 55%;
42 
+			}
43 
+
44 
+			.xl {
45 
+				display: inline-block;
46 
+				background: url(../../img/dropDown.png) no-repeat;
47 
+				height: 100%;
48 
+				background-position: center center;
49 
+				width: 20px;
50 
+				position: absolute;
51 
+				right: 0;
52 
+				top: 0px;
53 
+				/*background-color: #f7bc8b;*/
54 
+				cursor: pointer;
55 
+			}
56 
+
57 
+			/*.xl:hover {
58 
+				background-color: #e6d523;
59 
+			}*/
60 
+
61 
+			.addTree {
62 
+				background: #fff;
63 
+				position: absolute;
64 
+				width: 100%;
65 
+				border: 1px solid darkgrey;
66 
+				right: 0;
67 
+				top: 26px;
68 
+				display: none;
69 
+				height: 220px;
70 
+				overflow-y: auto;
71 
+			}
72 
+
73 
+			.treeTable {
74 
+				height: 400px;
75 
+				/*overflow-y: auto;*/
76 
+			}
77 
+
78 
+			.tree {
79 
+				height: 100%;
80 
+			}
81 
+
82 
+			.trTitle {
83 
+				width: 100%;
84 
+				height: 34px;
85 
+				line-height: 34px;
86 
+				border-bottom: 1px solid #ebebeb;
87 
+				color: red;
88 
+				font-weight: 700;
89 
+				margin-bottom: 15px;
90 
+			}
91 
+
92 
+			.treeCon {
93 
+				height: 90%;
94 
+				border: 1px solid #ebebeb;
95 
+				overflow-y: auto
96 
+			}
97 
+
98 
+			.rowsss{
99 
+				background: darkred;
100 
+				color: #fff;
101 
+			}
102 
+			.shanChu,.xiuGai,.addZiDian{
103 
+				display: inline-block;
104 
+				height: 16px;
105 
+				width: 16px;
106 
+				vertical-align: middle;
107 
+			}
108 
+			.shanChu{
109 
+			background: url(../../img/shanChu.png) no-repeat;
110 
+			}
111 
+			.xiuGai{
112 
+			background: url(../../img/xiuGai1.png) no-repeat;
113 
+			}
114 
+			.addZiDian{
115 
+				background: url(../../img/upUp.png) no-repeat;
116 
+			}
117 
+			.tjzd{
118 
+				    float: right;
119 
+			}

+ 117 - 0
WebUI/CallCenterWeb.UI/SystemManager/fivePoints.html
Целия файл 

@@ -0,0 +1,117 @@
1 
+<!DOCTYPE html>
2 
+<html>
3 
+
4 
+	<head>
5 
+		<meta charset="UTF-8">
6 
+		<script src="../Script/Common/huayi.load.js"></script>
7 
+		<script src="../Script/Common/huayi.config.js"></script>
8 
+		<link rel="stylesheet" href="../js/zTree/zTreeStyle.css" />
9 
+		<link rel="stylesheet" href="../css/init.css" />
10 
+		<link rel="stylesheet" href="./css/fivePoints.css" />
11 
+		<title>系统管理-->五级归口</title>
12 
+	</head>
13 
+
14 
+	<body class="gray-bg">
15 
+		<div class="daoHang clearfix">
16 
+			<div class="dhLeft">
17 
+				<sapn><i class="syIcon"></i>位置：
18 
+					<a id="ReIndex" href="javaScript:;">首页</a>&gt;
19 
+					<a href="javaScript:;">系统管理</a>&gt;
20 
+					<a href="" class="nowPosition">五级归口</a>
21 
+				</sapn>
22 
+			</div>
23 
+			<div class="dhRight">
24 
+				<a href="" title="刷新"><i class="fa fa-refresh"></i></a>
25 
+			</div>
26 
+		</div>
27 
+		<div class="wrapper wrapper-content">
28 
+			<div class="th-top clearfix">
29 
+				<div class="form-inline th-bar clearfix">
30 
+					<div class="form-group tool_bars pull-right">
31 
+						<button class="btns add">新增</button>
32 
+						<button class="btns change">修改</button>
33 
+						<button class="btns del">删除</button>
34 
+					</div>
35 
+				</div>
36 
+			</div>
37 
+			<div class="tree">
38 
+				<ul id="treeDemo" class="ztree">
39 
+				</ul>
40 
+			</div>
41 
+		</div>
42 
+		<!--添加弹出内容-->
43 
+		<div class="model addModel">
44 
+			<div class="box">
45 
+				<div class="btop clearfix">
46 
+					<p class="btl"><span>添加</span>&nbsp;&lfloor;&nbsp;&nbsp;<span class="tps" style="color: red;"></span>&nbsp;&nbsp;&rceil;&nbsp;分类</p>
47 
+					<p class="btr addBtr" title="关闭">X</p>
48 
+				</div>
49 
+				<div class="boxCon">
50 
+					<div>所属分类：
51 
+						<div class="inpBox">
52 
+							<input type="text" class="inps inps1" />
53 
+							<i class="xl xl_one"></i>
54 
+							<div class="addTree xlAdd">
55 
+								<ul id="addTreeDemo" class="ztree">
56 
+
57 
+								</ul>
58 
+							</div>
59 
+						</div>
60 
+					</div>
61 
+					<div>分类名称：<input class="inps inps2" type="text" /></div>
62 
+					<!--<div>排列序号：<input class="inps inps3" type="text" /></div>-->
63 
+					<div><button class="btns addCun">保存</button></div>
64 
+				</div>
65 
+			</div>
66 
+
67 
+		</div>
68 
+		<!--删除弹出内容-->
69 
+		<div class="model delModel">
70 
+			<div class="box">
71 
+				<div class="btop clearfix">
72 
+					<p class="btl"><span>删除提示</span></p>
73 
+					<p class="btr delBtr" title="关闭">X</p>
74 
+				</div>
75 
+				<div class="boxCon" style="height: 150px;">
76 
+					您确定删除&nbsp;&lfloor;&nbsp;&nbsp;<span class="delName" style="color: red;"></span>&nbsp;&nbsp;&rceil;&nbsp;?
77 
+
78 
+					<p style="margin-top: 30px;"><button class="btns sure">确定</button>
79 
+						<button class="btns return">取消</button></p>
80 
+					<!--<p style="color: red;">注：若该分类下包含知识库内容会一并删除</p>-->
81 
+				</div>
82 
+
83 
+			</div>
84 
+
85 
+		</div>
86 
+		<!--修改弹出内容-->
87 
+		<div class="model changeModel">
88 
+			<div class="box">
89 
+				<div class="btop clearfix">
90 
+					<p class="btl"><span>修改</span>&nbsp;&lfloor;&nbsp;&nbsp;<span class="tps chtps" style="color: red;"></span>&nbsp;&nbsp;&rceil;&nbsp;分类</p>
91 
+					<p class="btr changeBtr" title="关闭">X</p>
92 
+				</div>
93 
+				<div class="boxCon">
94 
+					<div>所属分类：
95 
+						<div class="inpBox">
96 
+							<input type="text" class="inps inps4" />
97 
+							<i class="xl xl_two"></i>
98 
+							<div class="addTree xlChange">
99 
+								<ul id="changeTreeDemo" class="ztree">
100 
+
101 
+								</ul>
102 
+							</div>
103 
+						</div>
104 
+					</div>
105 
+					<div>分类名称：<input class="inps inps5" type="text" /></div>
106 
+					<div><button class="btns changeCun">保存</button></div>
107 
+				</div>
108 
+			</div>
109 
+
110 
+		</div>
111 
+
112 
+		<script src="../js/zTree/jquery.ztree.core.js"></script>
113 
+		<script src="../css/layer/layer.js"></script>
114 
+		<script src="./js/fivePoints.js"></script>
115 
+	</body>
116 
+
117 
+</html>

+ 346 - 0
WebUI/CallCenterWeb.UI/SystemManager/js/fivePoints.js
Целия файл 

@@ -0,0 +1,346 @@
1 
+	var tps = $('.tps');
2 
+	var id = ''; //当前节点id
3 
+	var name=''; //当前节点name
4 
+	var pid; //当前节点父ID
5 
+	var pidName;//
6 
+	var xlName; //添加弹出框内下拉框内节点name
7 
+	var token = $.cookie("token");
8 
+	tree();
9 
+
10 
+	function tree() {
11 
+		$.get(huayi.config.callcenter_url + 'DemandsType/GetDeptListtree', {
12 
+			"token": $.cookie("token"),
13 
+		}, function(result) {
14 
+			result = $.parseJSON(result);
15 
+			$.fn.zTree.init($("#treeDemo"), setting1, result.data); //实例化树形图
16 
+		});
17 
+	}
18 
+
19 
+	var setting1 = {
20 
+		data: {
21 
+			key: {
22 
+				name: "text"
23 
+			},
24 
+			simpleData: {
25 
+				enable: true,
26 
+				idKey: "id",
27 
+				rootPId: 0
28 
+			}
29 
+		},
30 
+		callback: {
31 
+			onClick: zTreeOnClick
32 
+		}
33 
+	};
34 
+
35 
+	function zTreeOnClick(event, treeId, treeNode) {
36 
+		id = treeNode.id;
37 
+		name = treeNode.text;
38 
+		var pidnode = treeNode.getParentNode();
39 
+		if(pidnode) {
40 
+			pidName = pidnode.text;
41 
+			pid = pidnode.id;
42 
+		} else {
43 
+			pidName = "顶级分类";
44 
+			pid =0;
45 
+		}
46 
+	};
47 
+	var setting2 = {
48 
+		data: {
49 
+			key: {
50 
+				name: "text"
51 
+			},
52 
+			simpleData: {
53 
+				enable: true,
54 
+				idKey: "id",
55 
+				rootPId: 0
56 
+			}
57 
+		},
58 
+		callback: {
59 
+			onClick: addTreeClick
60 
+		}
61 
+	}
62 
+
63 
+	function addTreeClick(event, treeId, treeNode) {
64 
+		addPid = treeNode.id;
65 
+		console.log(addPid);
66 
+		xlName = treeNode.text;
67 
+		$('.inps1').val(xlName);
68 
+
69 
+	};
70 
+	//删除按钮
71 
+	$('.del').click(function() {
72 
+		if(id == 'null' || id == '') {
73 
+			layer.confirm('没有要删除的分类！', {
74 
+				btn: ['确定']
75 
+			});
76 
+			return
77 
+		} else {
78 
+			$('.delModel').css('display', 'block');
79 
+			$('.delName').html(name);
80 
+		}
81 
+	})
82 
+	//关闭按钮
83 
+	$('.delBtr').click(function() {
84 
+		$('.delModel').css('display', 'none');
85 
+	})
86 
+	//确定删除按钮
87 
+	$('.sure').click(function() {
88 
+
89 
+		$.ajax({
90 
+			type: "post",
91 
+			url: huayi.config.callcenter_url + "DemandsType/DelDepts",
92 
+			async: true,
93 
+			dataType: 'json',
94 
+			data: {
95 
+				id: id,
96 
+				token: token
97 
+			},
98 
+			success: function(data) {
99 
+				if(data.state == "success") {
100 
+					layer.msg("删除成功！");
101 
+					tree();
102 
+				}
103 
+			}
104 
+		});
105 
+		$('.delModel').css('display', 'none');
106 
+
107 
+	})
108 
+	//取消删除按钮
109 
+	$('.return').click(function() {
110 
+		$('.delModel').css('display', 'none');
111 
+	})
112 
+
113 
+	//添加按钮
114 
+	$('.add').click(function() {
115 
+		$('.addModel').css('display', 'block');
116 
+		if(name) {
117 
+			tps.html(name);
118 
+			$('.inps1').val(name);
119 
+			addPid = id;
120 
+		} else {
121 
+			tps.html('顶级分类');
122 
+			$('.inps1').val('顶级分类');
123 
+			addPid = 0;
124 
+		}
125 
+		treeCont();
126 
+
127 
+	})
128 
+	//添加关闭按钮
129 
+	$('.addBtr').click(function() {
130 
+		$('.addModel').css('display', 'none');
131 
+	})
132 
+	//添加内容下拉
133 
+	$('.inps1').click(function() {
134 
+		$('.xlAdd').css('display', 'block')
135 
+	})
136 
+	$('.xl_one').click(function() {
137 
+		if($('.xlAdd').css('display') == 'block') {
138 
+			$('.xlAdd').css('display', 'none')
139 
+		} else {
140 
+			$('.xlAdd').css('display', 'block')
141 
+		}
142 
+	})
143 
+	$('.addTree').mouseleave(function() {
144 
+		$(this).css('display', 'none')
145 
+	})
146 
+	//保存添加按钮
147 
+	var addPid, addDeptname, addSort;
148 
+	//添加弹出框内 所属部门下拉框内数据
149 
+	function treeCont() {
150 
+		$.get(huayi.config.callcenter_url + 'DemandsType/GetDeptListtree', {
151 
+			"token": $.cookie("token"),
152 
+//			"pid": pid
153 
+		}, function(result) {
154 
+			result = $.parseJSON(result);
155 
+			$.fn.zTree.init($("#addTreeDemo"), setting2, result.data); //实例化树形图
156 
+		});
157 
+
158 
+	}
159 
+	$('.addCun').click(function() {
160 
+						console.log(addPid);
161 
+		if($('.inps2').val() == "") {
162 
+		    if (addPid.length <= 0) {
163 
+				layer.confirm('所添加内容不能为空！', {
164 
+					btn: ['确定']
165 
+				});
166 
+				return;
167 
+			}
168 
+		} else {
169 
+			addDeptname = $('.inps2').val();
170 
+			$('.addModel').css('display', 'none');
171 
+			$.ajax({
172 
+				type: "post",
173 
+				url: huayi.config.callcenter_url + "DemandsType/SaveDemands",
174 
+				dataType: 'json',
175 
+				async: true,
176 
+				data: {
177 
+					id:0,
178 
+					pid: addPid, //当前选择节点ID
179 
+					name: addDeptname, //部门名称
180 
+					token: token
181 
+				},
182 
+				success: function(data) {
183 
+					//					console.log(data)
184 
+					//					console.log(data.state);
185 
+					if(data.state == "success") {
186 
+						layer.msg("添加成功！");
187 
+						tree();
188 
+						$('.inps1').val('');
189 
+						$('.inps2').val('');
190 
+						$('.inps3').val('');
191 
+
192 
+					}
193 
+				}
194 
+
195 
+			});
196 
+
197 
+		}
198 
+	})
199 
+
200 
+	//修改按钮
201 
+	var chanPid, //修改弹出框内 下拉框父节点ID
202 
+		chanId, //修改弹出框内 下拉框当前节点ID
203 
+		changeName, //修改弹出框内 下拉框当前节点name
204 
+		chbcName, //保存的部门名称
205 
+		chbcSort, //保存的排序号
206 
+		chbcPid; //保存的所属部门ID
207 
+	$('.change').click(function() {
208 
+		if(id == 'null' || id == '') {
209 
+			layer.confirm('没有选择要修改的项！', {
210 
+				btn: ['确定']
211 
+			})
212 
+			return
213 
+		} else {
214 
+			changeAjax(id);
215 
+			$('.changeModel').css('display', 'block');
216 
+			$('.chtps').html(name);
217 
+//			console.log(pidName);
218 
+//			console.log(pid);
219 
+			$('.inps4').val(pidName);
220 
+			chbcPid=pid;
221 
+			changeTreeCont();
222 
+		}
223 
+
224 
+	});
225 
+	//关闭按钮
226 
+	$('.changeBtr').click(function() {
227 
+		$('.changeModel').css('display', 'none');
228 
+	}) ;
229 
+	$('.inps4').click(function() {
230 
+		$('.xlChange').css('display', 'block')
231 
+	})
232 
+	//下拉按钮功能
233 
+	$('.xl_two').click(function() {
234 
+		if($('.xlChange').css('display') == 'block') {
235 
+			$('.xlChange').css('display', 'none')
236 
+		} else {
237 
+			$('.xlChange').css('display', 'block')
238 
+		}
239 
+	})
240 
+	//修改弹出框内 下拉树形图参数配置项
241 
+	var setting3 = {
242 
+		data: {
243 
+			key: {
244 
+				name: "text"
245 
+			},
246 
+			simpleData: {
247 
+				enable: true,
248 
+				idKey: "id",
249 
+				rootPId: 0
250 
+			}
251 
+		},
252 
+		callback: {
253 
+			onClick: changeTreeClick
254 
+		}
255 
+	}
256 
+
257 
+	function changeTreeClick(event, treeId, treeNode) {
258 
+//		chanPid = treeNode.pId;
259 
+		chanId = treeNode.id;
260 
+		changeName = treeNode.text;
261 
+		$('.inps4').val(changeName);
262 
+		var pidnode = treeNode.getParentNode();
263 
+		if(pidnode) {
264 
+			chanPid = pidnode.id;
265 
+		} else {
266 
+			chanPid =0;
267 
+		}
268 
+		chbcPid=chanId;
269 
+	};
270 
+
271 
+	//修改弹出框内 所属部门下拉框内数据
272 
+	function changeTreeCont() {
273 
+		$.get(huayi.config.callcenter_url + 'DemandsType/GetDeptListtree', {
274 
+			"token": $.cookie("token"),
275 
+//			"pid": pid
276 
+		}, function(result) {
277 
+			result = $.parseJSON(result);
278 
+			$.fn.zTree.init($("#changeTreeDemo"), setting3, result.data); //实例化树形图
279 
+		});
280 
+	}
281 
+
282 
+	function changeAjax(id) {
283 
+		$.ajax({
284 
+			type: "get",
285 
+			url: huayi.config.callcenter_url + "DemandsType/GetModel",
286 
+			dataType: 'json',
287 
+			async: true,
288 
+			data: {
289 
+				id: id,
290 
+				token: token
291 
+			},
292 
+			success: function(data) {
293 
+				var chanCon = data.data;
294 
+				if(pid == 0) {
295 
+					$('.inps4').val('顶级分类');
296 
+					chbcPid =pid;
297 
+				} else {
298 
+					$('.inps4').val(pidName);
299 
+					chbcPid=pid;
300 
+				}
301 
+				$('.inps5').val(chanCon.F_Name);
302 
+//				$('.inps6').val(chanCon.sort);
303 
+//				chbcSort = chanCon.sort;
304 
+				chbcName = chanCon.F_Name;
305 
+			}
306 
+		});
307 
+	}
308 
+	//修改的保存按钮功能
309 
+	function changeBaoCunAjax(id, chbcPid, chbcName) {
310 
+		$.ajax({
311 
+			type: "post",
312 
+			url: huayi.config.callcenter_url + "DemandsType/SaveDemands",
313 
+			async: true,
314 
+			dataType: 'json',
315 
+			data: {
316 
+				id: id,
317 
+				pid: chbcPid,
318 
+				name: chbcName,
319 
+				token: token
320 
+			},
321 
+			success: function(data) {
322 
+				if(data.state == "success") {
323 
+					layer.msg("修改成功！");
324 
+					tree();
325 
+				}
326 
+			}
327 
+		});
328 
+	}
329 
+
330 
+	$('.changeCun').click(function() {
331 
+		if($('.inps4').val() == "" || $('.inps5').val() == "") {
332 
+			layer.confirm('所修改内容不允许为空！', {
333 
+				btn: ['确定']
334 
+			});
335 
+			return;
336 
+		} else {
337 
+			$('.changeModel').css('display', 'none');
338 
+			console.log('部门id'+id +'所属部门id' + chbcPid +'部门名称'+chbcName+'排序'+chbcSort);
339 
+			chbcPid;
340 
+			chbcName = $('.inps5').val();
341 
+//			chbcSort = $('.inps6').val();
342 
+			changeBaoCunAjax(id, chbcPid, chbcName);
343 
+		}
344 
+
345 
+	})
346 
+

+ 1 - 10
WebUI/CallCenterWeb.UI/login.html
Целия файл 

@@ -157,7 +157,6 @@
157 157 
 						<!--<i class="logo"></i><div class="logoWord"></div>-->
158 158 
 						<img src="img/sqLogo.png" alt="" />
159 159 
 					</div>
160 
-				<!--<div class="row clearfix">-->
161 160 
 					<div class="tab_box">
162 161 
 						<!--col-sm-7-->
163 162 
 						<ul class="clearfix tab_ul">
 
@@ -201,16 +200,9 @@
201 200 
 						</div>
202 201
203 202 
 					</div>
204 
-
205 
-				<!--</div>-->
206 
-
207 203 
 					<div class="service" >
208 
-						<!--row clearfix-->
209 
-					<!--<div class="col-sm-7">-->
210 204 
 						<p style="color: #313c58; font-size: 12px;text-align: center;"></p>
211 
-					<!--</div>-->
212 
-				</div>
213 
-
205 
+					</div>
214 206 
 				</div>
215 207
216 208 
 			</div>
 
@@ -224,7 +216,6 @@
224 216 
 					var index = $(this).index();
225 217 
 					 a=index;
226 218 
 					$('.tab_content').children('div').eq(index).show().siblings().hide();
227 
-
228 219 
 				})
229 220 
 					/*cook存储数据*/
230 221 
 				if($.cookie("username")) {