var telCountData var barWidth = 20 $('.btn_time').click(function(e) { if(e.target.tagName == 'SPAN') { if($(e.target).attr('data-state') == '1') { $(".hwsjtj").hide() $('.daySeat').css('display', 'none') $('.timeTraffic').css('display', 'inline-block') $('#traffic').css('display', 'none') $('#timeTraffic').css('display', 'block') $(this).siblings(".act").children("label").attr("indexTitle", "日话务数据统计1") $('.call_situation h2').text('话务数据统计') getworkOrder() trafficState = 0 } } e.stopPropagation(); }) var insertType = ''; var insertText = ''; function getworkOrder() { insertType = ''; insertText = ''; let workOrderData = []; let workOrderName = [] new doAjax({ url: huayi.config.callcenter_url + "/InfoNew/GetTelCountByNow", data: { token: $.cookie("token"), second:$('#secondCut').val(), timetype: telCountByNowType }, callBack: function(res) { var data = res.data.hw[0] // var data = {"invalid":40,"hwcount":426,"jtcount":384,"zzcount":0,"hbcount":11,"hccount":68,"hcjtcount":37,"jtbili":"99.48","zzbili":"0.00","hbbili":"2.85","hcbili":"54.41","effective":386.0}; telCountData = data if ($('#secondCut').val() == '15') { // if (data.hbcount > 0) { // insertType = '回拨'; // insertText = '人工: ' + data.artificial + '(' + telCountData.hbbili + '%)' // } else if (data.zzcount > 0) { // insertType = '自助'; // insertText = '人工: ' + data.artificial + '(' + telCountData.hbbili + '%)' // } else if (data.jtcount > 0) { // insertType = '接通'; // insertText = '人工: ' + data.artificial + '(' + telCountData.hbbili + '%)' // } insertText = '人工: ' + data.artificial + '(' + telCountData.artificialbili + '%)' } trafficDataChart(data) } }); } function getLabelOption(positionObj, numberType) { var labelOption = { show: true, rotate: 0, align: 'left', color: '#fff', verticalAlign: 'middle', position: positionObj, formatter: function(params) { // console.log(params.seriesName, 'params.seriesName') if(params.value > 0) { dataValue = params.seriesName + ': ' + params.value if ($('#secondCut').val() == '15') { if (params.seriesName == '接通') { return insertText; } else if(params.seriesName === "呼出接通") { dataValue = dataValue + '(' + telCountData.hcbili + '%)' } else if (['回拨', '自助'].includes(params.seriesName)) { return ''; } } else { if(params.seriesName === "回拨") { dataValue = dataValue + '(' + telCountData.hbbili + '%)' } else if(params.seriesName === "自助") { dataValue = dataValue + '(' + telCountData.zzbili + '%)' } else if(params.seriesName === "人工") { dataValue = dataValue + '(' + telCountData.jtbili + '%)' } else if(params.seriesName === "接通") { dataValue = dataValue + '(' + telCountData.jtbili + '%)' } else if(params.seriesName === "呼出接通") { dataValue = dataValue + '(' + telCountData.hcbili + '%)' } } // if ($('#secondCut').val() == '15') { // dataValue += ' \n\n' // } // if (insertType && params.seriesName == insertType) { // dataValue = insertText + '\n\n' + dataValue // } // return dataValue; } else { return ' '; } }, fontSize: 12, }; return labelOption } function getItemStyleColor(colorSting){ var ColorData if (colorSting === 'red') { ColorData = ['#DC0707','#DC0707','#AF0808','#AF0808'] } else if(colorSting === 'yellow'){ ColorData = ['#EE7923','#F67C20','#D16A1E','#CC681E'] } else if (colorSting === 'green'){ ColorData = ['#2ADFE1','#32FFEE','#04D1C1','#00E8D5'] } var color = { type: 'linear', x: 0, x2: 1, y: 0, y2: 0, colorStops: [{ offset: 0, color: ColorData[0] }, { offset: 0.5, color: ColorData[1] }, { offset: 0.5, color: ColorData[2] }, { offset: 1, color: ColorData[3] } ] } return color } function trafficDataChart(getdata) { let hotThingsLeft = echarts.init(document.getElementById("timeTrafficLeft")); let hotThingsRight = echarts.init(document.getElementById("timeTrafficRight")); window.onresize = function() { hotThingsLeft.resize() hotThingsRight.resize() } // console.log($('#secondCut').val(), '123') if ($('#secondCut').val() == '15') { hotThingsLeft.setOption(getOption15(getSeriesLeftData15(),['呼入量接通量'])); } else { hotThingsLeft.setOption(getOption(getSeriesLeftData(),['呼入量接通量'])); } //hotThingsLeft.setOption(getOption(getSeriesLeftData(),['呼入量接通量'])); hotThingsRight.setOption(getOption(getSeriesRightData(),['呼出量呼出接通量'])); } function getSeriesLeftData15 (){ return [{ name: '有效来电', type: 'bar', stack: 'A', label: getLabelOption(['-350%', 40], 0), barWidth, emphasis: { focus: 'series' }, data: [telCountData.effective], itemStyle: { color: getItemStyleColor('red') } }, { name: '无效来电', type: 'bar', stack: 'A', label: getLabelOption(['-350%', 0], 0), barWidth, emphasis: { focus: 'series' }, data: [telCountData.invalid], itemStyle: { color: getItemStyleColor('yellow') } }, { name: '接通', type: 'bar', stack: 'Ad', barWidth, //hbbili label: getLabelOption(['100%', 20], 0), emphasis: { focus: 'series' }, data: [telCountData.jtcount], itemStyle: { color: getItemStyleColor('green') } }, { name: '自助', type: 'bar', stack: 'Ad', barWidth, label: getLabelOption(['100%', 0], 0), emphasis: { focus: 'series' }, data: [telCountData.zzcount], itemStyle: { color: getItemStyleColor('yellow') } }, { name: '回拨', type: 'bar', stack: 'Ad', barWidth, label: getLabelOption(['100%', -20], 0), emphasis: { focus: 'series' }, data: [telCountData.hbcount], itemStyle: { color: getItemStyleColor('red') } }, ] } function getSeriesLeftData (){ return [{ name: '有效来电', type: 'bar', stack: 'A', label: getLabelOption(['-350%', 40], 0), barWidth, emphasis: { focus: 'series' }, data: [telCountData.effective], itemStyle: { color: getItemStyleColor('red') } }, { name: '无效来电', type: 'bar', stack: 'A', label: getLabelOption(['-350%', 0], 0), barWidth, emphasis: { focus: 'series' }, data: [telCountData.invalid], itemStyle: { color: getItemStyleColor('yellow') } }, { name: '人工', type: 'bar', stack: 'Ad', barWidth, //hbbili label: getLabelOption(['100%', 20], 0), emphasis: { focus: 'series' }, data: [telCountData.jtcount], itemStyle: { color: getItemStyleColor('green') } }, { name: '自助', type: 'bar', stack: 'Ad', barWidth, label: getLabelOption(['100%', 0], 0), emphasis: { focus: 'series' }, data: [telCountData.zzcount], itemStyle: { color: getItemStyleColor('yellow') } }, { name: '回拨', type: 'bar', stack: 'Ad', barWidth, label: getLabelOption(['100%', -20], 0), emphasis: { focus: 'series' }, data: [telCountData.hbcount], itemStyle: { color: getItemStyleColor('red') } }, ] } function getSeriesRightData (){ return [{ name: '呼出', type: 'bar', barWidth, label: getLabelOption(['-200%', -5], 0), labelLine:{ show:true, normal:{ length:15, length2: 0, } }, emphasis: { focus: 'series' }, data: [telCountData.hccount], itemStyle: { color: getItemStyleColor('red') } }, { name: '呼出接通', type: 'bar', barWidth, label: getLabelOption(['-100%', -5], 0), emphasis: { focus: 'series' }, data: [telCountData.hcjtcount], itemStyle: { color: getItemStyleColor('green') } } ] } function getOption15(getSeriesData,xAxisData) { return option = { tooltip: { trigger: 'item', show: true, // 进行数据处理 formatter: function(params) { // console.log(params, 'params') var html = ''; if(params.value > 0) { html += params.marker; if(params.name.indexOf('率') >= 0) { html += params.seriesName + ': ' + params.value + '%
'; } else { html += params.seriesName + ': ' + params.value + '
'; } } return html; } }, grid: { left: '3%', right: '4%', bottom: '15%', containLabel: true }, xAxis: [{ type: 'category', axisLine: { lineStyle: { color: '#ffffff' } }, axisLabel: { show: true, rotate: 0, // 角度值:Number interval: '0', verticalAlign: 'left', fontSize: 12, // 顺便调小一点字体大小 padding: [0, 0, 0, -10], textStyle: { color: '#ffffff' }, formatter: function(value) { //x轴的文字改为竖版显示 var str; // console.log(value) if(value === "呼入量接通量") { str = "呼入量 接通量" } else if(value === "呼出量呼出接通量") { str = " 呼出量 呼出接通量" } return str } }, data: xAxisData }], yAxis: [{ type: 'value', splitLine: { show: false }, axisLine: { lineStyle: { color: '#ffffff' } } }], color: ['#cd5c5c', '#87cefa', '#da70d6', '#32cd32', '#6495ed', '#ff69b4', '#ba55d3', '#cd5c5c', '#ffa500', '#40e0d0' ], series: getSeriesData }; } function getOption(getSeriesData,xAxisData) { return option = { tooltip: { trigger: 'item', show: true, // 进行数据处理 formatter: function(params) { // console.log(params, 'params') var html = ''; if(params.value > 0) { html += params.marker; if(params.name.indexOf('率') >= 0) { html += params.seriesName + ': ' + params.value + '%
'; } else { html += params.seriesName + ': ' + params.value + '
'; } } return html; } }, grid: { left: '3%', right: '4%', bottom: '15%', containLabel: true }, xAxis: [{ type: 'category', axisLine: { lineStyle: { color: '#ffffff' } }, axisLabel: { show: true, rotate: 0, // 角度值:Number interval: '0', verticalAlign: 'left', fontSize: 12, // 顺便调小一点字体大小 padding: [0, 0, 0, -10], textStyle: { color: '#ffffff' }, formatter: function(value) { //x轴的文字改为竖版显示 var str; // console.log(value) if(value === "呼入量接通量") { str = "呼入量 接通量" } else if(value === "呼出量呼出接通量") { str = " 呼出量 呼出接通量" } return str } }, data: xAxisData }], yAxis: [{ type: 'value', splitLine: { show: false }, axisLine: { lineStyle: { color: '#ffffff' } } }], color: ['#cd5c5c', '#87cefa', '#da70d6', '#32cd32', '#6495ed', '#ff69b4', '#ba55d3', '#cd5c5c', '#ffa500', '#40e0d0' ], series: getSeriesData }; }