XYUpgrade_UI/CallCenterWe.../WebChart/js/huawu.js

$(document).ready(function() {
	//part 1
	var main1 = echarts.init(document.getElementById('main1'));
	main1.setOption({
		tooltip: {
			trigger: 'axis',
			axisPointer: {
				type: 'cross',
				label: {
					show: true,
					backgroundColor: '#333'
				}
			}
		},
		legend: {
			bottom:'bottom',
//			data: ["来电数量", "接通数量",  "放弃数量", "黑名单拒接数量"],
			data: ["来话量", "通话量"],
			textStyle: {
				color: '#fff'
			}
		},
		xAxis: {
			name: '时',
			data: [],
			axisLine: {
				lineStyle: {
					color: '#ccc'
				}
			}
		},
		yAxis: {
			name: '数量',
			splitLine: {
				show: false
			},
			axisLine: {
				lineStyle: {
					color: '#ccc'
				}
			}
		},
		series: []
	});
	

	function partOne() {
		var index = layer.load(1, {
			shade: [0.5, '#030303'] //0.1透明度的白色背景
		});
//		$('.list_one').html('');
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "CallManage/GetCallCount",
			async: true,
			dataType: "json",
			data: {
//				date: $('#time1').val()
			},
			success: function(data) {
				if(data.state.toLowerCase() == "success") {
					layer.close(index);
					var con = data.data;
					main1.setOption({
						xAxis: {
							data: con.hour
						},
						series: [{
							name: "来话量",
							type: "line",
							smooth: true,
							showAllSymbol: true,
							symbol: "emptyCircle",
							symbolSize: 10,
							data: con.callin
						}, {
							name: "通话量",
							type: "line",
							smooth: true,
							showAllSymbol: true,
							symbol: "emptyCircle",
							symbolSize: 10,
							data: con.callconn
//						},
//						 {
//							name: "放弃数量",
//							type: "line",
//							smooth: true,
//							showAllSymbol: true,
//							symbol: "emptyCircle",
//							symbolSize: 10,
//							data: con.gcounts
//						},
//						{
//							name: "黑名单拒接数量",
//							type: "line",
//							smooth: true,
//							showAllSymbol: true,
//							symbol: "emptyCircle",
//							symbolSize: 10,
//							data: con.scounts
						}]

					})

				}
			}

		});

	}
	//part 2
	var phone_num = echarts.init(document.getElementById('phone_num'));
	phone_num.setOption({
		title: {
			//		text: '投诉/举报汇总',
			x: 'center',
			textStyle: {
				color: '#fff',
				fontSize: 16
			},
		},
		tooltip: {
			trigger: 'axis',
			axisPointer: { // 坐标轴指示器，坐标轴触发有效
				type: 'line' // 默认为直线，可选为：'line' | 'shadow'
			}
		},
		toolbox: {
			show: true,
		},
		calculable: true,
		xAxis: [{
			type: 'category',
			//		name: '月份',
			splitLine: {
				show: false
			}, //去除网格线
			data: ["来话量(通)", "接通量(通)", "接通率", "平均通话时长(秒)"],
			//		axisTick: {
			//			alignWithLabel: true
			//		},
			axisLine: {
				show: false,
				lineStyle: {
					color: '#fff'
				}
			},
			//		axisLine: {},
			axisTick: {
				show: false
			}

		}],
		yAxis: [{
			show: false
		}],
		series: [{
				name: '数量',
				type: 'bar',
				barWidth: '30%', //图形宽度
				data: [],
				itemStyle: {
					normal: {
						label: {
							show: true,
							textStyle: {
								color: '#fff' //顶部数据颜色
							}
						}
					}
				},
				label: {
					normal: {
						show: true,
						position: 'top' //顶部数据显示位置
					}

				}
			}

		]
		//  color: ['#ff9800','#61a0a8','#1ab394']
	});
	
	function partTwo() {
		var index = layer.load(1, {
			shade: [0.5, '#030303'] //0.1透明度的白色背景
		});
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "CallManage/GetCallTotal",
			async: true,
			dataType: "json",
			data: {
//				date: $('#time2').val()
			},
			success: function(data) {
				if(data.state.toLowerCase() == "success") {
					layer.close(index);
					var con = data.data;
					phone_num.setOption({
						series: [{
							data: [con.daycallin, con.daycallconn, con.daycallrate, con.avgtime]
							//						data: [20, 100, 5, 80]
						}]

					})

				}
			}

		});

	}

