From 5c63d4bbaf28166e107b388240e9cbc2d85fbcc1 Mon Sep 17 00:00:00 2001
From: ali <ali9696@163.com>
Date: 星期五, 28 二月 2025 11:41:43 +0800
Subject: [PATCH] 图表样式优化
---
zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue | 24 +++++++++++++++---------
1 files changed, 15 insertions(+), 9 deletions(-)
diff --git a/zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue b/zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue
index a78185b..d471ba5 100644
--- a/zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue
+++ b/zhitan-vue/src/views/dataMonitoring/historyDataTrend/index.vue
@@ -19,8 +19,8 @@
<el-date-picker
v-model="queryParams.dataTime"
:type="queryParams.timeType == 'DAY' ? 'date' : 'datetime'"
- :format="queryParams.timeType == 'DAY' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm:ss'"
- :value-format="queryParams.timeType == 'DAY' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm:ss'"
+ :format="queryParams.timeType == 'DAY' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:00:00'"
+ :value-format="queryParams.timeType == 'DAY' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:00:00'"
placeholder="鏃堕棿"
style="width: 100%"
/>
@@ -44,15 +44,15 @@
</el-form>
</div>
<div class="display-buttons">
- <div class="display-btn" @click="activeKey = 1" :class="{ 'active-display-btn': activeKey === 1 }">
+ <div class="display-btn" @click="switchBtnType(1)" :class="{ 'active-display-btn': activeKey === 1 }">
鍥惧舰
</div>
- <div class="display-btn" @click="activeKey = 2" :class="{ 'active-display-btn': activeKey === 2 }">
+ <div class="display-btn" @click="switchBtnType(2)" :class="{ 'active-display-btn': activeKey === 2 }">
鏁版嵁
</div>
</div>
<div class="chart-box" v-loading="loading" v-show="activeKey === 1">
- <LineChart ref="LineChartRef" :chartData="lineChartData" />
+ <LineChart ref="LineChartRef" :chartData="lineChartData" :chartType="'bar'" />
</div>
<div style="margin-top: 16px" v-show="activeKey === 2">
<div class="" style="padding: 0 16px">
@@ -118,19 +118,26 @@
queryParams.value.nodeId = data.id
queryParams.value.nodeName = data.label
setTimeout(() => {
- handleTimeType(period.value[0].value)
+ handleTimeType(queryParams.value.timeType)
}, 200)
}
function handleTimeType(e) {
queryParams.value.timeType = e
- queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD HH:mm:ss")
+ queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD HH:00:00")
getElectricityMeter({ modelId: queryParams.value.nodeId })
}
function changeTimeType(e) {
console.log(e)
- queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD HH:mm:ss")
+ queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD HH:00:00")
getElectricityMeter({ modelId: queryParams.value.nodeId })
+}
+
+function switchBtnType(e) {
+ activeKey.value = e
+ if (e === 1) {
+ getList()
+ }
}
const LineChartRef = ref()
function getList() {
@@ -185,7 +192,6 @@
proxy.resetForm("queryRef")
queryParams.value.timeType = null
queryParams.value.dataTime = null
- handleTimeType(period.value[0].value)
handleQuery()
}
// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-瀵煎嚭
--
Gitblit v1.9.3