Compare commits
3 Commits
4f4f1fe422
...
6661eb2961
Author | SHA1 | Date |
---|---|---|
|
6661eb2961 | |
|
a2b899cfc3 | |
|
4cbe9e1256 |
23
src/App.vue
23
src/App.vue
|
@ -1,11 +1,11 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="app">
|
<div id="app">
|
||||||
<div class="top">
|
<div class="top">
|
||||||
<div class="left">
|
<div class="left" text="盐都电力可视化系统">
|
||||||
盐都电力可视化系统
|
盐都电力可视化系统
|
||||||
</div>
|
</div>
|
||||||
<div class="middle">
|
<div class="middle">
|
||||||
<div class="router" :class="{'active':routerActive==index}" v-for="(item,index) in routerTitle" @click="handleChange(index)" :key="index">{{item}}</div>
|
<div class="router" :class="{'active':routerActive==index}" v-for="(item,index) in routerTitle" @click="handleChange(index)" :key="index" :text="item">{{item}}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<div class="time">
|
<div class="time">
|
||||||
|
@ -52,7 +52,9 @@ export default {
|
||||||
let that = this;
|
let that = this;
|
||||||
this.routerActive = index
|
this.routerActive = index
|
||||||
if (this.routerActive == 0) {
|
if (this.routerActive == 0) {
|
||||||
that.$router.push({name:'home'})
|
if (this.$route.name != 'index') {
|
||||||
|
that.$router.push({name:'index'})
|
||||||
|
}
|
||||||
}else if (this.routerActive == 3) {
|
}else if (this.routerActive == 3) {
|
||||||
that.$router.push({name:'stationBuilding'})
|
that.$router.push({name:'stationBuilding'})
|
||||||
}
|
}
|
||||||
|
@ -98,6 +100,13 @@ export default {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
.left:before{
|
||||||
|
content: attr(text);
|
||||||
|
position: absolute;
|
||||||
|
z-index: 10;
|
||||||
|
color:rgb(86, 254, 246);
|
||||||
|
-webkit-mask:linear-gradient(to top, rgb(86,244,254), transparent );
|
||||||
|
}
|
||||||
.middle{
|
.middle{
|
||||||
width: auto;
|
width: auto;
|
||||||
height: 78px;
|
height: 78px;
|
||||||
|
@ -115,7 +124,13 @@ export default {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
background: url('./assets/images/routerActive.png') no-repeat;
|
background: url('./assets/images/routerActive.png') no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.active:before{
|
||||||
|
content: attr(text);
|
||||||
|
position: absolute;
|
||||||
|
z-index: 10;
|
||||||
|
color:rgb(86, 254, 246);
|
||||||
|
-webkit-mask:linear-gradient(to top, rgb(86,244,254), transparent );
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.right{
|
.right{
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -178,13 +178,9 @@
|
||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</div>
|
</div>
|
||||||
<div class="screen">
|
|
||||||
<div class="btn"></div>
|
|
||||||
<div class="btn"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="detailed">
|
<div class="detailed">
|
||||||
<div class="two" style="height: 350px; width: 780px">
|
<div class="two" style="height: 350px; width: 780px;display: flex;flex-direction: column;align-items: center;">
|
||||||
<div class="cartitle">
|
<div class="cartitle">
|
||||||
<div class="titleFont">
|
<div class="titleFont">
|
||||||
本周路线故障跳闸明细
|
本周路线故障跳闸明细
|
||||||
|
@ -460,6 +456,16 @@ export default {
|
||||||
let dataPbty = [];
|
let dataPbty = [];
|
||||||
dataPbty = res.data.data
|
dataPbty = res.data.data
|
||||||
this.detailedFive(dataPbty);
|
this.detailedFive(dataPbty);
|
||||||
|
console.log(dataPbty,'配变停运');
|
||||||
|
let dataPb = [];
|
||||||
|
let dataCf = [];
|
||||||
|
for (let i = 0; i < dataPbty.length; i++) {
|
||||||
|
dataPb.push(dataPbty[i].pbsl);
|
||||||
|
dataCf.push(dataPbty[i].cftytc);
|
||||||
|
}
|
||||||
|
this.topContent[0].count = dataPb.reduce((x, y) => x + y)
|
||||||
|
this.topContent[1].count = dataCf.reduce((x, y) => x + y)
|
||||||
|
console.log(dataCf.reduce((x, y) => x + y),'总数');
|
||||||
})
|
})
|
||||||
this.handleDate(0);
|
this.handleDate(0);
|
||||||
let that = this;
|
let that = this;
|
||||||
|
@ -620,7 +626,6 @@ export default {
|
||||||
myChart.setOption(option);
|
myChart.setOption(option);
|
||||||
},
|
},
|
||||||
detailedTwo(dataGdzl){
|
detailedTwo(dataGdzl){
|
||||||
console.log(dataGdzl,'供电质量');
|
|
||||||
let gdsList = [];
|
let gdsList = [];
|
||||||
let xlcczList = [];
|
let xlcczList = [];
|
||||||
let pbcczList = [];
|
let pbcczList = [];
|
||||||
|
@ -1233,7 +1238,6 @@ export default {
|
||||||
|
|
||||||
},
|
},
|
||||||
detailedFive(dataPbty){
|
detailedFive(dataPbty){
|
||||||
console.log(dataPbty,'dataPbty');
|
|
||||||
let dataListx = [];
|
let dataListx = [];
|
||||||
let dataPb = [];
|
let dataPb = [];
|
||||||
let dataGz = [];
|
let dataGz = [];
|
||||||
|
@ -1457,6 +1461,14 @@ export default {
|
||||||
let dataPbty = [];
|
let dataPbty = [];
|
||||||
dataPbty = res.data.data
|
dataPbty = res.data.data
|
||||||
this.detailedFive(dataPbty);
|
this.detailedFive(dataPbty);
|
||||||
|
let dataPb = [];
|
||||||
|
let dataCf = [];
|
||||||
|
for (let i = 0; i < dataPbty.length; i++) {
|
||||||
|
dataPb.push(dataPbty[i].pbsl);
|
||||||
|
dataCf.push(dataPbty[i].cftytc);
|
||||||
|
}
|
||||||
|
this.topContent[0].count = dataPb.reduce((x, y) => x + y)
|
||||||
|
this.topContent[1].count = dataCf.reduce((x, y) => x + y)
|
||||||
})
|
})
|
||||||
}else if (index == 1) {
|
}else if (index == 1) {
|
||||||
//月配变停运
|
//月配变停运
|
||||||
|
@ -1466,6 +1478,14 @@ export default {
|
||||||
let dataPbty = [];
|
let dataPbty = [];
|
||||||
dataPbty = res.data.data
|
dataPbty = res.data.data
|
||||||
this.detailedFive(dataPbty);
|
this.detailedFive(dataPbty);
|
||||||
|
let dataPb = [];
|
||||||
|
let dataCf = [];
|
||||||
|
for (let i = 0; i < dataPbty.length; i++) {
|
||||||
|
dataPb.push(dataPbty[i].pbsl);
|
||||||
|
dataCf.push(dataPbty[i].cftytc);
|
||||||
|
}
|
||||||
|
this.topContent[0].count = dataPb.reduce((x, y) => x + y)
|
||||||
|
this.topContent[1].count = dataCf.reduce((x, y) => x + y)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -1705,19 +1725,23 @@ export default {
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
.two{
|
.two{
|
||||||
.detailedOneList{
|
.detailedOneList{
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
justify-content: space-evenly;
|
justify-content: space-evenly;
|
||||||
height: 10%;
|
height: 10%;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color:#ffffff;
|
color:#ffffff;
|
||||||
background: rgb(18,54,87);
|
background: url("../assets/images/tableBg.png") no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
width:96%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.detailed {
|
.detailed {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: row nowrap;
|
flex-flow: row nowrap;
|
||||||
|
|
Loading…
Reference in New Issue