//pasrt 5
//	var main = echarts.init(document.getElementById('main'));
//	main.setOption({
//
//		tooltip: {
//			trigger: 'axis',
//			axisPointer: {
//				type: 'cross',
//				label: {
//					show: true,
//					backgroundColor: '#333'
//				}
//			},
//			formatter: function(datas) {
//				var res = datas[0].name + '<br/>',
//					val;
//				for(var i = 0, length = datas.length; i < length; i++) {
//					val = (datas[i].value) + '%';
//					res += datas[i].seriesName + '：' + val + '<br/>';
//				}
//				return res;
//			}
//		},
//		legend: {
////			data: ["空闲", "通话", "置忙"],
//			data: [],
//			textStyle: {
//				color: '#fff'
//			},
//			bottom:'bottom'
//		},
//		xAxis: {
//			name: '时',
//			data: [],
//			axisLine: {
//				lineStyle: {
//					color: '#ccc'
//				}
//			}
//		},
//		yAxis: {
//			name: '比率',
//			splitLine: {
//				show: false
//			},
//			axisLine: {
//				lineStyle: {
//					color: '#ccc'
//				}
//			}
//		},
//		series: []
//	});
// 	
    function partThree(){ 
    		var index = layer.load(1, {
			shade: [0.5, '#030303'] //0.1透明度的白色背景
		});
    	$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "CallManage/FreeBusyRate",
			async: true,
			dataType: "json",
			data: {
//				start: $('#time3').val(),
//				end: $('#time4').val()
			},
			success: function(data) {
				if(data.state.toLowerCase() == "success") {
					layer.close(index);
					var con = data.data;
//					var part3 = result.data.b;
					main.setOption({
						xAxis: {
							data: con.hour
						},
						legend: {
							data: con.callstate
						},
						series: [{
							name: "空闲",
							type: "bar",
							data: con.freecount
						}, {
							name: "通话中",
							type: "bar",
							data: con.callincount
						}, {
							name: "小休",
							type: "bar",
							data: con.restcount
						}]

					})

				}
			}

		});
    }
	
	
	
	//接通率报表part3
var jtv = echarts.init(document.getElementById('jtv_num'));
jtv.setOption({
//	title: {
//		text: '接通率统计',
//		x: 'center',
//		textStyle: {
//			color: '#fff',
//			fontSize: 18,
//			fontWeight: 'normal'
//		}
//	},
	tooltip: {
		trigger: 'axis',
		axisPointer: {
			type: 'shadow',
			label: {
				show: true,
				backgroundColor: '#333'
			}
		},
		formatter: function(datas) 
              {
              var res = datas[0].name + '<br/>', val;
                  for(var i = 0, length = datas.length; i < length; i++) {
                        val = (datas[i].value) + '%';
                        res += datas[i].seriesName + '：' + val + '<br/>';
                    }
                    return res;
               }
	},
	legend: {
//		top: 30,
		bottom:'bottom',
		data: [],
		textStyle: {
			color: '#fff'
		}
	},
	xAxis: {
		name: '时',
		data: [],
		axisLine: {
			lineStyle: {
				color: '#ccc'
			}
		},

	},
	yAxis: {
		name: '比率',
		splitLine: {
			show: false
		},
		axisLine: {
			lineStyle: {
				color: '#ccc'
			}
		}
	},
	series: [{
		name: '接通量',
		type: 'bar',
		barWidth: 8,
		itemStyle: {
			normal: {
				color: new echarts.graphic.LinearGradient(
					0, 0, 0, 1, [{
							offset: 0,
							color: '#14c8d4'
						},
						{
							offset: 1,
							color: '#43eec6'
						}
					]
				)
			}
		},
		data: []
	},{
		name: '未接量',
		type: 'bar',
		barWidth: 8,
		itemStyle: {
			normal: {
				color: new echarts.graphic.LinearGradient(
					0, 0, 0, 1, [{
							offset: 0,
							color: '#14c8d4'
						},
						{
							offset: 1,
							color: '#43eec6'
						}
					]
				)
			}
		},
		data: []
	},{
		name: '未接量',
		type: 'bar',
		barWidth: 8,
		itemStyle: {
			normal: {
				color: new echarts.graphic.LinearGradient(
					0, 0, 0, 1, [{
							offset: 0,
							color: '#14c8d4'
						},
						{
							offset: 1,
							color: '#43eec6'
						}
					]
				)
			}
		},
		data: []
	}]

});

