浏览代码

大屏坐席数据

liuyifan 6 年之前
父节点
当前提交
ef4d39e942
共有 3 个文件被更改,包括 168 次插入440 次删除
  1. 1 0
      WebChart/js/index.js
  2. 0 438
      WebChart/js/pieChat.js
  3. 167 2
      WebChart/js/trafficDataTable.js

+ 1 - 0
WebChart/js/index.js

@@ -44,6 +44,7 @@ $(function() {
44 44
 					theme: '#114a97',
45 45
 					done: function(value) {
46 46
 						gettraffic(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1])
47
+						getAgentData(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1])
47 48
 					}
48 49
 			});
49 50
 })

+ 0 - 438
WebChart/js/pieChat.js

@@ -1,438 +0,0 @@
1
-// var container1 = echarts.init(document.getElementById('part1'));
2
-// var container2 = echarts.init(document.getElementById('part2'));
3
-// var container3 = echarts.init(document.getElementById('part3'));
4
-// 
5
-// 
6
-// // var container7 = echarts.init(document.getElementById('patt7')); //大屏六个图
7
-// 
8
-// function partOne() {
9
-// 	$.ajax({
10
-// 		type: "get",
11
-// 		url: huayi.config.callcenter_url + "WOReport/GetChannel",
12
-// 		async: true,
13
-// 		dataType: "json",
14
-// 		data: {},
15
-// 		success: function(data) {
16
-// 			if(data.state.toLowerCase() == "success") {
17
-// 				var con = data.rows;
18
-// 				container1.setOption({
19
-// 					title: {
20
-// 						text: '来源渠道数据分析',
21
-// 						textStyle: {
22
-// 							//文字颜色
23
-// 							color: '#00e9ff',
24
-// 							//字体大小
25
-// 							fontSize: 18
26
-// 						},
27
-// 						x: 'center'
28
-// 					},
29
-// 					tooltip: {
30
-// 						trigger: 'axis',
31
-// 						axisPointer: {
32
-// 							type: 'cross',
33
-// 							label: {
34
-// 								show: true,
35
-// 								backgroundColor: '#030917'
36
-// 							}
37
-// 						}
38
-// 					},
39
-// 					legend: {
40
-// 						show: false
41
-// 					},
42
-// 					xAxis: {
43
-// 						name: '时间',
44
-// 						data: [
45
-// 							con[0].channel, 
46
-// 							con[1].channel, 
47
-// 							con[2].channel, 
48
-// 							con[3].channel, 
49
-// 							con[4].channel
50
-// 						],
51
-// 						axisLine: {
52
-// 							lineStyle: {
53
-// 								color: '#ccc'
54
-// 							}
55
-// 						}
56
-// 					},
57
-// 					yAxis: {
58
-// 						name: '数量',
59
-// 						splitLine: {
60
-// 							show: false
61
-// 						},
62
-// 						axisLine: {
63
-// 							lineStyle: {
64
-// 								color: '#fff'
65
-// 							}
66
-// 						}
67
-// 					},
68
-// 					series: [{
69
-// 							name: '电话',
70
-// 							type: 'line',
71
-// 							data: [
72
-// 								con[0].Telephone, 
73
-// 								con[1].Telephone, 
74
-// 								con[2].Telephone, 
75
-// 								con[3].Telephone, 
76
-// 								con[4].Telephone 
77
-// 							]
78
-// 						},
79
-// 						{
80
-// 							name: '微信',
81
-// 							type: 'line',
82
-// 							data: [
83
-// 								con[0].WeChat, 
84
-// 								con[1].WeChat, 
85
-// 								con[2].WeChat, 
86
-// 								con[3].WeChat, 
87
-// 								con[4].WeChat 
88
-// 							]
89
-// 						}
90
-// 					],
91
-// 					color: ['#61a0a9', '#cb885d']
92
-// 
93
-// 				});
94
-// 				
95
-// 			}
96
-// 		}
97
-// 	});
98
-// }
99
-// 
100
-// function partTwo() {
101
-// 	$.ajax({
102
-// 		type: "get",
103
-// 		url: huayi.config.callcenter_url + "WOReport/GetChannel",
104
-// 		async: true,
105
-// 		dataType: "json",
106
-// 		data: {
107
-// //			date:
108
-// 		},
109
-// 		success: function(data) {
110
-// 			if(data.state.toLowerCase() == "success") {
111
-// 				var con = data.rows;
112
-// 				container2.setOption({
113
-// 					title: {
114
-// 						text: '工单即时办结',
115
-// 						textStyle: {
116
-// 							//文字颜色
117
-// 							color: '#00e9ff',
118
-// 							//字体大小
119
-// 							fontSize: 18
120
-// 						},
121
-// 						x: 'center'
122
-// 					},
123
-// 					color: ['#3398DB'],
124
-// 					tooltip: {
125
-// 						trigger: 'axis',
126
-// 						axisPointer: { // 坐标轴指示器,坐标轴触发有效
127
-// 							type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
128
-// 						}
129
-// 					},
130
-// 					grid: {
131
-// 						left: '3%',
132
-// 						right: '4%',
133
-// 						bottom: '3%',
134
-// 						containLabel: true
135
-// 					},
136
-// 					xAxis: [{
137
-// 						type: 'category',
138
-// 						data: [
139
-// 							con[0].channel, 
140
-// 							con[1].channel, 
141
-// 							con[2].channel, 
142
-// 							con[3].channel, 
143
-// 							con[4].channel
144
-// 						],
145
-// 						axisTick: {
146
-// 							alignWithLabel: true
147
-// 						},
148
-// 						axisLine: {
149
-// 							lineStyle: {
150
-// 								color: '#ccc'
151
-// 							}
152
-// 						}
153
-// 					}],
154
-// 					yAxis: [{
155
-// 						type: 'value',
156
-// 						axisLine: {
157
-// 							lineStyle: {
158
-// 								color: '#ccc'
159
-// 							}
160
-// 						}
161
-// 					}],
162
-// 					series: [{
163
-// 						name: '即时办结',
164
-// 						type: 'bar',
165
-// 						barWidth: '60%',
166
-// 						data: [
167
-// 							con[0].Immediate, 
168
-// 							con[1].Immediate, 
169
-// 							con[2].Immediate, 
170
-// 							con[3].Immediate, 
171
-// 							con[4].Immediate
172
-// 						]
173
-// 					}]
174
-// 				});
175
-// 			}
176
-// 		}
177
-// 	});
178
-// }
179
-// 
180
-// function partThree() {
181
-// 	$.ajax({
182
-// 		type: "get",
183
-// 		url: huayi.config.callcenter_url + "WOReport/GetChannel",
184
-// 		async: true,
185
-// 		dataType: "json",
186
-// 		data: {
187
-// //			date:
188
-// 		},
189
-// 		success: function(data) {
190
-// 			if(data.state.toLowerCase() == "success") {
191
-// 				var con = data.rows;
192
-// 				container3.setOption({
193
-// 					title: {
194
-// 						text: '转接率图表',
195
-// 						textStyle: {
196
-// 							//文字颜色
197
-// 							color: '#00e9ff',
198
-// 							//字体大小
199
-// 							    fontSize: 18
200
-// 						},
201
-// 						x: 'center'
202
-// 					},
203
-// 					tooltip: {
204
-// 						trigger: 'item',
205
-// 						formatter: "{a} <br/>{b} : {c} ({d}%)"
206
-// 					},
207
-// 					legend: {
208
-// 						orient: 'vertical',
209
-// 						left: 'left'
210
-// 					},
211
-// 
212
-// 					series: [{
213
-// 						name: '访问来源',
214
-// 						type: 'pie',
215
-// 						radius: '55%',
216
-// 						center: ['50%', '60%'],
217
-// 						data: [{
218
-// 								value: con[0].Transfer,
219
-// 								name: con[0].channel
220
-// 							},
221
-// 							{
222
-// 								value: con[1].Transfer,
223
-// 								name: con[1].channel
224
-// 							},
225
-// 							{
226
-// 								value: con[2].Transfer,
227
-// 								name: con[2].channel
228
-// 							},
229
-// 							{
230
-// 								value: con[3].Transfer,
231
-// 								name: con[3].channel
232
-// 							},
233
-// 							{
234
-// 								value: con[4].Transfer,
235
-// 								name: con[4].channel
236
-// 							}
237
-// 						],
238
-// 						itemStyle: {
239
-// 							normal: {
240
-// 								color: '#159FE9',
241
-// 								opacity: 0.5,
242
-// 							},
243
-// 							emphasis: {
244
-// 								shadowBlur: 10,
245
-// 								shadowOffsetX: 0,
246
-// 								shadowColor: 'rgba(0, 0, 0, 0.5)'
247
-// 							}
248
-// 						}
249
-// 					}]
250
-// 				});
251
-// 			}
252
-// 		}
253
-// 	});
254
-// }
255
-// 
256
-// function partFour() {
257
-// 	$.ajax({
258
-// 		type: "get",
259
-// 		url: huayi.config.callcenter_url + "WOReport/GetChannel",
260
-// 		async: true,
261
-// 		dataType: "json",
262
-// 		data: {
263
-// 			channel:$(".channelSel").val()
264
-// 		},
265
-// 		success: function(data) {
266
-// 			if(data.state.toLowerCase() == "success") {
267
-// 				var con = data.rows;
268
-// 				var option={
269
-// 					title: {
270
-// 						text: '渠道来源满意度',
271
-// 						x: 'left',
272
-// 						textStyle: {
273
-// 							//文字颜色
274
-// 							color: '#00e9ff',
275
-// 							//字体大小
276
-// 							    fontSize: 18
277
-// 						}
278
-// 					},
279
-// 					tooltip: {
280
-// 						trigger: 'item',
281
-// 						formatter: "{a} <br/>{b} : {c} ({d}%)"
282
-// 					},
283
-// 					legend: {
284
-// 						orient: 'vertical',
285
-// 						left: 'left'
286
-// 					},
287
-// 					series: [{
288
-// 						name: '访问来源',
289
-// 						type: 'pie',
290
-// 						radius: '55%',
291
-// 						center: ['50%', '60%'],
292
-// 						data: [{
293
-// 								value: con[0].Verysatisfied,
294
-// 								name: '非常满意'
295
-// 							},
296
-// 							{
297
-// 								value: con[0].Satisfaction,
298
-// 								name: '满意'
299
-// 							},
300
-// 							{
301
-// 								value: con[0].Commonly,
302
-// 								name: '一般'
303
-// 							},
304
-// 							{
305
-// 								value: con[0].Unsatisfactory,
306
-// 								name: '不满意'
307
-// 							}
308
-// 						],
309
-// 						itemStyle: {
310
-// 							normal: {
311
-// 								color: '#159FE9',
312
-// 								opacity: 0.5,
313
-// 							},
314
-// 							emphasis: {
315
-// 								shadowBlur: 10,
316
-// 								shadowOffsetX: 0,
317
-// 								shadowColor: 'rgba(0, 0, 0, 0.5)'
318
-// 							}
319
-// 						}
320
-// 					}]
321
-// 				}
322
-// 			
323
-// 				echartsPie = echarts.init(document.getElementById('part4'));
324
-// 				echartsPie.setOption(option);
325
-// 				//var container4 = echarts.init(document.getElementById('part4'));
326
-// 			}
327
-// 		}
328
-// 	});
329
-// }
330
-// 
331
-// 
332
-// // 第四屏
333
-// // function partpaat() {
334
-// // 	$.ajax({
335
-// // 		type: "get",
336
-// // 		url: huayi.config.callcenter_url + "WOReport/GetChannel",
337
-// // 		async: true,
338
-// // 		dataType: "json",
339
-// // 		data: {},
340
-// // 		success: function(data) {
341
-// // 			if(data.state.toLowerCase() == "success") {
342
-// // 				var con = data.rows;
343
-// // 				container7.setOption({
344
-// // 					title: {
345
-// // 						text: '来源渠道数据分析',
346
-// // 						textStyle: {
347
-// // 							//文字颜色
348
-// // 							color: '#00e9ff',
349
-// // 							//字体大小
350
-// // 							fontSize: 18
351
-// // 						},
352
-// // 						x: 'center'
353
-// // 					},
354
-// // 					tooltip: {
355
-// // 						trigger: 'axis',
356
-// // 						axisPointer: {
357
-// // 							type: 'cross',
358
-// // 							label: {
359
-// // 								show: true,
360
-// // 								backgroundColor: '#030917'
361
-// // 							}
362
-// // 						}
363
-// // 					},
364
-// // 					legend: {
365
-// // 						show: false
366
-// // 					},
367
-// // 					xAxis: {
368
-// // 						name: '时间',
369
-// // 						data: [
370
-// // 							con[0].channel, 
371
-// // 							con[1].channel, 
372
-// // 							con[2].channel, 
373
-// // 							con[3].channel, 
374
-// // 							con[4].channel
375
-// // 						],
376
-// // 						axisLine: {
377
-// // 							lineStyle: {
378
-// // 								color: '#ccc'
379
-// // 							}
380
-// // 						}
381
-// // 					},
382
-// // 					yAxis: {
383
-// // 						name: '数量',
384
-// // 						splitLine: {
385
-// // 							show: false
386
-// // 						},
387
-// // 						axisLine: {
388
-// // 							lineStyle: {
389
-// // 								color: '#fff'
390
-// // 							}
391
-// // 						}
392
-// // 					},
393
-// // 					series: [{
394
-// // 							name: '电话',
395
-// // 							type: 'bar',
396
-// // 							barWidth:20,
397
-// // 							data: [
398
-// // 								con[0].Telephone, 
399
-// // 								con[1].Telephone, 
400
-// // 								con[2].Telephone, 
401
-// // 								con[3].Telephone, 
402
-// // 								con[4].Telephone 
403
-// // 							]
404
-// // 						},
405
-// // 						{
406
-// // 							name: '微信',
407
-// // 							type: 'line',
408
-// // 							data: [
409
-// // 								con[0].WeChat, 
410
-// // 								con[1].WeChat, 
411
-// // 								con[2].WeChat, 
412
-// // 								con[3].WeChat, 
413
-// // 								con[4].WeChat 
414
-// // 							]
415
-// // 						},
416
-// // 						 {
417
-// // 							type: 'pie',
418
-// // 							id: 'pie',
419
-// // 							radius: '40%',
420
-// // 							center: ['60%', '30%'],
421
-// // 							label: {
422
-// // 								formatter: '{b}: {@2012} ({d}%)'
423
-// // 							},
424
-// // 							encode: {
425
-// // 								itemName: 'product',
426
-// // 								value: '2012',
427
-// // 								tooltip: '2012'
428
-// // 							}
429
-// // 						}
430
-// // 					],
431
-// // 					color: ['#61a0a9', '#cb885d']
432
-// // 
433
-// // 				});
434
-// // 				
435
-// // 			}
436
-// // 		}
437
-// // 	});
438
-// // }

