ShuangHui_UI/WebChart/js/TelephoneDet...

	var areaOneVal = helper.cookies.get("areaOneVal");
	var areaOneText = helper.cookies.get("areaOneText");
	if (areaOneVal) {
		var areaOneVal = helper.cookies.get("areaOneVal");
		
	} else{
		var areaOneVal="sqs12345"
		
	}
	$(function() {
		laydate.render({
			elem: '#time1',
			range: '~',
			theme: '#114a97',
			done: function(value, date) {
				var areaOneVal=$(".areaOne").val();
				partOne(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1],areaOneVal);
			}

		});
		laydate.render({
			elem: '#time2',
			theme: '#114a97',
			done: function(value, date) {
				var areaOneVal=$(".areaOne").val();
				partTwo(value,areaOneVal)
			}
		});
		laydate.render({
			elem: '#time3',
			theme: '#114a97',
			done: function(value, date) {
				var areaOneVal=$(".areaOne").val();
				partThree(value,areaOneVal)
			}
		});
		Ajax();
		$(".areaOne").change(function() {
	      	var areaOneVal=$(this).val();
      		var areaOneText=$(".areaOne").find("option:selected").text();
      		helper.cookies.set("areaOneVal", areaOneVal, 7);
      		helper.cookies.set("areaOneText", areaOneText, 7);
	      	partOne($('#time1').val() && $('#time1').val().split(' ~ ')[0], $('#time1').val() && $('#time1').val().split(' ~ ')[1],areaOneVal);
			partTwo($('#time2').val(),areaOneVal);
			partThree( $('#time3').val(),areaOneVal);
	//  	Ajax()
		});
	})
	//区县筛选
	deprtment();
	function deprtment() {
		$.getJSON( huayi.config.callcenter_url +"CountyBranch/GetBranchListS", function(result) {
			if(result.state.toLowerCase() == "success") {
				goodslist = result.data;
	//			第五屏
				$(".areaOne").empty();
				$(goodslist).each(function(i, n) {
					$('<option value="' + n.F_Code 
					+ '">' + n.F_Name 
					+ '</option>').appendTo($(".areaOne"));
				});
				if (areaOneVal) {
					$(".areaOne").val(areaOneVal);
				}
			}
		});
	}
	var sitProportion = echarts.init(document.getElementById('sitProportion')); //坐席闲忙比例
	sitProportion.setOption({
		color: ['#4ab7c7', '#2484d9', '#2e39c1'],
		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: 'top',
			left: '135px',
			data: ['置忙', '通话', '空闲'],
			textStyle: {
				color: '#00e9ff'
			}
		},
		grid: {
			left: '1%',
			right: '3%',
			bottom: '5%',
			containLabel: true
		},
		xAxis: {
			name: '时',
			data: [],
			axisLine: {
				lineStyle: {
					color: '#3061a2'
				}
			},
			axisTick: {
				alignWithLabel: true,
				show: false
			},
			axisLabel: { //横轴字体颜色
				show: true,
				textStyle: {
					color: '#eff0f4'
				}
			}

		},
		yAxis: {
			name: '(比率)',
			splitLine: {
				show: false
			},
			axisLine: {
				lineStyle: {
					color: '#3061a2'
				}
			},
			axisLabel: { //横轴字体颜色
				show: true,
				textStyle: {
					color: '#eff0f4'
				}
			}
		},
		series: [{
			name: '置忙',
			type: 'bar',
			data: []
		}, {
			name: '通话',
			type: 'bar',
			data: []
		}, {
			name: '空闲',
			type: 'bar',
			data: []
		}]

	});

	function partOne(starts, ends,areaOneVal) {
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "info/GetUserStateCount24ByDate",
			async: true,
			dataType: 'json',
			data: {
				start: starts,
				end: ends,
				branchcode:areaOneVal
			},
			success: function(data) {
				if(data.state.toLowerCase() == 'success') {
					// 	   			layer.close(index);
					var con = data.data;
					sitProportion.setOption({
						xAxis: {
							data: con.hours
						},
						series: [{
							data: con.thpercents
						}, {
							data: con.zmpercents
						}, {
							data: con.kxpercents
						}]

					})

				}
			}
		});
	}

	//part 2
	var phoneTimeCount = echarts.init(document.getElementById('phoneTimeCount'));
	phoneTimeCount.setOption({
		color: ['#ceba5f', '#4da991', '#f06e84', '#6a91e0'],
		tooltip: {
			trigger: 'axis',
			axisPointer: {
				type: 'cross',
				label: {
					show: true,
					backgroundColor: '#333'
				}
			}
		},
		grid: {
			left: '2%',
			right: '5%',
			bottom: '6%',
			containLabel: true
		},
		legend: {
			top: 'top',
			left: '180px',
			data: ["来电数量", "接通数量", "放弃数量", "黑名单拒接数量"],
			textStyle: {
				color: '#00e9ff'
			}

		},
		xAxis: {
			name: '时',
			data: [],
			axisLine: {
				lineStyle: {
					color: '#3061a2'
				}
			},
			axisTick: {
				alignWithLabel: true,
				show: false
			},
			axisLabel: { //横轴字体颜色
				show: true,
				textStyle: {
					color: '#eff0f4'
				}
			}
		},
		yAxis: {
			name: '数量',
			splitLine: {
				show: false
			},
			axisLine: {
				lineStyle: {
					color: '#3061a2'
				}
			},
			axisLabel: { //横轴字体颜色
				show: true,
				textStyle: {
					color: '#eff0f4'
				}
			}
		},
		series: []
	});

	function partTwo(dates,areaOneVal) {
		//		var index = layer.load(1, {
		//			shade: [0.5, '#030303'] //0.1透明度的白色背景
		//		});
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "info/GetTelCount24ByDate",
			async: true,
			dataType: "json",
			data: {
				date: dates,
				branchcode:areaOneVal
			},
			success: function(data) {
				if(data.state.toLowerCase() == "success") {
					//					layer.close(index);
					var con = data.data;
					phoneTimeCount.setOption({
						xAxis: {
							data: con.hours
						},
						series: [{
								name: "来电数量",
								type: "line",
								smooth: true,
								showAllSymbol: true,
								symbol: "emptyCircle",
								symbolSize: 10,
								data: con.rcounts
							}, {
								name: "接通数量",
								type: "line",
								smooth: true,
								showAllSymbol: true,
								symbol: "emptyCircle",
								symbolSize: 10,
								data: con.ccounts
							},
							{
								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
							}
						]

					})

				}
			}

		});

	}

	//part3
	var todyPhoneCount = echarts.init(document.getElementById('todyPhoneCount'));
	todyPhoneCount.setOption({
		tooltip: {
			trigger: 'axis',
			axisPointer: {
				type: false,
				label: {
					show: true,
					backgroundColor: '#030917'
				}
			},
		},
		xAxis: {
			name: '类型',
			data: ["话务量(通)", "来电(通)", "接通量(通)", "平均通话时长(秒)"],
			axisLine: {
				lineStyle: {
					color: '#3061a2'
				}
			},
			axisTick: {
				alignWithLabel: true,
				show: false
			},
			axisLabel: { //横轴字体颜色
				show: true,
				textStyle: {
					color: '#eff0f4'
				}
			}
		},
		yAxis: {
			name: '数量',
			splitLine: {
				show: false
			},
			axisLine: {
				lineStyle: {
					color: '#3061a2'
				}
			},
			axisLabel: { //横轴字体颜色
				show: true,
				textStyle: {
					color: '#eff0f4'
				}
			}

		},
		series: [{
			name: '数量',
			type: 'bar',
			barWidth: 18,
			itemStyle: {
				normal: {
					color: function(params) {
						// build a color map as your need.
						var colorList = [
							'#368cab', '#54b793', '#4b6ab0', '#2531a9'
						];
						return colorList[params.dataIndex]
					}
				}
			},
			label: {
				normal: {
					show: true,
					position: 'top', //顶部数据显示位置
					textStyle: {
						color: '#fff' //顶部数据颜色
					},
					formatter: '{c}' // 这里是数据展示的时候显示的数据
				}
			},
			data: []
		}]

	});

	function partThree(dates,areaOneVal) {
		$.ajax({
			type: "get",
			url: huayi.config.callcenter_url + "info/GetTelCountByDate",
			async: true,
			dataType: "json",
			data: {
				date: dates,
				branchcode:areaOneVal
			},
			success: function(data) {
				if(data.state.toLowerCase() == "success") {
					//					layer.close(index);
					var con = data.data;
					todyPhoneCount.setOption({
						series: [{
							data: [con.hwcon, con.lhcon, con.jtcon, con.pjthtimes]
						}]

					})

				}
			}

		});

	}

	function Ajax() {
		var areaOneVal = helper.cookies.get("areaOneVal");
		var areaOneText = helper.cookies.get("areaOneText");
		partOne($('#time1').val() && $('#time1').val().split(' ~ ')[0], $('#time1').val() && $('#time1').val().split(' ~ ')[1],areaOneVal);
		partTwo($('#time2').val(),areaOneVal)
		partThree($('#time3').val(),areaOneVal);
	}