修复走航融合功能bug

Riku

2025-03-27 c7a16ca1b6fbcb0b82a4a09c2e75014624082e37

 src/views/underwaymix/component/GridStyleTool.vue

@@ -14,10 +14,25 @@
        <template #content>
          <el-scrollbar class="content-wrap">
            <div v-for="(g, i) in gridCtrlList" :key="i">
              {{ g.name }}
              <span>{{ g.name }}</span>
              <div v-for="(value, t) in g.views" :key="t">
                <!-- {{ value[0] }} -->
                {{ value.extData.name }}
                <el-row justify="space-between" align="middle">
                  <div>
                    <span v-if="value.extData.type == 0">{{
                      value.tag + '.'
                    }}</span>
                    {{ value.extData.name }}
                  </div>
                  <el-button
                    class="el-button-custom"
                    type="primary"
                    icon="Close"
                    circle
                    @click="handleCloseClick(i, t, value)"
                  />
                  <!-- <el-icon><Close /></el-icon> -->
                </el-row>

                <!-- {{ key }} -->
                <!-- <el-text>{{ g.name }}</el-text> -->
                <!-- <div class="m-t-8">网格要素</div> -->
@@ -53,10 +68,25 @@
                  >
                  </CheckButton>
                  <CheckButton
                    active-text="风险热力图"
                    inactive-text="风险热力图"
                    :default-value="false"
                    @change="(e) => handleHeatMapClick(e, i, value)"
                  >
                  </CheckButton>
                  <CheckButton
                    v-if="value.extData.type == 0"
                    active-text="显示走航轨迹"
                    inactive-text="隐藏走航轨迹"
                    :default-value="false"
                    @change="(e) => handleUnderwayClick(e, i, value)"
                  >
                  </CheckButton>
                  <CheckButton
                    v-if="value.extData.type == 1"
                    active-text="高亮融合网格"
                    :default-value="true"
                    @change="(e) => handleHighlightGridClick(e, i, value)"
                  >
                  </CheckButton>
                </el-row>
@@ -97,6 +127,10 @@
 * 网格样式控制工具
 */
import { ref, reactive, onMounted, onUnmounted, computed, toRaw } from 'vue';
import gridApi from '@/api/gridApi';
import { useGridStore } from '@/stores/grid-info';

const gridStore = useGridStore();

const props = defineProps({
  // 网格管理对象[SatelliteGrid]数组
@@ -106,7 +140,7 @@
  }
});

const emits = defineEmits(['showUnderway']);
const emits = defineEmits(['showUnderway', 'onDelete']);

const gridCtrlList = computed(() => {
  return props.gridCtrls.map((g) => {
@@ -138,6 +172,12 @@
//   'changeColor',
//   'changeOpacity'
// ]);
function handleCloseClick(index, t, value) {
  const key = value.tag;
  toRaw(props.gridCtrls[index]).deleteTagGrid([key]);
  gridCtrlList.value[index].views.splice(t, 1)
  emits('onDelete', index, key)
}

function handleGridClick(e, index, value) {
  const key = value.tag;
@@ -188,11 +228,49 @@
    dataId: value.tag
  });
}

function handleHighlightGridClick(e, index, value) {
  toRaw(props.gridCtrls[index]).mixGrid(value.tag.split('-'), e);
}

let heatTag;
function handleHeatMapClick(e, index, value) {
  const _satelliteGrid = toRaw(props.gridCtrls[index]);
  _satelliteGrid.changeVisibility({
    showGridViews: false,
    showDataTxt: false,
    showRankTxt: false
  });
  if (e) {
    const data = _satelliteGrid.gridDataDetailMap.get(value.tag);
    gridApi.buildUnderwayHeatmap(3, data).then((res) => {
      heatTag = _satelliteGrid.drawHeatGrid2(value.tag, res.data);
      _satelliteGrid.setGridEvent(
        [heatTag],
        'click',
        (gridCell, gridDataDetail) => {
          gridStore.selectedGridCellAndDataDetail = {
            gridCell,
            gridDataDetail
          };
        }
      );
    });
  } else {
    _satelliteGrid.changeVisibility({
      tags: [value.tag],
      showGridViews: true
    });
  }
}
</script>
<style scoped>
.content-wrap {
  min-width: 300px;
  min-height: 600px;
  max-height: 80vh;
  height: 80vh;
  padding: 4px 16px;
}

:deep(.el-input-number) {