+ 167 - 2
WebChart/js/trafficDataTable.js

@@ -2,6 +2,8 @@
2 2
 	var sd = "";
3 3
 	var ed = "";
4 4
 	gettraffic(sd, ed);
5
+	getAgentData(sd, ed);
6
+	
5 7
 	//轮播
6 8
 	banner1()
7 9
 	
@@ -67,7 +69,6 @@
67 69
    	}
68 70
 
69 71
 	function gettraffic(sd,ed) {
70
-		var myChart = echarts.init(document.getElementById('smallAgentBusy'));
71 72
 		var myChartaaa = echarts.init(document.getElementById('smallAppealTotal'));
72 73
 		var myChartbbb = echarts.init(document.getElementById('smallCallConnected'));
73 74
 		var myChartppp = echarts.init(document.getElementById('smallAppeal'));
@@ -75,7 +76,6 @@
75 76
 		var myChreti = echarts.init(document.getElementById('trafficAppeal'));
76 77
 		var myKouc = echarts.init(document.getElementById('trafficCallConnected'));
77 78
 		var myKucot = echarts.init(document.getElementById('trafficAppealTotal'));
78
-		var myTou = echarts.init(document.getElementById('trafficAgentBusy'));
79 79
 		$.ajax({
80 80
 			type: "get",
81 81
 			url: huayi.config.callcenter_url + "Business/GetTelephoneList",
@@ -395,3 +395,168 @@
395 395
 			}
396 396
 		});
