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

src/views/sys/exception/VideoSupervision.vue

@@ -13,22 +13,43 @@
     </div>
     <div class="main-bottom"></div>
     <!-- map -->
-    <Map ref="MapboxComponent" @showMonitor="showMonitorFunction" />
+    <Map ref="MapboxComponent" @showMonitor="showMonitorFunction" @handlerGetDetails="handlerGetDetails" />
 
     <!-- layer controller -->
     <LayerControl @handlerLayerButtonClick="handlerLayerButtonClick"></LayerControl>
 
     <div class="data-container">
+
       <!-- case list -->
-      <CaseList></CaseList>
+      <CaseList @handlerLayerButtonClick="handlerLayerButtonClick" @toPosition="toPosition"></CaseList>
       <!-- uav -->
       <UAV @toPosition="toPosition" @handlerUpdateUavLayerData="handlerUpdateUavLayerData" @handlerLayerButtonClick="handlerLayerButtonClick"></UAV>
+    
     </div>
 
     <Monitor :currentMonitor="monitorInfo" @register="registerModal" />
+
+    
   </div>
+
+  <a-modal
+      style="width: 100vw; top: 0px; left: 0px; margin: 0px; padding: 0px"
+      wrap-class-name="full-modal"
+      v-model:open="showInfoOpen"
+      title="详情"
+      :footer="null"
+      :maskClosable="true"
+      :destroyOnClose="true"
+      @cancel="showInfoOpen = false"
+      >
+      <div class="modal-content">
+        <ShowInfoModal v-if="showInfoOpen" :showInfoData="showInfoData" />
+      </div>
+    </a-modal>
+
 </template>
 <script lang="ts" setup>
+import ShowInfoModal from '@/views/demo/tiankongdi/curbspotcity/MapList/ShowInfoModal/index.vue';
   import Map from './VideoSupervision/map/map.vue';
   import LayerControl from './VideoSupervision/layercontrol/index.vue';
   import CaseList from './VideoSupervision/caselist/index.vue';
@@ -41,7 +62,7 @@
   import { useI18n } from '@/hooks/web/useI18n';
   import { useMessage } from '@/hooks/web/useMessage';
   import { useMultipleTabStore } from '@/store/modules/multipleTab';
-
+  import { getLoadDroneCaseInfoDetail, getCaseInfoById } from '@/api/tiankongdi/index';
   const { t } = useI18n();
   const router = useRouter();
   const { createConfirm } = useMessage();
@@ -49,7 +70,13 @@
   const MapboxComponent = ref();
 
   function handlerLayerButtonClick(item) {
-    MapboxComponent.value.handlerChangeLayerVisible(item.value, item.checked);
+    if(item.value == 'fufeilayer'){
+      MapboxComponent.value.handlerChangeLayerVisible("fufeiLayerLine", item.checked);
+      MapboxComponent.value.handlerChangeLayerVisible("fufeiLayerFill", item.checked);
+    }else{
+      MapboxComponent.value.handlerChangeLayerVisible(item.value, item.checked);
+      
+    }
   }
 
   const fireUserLoginName = ref(localStorage.getItem('fireUserLoginName'));
@@ -113,6 +140,24 @@ function handlerUpdateUavLayerData(uavlist){
   MapboxComponent.value.handlerUpdateUavLayer(uavLayerGeoJson);
 }
 
