完成获取雨量

src/component/rain-earthquake/StepComponent.vue

@@ -4,6 +4,7 @@
       style="width: 100%; background-color: #ffffff00"
       :active="stepStore.currentStep"
       finish-status="success"
+      process-status="success"
       simple
     >
       <el-step

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

@@ -6,6 +6,7 @@
 <script lang="ts" setup>
   import { useRainstormDeduction } from '@/hooks/rainstorm/useRainstormDeduction';
   import { useStatusStore } from '@/stores/useStatusStore';
+  import { useStepStore } from '@/stores/useStepStore';
   import type { ApiResponse } from '@/types/ApiResponse';
   import type { RainfallGridResponse } from '@/types/rainstorm/RainfallGridResponse';
   import { WebSocketService } from '@/utils/request/websocket';
@@ -14,6 +15,7 @@
   let rainfallWsService: WebSocketService | null = null;
   const { triggerLayerShowStatus, addGridLayer } = useRainstormDeduction();
   const statusStore = useStatusStore();
+  const stepStore = useStepStore();
 
   // 请求降雨栅格数据
   const requestRainfallData = () => {
@@ -38,6 +40,9 @@
           if (response.code === 200 && response.data) {
             // 显示图层
             addGridLayer(response.data);
+
+            // 推进到下一步
+            stepStore.nextStep();
           } else {
             console.warn('响应错误:', response.message);
           }

src/stores/useStepStore.ts

@@ -15,5 +15,10 @@ export const useStepStore = defineStore('step', () => {
    */
   const currentStep: Ref<number> = ref(0);
 
-  return { stepList, currentStep };
+  const nextStep = () => {
+    currentStep.value =
+      currentStep.value >= stepList.value.length ? 0 : currentStep.value + 1;
+  };
+
+  return { stepList, currentStep, nextStep };
 });