From aa75a9d46ee325f0a92e42f733aabb1f92103aeb Mon Sep 17 00:00:00 2001
From: feiyu02 <risaku@163.com>
Date: 星期五, 28 三月 2025 17:44:29 +0800
Subject: [PATCH] 走航融合模块完成

---
 src/views/underwaymix/component/GridStyleTool.vue |  147 +++++++++++++++++++++++++++++++++++++++++-------
 1 files changed, 124 insertions(+), 23 deletions(-)

diff --git a/src/views/underwaymix/component/GridStyleTool.vue b/src/views/underwaymix/component/GridStyleTool.vue
index e21302d..7429e04 100644
--- a/src/views/underwaymix/component/GridStyleTool.vue
+++ b/src/views/underwaymix/component/GridStyleTool.vue
@@ -14,22 +14,49 @@
         <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">
-                <span v-if="value.extData.type == 0">{{ value.tag + '.' }}</span>
-                {{ 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
+                    size="small"
+                    @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> -->
                 <el-row class="m-t-8" justify="space-between">
+                  <!-- <el-button
+                    type="primary"
+                    class="el-button-custom"
+                    size="small"
+                    @click="gridLoading = !gridLoading"
+                  >
+                    {{ '铻嶅悎鍒嗘瀽' }}
+                  </el-button> -->
                   <CheckButton
+                    :loading="gridLoading"
+                    v-model="value.show"
                     active-text="鏄剧ず缃戞牸"
                     inactive-text="闅愯棌缃戞牸"
-                    :default-value="true"
                     @change="(e) => handleGridClick(e, i, value)"
                   >
                   </CheckButton>
                   <CheckButton
+                    :loading="rankLoading"
+                    v-model="value.showRank"
                     active-text="鏄剧ず鎺掑悕"
                     inactive-text="闅愯棌鎺掑悕"
                     :default-value="false"
@@ -37,6 +64,8 @@
                   >
                   </CheckButton>
                   <CheckButton
+                    :loading="dataLoading"
+                    v-model="value.showData"
                     active-text="鏄剧ず鏁版嵁"
                     inactive-text="闅愯棌鏁版嵁"
                     :default-value="false"
@@ -46,6 +75,8 @@
                 </el-row>
                 <el-row class="m-t-8" justify="space-between">
                   <CheckButton
+                    :loading="colorLoading"
+                    v-model="value.showCustomColor"
                     active-text="缁樺埗瀵规瘮鑹�"
                     inactive-text="缁樺埗鏍囧噯鑹�"
                     :default-value="false"
@@ -53,7 +84,18 @@
                   >
                   </CheckButton>
                   <CheckButton
+                    :loading="heatMapLoading"
+                    v-model="value.showHeatMap"
+                    active-text="椋庨櫓鐑姏鍥�"
+                    inactive-text="椋庨櫓鐑姏鍥�"
+                    :default-value="false"
+                    @change="(e) => handleHeatMapClick(e, i, value)"
+                  >
+                  </CheckButton>
+                  <CheckButton
+                    :loading="underwayLoading"
                     v-if="value.extData.type == 0"
+                    v-model="value.showUnderway"
                     active-text="鏄剧ず璧拌埅杞ㄨ抗"
                     inactive-text="闅愯棌璧拌埅杞ㄨ抗"
                     :default-value="false"
@@ -61,7 +103,9 @@
                   >
                   </CheckButton>
                   <CheckButton
+                    :loading="highlightLoading"
                     v-if="value.extData.type == 1"
+                    v-model="value.highlightFusionGrid"
                     active-text="楂樹寒铻嶅悎缃戞牸"
                     :default-value="true"
                     @change="(e) => handleHighlightGridClick(e, i, value)"
@@ -105,6 +149,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]鏁扮粍
@@ -114,7 +162,15 @@
   }
 });
 
