添加降雨推演步骤条

src/component/rain-earthquake/StepComponent.vue

@@ -1,11 +1,11 @@
 <template>
-  <div class="step-box">
+  <div class="step-box" v-show="useStatusStore().uiComponents.stepBar.show">
     <el-steps
-      style="max-width: 100%"
+      style="width: 100%; background-color: #ffffff00"
       :active="useStepStore().currentStep"
       finish-status="success"
-      simple
-      v-if="useStepStore().stepList.length > 0"
+      process-status="success"
+      align-center
     >
       <el-step
         v-for="(item, index) in useStepStore().stepList"
@@ -17,13 +17,14 @@
 </template>
 
 <script lang="ts" setup>
+  import { useStatusStore } from '@/stores/useStatusStore';
   import { useStepStore } from '@/stores/useStepStore';
 </script>
 
 <style scoped>
   .step-box {
     width: 100%;
-    height: 50px;
+    height: 65px;
     display: flex;
     justify-content: center;
     align-items: center;
@@ -33,4 +34,8 @@
     background-color: rgba(14, 52, 98, 0.8);
     z-index: 1000;
   }
+
+  :deep(.is-wait) {
+    color: #fff;
+  }
 </style>