From 8d136a0f92dcd31d77e18c30f9b1865db83b0f85 Mon Sep 17 00:00:00 2001 From: liujie <liujie> Date: 星期二, 10 十月 2023 14:25:53 +0800 Subject: [PATCH] update --- cloud-server-management/src/main/webapp/WEB-INF/view/system/dataStatistics/operatorIncome.html | 330 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 327 insertions(+), 3 deletions(-) diff --git a/cloud-server-management/src/main/webapp/WEB-INF/view/system/dataStatistics/operatorIncome.html b/cloud-server-management/src/main/webapp/WEB-INF/view/system/dataStatistics/operatorIncome.html index d7c2800..94f3a09 100644 --- a/cloud-server-management/src/main/webapp/WEB-INF/view/system/dataStatistics/operatorIncome.html +++ b/cloud-server-management/src/main/webapp/WEB-INF/view/system/dataStatistics/operatorIncome.html @@ -300,6 +300,9 @@ if(cutType==2){ yytj() + ptUser() + ptActivity() + } if(cutType==3){ jxtj() @@ -316,9 +319,17 @@ , range: true }); $(function(){ + + var ajax2 = new $ax(Feng.ctxPath + "/data/getYears", function(data){ + yearX=data + }); + ajax2.start() + getContent(1); getContent1(1); getContent2(1); + + // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('income')); @@ -718,6 +729,8 @@ if(type==2){ yytj() + ptUser() + ptActivity() } if(type==3){ @@ -1101,9 +1114,8 @@ ajax.set("id",id); ajax.start(); } - - - + + function tuifei() { var myChart1 = echarts.init(document.getElementById('refund')); let id = $("#cCode").val() @@ -1200,6 +1212,318 @@ }) myChart1.setOption(option1); } + + + function ptUser() { + var myChart2 = echarts.init(document.getElementById('user')); + var myChart3 = echarts.init(document.getElementById('vip')); + myChart2.on('legendselectchanged', obj => { + var options = myChart2.getOption() + //这里是选择切换什么样的x轴,那么他会进行对Y值的切换 + if (obj.name == '年度用户数') { + options.xAxis[0].data = yearX + } else if (obj.name == '月度用户数') { + options.xAxis[0].data = monthX + } else if (obj.name == '周度用户数') { + options.xAxis[0].data = ["1周","2周","3周","4周"] + } else if (obj.name == '日度用户数') { + options.xAxis[0].data = dataX + } + myChart2.setOption(options, true) + }); + let id = $("#cCode").val() + console.log(id) + if(id==''){ + Feng.info("请先选择运营商"); + return; + } + myChart3.on('legendselectchanged', obj => { + var options = myChart3.getOption() + //这里是选择切换什么样的x轴,那么他会进行对Y值的切换 + if (obj.name == '年度会员数') { + options.xAxis[0].data = yearX + } else if (obj.name == '月度会员数') { + options.xAxis[0].data = monthX + } else if (obj.name == '周度会员数') { + options.xAxis[0].data = ["1周","2周","3周","4周"] + } else if (obj.name == '日度会员数') { + options.xAxis[0].data = dataX + } + myChart3.setOption(options, true) + }); + var ajax2 = new $ax(Feng.ctxPath + "/data/userAndVipYys", function(data){ + $("#userAll").text(data.allUser) + $("#userVipAll").text(data.allVip) + console.log(data) + option2 = { + tooltip: { + trigger: 'axis' + }, + legend: { + + data: ['年度用户数', '月度用户数','周度用户数','日度用户数'], + icon: 'stack', + selectedMode: 'single', // 单选 + selected: { + 年度用户数: true, + 月度用户数: false, + 周度用户数: false, + 日度用户数: false + } + }, + grid: { + left: '3%', + right: '4%', + bottom: '3%', + containLabel: true + }, + toolbox: { + feature: { + saveAsImage: {} + } + }, + xAxis: { + type: 'category', + boundaryGap: false, + data: yearX + }, + yAxis: { + type: 'value' + }, + series: [ + { + name: '年度用户数', + type: 'line', + stack: 'Total', + data: data.yearData + }, + { + name: '月度用户数', + type: 'line', + stack: 'Total', + data: data.monthData + }, + { + name: '周度用户数', + type: 'line', + stack: 'Total', + data: [data.count,data.count1,data.count2,data.count3] + }, + { + name: '日度用户数', + type: 'line', + stack: 'Total', + data: data.dayData + } + ] + }; + option3 = { + tooltip: { + trigger: 'axis' + }, + legend: { + + data: ['年度会员数', '月度会员数','周度会员数','日度会员数'], + icon: 'stack', + selectedMode: 'single', // 单选 + selected: { + 年度会员数: true, + 月度会员数: false, + 周度会员数: false, + 日度会员数: false + } + }, + grid: { + left: '3%', + right: '4%', + bottom: '3%', + containLabel: true + }, + toolbox: { + feature: { + saveAsImage: {} + } + }, + xAxis: { + type: 'category', + boundaryGap: false, + data: yearX + }, + yAxis: { + type: 'value' + }, + series: [ + { + name: '年度会员数', + type: 'line', + stack: 'Total', + data: data.yearsVip + }, + { + name: '月度会员数', + type: 'line', + stack: 'Total', + data: data.monthsVip + }, + { + name: '周度会员数', + type: 'line', + stack: 'Total', + data:[data.countVip,data.countVip1,data.countVip2,data.countVip3] + }, + { + name: '日度会员数', + type: 'line', + stack: 'Total', + data: data.daysVip + } + ] + }; + }); + ajax2.set("id",id) + ajax2.start() + myChart2.setOption(option2); + myChart3.setOption(option3); + } + + function ptActivity() { + var myChart4 = echarts.init(document.getElementById('activity')); + var myChart5 = echarts.init(document.getElementById('prepare')); + myChart4.on('legendselectchanged', obj => { + var options = myChart4.getOption() + //这里是选择切换什么样的x轴,那么他会进行对Y值的切换 + if (obj.name == '年度次数') { + options.xAxis[0].data = yearX + } else if (obj.name == '月度次数') { + options.xAxis[0].data = monthX + } + myChart4.setOption(options, true) + }); + + myChart5.on('legendselectchanged', obj => { + var options = myChart5.getOption() + //这里是选择切换什么样的x轴,那么他会进行对Y值的切换 + if (obj.name == '年度次数') { + options.xAxis[0].data = yearX + } else if (obj.name == '月度次数') { + options.xAxis[0].data = monthX + } + myChart5.setOption(options, true) + }); + let id = $("#cCode").val() + console.log(id) + if(id==''){ + Feng.info("请先选择运营商"); + return; + } + var ajax2 = new $ax(Feng.ctxPath + "/data/actYys", function(data){ + + $("#allHour").text(data.allHour) + + option4 = { + tooltip: { + trigger: 'axis' + }, + legend: { + data: ['年度次数', '月度次数'], + icon: 'stack', + selectedMode: 'single', // 单选 + selected: { + 年度次数: true, + 月度次数: false, + }, + + + }, + grid: { + left: '3%', + right: '4%', + bottom: '3%', + containLabel: true + }, + toolbox: { + feature: { + saveAsImage: {} + } + }, + xAxis: { + type: 'category', + boundaryGap: false, + data: yearX + }, + yAxis: { + type: 'value' + }, + series: [ + { + name: '年度次数', + type: 'line', + stack: 'Total', + data: data.yearData + }, + { + name: '月度次数', + type: 'line', + stack: 'Total', + data: data.monthData + } + + ] + }; + option5 = { + tooltip: { + trigger: 'axis' + }, + legend: { + data: ['年度次数', '月度次数'], + icon: 'stack', + selectedMode: 'single', // 单选 + selected: { + 年度次数: true, + 月度次数: false, + }, + + }, + grid: { + left: '3%', + right: '4%', + bottom: '3%', + containLabel: true + }, + toolbox: { + feature: { + saveAsImage: {} + } + }, + xAxis: { + type: 'category', + boundaryGap: false, + data: yearX + }, + yAxis: { + type: 'value' + }, + series: [ + { + name: '年度次数', + type: 'line', + stack: 'Total', + data: data.yearsUser + }, + { + name: '月度次数', + type: 'line', + stack: 'Total', + data: data.monthsUser + } + ] + }; + }); + ajax2.set("id",id) + ajax2.start() + myChart4.setOption(option4); + myChart5.setOption(option5); + } function getContent1(type){ //设置点击字体颜色效果 -- Gitblit v1.7.1