diff --git a/src/page/wel.vue b/src/page/wel.vue index 2ef3d83..2d5dc24 100644 --- a/src/page/wel.vue +++ b/src/page/wel.vue @@ -258,8 +258,14 @@
-
低电工牌
-
离线工牌
+ + +
离线工牌
+ + +
低电工牌
+ +
{ - this.equipmentList=res.data; + // 在这里赋值 低电 + this.equNum=res.data.offline + this.equNum1=res.data.lowpower + this.equipmentList=res.data.list; }) }, //获取违禁提醒列表 @@ -1461,4 +1472,7 @@ export default { padding: 0 20px; line-height: 55px; } + /deep/ .el-badge__content{ + top:10px; + } diff --git a/src/views/Customer/index.vue b/src/views/Customer/index.vue index 948cf4c..dbe690d 100644 --- a/src/views/Customer/index.vue +++ b/src/views/Customer/index.vue @@ -44,6 +44,13 @@
+
+ 全部 +
楼盘名称：
- + - 使用时间： + 使用时间：
近7天 @@ -63,25 +69,53 @@ >对比时间段
-
- {{ selectTime1 ? "时段二： " : "请选择： "}} - {{selectTime + "-" + selectTime1}} - - +
+
+
+ {{ selectTime1 ? "时段二： " : "请选择： " }} +
+
+ +
+ {{ selectTime }} +
+ - +
+ {{ selectTime1 }} +
+
- + + +
@@ -89,7 +123,7 @@
设备总数
@@ -114,7 +148,7 @@
在线设备数
@@ -129,7 +163,7 @@ :style=" compare.onlineQuantity > 0 ? 'color:red;' : 'color:green;' " - >{{ compare.onlineQuantity }}{{ compare.onlineQuantity }}
@@ -138,7 +172,7 @@
在线设备平均占比
@@ -156,7 +190,7 @@ :style=" compare.onlineRate > 0 ? 'color:red;' : 'color:green;' " - >{{ compare.onlineRate }}{{ compare.onlineRate }}
@@ -164,7 +198,7 @@
活跃设备数
@@ -180,7 +214,7 @@ :style=" compare.activeQuantity > 0 ? 'color:red;' : 'color:green;' " - >{{ compare.activeQuantity }}{{ compare.activeQuantity }}
@@ -188,7 +222,7 @@
活跃设备平均占比
@@ -206,7 +240,7 @@ :style=" compare.activeRate > 0 ? 'color:red;' : 'color:green;' " - >{{ compare.activeRate}}{{ compare.activeRate }}
@@ -214,7 +248,7 @@
指派次数
@@ -238,7 +272,7 @@
完整录音次数
@@ -264,7 +298,7 @@
完整录音占比
@@ -282,7 +316,7 @@ :style=" compare.fullRecordRate > 0 ? 'color:red;' : 'color:green;' " - >{{ compare.fullRecordRate }}{{ compare.fullRecordRate }}
@@ -290,7 +324,7 @@
部分录音
@@ -318,7 +352,7 @@
未录音
@@ -342,7 +376,7 @@
正常关机次数
@@ -362,7 +396,7 @@ ? 'color:red;' : 'color:green;' " - >{{ compare.normalShutdownQuantity}}{{ compare.normalShutdownQuantity }}
@@ -370,7 +404,7 @@
低电关机次数
@@ -390,7 +424,7 @@ ? 'color:red;' : 'color:green;' " - >{{ compare.lowElectricityQuantity}}{{ compare.lowElectricityQuantity }}
@@ -398,7 +432,7 @@
异常关机次数
@@ -418,7 +452,7 @@ ? 'color:red;' : 'color:green;' " - >{{ compare.abnormalShutdownQuantity }}{{ compare.abnormalShutdownQuantity }}
@@ -593,16 +627,24 @@ - + - + @@ -266,64 +418,63 @@ export default { // return time.getTime() > Date.now(); }, }, - time: "",//对比时间的数组 + time: "", //对比时间的数组 page: { openTime: "", closeTime: "", }, - customtime: [],//自定义时间 - selectTime1: "",//对比时间 - selectTime: "",//对比时间 - aliasclass: 1,//tab下标 - houseId: "",//楼盘id + customtime: [], //自定义时间 + selectTime1: "", //对比时间 + selectTime: "", //对比时间 + aliasclass: 1, //tab下标 + houseId: "", //楼盘id options: [], value: "", - checked: false,//是否对比 - Confirmthecontrast:false, - tableData: [],//表格数据 - cardobj:{}, - departmentlist:[], - departmentid:'', - echartsisshow:true, - consultantlist:[], - consultantid:'', - tablelist1:[], - tablelist2:[], - tablelist3:[], - tablelist4:[], - Level1:[], - Level2:[], - Level1id:'', - Level2id:'', - houseList:[], - role:'' + checked: false, //是否对比 + Confirmthecontrast: false, + tableData: [], //表格数据 + cardobj: {}, + departmentlist: [], + departmentid: "", + echartsisshow: true, + consultantlist: [], + consultantid: "", + tablelist1: [], + tablelist2: [], + tablelist3: [], + tablelist4: [], + Level1: [], + Level2: [], + Level1id: "", + Level2id: "", + houseList: [], + role: "", }; }, mounted() { - this.role=localStorage.getItem("orgType"); - if(this.role==3){ - this.houseId = localStorage.getItem("houseId"); - this.tabtimetap(4); - this.overviewfindList() - - }else{ - this.zkhousePage() + this.role = localStorage.getItem("orgType"); + if (this.role == 3) { + this.houseId = localStorage.getItem("houseId"); + this.tabtimetap(4); + this.overviewfindList(); + } else { + this.zkhousePage(); } }, methods: { - houseChange(){ - this.customtime=[]; - this.TimetoAhoose=4; - this.selectTime1= "";//对比时间 - this.selectTime= "";//对比时间 - this.aliasclass= 1;//tab下标 - this.page.openTime=''; - this.page.closeTime=''; - this.checked=false; - this.tabtimetap(4); - this.overviewfindList() + houseChange() { + this.customtime = []; + this.TimetoAhoose = 4; + this.selectTime1 = ""; //对比时间 + this.selectTime = ""; //对比时间 + this.aliasclass = 1; //tab下标 + this.page.openTime = ""; + this.page.closeTime = ""; + this.checked = false; + this.tabtimetap(4); + this.overviewfindList(); }, - zkhousePage() { + zkhousePage() { this.$api.api .findHouseByUser({ orgType: localStorage.getItem("orgType"), @@ -331,382 +482,402 @@ export default { .then((res) => { this.houseList = res.data; this.houseId = res.data[0].id; - this.tabtimetap(4); - this.overviewfindList() + this.tabtimetap(4); + this.overviewfindList(); }); }, //销讲二级 - trendAnalysisLevel2(){ - let pamaet={ - showStatus:'', - houseId:this.houseId, - timeType:0, - firstStartDate:this.page.openTime, - firstEndDate:this.page.closeTime, - lastStartDate:this.selectTime, - lastEndDate:this.selectTime1, - marketingId:this.Level2id - } + trendAnalysisLevel2() { + let pamaet = { + showStatus: "", + houseId: this.houseId, + timeType: 0, + firstStartDate: this.page.openTime, + firstEndDate: this.page.closeTime, + lastStartDate: this.selectTime, + lastEndDate: this.selectTime1, + marketingId: this.Level2id, + }; - if(this.timeType==-1){ - pamaet.timeType=null - }else{ - pamaet.timeType=this.timeType + if (this.timeType == -1) { + pamaet.timeType = null; + } else { + pamaet.timeType = this.timeType; } - if(this.checked==true){ - pamaet.showStatus=1; - pamaet.timeType=null - }else{ - pamaet.showStatus=0 + if (this.checked == true) { + pamaet.showStatus = 1; + pamaet.timeType = null; + } else { + pamaet.showStatus = 0; } this.$api.http.trendAnalysisLevel2(pamaet).then((res) => { - if(this.Confirmthecontrast==false){ - let newlist=res.data.startList || []; - var newline=[]; - var newline2=[]; - newlist.map(item=>{ - newline.push(item.zxl) - newline2.push(item.statDate.slice(5,10)) - }) - this.SwitchCARDS(newline,newline2) - }else{ - let newlist=res.data.startList || []; - let newlist2=res.data.endList || []; - let hejilist=res.data.comparedList || []; - var newline=[];//起始数据 - var newline2=[];//对比数据 - var newline1=[];//时间 - - let arr=[]; - newlist.map(item=>{ - newline.push(item.zxl) - }) - newlist2.map(item=>{ - newline1.push(item.zxl) - }) - newlist.forEach((item, sdf) => { - newlist2.forEach((child, zxc) => { - if (sdf == zxc) { - newline2.push(item.statDate.substring(5,10) + 'vs' + child.statDate.substring(5, 10)) - arr.push({ - name:item.statDate.substring(5,10) + 'vs' + child.statDate.substring(5, 10), - shiduan1:item.zxl, - shiduan2:child.zxl, - }); - } - }) - }) - hejilist.forEach((acd,xdx)=>{ - arr.forEach((che,ind)=>{ - if(xdx==ind){ - che.heji=acd.zxl; - } - }) - }) - arr.unshift({ - name:'项目合计', - shiduan1:res.data.startSum, - shiduan2:res.data.endSum, - heji:res.data.comparedSum, - }) + if (this.Confirmthecontrast == false) { + let newlist = res.data.startList || []; + var newline = []; + var newline2 = []; + newlist.map((item) => { + newline.push(item.zxl); + newline2.push(item.statDate.slice(5, 10)); + }); + this.SwitchCARDS(newline, newline2); + } else { + let newlist = res.data.startList || []; + let newlist2 = res.data.endList || []; + let hejilist = res.data.comparedList || []; + var newline = []; //起始数据 + var newline2 = []; //对比数据 + var newline1 = []; //时间 - this.SwitchCARDS2(newline,newline1,newline2) - this.tableData=arr; - console.log( this.tableData) - } - }) + let arr = []; + newlist.map((item) => { + newline.push(item.zxl); + }); + newlist2.map((item) => { + newline1.push(item.zxl); + }); + newlist.forEach((item, sdf) => { + newlist2.forEach((child, zxc) => { + if (sdf == zxc) { + newline2.push( + item.statDate.substring(5, 10) + + "vs" + + child.statDate.substring(5, 10) + ); + arr.push({ + name: + item.statDate.substring(5, 10) + + "vs" + + child.statDate.substring(5, 10), + shiduan1: item.zxl, + shiduan2: child.zxl, + }); + } + }); + }); + hejilist.forEach((acd, xdx) => { + arr.forEach((che, ind) => { + if (xdx == ind) { + che.heji = acd.zxl; + } + }); + }); + arr.unshift({ + name: "项目合计", + shiduan1: res.data.startSum, + shiduan2: res.data.endSum, + heji: res.data.comparedSum, + }); + this.SwitchCARDS2(newline, newline1, newline2); + this.tableData = arr; + console.log(this.tableData); + } + }); }, //切换一级 - Level1tap(){ - this.Level1.forEach((item,index)=>{ - if(this.Level1id==item.marketingId){ - this.Level2=item.children || []; - this.Level2id=item.children[0].marketingId || ''; + Level1tap() { + this.Level1.forEach((item, index) => { + if (this.Level1id == item.marketingId) { + this.Level2 = item.children || []; + this.Level2id = item.children[0].marketingId || ""; } - }) - this.trendAnalysisLevel2() + }); + this.trendAnalysisLevel2(); }, - //切换er级 - Level2tap(){ - this.trendAnalysisLevel2() + //切换er级 + Level2tap() { + this.trendAnalysisLevel2(); }, //一二级 - trendAnalysisAllLevel(){ - let pamaet={ - showStatus:'', - houseId:this.houseId, - timeType:0, - firstStartDate:this.page.openTime, - firstEndDate:this.page.closeTime, - lastStartDate:this.selectTime, - lastEndDate:this.selectTime1, - } + trendAnalysisAllLevel() { + let pamaet = { + showStatus: "", + houseId: this.houseId, + timeType: 0, + firstStartDate: this.page.openTime, + firstEndDate: this.page.closeTime, + lastStartDate: this.selectTime, + lastEndDate: this.selectTime1, + }; - if(this.timeType==-1){ - pamaet.timeType=null - }else{ - pamaet.timeType=this.timeType + if (this.timeType == -1) { + pamaet.timeType = null; + } else { + pamaet.timeType = this.timeType; } - if(this.checked==true){ - pamaet.showStatus=1; - pamaet.timeType=null - }else{ - pamaet.showStatus=0 + if (this.checked == true) { + pamaet.showStatus = 1; + pamaet.timeType = null; + } else { + pamaet.showStatus = 0; } this.$api.http.trendAnalysisAllLevel(pamaet).then((res) => { - this.Level1=res.data || []; - this.Level1id=res.data[0].marketingId || ''; - this.Level2=res.data[0].children || []; - this.Level2id=res.data[0].children[0].marketingId || ''; - this.trendAnalysisLevel2() - }) + this.Level1 = res.data || []; + this.Level1id = res.data[0].marketingId || ""; + this.Level2 = res.data[0].children || []; + this.Level2id = res.data[0].children[0].marketingId || ""; + this.trendAnalysisLevel2(); + }); }, //切换顾问 - consultanttap(){ - this.trendAnalysisAccount() + consultanttap() { + this.trendAnalysisAccount(); }, // 获取顾问 - trendAnalysisAllAccount(pamaet){ + trendAnalysisAllAccount(pamaet) { this.$api.http.trendAnalysisAllAccount(pamaet).then((res) => { - this.consultantlist=res.data || []; - if( this.consultantlist.length!=0){ - this.consultantid=res.data[0].accountId; - this.trendAnalysisAccount() - }else{ - echarts.init(document.getElementById("main")).dispose(); - this.echartsisshow=false; - this.tableData=[]; + this.consultantlist = res.data || []; + if (this.consultantlist.length != 0) { + this.consultantid = res.data[0].accountId; + this.trendAnalysisAccount(); + } else { + echarts.init(document.getElementById("main")).dispose(); + this.echartsisshow = false; + this.tableData = []; } - }) + }); }, - trendAnalysisAccount(){ - var that=this; - let pamaet={ - showStatus:'', - houseId:this.houseId, - timeType:0, - firstStartDate:this.page.openTime, - firstEndDate:this.page.closeTime, - lastStartDate:this.selectTime, - lastEndDate:this.selectTime1, - - } - if(this.aliasclass==3){ - pamaet.accountId=this.consultantid + trendAnalysisAccount() { + var that = this; + let pamaet = { + showStatus: "", + houseId: this.houseId, + timeType: 0, + firstStartDate: this.page.openTime, + firstEndDate: this.page.closeTime, + lastStartDate: this.selectTime, + lastEndDate: this.selectTime1, + }; + if (this.aliasclass == 3) { + pamaet.accountId = this.consultantid; } - if(this.timeType==-1){ - pamaet.timeType=null - }else{ - pamaet.timeType=this.timeType + if (this.timeType == -1) { + pamaet.timeType = null; + } else { + pamaet.timeType = this.timeType; } - if(this.checked==true){ - pamaet.showStatus=1; - pamaet.timeType=null - }else{ - pamaet.showStatus=0 + if (this.checked == true) { + pamaet.showStatus = 1; + pamaet.timeType = null; + } else { + pamaet.showStatus = 0; } this.$api.http.trendAnalysisAccount(pamaet).then((res) => { - if(this.Confirmthecontrast==false){ - let newlist=res.data.firstList || []; - var newline=[];//起始数据 - var newlinename=[]; - let tablist=[ - {name:'时间',} - ] - let tablist2=[ - {name:that.customtime[0].substring(5,10)+'/'+that.customtime[1].substring(5,10),} - ] - newlist.map(item=>{ - newline.push(item.zxl) - newlinename.push({name:item.name,max:100}) - tablist.push({name:item.name}) - tablist2.push({name:item.zxl+'%',}) - }) - this.tablelist1=tablist; - this.tablelist2=tablist2; - this.tablelist3=[]; - this.tablelist4=[]; - this.piechart(newline,newlinename) - }else{ - - let newlist=res.data.firstList || []; - let newlist2=res.data.secondList|| []; - let newlist4=res.data.thirdList|| []; + if (this.Confirmthecontrast == false) { + let newlist = res.data.firstList || []; + var newline = []; //起始数据 + var newlinename = []; + let tablist = [{ name: "时间" }]; + let tablist2 = [ + { + name: + that.customtime[0].substring(5, 10) + + "/" + + that.customtime[1].substring(5, 10), + }, + ]; + newlist.map((item) => { + newline.push(item.zxl); + newlinename.push({ name: item.name, max: 100 }); + tablist.push({ name: item.name }); + tablist2.push({ name: item.zxl + "%" }); + }); + this.tablelist1 = tablist; + this.tablelist2 = tablist2; + this.tablelist3 = []; + this.tablelist4 = []; + this.piechart(newline, newlinename); + } else { + let newlist = res.data.firstList || []; + let newlist2 = res.data.secondList || []; + let newlist4 = res.data.thirdList || []; - var newline=[];//起始数据 - let newline2=[];//对比数据 - var newlinename=[]; + var newline = []; //起始数据 + let newline2 = []; //对比数据 + var newlinename = []; - let tablist1=[ - {name:'时间',} - ] - let tablist2=[ - {name:that.customtime[0].substring(5,10)+'/'+that.customtime[1].substring(5,10),} - ] - let tablist3=[ - {name:that.selectTime.substring(5,10)+'/'+that.selectTime1.substring(5,10),} - ] - let tablist4=[ - {name:'变化',} - ] + let tablist1 = [{ name: "时间" }]; + let tablist2 = [ + { + name: + that.customtime[0].substring(5, 10) + + "/" + + that.customtime[1].substring(5, 10), + }, + ]; + let tablist3 = [ + { + name: + that.selectTime.substring(5, 10) + + "/" + + that.selectTime1.substring(5, 10), + }, + ]; + let tablist4 = [{ name: "变化" }]; - newlist.map(item=>{ - newline.push(item.zxl) - newlinename.push({name:item.name,max:100}) - tablist1.push({name:item.name}) - tablist2.push({name:item.zxl+'%',}) - }) - newlist2.map(item=>{ - newline2.push(item.zxl) - tablist3.push({name:item.zxl+'%',}) - }) - newlist4.map(item=>{ - tablist4.push({name:item.zxl,}) - }) + newlist.map((item) => { + newline.push(item.zxl); + newlinename.push({ name: item.name, max: 100 }); + tablist1.push({ name: item.name }); + tablist2.push({ name: item.zxl + "%" }); + }); + newlist2.map((item) => { + newline2.push(item.zxl); + tablist3.push({ name: item.zxl + "%" }); + }); + newlist4.map((item) => { + tablist4.push({ name: item.zxl }); + }); - this.tablelist1=tablist1; - this.tablelist2=tablist2; - this.tablelist3=tablist3; - this.tablelist4=tablist4; - this.piechart2(newline,newlinename,newline2) - } - }) + this.tablelist1 = tablist1; + this.tablelist2 = tablist2; + this.tablelist3 = tablist3; + this.tablelist4 = tablist4; + this.piechart2(newline, newlinename, newline2); + } + }); }, //获取卡片 - trendtrendAnalysis(){ - let pamaet={ - showStatus:'', - houseId:this.houseId, - timeType:0, - firstStartDate:this.page.openTime, - firstEndDate:this.page.closeTime, - lastStartDate:this.selectTime, - lastEndDate:this.selectTime1 - } + trendtrendAnalysis() { + let pamaet = { + showStatus: "", + houseId: this.houseId, + timeType: 0, + firstStartDate: this.page.openTime, + firstEndDate: this.page.closeTime, + lastStartDate: this.selectTime, + lastEndDate: this.selectTime1, + }; - if(this.timeType==-1){ - pamaet.timeType=null - }else{ - pamaet.timeType=this.timeType + if (this.timeType == -1) { + pamaet.timeType = null; + } else { + pamaet.timeType = this.timeType; } - if(this.checked==true){ - pamaet.showStatus=1; - pamaet.timeType=null - }else{ - pamaet.showStatus=0 + if (this.checked == true) { + pamaet.showStatus = 1; + pamaet.timeType = null; + } else { + pamaet.showStatus = 0; } this.$api.http.trendtrendAnalysis(pamaet).then((res) => { - this.cardobj=res.data; - if(this.aliasclass==1){ - this.echartsisshow=true; - this.trendtrendAnalysisProject(pamaet) - }else if(this.aliasclass==2){ - if(this.departmentid!=''){ - pamaet.deptId=this.departmentid - this.trendtrendAnalysisProject(pamaet) - }else{ + this.cardobj = res.data; + if (this.aliasclass == 1) { + this.echartsisshow = true; + this.trendtrendAnalysisProject(pamaet); + } else if (this.aliasclass == 2) { + if (this.departmentid != "") { + pamaet.deptId = this.departmentid; + this.trendtrendAnalysisProject(pamaet); + } else { echarts.init(document.getElementById("main")).dispose(); - this.echartsisshow=false; - this.tableData=[]; + this.echartsisshow = false; + this.tableData = []; } - }else if(this.aliasclass==3){ - if(this.consultantid.length==0){ - this.trendAnalysisAllAccount(pamaet) - }else{ - this.trendAnalysisAccount() + } else if (this.aliasclass == 3) { + if (this.consultantid.length == 0) { + this.trendAnalysisAllAccount(pamaet); + } else { + this.trendAnalysisAccount(); } - }else if(this.aliasclass==4){ - this.trendAnalysisAccount() - }else{ - this.trendAnalysisAllLevel() + } else if (this.aliasclass == 4) { + this.trendAnalysisAccount(); + } else { + this.trendAnalysisAllLevel(); } - - }) + }); }, //项目 - trendtrendAnalysisProject(pamaet){ - this.$api.http.trendtrendAnalysisProject(pamaet).then((res) => { - if(this.Confirmthecontrast==false){ - let newlist=res.data.startList || []; - var newline=[]; - var newline2=[]; - newlist.map(item=>{ - newline.push(item.fraction) - newline2.push(item.statDate.slice(5,10)) - }) - this.SwitchCARDS(newline,newline2) - }else{ - let newlist=res.data.startList || []; - let newlist2=res.data.endList || []; - let hejilist=res.data.comparedList || []; - var newline=[];//起始数据 - var newline2=[];//对比数据 - var newline1=[];//时间 + trendtrendAnalysisProject(pamaet) { + this.$api.http.trendtrendAnalysisProject(pamaet).then((res) => { + if (this.Confirmthecontrast == false) { + let newlist = res.data.startList || []; + var newline = []; + var newline2 = []; + newlist.map((item) => { + newline.push(item.fraction); + newline2.push(item.statDate.slice(5, 10)); + }); + this.SwitchCARDS(newline, newline2); + } else { + let newlist = res.data.startList || []; + let newlist2 = res.data.endList || []; + let hejilist = res.data.comparedList || []; + var newline = []; //起始数据 + var newline2 = []; //对比数据 + var newline1 = []; //时间 - let arr=[]; - newlist.map(item=>{ - newline.push(item.fraction) - }) - newlist2.map(item=>{ - newline1.push(item.fraction) - }) - newlist.forEach((item, sdf) => { - newlist2.forEach((child, zxc) => { - if (sdf == zxc) { - newline2.push(item.statDate.substring(5,10) + 'vs' + child.statDate.substring(5, 10)) - arr.push({ - name:item.statDate.substring(5,10) + 'vs' + child.statDate.substring(5, 10), - shiduan1:item.fraction, - shiduan2:child.fraction, - }); - } - }) - }) - hejilist.forEach((acd,xdx)=>{ - arr.forEach((che,ind)=>{ - if(xdx==ind){ - che.heji=acd.fraction; - } - }) - }) - arr.unshift({ - name:'项目合计', - shiduan1:res.data.startSum, - shiduan2:res.data.endSum, - heji:res.data.comparedSum, - }) + let arr = []; + newlist.map((item) => { + newline.push(item.fraction); + }); + newlist2.map((item) => { + newline1.push(item.fraction); + }); + newlist.forEach((item, sdf) => { + newlist2.forEach((child, zxc) => { + if (sdf == zxc) { + newline2.push( + item.statDate.substring(5, 10) + + "vs" + + child.statDate.substring(5, 10) + ); + arr.push({ + name: + item.statDate.substring(5, 10) + + "vs" + + child.statDate.substring(5, 10), + shiduan1: item.fraction, + shiduan2: child.fraction, + }); + } + }); + }); + hejilist.forEach((acd, xdx) => { + arr.forEach((che, ind) => { + if (xdx == ind) { + che.heji = acd.fraction; + } + }); + }); + arr.unshift({ + name: "项目合计", + shiduan1: res.data.startSum, + shiduan2: res.data.endSum, + heji: res.data.comparedSum, + }); - this.SwitchCARDS2(newline,newline1,newline2) - this.tableData=arr; - console.log( this.tableData) - } - }) + this.SwitchCARDS2(newline, newline1, newline2); + this.tableData = arr; + console.log(this.tableData); + } + }); }, //获取部门下拉菜单 - overviewfindList(){ - this.$api.http.overviewfindList({ - houseId:this.houseId, - }).then((res) => { - this.departmentlist=res.data || []; - if(this.departmentlist.length!=0){ - this.departmentid=res.data[0].deptId - }else{ - this.departmentid='' - } + overviewfindList() { + this.$api.http + .overviewfindList({ + houseId: this.houseId, }) + .then((res) => { + this.departmentlist = res.data || []; + if (this.departmentlist.length != 0) { + this.departmentid = res.data[0].deptId; + } else { + this.departmentid = ""; + } + }); }, //切换部门 - departmenttap(){ - this.trendtrendAnalysis() + departmenttap() { + this.trendtrendAnalysis(); }, - //选项卡切换 - tapChange(idx){ - this.aliasclass=idx; - this.trendtrendAnalysis() + tapChange(idx) { + this.aliasclass = idx; + this.trendtrendAnalysis(); }, //时间tab切换 tabtimetap(i) { @@ -731,8 +902,8 @@ export default { this.timestampToTime(new Date().getTime()), ]; this.$set(this, "time", null); - this.Confirmthecontrast=false; - this.trendtrendAnalysis() + this.Confirmthecontrast = false; + this.trendtrendAnalysis(); }, // 对比时间选择弹框显示 show() { @@ -745,12 +916,16 @@ export default { this.selectTime = ""; this.selectTime1 = ""; this.timeSelect(e); - console.log(e,'asdasdajdasjdgasdghasdgsajdggh'); + console.log(e, "asdasdajdasjdgasdghasdgsajdggh"); }, timeSelect(e) { if (this.timeType == -1) { this.selectTime = e; - this.selectTime1 = this.timestampToTime(new Date(e).getTime()+new Date(this.page.closeTime).getTime()-new Date(this.page.openTime).getTime()); + this.selectTime1 = this.timestampToTime( + new Date(e).getTime() + + new Date(this.page.closeTime).getTime() - + new Date(this.page.openTime).getTime() + ); } else { // 获取今天昨天近一周 // 获取一天的时间戳 @@ -768,18 +943,18 @@ export default { this.selectTime = e; this.selectTime1 = this.timestampToTime(new Date(e).getTime() + num); } - this.Confirmthecontrast=true; - this.page.openTime=this.customtime[0] - this.page.closeTime=this.customtime[1] - this.trendtrendAnalysis() + this.Confirmthecontrast = true; + this.page.openTime = this.customtime[0]; + this.page.closeTime = this.customtime[1]; + this.trendtrendAnalysis(); }, radioChange() { this.selectTime = ""; this.selectTime1 = ""; this.$set(this, "time", null); - if(!this.checked){ - this.trendtrendAnalysis() - this.Confirmthecontrast=false + if (!this.checked) { + this.trendtrendAnalysis(); + this.Confirmthecontrast = false; } }, //选择自定义时间 @@ -792,20 +967,21 @@ export default { if (!e) return; this.page.openTime = this.customtime[0]; this.page.closeTime = this.customtime[1]; - this.Confirmthecontrast=false; - this.trendtrendAnalysis() + this.Confirmthecontrast = false; + this.trendtrendAnalysis(); }, timestampToTime(timestamp) { var date = new Date(timestamp); //时间戳为10位需*1000，时间戳为13位的话不需乘1000 var yyyy = date.getFullYear() + "-"; - var MM =(date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1): date.getMonth() + 1) + "-"; - var dd =(date.getDate() < 10 ? "0" + date.getDate() : date.getDate()); + var MM = + (date.getMonth() + 1 < 10 + ? "0" + (date.getMonth() + 1) + : date.getMonth() + 1) + "-"; + var dd = date.getDate() < 10 ? "0" + date.getDate() : date.getDate(); return yyyy + MM + dd; }, - - - SwitchCARDS(newline,newline2) { + SwitchCARDS(newline, newline2) { echarts.init(document.getElementById("main")).dispose(); var chartDom = document.getElementById("main"); var myChart = echarts.init(chartDom); @@ -814,7 +990,7 @@ export default { option = { tooltip: { trigger: "axis", - formatter: '{b0}: {c0}'+'%' + formatter: "{b0}: {c0}" + "%", }, legend: { data: ["起始时间"], @@ -845,9 +1021,9 @@ export default { }, yAxis: { type: "value", - splitNumber:5, - max:100, - min:0, + splitNumber: 5, + max: 100, + min: 0, axisLabel: { //重点在这一块，其余可以忽略 textStyle: { @@ -874,7 +1050,7 @@ export default { series: [ { name: "起始时间", - data:newline, + data: newline, type: "line", smooth: true, }, @@ -886,8 +1062,8 @@ export default { myChart.resize(); }); }, - SwitchCARDS2(newline,newline1,newline2) { - echarts.init(document.getElementById("main")).dispose(); + SwitchCARDS2(newline, newline1, newline2) { + echarts.init(document.getElementById("main")).dispose(); var chartDom = document.getElementById("main"); var myChart = echarts.init(chartDom); var option; @@ -896,12 +1072,24 @@ export default { tooltip: { trigger: "axis", formatter: function (params) { - let src= '

'+params[0].seriesName+':'+params[0].data+'%'+'

'+'

'+params[1].seriesName+':'+ params[1].data+'%'+'

'; - return src - } + let src = + "

" + + params[0].seriesName + + ":" + + params[0].data + + "%" + + "

" + + "

" + + params[1].seriesName + + ":" + + params[1].data + + "%" + + "

"; + return src; + }, }, legend: { - data: ["起始时间","对比时间"], + data: ["起始时间", "对比时间"], bottom: "10", }, grid: { @@ -929,9 +1117,9 @@ export default { }, yAxis: { type: "value", - splitNumber:5, - max:100, - min:0, + splitNumber: 5, + max: 100, + min: 0, axisLabel: { //重点在这一块，其余可以忽略 textStyle: { @@ -958,16 +1146,16 @@ export default { series: [ { name: "起始时间", - data:newline, + data: newline, type: "line", smooth: true, }, { name: "对比时间", - data:newline1, + data: newline1, type: "line", smooth: true, - } + }, ], }; @@ -976,95 +1164,88 @@ export default { myChart.resize(); }); }, - piechart2(newline,newlinename,newline2){ + piechart2(newline, newlinename, newline2) { echarts.init(document.getElementById("main")).dispose(); var chartDom = document.getElementById("main"); var myChart = echarts.init(chartDom); var option; option = { tooltip: { - trigger: 'axis' + trigger: "axis", }, legend: { - data: ['起始时间','对比时间'], - right: "10", - top:'10' + data: ["起始时间", "对比时间"], + right: "10", + top: "10", }, - color:[ - '#2671E2', - '#F3787B', - ], + color: ["#2671E2", "#F3787B"], radar: { // shape: 'circle', - indicator: newlinename + indicator: newlinename, }, series: [ { - type: 'radar', + type: "radar", tooltip: { - trigger: 'item' + trigger: "item", }, data: [ { - value:newline, - name: '起始时间' + value: newline, + name: "起始时间", }, { - value:newline2, - name: '对比时间' + value: newline2, + name: "对比时间", }, - ] - } - ] + ], + }, + ], }; option && myChart.setOption(option); window.addEventListener("resize", () => { - myChart.resize(); + myChart.resize(); }); }, - piechart(newline,newlinename){ + piechart(newline, newlinename) { echarts.init(document.getElementById("main")).dispose(); var chartDom = document.getElementById("main"); var myChart = echarts.init(chartDom); var option; option = { tooltip: { - trigger: 'axis' + trigger: "axis", }, legend: { - data: ['起始时间'], - right: "10", - top:'10' + data: ["起始时间"], + right: "10", + top: "10", }, - color:[ - '#2671E2', - '#F3787B', - ], + color: ["#2671E2", "#F3787B"], radar: { // shape: 'circle', - indicator: newlinename + indicator: newlinename, }, series: [ { - type: 'radar', + type: "radar", tooltip: { - trigger: 'item' + trigger: "item", }, data: [ { - value:newline, - name: '起始时间' + value: newline, + name: "起始时间", }, - ] - } - ] + ], + }, + ], }; option && myChart.setOption(option); window.addEventListener("resize", () => { - myChart.resize(); + myChart.resize(); }); - } - + }, }, }; @@ -1183,7 +1364,7 @@ export default { } } .you { - width:50%; + width: 50%; display: flex; align-items: center; .youimg { @@ -1260,14 +1441,13 @@ export default { cursor: pointer; color: #606266; } - .theadtd{ - width: 140px; - height: 48px; - border: 1px solid #E0E0E0; - text-align: center; - line-height: 48px; - font-size: 16px; - color: #32363D; - - } +.theadtd { + width: 140px; + height: 48px; + border: 1px solid #e0e0e0; + text-align: center; + line-height: 48px; + font-size: 16px; + color: #32363d; +} diff --git a/src/views/Statistics/houseDataSys.vue b/src/views/Statistics/houseDataSys.vue index 1c2f32f..e8d7484 100644 --- a/src/views/Statistics/houseDataSys.vue +++ b/src/views/Statistics/houseDataSys.vue @@ -1,7 +1,7 @@