From 51af02271fe8a6d3e2db7bef90df1ea5f571a173 Mon Sep 17 00:00:00 2001
From: wangjuncheng <1>
Date: 星期一, 21 四月 2025 13:06:07 +0800
Subject: [PATCH] change
---
src/components/monifangzhen/echartInfo.vue | 130 ++++++++++++++++++------------------------
1 files changed, 56 insertions(+), 74 deletions(-)
diff --git a/src/components/monifangzhen/echartInfo.vue b/src/components/monifangzhen/echartInfo.vue
index e8da721..9ea190d 100644
--- a/src/components/monifangzhen/echartInfo.vue
+++ b/src/components/monifangzhen/echartInfo.vue
@@ -25,70 +25,21 @@
<p style="cursor: pointer" @click="debuffClick">濞佽儊瀵硅薄</p>
<div class="echartBox">
<div class="table-container" ref="tableContainer">
- <el-table
- :data="tableData"
- style="width: 100%; font-size: 10px"
- height="100%"
- >
+ <el-table :data="tableData" style="width: 100%; font-size: 10px" height="100%" @row-click="handleRowClick">
<el-table-column label="褰卞搷鍖哄悕绉�" width="30" align="center">
<template #default="scope">
褰卞搷鍖簕{ scope.row.zoneId }}
</template>
</el-table-column>
- <el-table-column
- prop="time"
- label="褰卞搷鏃堕棿"
- width="50"
- align="center"
- ></el-table-column>
- <el-table-column
- prop="population"
- label="浜哄憳(浜�)"
- width="23"
- align="center"
- ></el-table-column>
- <el-table-column
- prop="room"
- label="鎴垮眿(闂�)"
- width="23"
- align="center"
- ></el-table-column>
- <el-table-column
- prop="households"
- label="鎴锋暟(鎴�)"
- width="23"
- align="center"
- ></el-table-column>
- <el-table-column
- prop="property"
- label="璐骇(涓囧厓)"
- width="23"
- align="center"
- ></el-table-column>
- <el-table-column
- prop="maxDepth"
- label="鏈�澶ф按娣�(绫�)"
- width="28"
- align="center"
- ></el-table-column>
- <el-table-column
- prop="maxVelocity"
- label="鏈�澶ф祦閫�(m/s)"
- width="35"
- align="center"
- ></el-table-column>
- <el-table-column
- prop="raininess"
- label="闆ㄥ己(mm/h)"
- width="28"
- align="center"
- ></el-table-column>
- <el-table-column
- prop="warningLevel"
- label="棰勮绛夌骇"
- width="28"
- align="center"
- ></el-table-column>
+ <el-table-column prop="time" label="褰卞搷鏃堕棿" width="50" align="center"></el-table-column>
+ <el-table-column prop="population" label="浜哄憳(浜�)" width="23" align="center"></el-table-column>
+ <el-table-column prop="room" label="鎴垮眿(闂�)" width="23" align="center"></el-table-column>
+ <el-table-column prop="households" label="鎴锋暟(鎴�)" width="23" align="center"></el-table-column>
+ <el-table-column prop="property" label="璐骇(涓囧厓)" width="23" align="center"></el-table-column>
+ <el-table-column prop="maxDepth" label="鏈�澶ф按娣�(绫�)" width="28" align="center"></el-table-column>
+ <el-table-column prop="maxVelocity" label="鏈�澶ф祦閫�(m/s)" width="35" align="center"></el-table-column>
+ <el-table-column prop="raininess" label="闆ㄥ己(mm/h)" width="28" align="center"></el-table-column>
+ <el-table-column prop="warningLevel" label="棰勮绛夌骇" width="28" align="center"></el-table-column>
</el-table>
</div>
</div>
@@ -99,7 +50,8 @@
<script setup>
import * as echarts from "echarts";
-import { ref, onMounted, onBeforeUnmount, nextTick, watch } from "vue";
+import { EventBus } from "@/eventBus"; // 寮曞叆浜嬩欢鎬荤嚎
+import { ref, onMounted, onBeforeUnmount, nextTick, watch, onUnmounted } from "vue";
import dayjs from "dayjs";
import { getRainfall } from "@/api";
@@ -137,21 +89,43 @@
}
}
);
-
-// 閲嶇疆濞佽儊瀵硅薄涓殑鏁版嵁
+// 娓呴櫎鍑芥暟=====================================================================
+// 鐩戝惉浜嬩欢鎬荤嚎鐨勮嚜瀹氫箟浜嬩欢
+EventBus.on("reset-table", () => {
+ resetTable(); // 璋冪敤閲嶇疆琛ㄦ牸鐨勫嚱鏁�
+});
+EventBus.on("clear-echart", () => {
+ clearEchartData(); // 璋冪敤娓呴櫎鍑芥暟
+});
+// 娓呴櫎 echart1/2鏁版嵁鐨勫嚱鏁�
+const clearEchartData = () => {
+ if (myChart1) {
+ const currentOption = myChart1.getOption(); // 鑾峰彇褰撳墠鍥捐〃閰嶇疆
+ currentOption.series.forEach((series) => {
+ series.data = []; // 娓呯┖姣忎釜绯诲垪鐨勬暟鎹�
+ });
+ currentOption.xAxis[0].data = [];
+ myChart1.setOption(currentOption);
+ }
+ if (myChart2) {
+ const currentOption = myChart2.getOption();
+ currentOption.series.forEach((series) => {
+ series.data = [];
+ });
+ currentOption.xAxis[0].data = [];
+ myChart2.setOption(currentOption);
+ }
+};
+// 娓呴櫎濞佽儊瀵硅薄涓殑鏁版嵁
const resetTable = () => {
- // 1. 閲嶇疆琛ㄦ牸鏁版嵁
currentIndex.value = 0;
tableData.value = [];
-
- // 2. 鍋滄骞堕噸鏂板紑濮嬫暟鎹姞杞�
if (dataIntervalId) {
clearInterval(dataIntervalId);
}
startAddingData();
};
-// 鐩戝惉鐖剁粍浠朵紶閫掔殑鏁版嵁鍙樺寲
// 鐩戝惉鐖剁粍浠朵紶閫掔殑鏁版嵁鍙樺寲
watch(
() => props.isDynamicMode,
@@ -201,6 +175,12 @@
},
{ immediate: true } // 绔嬪嵆鎵ц鐩戝惉鍣�
);
+// 鐐瑰嚮鏁版嵁瀹炵幇闈㈢墖闂姩鐨勮Е鍙戝嚱鏁�
+function handleRowClick(row) {
+ console.log("Row clicked:", row);
+ // 瑙﹀彂浜嬩欢锛屽皢褰撳墠琛岀殑 ID 鍙戦�佸埌鍦板浘缁勪欢
+ EventBus.emit("row-clicked", row.id);
+}
const listData = cityData.listData;
const data = ref([
8.16, 15.38, 13.94, 9.46, 86.42, 71.32, 28.52, 25.9, 13.74, 14.54, 15.53,
@@ -1739,8 +1719,6 @@
};
const startAddingData = () => {
- console.log("Starting timer with jsonData length:", jsonData.value.length);
-
// 濡傛灉瀹氭椂鍣ㄥ凡瀛樺湪锛屽厛娓呴櫎
if (dataIntervalId) {
clearInterval(dataIntervalId);
@@ -1851,7 +1829,7 @@
const [hours, mins] = currentTime.split(':').map(Number);
let newHours = hours;
let newMins = mins + 10;
-
+
if (newMins >= 60) {
newMins = 0;
newHours += 1;
@@ -1859,7 +1837,7 @@
if (newHours >= 24) {
newHours = 0;
}
-
+
return `${String(newHours).padStart(2, "0")}:${String(newMins).padStart(2, "0")}`;
};
@@ -1980,7 +1958,7 @@
},
data: data2.value,
lineStyle: {
- color: "#ffb637",
+ color: "#ffb637",
},
label: {
show: false, // 纭繚鏍囩涓嶆樉绀�
@@ -2134,7 +2112,7 @@
const [hours, mins] = currentTime.split(':').map(Number);
let newHours = hours;
let newMins = mins + 10;
-
+
if (newMins >= 60) {
newMins = 0;
newHours += 1;
@@ -2142,7 +2120,7 @@
if (newHours >= 24) {
newHours = 0;
}
-
+
return `${String(newHours).padStart(2, "0")}:${String(newMins).padStart(2, "0")}`;
};
@@ -2290,7 +2268,7 @@
xAxisData.value.push(nextTime);
// 鏇存柊褰撳墠绱㈠紩
- dataIndex.value+= 2;
+ dataIndex.value += 2;
// 鏇存柊鍥捐〃
updateChart(
@@ -2390,6 +2368,10 @@
if (myChart2) myChart2.dispose();
window.removeEventListener("resize", handleResize);
});
+onUnmounted(() => {
+ EventBus.off("reset-table"); // 绉婚櫎浜嬩欢鐩戝惉
+ EventBus.off("clear-echart");
+});
</script>
<style lang="less" scoped>
--
Gitblit v1.9.3