Merge branch 'main' of http://123.132.248.154:10000/HC_YFZX/CaiYuanYiTiHua

src/views/sys/exception/LargeScreenMap/config.ts

@@ -58,6 +58,10 @@ export const MAP_VIEWER = {
     "莒南县":{
         center:{lng: 118.96807389575793, lat: 35.186365164136504},
         zoom:9.848587811931848,
+    },
+    "临港区":{
+        center:{lng: 119.113001, lat: 35.204748},
+        zoom:10.848587811931848,
     }
 }
 

src/views/sys/exception/LargeScreenMap/index.vue

@@ -66,16 +66,7 @@ const initMap = () => {
                 }
             },
             layers: [
-                {
+                
-                    id: 'dianzi',
-                    type: 'raster',
-                    source: 'dianzi',
-                    minzoom: 0,
-                    maxzoom: 18,
-                    layout: {
-                        visibility: 'visible',
-                    }
-                },
                 {
                     id: 'dianzi-biaozhu',
                     type: 'raster',
@@ -104,6 +95,15 @@ const initMap = () => {
                     layout: {
                         visibility: 'none',
                     }
+                },{
+                    id: 'dianzi',
+                    type: 'raster',
+                    source: 'dianzi',
+                    minzoom: 0,
+                    maxzoom: 18,
+                    layout: {
+                        visibility: 'visible',
+                    }
                 }
             ],
         },
@@ -474,6 +474,7 @@ const handlerDealCountry = (countyName:String = "临沂市"):void=>{
             handlerLoadCountyLayer(res.data);
         });
     } else if(countyName){
+        
         center = MAP_VIEWER[countyName].center;
         zoom = MAP_VIEWER[countyName].zoom;
         handlerLocation([center['lng'],center['lat']],zoom);
@@ -482,8 +483,9 @@ const handlerDealCountry = (countyName:String = "临沂市"):void=>{
         axios({
             method:"get",
             // url:`http://175.27.168.120:8080/geoserver/linyishi/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=linyishi%3Axianjie&maxFeatures=50&outputFormat=application%2Fjson&cql_filter=xzqmc%20like%20%27%25${filterName}%25%27`,
-            url: `http://120.222.154.7:8090/geoserver/linyishi/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=linyishi%3Axianjie&maxFeatures=50&outputFormat=application%2Fjson&cql_filter=xzqdm_1%20like%20%27%25${filterName}%25%27`,
+            url: `http://120.222.154.7:8090/geoserver/linyishi/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=linyishi%3Axianjie&maxFeatures=50&outputFormat=application%2Fjson&cql_filter=xzqmc_1%20like%20%27%25${filterName}%25%27`,
         }).then(res=>{
+            console.log("res",res);
             handlerLoadCountyLayer(res.data);
         })
     }
@@ -511,7 +513,7 @@ const handlerLoadCountyLayer = (geojson)=>{
             }
           }
         )
-        map.moveLayer("heatLayer","countLayer");
+        // map.moveLayer("heatLayer","countLayer");
         // map.moveLayer("historyLayerLine","countLayer");
         // map.moveLayer("historyLayerFill","countLayer");
       }

src/views/sys/exception/VideoSupervision.vue

@@ -1,5 +1,10 @@
 <template>
   <div class="main-container">
+    <!-- mask -->
+    <div id="alertOverlay" class="alert-active" ref="alertOverlay">
+      <div></div>
+    </div>
+
     <!-- layout -->
     <div class="main-header">
       <div class="title">
@@ -225,4 +230,74 @@ onMounted(() => {
       z-index:9999999;
     }
   }
+
+  #alertOverlay::before,#alertOverlay::after {
+    position: absolute;
+    width: 100px;
+    height: 100%;
+  }
+
+  #alertOverlay div::before,#alertOverlay div::after {
+    content: '';
+    position: absolute;
+    width: 100%;
+    height: 120px;
+  }
+
+  #alertOverlay::before {
+    background: linear-gradient(to right, rgba(0, 0, 0, 0.8), transparent);
+    top: 0;
+    left: 0;
+    transform: rotate(0deg);
+  }
+
+  #alertOverlay::after {
+    background: linear-gradient(to left, rgba(0, 0, 0, 0.8), transparent);
+    top: 0%;
+    left: 100%;
+    transform: rotate(0deg) translate(calc(-1 * 50px), 0px);
+  }
+
+  #alertOverlay div::before {
+    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
+    top: 0;
+    left: 0;
+    transform: rotate(180deg);
+  }
+
+  #alertOverlay div::after {
+    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
+    top: 100%;
+    left: 0;
+    transform: rotate(0deg) translate(0px, calc(-1 * 50px));
+  }
+
+  #alertOverlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+    opacity: 1;
+    transition: opacity 0.5s;
+    pointer-events: none;
+    z-index: 1;
+  }
+
+  .alert-active {
+    animation: blink 0s infinite;
+  }
+
+  @keyframes blink {
+    0% {
+      opacity: 0;
+    }
+    50% {
+      opacity: 0.5;
+    }
+    100% {
+      opacity: 0;
+    }
+  }
 </style>

src/views/sys/exception/VideoSupervision/map/map.vue

@@ -656,6 +656,7 @@
       loadMonitorLayer();
       loadFuFeiLayer();
       getHangFeiAreaData();
+      getHangFeiPlanData();
       emits('onload');
       map.on('click', (e) => {
         var center = map.getCenter(); // 获取当前视图中心点
@@ -913,6 +914,38 @@
           'line-color': '#6F7FF4', // 设置线的颜色
           'line-width': 3, // 设置线的宽度
         },
+        layout:{
+          "visibility":"none"
+        }
+      });
+  }
+
+  // 航飞规划
+  function getHangFeiPlanData(){
+    axios({
+      method: 'get',
+      url: `http://120.222.154.7:8090/geoserver/linyishi/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=linyishi%3Ahangfeiquyu&maxFeatures=9990&outputFormat=application%2Fjson`,
+    }).then((res) => {
+      loadHangFeiPlanLayer(res.data);
+    });
+  }
+
+  function loadHangFeiPlanLayer(geojson){
+      map.addSource('hangfeiPlanSource', {
+        type: 'geojson',
+        data: geojson,
+      });
+      map.addLayer({
+        id: 'hangfeiplan',
+        type: 'line',
+        source: 'hangfeiPlanSource',
+        paint: {
+          'line-color': '#6F7FF4', // 设置线的颜色
+          'line-width': 3, // 设置线的宽度
+        },
+        layout:{
+          "visibility":"none"
+        }
       });
   }