function partFour(){
	var index = layer.load(1, { shade: [0.5,'#030303'] //0.1透明度的白色背景
	});
   	   $.ajax({
   	   	type:"get",
   	   	url:huayi.config.callcenter_url + "CallManage/GetCallState",
   	   	async:true,
   	   	dataType:'json',
   	   	data:{
// 	   		date:$('#time4').val()
   	   	},
   	   	success:function(data){
   	   		if(data.state.toLowerCase()=='success'){
   	   			layer.close(index);
   	   			var con=data.data;
// 	   			var part3=data.data.b;
				jtv.setOption({
						legend: {
							data: con.callstates,
						},
						xAxis: {
							data:con.hour
						},
						series: [{
							data:con.callconn
						},{
							data:con.callunconn
						}]
						
				})
			
   	   		}
   	   	}
   	   });
   }
 
	//通话时长part4
var th_nums = echarts.init(document.getElementById('th_nums'));
th_nums.setOption({
//	title: {
//		text: '通话时长统计',
//		x: 'center',
//		textStyle: {
//			color: '#fff',
//			fontSize: 18,
//			fontWeight: 'normal'
//		}
//	},
	tooltip: {
		trigger: 'axis',
		axisPointer: {
			type: 'shadow',
			label: {
				show: true,
				backgroundColor: '#333'
			}
		}
	
	},
	legend: {
		bottom:'bottom',
		data: ['平均通话时长'],
		textStyle: {
			color: '#fff'
		}
	},
	xAxis: {
		name: '时',
		data: [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23],
		axisLine: {
			lineStyle: {
				color: '#ccc'
			}
		},

	},
	yAxis: {
		name: '秒',
		splitLine: {
			show: false
		},
		axisLine: {
			lineStyle: {
				color: '#ccc'
			}
		}
	},
	series: [{
		name: '平均通话时长',
		type: 'line',
		smooth:true,
		showAllSymbol:true,
		symbol :"emptyCircle",
		symbolSize: 10,
		data: []
	}]
});

function partFive(){
	var index = layer.load(1, { shade: [0.5,'#030303'] //0.1透明度的白色背景
	});
   	   $.ajax({
   	   	type:"get",
   	   	url:huayi.config.callcenter_url + "CallManage/GetCallTime",
   	   	async:true,
   	   	dataType:'json',
   	   	data:{
// 	   		date:$('#time5').val()
   	   	},
   	   	success:function(data){
   	   		if(data.state.toLowerCase()=='success'){
   	   			layer.close(index);
   	   			var con=data.data;
				th_nums.setOption({
//						xAxis: {
//							data:con.hours
//						},
						series: [{
							data:con.avgtime
						}]
						
				})
			
				
			
   	   		}
   	   	}
   	   });
   }
	Ajax();
	function Ajax(){
		partOne();
		partTwo() 
//		partThree();
		partFour();
		partFive();
	}
	setInterval(Ajax, huayi.config.indextime); //Ajax调用函数
})