var areaFourVal=""; var dayTime=""; $(function() { // laydate.render({ // elem: '#time2', // format: 'yyyy-MM-dd', // theme: '#114a97', // done: function(value, date) { // fourScreen(areaFourVal,value && value.split('-')[2]); // dayTime=value.split('-')[2]; // } // }); laydate.render({ elem: '#time3', range: '~', theme: '#114a97', done: function(value, date) { var areaOneVal=$(".areaOne").val(); twoScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1],areaOneVal) } }); var mySwiper = new Swiper('.swiper-container', { loop: true, autoplay: { delay: 60000, }, pagination: { /* 分页器*/ el: '.swiper-pagination', clickable: true, }, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev', }, // followFinger : false, // speed:800, on: { init: function() { swiperAnimateCache(this); //隐藏动画元素 swiperAnimate(this); //初始化完成开始动画 }, transitionEnd: function() { swiperAnimate(this); //每个slide切换结束时也运行当前slide动画 }, } }) Ajax(); }) var cityObj = { ele1: "sqs_count", ele2: "syq_count", ele3: "lyq_count", ele4: "ycs_count", ele5: "mqx_count", ele6: "sx_count", ele7: "nlx_count", ele8: "zcx_count", ele9: "ycx_count", ele10: "xyx_count", ele11: "cxyt_count", ele12: "djbl_count" } var vars = {}; getCountUp(cityObj) function getCountUp(obj1) { var options = {   useEasing: true,   useGrouping: true,   separator: ',',   decimal: '.', }; $.each(obj1, function(k, v) { new CountUp(v, 0, 100, 0, 2, options).start() vars[v] = new CountUp(v, 0, 100, 0, 2, options) }) } var myDate = new Date(); function turn(aa) { if(aa < 10) { aa = "0" + aa; } return aa } // 第三屏 第四屏 发光外框 定时 (function() { var i = 0; var length = $(".orderState_ul >li").length; var j = 0; var length_1 = $(".orderTtype_Con li").length; setInterval(function() { if(i == length) { i = 0; $(".orderState_ul >li").removeClass('active'); } $(".orderState_ul >li").eq(i).addClass('active').siblings().removeClass('active'); if(i == 5) { $(".orderState_ul >li").eq(4).removeClass('active'); } i++; if(j == length_1) { j = 0; } $(".orderTtype_Con li").eq(j).addClass('active').siblings().removeClass('active'); j++; }, 2000); })(); //第一屏幕 开始 function oneScreen() { // $('.gdmap-r ul').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: myDate.getFullYear() + "-" + turn(myDate.getMonth() + 1) + "-" + turn(myDate.getDate()), end: myDate.getFullYear() + "-" + turn(myDate.getMonth() + 1) + "-" + turn(myDate.getDate()), }, success: function(data) { if(data.state.toLowerCase() == 'success') { // layer.close(index); var con = data.data; console.log(con); $(con).each(function(i, n) { if(n.AreaName.indexOf('商丘') != -1) { vars.sqs_count.update(n.Count); } if(n.AreaName.indexOf('睢阳') != -1) { vars.syq_count.update(n.Count); } if(n.AreaName.indexOf('梁园') != -1) { vars.lyq_count.update(n.Count); } if(n.AreaName.indexOf('永城') != -1) { vars.ycs_count.update(n.Count); } if(n.AreaName.indexOf('民权') != -1) { vars.mqx_count.update(n.Count); } if(n.AreaName.indexOf('睢县') != -1) { vars.sx_count.update(n.Count); } if(n.AreaName.indexOf('宁陵') != -1) { vars.nlx_count.update(n.Count); } if(n.AreaName.indexOf('柘城') != -1) { vars.zcx_count.update(n.Count); } if(n.AreaName.indexOf('虞城') != -1) { vars.ycx_count.update(n.Count); } if(n.AreaName.indexOf('夏邑') != -1) { vars.xyx_count.update(n.Count); } if(n.AreaName.indexOf('城乡一体') != -1) { vars.cxyt_count.update(n.Count); } if(n.AreaName.indexOf('当即办理') != -1) { vars.djbl_count.update(n.Count); } }) } } }); } //第二屏 function twoScreen(start, end,areaTwoVal) { if(!areaTwoVal){ areaTwoVal="sqs12345" } $.ajax({ type: "get", url: huayi.config.callcenter_url + "info/GetSourceByDate", async: true, dataType: 'json', data: { start: start, end: end, branchcode:areaTwoVal }, success: function(data) { if(data.state.toLowerCase() == 'success') { // layer.close(index); $('.orderSource ul li .rectangle').remove(); var con = data.data; $(con).each(function(i, n) { if(!n.Percent) { n.Percent = '0.00%' } if(n.Source.indexOf('信箱') != -1) { n.Source = '信箱' } if(n.Source.indexOf('APP') != -1) { n.Source = 'APP' } if(n.Source.indexOf('政务') != -1) { n.Source = '政务网' } var str = '
' + '
' + '
' + '
' + '
' + '

' + n.Percent.split('%')[0] + '

%

占总量

' + '
' + '
' + '
' + '

' + '' + n.Source + '' + n.Count + '' + '

' + '
' $('.orderSource ul li').eq(i).prepend(str) }) } } }); } //第三屏 function threeScreen(areaThreeVal) { if(!areaThreeVal){ areaThreeVal="sqs12345" } $.ajax({ type: "get", url: huayi.config.callcenter_url + "Info/GetTypeCountNew", data:{ branchcode:areaThreeVal }, async: true, dataType: 'json', success: function(data) { if(data.state.toLowerCase() == 'success') { $('.orderTtype_Con ul').html(''); // layer.close(index); var con = data.data; var img_name = ''; $(con).each(function(i, n) { if(n.TypeName.indexOf('咨询') != -1) { img_name = 'order_ZX.png' } if(n.TypeName.indexOf('求助') != -1) { img_name = 'order_QZ.png' } if(n.TypeName.indexOf('投诉') != -1) { img_name = 'order_TS.png' } if(n.TypeName.indexOf('建议') != -1) { img_name = 'order_JY.png' } if(n.TypeName.indexOf('表扬') != -1) { img_name = 'order_BY.png' } if(n.TypeName.indexOf('其他') != -1) { img_name = 'order_QT.png' } $('
  • ' + '
    ' + n.TypeName + '
    ' + '' + '

    数据展示

    ' + '

    ' + n.DayCount + '

    ' + '

    今日' + n.TypeName + '量

    ' + '

    ' + n.MonthCount + '

    ' + '

    本月' + n.TypeName + '量

    ' + '

    ' + n.TotalCount + '

    ' + '

    ' + n.TypeName + '总量

    ' + '
    ' + '
    ' + n.Percent + '
    ' + '
    ' + '

    总计类型占比

    ' + '
  • ').appendTo('.orderTtype_Con ul'); }) } } }); } // //第四屏 数字滚动 // function fourScreen(areaFourVal,dayTime) { // if(!areaFourVal){ // areaFourVal="sqs12345" // } // $.ajax({ // type: "get", // url: huayi.config.callcenter_url + "Info/GetStateCountByMonth", // data:{ // branchcode:areaFourVal, // day:dayTime // }, // async: true, // dataType: 'json', // success: function(data) { // if(data.state.toLowerCase() == 'success') { // // layer.close(index); // var con = data.data; // $(con).each(function(i, n) { // if(n.Name.indexOf('延时审核') != -1) { // $("#state_yssh").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('已办理') != -1) { // $("#state_ybl").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('已回访') != -1) { // $("#state_yhf").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('重办中') != -1) { // $("#state_cbz").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('已结案') != -1) { // $("#state_yja").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('新工单') != -1) { // $("#state_xzgd").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('待交办') != -1) { // $("#state_djb").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('待查收') != -1) { // $("#state_dcs").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('退回审核') != -1) { // $("#state_thsh").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('办理中') != -1) { // $("#state_blz").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('待审核') != -1) { // $("#state_dsh").rollNum({ // deVal: n.Count // }); // } // if(n.Name.indexOf('重办待交办') != -1) { // $("#state_cbdjb").rollNum({ // deVal: n.Count // }); // } // }); // } // } // }); // } //第五屏js function fiveScreen(areaFiveVal) { if(areaFiveVal){ huawus(areaFiveVal); jtvs(areaFiveVal); keyWord(areaFiveVal); }else{ areaFiveVal="sqs12345" huawus(areaFiveVal); jtvs(areaFiveVal); keyWord(areaFiveVal); } } function huawus(areaFiveVal) { $.ajax({ type: "get", url: huayi.config.callcenter_url + "info/GetTelCountByDate", async: true, dataType: "json", data: { date: myDate.getFullYear() + "-" + turn(myDate.getMonth() + 1) + "-" + turn(myDate.getDate()), branchcode:areaFiveVal }, success: function(data) { if(data.state.toLowerCase() == "success") { // layer.close(index); var con = data.data; huawu.setOption({ series: [{ data: [con.hwcon, con.lhcon, con.jtcon, con.pjthtimes] // data: [20, 100, 5, 80] }] }) } } }); } function jtvs(areaFiveVal) { $.ajax({ type: "get", url: huayi.config.callcenter_url + "info/GetTelRate24ByDate", async: true, dataType: 'json', data: { // date:$('#time4').val() branchcode:areaFiveVal }, success: function(data) { if(data.state.toLowerCase() == 'success') { // layer.close(index); var con = data.data; // var part3=data.data.b; jtv_num.setOption({ xAxis: { data: con.hours }, series: [{ data: con.rates }] }) } } }); } // $(".depart").change(function() { // keyWordDetail($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1]); // }); // 第五屏 $(".areaFive").change(function() { var areaFiveVal=$(this).val(); fiveScreen(areaFiveVal); }); // 第四屏 // $(".areaFour").change(function() { // var areaFourVal=$(this).val(); // fourScreen(areaFourVal,dayTime) // }); // 第三屏 $(".areaThree").change(function() { var areaThreeVal=$(this).val(); threeScreen(areaThreeVal); }); // 第二屏 $(".areaTwo").change(function() { var areaTwoVal=$(this).val(); twoScreen($('#time3').val() && $('#time3').val().split(' ~ ')[0], $('#time3').val() && $('#time3').val().split(' ~ ')[1],areaTwoVal); }); //区县筛选 deprtment (); function deprtment () { $.getJSON( huayi.config.callcenter_url +"CountyBranch/GetBranchListS", function(result) { if(result.state.toLowerCase() == "success") { goodslist = result.data; // 第五屏 $(".areaFive").empty(); $(goodslist).each(function(i, n) { $('').appendTo($(".areaFive")); }); //第4屏 $(".areaFour").empty(); $(goodslist).each(function(i, n) { $('').appendTo($(".areaFour")); }); //第3屏 $(".areaThree").empty(); $(goodslist).each(function(i, n) { $('').appendTo($(".areaThree")); }); //第2屏 $(".areaTwo").empty(); $(goodslist).each(function(i, n) { $('').appendTo($(".areaTwo")); }); } }); } function keyWord(areaFiveVal) { $.ajax({ type: "get", url: huayi.config.callcenter_url + "info/GetKeyCountByDateNew", async: true, dataType: 'json', data: { // date:$('#time4').val() branchcode:areaFiveVal }, success: function(data) { if(data.state.toLowerCase() == 'success') { // layer.close(index); var con = data.data; $('.tagcloud').html(''); // var strs='
    ' $(con).each(function(k, j) { if(k < 10) { var strs = '
    ' + '

    ' + j.关键字 + '

    ' + '

    ' + j.投诉 + '

    ' + '

    投诉量

    ' + '
    ' $('.tagcloud').append(strs); } }) } }, complete: function(XMLHttpRequest) { // setTimeout(function(){ tagcloud({ selector: ".tagcloud", //元素选择器 fontsize: 16, //基本字体大小, 单位px radius: 150, //滚动半径, 单位px mspeed: "normal", //滚动最大速度, 取值: slow, normal(默认), fast ispeed: "normal", //滚动初速度, 取值: slow, normal(默认), fast direction: 135, //初始滚动方向, 取值角度(顺时针360): 0对应top, 90对应left, 135对应right-bottom(默认)... keep: false // 鼠标移出组件后是否继续随鼠标滚动, 取值: false, true(默认) 对应 减速至初速度滚动, 随鼠标滚动 }); // },100); } }); } //第五屏图表js var huawu = echarts.init(document.getElementById('huawu_tody')); huawu.setOption({ tooltip: { trigger: 'axis', axisPointer: { type: false, label: { show: true, backgroundColor: '#030917' } }, }, grid: { left: '2%', right: '8%', bottom: '6%', containLabel: true }, xAxis: { name: '类型', data: ["话务量(通)", "来电(通)", "接通量(通)", "平均通话时长(秒)"], axisLine: { lineStyle: { color: '#038de2' } }, axisTick: { alignWithLabel: true, show: false }, axisLabel: { //横轴字体颜色 show: true, textStyle: { color: '#00daf4' } } }, yAxis: { name: '数量', splitLine: { show: false }, axisLine: { lineStyle: { color: '#038de2' } } }, series: [{ name: '数量', type: 'bar', barWidth: 18, itemStyle: { normal: { color: new echarts.graphic.LinearGradient( 0, 0, 0, 1, [{ offset: 0, color: '#0285ff' }, { offset: 1, color: '#0385ff24' } ] ) } }, label: { normal: { show: true, position: 'top', //顶部数据显示位置 textStyle: { color: '#fff' //顶部数据颜色 }, formatter: '{c}' // 这里是数据展示的时候显示的数据 } }, data: [] }] }); var jtv_num = echarts.init(document.getElementById('jtv_num')); jtv_num.setOption({ // title: { // text: '接通率统计', // x: 'center', // textStyle: { // color: '#fff', // fontSize: 18, // fontWeight: 'normal' // } // }, grid: { left: '6%', right: '8%', bottom: '6%', containLabel: true }, tooltip: { trigger: 'axis', axisPointer: { type: 'shadow', label: { show: true, backgroundColor: '#333' } }, formatter: function(datas) { var res = datas[0].name + '
    ', val; for(var i = 0, length = datas.length; i < length; i++) { val = (datas[i].value) + '%'; res += datas[i].seriesName + ':' + val + '
    '; } return res; } }, // legend: { //// top: 30, //bottom:'bottom', // data: ['接通率'], // textStyle: { // color: '#fff' // } // }, xAxis: { name: '时', data: [], axisLine: { lineStyle: { color: '#038de2' } }, axisTick: { alignWithLabel: true, show: false }, axisLabel: { //横轴字体颜色 show: true, textStyle: { color: '#00daf4' } } }, yAxis: { name: '比率', splitLine: { show: false }, axisLine: { lineStyle: { color: '#038de2' } } }, series: [{ name: '接通率', type: 'bar', barWidth: 8, itemStyle: { normal: { color: new echarts.graphic.LinearGradient( 0, 0, 0, 1, [{ offset: 0, color: '#00e8fe' }, { offset: 1, color: '#016fa4' } ] ) } }, // data: [500, 10, 25, 78, 85, 89, 56, 120, 20, 230, 52, 85, 45, 46, 12, 600, 15, 18, 95, 150, 28, 134, 146, 145] data: [] }] }); function Ajax() { oneScreen(); twoScreen(); threeScreen(); //fourScreen(); fiveScreen() }