From b2a22d7cff4d3fb0aad8b19e770778bd8b032fb8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Thu, 13 Apr 2023 11:17:59 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=A6=96=E9=A1=B5=E8=B7=AF?=
 =?UTF-8?q?=E5=BE=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/views/index.vue                  |  25 ++--
 .../alarmSendingSettings/index.vue            |   5 +-
 .../electronicFence/index.vue                 | 113 +++++++++++++-----
 3 files changed, 93 insertions(+), 50 deletions(-)

diff --git a/ruoyi-ui/src/views/index.vue b/ruoyi-ui/src/views/index.vue
index 2500c17..a13ec01 100644
--- a/ruoyi-ui/src/views/index.vue
+++ b/ruoyi-ui/src/views/index.vue
@@ -118,20 +118,7 @@
             <div v-for="(i,index) in warringList" :key='i' ref="warningRef"
                  style="position:relative;color:#fff;height: 120px;">
               <img
-                  v-if="i?.ispresslower === 1"
-                  src="../assets/icons/ispresslower.png"
-                  style="width: 40px;height: 40px;position: absolute;top: 10px;left: 0px">
-              <img
-                  v-if="i?.ispresshigh === 1"
-                  src="../assets/icons/ispresshigh.png"
-                  style="width: 40px;height: 40px;position: absolute;top: 10px;left: 0px">
-              <img
-                  v-if="i?.istemperaturehigh === 1"
-                  src="../assets/icons/highTemperature.png"
-                  style="width: 40px;height: 40px;position: absolute;top: 10px;left: 0px">
-              <img
-                  v-if="i?.ispowerinvalue === 1"
-                  src="../assets/icons/ispowerinvalue.png"
+                  :src="imgUrl(i)"
                   style="width: 40px;height: 40px;position: absolute;top: 10px;left: 0px">
               <div style="position: absolute;top: 10px;left: 50px;font-size: 16px">
                 {{ i?.ispresslower === 1 ? '低压' : '' }}
