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',
}
},
}
]
})
}
}
});
}