From 306ef09707d6bcf9ffa67de55f86ab6f4362deee Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期五, 18 七月 2025 10:04:01 +0800 Subject: [PATCH] 2025.7.18 动态溯源-测试版本 --- src/views/historymode/HistoryMode.vue | 94 ++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 84 insertions(+), 10 deletions(-) diff --git a/src/views/historymode/HistoryMode.vue b/src/views/historymode/HistoryMode.vue index d2a780e..452fc0d 100644 --- a/src/views/historymode/HistoryMode.vue +++ b/src/views/historymode/HistoryMode.vue @@ -4,10 +4,17 @@ <SearchBar v-show="status == 0" :search-time="searchTime" - :loading="loading" + :loading="loading || thirdPartyLoading" @search="onSearch" ></SearchBar> <TrajectoryState v-show="status != 0" :status="status"></TrajectoryState> + <!-- <el-button + type="primary" + class="p-events-auto el-button-custom" + @click="handleClick" + > + 鍒嗘瀽 + </el-button> --> </el-row> <el-row class="m-t-2"> <FactorRadio @@ -45,6 +52,13 @@ :device-type="deviceType" :device-code="deviceCode" ></DataSheet> + <SourceTrace + class="source-trace" + v-model:factorType="factorType" + direction="left" + mode="history" + :mission-code="missionCode" + ></SourceTrace> </div> </template> @@ -62,13 +76,16 @@ import { FactorDatas } from '@/model/FactorDatas'; import TrendAnalysis from './component/TrendAnalysis.vue'; import DataSheet from './component/DataSheet.vue'; +import SourceTrace from '@/views/sourcetrace/SourceTrace.vue'; import { ElMessage } from 'element-plus'; import { fetchHistoryData } from '@/utils/factor/data'; +import dataAnalysisApi from '@/api/dataAnalysisApi'; +import thirdPartyDataApi from '@/api/thirdPartyDataApi'; import { mapStores } from 'pinia'; import { useSceneStore } from '@/stores/scene'; export default { - components: { TrendAnalysis, DataSheet }, + components: { TrendAnalysis, DataSheet, SourceTrace }, setup() { // 闄愬畾鍒嗛〉鏁版嵁閲忎负10000 const { loading, fetchData } = useFetchData(10000); @@ -76,14 +93,17 @@ }, data() { return { + missionCode: undefined, // 鐩戞祴璁惧绫诲瀷 deviceType: TYPE0, // 鐩戞祴璁惧缂栧彿 deviceCode: '', // 鐩戞祴鍥犲瓙鐨勭被鍨嬬紪鍙� - factorType: defaultOptions(TYPE0), + factorType: defaultOptions(TYPE0).value, // 鐩戞祴鏁版嵁 factorDatas: new FactorDatas(), + // 姹℃煋婧簮缁撴灉 + pollutionData: undefined, // 鍐冲畾缁樺埗3D鍥惧舰鏃舵槸鍚︿笌鍘熷浘鍍忓悎骞� merge: false, // 鍐冲畾缁樺埗瀹�3D鍥惧舰鍚庡湴鍥捐瑙掓槸鍚﹁嚜鍔ㄥ洖涓� @@ -96,13 +116,18 @@ // 杞ㄨ抗鍔ㄧ敾鐘舵�� status: 0, // 鏄惁椤甸潰宸茶烦杞� - isUnmounted: false + isUnmounted: false, + // 绗笁鏂规暟鎹幏鍙栨槸鍚﹀皾璇� + isFetchThirdParty: false, + thirdPartyLoading: false }; }, watch: { factorType(nValue, oValue) { if (nValue != oValue && this.status == 0) { - this.draw(); + Layer.clear(); + this.draw(true); + // this.drawHighlightPollution(); } } }, @@ -144,13 +169,17 @@ done(); this.draw(); }, - draw() { + draw(notSetBound) { // 鍒锋柊鍥句緥 const factor = this.factorDatas.factor[this.factorType]; sector.clearSector(); // this.drawRoadLine(factor); this.drawRoadMap(factor); this.drawMassMarks(factor); + // 璋冩暣鍦板浘瑙嗚 + if (!notSetBound) { + mapUtil.setBound(this.factorDatas.lnglats_GD); + } }, // 缁樺埗3D璧拌璺嚎鍥� drawRoadMap(e) { @@ -165,8 +194,6 @@ marks.drawMassMarks(this.factorDatas, e, (index) => { this.handelIndexChange(index); }); - // 璋冩暣鍦板浘瑙嗚 - mapUtil.setBound(this.factorDatas.lnglats_GD); }, drawSector(index) { // 1. 缁樺埗鏂版墖褰㈠尯鍩� @@ -186,19 +213,30 @@ } ); }, + drawHighlightPollution() { + this.pollutionData.forEach((e) => { + if (this.factorType == e.factorId + '') { + const fDatas = this.factorDatas.getByDate(e.startDate, e.endDate); + Layer.drawHighLight3DLayer(fDatas, fDatas.factor[this.factorType]); + } + }); + }, onFetchData(deviceType, data) { if (this.isUnmounted) return; // todo 鏍规嵁璁惧绫诲瀷鍒囨崲鍦板浘鐩戞祴鍥犲瓙灞曠ず鍗曢�夋銆佹姌绾垮浘澶嶉�夋銆佹暟鎹〃鏍煎閫夋鐨勫洜瀛愮被鍨� this.deviceType = deviceType; this.factorDatas.setData(data, this.drawMode, () => { this.factorDatas.refreshHeight(this.factorType); + Layer.clear(); this.draw(); }); }, onSearch(option) { - const { deviceType, deviceCode, timeArray } = option; + const { deviceType, deviceCode, timeArray, mission } = option; this.deviceType = deviceType; this.deviceCode = deviceCode; + this.mission = mission; + this.missionCode = mission.missionCode; let startTime, endTime; if (timeArray && timeArray.length == 2) { startTime = moment(timeArray[0]).format('YYYY-MM-DD HH:mm:ss'); @@ -212,7 +250,38 @@ endTime, page, perPage: pageSize - }).then((res) => this.onFetchData(deviceType, res.data)); + }).then((res) => { + this.onFetchData(deviceType, res.data); + if ( + res.data.length == 0 && + this.isFetchThirdParty != mission.missionCode + ) { + this.onThirdPartyFetch(option); + } + }); + }); + }, + onThirdPartyFetch(option) { + const { mission } = option; + if (import.meta.env.VITE_DATA_MODE == 'jingan') { + this.thirdPartyLoading = true; + this.isFetchThirdParty = mission.missionCode; + // 閫氱煡鏈嶅姟绔惎鍔ㄤ换鍔¤寖鍥村唴鐨勭涓夋柟鏁版嵁鑾峰彇浠诲姟 + thirdPartyDataApi + .fetchMissionData(mission.missionCode) + .then((res) => { + if (res.data) { + this.onSearch(option); + } + }) + .finally(() => (this.thirdPartyLoading = false)); + } + }, + handleClick() { + const { missionCode } = this.mission; + dataAnalysisApi.pollutionTrace(missionCode).then((res) => { + this.pollutionData = res.data; + this.drawHighlightPollution(); }); } }, @@ -248,4 +317,9 @@ left: 0; right: 0; } +.source-trace { + position: absolute; + right: 0; + bottom: 0px; +} </style> -- Gitblit v1.9.3