@@ -204,7 +191,7 @@ export default {
         ispresshigh: 0,
         ispresslower: 0,
         istemperaturehigh: 0,
-        total:0
+        total: 0
       },
       chartData: [...(chinaMap.features.map(e => {
         return {
@@ -275,6 +262,12 @@ export default {
     this.chart = null
   },
   methods: {
+    imgUrl(e) {
+      if (e.ispowerinvalue === 1) return new URL(`../assets/icons/ispowerinvalue.png`, import.meta.url).href;
+      if (e.ispresshigh === 1) return new URL(`../assets/icons/ispresshigh.png`, import.meta.url).href;
+      if (e.ispresslower === 1) return new URL(`../assets/icons/ispresslower.png`, import.meta.url).href;
+      if (e.istemperaturehigh === 1) return new URL(`../assets/icons/highTemperature.png`, import.meta.url).href;
+    },
     async setInfo() {
       await getIndexdata().then(response => {
         this.warningInfo = {
@@ -282,7 +275,7 @@ export default {
           ispresshigh: response.data.ispresshigh,
           ispresslower: response.data.ispresslower,
           istemperaturehigh: response.data.istemperaturehigh,
-          total:response.data.ispowerinvalue+response.data.ispresshigh+response.data.ispresslower+response.data.istemperaturehigh
+          total: response.data.ispowerinvalue + response.data.ispresshigh + response.data.ispresslower + response.data.istemperaturehigh
         },
             this.warringWaitList = [...response.data.warringList],
             this.carData = {
diff --git a/ruoyi-ui/src/views/realTimeMonitoring/alarmSendingSettings/index.vue b/ruoyi-ui/src/views/realTimeMonitoring/alarmSendingSettings/index.vue
index 567a7f1..37153b8 100644
--- a/ruoyi-ui/src/views/realTimeMonitoring/alarmSendingSettings/index.vue
+++ b/ruoyi-ui/src/views/realTimeMonitoring/alarmSendingSettings/index.vue
@@ -10,7 +10,7 @@
         <el-cascader
             v-model="form.carId"
             :options="options"
-            :props="{ multiple: true, value:'id',label:'title',children:'baseCarList', }"
+            :props="{ multiple: true, value:'id',label:'title',children:'baseCarList',checkStrictly :true }"
             clearable
             @change="cascaderChange" />
       </el-form-item>
@@ -95,10 +95,11 @@ const cascaderChange = (e) => {
   let nowIds = e.map(val => val.at(-1))
   let nowClick = nowIds.filter(val => !(lastIds.includes(val)))?.[0]
   ids.value = e.map(val => val.at(-1))
+  console.log(nowClick)
   if (!nowClick) return
   getInfoById(nowClick)
       .then(val => {
-        form.value = val.data
+        form.value = {...form.value, ...val.data}
         form.value.time = parseTime(new Date())
       })
 }
diff --git a/ruoyi-ui/src/views/realTimeMonitoring/electronicFence/index.vue b/ruoyi-ui/src/views/realTimeMonitoring/electronicFence/index.vue
index fa15c4c..ba39650 100644
--- a/ruoyi-ui/src/views/realTimeMonitoring/electronicFence/index.vue
+++ b/ruoyi-ui/src/views/realTimeMonitoring/electronicFence/index.vue
@@ -29,6 +29,7 @@
     </el-form>
 
     <div id="container4"></div>
+    <el-button class="add" @click="createPolygon">新建</el-button>
   </div>
 </template>
 <script setup>
@@ -43,12 +44,10 @@ const locale = (Cookies.get('language') || 'zhCn') === 'zhCn'
 const {proxy} = getCurrentInstance();
 const queryParams = ref({})
 
-
 let map = null
 let path = [[116.390969, 39.911592], [116.391496, 39.909008], [116.389264, 39.909765], [116.38802, 39.911016]]
-let path2 = [[116.400969, 39.921592], [116.401496, 39.919008], [116.399264, 39.919765], [116.39802, 39.921016]]
-const areaPath = ref([path,path2])
-let marketPath = [116.390669, 39.911147]
+const areaPath = ref([path])
+const marketPath = ref([[116.390669, 39.911147],[116.400669, 39.921147]])
 AMapLoader.load({
   key: "ba8fb8d8bae1b280b93406d5959d492f",             // 申请好的Web端开发者Key，首次调用 load 时必填
   // version: "1.4.15",      //
@@ -66,19 +65,6 @@ AMapLoader.load({
     center: [116.397428, 39.90923], //初始化地图中心点位置
   });
 
-  let marker = new AMap.Marker({
-    position: marketPath,
-    anchor: 'bottom-center',
-    offset: new AMap.Pixel(0, 0)
-  });
-  marker.setTitle('我是marker的title');
-  marker.setLabel({
-    direction: 'top',
-    offset: new AMap.Pixel(0, -10),  //设置文本标注偏移量
-    content: "" + AMap.GeometryUtil.isPointInRing(marketPath,path,path2),
-  });
-  marker.setMap(map);
-
   // 在图面添加工具条控件，工具条控件集成了缩放、平移、定位等功能按钮在内的组合控件
   map.addControl(new AMap.ToolBar({position: 'LT'}));
 
@@ -91,42 +77,99 @@ AMapLoader.load({
   // 在图面添加类别切换控件，实现默认图层与卫星图、实施交通图层之间切换的控制
   map.addControl(new AMap.MapType());
 
-  areaPath.value.forEach( (e,index)=> {
+
+  setPolygon(areaPath.value)
+  setMarker(marketPath.value)
+
+
+}).catch(e => {
+  console.log(e);
+})
+const setMarker = (e)=>{
+  let markers =  map.getAllOverlays('marker');
+  map.remove(markers)
+  e.forEach(val=>{
+    let marker = new AMap.Marker({
+      position: val,
+      anchor: 'bottom-center',
+      offset: new AMap.Pixel(0, 0)
+    });
+    marker.setTitle('我是marker的title');
+    console.log((areaPath.value))
+    let isPointInRing = false
+    areaPath.value.forEach(res=>{
+      if(AMap.GeometryUtil.isPointInRing(val, res)){
+        isPointInRing=true
+      }
+    })
+
+    marker.setLabel({
+      direction: 'top',
+      offset: new AMap.Pixel(0, -10),  //设置文本标注偏移量
+      content: "" +isPointInRing,
+    });
+    marker.setMap(map);
+  })
+}
+const setPolygon = (res) => {
+  res.forEach((e, index) => {
     let polygon = new AMap.Polygon({path: e});
     map.add([polygon]);
     let polyEditor = new AMap.PolygonEditor(map);
     polyEditor.addAdsorbPolygons([polygon]);
-    polyEditor.on('add', function (data) {
-      console.log(data);
-      let polygon = data.target;
-      polyEditor.addAdsorbPolygons(polygon);
+    polygon.on('dblclick', () => {
+      polyEditor.setTarget(polygon);
+      polyEditor.open();
     })
     polyEditor.on('addnode', function (data) {
       // 获取区域坐标
       areaPath.value[index] = polyEditor.getTarget()._opts.path
+      setMarker(marketPath.value)
     })
     polyEditor.on('adjust', function (data) {
       // 获取区域坐标
       areaPath.value[index] = polyEditor.getTarget()._opts.path
+      setMarker(marketPath.value)
     })
-    polyEditor.setTarget(polygon);
-    polyEditor.open();
   })
+  setMarker(marketPath.value)
+}
 
+let createPolygon = () => {
+  let arr = []
+  map.add([new AMap.Polygon({path: arr})]);
+  let polyEditor = new AMap.PolygonEditor(map)
+  let index = areaPath.value.length
+  polyEditor.close();
+  polyEditor.setTarget();
+  polyEditor.open();
+  polyEditor.on('add', function (data) {
+    areaPath.value.push(data.target._opts.path)
+    // polyEditor.close();
+    // map.clearMap()
+    setPolygon(areaPath.value)
+  })
+  polyEditor.on('addnode', function (data) {
+    // 获取区域坐标
+    areaPath.value[index] = polyEditor.getTarget()._opts.path
+    setMarker(marketPath.value)
+  })
+  polyEditor.on('adjust', function (data) {
+    // 获取区域坐标
+    areaPath.value[index] = polyEditor.getTarget()._opts.path
+    setMarker(marketPath.value)
+  })
 
-
-}).catch(e => {
-  console.log(e);
-})
+}
 const getLine = () => {
   let list = areaPath.value
   let params = []
-  list.forEach((e,index)=>{
+  list.forEach((e, index) => {
     e.forEach(val => {
       params.push({
-        longitude:val[0],
-        latitude:val[1],
-        index:index
+        longitude: val[0],
+        latitude: val[1],
+        index: index
       })
     })
   })
@@ -140,4 +183,10 @@ const getLine = () => {
   width: 100%;
   height: calc(100vh - 190px);
 }
+
+.add {
+  position: absolute;
+  bottom: 15px;
+  right: 150px;
+}
 </style>