397 397
 	}
398
+	
399
+	// 坐席实时数据
400
+	function getAgentData(sd,ed) {
401
+		var myTou = echarts.init(document.getElementById('trafficAgentBusy'));
402
+		var myChart = echarts.init(document.getElementById('smallAgentBusy'));
403
+		$.ajax({
404
+			type: "get",
405
+			url: huayi.config.callcenter_url + "Business/GetAgentTelCount",
406
+			async: true,
407
+			dataType: "json",
408
+			data: {
409
+				stime:sd,
410
+				endtime:ed,
411
+			},
412
+			success: function(data){
413
+				if (data.state.toLowerCase()  == "success") {
414
+					var con = data.data;
415
+					var inconnectcount = con.inconnectcount;  //呼入接通
416
+					var incount = con.incount; //呼入
417
+					var outconnectcount = con.outconnectcount; //呼出接通 
418
+					var outcount = con.outcount; //呼出
419
+					var users = con.users; //坐席
420
+					
421
+					myTou.setOption({
422
+						title: {
423
+						 	text: '坐席实时数据',
424
+						 	x: 'center',
425
+						 	textStyle: {
426
+						 		"color": "#FFFFFF"
427
+						 	}
428
+						},
429
+						legend: {
430
+      					  	data: ['呼入', '呼入接通', '呼出', '呼出接通'],
431
+      					  	bottom: 5,
432
+      					  	textStyle: {
433
+      					  		color: "#FFFAF0"
434
+      					  	}
435
+    					},
436
+						xAxis: {
437
+        					type: 'category',
438
+        					data: users,
439
+        					axisLine: {
440
+                    			lineStyle: {
441
+                    				color: '#FFFFFF',//坐标线的颜色
442
+                				}
443
+                    		},
444
+    					},
445
+						yAxis: {
446
+        					type: 'value',
447
+        					axisLine: {
448
+                    			lineStyle: {
449
+                    				color: '#FFFFFF',//坐标线的颜色
450
+                				}
451
+                    		},
452
+                		    splitLine :{    //网格线
453
+ 							   lineStyle:{
454
+            						type:'dashed'    //设置网格线类型 dotted:虚线   solid:实线
455
+        						},
456
+        						show:true //隐藏或显示
457
+    						}
458
+    					},
459
+    					series: [
460
+	    					{
461
+	    						name: '呼入',
462
+	        					data: incount,
463
+	        					type: 'line',
464
+	        					itemStyle: {
465
+					            	normal: {
466
+					            		color: '#1890FF',
467
+					            	}
468
+					            },
469
+	    					},
470
+	    					{
471
+	    						name: '呼入接通',
472
+	        					data: inconnectcount,
473
+	        					type: 'line',
474
+	        					itemStyle: {
475
+					            	normal: {
476
+					            		color: '#13C2C2',
477
+					            	}
478
+					            },
479
+	    					},
480
+	    					{
481
+	    						name: '呼出',
482
+	        					data: outcount,
483
+	        					type: 'line',
484
+	        					itemStyle: {
485
+					            	normal: {
486
+					            		color: '#2EC25B',
487
+					            	}
488
+					            },
489
+	    					},
490
+	    					{
491
+	    						name: '呼出接通',
492
+	        					data: outconnectcount,
493
+	        					type: 'line',
494
+	        					itemStyle: {
495
+					            	normal: {
496
+					            		color: '#FACC14',
497
+					            	}
498
+					            },
499
+	    					},
500
+    					]
501
+					});
502
+					myChart.setOption({
503
+						xAxis: {
504
+        					type: 'category',
505
+        					data: users,
506
+        					axisLine: {
507
+                    			lineStyle: {
508
+                    				color: '#FFFFFF',//坐标线的颜色
509
+                				}
510
+                    		},
511
+    					},
512
+						yAxis: {
513
+							show: false,
514
+    					},
515
+    					series: [
516
+	    					{
517
+    							name: '呼入',
518
+        						data: incount,
519
+        						type: 'line',
520
+        						itemStyle: {
521
+					            	normal: {
522
+					            		color: '#1890FF',
523
+					            	}
524
+					            },
525
+    						},
526
+    						{
527
+    							name: '呼入接通',
528
+        						data: inconnectcount,
529
+        						type: 'line',
530
+        						itemStyle: {
531
+					            	normal: {
532
+					            		color: '#13C2C2',
533
+					            	}
534
+					            },
535
+    						},
536
+    						{
537
+	    						name: '呼出',
538
+	        					data: outcount,
539
+	        					type: 'line',
540
+	        					itemStyle: {
541
+					            	normal: {
542
+					            		color: '#2EC25B',
543
+					            	}
544
+					            },
545
+	    					},
546
+	    					{
547
+	    						name: '呼出接通',
548
+	        					data: outconnectcount,
549
+	        					type: 'line',
550
+	        					itemStyle: {
551
+					            	normal: {
552
+					            		color: '#FACC14',
553
+					            	}
554
+					            },
555
+	    					},
556
+    					]
557
+					});
558
+
559
+				}
560
+			}
561
+		})
562
+	}