From 86f2633b4c70675bd90e79c9bdaf8a1eb8f95938 Mon Sep 17 00:00:00 2001
From: guonan <guonan201020@163.com>
Date: 星期三, 28 五月 2025 14:49:57 +0800
Subject: [PATCH] 历史模拟
---
src/components/tools/LayerTree.vue | 30 ++++++++-------
src/views/left/KGSim.vue | 4 +
src/store/simAPI.js | 17 ++++++--
src/components/monifangzhen/echartInfo.vue | 1
src/views/left/KGSimOption/PredictiveSimulation.vue | 4 +-
src/components/tools/Message.vue | 2
src/components/tools/TopographyDia.vue | 2
src/views/left/KGSimOption/HistorySimulation.vue | 1
src/views/left/CitySim.vue | 41 +++++++++++++++++++-
9 files changed, 76 insertions(+), 26 deletions(-)
diff --git a/src/components/monifangzhen/echartInfo.vue b/src/components/monifangzhen/echartInfo.vue
index 4f55c8c..2b0dd98 100644
--- a/src/components/monifangzhen/echartInfo.vue
+++ b/src/components/monifangzhen/echartInfo.vue
@@ -350,6 +350,7 @@
rainfallData.value = rainfallData.value.map((item) => ({
...item,
intensity: item.intensity * 60,
+ total: item.total * 60,
}));
}
diff --git a/src/components/tools/LayerTree.vue b/src/components/tools/LayerTree.vue
index 87a046b..f572dd8 100644
--- a/src/components/tools/LayerTree.vue
+++ b/src/components/tools/LayerTree.vue
@@ -101,7 +101,9 @@
// 鍒濆鍖栧湴褰㈡暟鎹紙浣跨敤await绛夊緟Promise瑙ｆ瀽锛�
TerrainLayer = await earthCtrl.factory.createTerrainLayer({
sourceType: "ctb",
- url: "http://106.120.22.26:9103/gisserver/ctsserver/sungugoudem",
+ url: "http://106.120.22.26:9103/gisserver/ctsserver/sunhugoudem",
+ // url: "https://tiles1.geovisearth.com/base/v1/terrain?token=486dac3bec56d7d7c2a581c150be2bd937462f1e8f3bc9c78b5658b396122405",
+ requestVertexNormals: true,
});
treeMap.set("鍦板舰鏁版嵁", TerrainLayer);
@@ -187,27 +189,27 @@
if (label === "缁煎悎鐩戞祴璁惧淇℃伅") {
simStore.DeviceShowSwitch = checked;
if (checked) {
- if (!treeMap.get("缁煎悎鐩戞祴璁惧淇℃伅")) {
+ if (!treeMap.get("缁煎悎鐩戞祴璁惧淇℃伅")) {
+ } else {
+ toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", true);
+ }
} else {
- toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", true);
+ toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", false);
}
- } else {
- toggleLayerVisible("缁煎悎鐩戞祴璁惧淇℃伅", false);
+ return;
}
- return;
-}
-if (label === "瀛欒儭娌熼殣鎮ｇ偣") {
+ if (label === "瀛欒儭娌熼殣鎮ｇ偣") {
simStore.DangerShowSwitch = checked;
if (checked) {
- if (!treeMap.get("瀛欒儭娌熼殣鎮ｇ偣")) {
+ if (!treeMap.get("瀛欒儭娌熼殣鎮ｇ偣")) {
+ } else {
+ toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", true);
+ }
} else {
- toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", true);
+ toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", false);
}
- } else {
- toggleLayerVisible("瀛欒儭娌熼殣鎮ｇ偣", false);
+ return;
}
- return;
-}
// 鍏朵粬鍥惧眰鐨勫鐞嗛�昏緫
const list = treeMap.get(label);
diff --git a/src/components/tools/Message.vue b/src/components/tools/Message.vue
index 4960c0c..22a2491 100644
--- a/src/components/tools/Message.vue
+++ b/src/components/tools/Message.vue
@@ -178,7 +178,7 @@
};
addField("total", "闄嶉洦鎬婚噺锛坢m锛�");
- addField("duration", "灏忔椂");
+ addField("duration", "闄嶉洦鏃堕暱(h)");
addField("intensity", "闄嶉洦寮哄害锛坢m/灏忔椂锛�");
addField("prediction", "闄嶉洦鍦烘");
addField("model", "闄嶉洦妯″紡");
diff --git a/src/components/tools/TopographyDia.vue b/src/components/tools/TopographyDia.vue
index 8a6ba17..3df9973 100644
--- a/src/components/tools/TopographyDia.vue
+++ b/src/components/tools/TopographyDia.vue
@@ -46,7 +46,7 @@
}
/deep/ .el-input__wrapper {
- background-color: #fff !important;
+ // background-color: #8b2f2f !important;
border: none !important;
}
</style>
diff --git a/src/store/simAPI.js b/src/store/simAPI.js
index ce8cee2..b09f6a5 100644
--- a/src/store/simAPI.js
+++ b/src/store/simAPI.js
@@ -31,14 +31,23 @@
}
if (forms.type === 1 || forms.type === 3) {
- if (!forms.geom || !forms.rainfall || !forms.intensity || !forms.duration) {
+ if (!forms.geom) {
+ ElMessage.warning('璇烽�夋嫨妯℃嫙鍖哄煙')
+ return false
+ }
+
+ if (!forms.rainfall || !forms.intensity || !forms.duration) {
ElMessage.warning('璇风‘淇濊〃鍗曞潎宸插～鍐�')
return false
}
}
if (forms.type === 2) {
- if (!forms.geom || !forms.gauges) {
- ElMessage.warning('璇风‘淇濊〃鍗曞潎宸插～鍐�')
+ if (!forms.geom) {
+ ElMessage.warning('璇烽�夋嫨妯℃嫙鍖哄煙')
+ return false
+ }
+ if (forms.gauges.length === 0) {
+ ElMessage.warning('璇烽�夋嫨闆ㄩ噺璁¤澶�')
return false
}
}
@@ -80,7 +89,7 @@
intensityUnit: forms.intensityUnit || 'mm/15min'
})
}
- console.log(params, '淇濆瓨鏂规鍙傛暟')
+ // console.log(params, '淇濆瓨鏂规鍙傛暟')
const res = await createSimData(params)
ElMessage.success('鏂规淇濆瓨鎴愬姛')
return res
diff --git a/src/views/left/CitySim.vue b/src/views/left/CitySim.vue
index 8e68f7c..cf42766 100644
--- a/src/views/left/CitySim.vue
+++ b/src/views/left/CitySim.vue
@@ -10,7 +10,11 @@
<div class="left-top" v-if="simStore.selectTab == '閲嶇偣鍖哄煙浠跨湡'">
閲嶇偣鍖哄煙浠跨湡锛�10m绮惧害锛�
</div>
- <div class="forms">
+ <div class="left-top" v-if="simStore.selectTab == '閲嶇偣娌熶豢鐪�'">
+ 鍘嗗彶妯℃嫙
+ </div>
+
+ <div class="forms" :class="{ 'no-background': !showBackground }">
<el-form
:rules="rules"
:model="forms"
@@ -106,7 +110,7 @@
v-if="forms.fileList.length !== 0"
v-model="forms.hours"
type="datetime"
- placeholder="Select date and time"
+ placeholder="璇烽�夋嫨寮�濮嬫椂闂�"
/>
<el-date-picker
v-if="forms.fileList.length == 0"
@@ -169,6 +173,14 @@
const options = reactive([]);
+// 鍘嗗彶妯℃嫙閫変腑鍖哄煙
+const props = defineProps({
+ selectedArea: {
+ type: Object,
+ required: true,
+ },
+});
+
const intensityOptions = ref([
{ value: "mm/h", label: "mm/h" },
{ value: "mm/5min", label: "mm/5min" },
@@ -193,6 +205,8 @@
fetchRegionData(1);
});
+const showBackground = ref(true); // 榛樿鏄剧ず鑳屾櫙鍥�
+
// 鐩戝惉 selectTab 鐨勫彉鍖�
watch(selectTab, (newVal) => {
let type;
@@ -203,10 +217,21 @@
case "閲嶇偣鍖哄煙浠跨湡":
type = 2;
break;
+ case "閲嶇偣娌熶豢鐪�":
+ type = 3;
+ break;
default:
type = 1; // 榛樿鍊�
}
+ // 鏍规嵁 type 璁剧疆鏄惁鏄剧ず鑳屾櫙鍥撅紙鍥犱负鍘嗗彶妯℃嫙涓〃鍗曞甫浜嗚儗鏅浘锛�
+ if (type == 3) {
+ showBackground.value = false;
+ } else {
+ showBackground.value = true;
+ }
fetchRegionData(type);
+ // Tab鍒囨崲鐨勬椂鍊欐竻绌鸿〃鍗�
+ resetForm();
});
// 娉ㄥ叆鐖剁粍浠舵彁渚涚殑鏂规硶
@@ -245,6 +270,9 @@
const addSimCheme = async () => {
try {
+ if (selectTab.value == "閲嶇偣娌熶豢鐪�") {
+ forms.geom = props.selectedArea;
+ }
await simStore.addSimCheme(forms);
resetForm(); // 鍙湁鍦ㄤ繚瀛樻垚鍔熷悗鎵嶉噸缃〃鍗�
EventBus.emit("close-selectArea");
@@ -471,6 +499,9 @@
async function startPlay() {
try {
// 淇濆瓨鏂规
+ if (selectTab.value == "閲嶇偣娌熶豢鐪�") {
+ forms.geom = props.selectedArea;
+ }
const res = await simStore.addSimCheme(forms);
const schemeId = res.data?.data?.id;
@@ -508,6 +539,12 @@
height: 100%;
padding: 10px 10px 0px 0px;
box-sizing: border-box;
+ transition: background 0.3s ease; // 鍙�夎繃娓℃晥鏋�
+}
+
+.forms.no-background {
+ margin-top: 0px;
+ background-image: none;
}
/deep/ .el-input-group__append,
.el-input-group__prepend {
diff --git a/src/views/left/KGSim.vue b/src/views/left/KGSim.vue
index 8a3618b..40380d5 100644
--- a/src/views/left/KGSim.vue
+++ b/src/views/left/KGSim.vue
@@ -36,7 +36,8 @@
<el-radio label="棰勬祴妯℃嫙">棰勬祴妯℃嫙</el-radio>
</el-radio-group>
<div v-if="selectedSimulation === '鍘嗗彶妯℃嫙'">
- <HistorySimulation :selectedArea="selectedArea" />
+ <!-- <HistorySimulation :selectedArea="selectedArea" /> -->
+ <CitySim :selectedArea="selectedArea" />
</div>
<div v-if="selectedSimulation === '瀹炴椂妯℃嫙'">
<RealTimeSimulation :selectedArea="selectedArea" />
@@ -51,6 +52,7 @@
<script setup>
import { ref, computed, onMounted, reactive } from "vue";
import HistorySimulation from "./KGSimOption/HistorySimulation.vue";
+import CitySim from './CitySim.vue'
import PredictiveSimulation from "./KGSimOption/PredictiveSimulation.vue";
import RealTimeSimulation from "./KGSimOption/RealTimeSimulation.vue";
import { getRegionData } from "@/api/trApi";
diff --git a/src/views/left/KGSimOption/HistorySimulation.vue b/src/views/left/KGSimOption/HistorySimulation.vue
index f7d9738..6e2286f 100644
--- a/src/views/left/KGSimOption/HistorySimulation.vue
+++ b/src/views/left/KGSimOption/HistorySimulation.vue
@@ -202,7 +202,6 @@
});
} catch (error) {
ElMessage.error("鍚姩妯℃嫙澶辫触锛岃绋嶅悗鍐嶈瘯");
- console.log(error, "errorerrorerror");
}
}
</script>
diff --git a/src/views/left/KGSimOption/PredictiveSimulation.vue b/src/views/left/KGSimOption/PredictiveSimulation.vue
index 90f6c5c..5c86b65 100644
--- a/src/views/left/KGSimOption/PredictiveSimulation.vue
+++ b/src/views/left/KGSimOption/PredictiveSimulation.vue
@@ -209,12 +209,12 @@
};
// 闄嶉洦鍦烘閫夋嫨
const rainFallChange = (val) => {
- console.log(val, "val");
+ // console.log(val, "val");
const decimalHours = (val.rainfallDuration.match(/(\d+)鏃�(\d+)鍒�/) || [])
.slice(1)
.reduce((acc, curr, i) => acc + parseInt(curr, 10) / (i === 0 ? 1 : 60), 0)
.toFixed(1);
- console.log(parseFloat(decimalHours)); // 杈撳嚭: 2.6
+ // console.log(parseFloat(decimalHours)); // 杈撳嚭: 2.6
forms.duration = decimalHours;
forms.intensity = val.rainIntensityHour;
forms.rainfall = val.rainfallTotalValue;
--
Gitblit v1.9.3