From 04bf59bbc3fad774c57a2ee5ebf07db24b476bf2 Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期二, 17 十二月 2024 17:43:14 +0800
Subject: [PATCH] Merge branch 'master' of http://139.186.142.91:10010/r/productDev/dmvisit
---
screen/src/views/EnergyConsum.vue | 165 +++++++++++++++++++++++++++++++++----------------------
1 files changed, 99 insertions(+), 66 deletions(-)
diff --git a/screen/src/views/EnergyConsum.vue b/screen/src/views/EnergyConsum.vue
index 3fa773b..a2f532f 100644
--- a/screen/src/views/EnergyConsum.vue
+++ b/screen/src/views/EnergyConsum.vue
@@ -3,7 +3,7 @@
<div class="main_app">
<img src="@/assets/images/bg_main_app.png" class="main_bg" alt="" />
<div class="main_header">
- <img src="@/assets/images/maintitle@2x.png" class="main_header_bg" alt="" />
+ <img src="@/assets/images/maintitle.gif" class="main_header_bg" alt="" />
<div class="title">瀹夋嘲鏅烘収鐗╂祦鍥尯-缁胯壊浣庣⒊杩愯惀</div>
<div class="time_wrap">
<span class="date">{{ date }}</span>
@@ -25,7 +25,7 @@
<img src="@/assets/images/nenghao_ic1.png" class="co2" alt="">
<div>
<div class="name">鏈勾绱寰幆鐑熺</div>
- <div><span class="num" v-if="data1.smokeBoxTotal || data1.smokeBoxTotal == 0">{{
+ <div><span class="num" style="color: #68cfb2;" v-if="data1.smokeBoxTotal || data1.smokeBoxTotal == 0">{{
data1.smokeBoxTotal.toLocaleString()
}}</span><span>鍙�</span></div>
</div>
@@ -81,25 +81,30 @@
</div>
<div class="static" v-if="data1.electricityQuantity">
<span class="lab">鍚屾瘮</span>
- <img v-if="data1.electricityQuantity.totalNum > data1.electricityQuantity.sameNum" class="icon"
- src="@/assets/images/ic_up.webp" alt="" />
- <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ <template v-if="data1.electricityQuantity.sameNum">
+ <img v-if="data1.electricityQuantity.totalNum > data1.electricityQuantity.sameNum" class="icon"
+ src="@/assets/images/ic_up.webp" alt="" />
+ <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ </template>
<span class="val"
v-if="data1.electricityQuantity.totalNum && data1.electricityQuantity.totalNum != 0">{{
Math.abs(((data1.electricityQuantity.totalNum -
data1.electricityQuantity.sameNum) / data1.electricityQuantity.totalNum * 100).toFixed(1))
}}%</span>
- <span class="val" v-else>-</span>
+ <span class="val" v-else style="margin-left: 4px;"> -</span>
<span class="lab">鐜瘮</span>
- <img v-if="data1.electricityQuantity.totalNum > data1.electricityQuantity.ringNum" class="icon"
- src="@/assets/images/ic_up.webp" alt="" />
- <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ <template v-if="data1.electricityQuantity.ringNum">
+ <img v-if="data1.electricityQuantity.totalNum > data1.electricityQuantity.ringNum" class="icon"
+ src="@/assets/images/ic_up.webp" alt="" />
+ <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ </template>
+
<span class="val"
v-if="data1.electricityQuantity.totalNum && data1.electricityQuantity.totalNum != 0">{{
Math.abs(((data1.electricityQuantity.totalNum -
data1.electricityQuantity.ringNum) / data1.electricityQuantity.totalNum * 100).toFixed(1))
}}%</span>
- <span class="val" v-else>-</span>
+ <span class="val" v-else style="margin-left: 4px;"> -</span>
</div>
</div>
<div class="item">
@@ -112,21 +117,25 @@
</div>
<div class="static" v-if="data1.waterQuantity">
<span class="lab">鍚屾瘮</span>
- <img v-if="data1.waterQuantity.totalNum > data1.waterQuantity.sameNum" class="icon"
- src="@/assets/images/ic_up.webp" alt="" />
- <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
- <span class="val" v-if="data1.waterQuantity.totalNum && data1.waterQuantity.totalNum != 0">{{
+ <template v-if="data1.waterQuantity.sameNum">
+ <img v-if="data1.waterQuantity.totalNum > data1.waterQuantity.sameNum" class="icon"
+ src="@/assets/images/ic_up.webp" alt="" />
+ <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ </template>
+ <span class="val" v-if="data1.waterQuantity.sameNum && data1.waterQuantity.sameNum != 0">{{
Math.abs(((data1.waterQuantity.totalNum -
- data1.waterQuantity.sameNum) / data1.waterQuantity.totalNum * 100).toFixed(1)) }}%</span>
- <span class="val" v-else>-</span>
+ data1.waterQuantity.sameNum) / data1.waterQuantity.sameNum * 100).toFixed(1)) }}%</span>
+ <span class="val" v-else style="margin-left: 4px;">-</span>
<span class="lab">鐜瘮</span>
- <img v-if="data1.waterQuantity.totalNum > data1.waterQuantity.ringNum" class="icon"
- src="@/assets/images/ic_up.webp" alt="" />
- <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
- <span class="val" v-if="data1.waterQuantity.totalNum && data1.waterQuantity.totalNum != 0">{{
+ <template v-if="data1.waterQuantity.ringNum">
+ <img v-if="data1.waterQuantity.totalNum > data1.waterQuantity.ringNum" class="icon"
+ src="@/assets/images/ic_up.webp" alt="" />
+ <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ </template>
+ <span class="val" v-if="data1.waterQuantity.ringNum && data1.waterQuantity.ringNum != 0">{{
Math.abs(((data1.waterQuantity.totalNum -
- data1.waterQuantity.ringNum) / data1.waterQuantity.totalNum * 100).toFixed(1)) }}%</span>
- <span class="val" v-else>-</span>
+ data1.waterQuantity.ringNum) / data1.waterQuantity.ringNum * 100).toFixed(1)) }}%</span>
+ <span class="val" v-else style="margin-left: 4px;">-</span>
</div>
</div>
<div class="item">
@@ -139,74 +148,81 @@
</div>
<div class="static" v-if="data1.gasQuantity">
<span class="lab">鍚屾瘮</span>
- <img v-if="data1.gasQuantity.totalNum > data1.gasQuantity.sameNum" class="icon"
- src="@/assets/images/ic_up.webp" alt="" />
- <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ <template v-if="data1.gasQuantity.sameNum">
+ <img v-if="data1.gasQuantity.totalNum > data1.gasQuantity.sameNum" class="icon"
+ src="@/assets/images/ic_up.webp" alt="" />
+ <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ </template>
<span class="val" v-if="data1.gasQuantity.totalNum && data1.gasQuantity.totalNum != 0">{{
Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.sameNum) / data1.gasQuantity.totalNum
* 100).toFixed(1))
}}%</span>
- <span class="val" v-else>-</span>
+ <span class="val" v-else style="margin-left: 4px;">-</span>
<span class="lab">鐜瘮</span>
- <img v-if="data1.gasQuantity.totalNum > data1.gasQuantity.ringNum" class="icon"
- src="@/assets/images/ic_up.webp" alt="" />
- <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ <template v-if="data1.gasQuantity.sameNum">
+ <img v-if="data1.gasQuantity.totalNum > data1.gasQuantity.ringNum" class="icon"
+ src="@/assets/images/ic_up.webp" alt="" />
+ <img v-else class="icon" src="@/assets/images/ic_down.webp" alt="" />
+ </template>
<span class="val" v-if="data1.gasQuantity.totalNum && data1.gasQuantity.totalNum != 0">{{
Math.abs(((data1.gasQuantity.totalNum - data1.gasQuantity.ringNum) / data1.gasQuantity.totalNum
* 100).toFixed(1))
}}%</span>
- <span class="val" v-else>-</span>
+ <span class="val" v-else style="margin-left: 4px;">-</span>
</div>
</div>
</div>
</div>
<div class="center_box_two">
<img class="bg" src="@/assets/images/img_city@2x.png" alt="" />
- <template v-if="data6 && data6.secondRegionDataList && data6.secondRegionDataList.length > 0">
- <div class="item item1">
- <div class="num fs_linear">{{ data6.secondRegionDataList[0].value }}<span class="unit">kw路h</span></div>
- <div class="name">{{ data6.secondRegionDataList[0].name }}</div>
+ <template v-if="data6 && data6 && data6.length > 0">
+ <div class="item item1" v-if="data6.length > 4">
+ <div class="num fs_linear">{{ data6[4].value }}<span class="unit">kw路h</span></div>
+ <div class="name">{{ data6[4].name }}</div>
<img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
</div>
- <div class="item item2" v-if="data6.secondRegionDataList.length > 1">
- <div class="num fs_linear">{{ data6.secondRegionDataList[1].value }}<span class="unit">kw路h</span></div>
- <div class="name">{{ data6.secondRegionDataList[1].name }}</div>
+ <div class="item item2" v-if="data6.length > 1">
+ <div class="num fs_linear">{{ data6[1].value }}<span class="unit">kw路h</span></div>
+ <div class="name">{{ data6[1].name }}</div>
<img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
</div>
- <div class="item item3" v-if="data6.secondRegionDataList.length > 2">
- <div class="num fs_linear">{{ data6.secondRegionDataList[2].value }}<span class="unit">kw路h</span></div>
- <div class="name">{{ data6.secondRegionDataList[2].name }}</div>
+ <div class="item item3" v-if="data6.length > 2">
+ <div class="num fs_linear">{{ data6[2].value }}<span class="unit">kw路h</span></div>
+ <div class="name">{{ data6[2].name }}</div>
<img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
</div>
- <div class="item item4" v-if="data6.secondRegionDataList.length > 3">
- <div class="num fs_linear">{{ data6.secondRegionDataList[3].value }}<span class="unit">kw路h</span></div>
- <div class="name">{{ data6.secondRegionDataList[3].name }}</div>
+ <div class="item item4" v-if="data6.length > 3">
+ <div class="num fs_linear">{{ data6[3].value }}<span class="unit">kw路h</span></div>
+ <div class="name">{{ data6[3].name }}</div>
<img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
</div>
- <div class="item item5" v-if="data6.secondRegionDataList.length > 4">
- <div class="num fs_linear">{{ data6.secondRegionDataList[4].value }}<span class="unit">kw路h</span></div>
- <div class="name">{{ data6.secondRegionDataList[4].name }}</div>
+ <div class="item item5">
+ <div class="num fs_linear">{{ data6[0].value }}<span class="unit">kw路h</span></div>
+ <div class="name">{{ data6[0].name }}</div>
<img src="@/assets/images/bg_data@2x.png" class="bg" alt="" />
</div>
</template>
<div class="bottom_wrap" v-if="data1.yesterdayElectricity">
- <div class="bottom bottom1">
- <div class="num fs_linear">{{ data1.yesterdayElectricity.total || 0 }}</div>
+ <div class="bottom bottom1" @click="changeacDay(3)">
+ <div :class="{active: activeDays == 3}" class="num fs_linear">{{ data1.yesterdayElectricity.total || 0 }}</div>
<div class="name">鏄ㄦ棩鐢ㄧ數</div>
<div class="unit">kw路h</div>
- <img src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" />
+ <img v-if="activeDays == 3" src="@/assets/images/ic_dianliang@2x.png" class="bg" alt="" />
+ <img v-else src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" />
</div>
- <div class="bottom bottom2">
- <div class="num">{{ data1.todayElectricity.total || 0 }}</div>
+ <div class="bottom bottom2" @click="changeacDay(1)">
+ <div :class="{active: activeDays == 1}" class="num">{{ data1.todayElectricity.total || 0 }}</div>
<div class="name">浠婃棩鐢ㄧ數</div>
<div class="unit">kw路h</div>
- <img src="@/assets/images/ic_dianliang@2x.png" class="bg" alt="" />
+ <img v-if="activeDays == 1" src="@/assets/images/ic_dianliang@2x.png" class="bg" alt="" />
+ <img v-else src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" />
</div>
- <div class="bottom bottom3">
- <div class="num fs_linear">{{ data1.monthElectricity.total || 0 }}</div>
+ <div class="bottom bottom3" @click="changeacDay(2)">
+ <div :class="{active: activeDays == 2}" class="num fs_linear">{{ data1.monthElectricity.total || 0 }}</div>
<div class="name">鏈湀鐢ㄧ數</div>
<div class="unit">kw路h</div>
- <img src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" />
+ <img v-if="activeDays == 2" src="@/assets/images/ic_dianliang@2x.png" class="bg" alt="" />
+ <img v-else src="@/assets/images/ic_dianliang_b@2x.png" class="bg" alt="" />
</div>
</div>
</div>
@@ -241,7 +257,7 @@
</div>
<div v-if="data3 && data3.length > 0" class="list">
<template v-for="item, i in data3">
- <div v-if="i < 6" class="line" >
+ <div v-if="i < 6" class="line">
<div class="top"><span v-if="i < 3">top</span>{{ i + 1 }}</div>
<div class="id_card">{{ item.carNo }}</div>
<div class="wrap">
@@ -285,7 +301,8 @@
zxenergyDataList,
zxlastMonthOil,
zxloadCurve,
- zxenergyRegionData
+ zxenergyRegionData,
+ regionDataRanking
} from '@/api'
@@ -533,13 +550,19 @@
data1.value = result
})
}
+const activeDays = ref('1')
const data6 = ref({})
+const changeacDay = (val) => {
+ activeDays.value = val
+ getData6()
+}
const getData6 = () => {
- zxenergyRegionData().then(res => {
+ regionDataRanking({type: activeDays.value}).then(res => {
const result = res.data
data6.value = result
})
}
+
const activeTab2 = ref(0)
const tabsClick2 = (v) => {
@@ -656,6 +679,16 @@
getData4()
getData5()
getData6()
+ setInterval(() => {
+ getData4()
+ }, 1000 * 60)
+ setInterval(() => {
+ getData1()
+ getData2()
+ getData3()
+ getData5()
+ getData6()
+ }, 1000 * 60 * 60)
})
@@ -865,7 +898,7 @@
position: absolute;
text-align: center;
padding-top: 70px;
-
+ cursor: pointer;
.num {
font-size: 24px;
color: #D0FFFA;
@@ -881,6 +914,12 @@
.unit {
font-size: 14px;
color: #D0FFFA;
+ }
+ .active {
+ font-size: 36px;
+ color: #01D9FE;
+ font-weight: bold;
+ margin-bottom: 10px;
}
}
@@ -898,14 +937,8 @@
bottom: -0px;
left: 50%;
transform: translate(-50%, 0);
- padding-top: 50px;
+ /* padding-top: 50px; */
- .num {
- font-size: 36px;
- color: #01D9FE;
- line-height: 54px;
- font-weight: bold;
- }
}
}
}
--
Gitblit v1.9.3