+const showInfoOpen = ref<Boolean>(false);
+const showInfoData = ref();
+
+const getInfoList = (id) => {
+  getCaseInfoById({id:id}).then(res => {
+    if(res){
+      showInfoData.value = res
+      showInfoOpen.value = true;
+    }else{
+      
+    }
+  })
+};
+
+function handlerGetDetails(e){
+    getInfoList(e.Id);
+  }
+
 onMounted(() => {
   // getWeather();
   getFireUserLoginName();
@@ -177,6 +222,7 @@ onMounted(() => {
       top: 50%;
       right: 24px;
       transform: translate(0, -50%);
+      z-index:9999999;
     }
   }
 </style>

src/views/sys/exception/VideoSupervision/caselist/index.vue

@@ -3,11 +3,11 @@
     <div class="title">
       复飞核实
       <div class="switch-button">
-        <a-switch v-model:checked="checked" />
+        <a-switch v-model:checked="fufeiLayer.checked" @change="handlerLayerButtonClick" />
       </div>
     </div>
     <div class="case-list">
-      <div class="case-item" v-for="item in list" :key="item.id">
+      <div class="case-item" v-for="item in list" :key="item.id" @click="toPosition(item)">
         <img src="/statistical/prove-icon.png" alt="" />
         <span>{{ item.countyname }}{{ item.streetname }}*********拆除复耕</span>
       </div>
@@ -15,10 +15,26 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { ref, onMounted } from 'vue';
+  import { ref, onMounted,defineEmits } from 'vue';
   import { reFlyVerifyPage } from '@/api/statistical';
 
-  const checked = ref<Boolean>(true);
+const emits = defineEmits(["handlerLayerButtonClick","toPosition"]);
+
+
+const checked = ref<Boolean>(true);
+
+const fufeiLayer = ref({
+    lable:"复飞核实",
+    value:"fufeilayer",
+    checked:true,
+})
+
+function handlerLayerButtonClick(item){
+    fufeiLayer.value.checked = item;
+    emits("handlerLayerButtonClick",fufeiLayer.value);
+    
+}
+
   const list = ref<any>([]);
   function getList() {
     reFlyVerifyPage({}).then((res) => {
@@ -26,9 +42,18 @@
       list.value = res.items;
     });
   }
+
+
+  function toPosition(item){
+    emits("toPosition",[item.lng,item.lat])
+  }
+
   onMounted(() => {
     getList();
   });
+
+
+
 </script>
 
 <style type="less" scoped>
@@ -79,6 +104,7 @@
     height: 376px;
     overflow: auto;
     .case-item {
+      cursor:pointer;
       border-bottom: 1px dashed #1d60b4;
       padding: 10px 0;
       img {

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

@@ -654,6 +654,7 @@
       // handlerLoadPolygon();
       handlerLoadMaskLayer();
       loadMonitorLayer();
+      loadFuFeiLayer();
       emits('onload');
       map.on('click', (e) => {
         var center = map.getCenter(); // 获取当前视图中心点
@@ -794,6 +795,100 @@
     }
   }
 
+  // 复飞核实图斑
+  function loadFuFeiLayer(){
+    let sql_filter = '&filter="measure_name"=\'0\'';
+
+    if (map.getSource('fufeiSource')) {
+      map.removeLayer('fufeiLayerLine');
+      map.removeSource('fufeiLayerFill');
+    }
+    map.addLayer({
+      id: 'fufeiLayerLine',
+      type: 'line',
+      source: {
+        type: 'vector',
+        tiles: [
+          VITE_GLOB_API_URL_VAR.value +
+            '/api/DroneCaseInfoSingle/QueryVectorTileByTable?z={z}&x={x}&y={y}&table=view_drone_shp_data&' +
+            sql_filter +
+            '&field="gid","handle_status_id","is_illegal","measure_name","typename","Id",',
+        ],
+        minzoom: 1,
+        maxzoom: 20,
+      },
+      'source-layer': 'view_drone_shp_data',
+      layout: {
+        'line-join': 'round',
+        'line-cap': 'round',
+        "visibility": "visible",
+      },
+      paint: {
+        'line-color': [
+          'case',
+          ['all', ['==', ['get', 'is_illegal'], 0], ['==', ['get', 'handle_status_id'], 5]], //合法
+          '#0AF703',
+          ['any', ['==', ['get', 'is_illegal'], 1], ['!=', ['get', 'handle_status_id'], 5]], //违法
+          '#F70303',
+          ['all', ['==', ['get', 'is_illegal'], 2], ['==', ['get', 'handle_status_id'], 5]], //其他
+          '#0382F7',
+          ['all', ['==', ['get', 'measure_name'], 0], ['==', ['get', 'handle_status_id'], 5]], //补办手续
+          '#AD04F4',
+          ['all', ['==', ['get', 'measure_name'], 1], ['==', ['get', 'handle_status_id'], 5]], //拆除复耕
+          '#F4E004',
+          // 默认
+          '#F70303',
+        ],
+        'line-width': 5,
+      },
+    });
+
+    map.addLayer({
+      id: 'fufeiLayerFill',
+      type: 'fill',
+      source: {
+        type: 'vector',
+        tiles: [
+          VITE_GLOB_API_URL_VAR.value +
+            '/api/DroneCaseInfoSingle/QueryVectorTileByTable?z={z}&x={x}&y={y}&table=view_drone_shp_data' +
+            sql_filter +
+            '&field="gid","handle_status_id","is_illegal","measure_name","typename","Id",',
+        ],
+        //
+        minzoom: 1,
+        maxzoom: 20,
+      },
+      'source-layer': 'view_drone_shp_data',
+      layout: {
+        visibility:"visible",
+      },
+      paint: {
+        'fill-color': [
+          'case',
+          ['all', ['==', ['get', 'is_illegal'], 0], ['==', ['get', 'handle_status_id'], 5]], //合法
+          '#0AF703',
+          ['any', ['==', ['get', 'is_illegal'], 1], ['!=', ['get', 'handle_status_id'], 5]], //违法
+          '#F70303',
+          ['all', ['==', ['get', 'is_illegal'], 2], ['==', ['get', 'handle_status_id'], 5]], //其他
+          '#0382F7',
+          ['all', ['==', ['get', 'measure_name'], 0], ['==', ['get', 'handle_status_id'], 5]], //补办手续
+          '#AD04F4',
+          ['all', ['==', ['get', 'measure_name'], 1], ['==', ['get', 'handle_status_id'], 5]], //拆除复耕
+          '#F4E004',
+          // 默认
+          '#F70303',
+        ],
+        'fill-opacity': 0.4,
+      },
+    });
+
+
+    map.on('click', 'fufeiLayerFill', (e) => {
+      emits('handlerGetDetails', e.features[0].properties);
+    });
+
+  }
+
   // 抛出函数
   defineExpose({
     handlerChangeCounty, // 切换县区

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

@@ -22,7 +22,7 @@
             <div class="close-video-button" @click="closePlayer">
                 <CloseOutlined />
             </div>
-            <video class="video-contain" id="video"></video>
+            <video class="video-contain" id="video" :key="Math.random()"></video>
         </div>
     </div>
 </template>
@@ -248,7 +248,9 @@ function handlerPlayVideo(item){
         currentUav = phone;
         window.websocket.send(phone);
         setTimeout(function(){
+            alert("http://live.hopetrytech.com/live/" + phone + ".flv")
             if (player) {
+                alert("http://live.hopetrytech.com/live/" + phone + ".flv")
                 player.src("http://live.hopetrytech.com/live/" + phone + ".flv");
             } else {
                 player = TCPlayer("video", {});