样式调整

src/components/gis-map/index.html

@@ -21,4 +21,5 @@
         </el-dropdown-menu>
       </el-dropdown>
     </div>
+    <div class="mask" style="position: absolute; width: 100%; height: 100%;pointer-events: none;"></div>
 </div>

src/components/gis-map/index.scss

@@ -4,6 +4,17 @@
   left: 0;
   right: 0;
   bottom: 0;
+  z-index: -2;
+}
+
+.mask {
+  z-index: 1;
+  width: 100%;
+  height: 100%;
+  box-shadow: inset 0px 0px 100px 100px rgba(0, 0, 0, 0.59);
+  /* 四周黑色 */
+  pointer-events: none;
+  /* 允许地图事件穿透 */
 }
 
 .select_address {

src/style/_base.scss

@@ -18,6 +18,10 @@ body {
   overflow-y: auto;
 }
 
+.zIndextop {
+  z-index: 2;
+}
+
 .page {
   position: relative;
   width: 100vw;
@@ -93,7 +97,7 @@ body {
 }
 
 .border {
-  border: 1px solid red;
+  // border: 1px solid red;
 }
 
 .nowrap‌ {

src/views/capital/index.html

@@ -6,13 +6,13 @@
   </Header>
   <GisMap></GisMap>
   <!-- 项目初始化 -->
-  <div class="left_side col space_between">
+  <div class="left_side col space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.left" :key="index"></component>
   </div>
-  <div class="right_side col space_between">
+  <div class="right_side col space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.right" :key="index"></component>
   </div>
-  <div class="buttom_side row space_between">
+  <div class="buttom_side row space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.buttom" :key="index"></component>
   </div>
 </div>

src/views/property/index.html

@@ -7,13 +7,13 @@
     </div>
   </Header>
   <!-- 项目初始化 -->
-  <div class="left_side col space_between">
+  <div class="left_side col space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.left" :key="index"></component>
   </div>
-  <div class="right_side col space_between">
+  <div class="right_side col space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.right" :key="index"></component>
   </div>
-  <div class="buttom_side row space_between">
+  <div class="buttom_side row space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.buttom" :key="index"></component>
   </div>
 </div>

src/views/property/main-gis/index.html

@@ -1,4 +1,5 @@
 <div class="map border" id="map2">
+  <div class="mask" style="position: absolute; width: 100%; height: 100%;pointer-events: none;"></div>
   <!--选择地址-->
   <div class="select_address">
     <div class="dot left"></div>

src/views/property/main-gis/index.scss

@@ -4,6 +4,16 @@
   left: 0;
   right: 0;
   bottom: 0;
+
+  .mask {
+    z-index: 1;
+    width: 100%;
+    height: 100%;
+    box-shadow: inset 0px 0px 100px 100px rgba(0, 0, 0, 0.59);
+    /* 四周黑色 */
+    pointer-events: none;
+    /* 允许地图事件穿透 */
+  }
 }
 
 //选择地址

src/views/resources/index.html

@@ -7,13 +7,13 @@
     </div>
   </Header>
   <!-- 项目初始化 -->
-  <div class="left_side col space_between">
+  <div class="left_side col space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.left" :key="index"></component>
   </div>
-  <div class="right_side col space_between">
+  <div class="right_side col space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.right" :key="index"></component>
   </div>
-  <div class="buttom_side row space_between">
+  <div class="buttom_side row space_between zIndextop">
     <component :is="item" v-for="(item, index) in currentComp.buttom" :key="index"></component>
   </div>
 </div>

src/views/resources/main-gis/index.html

@@ -1,4 +1,5 @@
 <div class="map border" id="map2">
+  <div class="mask" style="position: absolute; width: 100%; height: 100%;pointer-events: none;"></div>
   <!--选择地址-->
   <!-- <div class="select_address">
     <div class="dot left"></div>

src/views/resources/main-gis/index.scss

@@ -4,6 +4,16 @@
   left: 0;
   right: 0;
   bottom: 0;
+
+  .mask {
+    z-index: 1;
+    width: 100%;
+    height: 100%;
+    box-shadow: inset 0px 0px 100px 100px rgba(0, 0, 0, 0.59);
+    /* 四周黑色 */
+    pointer-events: none;
+    /* 允许地图事件穿透 */
+  }
 }
 
 //选择地址