修改大屏页面字体边距

packages/screen/src/views/RiskWarning/component/sectionHeader.vue

@@ -38,8 +38,8 @@ defineProps({
     gap: 8px;
 
     .title {
-      margin-left: 45px;
-      font-size: 18px;
+        margin-left: 35px;
+        font-size: 14px;
         font-weight: bold;
         color: #fff;
       }

packages/screen/src/views/RiskWarning/index.vue

@@ -75,6 +75,7 @@
 
     <div class="left">
       <left
+        @openImpactDetail="openDialog('impactPoint')"
         @openWarningInfo="openDialog('warningInfo')"
         @openImpactPoint="openDialog('impactPoint')"
         @openWarningSituation="openDialog('warningSituation')"
@@ -92,7 +93,13 @@
     </div>
     <!-- 地图中心 -->
     <div class="center">
-      <MapCenter />
+      <!-- 地图底层 -->
+      <div class="map-layer">
+        <!-- <MapCenter /> -->
+      </div>
+
+      <!-- 地图遮罩层 -->
+      <div class="map-mask" aria-hidden="true"></div>
     </div>
     <div class="bottom">
       <bottom></bottom>
@@ -230,7 +237,9 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
+import useMapStore from '@/map/stores/mapStore'
+import { useMapBase } from '../cockpit/composables/useMapBase'
 import left from "./left.vue";
 import right from "./right.vue";
 import bottom from "./bottom.vue";
@@ -307,6 +316,25 @@ const openConfirm = (config) => {
 
 // 中心信息卡片显示状态
 const showCenterCard = ref(false);
+
+// ==================== 地图状态管理 ====================
+
+const mapStore = useMapStore()
+
+/**
+ * 加载地图的业务底图与聚焦中心点
+ */
+const mapBase = useMapBase(mapStore)
+
+// ==================== 生命周期 ====================
+
+/**
+ * 组件挂载后初始化地图
+ */
+onMounted(() => {
+  // 加载地图业务底图 并 聚焦中心点
+  mapBase.loadBaseData()
+})
 </script>
 
 <style lang="scss" scoped>
@@ -407,6 +435,24 @@ const showCenterCard = ref(false);
   z-index: -1;
 }
 
+/* 地图底层 - 填满整个容器 */
+.map-layer {
+  position: absolute;
+  inset: 0;
+  z-index: 0;
+  /* 不设置 pointer-events，让地图保持可交互 */
+}
+
+/* 地图遮罩层 - 覆盖在地图之上 */
+.map-mask {
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  pointer-events: none;
+  /* 不阻挡交互 */
+  background: url(../../assets/RiskWarning_img/遮罩层.png) no-repeat center/cover;
+}
+
 // 四个角的装饰
 .corner {
   position: absolute;

packages/screen/src/views/RiskWarning/left.vue

@@ -372,7 +372,7 @@ const cellStyle = () => ({
       }
 
       .title {
-        font-size: vw(16);
+        font-size: vw(12);
         font-weight: bold;
         color: #fff;
       }

packages/screen/src/views/RiskWarning/right.vue

@@ -342,7 +342,7 @@ const majorEvent = "0";
     }
 
     .title {
-      font-size: vw(16);
+      font-size: vw(12);
       font-weight: bold;
       color: #fff;
     }