大屏添加遮罩

src/views/bigScreen/Header/index.vue

@@ -54,6 +54,7 @@ export default {
   font-weight: bold;
   font-size: 48px;
   font-style: italic;
+  z-index: 1;
   .title{
     position: absolute;
     top: 18px;

src/views/bigScreen/InfoModal/index.vue

@@ -98,6 +98,7 @@ export default {
   background-image: url('/bigScreen/info_background.png');
   background-size: 100% 100%;
   padding-top: 39px;
+  z-index: 1;
   .button-div{
     position: absolute;
     top: 30px;

src/views/bigScreen/SearchComponent/index.vue

@@ -28,6 +28,7 @@ export default {
   width: 340px;
   height: 36px;
   display: flex;
+  z-index: 1;
   .search-input-div{
     width: 309px;
     height: 36px;

src/views/bigScreen/index.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="out-div">
+    <div class="mask"></div>
     <Map :url="configUrl" :widgetUrl="widgetUrl" @onload="onMapload" />
     <Header />
     <div class="left-border"></div>
@@ -74,6 +75,16 @@ export default {
   width: 100%;
   height: 100vh;
   position: relative;
+  .mask{
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(circle, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0.9) 100%);
+    z-index: 1;
+    pointer-events:none;
+  }
   :deep(.subtitle){
     position: absolute;
     top: -7px;
@@ -115,6 +126,7 @@ export default {
     width: 30px;
     background-image: url('/bigScreen/left_border.png');
     background-size: 100% 100%;
+    z-index: 1;
   }
   .right-border{
     position: absolute;
@@ -124,6 +136,7 @@ export default {
     height: calc(100vh - 29px);
     background-image: url('/bigScreen/right_border.png');
     background-size: 100% 100%;
+    z-index: 1;
   }
   .footer{
     position: absolute;
@@ -133,12 +146,14 @@ export default {
     height: 51px;
     background-image: url('/bigScreen/footer_background.png');
     background-size: 100% 100%;
+    z-index: 1;
   }
   .left-content{
     position: absolute;
     top: 95px;
     left: 30px;
     width: 425px;
+    z-index: 1;
   }
   .right-content{
     width: 425px;
@@ -148,6 +163,7 @@ export default {
     right: 22px;
     background-image: url('/bigScreen/right_backgorund.png');
     background-size: 100% 100%;
+    z-index: 1;
   }
 }
 </style>