From 06d3d15a5a08637041cc601101c063b11b07a346 Mon Sep 17 00:00:00 2001
From: net <net@netdeMBP.lan>
Date: 星期五, 14 二月 2025 17:25:21 +0800
Subject: [PATCH] 合并理去杀杀人
---
zhitan-vue/src/views/realtimemonitor/realtimemonitor/realtimemonitor.vue | 126 ++++++++++++++++++++++-------------------
1 files changed, 67 insertions(+), 59 deletions(-)
diff --git a/zhitan-vue/src/views/realtimemonitor/realtimemonitor/realtimemonitor.vue b/zhitan-vue/src/views/realtimemonitor/realtimemonitor/realtimemonitor.vue
index bab0dc2..23b7d46 100644
--- a/zhitan-vue/src/views/realtimemonitor/realtimemonitor/realtimemonitor.vue
+++ b/zhitan-vue/src/views/realtimemonitor/realtimemonitor/realtimemonitor.vue
@@ -9,13 +9,16 @@
<el-form :model="queryParams" ref="queryRef" :inline="true">
<el-form-item label="鑳芥簮绫诲瀷" prop="energyType">
<el-select v-model="queryParams.energyType" placeholder="鑳芥簮绫诲瀷" @change="handleQuery">
- <el-option :label="item.enername" :value="item.enersno" v-for="item in energyTypeList" :key="item.enersno" />
+ <el-option
+ :label="item.enername"
+ :value="item.enersno"
+ v-for="item in energyTypeList"
+ :key="item.enersno"
+ />
</el-select>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">
- 鎼滅储
- </el-button>
+ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button>
<el-button icon="Refresh" @click="resetQuery"> 閲嶇疆 </el-button>
</el-form-item>
<el-form-item>
@@ -23,20 +26,24 @@
</el-form-item>
</el-form>
</div>
- <div style="
- height: calc(100vh - 220px) !important;
- max-height: calc(100vh - 220px) !important;
- overflow-y: auto;
- " v-loading="loading">
+ <div
+ style="height: calc(100vh - 220px) !important; max-height: calc(100vh - 220px) !important; overflow-y: auto"
+ v-loading="loading"
+ >
<div v-for="(item, index) in energyRealTimeMonitorList" :key="index" v-show="!!item.deviceArray">
<BaseCard :title="queryParams.nodeName + '-' + item.energyTypeName" v-if="item.deviceArray.length > 0">
<el-scrollbar>
<div class="scrollbar-flex-content">
<p></p>
- <div class="scrollbar-demo-item item-tag" @click="handleClick(item, index1)" v-for="item1,index1 in item.deviceArray" :key="index1" :style="{
- backgroundColor:
- index1 == item.activeIndex ? '#5EC894' : '#9841FC',
- }">
+ <div
+ class="scrollbar-demo-item item-tag"
+ @click="handleClick(item, index1)"
+ v-for="(item1, index1) in item.deviceArray"
+ :key="index1"
+ :style="{
+ backgroundColor: index1 == item.activeIndex ? '#5EC894' : '#9841FC',
+ }"
+ >
{{ item1.deviceName }}
</div>
</div>
@@ -71,18 +78,18 @@
{{ item.deviceArray[item.activeIndex].energyTypeName }}
</div>
<div class="card-box-ul">
- <div class="card-box-li" v-for="(item2, index2) in item.deviceArray[item.activeIndex]
- .energyIndexArray">
+ <div
+ class="card-box-li"
+ v-for="(item2, index2) in item.deviceArray[item.activeIndex].energyIndexArray"
+ >
<el-tooltip class="box-item" effect="dark" content="鏌ョ湅鍘嗗彶鏁版嵁" placement="top">
<dl @click="handleChartModal(item2)">
<dd class="title">
{{ item2.name }}
- <template v-if="!!item2.unit">
- ({{ item2.unit }})
- </template>
+ <template v-if="!!item2.unit"> ({{ item2.unit }}) </template>
</dd>
<dd class="num">
- {{ item2.value!=null ? item2.value.toFixed(2) : '--' }}
+ {{ item2.value != null ? item2.value.toFixed(2) : "--" }}
</dd>
<dd class="time">
<el-icon>
@@ -105,22 +112,22 @@
</div>
</template>
<script setup name="energy-real-time-monitor">
-import chartModal from "./components/chart-modal.vue";
-import { listEnergyRealTimeMonitor } from "@/api/realTimeMonitor/realTimeMonitor";
-import { listEnergyTypeList } from "@/api/modelConfiguration/energyType";
-const { proxy } = getCurrentInstance();
-import { useRoute } from "vue-router";
-import useSettingsStore from "@/store/modules/settings";
-const settingsStore = useSettingsStore();
+import chartModal from "./components/chart-modal.vue"
+import { listEnergyRealTimeMonitor } from "@/api/realTimeMonitor/realTimeMonitor"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+const { proxy } = getCurrentInstance()
+import { useRoute } from "vue-router"
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
watch(
() => settingsStore.sideTheme,
(val) => {
- getList();
+ getList()
}
-);
-const energyTypeList = ref(undefined);
-let energyRealTimeMonitorList = ref([]);
-const loading = ref(false);
+)
+const energyTypeList = ref(undefined)
+let energyRealTimeMonitorList = ref([])
+const loading = ref(false)
const data = reactive({
queryParams: {
nodeId: null,
@@ -128,24 +135,24 @@
energyType: null,
},
query: { ...useRoute().query },
-});
-const { queryParams, query } = toRefs(data);
+})
+const { queryParams, query } = toRefs(data)
/** 鑺傜偣鍗曞嚮浜嬩欢 */
function handleNodeClick(data) {
- queryParams.value.nodeId = data.id;
- queryParams.value.nodeName = data.label;
+ queryParams.value.nodeId = data.id
+ queryParams.value.nodeName = data.label
listEnergyTypeList().then((res) => {
- energyTypeList.value = res.data;
- queryParams.value.energyType = energyTypeList.value[0].enersno;
- handleQuery();
- });
+ energyTypeList.value = res.data
+ queryParams.value.energyType = energyTypeList.value[0].enersno
+ handleQuery()
+ })
}
function handleClick(item, index) {
- item.activeIndex = index;
+ item.activeIndex = index
}
// 鑳芥簮瀹炴椂鐩戞帶-鑳芥簮瀹炴椂鐩戞帶-鍒楄〃
function getList() {
- loading.value = true;
+ loading.value = true
listEnergyRealTimeMonitor(
proxy.addDateRange({
...queryParams.value,
@@ -154,31 +161,31 @@
).then((res) => {
if (!!res.code && res.code == 200) {
res.data.map((item) => {
- item.activeIndex = 0;
- });
- loading.value = false;
- energyRealTimeMonitorList.value = res.data;
+ item.activeIndex = 0
+ })
+ loading.value = false
+ energyRealTimeMonitorList.value = res.data
}
- });
+ })
}
// 鑳芥簮瀹炴椂鐩戞帶-鑳芥簮瀹炴椂鐩戞帶-鎼滅储
function handleQuery() {
- energyRealTimeMonitorList.value = [];
- getList();
+ energyRealTimeMonitorList.value = []
+ getList()
}
// 鑳芥簮瀹炴椂鐩戞帶-鑳芥簮瀹炴椂鐩戞帶-閲嶇疆
function resetQuery() {
- proxy.resetForm("queryRef");
- queryParams.value.energyType = null;
- energyRealTimeMonitorList.value = [];
- handleQuery();
+ proxy.resetForm("queryRef")
+ queryParams.value.energyType = null
+ energyRealTimeMonitorList.value = []
+ handleQuery()
}
-let chartRef = ref();
+let chartRef = ref()
function handleChartModal(row) {
if (chartRef.value) {
row.nodeName = queryParams.value.nodeName
- chartRef.value.handleOpen(row);
+ chartRef.value.handleOpen(row)
}
}
</script>
@@ -213,6 +220,7 @@
&-li {
width: 18%;
+ min-width: 190px;
margin: 1%;
border-radius: 5px;
border: 1px solid #22408c;
@@ -235,11 +243,10 @@
}
.num {
- font-size: 22px;
+ font-size: 24px;
color: #36d3ff;
font-family: OPPOSans, OPPOSans;
font-weight: 800;
- font-size: 32px;
text-align: left;
font-style: normal;
text-transform: none;
@@ -252,6 +259,7 @@
text-align: left;
font-style: normal;
text-transform: none;
+ font-size: 14px;
}
}
@@ -423,12 +431,12 @@
.item-tag {
// width: 13%;
text-align: center;
- margin: 5px 8px;
+ margin: 2px 6px;
border-radius: 8px;
- padding: 7px 10px;
+ padding: 5px 10px;
font-family: OPPOSans, OPPOSans;
font-weight: 500;
- font-size: 16px;
+ font-size: 14px;
color: #ffffff;
cursor: pointer;
}
--
Gitblit v1.9.3