From 3970cefa60ea7e5d899b7475345b65646c19c110 Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期四, 20 三月 2025 15:17:05 +0800 Subject: [PATCH] 走航融合(待完成) --- src/views/underwaymix/UnderwayMixMode.vue | 335 +++++++++++++++++++++++++++---------------------------- 1 files changed, 167 insertions(+), 168 deletions(-) diff --git a/src/views/underwaymix/UnderwayMixMode.vue b/src/views/underwaymix/UnderwayMixMode.vue index 7ed2e43..3d690d3 100644 --- a/src/views/underwaymix/UnderwayMixMode.vue +++ b/src/views/underwaymix/UnderwayMixMode.vue @@ -1,158 +1,146 @@ <template> - <div class="p-events-none m-t-2"> - <el-row justify="space-between"> - <el-row class="wrap"> - <el-col span="2"> - <el-row> - <BaseCard v-show="show" size="medium" direction="left"> - <template #content> - <el-row> - <el-form :inline="true"> - <el-form-item label="璧拌埅铻嶅悎"> - <el-select - v-model="selectedfusionData" - multiple - clearable - @change="handleChange" - placeholder="閫夋嫨浠诲姟" - size="small" - style="width: 160px" - :loading="fusionLoading" - > - <el-option - v-for="(s, i) in fusionDataList" - :key="i" - :label="s.mixDataId" - :value="i" - /> - </el-select> - </el-form-item> - <el-form-item> - <el-button - type="primary" - class="el-button-custom" - size="small" - :disabled=" - !gridCellList || selectedfusionData.length == 0 - " - @click="handleFusionClick" - > - {{ '鍙犲姞铻嶅悎' }} - </el-button> - </el-form-item> - </el-form> - </el-row> - <div class="m-t-8">鎿嶄綔</div> - <el-row class="m-t-8"> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleRankClick" - > - {{ mixActive ? '鍙栨秷' : '鏄剧ず鎺掑悕' }} - </el-button> - <CheckButton - active-text="鍙栨秷铻嶅悎" - inactive-text="闅愯棌铻嶅悎" - :default-value="false" - @change="handleMixClick" - > - </CheckButton> - </el-row> - <div class="m-t-8">缃戞牸瑕佺礌</div> - <el-row class="m-t-8"> - <CheckButton - active-text="鏄剧ず缃戞牸" - inactive-text="闅愯棌缃戞牸" - :default-value="true" - @change="handleGridClick" - > - </CheckButton> - <!-- <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" - @click="handleRankClick" - > - {{ rankVisible ? '闅愯棌鎺掑悕' : '鏄剧ず鎺掑悕' }} - </el-button> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleDataClick" - > - {{ dataVisible ? '闅愯棌鏁版嵁' : '鏄剧ず鏁版嵁' }} - </el-button> - </el-row> - <div class="m-t-8">缃戞牸鏍峰紡</div> - <el-row class="m-t-8"> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleOpacityClick" - > - {{ !isOpacity ? '閫忔槑鍖�' : '鍙栨秷閫忔槑鍖�' }} - </el-button> - <el-button - type="primary" - class="el-button-custom" - size="small" - @click="handleColorClick" - > - {{ isStandardColor ? '缁樺埗瀵规瘮鑹�' : '缁樺埗鏍囧噯鑹�' }} - </el-button> - </el-row> - <div class="m-t-8">璧拌埅瑕佺礌</div> - <el-row class="m-t-8"> - <!-- <el-divider content-position="left"></el-divider> --> + <!-- <div class="p-events-none m-t-2"> --> + <el-row justify="space-between"> + <el-row class="wrap"> + <el-col span="2"> + <el-row> + <BaseCard v-show="show" size="medium" direction="left"> + <template #content> + <el-row> + <el-form :inline="true"> + <el-form-item label="璧拌埅铻嶅悎"> + <el-select + v-model="selectedfusionData" + multiple + clearable + @change="handleChange" + placeholder="閫夋嫨浠诲姟" + size="small" + style="width: 160px" + :loading="fusionLoading" + > + <el-option + v-for="(s, i) in fusionDataList" + :key="i" + :label="s.mixDataId" + :value="i" + /> + </el-select> + </el-form-item> + <el-form-item> + <el-button + type="primary" + class="el-button-custom" + size="small" + :disabled=" + !gridCellList || selectedfusionData.length == 0 + " + @click="handleFusionClick" + > + {{ '鍙犲姞铻嶅悎' }} + </el-button> + </el-form-item> + </el-form> + </el-row> + <div class="m-t-8">鎿嶄綔</div> + <el-row class="m-t-8"> + <CheckButton + active-text="寮�鍚瀺鍚�" + inactive-text="闅愯棌铻嶅悎" + :default-value="false" + @change="handleMixClick" + > + </CheckButton> + </el-row> + <div class="m-t-8">缃戞牸瑕佺礌</div> + <el-row class="m-t-8"> + <CheckButton + active-text="鏄剧ず缃戞牸" + inactive-text="闅愯棌缃戞牸" + :default-value="true" + @change="handleGridClick" + > + </CheckButton> + <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-row> + <div class="m-t-8">缃戞牸鏍峰紡</div> + <el-row class="m-t-8"> + <el-button + type="primary" + class="el-button-custom" + size="small" + @click="handleOpacityClick" + > + {{ !isOpacity ? '閫忔槑鍖�' : '鍙栨秷閫忔槑鍖�' }} + </el-button> + <el-button + type="primary" + class="el-button-custom" + size="small" + @click="handleColorClick" + > + {{ isStandardColor ? '缁樺埗瀵规瘮鑹�' : '缁樺埗鏍囧噯鑹�' }} + </el-button> + </el-row> + <div class="m-t-8">璧拌埅瑕佺礌</div> + <el-row class="m-t-8"> + <!-- <el-divider content-position="left"></el-divider> --> - <el-button - type="primary" - class="el-button-custom" - size="small" - :loading="missionLoading || loading" - @click="handleUnderwayClick" - > - {{ underwayVisible ? '闅愯棌璧拌埅璺嚎' : '鏄剧ず璧拌埅璺嚎' }} - </el-button> - </el-row> - </template> - <template #footer> </template> - </BaseCard> - </el-row> - </el-col> - <el-col span="2"> - <el-row> - <CardButton - name="璧拌埅铻嶅悎" - direction="right" - @click="() => (show = !show)" - ></CardButton> - </el-row> - </el-col> - </el-row> + <el-button + type="primary" + class="el-button-custom" + size="small" + :loading="missionLoading || loading" + @click="handleUnderwayClick" + > + {{ underwayVisible ? '闅愯棌璧拌埅璺嚎' : '鏄剧ず璧拌埅璺嚎' }} + </el-button> + </el-row> + </template> + <template #footer> </template> + </BaseCard> + </el-row> + </el-col> + <el-col span="2"> + <el-row> + <CardButton + name="璧拌埅铻嶅悎" + direction="right" + @click="() => (show = !show)" + ></CardButton> + </el-row> + </el-col> </el-row> - </div> + <GridStyleTool :gridCtrls="gridCtrls"></GridStyleTool> + </el-row> + <!-- </div> --> </template> <script setup> -import { ref, onMounted, onUnmounted, watch } from 'vue'; +import { ref, onMounted, onUnmounted, watch, computed } from 'vue'; import moment from 'moment'; import gridApi from '@/api/gridApi'; import { SatelliteGrid } from '@/model/SatelliteGrid'; +import GridStyleTool from './component/GridStyleTool.vue'; -const satelliteGrid = new SatelliteGrid(); +const satelliteGrid = new SatelliteGrid('璧拌埅铻嶅悎'); + +const gridCtrls = ref([satelliteGrid]); // 鍊熺敤鍗槦閬ユ祴妯″潡涓殑100绫崇綉鏍� const props = defineProps({ @@ -174,6 +162,7 @@ const gridDataDetailMap = new Map(); +const mixActive = ref(false); const gridVisible = ref(true); const underwayVisible = ref(false); const rankVisible = ref(false); @@ -220,11 +209,6 @@ satelliteGrid.gridPrepare(gridInfo); } -// 缁樺埗缃戞牸閬ユ劅鏁版嵁鍊煎拰缃戞牸棰滆壊 -function drawGrid(gridDataDetail) { - satelliteGrid.drawGrid({ gridDataDetail, opacity: 1, zIndex: 11 }); -} - // watch(mission, (nV, oV) => { // if (nV != oV) { // checkUnderwayFusionResult(); @@ -254,37 +238,54 @@ selectedfusionData.value.forEach((i) => { const d = fusionDataList.value[i]; if (gridDataDetailMap.has(d.id)) { - // const gdd = gridDataDetailMap.get(d.id); - // satelliteGrid.drawTagGrid({ - // tag: d.id, - // gridDataDetail: gdd, - // opacity: 1, - // zIndex: 11 - // }); - satelliteGrid.changeVisibility({ tag: d.id, showGridViews: true }); + satelliteGrid.changeVisibility({ tags: [d.id], showGridViews: true }); + // gridCtrls.value = Array.from(satelliteGrid.mapViewsMap); + gridCtrls.value = [satelliteGrid]; } else { gridApi.fetchGridDataDetail(d.id, d.groupId).then((res) => { gridDataDetailMap.set(d.id, res.data); const gdd = res.data; satelliteGrid.drawTagGrid({ tag: d.id, - gridDataDetail: gdd, - opacity: 1, - zIndex: 11 + data: gdd, + extData: { + name: `璧拌埅缃戞牸 - ${d.mixDataId}` + } }); + gridCtrls.value = [satelliteGrid]; + // gridCtrls.value = Array.from(satelliteGrid.mapViewsMap); + // console.log(gridCtrls.value); }); } }); } -function handleMixClick(params) {} +function handleMixClick() { + mixActive.value = !mixActive.value; + const tags = fusionDataList.value + .filter((v, i) => selectedfusionData.value.indexOf(i) != -1) + .map((v) => v.id); + satelliteGrid.changeVisibility({ + showGridViews: false, + showDataTxt: false, + showRankTxt: false + }); + if (mixActive.value) { + satelliteGrid.mixGrid(tags); + } else { + satelliteGrid.changeVisibility({ + tags, + showGridViews: true + }); + } +} function handleGridClick() { gridVisible.value = !gridVisible.value; selectedfusionData.value.forEach((i) => { const d = fusionDataList.value[i]; satelliteGrid.changeVisibility({ - tag: d.id, + tags: [d.id], showGridViews: gridVisible.value }); }); @@ -300,7 +301,7 @@ selectedfusionData.value.forEach((i) => { const d = fusionDataList.value[i]; satelliteGrid.changeVisibility({ - tag: d.id, + tags: [d.id], showRankTxt: rankVisible.value }); }); @@ -311,7 +312,7 @@ selectedfusionData.value.forEach((i) => { const d = fusionDataList.value[i]; satelliteGrid.changeVisibility({ - tag: d.id, + tags: [d.id], showDataTxt: dataVisible.value }); }); @@ -322,10 +323,8 @@ selectedfusionData.value.forEach((i) => { const d = fusionDataList.value[i]; if (gridDataDetailMap.has(d.id)) { - const gdd = gridDataDetailMap.get(d.id); - satelliteGrid.drawTagGrid({ + satelliteGrid.changeGridColor({ tag: d.id, - gridDataDetail: gdd, useCustomColor: !isStandardColor.value, opacity: 1, zIndex: 11 -- Gitblit v1.9.3