riku
2025-03-20 3970cefa60ea7e5d899b7475345b65646c19c110
src/views/underwaymix/UnderwayMixMode.vue
@@ -1,5 +1,5 @@
<template>
  <div class="p-events-none m-t-2">
  <!-- <div class="p-events-none m-t-2"> -->
    <el-row justify="space-between">
      <el-row class="wrap">
        <el-col span="2">
@@ -44,16 +44,8 @@
                </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="取消融合"
                  active-text="开启融合"
                    inactive-text="隐藏融合"
                    :default-value="false"
                    @change="handleMixClick"
@@ -69,14 +61,6 @@
                    @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"
@@ -142,17 +126,21 @@
          </el-row>
        </el-col>
      </el-row>
    <GridStyleTool :gridCtrls="gridCtrls"></GridStyleTool>
    </el-row>
  </div>
  <!-- </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