-const emits = defineEmits(['showUnderway']);
+const gridLoading = ref(false);
+const rankLoading = ref(false);
+const dataLoading = ref(false);
+const colorLoading = ref(false);
+const heatMapLoading = ref(false);
+const underwayLoading = ref(false);
+const highlightLoading = ref(false);
+
+const emits = defineEmits(['showUnderway', 'onDelete']);
 
 const gridCtrlList = computed(() => {
   return props.gridCtrls.map((g) => {
@@ -124,6 +180,7 @@
         return {
           tag: v[0],
           extData: v[1].extData,
+          show: v[1].show,
           opacityValue: 1
         };
       })
@@ -133,55 +190,54 @@
 
 const show = ref(true);
 
-// const gridVisible = ref(false);
-// const rankVisible = ref(false);
-// const dataVisible = ref(false);
-// const isStandardColor = ref(true);
-// const isOpacity = ref(false);
-// const opacityValue = ref(0.7);
-
-// const emits = defineEmits([
-//   'showRank',
-//   'showData',
-//   '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) {
+  gridLoading.value = true;
   const key = value.tag;
   toRaw(props.gridCtrls[index]).changeVisibility({
     tags: [key],
     showGridViews: e
   });
+  gridLoading.value = false;
 }
 
 function handleRankClick(e, index, value) {
+  rankLoading.value = true;
   const key = value.tag;
   toRaw(props.gridCtrls[index]).changeVisibility({
     tags: [key],
     showRankTxt: e
   });
+  rankLoading.value = false;
 }
 
 function handleDataClick(e, index, value) {
+  dataLoading.value = true;
   const key = value.tag;
   toRaw(props.gridCtrls[index]).changeVisibility({
     tags: [key],
     showDataTxt: e
   });
+  dataLoading.value = false;
 }
 
 function handleColorClick(e, index, value) {
+  colorLoading.value = true;
   const key = value.tag;
   toRaw(props.gridCtrls[index]).changeGridColor({
-    tag: key,
+    tags: [key],
     useCustomColor: e
   });
+  colorLoading.value = false;
 }
 
 function handleOpacityChange(e, index, value) {
-  console.log(e, index, value);
-
   const key = value.tag;
   // value.opacityValue = e;
   toRaw(props.gridCtrls[index]).changeGridOpacity({
@@ -191,14 +247,59 @@
 }
 
 function handleUnderwayClick(e, index, value) {
+  underwayLoading.value = true;
   emits('showUnderway', {
     isShow: e,
-    dataId: value.tag
+    dataId: value.tag,
+    done: () => (underwayLoading.value = false)
   });
 }
 
 function handleHighlightGridClick(e, index, value) {
-  toRaw(props.gridCtrls[index]).mixGrid(value.tag.split('-'), e);
+  highlightLoading.value = true;
+  toRaw(props.gridCtrls[index]).mixGrid({
+    tags: value.tag.split('-'),
+    isMixGridHighlight: e
+  });
+  highlightLoading.value = false;
+}
+
+let heatTag;
+const heatMapSearchLength = 4;
+function handleHeatMapClick(e, index, value) {
+  heatMapLoading.value = true;
+  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(_satelliteGrid.gridGroupId, data, heatMapSearchLength)
+      .then((res) => {
+        heatTag = _satelliteGrid.drawHeatGrid2(value.tag, res.data);
+        _satelliteGrid.setDefaultGridClickEvent([heatTag]);
+        // _satelliteGrid.setGridEvent(
+        //   [heatTag],
+        //   'click',
+        //   (gridCell, gridDataDetail) => {
+        //     gridStore.selectedGridCellAndDataDetail = {
+        //       gridCell,
+        //       gridDataDetail
+        //     };
+        //   }
+        // );
+      })
+      .finally(() => (heatMapLoading.value = false));
+  } else {
+    _satelliteGrid.changeVisibility({
+      tags: [value.tag],
+      showGridViews: true
+    });
+    heatMapLoading.value = false;
+  }
 }
 </script>
 <style scoped>

--
Gitblit v1.9.3