添加模拟监听

src/component/rain-earthquake/detail-panels/RainfallGridComponent.vue

@@ -6,6 +6,7 @@
 <script lang="ts" setup>
   import { $api } from '@/api/api';
   import { useRainstormDeduction } from '@/hooks/rainstorm/useRainstormDeduction';
+  import { useSimulationIdStore } from '@/stores/useSimulationIdStore';
   import { useStatusStore } from '@/stores/useStatusStore';
   import { useStepStore } from '@/stores/useStepStore';
   import type { ApiResponse } from '@/types/ApiResponse';
@@ -19,6 +20,7 @@
   const { triggerLayerShowStatus, addGridLayer } = useRainstormDeduction();
   const statusStore = useStatusStore();
   const stepStore = useStepStore();
+  const simulationIdStore = useSimulationIdStore();
 
   // 请求降雨栅格数据
   const requestRainfallData = () => {
@@ -59,12 +61,13 @@
               .then((res) => {
                 // 进行预警
                 CesiumUtilsSingleton.addPulseEffect(res.data.list);
+                // 设置事件id
+                simulationIdStore.setId(res.data.record_id);
 
                 // 推进到下一步
                 stepStore.nextStep();
 
                 // 产出报告
-
                 console.log(res);
               });
           } else {

src/hooks/rain-earthquake/useRightHandle.ts

@@ -4,12 +4,15 @@ import config from '@/config/config.json';
 import { useLeftLegendStore } from '@/stores/useLeftLegendStore';
 import { useScene } from '../useScene';
 import { useRainstormDeduction } from '../rainstorm/useRainstormDeduction';
+import { useSimulationIdStore } from '@/stores/useSimulationIdStore';
 
 export const useRightHandle = () => {
   const statusStore = useStatusStore();
   const leftLegendStore = useLeftLegendStore();
   const scene = useScene();
   const rainstormDeduction = useRainstormDeduction();
+  const simulationIdStore = useSimulationIdStore();
+
   /**
    * 暴雨模拟
    * @param status - 状态
@@ -28,6 +31,9 @@ export const useRightHandle = () => {
 
       // 如果有脉冲，显示脉冲
       CesiumUtilsSingleton.showPulseEffects();
+
+      // 模拟id状态为true
+      simulationIdStore.status = true;
     } else {
       // 关闭暴雨模拟：隐藏降雨栅格图层
       statusStore.weatherLayers.showRainfallGrid.show = false;
@@ -40,6 +46,9 @@ export const useRightHandle = () => {
 
       // 隐藏脉冲
       CesiumUtilsSingleton.hidePulseEffects();
+
+      // 模拟id状态为false
+      simulationIdStore.status = false;
     }
   };
 

src/stores/useSimulationIdStore.ts

@@ -0,0 +1,28 @@
+import { defineStore } from 'pinia';
+import { type Ref, ref } from 'vue';
+
+/**
+ * 模拟暴雨、地震灾害链id
+ */
+export const useSimulationIdStore = defineStore('simulationId', () => {
+  const status: Ref<boolean> = ref(false);
+  const id: Ref<number> = ref(-1);
+
+  /**
+   * 重置模拟id
+   */
+  const resetSimulationId = () => {
+    status.value = false;
+    id.value = -1;
+  };
+
+  /**
+   * 设置id
+   */
+  const setId = (value: number) => {
+    status.value = true;
+    id.value = value;
+  };
+
+  return { id, status, resetSimulationId, setId };
+});