ShuangHui_UI/WebChart/js/laiyuanqudao...

		$(document).ready(function() {

			laydate.render({
				elem: '#time1',
				theme: '#00a1cb'
			});
			laydate.render({
				elem: '#time2',
				theme: '#00a1cb'
			});
			laydate.render({
				elem: '#time3',
				theme: '#00a1cb'
			});

			laydate.render({
				elem: '#time4',
				theme: '#00a1cb'
			});
			laydate.render({
				elem: '#time5',
				theme: '#00a1cb'
			});

			var container1 = echarts.init(document.getElementById('container1'));
			container1.setOption({
				tooltip: {
					trigger: 'axis',
					axisPointer: {
						type: 'cross',
						label: {
							show: true,
							backgroundColor: '#030917'
						}
					}
				},
				legend: {
					//				x : '20%',
					//			    y : '25%',
					//				width:"90%",
					//				bottom:0,
					//				data: [],
					//				textStyle: {
					//					color: '#ccc'
					//				},
					show: false

				},
				xAxis: {
					name: '时间',
					data: [],
					axisLine: {
						lineStyle: {
							color: '#ccc'
						}
					}
				},
				yAxis: {
					name: '数量',
					//				min: 0,
					//				max: 100,
					//				interval: 20,
					splitLine: {
						show: false
					},
					axisLine: {
						lineStyle: {
							color: '#fff'
						}
					}
				},
				series: [],
				color: ['#61a0a9', '#cb885d', '#c4352d', '#314452', '#a88c1e', '#2f5675', '#94c8b1', '#babc2f', '#e86617', '#afe817', '#e8178d']
			});
			

			function partOne() {
				var index = layer.load(1, {
					shade: [0.5, '#030303'] //0.1透明度的白色背景
				});
				$('.list_one').html('');
				$.ajax({
					type: "get",
					url: huayi.config.callcenter_url + "info/GetAreaCount24ByDate",
					async: true,
					dataType: "json",
					data: {
						date: $('#time1').val()
					},
					success: function(data) {
						if(data.state.toLowerCase() == "success") {
							layer.close(index);
							var con = data.data;
							var part1Axis = con.hours;
							var sers = []
							$(con.cols).each(function(i, n) {
								var html = "";
								var obj = {};
								obj.name = n;
								obj.type = "line";
								obj.smooth = true;
								obj.showAllSymbol = true;
								obj.symbol = "emptyCircle";
								obj.symbolSize = 10;
								obj.data = con.counts[i];
								sers.push(obj);
								//							qunZhongArea.push(n.AreaName);
								//							$('<tr>'+
								//								'<td>'+ n.AreaName +'</td>'+
								//								'<td><a>'+ n.Count +'</a></td>'+
								//							'</tr>').appendTo('.table1 tbody');
								html = '<li>' +
									'<div class="tool_count">' +
									'<span class="iconfont icon-tubiao4 color' + i + ' tbr"></span>' + con.cols[i] + ':'+con.tcounts[i]+'<div class="tooltips clearfix">'+
									'<div class="toolsTitle">'+  con.cols[i] +':'+con.tcounts[i]+'</div>'
								$(con.items[i]).each(function(i, n) {
									html += '<p>' + n.TypeName + '：' + n.Count + '</p>'
								})
								html += '</div>' +
									'</div>' +
									'</li>';
								$('.list_one').append(html);
							})
							container1.setOption({
								xAxis: {
									data: part1Axis
								},
								//							legend: {
								//								data: qunZhongArea.cols
								//							},
								series: sers
							});

						}
					}

				});

			}

			$('.list').on('click', 'li', function() {
				if($(this).find(".tooltips").css("display") == 'none') {
					$(this).find(".tooltips").show();
					$(this).siblings().find(".tooltips").hide();
				} else {
					$(this).find(".tooltips").hide()
				}

			})
			$('.part1Btn').click(function() {
				partOne();
			})

			//受理区域统计 part2
			var shouLiArea = echarts.init(document.getElementById('shouLiArea'));
			shouLiArea.setOption({
//				title: {
//					text: '投诉/举报汇总',
//					x: 'center',
//					textStyle: {
//						color: '#fff',
//						fontSize: 18
//					},
//				},
				tooltip: {
					trigger: 'item',
					formatter: "{a} <br/>{b} : {c} ({d}%)",
					axisPointer: {
						crossStyle: {
							color: '#fff'
						}
					}
				},
				legend: {
					orient: 'vertical',
					bottom: '20%',
					right:'right',
					data: [],
					textStyle: {
						color: '#fff'
					}
				},
				series: [{
					name: '数量统计',
					type: 'pie',
					radius: '55%',
					center: ['35%', '50%'],
					data: [],
					itemStyle: {
						emphasis: {
							shadowBlur: 10,
							shadowOffsetX: 0,
							shadowColor: 'rgba(0, 0, 0, 0.5)'
						},
						normal: {
							label: {
								show: true,
								formatter: '{b} : {c} ({d}%)'
//								formatter: '{c} ({d}%)'
							},
							labelLine: {
								show: true
							}
						}
					},
					label: {
						normal: {
							textStyle: {
								color: '#fff'
							}
						}
					}
				}]
			});
			
			function partTwo(){
				$('.list_two').html(''); 
					var index = layer.load(1, {
			shade: [0.5, '#030303'] //0.1透明度的白色背景
		});
				$.ajax({
					type:"get",
					url:huayi.config.callcenter_url + "info/GetAreaCountByDate",
					async:true,
					dataType:'json',
					data:{
						start:$('#time2').val(),
						end:$('#time3').val()
					},
					success:function(data){
						if(data.state.toLowerCase()=='success'){
							layer.close(index);
							var con=data.data;
							var hsouLiArea_lengend = [];
							var hsouLiArea_ser = [];
							$(con).each(function(i, n) {
								var html = "";
								var hsouLiArea_obj = {};
								if(n.AreaName.indexOf('商丘') != -1) {
									n.AreaName = "市直单位"
								}
								hsouLiArea_lengend.push(n.AreaName);
								hsouLiArea_obj.value = n.Count;
								hsouLiArea_obj.name = n.AreaName;
								hsouLiArea_ser.push(hsouLiArea_obj);
								 
								html = '<li>' +
									'<div class="tool_count">' +
									'<span class="iconfont icon-tubiao3 color' + i + ' tbr"></span>' + n.AreaName + ':' + n.Count + '<div class="tooltips clearfix">'+
										'<div class="toolsTitle">' + n.AreaName + ':' + n.Count + '</div>'
								$(n.Item).each(function(j, m) {
									html += '<p>' + m.TypeName + '：' + m.Count + '</p>'
								})
								html += '</div>' +
									'</div>' +
									'</li>';
								$('.list_two').append(html); 
							})
							shouLiArea.setOption({
								legend: {
									data: hsouLiArea_lengend,
									selected: {
										'当即办理': false
									}
								},
								series: [{
									data: hsouLiArea_ser
								}]
							});
						}
					}
				});
			}
			$('.part2Btn').click(function() {
				partTwo();
			})
			
			//受理渠道24小时统计 part3
			var qd_box = echarts.init(document.getElementById('qd_box'));
			qd_box.setOption({

				tooltip: {
					trigger: 'axis',
					axisPointer: {
						type: false,
						label: {
							show: true,
							backgroundColor: '#030917'
						}
					},
					//			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,
					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: 18,
					itemStyle: {
						normal: {
							color: new echarts.graphic.LinearGradient(
								0, 0, 0, 1, [{
										offset: 0,
										color: '#14c8d4'
									},
									{
										offset: 1,
										color: '#43eec6'
									}
								]
							)
						}
					},
					label: {
						normal: {
							show: true,
							position: 'top', //顶部数据显示位置
							formatter: '{c}' // 这里是数据展示的时候显示的数据
						}
					},
					data: []
				}]

			});
   			
   			function part_three(){
   				$('.list_three').html(''); 
   				var index = layer.load(1, {
			shade: [0.5, '#030303'] //0.1透明度的白色背景
		});
   				$.ajax({
   					type:"get",
   					url: huayi.config.callcenter_url + "info/GetSourcePercentByDate",
					dataType: 'json',
					async: true,
					data:{
						start:$('#time4').val(),
						end:$('#time5').val()
					},
					success:function(data){
						if(data.state.toLowerCase()=='success'){
								layer.close(index);
							var con=data.data;
							var qd_legend = [];
							var qd_sers = [];
							var ser_data = [];
							var qd_label = {
								normal: {
									show: true,
									position: 'inside',
									formatter: '{c}%'
								}
							};
							$(con).each(function(i, n) {
								var htmls="";
								ser_data.push(n.Count)
								qd_legend.push(n.Source);
								htmls = '<li>' +
									'<div class="tool_count">' +
									'<span class="iconfont icon-tubiaozhuzhuangtu color11 tbr"></span>' + n.Source + ':' + n.Count + '<div class="tooltips clearfix">'
								$(n.Item).each(function(j, m) {
									htmls += '<p>' + m.TypeName + '：' + m.Count + '</p>'
								})
								htmls += '</div>' +
									'</div>' +
									'</li>';
								$('.list_three').append(htmls); 
							})
							qd_box.setOption({
								legend: {
									data: qd_legend
								},

								xAxis: {
									data: qd_legend
								},
								series: {
									data: ser_data
								}

							});
						}
					}
   				});
   			}
$('.part3Btn').click(function() {
				part_three();
			})
		 Ajax();
		function Ajax() {
			partOne();
			partTwo();
			part_three();
			}
			setInterval(Ajax, huayi.config.indextime);//Ajax调用函数
//				
})