var bigdataList = null; var sd = ""; var ed = ""; partpaat(sd, ed); // 轮播 banner1() // 轮播 function banner1(){ var i=0; var Timer; $(function(){ $(".picImg").eq(0).show().siblings().hide(); //默认第一个div片显示,其他的隐藏 //自动轮播 TimerBanner(); //点击红圈 $(".picImg").hover(function(){ //鼠标移动上去 clearInterval(Timer); //让计时器暂时停止 清除计时器 i=$(this).index(); //获取该圈的索引 showPic(); //调用显示图片的方法,显示该索引对应的图片 },function(){ //鼠标离开 TimerBanner(); //继续轮播 计时器开始 }); $(".tabs .aaa").hover(function(){ //鼠标移动上去 clearInterval(Timer); //让计时器暂时停止 清除计时器 i=$(this).index(); //获取该圈的索引 showPic(); //调用显示图片的方法,显示该索引对应的图片 },function(){ //鼠标离开 TimerBanner(); //继续轮播 计时器开始 }); //点击左右按钮 $(".btn1").click(function(){ clearInterval(Timer); i--; //往左 if(i==-1){ i=4; } showPic(); TimerBanner(); }); $(".btn2").click(function(){ clearInterval(Timer); i++; //往右 if(i==4){ i=0; } showPic(); TimerBanner(); }); }); //轮播部分 function TimerBanner(){ Timer = setInterval(function(){ i++; if(i==4){ i=0; } showPic() },5000); } //显示div function showPic() { $(".picImg").eq(i).show().siblings().hide(); $(".bg").hide(); $(".tabs .aaa").eq(i).children(".bg").show(); } } function partpaat(sd,ed) { var myChart = echarts.init(document.getElementById('chart')); var myChartaaa = echarts.init(document.getElementById('dback')); var myChartbbb = echarts.init(document.getElementById('mold')); var myChartppp = echarts.init(document.getElementById('uction')); var myChreti = echarts.init(document.getElementById('sippu')); var myKouc = echarts.init(document.getElementById('siupi')); var myKucot = echarts.init(document.getElementById('siupiac')); var myTou = echarts.init(document.getElementById('siyi')); $.ajax({ type: "get", url: huayi.config.callcenter_url + "Business/GetBigdataList", async: true, dataType: "json", data: { stime:sd, endtime:ed, }, success: function(data) { if (data.state.toLowerCase() == "success") { var con = data.data; var realtime = con.realtime; var acceptancetimes = con.acceptancetimes; var states = con.states; var region = con.region; //当日工单数量 var type_data_realtime_time = []; var type_data_realtime_total = []; $(realtime).each(function(i, n) { type_data_realtime_time.push(n.time); type_data_realtime_total.push(n.total); }) //24小时时段受理量/处理量 var type_data_acceptancetimes_time = []; var type_data_acceptancetimes_accept = []; var type_data_acceptancetimes_handle = []; $(acceptancetimes).each(function(i, n){ type_data_acceptancetimes_time.push(n.time); type_data_acceptancetimes_accept.push(n.accept); type_data_acceptancetimes_handle.push(n.handle); }) //工单个状态数量分布 var type_data_states = []; $(states).each(function(i, n){ var type_data_states_name_total = {}; type_data_states_name_total.value = n.total; type_data_states_name_total.name = n.name; type_data_states.push(type_data_states_name_total); }) //受理区域 var type_data_region_name = []; var type_data_region_total = []; $(region).each(function(i, n){ type_data_region_name.push(n.name); type_data_region_total.push(n.total); }) // 当日工单数量 myChreti.setOption({ title: { text: '当日工单数量', x: 'center', textStyle: { "color": "#FFFFFF" } }, tooltip: { trigger: 'axis' }, xAxis: { type: 'category', data: type_data_realtime_time, axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, }, yAxis: { type: 'value', axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, splitLine :{ //网格线 lineStyle:{ type:'dashed' //设置网格线类型 dotted:虚线 solid:实线 }, show:true //隐藏或显示 } }, series: [{ name: '数量', data: type_data_realtime_total, type: 'line', itemStyle: { normal: { color: '#FAD860', } }, }] }); myChartppp.setOption({ tooltip: { trigger: 'axis' }, xAxis: { type: 'category', data: type_data_realtime_time, axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, }, yAxis: { show: false, }, series: [{ name: '数量', data: type_data_realtime_total, type: 'line', itemStyle: { normal: { color: '#FAD860', } }, }] }); //24小时时段受理量/处理量分布图 myKouc.setOption({ title: { text: '24小时时段受理量/处理量分布图', x: 'center', textStyle: { "color": "#FFFFFF" } }, legend: { data: ['受理量', '处理量'], bottom: 5, textStyle: { color: "#FFFAF0" } }, tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, xAxis: { type: 'category', data: type_data_acceptancetimes_time, axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, }, yAxis: { type: 'value', boundaryGap: [0, 0.01], axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, splitLine: { //网格线 show: false //隐藏或显示 }, }, series: [ { name: '受理量', type: 'bar', itemStyle: { normal: { color: '#1890FF', } }, data: type_data_acceptancetimes_accept, }, { name: '处理量', type: 'bar', itemStyle: { normal: { color: '#13C2C2', } }, data: type_data_acceptancetimes_handle, } ] }) myChart.setOption({ tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, xAxis: { type: 'category', data: type_data_acceptancetimes_time, axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, }, yAxis: { show: false, }, series: [ { name: '受理量', type: 'bar', itemStyle: { normal: { color: '#1890FF', } }, data: type_data_acceptancetimes_accept, }, { name: '处理量', type: 'bar', itemStyle: { normal: { color: '#13C2C2', } }, data: type_data_acceptancetimes_handle, }, ] }) //工单各状态数量分布 myKucot.setOption({ title : { text: '工单各状态数量分布', x: 'center', textStyle: { "color": "#FFFFFF" } }, tooltip : { trigger: 'item', formatter: "{a}
{b} : {c} ({d}%)" }, series : [ { name: '工单各状态数量分布', type: 'pie', radius : '55%', data: type_data_states, itemStyle: { normal: { color: function(params) { //自定义颜色 var colorList = [ '#1890FF', '#2EC25B', '#FACC14', '#04D9FF', '#8543E0', '#13C2C2', '#00C0FF', '#05EB78', '#D141D9', '#05EB61', '#2FCDCD', '#BEEB30', '#EB9005', '#FFFF00', '#FF7F50', '#3CB371', '#00BFFF', '#9932CC', ]; return colorList[params.dataIndex] } } } } ] }) myChartaaa.setOption({ tooltip : { trigger: 'item', formatter: "{a}
{b} : {c} ({d}%)" }, series : [ { name: '工单各状态数量分布', type: 'pie', radius : '55%', data: type_data_states, label: { normal: { show: false } }, itemStyle: { normal: { color: function(params) { //自定义颜色 var colorList = [ '#1890FF', '#2EC25B', '#FACC14', '#04D9FF', '#8543E0', '#13C2C2', '#00C0FF', '#05EB78', '#D141D9', '#05EB61', '#2FCDCD', '#BEEB30', '#EB9005', '#FFFF00', '#FF7F50', '#3CB371', '#00BFFF', '#9932CC', ]; return colorList[params.dataIndex] } } } } ] }) //受理区域 myTou.setOption({ title: { text: '受理区域', x: 'center', textStyle: { "color": "#FFFFFF" } }, tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, xAxis: { type: 'category', data: type_data_region_name, axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, }, yAxis: { type: 'value', boundaryGap: [0, 0.01], axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, splitLine: { //网格线 show: false //隐藏或显示 }, }, series: [ { name: '数量', type: 'bar', data: type_data_region_total, itemStyle: { normal: { color: '#1890FF', } }, }, ] }) myChartbbb.setOption({ tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, xAxis: { type: 'category', data: type_data_region_name, axisLine: { lineStyle: { color: '#FFFFFF',//坐标线的颜色 } }, }, yAxis: { show: false, }, series: [ { name: '数量', type: 'bar', data: type_data_region_total, itemStyle: { normal: { color: '#1890FF', } }, } ] }) } } }); }