From caa837daf8e35abd0b0dcfccb5bff10dceb6707c Mon Sep 17 00:00:00 2001
From: tk <szdot@live.com>
Date: Fri, 11 Oct 2024 14:38:46 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E7=B1=BB=20=20=E5=9E=8B=E3=80=91?=
 =?UTF-8?q?=EF=BC=9Afeat=20=E5=85=B3=E9=97=AD=E7=82=B9=E9=A3=9E=E7=AA=97?=
 =?UTF-8?q?=E5=8F=A3=E6=97=B6=20=E4=B9=9F=E5=90=8C=E6=97=B6=E5=88=A0?=
 =?UTF-8?q?=E9=99=A4=20=E7=82=B9=E9=A3=9E=E7=9A=84=E5=9B=BE=E6=A0=87=20?=
 =?UTF-8?q?=E3=80=90=E5=8E=9F=20=20=E5=9B=A0=E3=80=91=EF=BC=9A=20=E3=80=90?=
 =?UTF-8?q?=E8=BF=87=20=20=E7=A8=8B=E3=80=91=EF=BC=9A=20=E3=80=90=E5=BD=B1?=
 =?UTF-8?q?=20=20=E5=93=8D=E3=80=91=EF=BC=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

# 类型 包含:
# feat：新功能（feature）
# fix：修补bug
# docs：文档（documentation）
# style： 格式（不影响代码运行的变动）
# refactor：重构（即不是新增功能，也不是修改bug的代码变动）
# test：增加测试
# chore：构建过程或辅助工具的变动
---
 src/components/MapBox.vue                     | 25 ++++++++++++-------
 .../layout/components/main/planes/index.vue   | 14 +++++++----
 2 files changed, 25 insertions(+), 14 deletions(-)

diff --git a/src/components/MapBox.vue b/src/components/MapBox.vue
index 9aa830a..88ee9e5 100644
--- a/src/components/MapBox.vue
+++ b/src/components/MapBox.vue
@@ -21,6 +21,7 @@ export default {
       takeoffLonLats: [], // 航线 第一个航点 起点 最后一个航点
       isflow: false, // 飞机经纬度变化时是否跟随飞机
       currentStyleIndex: 0, // 当前选中的地图样式索引
+      guidedMarker: null, // 指点飞行地图标记
       // 地图样式
       mapStyles: [
         // mapbox官方样式 卫星地图
@@ -234,7 +235,7 @@ export default {
               lat: this.map.unproject(currentPoint).lat
             }
             this.$emit('longPress', lonLat) // 将经纬度信息传递到组件外部
-            this.makeGuidedMarker(lonLat, this.map) // 创建标记
+            this.makeGuidedMarker(lonLat) // 创建标记
           }
         })
         // 触摸屏操作
@@ -256,7 +257,7 @@ export default {
               lat: this.map.unproject(currentPoint).lat
             }
             this.$emit('longPress', lonLat) // 将经纬度信息传递到组件外部
-            this.makeGuidedMarker(lonLat, this.map) // 创建标记
+            this.makeGuidedMarker(lonLat) // 创建标记
           }
         })
       }
@@ -559,20 +560,26 @@ export default {
     /**
      * @abstract 创建指点飞行标记
      * @param {Array} lonLat - 经纬度数组，格式为 [longitude, latitude]
-     * @param {Object} map - mapboxgl 的地图实例
      */
-    makeGuidedMarker (lonLat, map) {
+    makeGuidedMarker (lonLat) {
       // 删除之前的所有标记
-      if (this.guidedMarker) {
-        this.guidedMarker.remove()
-        this.guidedMarker = null // 清除当前标记
-      }
+      this.delGuidedMarker()
+
       // 创建一个标记对象
       this.guidedMarker = new mapboxgl.Marker({
         draggable: false// 关闭拖拽
       })
         .setLngLat(lonLat)
-        .addTo(map)
+        .addTo(this.map)
+    },
+    /**
+     * @abstract 删除指点飞行标记
+     */
+    delGuidedMarker () {
+      if (this.guidedMarker) {
+        this.guidedMarker.remove()
+        this.guidedMarker = null // 清除当前标记
+      }
     },
     /**
      * @description: 创建飞机轨迹 ps:原理删除之前的轨迹 重新绘制
diff --git a/src/views/layout/components/main/planes/index.vue b/src/views/layout/components/main/planes/index.vue
index b1a8cb6..ba25028 100644
--- a/src/views/layout/components/main/planes/index.vue
+++ b/src/views/layout/components/main/planes/index.vue
@@ -14,11 +14,12 @@
       @open="openCallback">
       <!-- 点飞设置弹出框 -->
       <template v-if="dialogItem == 'guidedBox'">
-        <template>
-          <font>高度设置</font>
-          <el-input-number v-model="guidedAlt" label="高度设置"></el-input-number>
-          <font class="m-l-5">米</font>
-        </template>
+        <el-form label-position="left">
+          <el-form-item label="高度设置" label-width="80px">
+            <el-input-number v-model="guidedAlt" label="高度设置"></el-input-number>
+            <font class="m-l-5">米</font>
+          </el-form-item>
+        </el-form>
         <span slot="footer" class="dialog-footer">
           <el-button size="medium" @click="dialogVisible = false">关闭</el-button>
           <el-button size="medium" type="primary"
@@ -83,6 +84,9 @@ export default {
   methods: {
     /** 弹出框 关闭事件回调 */
     closeCallback () {
+      if (this.dialogItem === 'guidedBox') { // 关闭点飞窗口时
+        this.$refs.mapbox.delGuidedMarker()// 删除所有点飞的地图标记
+      }
       this.dialogVisible = false
       this.dialogItem = ''
     },