var bigdataList = null;
var sd = "";
var ed = "";
gettraffic(sd, ed);
getAgentData(sd, ed);
//轮播
banner1()
//轮播
function banner1(){
var i=0;
var Timer;
$(function(){
$(".trafficImg").eq(0).show().siblings().hide(); //默认第一个div片显示，其他的隐藏
//自动轮播
TimerBanner();
//点击红圈
$(".trafficImg").hover(function(){ //鼠标移动上去
clearInterval(Timer); //让计时器暂时停止 清除计时器
i=$(this).index(); //获取该圈的索引
showPic(); //调用显示图片的方法，显示该索引对应的图片
},function(){ //鼠标离开
TimerBanner(); //继续轮播 计时器开始
});
$(".trafficTabs .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() {
$(".trafficImg").eq(i).show().siblings().hide();
$(".trafficBg").hide();
$(".trafficTabs .aaa").eq(i).children(".trafficBg").show();
}
}
function gettraffic(sd,ed) {
var myChartaaa = echarts.init(document.getElementById('smallAppealTotal'));
var myChartbbb = echarts.init(document.getElementById('smallCallConnected'));
var myChartppp = echarts.init(document.getElementById('smallAppeal'));
var myChreti = echarts.init(document.getElementById('trafficAppeal'));
var myKouc = echarts.init(document.getElementById('trafficCallConnected'));
var myKucot = echarts.init(document.getElementById('trafficAppealTotal'));
$.ajax({
type: "get",
url: huayi.config.callcenter_url + "Business/GetTelephoneList",
async: true,
dataType: "json",
data: {
stime:sd,
endtime:ed,
},
success: function(data) {
if (data.state.toLowerCase() == "success") {
var con = data.data;
var type = con.type;
var conversations = con.conversations;
var dates = con.dates;
//诉求占比统计
var type_data_type = [];
$(type).each(function(i, n){
var type_data_type_name_total = {};
type_data_type_name_total.value = n.total;
type_data_type_name_total.name = n.name;
type_data_type.push(type_data_type_name_total);
})
//24小时来电量/接通量统计
var type_data_conversations_time = [];
var type_data_conversations_Incomingcall = [];
var type_data_conversations_Connect = [];
$(conversations).each(function(i, n) {
type_data_conversations_time.push(n.time);
type_data_conversations_Incomingcall.push(n.Incomingcall);
type_data_conversations_Connect.push(n.Connect);
})
//话务总体数据统计展示
var type_data_dates_total= [];
$(dates).each(function(i, n) {
type_data_dates_total.push(n.average);
type_data_dates_total.push(n.connection);
type_data_dates_total.push(n.traffic);
})
myChreti.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_type,
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]
}
}
}
}
]
})
myChartppp.setOption({
tooltip : {
trigger: 'item',
formatter: "{a}
{b} : {c} ({d}%)"
},
series : [
{
name: '诉求占比',
type: 'pie',
radius : '55%',
data: type_data_type,
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]
}
}
}
}
]
})
myKouc.setOption({
title: {
text: '24小时来电量/接通量统计',
x: 'center',
textStyle: {
"color": "#FFFFFF"
}
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['来电量', '接通量'],
bottom: 5,
textStyle: {
color: "#FFFAF0"
}
},
xAxis: {
type: 'category',
data: type_data_conversations_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_conversations_Incomingcall,
type: 'line',
itemStyle: {
normal: {
color: '#1890FF',
}
},
},
{
name: '接通量',
data: type_data_conversations_Connect,
type: 'line',
itemStyle: {
normal: {
color: '#13C2C2',
}
},
},
]
});
myChartbbb.setOption({
tooltip: {
trigger: 'axis'
},
xAxis: {
type: 'category',
data: type_data_conversations_time,
axisLine: {
lineStyle: {
color: '#FFFFFF',//坐标线的颜色
}
},
},
yAxis: {
show: false,
},
series: [
{
name: '来电量',
data: type_data_conversations_Incomingcall,
type: 'line',
itemStyle: {
normal: {
color: '#1890FF',
}
},
},
{
name: '接通量',
data: type_data_conversations_Connect,
type: 'line',
itemStyle: {
normal: {
color: '#13C2C2',
}
},
},
]
});
myKucot.setOption({
title: {
text: '话务总体数据统计展示',
x: 'center',
textStyle: {
"color": "#FFFFFF"
}
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
xAxis: {
type: 'category',
data: ['平均通话时长（秒）', '接通量', '话务数'],
axisLine: {
lineStyle: {
color: '#FFFFFF',//坐标线的颜色
}
},
},
yAxis: {
type: 'value',
boundaryGap: [0, 0.01],
axisLine: {
lineStyle: {
color: '#FFFFFF',//坐标线的颜色
}
},
splitLine: { //网格线
show: false //隐藏或显示
},
},
series: [
{
name: '数量',
type: 'bar',
barWidth: 30,
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]
},
}
},
data: type_data_dates_total,
},
]
})
myChartaaa.setOption({
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
xAxis: {
type: 'category',
data: ['平均通话时长', '接通量', '话务数'],
axisLine: {
lineStyle: {
color: '#FFFFFF',//坐标线的颜色
},
},
},
yAxis: {
show: false,
},
series: [
{
name: '数量',
type: 'bar',
barWidth: 20,
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]
},
},
},
data: type_data_dates_total,
},
]
})
}
}
});
}
// 坐席实时数据
function getAgentData(sd,ed) {
var myTou = echarts.init(document.getElementById('trafficAgentBusy'));
var myChart = echarts.init(document.getElementById('smallAgentBusy'));
$.ajax({
type: "get",
url: huayi.config.callcenter_url + "Business/GetAgentTelCount",
async: true,
dataType: "json",
data: {
stime:sd,
endtime:ed,
},
success: function(data){
if (data.state.toLowerCase() == "success") {
var con = data.data;
var inconnectcount = con.inconnectcount; //呼入接通
var incount = con.incount; //呼入
var outconnectcount = con.outconnectcount; //呼出接通
var outcount = con.outcount; //呼出
var users = con.users; //坐席
myTou.setOption({
title: {
text: '坐席实时数据',
x: 'center',
textStyle: {
"color": "#FFFFFF"
}
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['呼入', '呼入接通', '呼出', '呼出接通'],
bottom: 5,
textStyle: {
color: "#FFFAF0"
}
},
xAxis: {
type: 'category',
data: users,
axisLine: {
lineStyle: {
color: '#FFFFFF',//坐标线的颜色
}
},
},
yAxis: {
type: 'value',
axisLine: {
lineStyle: {
color: '#FFFFFF',//坐标线的颜色
}
},
splitLine :{ //网格线
lineStyle:{
type:'dashed' //设置网格线类型 dotted：虚线 solid:实线
},
show:true //隐藏或显示
}
},
series: [
{
name: '呼入',
data: incount,
type: 'line',
itemStyle: {
normal: {
color: '#1890FF',
}
},
},
{
name: '呼入接通',
data: inconnectcount,
type: 'line',
itemStyle: {
normal: {
color: '#8543E0',
}
},
},
{
name: '呼出',
data: outcount,
type: 'line',
itemStyle: {
normal: {
color: '#2EC25B',
}
},
},
{
name: '呼出接通',
data: outconnectcount,
type: 'line',
itemStyle: {
normal: {
color: '#FACC14',
}
},
},
]
});
myChart.setOption({
tooltip: {
trigger: 'axis'
},
xAxis: {
type: 'category',
data: users,
axisLine: {
lineStyle: {
color: '#FFFFFF',//坐标线的颜色
}
},
},
yAxis: {
show: false,
},
series: [
{
name: '呼入',
data: incount,
type: 'line',
itemStyle: {
normal: {
color: '#1890FF',
}
},
},
{
name: '呼入接通',
data: inconnectcount,
type: 'line',
itemStyle: {
normal: {
color: '#8543E0',
}
},
},
{
name: '呼出',
data: outcount,
type: 'line',
itemStyle: {
normal: {
color: '#2EC25B',
}
},
},
{
name: '呼出接通',
data: outconnectcount,
type: 'line',
itemStyle: {
normal: {
color: '#FACC14',
}
},
},
]
});
}
}
})
}