处理数据接收状态窗口滚动条的问题

数据接受状态弹窗重新打开之后 loading 效果不明显，添加蒙版

src/components/CustomChart/index.vue

@@ -75,6 +75,5 @@ export default {
 <style lang="less" scoped>
 .custom-chart {
   height: 100% !important;
-  min-height: 600px;
 }
 </style>

src/views/stationOperation/components/MapPane.vue

@@ -236,6 +236,7 @@
             <RealTimeDataChart ref="realtimeChartRef" :spinning="spinLoading" :list="statusList" :scale-settings="initialDataRecieveSettings" />
             <resize-observer @notify="handleResize" />
           </template>
+          <div v-show="maskVisi" style="z-index: 1;position: absolute;top: 0;left: 0;width:100%;height: 100%;background: rgba(0, 0, 0, .45);"></div>
         </div>
         <!-- 右侧图表展示栏结束 -->
       </div>
@@ -420,7 +421,8 @@ export default {
       markerList: [], // 要在地图上展示的marker列表
 
       showPane: true,
-      spinLoading: false
+      spinLoading: false,
+      maskVisi: false
     }
   },
   created() {
@@ -727,6 +729,7 @@ export default {
 
     // 获取数据接收状态列表
     async getDataRecieveStatusList() {
+      this.maskVisi = true
       this.spinLoading = true
       try {
         this.isGettingStatusList = true
@@ -736,6 +739,7 @@ export default {
             userId: this.$store.getters.userInfo.id
           }
         )
+        this.maskVisi = false
         this.spinLoading = false
         if (success) {
           const statusList = []
@@ -755,6 +759,7 @@ export default {
           this.$message.error(message)
         }
       } catch (error) {
+        this.maskVisi = false
         this.spinLoading = false
         console.error(error)
       } finally {

src/views/stationOperation/components/RealTimeDataChart.vue

@@ -1,5 +1,5 @@
 <template>
-  <div style="position: relative;">
+  <div>
     <!-- 图例 -->
     <div class="legend">
       <div
@@ -15,7 +15,7 @@
     </div>
     <!-- 图例结束 -->
     <custom-chart ref="customChartRef" :option="option" :height="list.length * 295"></custom-chart>
-    <a-spin style="position: absolute;top: 45%;left: 48%;" :spinning="spinning" />
+    <a-spin style="z-index: 11;position: absolute;top: 45%;left: 48%;" :spinning="spinning" />
   </div>
 </template>