完成面状航线完整功能

src/views/demo/workmanagement/airlinemanagement/index.vue

@@ -447,9 +447,25 @@ element.style.bottom = '40px';
 
 
 // 编辑航线
-const startEditAirLine = (wayline,form) => {
+const startEditAirLine = (data,form,type) => {
+
+    // 航线文件template.kml配置信息
+    templateKmlConfig.value = data.template.kml.Document
+
+    // 航线wayline.wpml配置信息
+    waylineWpmlConfig.value = data.wayline.kml.Document;
+
+    // 航线表信息
+    waylineInfo.value = form;
+
+    // 航线表单
+    airLineForm.value = form;
+
+    // 设置模式为编辑模式
+    editMode.value = type;
 
     // 关闭全部窗口
+
     workPlanFormShow.value = false;
     ariLineShow.value = false;
     aircraftShow.value = false;
@@ -457,17 +473,6 @@ const startEditAirLine = (wayline,form) => {
     createAirLineShow.value = false;
 
 
-    editMode.value = "edit";
-
-    // 航线文件template.kml配置信息
-
-
-    // 航线表信息
-    waylineInfo.value = wayline;
-
-    // 航线表单
-    airLineForm.value = form;
-
 }
 
 </script>

src/views/demo/workmanagement/workplan/components/airLineList.vue

@@ -108,10 +108,10 @@
                                             <a-menu-item  @click="checkAriLine(item)" v-if="props.title == '选择航线'">
                                                 <a href="javascript:;">选择</a>
                                             </a-menu-item>
-                                            <a-menu-item  @click="airLineDetail(item)" v-if="props.title != '选择航线'">
+                                            <a-menu-item  @click="toEditAirLine(item,'edit')" v-if="props.title != '选择航线'">
                                                 <a href="javascript:;">预览</a>
                                             </a-menu-item>
-                                            <a-menu-item @click="toEditAirLine(item)" v-if="props.title != '选择航线'">
+                                            <a-menu-item @click="toEditAirLine(item,'edit')" v-if="props.title != '选择航线'">
                                                 <a href="javascript:;">编辑</a>
                                             </a-menu-item>
                                             <a-menu-item @click="downloadAirLine(item)" >
@@ -548,7 +548,7 @@
 
 
     // 编辑事件
-    const toEditAirLine =async (airLine) => {
+    const toEditAirLine =async (airLine,type) => {
 
         currentPreviewWayLine.value = airLine;
 
@@ -558,17 +558,20 @@
             // 解压kmz文件
             let xmlStr =await extractKmz(response.data);
 
-            console.log("xmlStr",xmlStr);
-            
-            return null;
-
-            let xmlData = xmlStr.replace(/wpml:/g,"");
+            // 去除 wpml 前缀
+            let removeWpmlXmlStr = {
+                template:xmlStr.template.replace(/wpml:/g,""),
+                wayline:xmlStr.wayline.replace(/wpml:/g,"")
+            }
 
+            // 转换成josn数据
             const parser = new XMLParser();
-            const jsonObj = parser.parse(xmlData);
-
-
-            emit("startEditAirLine",jsonObj.kml.Document,currentPreviewWayLine.value)
+            let xmlObj = {
+                template:parser.parse(removeWpmlXmlStr.template),
+                wayline:parser.parse(removeWpmlXmlStr.wayline),
+            }
+            
+            emit("startEditAirLine",xmlObj,currentPreviewWayLine.value,type)
 
         }catch(e){
             console.error(e);

src/views/demo/workmanagement/workplan/components/map.vue

@@ -223,10 +223,12 @@
   })
 
 
+
+
   watch(
     () => props.editMode,
     (newVal,oldVal)=>{
-      if(newVal == 'edit'){
+      if(newVal == 'edit' ){
         handlerEditPolygonAirLine();
       }
     }
@@ -716,7 +718,7 @@ const initMap = () => {
     // loadChangGuangLayer();
 
     // 图层回显
-    if(props.editMode == 'edit'){
+    if(props.editMode == 'edit' ){
       handlerEditPolygonAirLine();
     }
 
@@ -1328,16 +1330,18 @@ const handlerLoadtextLabelGraphicLayer = (info) => {
 // 编辑回显航线
 const handlerEditPolygonAirLine =async () => {
 
-  // 设置参考起飞点
+  // 解析和设置参考起飞点
 
-  takeOffPointPosition.value = [props.airLineForm.taskOffLng,props.airLineForm.taskOffLat,props.airLineForm?.taskOffAlt ? props.airLineForm?.taskOffAlt : 71]
+  let takeoffArray = props.templateKmlConfig.missionConfig.takeOffRefPoint.split(",");
+
+  takeOffPointPosition.value = [parseFloat(takeoffArray[1]),parseFloat(takeoffArray[0]),parseFloat(takeoffArray[2])]
   
-  polygonAirForm.value.startingPoint = [props.airLineForm.taskOffLng,props.airLineForm.taskOffLat,props.airLineForm?.taskOffAlt ? props.airLineForm?.taskOffAlt : 71];
+  polygonAirForm.value.startingPoint = [parseFloat(takeoffArray[1]),parseFloat(takeoffArray[0]),parseFloat(takeoffArray[2])];
 
   takeOffPointGraphicLayer ? takeOffPointGraphicLayer.clear() : null;
 
   let startFlyGraphic = new mars3d.graphic.BillboardEntity({
-    position:[props.airLineForm.taskOffLng,props.airLineForm.taskOffLat],
+    position:takeOffPointPosition.value,
     style: {
       image: '/map/start.png',
       horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
@@ -1356,17 +1360,39 @@ const handlerEditPolygonAirLine =async () => {
 
   takeOffPointGraphicLayer.addGraphic(startFlyGraphic);
 
-  // 加载测区
-  let areaJson = WktToGeojson(props.airLineForm.flyToFirstPointMode)
-  polygonGeoJson.value = areaJson.coordinates[0];
+  // 处理 和 加载测区数据
+
+  let coordinateArray = props.templateKmlConfig.Folder.Placemark.Polygon.outerBoundaryIs.LinearRing.coordinates.split("\n");
+
+  let geomtryCoorinate = [];
+
+  coordinateArray.forEach((item,index)=>{
+     let trimStr = item.trim();
+     let arr = trimStr.split(",")
+     for(let i=0;i<arr.length;i++){
+        arr[i] = parseFloat(arr[i])
+     }
+     geomtryCoorinate.push(arr);
+  })
+
+  geomtryCoorinate.push(geomtryCoorinate[0])
+
+  let geometry = {
+        "type": "Polygon",
+        "coordinates": [geomtryCoorinate]
+    }
+
+
+  // let areaJson = WktToGeojson(props.airLineForm.flyToFirstPointMode)
+  polygonGeoJson.value = geometry.coordinates[0];
 
   let geojsonData = {
     "type": "FeatureCollection",
     "features": [
       {
         "type": "Feature",
-        "geometry": areaJson,
-      },
+        "geometry": geometry
+      }
     ]
   }
 
@@ -1386,10 +1412,11 @@ const handlerEditPolygonAirLine =async () => {
   })
   
   // 加载文本标注
-  handlerGetPolygonBorderInfo(areaJson.coordinates[0])
+  handlerGetPolygonBorderInfo(geometry.coordinates[0])
 
   // 加载航线
   let placemark = props.waylineInfo?.Folder?.Placemark
+
   placemark?.forEach((item, index) => {
       let coordinate = item.Point.coordinates.split(',');
       let airPointInfo = {