风控区域过滤

src/components/Map.vue

@@ -7,12 +7,14 @@
 <script>
 import CityGis from '@/utils/map/CityGis.Bridge.js';
 import { myBridge } from '@/utils/map/map';
-import {addPointSearch, setCamera} from "@/utils/map/AddLayer.js";
+import {addPointSearch, clearMap, setCamera} from "@/utils/map/AddLayer.js";
 import {handleDangerStatistic, initDistrict, initShanghaiMap, viewComplete} from "@/utils/map/baseMethod.js";
 import {useEventInteractionStore} from "@/store/eventInteraction.js";
+import {useRiskLocationControlDialogStore} from "@/store/riskLocationControlDialog.js";
 let bridge;
 
 const eventInteractionStore = useEventInteractionStore()
+const riskLocationControlDialogStore = useRiskLocationControlDialogStore()
 export default {
   name: 'MyMap',
   data() {
@@ -37,7 +39,6 @@ export default {
           switch (arg.action) {
             case 'MapIsReady':
               console.log('map 准备好了');
-              console.log('map 准备好了1');
               setTimeout(() => {
 
                 initShanghaiMap()
@@ -52,9 +53,21 @@ export default {
               break;
             case 'MapClickResult':
               let res = arg.data[0]
-                if(res.title === "quxian-feature"){
-                  eventInteractionStore.selectDistrict = res.data.NAME
-                }
+              if(res.title === "quxian-feature"){
+                eventInteractionStore.selectDistrict = res.data.NAME
+              }
+              break;
+            case 'DrawComplete':
+              riskLocationControlDialogStore.dialogOptions.tableData.push({
+                type: '病例',
+                date: '-',
+                domeType: '血清',
+                samplingNum: '-',
+                testNum: '-',
+                positiveNum: '-',
+                geometry: arg.data.geometry
+              })
+              clearMap()
               break;
           }
         });

src/utils/map/baseMethod.js

@@ -828,7 +828,7 @@ export function handleCaseRelPoints(bol) {
 }
 
 //应急人员
-export function handleYjryPoints(bol){
+export function handleYjryPoints(bol, geometry){
   if(bol){
     removeMapLayers("yjry-points")
     addMultiImagePoints(
@@ -836,15 +836,26 @@ export function handleYjryPoints(bol){
       {
         data: analogData["人员实时gps位置"]
           .filter((el) => el.x !== null && el.y !== null).slice(0, 20)
-          .map((item) => {
+          .map((item,index) => {
             return {
               attributes: {
                 ...item,
+                OBJECTID: index
               },
               mapx: item.x,
               mapy: item.y,
             };
           }),
+        is_feature: geometry ? true : false,
+        "is_filter": geometry ? true : false,
+        "spatialRelationship": geometry ? "contains" : null,
+        "filterGeometry": geometry ? {
+          "type": "polygon",
+          "rings": geometry.rings,
+          "spatialReference": {
+            "wkid": 102100
+          }
+        } : null
       },
       // new URL(`@/assets/img/pinpoint(1).png`, import.meta.url).href,
       "images/sadian/应急人员-备班.png",
@@ -855,7 +866,7 @@ export function handleYjryPoints(bol){
 }
 
 //应急车辆
-export function handleYjclPoints(bol){
+export function handleYjclPoints(bol, geometry){
   if(bol){
     removeMapLayers("yjcl-points")
     addMultiImagePoints(
@@ -863,15 +874,26 @@ export function handleYjclPoints(bol){
       {
         data: analogData["人员实时gps位置"]
           .filter((el) => el.x !== null && el.y !== null).slice(-20)
-          .map((item) => {
+          .map((item,index) => {
             return {
               attributes: {
                 ...item,
+                OBJECTID: index
               },
               mapx: item.x,
               mapy: item.y,
             };
           }),
+        is_feature: geometry ? true : false,
+        "is_filter": geometry ? true : false,
+        "spatialRelationship": geometry ? "contains" : null,
+        "filterGeometry": geometry ? {
+          "type": "polygon",
+          "rings": geometry.rings,
+          "spatialReference": {
+            "wkid": 102100
+          }
+        } : null
       },
       // new URL(`@/assets/img/pinpoint(1).png`, import.meta.url).href,
       "images/sadian/应急车辆-值班.png",
@@ -1044,7 +1066,7 @@ export function handleJtlxPoints(bol){
 }
 
 //所有病例撒点
-export function handleAllCasesPoints(bol){
+export function handleAllCasesPoints(bol, geometry){
   if(bol){
     removeMapLayers("allCase-points")
     addMultiImagePoints(
@@ -1056,12 +1078,22 @@ export function handleAllCasesPoints(bol){
             return {
               attributes: {
                 ...item.properties,
-                objectId: index
+                OBJECTID: index
               },
               mapx: analogData["人员实时gps位置"][index].x,
               mapy: analogData["人员实时gps位置"][index].y,
             };
           }),
+        is_feature: geometry ? true : false,
+        "is_filter": geometry ? true : false,
+        "spatialRelationship": geometry ? "contains" : null,
+        "filterGeometry": geometry ? {
+          "type": "polygon",
+          "rings": geometry.rings,
+          "spatialReference": {
+            "wkid": 102100
+          }
+        } : null
       },
       // new URL(`@/assets/img/pinpoint(1).png`, import.meta.url).href,
       "images/sadian/病例.png",
@@ -1180,3 +1212,72 @@ export function handleCdclPoint(bol) {
   }
 }
 
+//疾控中心
+export function handleJkzxPoints(bol, geometry){
+  if(bol){
+    removeMapLayers("jkzx-points")
+    addMultiImagePoints(
+      'jkzx-points',
+      {
+        data: analogData["人员实时gps位置"]
+          .filter((el) => el.x !== null && el.y !== null).slice(-20)
+          .map((item,index) => {
+            return {
+              attributes: {
+                ...item,
+                OBJECTID: index
+              },
+              mapx: item.x,
+              mapy: item.y,
+            };
+          }),
+        is_feature: geometry ? true : false,
+        "is_filter": geometry ? true : false,
+        "spatialRelationship": geometry ? "contains" : null,
+        "filterGeometry": geometry ? {
+          "type": "polygon",
+          "rings": geometry.rings,
+          "spatialReference": {
+            "wkid": 102100
+          }
+        } : null
+      },
+      // new URL(`@/assets/img/pinpoint(1).png`, import.meta.url).href,
+      "images/sadian/疾控中心.png",
+    );
+  }else {
+    removeMapLayers("jkzx-points")
+  }
+}
+
+export function handlePointsWithGeometry(bol, geometry) {
+  if(bol){
+    removeMapLayers("fkqy-polygon")
+    addSingleImagePoint(
+      'fkqy-polygon',
+      {
+        is_clear: true,
+        is_goto: true,
+        type: 'polygon',
+        data: geometry.rings,
+        symbol: {
+          type: 'simple-fill',
+          color: [25, 255, 236, 0],
+          outline: {
+            color: [255, 255, 255, 0.5],
+            width: 5,
+          },
+        },
+        layerID: ""
+      }
+    );
+  }else {
+    removeMapLayers("fkqy-polygon")
+  }
+
+  handleAllCasesPoints(bol, geometry)
+  handleJkzxPoints(bol, geometry)
+  handleYjryPoints(bol, geometry)
+  handleYjclPoints(bol, geometry)
+}
+

src/views/left/dialog/components/dialog/RiskLocationControlDialog.vue

@@ -60,12 +60,13 @@
   </div>
 </template>
 <script setup>
-import { ref, watch, computed, reactive, toRefs, onBeforeMount, onMounted } from 'vue'
-import { draw } from "@/utils/map/AddLayer.js";
+import { ref, watch, computed, reactive, toRefs, onBeforeMount, onMounted, onBeforeUnmount } from 'vue'
+import {addMyGraph, draw} from "@/utils/map/AddLayer.js";
 import { useDialogStore } from '@/store/dialog'
 let dialogStore = useDialogStore()
 
 import { useRiskLocationControlDialogStore } from '@/store/riskLocationControlDialog'
+import {handlePointsWithGeometry} from "@/utils/map/baseMethod.js";
 let riskLocationControlDialogStore = useRiskLocationControlDialogStore()
 // 解构并保持响应式
 const { dialogOptions } = toRefs(riskLocationControlDialogStore)
@@ -165,14 +166,19 @@ const getImgSrc = picName => {
   return new URL(`${basePath}${picName}.png`, import.meta.url).href
 }
 
-function viewTableItem() {
-   
+function viewTableItem(row) {
+  console.log(row);
+  handlePointsWithGeometry(true, row.geometry)
 }
 
 function delTableItem(index) {
    dialogOptions.value.tableData.splice(index,1)
 }
 
+onBeforeUnmount(() => {
+  handlePointsWithGeometry(false)
+})
+
 </script>
 <style lang="scss" scoped>
 .risk_location_container {