[Feat 0000] 添加基本的地图，调整了针对地图的布局样式

src/layouts/default/PlainLayout.vue

@@ -0,0 +1,95 @@
+<template>
+  <!-- <div style="position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: yellow"></div> -->
+  <Layout :class="prefixCls" v-bind="lockEvents">
+    <LayoutFeatures />
+    <LayoutHeader />
+    <SystemSelect />
+    <SimpleMap />
+    <LayoutContent />
+  </Layout>
+</template>
+
+<script lang="ts">
+  import { defineComponent, computed, unref } from 'vue';
+  import { Layout } from 'ant-design-vue';
+  import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
+
+  import LayoutHeader from './header/index.vue';
+  import LayoutContent from './content/index.vue';
+  import SystemSelect from './feature/SystemSelect.vue';
+  import SimpleMap from './feature/SimpleMap.vue';
+
+  // import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting';
+  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
+  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useLockPage } from '/@/hooks/web/useLockPage';
+
+  // import { useAppInject } from '/@/hooks/web/useAppInject';
+
+  export default defineComponent({
+    name: 'DefaultLayout',
+    components: {
+      LayoutFeatures: createAsyncComponent(() => import('/@/layouts/default/feature/index.vue')),
+      LayoutHeader,
+      LayoutContent,
+      Layout,
+      SystemSelect,
+      SimpleMap,
+    },
+    setup() {
+      const { prefixCls } = useDesign('default-layout');
+      // const { getIsMobile } = useAppInject();
+      // const { getShowFullHeaderRef } = useHeaderSetting();
+      const { getShowSidebar, getIsMixSidebar, getShowMenu } = useMenuSetting();
+
+      // Create a lock screen monitor
+      const lockEvents = useLockPage();
+
+      const layoutClass = computed(() => {
+        let cls: string[] = ['ant-layout'];
+        if (unref(getIsMixSidebar) || unref(getShowMenu)) {
+          cls.push('ant-layout-has-sider');
+        }
+        return cls;
+      });
+
+      return {
+        getShowSidebar,
+        prefixCls,
+        getIsMixSidebar,
+        layoutClass,
+        lockEvents,
+      };
+    },
+  });
+</script>
+<style lang="less">
+  @prefix-cls: ~'@{namespace}-default-layout';
+
+  .@{prefix-cls} {
+    display: flex;
+    width: 100%;
+    min-height: 100%;
+    flex-direction: column;
+
+    > .ant-layout {
+      height: 0;
+      margin: 10px;
+      background-color: transparent;
+      position: relative;
+      z-index: 2;
+    }
+
+    &-main {
+      width: 100%;
+      border-top-right-radius: 10px;
+      border-bottom-right-radius: 10px;
+      // background-color: #aaaaaa32;
+      background: rgba(255, 255, 255, 0.2);
+      backdrop-filter: blur(10px);
+      -webkit-backdrop-filter: blur(10px);
+      // 代码逻辑说明:【issues/8709】LayoutContent样式多出1px
+      // margin-left: 1px;
+    }
+  }
+</style>

src/layouts/default/feature/SimpleMap.vue

@@ -0,0 +1,89 @@
+<template>
+  <div ref="mapContainer" class="map-container"></div>
+</template>
+
+<script setup>
+  import { ref, onMounted, onUnmounted } from 'vue';
+  // 引入 Leaflet
+  import L from 'leaflet';
+  import 'leaflet/dist/leaflet.css';
+  import TaiyuanGeoJSON from './taiyuan.json';
+  // Ant Design Vue 图标
+
+  // --- 1. 组件引用和状态定义 ---
+  const mapContainer = ref(null);
+  let map = null; // Leaflet 地图实例
+
+  // --- 2. 瓦片图层配置 ---
+  const tileLayers = {
+    satellite: {
+      name: '卫星图',
+      layer: null,
+      url: 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
+      options: {
+        maxZoom: 18,
+        attribution: '© Esri',
+      },
+    },
+  };
+
+  // --- 3. 地图初始化 ---
+  onMounted(() => {
+    initMap();
+  });
+
+  onUnmounted(() => {
+    if (map) {
+      map.remove();
+    }
+  });
+
+  // 初始化地图
+  function initMap() {
+    if (!mapContainer.value) return;
+
+    // 创建地图实例，设置太原市中心和初始缩放级别
+    map = L.map(mapContainer.value, {
+      center: [37.873, 112.564], // 太原市中心坐标 [纬度, 经度]
+      zoom: 7, // 初始缩放级别，适合城市级别查看
+      zoomControl: false, // 显示缩放控件
+      attributionControl: false, // 显示属性控件
+    });
+
+    // 初始化所有瓦片图层
+    initTileLayers();
+
+    // 默认显示自定义底图
+    tileLayers.satellite.layer.addTo(map);
+
+    initGeoJSON();
+  }
+
+  // 初始化瓦片图层
+  function initTileLayers() {
+    Object.keys(tileLayers).forEach((key) => {
+      const config = tileLayers[key];
+      config.layer = L.tileLayer(config.url, config.options);
+    });
+  }
+
+  function initGeoJSON() {
+    L.geoJSON(TaiyuanGeoJSON, {
+      style: function () {
+        return { color: '#ff9100' };
+      },
+    }).addTo(map);
+  }
+</script>
+
+<style scoped>
+  .map-container {
+    flex: 1;
+    height: 100%;
+    width: 100%;
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 1;
+  }
+</style>

src/layouts/default/feature/SystemSelect.vue

@@ -33,6 +33,8 @@
     margin-left: 10px;
     margin-top: 10px;
     width: 210px;
+    position: relative;
+    z-index: 2;
 
     // :deep(.ant-select-selector) {
     //   background-color: @primary-color;

src/layouts/default/header/index.vue

@@ -191,6 +191,8 @@
     // 代码逻辑说明: 【QQYUN-8762】顶栏高度
     height: @header-height;
     align-items: center;
+    position: relative;
+    z-index: 2;
 
     .headerIntroductionClass {
       margin-right: 4px;

src/layouts/default/index.vue

@@ -4,6 +4,7 @@
     <LayoutFeatures />
     <LayoutHeader />
     <SystemSelect />
+    <SimpleMap />
     <Layout :class="[layoutClass]">
       <LayoutSideBar />
       <Layout :class="`${prefixCls}-main`">
@@ -25,6 +26,7 @@
   import LayoutContent from './content/index.vue';
   import LayoutSideBar from './sider/index.vue';
   import SystemSelect from './feature/SystemSelect.vue';
+  import SimpleMap from './feature/SimpleMap.vue';
 
   // import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting';
   import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
@@ -44,6 +46,7 @@
       MultipleTabs,
       Layout,
       SystemSelect,
+      SimpleMap,
     },
     setup() {
       const { prefixCls } = useDesign('default-layout');
@@ -79,15 +82,14 @@
     display: flex;
     width: 100%;
     min-height: 100%;
-    // background-color: greenyellow;
-    background-image: url('/@/assets/images/sealedGoaf/views/home/home-bg.png');
-    // background-color: @content-bg;
     flex-direction: column;
 
     > .ant-layout {
       height: 0;
       margin: 10px;
       background-color: transparent;
+      position: relative;
+      z-index: 2;
     }
 
     &-main {