From de6fd089b37613808e5a3bef38ecc0761f7456e0 Mon Sep 17 00:00:00 2001 From: Riku <risaku@163.com> Date: 星期日, 02 三月 2025 22:07:47 +0800 Subject: [PATCH] AOD数据产品 --- src/views/satellitetelemetry/component/SatelliteMixTool.vue | 272 +++++++++++++++++++++++++---------------------------- 1 files changed, 129 insertions(+), 143 deletions(-) diff --git a/src/views/satellitetelemetry/component/SatelliteMixTool.vue b/src/views/satellitetelemetry/component/SatelliteMixTool.vue index 9f10545..81b5b7e 100644 --- a/src/views/satellitetelemetry/component/SatelliteMixTool.vue +++ b/src/views/satellitetelemetry/component/SatelliteMixTool.vue @@ -1,94 +1,104 @@ <template> - <CardDialog - v-model="dialogVisible" - title="璧拌埅铻嶅悎" - draggable - :modal="false" - width="400px" - > - <template #default> - <el-row> - <OptionMission v-model="mission"></OptionMission> - <el-text size="small" :type="fusionData ? 'success' : 'warning'">{{ - fusionData ? '璧拌埅鏁版嵁宸茶瀺鍚�' : '璧拌埅鏁版嵁鏈瀺鍚�' - }}</el-text> - </el-row> - <el-row> - <el-button - type="primary" - class="el-button-custom" - size="small" - :disabled="!gridCellList || !fusionData" - @click="handleFusionClick" - > - {{ '鍙犲姞铻嶅悎' }} - </el-button> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleGridClick" - > - {{ gridVisible ? '闅愯棌铻嶅悎' : '鏄剧ず铻嶅悎' }} - </el-button> - <el-button - type="primary" - class="el-button-custom" - size="small" - :loading="loading" - @click="handleUnderwayClick" - > - {{ underwayVisible ? '闅愯棌璧拌埅璺嚎' : '鏄剧ず璧拌埅璺嚎' }} - </el-button> - </el-row> - <el-row class="m-t-8"> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleRankClick" - > - {{ rankVisible ? '闅愯棌鎺掑悕' : '鏄剧ず鎺掑悕' }} - </el-button> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleDataClick" - > - {{ dataVisible ? '闅愯棌鏁版嵁' : '鏄剧ず鏁版嵁' }} - </el-button> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleColorClick" - > - {{ isStandardColor ? '缁樺埗瀵规瘮鑹�' : '缁樺埗鏍囧噯鑹�' }} - </el-button> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleOpacityClick" - > - {{ !isOpacity ? '閫忔槑鍖�' : '鍙栨秷閫忔槑鍖�' }} - </el-button> - </el-row> - </template> - <template #footer> - <el-row justify="start" align="middle" class="p-b-2 one-row"> - <!-- <el-text size="small" type="warning">鎼滅储鑼冨洿</el-text> --> - </el-row> - </template> - </CardDialog> + <div> + <el-button + @click="dialogVisible = !dialogVisible" + type="primary" + class="el-button-custom p-events-auto" + >璧拌埅铻嶅悎</el-button + > + <CardDialog + v-model="dialogVisible" + title="璧拌埅铻嶅悎" + draggable + :modal="false" + width="400px" + > + <template #default> + <el-row> + <OptionMission v-model="mission"></OptionMission> + <el-text size="small" :type="fusionData ? 'success' : 'warning'">{{ + fusionData ? '璧拌埅鏁版嵁宸茶瀺鍚�' : '璧拌埅鏁版嵁鏈瀺鍚�' + }}</el-text> + </el-row> + <el-row> + <el-button + type="primary" + class="el-button-custom" + size="small" + :disabled="!gridCellList || !fusionData" + @click="handleFusionClick" + > + {{ '鍙犲姞铻嶅悎' }} + </el-button> + <el-button + type="primary" + class="el-button-custom" + size="small" + @click="handleGridClick" + > + {{ gridVisible ? '闅愯棌铻嶅悎' : '鏄剧ず铻嶅悎' }} + </el-button> + <el-button + type="primary" + class="el-button-custom" + size="small" + :loading="loading" + @click="handleUnderwayClick" + > + {{ underwayVisible ? '闅愯棌璧拌埅璺嚎' : '鏄剧ず璧拌埅璺嚎' }} + </el-button> + </el-row> + <el-row class="m-t-8"> + <el-button + type="primary" + class="el-button-custom" + size="small" + @click="handleRankClick" + > + {{ rankVisible ? '闅愯棌鎺掑悕' : '鏄剧ず鎺掑悕' }} + </el-button> + <el-button + type="primary" + class="el-button-custom" + size="small" + @click="handleDataClick" + > + {{ dataVisible ? '闅愯棌鏁版嵁' : '鏄剧ず鏁版嵁' }} + </el-button> + <el-button + type="primary" + class="el-button-custom" + size="small" + @click="handleColorClick" + > + {{ isStandardColor ? '缁樺埗瀵规瘮鑹�' : '缁樺埗鏍囧噯鑹�' }} + </el-button> + <el-button + type="primary" + class="el-button-custom" + size="small" + @click="handleOpacityClick" + > + {{ !isOpacity ? '閫忔槑鍖�' : '鍙栨秷閫忔槑鍖�' }} + </el-button> + </el-row> + </template> + <template #footer> + <el-row justify="start" align="middle" class="p-b-2 one-row"> + <!-- <el-text size="small" type="warning">鎼滅储鑼冨洿</el-text> --> + </el-row> + </template> + </CardDialog> + </div> </template> <script setup> import { ref, onMounted, onUnmounted, watch } from 'vue'; import moment from 'moment'; import { map, onMapMounted } from '@/utils/map/index_old'; import gridApi from '@/api/gridApi'; -import SatelliteProxy from '../SatelliteProxy'; +import { SatelliteProxy } from '../SatelliteProxy'; + +const satelliteProxy = new SatelliteProxy(); const props = defineProps({ groupId: { @@ -97,7 +107,7 @@ } }); -const dialogVisible = ref(true); +const dialogVisible = ref(false); const mission = ref(undefined); const gridCellList = ref(undefined); @@ -111,9 +121,6 @@ const isStandardColor = ref(true); const isOpacity = ref(false); -// 鍦板浘缃戞牸鐩稿叧瀵硅薄 -let mapViews; - // 妫�鏌ヨ蛋鑸暟鎹槸鍚﹀拰100绫崇綉鏍煎凡铻嶅悎 function checkUnderwayFusionResult() { const time = moment(mission.value.startTime).format('YYYY-MM-DD HH:mm:ss'); @@ -126,42 +133,22 @@ }); } -function drawGrid(gridInfo) { - SatelliteProxy.clearAll(mapViews); - mapViews = SatelliteProxy.drawPolyline(gridInfo); +function resetButton() { + gridVisible.value = true; + underwayVisible.value = false; + rankVisible.value = false; + dataVisible.value = false; + isStandardColor.value = true; + isOpacity.value = false; +} + +function prepareGrid(gridInfo) { + satelliteProxy.gridPrepare(gridInfo); } // 缁樺埗缃戞牸閬ユ劅鏁版嵁鍊煎拰缃戞牸棰滆壊 -function drawTextAndColor(gridData) { - const { resGridViews, pointsRes } = SatelliteProxy.drawColor({ - gridViews: mapViews.gridViews, - points: mapViews.points, - gridDataDetail: gridData, - lastGridViews: mapViews.lastGridViews, - opacity: 1, - zIndex: 11 - }); - mapViews.lastGridViews = resGridViews; - mapViews.lastPoints = pointsRes; - // 鏂囨湰鏍囪 - const { textViews: dataTxt, labelsLayer: dataLayer } = - SatelliteProxy.drawDataText( - mapViews.lastPoints, - gridData, - mapViews.dataTxt, - mapViews.dataLayer - ); - mapViews.dataTxt = dataTxt; - mapViews.dataLayer = dataLayer; - const { textViews: rankTxt, labelsLayer: rankLayer } = - SatelliteProxy.drawRankText( - mapViews.lastPoints, - gridData, - mapViews.rankTxt, - mapViews.rankLayer - ); - mapViews.rankTxt = rankTxt; - mapViews.rankLayer = rankLayer; +function drawGrid(gridData) { + satelliteProxy.drawGrid({ gridData, opacity: 1, zIndex: 11 }); } watch(mission, (nV, oV) => { @@ -174,10 +161,10 @@ watch( () => props.groupId, (nV, oV) => { - if (nV != oV) { + if (dialogVisible.value && nV != oV) { gridApi.fetchGridCell(nV).then((res) => { gridCellList.value = res.data; - drawGrid(gridCellList.value); + prepareGrid(gridCellList.value); }); } }, @@ -186,29 +173,37 @@ } ); +watch(dialogVisible, (nV, oV) => { + if (nV != oV) { + gridApi.fetchGridCell(props.groupId).then((res) => { + gridCellList.value = res.data; + prepareGrid(gridCellList.value); + }); + } +}); + let selectedGridData; // 鍙犲姞铻嶅悎 function handleFusionClick() { + // resetButton(); const d = fusionData.value; if (gridDataDetailMap.has(d.id)) { const gridData = gridDataDetailMap.get(d.id); selectedGridData = gridData; - drawTextAndColor(gridData); + drawGrid(gridData); } else { gridApi.fetchGridDataDetail(d.id, d.groupId).then((res) => { gridDataDetailMap.set(d.id, res.data); const gridData = res.data; selectedGridData = gridData; - drawTextAndColor(gridData); + drawGrid(gridData); }); } } function handleGridClick() { gridVisible.value = !gridVisible.value; - gridVisible.value - ? map.add(mapViews.lastGridViews) - : map.remove(mapViews.lastGridViews); + satelliteProxy.changeVisibility({ showGridViews: gridVisible.value }); } function handleUnderwayClick() { @@ -218,36 +213,27 @@ function handleRankClick() { rankVisible.value = !rankVisible.value; - rankVisible.value ? map.add(mapViews.rankTxt) : map.remove(mapViews.rankTxt); + satelliteProxy.changeVisibility({ showRankTxt: rankVisible.value }); } function handleDataClick() { dataVisible.value = !dataVisible.value; - dataVisible.value ? map.add(mapViews.dataTxt) : map.remove(mapViews.dataTxt); + satelliteProxy.changeVisibility({ showDataTxt: dataVisible.value }); } function handleColorClick() { isStandardColor.value = !isStandardColor.value; - const { resGridViews, pointsRes } = SatelliteProxy.drawColor({ - gridViews: mapViews.gridViews, - points: mapViews.points, - gridDataDetail: selectedGridData, - lastGridViews: mapViews.lastGridViews, - customColor: !isStandardColor.value, + satelliteProxy.drawGrid({ + gridData: selectedGridData, + useCustomColor: !isStandardColor.value, opacity: 1, zIndex: 11 }); - mapViews.lastGridViews = resGridViews; - mapViews.lastPoints = pointsRes; } function handleOpacityClick() { isOpacity.value = !isOpacity.value; - mapViews.lastGridViews.forEach((e) => { - e.setOptions({ - fillOpacity: isOpacity.value ? 0.1 : 1 - }); - }); + satelliteProxy.changeGridOpacity({ opacityValue: isOpacity.value ? 0.1 : 1 }); } /**璧拌埅杞ㄨ抗*******************************************************************/ -- Gitblit v1.9.3