merge

src/api/sys/workplan.ts

@@ -22,7 +22,13 @@ enum Api{
     EditAirLine = '/api/Manage/EditAirLine',
     GetAirLine = '/api/Manage/GetAirLine',
     DeleteAirLine = '/api/Manage/DeleteAirLine',
-    UploadXmlFile = '/api/Manage/UploadXmlFile/upload'
+    UploadXmlFile = '/api/Manage/UploadXmlFile/upload',
+
+
+    // 文件目录
+    ListAirLineFolder = '/api/Manage/ListAirLineFolder',
+    DeleteAirLineFolder = '/api/Manage/DeleteAirLineFolder',
+    CreateAirLineFolder = '/api/Manage/CreateAirLineFolder'
 
 }
 
@@ -89,3 +95,21 @@ export function deleteAirLine(params){
 }
 
 
+// 文件目录
+export function getListAirLineFolder(params) {
+  return defHttp.get({ url: Api.ListAirLineFolder, params });
+}
+
+export function deleteAirLineFolder(params){
+  return defHttp.post({ url: Api.DeleteAirLineFolder+"?folderId="+params.folderId });
+}
+
+export function createAirLineFolder(params){
+  return defHttp.post({ url: Api.CreateAirLineFolder, params });
+}
+
+
+
+
+
+

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

@@ -61,7 +61,7 @@
             <div class="file-container">
                 <div class="tip">
                     <div class="info">文件夹</div>
-                    <div>
+                    <div @click="createFolder">
                         <FileAddOutlined />
                     </div>
                 </div>
@@ -70,7 +70,17 @@
                         multiple
                         :tree-data="treeData"
                         :defaultExpandAll="true"
-                    ></a-directory-tree>
+                        :autoExpandParent="true"
+                        :field-names="fieldNames"
+                       
+                    >
+                    <template #title="{ data }">
+                        <span  @click="folderClick(data)">{{ data.path }}</span>
+                        <span class="tree-node-actions" @click="deleteFolder(data)">
+                            <DeleteOutlined />
+                        </span>
+                      </template>
+                </a-directory-tree>
                 </div>
             </div>
             <div class="routers-list">
@@ -101,9 +111,9 @@
                                             <a-menu-item  @click="airLineDetail(item)" >
                                                 <a href="javascript:;">预览</a>
                                             </a-menu-item>
-                                            <a-menu-item>
+                                            <!-- <a-menu-item>
                                                 <a href="javascript:;">编辑</a>
-                                            </a-menu-item>
+                                            </a-menu-item> -->
                                             <a-menu-item @click="deletePlan(item.id)">
                                                 <a href="javascript:;">删除</a>
                                             </a-menu-item>
@@ -185,13 +195,30 @@
                 </div>
             </div>
         </div>
+
+        <!-- 创建目录弹窗 -->
+        <Modal
+            title="添加目录"
+            :open="visible"
+            @ok="handleGetData"
+            @cancel="handleCancel"
+            :destroyOnClose="true"
+            :width="200"
+            
+        >
+          
+            <div style="padding:40px;">
+                <div> 文件名称：</div>
+                <a-input v-model:value="createFolderForm.folderName"></a-input>
+            </div>
+        </Modal>
     </div>    
 </template>
 <script lang="ts" setup>
-    import { ExclamationCircleOutlined,PlusOutlined,FileAddOutlined,LeftOutlined,ImportOutlined,MoreOutlined,EditOutlined,InboxOutlined } from '@ant-design/icons-vue';
+    import { DeleteOutlined,ExclamationCircleOutlined,PlusOutlined,FileAddOutlined,LeftOutlined,ImportOutlined,MoreOutlined,EditOutlined,InboxOutlined } from '@ant-design/icons-vue';
     import {ref,defineEmits,defineProps,createVNode} from 'vue'
     
-    import { getAirLineList,uploadXmlFile,deleteAirLine,addAirLine} from '@/api/sys/workplan';
+    import { getAirLineList,uploadXmlFile,deleteAirLine,addAirLine,getListAirLineFolder,deleteAirLineFolder,createAirLineFolder} from '@/api/sys/workplan';
     import { Modal, message } from 'ant-design-vue';
     const emit = defineEmits(["checkAriLine","createAirLine","previewAirLine","closeAirLine"])
 
@@ -209,6 +236,11 @@
         emit("closeAirLine");
     }
 
+    const fieldNames = ref({
+        title: 'path',      
+        key: 'id',         
+        children: 'children'    
+    })
     // 上传文件
     const importAirLineShow = ref(false);
     const fileList = ref([]);
@@ -246,7 +278,8 @@
         "globalWayPointType": "",        // 全局航点类型 globalWaypointTurnMode  【toPointAndStopWithDiscontinuityCurvature】
         "ptzControlMode": "",            // 云台控制模式 
         "aircraftYawAngleMode": "",      // 飞行器偏航角模式  
-        "wpml": ""                       // 航线文件
+        "wpml": "",                      // 航线文件
+        "folder":null
     })
 
     const handleManualUpload = async () => {
@@ -261,6 +294,8 @@
       if(res){
 
         submitForm.value.wpml = res.path;
+        submitForm.value.folder = currentFolderPath.value
+
 
         let addAirLineRes =await addAirLine(submitForm.value);
 
@@ -354,7 +389,17 @@
                 ],
             }
         ]
-)
+    )
+
+    const getFolder = async () => {
+        let res = await getListAirLineFolder({});
+        treeData.value = res;
+        console.log("treeData",treeData.value);
+    }
+
+    getFolder();
+    
+
 
     const ariLineList = ref([])
     const ariLineCount = ref(0);
@@ -364,18 +409,16 @@
         UavTypeId:null,
         AirLineType:null,
         AirLineName:null,
+        Folder:null,
         page:1,
         limit:10,
         key:null,
      })
 
     const getAirList = async ()=>{
-
         let res = await getAirLineList(pageQuery.value);
-
         ariLineCount.value = res.total;
         ariLineList.value = res.items;
-    
     }
 
     getAirList();
@@ -400,12 +443,71 @@
             }
           },
         });
+    }
 
+    // 
+    const currentFolder = ref();
+    const currentFolderPath = ref(null);
+    // 选择目录
+    const folderClick = (item)=>{
+        pageQuery.value.Folder = item.ancestor;
+        currentFolderPath.value = item.ancestor;
+        currentFolder.value = item.id;
+        getAirList();
+    }
 
+    // 删除目录
+    const deleteFolder =async (data) => {
+        Modal.confirm({
+          title: '是否确认删除?',
+          icon: createVNode(ExclamationCircleOutlined),
+          onCancel() {},
+          async onOk() {
+            let res = await deleteAirLineFolder({folderId:data.id});
+            if(res){
+                message.success("操作成功!");
+                getAirList();
+            }else{
+                message.error("操作失败!");
+            }
+            getFolder();
+          },
+        });
     }
 
 
 
+    // 创建目录
+    const visible = ref(false);
+    const createFolderForm = ref({
+        folderName:null,
+        parentId:currentFolder.value
+    })
+    const createFolder = () => {   
+        visible.value = true;
+    }
+
+    const handleGetData =async ()=>{
+
+        createFolderForm.value.parentId = currentFolder.value
+
+        let res = await createAirLineFolder(createFolderForm.value);
+        if(res){
+            message.success("操作成功！");
+            getFolder();
+        }else{
+            message.error("操作失败！");
+        }
+
+        createFolderForm.value.folderName = null;
+        createFolderForm.value.parentId = null;
+        visible.value = false;
+    }
+    
+    
+    const handleCancel = ()=>{
+        visible.value = false;
+    }
 
 </script>
 <style scoped>
@@ -455,7 +557,7 @@
 }
 
 .file-container{
-    width:220px;
+    width:240px;
     border-right: 1px solid rgba(204, 204, 204, 0.227) ;
     padding:0px;
     display:flex;
@@ -812,4 +914,13 @@
 ::v-deep .anticon-delete{
     color:#fff!important;
 }
+
+.tree-node-actions{
+    display:inline-block;
+    float:right;
+    font-size:12px;
+}
+.tree-node-actions span{
+    margin:0px 2px;
+}
 </style>

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

@@ -463,6 +463,8 @@ const saveAirLine = ()=>{
 
         let xmlString3 = xmlString2.replace("<kml>",`<?xml version="1.0" encoding="UTF-8"?><kml xmlns="http://www.opengis.net/kml/2.2" xmlns:wpml="http://www.dji.com/wpmz/1.0.6">`)
 
+            console.log("xmlString3",xmlString3);
+            return null;
         handlerCreateFile(xmlString3);
 
     }

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

@@ -4,10 +4,10 @@
         <div class="title">
             <LeftOutlined @click="backPage" />
             <div>面状航线</div>
-            <SaveOutlined/>
+            <SaveOutlined @click="saveAirLine" />
 
             <div style="flex:1;">
-                <a-input v-model:value="submitForm.airLineName"  size="small" placeholder="航线名称" />
+                <a-input v-model:value="submitForm.airLineName"  size="middle" placeholder="航线名称" />
             </div>
         </div>
 
@@ -79,6 +79,15 @@
                 <div class="unit"> %</div>
             </div>
 
+
+            <div class="item">
+                <div class="label">航线间距</div>
+                <div class="content">
+                    <a-input style="width:100px;" placeholder="" v-model:value="calculatParam.spacing" disabled></a-input>
+                </div>
+                <div class="unit"> m</div>
+            </div>
+
             <div class="item">
                 <div class="label">主航线角度</div>
                 <div class="content">
@@ -237,6 +246,7 @@ const calculatParam = ref({
     overlapAngle:0,
     height:0,
     spacing:0,
+    safeyFlyHeight:20,
 })
 
 watch(
@@ -247,6 +257,8 @@ watch(
     {deep:true}
 )
 
+
+
 calculatParam.value.height = calculateHeight(calculatParam.value.gsd,uavModel['m4td']);
 
 calculatParam.value.spacing =  calculateSpacing(calculatParam.value.gsd,calculatParam.value.overlapY/100,uavModel['m4td'])
@@ -296,15 +308,81 @@ const missionConfig = ref(
 )
 
 
+
+watch(
+    () => missionConfig.value,
+    (newVal,oldVal) => {
+        calculatParam.value.safeyFlyHeight = missionConfig.value.takeOffSecurityHeight;
+    },
+    {deep:true}
+)
+
 // 航点基本信息
 const folder = ref({
     "templateId": 0,
     "executeHeightMode": "WGS84",
     "waylineId": 0,
-    "distance": 410.047576904297,
+    "distance": 1391.755859375,
-    "duration": 80.3239784240723,
+    "duration": 200.941531419754,
-    "autoFlightSpeed": 10,
+    "autoFlightSpeed": 8.2,
-    "Placemark":[]
+    "startActionGroup": {
+        "action": [
+            {
+                "actionId": 0,
+                "actionActuatorFunc": "gimbalRotate",
+                "actionActuatorFuncParam": {
+                    "gimbalHeadingYawBase": "aircraft",
+                    "gimbalRotateMode": "absoluteAngle",
+                    "gimbalPitchRotateEnable": 1,
+                    "gimbalPitchRotateAngle": -90,
+                    "gimbalRollRotateEnable": 0,
+                    "gimbalRollRotateAngle": 0,
+                    "gimbalYawRotateEnable": 1,
+                    "gimbalYawRotateAngle": 0,
+                    "gimbalRotateTimeEnable": 0,
+                    "gimbalRotateTime": 10,
+                    "payloadPositionIndex": 0
+                }
+            },
+            {
+                "actionId": 1,
+                "actionActuatorFunc": "hover",
+                "actionActuatorFuncParam": {
+                    "hoverTime": 0.5
+                }
+            },
+            {
+                "actionId": 2,
+                "actionActuatorFunc": "setFocusType",
+                "actionActuatorFuncParam": {
+                    "cameraFocusType": "manual",
+                    "payloadPositionIndex": 0
+                }
+            },
+            {
+                "actionId": 3,
+                "actionActuatorFunc": "focus",
+                "actionActuatorFuncParam": {
+                    "focusX": 0,
+                    "focusY": 0,
+                    "focusRegionWidth": 0,
+                    "focusRegionHeight": 0,
+                    "isPointFocus": 0,
+                    "isInfiniteFocus": 1,
+                    "payloadPositionIndex": 0,
+                    "isCalibrationFocus": 0
+                }
+            },
+            {
+                "actionId": 4,
+                "actionActuatorFunc": "hover",
+                "actionActuatorFuncParam": {
+                    "hoverTime": 1
+                }
+            }
+        ]
+    },
+    Placemark:[]
 })
 
 // 航点详细信息
@@ -413,16 +491,18 @@ const pointInfo =  {
 const handlerPointInfo = ()=>{
 
     if(props.airPoints?.length<=0){
-        message.warning("请添加航点！");
+        message.warning("请绘制航测区域！");
         return null;
     }
+
+    let placemarkArray = [];
     props.airPoints?.forEach((item,index)=>{
         let point = {
             "Point": {
                 "coordinates": item.lng+","+item.lat    // 坐标
             },
             "index": index,                                                 // 序号
-            "executeHeight": 167,                                       // 高度
+            "executeHeight": item.alt,                                       // 高度
             "waypointSpeed": 12.7125370218057,                          // 飞行速度
             "waypointHeadingParam": {                                   // 飞行器参数
                 "waypointHeadingMode": "followWayline",                 // 偏航角模式  和航线角度一致         
@@ -516,9 +596,11 @@ const handlerPointInfo = ()=>{
             "isRisky": 0,
             "waypointWorkType": 0
         }
+        placemarkArray.push(point);
         
-        folder.value.Placemark?.push(point);
+    });
-    })
+
+    folder.value.Placemark = placemarkArray;
 
     return true;
 
@@ -544,18 +626,27 @@ const saveAirLine = ()=>{
     let handlerResult =  handlerPointInfo();
 
     if(handlerResult){
+
         const builder = new XMLBuilder();
 
         let lineData = {...waylinesJson.value}
 
         let obj = handlerPrefixWpml(lineData);
         
+        console.log("obj1234",obj);
+
         let xmlString = builder.build(obj);
 
         let xmlString2 = xmlString.replace(/<\/?\d+>/g, "")
 
         let xmlString3 = xmlString2.replace("<kml>",`<?xml version="1.0" encoding="UTF-8"?><kml xmlns="http://www.opengis.net/kml/2.2" xmlns:wpml="http://www.dji.com/wpmz/1.0.6">`)
 
+        convertXmlToWmpl(xmlString3);
+
+        console.log("xmlString3",xmlString3);
+
+        return null;
+
         handlerCreateFile(xmlString3);
 
     }
@@ -564,8 +655,9 @@ const saveAirLine = ()=>{
 
 // 处理wmpl:前缀 
 const handlerPrefixWpml = (obj) => {
-  for (const key in obj) {
+    console.log("obj123",obj);
 
+  for (const key in obj) {
     // 如果是对象
     if (typeof obj[key] === 'object' && obj[key] !== null) {
 
@@ -573,7 +665,6 @@ const handlerPrefixWpml = (obj) => {
 
         const newAttrs = {};
         for (const attrName in obj[key]) {
-           
             // 检查属性名是否首字母小写
             if (/^[a-z]/.test(attrName)) {
                 newAttrs[`wmpl:${attrName}`] = obj[key][attrName];
@@ -611,10 +702,13 @@ const submitForm = ref({
 
 // 生成xml文件，创建航线
 const handlerCreateFile =async (content)=>{
+
     const blob = new Blob([content], { type: 'wmpl/plain' });
+
     // 创建FormData对象用于上传
     const formData = new FormData();
     formData.append('xmlFile', blob);
+
     let res = await uploadXmlFile(formData);
     if(res){
         submitForm.value.wpml = res.path;
@@ -630,6 +724,17 @@ const handlerCreateFile =async (content)=>{
     }
 }
 
+// xml文本转换为wmpl和kml文件
+const convertXmlToWmpl = (xmlString)=>{
+
+    const parser = new DOMParser();
+
+    const xmlDoc = parser.parseFromString(xmlString, "text/xml");
+
+    console.log();
+
+    console.log(xmlDoc);
+}
 // 退出绘制
 const backPage = ()=>{
     emits("exitDraw")

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

@@ -95,27 +95,31 @@
             name:"面状航线",
             checked:false,
             icon:'<svg t="1749104746320" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7498" width="40" height="40"><path d="M918.485333 261.930667L857.813333 208.64a20.992 20.992 0 0 0-27.008 0L770.133333 261.973333a15.36 15.36 0 0 0 0 23.68 20.48 20.48 0 0 0 13.482667 4.906667 20.48 20.48 0 0 0 13.525333-4.906667l15.36-13.482666v141.994666c0 15.402667 14.250667 27.904 31.786667 27.904 17.578667 0 31.829333-12.501333 31.829333-27.904V272.128l15.36 13.482667a20.48 20.48 0 0 0 13.482667 4.906666 20.48 20.48 0 0 0 13.525333-4.906666 15.36 15.36 0 0 0 0-23.68z m-277.461333 159.146666c0 15.445333 14.250667 27.946667 31.829333 27.946667s31.829333-12.501333 31.829334-27.946667V346.325333c0-31.786667-11.349333-61.952-31.914667-84.906666a115.328 115.328 0 0 0-85.632-38.698667c-32.426667 0-63.573333 14.08-85.632 38.698667a126.848 126.848 0 0 0-31.914667 84.906666v335.530667c0 36.693333-24.704 67.754667-53.888 67.754667-29.226667 0-53.930667-31.061333-53.930666-67.754667V355.498667l0.469333-7.68 0.042667-1.493334c0-31.786667-11.306667-61.952-31.914667-84.906666a115.328 115.328 0 0 0-85.632-38.698667c-32.384 0-63.573333 14.08-85.632 38.698667a126.848 126.848 0 0 0-31.914667 84.906666v138.496c0 15.402667 14.250667 27.904 31.829334 27.904s31.829333-12.501333 31.829333-27.904V346.325333c0-36.693333 24.704-67.754667 53.888-67.754666 29.013333 0 53.589333 30.634667 53.930667 67.072l-0.512 8.405333v327.808c0 31.786667 11.306667 61.952 31.914666 84.906667a115.328 115.328 0 0 0 85.632 38.698666c32.384 0 63.573333-14.08 85.632-38.698666a126.848 126.848 0 0 0 31.914667-84.906667V346.325333c0-36.693333 24.661333-67.754667 53.888-67.754666 29.226667 0 53.888 31.018667 53.888 67.754666V421.12z" p-id="7499" fill="#ffffff"></path><path d="M858.453333 786.432l72.106667-122.624a27.861333 27.861333 0 0 0 0-28.288l-72.106667-122.624a28.928 28.928 0 0 0-24.96-14.165333h-144.128a28.928 28.928 0 0 0-24.96 14.165333l-72.106666 122.624a27.861333 27.861333 0 0 0 0 28.288l72.106666 122.624c5.12 8.746667 14.634667 14.165333 24.96 14.165333h144.128a28.928 28.928 0 0 0 24.96-14.165333z m-152.32-231.04h110.805334l55.466666 94.293333-55.466666 94.293334H706.133333l-55.424-94.293334 55.466667-94.293333z" p-id="7500" fill="#ffffff"></path><path d="M703.786667 650.410667a57.173333 57.173333 0 0 0 57.642666 56.618666 57.173333 57.173333 0 0 0 57.642667-56.618666 57.173333 57.173333 0 0 0-57.642667-56.618667 57.173333 57.173333 0 0 0-57.642666 56.618667z m57.6 14.165333q1.408 0 2.816-0.298667 1.408-0.256 2.688-0.810666 1.322667-0.512 2.517333-1.28 1.194667-0.768 2.176-1.749334 1.024-1.024 1.792-2.133333 0.810667-1.194667 1.322667-2.474667 0.554667-1.28 0.853333-2.645333 0.256-1.365333 0.256-2.773333t-0.256-2.773334q-0.298667-1.365333-0.853333-2.645333-0.512-1.28-1.28-2.432-0.853333-1.194667-1.834667-2.133333-0.981333-1.024-2.176-1.792-1.194667-0.768-2.517333-1.28-1.28-0.554667-2.688-0.853334-1.408-0.256-2.816-0.256t-2.816 0.256q-1.365333 0.298667-2.688 0.853334-1.28 0.512-2.517334 1.28-1.152 0.768-2.133333 1.749333-1.024 0.981333-1.834667 2.133333-0.768 1.194667-1.322666 2.474667-0.554667 1.28-0.853334 2.645333-0.256 1.365333-0.256 2.773334t0.298667 2.773333q0.256 1.365333 0.810667 2.645333t1.322666 2.432q0.810667 1.152 1.792 2.133334 1.024 1.024 2.176 1.792 1.194667 0.768 2.517334 1.28 1.28 0.554667 2.688 0.853333 1.408 0.256 2.816 0.256z" p-id="7501" fill="#ffffff"></path><path d="M162.389333 510.464a43.690667 43.690667 0 1 1 0 87.381333 43.690667 43.690667 0 0 1 0-87.381333z m0-37.632c-44.8 0-81.322667 36.48-81.322666 81.322667 0 44.8 36.48 81.322667 81.322666 81.322666s81.322667-36.48 81.322667-81.322666-36.48-81.322667-81.322667-81.322667z" p-id="7502" fill="#ffffff"></path><path d="M234.112 554.154667q0-29.653333-21.034667-50.688t-50.688-21.034667q-29.653333 0-50.688 21.034667-20.992 21.034667-20.992 50.688t20.992 50.645333q21.034667 21.034667 50.688 21.034667t50.688-21.034667q21.034667-20.992 21.034667-50.645333z m19.2 0q0 37.589333-26.666667 64.256-26.624 26.666667-64.256 26.666666-37.589333 0-64.256-26.666666t-26.666666-64.256q0-37.632 26.666666-64.256 26.666667-26.666667 64.256-26.666667 37.632 0 64.256 26.666667 26.666667 26.624 26.666667 64.256z m-144.213333 0q0-22.101333 15.616-37.717334t37.674666-15.616q22.101333 0 37.717334 15.616t15.616 37.717334q0 22.058667-15.616 37.674666t-37.717334 15.616q-22.058667 0-37.674666-15.616t-15.616-37.674666z m19.2 0q0 14.08 9.984 24.106666 9.984 9.984 24.106666 9.984 14.122667 0 24.106667-9.984 9.984-9.984 9.984-24.106666 0-14.122667-9.984-24.106667-9.984-9.984-24.106667-9.984-14.08 0-24.106666 9.984-9.984 9.984-9.984 24.106667z" p-id="7503" fill="#ffffff"></path></svg>',
-        },{
+        },
-            name:"带状航线",
+        // {
-            checked:false,
+        //     name:"带状航线",
-            icon:'<svg t="1749104685102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6766" width="40" height="40"><path d="M712.313523 0.469118v51.176544c-208.544417 0-446.600641 148.795802-446.600641 279.040107 0 41.197118 9.552955 70.367748 31.68681 107.342801l7.25001 11.600017 17.314731 27.422098 3.497064 5.714714c31.729457 53.820666 34.075049 100.007497-2.004415 164.959061-51.38978 92.458956-145.682562 173.914956-282.281288 244.965057l-18.039731 9.211778L0.234559 856.098288c137.920786-68.960393 230.507684-146.919329 278.485694-233.237099 26.867686-48.404481 25.502978-75.314814 2.644122-114.123694l-21.579443-34.20299-6.22648-10.107367c-26.611803-44.438299-39.022115-81.882471-39.022114-133.741369 0-162.059056 255.669485-324.629878 485.878638-330.088709L712.313523 0.469118z m49.470659 185.514973l22.901504 45.717712-18.892674 9.638249-16.845613 9.083837c-68.661863 38.126525-82.053059 63.288326-72.329516 121.757528 3.539711 21.110324 17.442672 42.775061 44.566241 71.092749l8.316188 8.529424 9.595602 9.425014 31.089751 29.852984c59.876557 57.744201 90.3266 98.514847 104.058973 153.231102 20.129441 80.645704 21.408854 148.326684 2.857357 203.000292l-3.966182 10.747074-47.508892-19.020616c18.039732-45.120653 18.039732-105.850152-1.066178-182.316438-10.022073-40.088293-33.307401-72.926575-80.219233-119.411936l-42.34859-40.813294-12.282371-12.154429a601.06851 601.06851 0 0 1-5.458831-5.62942c-33.648578-35.141227-52.498605-64.525093-58.128025-98.131023-14.926492-89.644246 14.07355-130.628129 114.592812-183.809088l21.067677-10.832368zM574.904502 797.970264v50.579484h-29.852984v-50.622131h29.852984z m0-136.513432v85.29424h-29.852984v-85.29424h29.852984z m-25.161801-139.882554c14.627962 30.492691 23.072092 58.767731 24.863271 87.511891l-29.852984 1.833826c-1.450002-24.479447-8.827954-49.172129-21.92062-76.466286z m-68.278039-119.028112l7.505893 14.286786 35.269168 58.213318-25.588272 15.352964-31.302986-51.517721a446.856524 446.856524 0 0 1-12.538253-22.858857l26.65445-13.47649zM458.264629 268.719504l25.75886 15.09708a192.082629 192.082629 0 0 0-15.99267 34.927991c-4.264712 12.836783-5.117654 24.820624-2.985298 37.955937l-29.426513 4.861772a106.191329 106.191329 0 0 1 4.136771-52.370663c4.776477-14.07355 11.002957-27.55004 18.50885-40.472117z m104.186914-99.282496l15.011786 25.844155a284.712174 284.712174 0 0 0-64.013327 49.641248l-21.707384-20.513265a314.351922 314.351922 0 0 1 70.708925-54.972138z m131.011953-51.261838l7.25001 29.000041a533.515472 533.515472 0 0 0-78.811878 26.014744l-11.642663-27.507393c25.588272-10.875016 53.436841-20.044146 83.161884-27.507392z" fill="#ffffff" p-id="6767"></path></svg>',
+        //     checked:false,
-        }
+        //     icon:'<svg t="1749104685102" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6766" width="40" height="40"><path d="M712.313523 0.469118v51.176544c-208.544417 0-446.600641 148.795802-446.600641 279.040107 0 41.197118 9.552955 70.367748 31.68681 107.342801l7.25001 11.600017 17.314731 27.422098 3.497064 5.714714c31.729457 53.820666 34.075049 100.007497-2.004415 164.959061-51.38978 92.458956-145.682562 173.914956-282.281288 244.965057l-18.039731 9.211778L0.234559 856.098288c137.920786-68.960393 230.507684-146.919329 278.485694-233.237099 26.867686-48.404481 25.502978-75.314814 2.644122-114.123694l-21.579443-34.20299-6.22648-10.107367c-26.611803-44.438299-39.022115-81.882471-39.022114-133.741369 0-162.059056 255.669485-324.629878 485.878638-330.088709L712.313523 0.469118z m49.470659 185.514973l22.901504 45.717712-18.892674 9.638249-16.845613 9.083837c-68.661863 38.126525-82.053059 63.288326-72.329516 121.757528 3.539711 21.110324 17.442672 42.775061 44.566241 71.092749l8.316188 8.529424 9.595602 9.425014 31.089751 29.852984c59.876557 57.744201 90.3266 98.514847 104.058973 153.231102 20.129441 80.645704 21.408854 148.326684 2.857357 203.000292l-3.966182 10.747074-47.508892-19.020616c18.039732-45.120653 18.039732-105.850152-1.066178-182.316438-10.022073-40.088293-33.307401-72.926575-80.219233-119.411936l-42.34859-40.813294-12.282371-12.154429a601.06851 601.06851 0 0 1-5.458831-5.62942c-33.648578-35.141227-52.498605-64.525093-58.128025-98.131023-14.926492-89.644246 14.07355-130.628129 114.592812-183.809088l21.067677-10.832368zM574.904502 797.970264v50.579484h-29.852984v-50.622131h29.852984z m0-136.513432v85.29424h-29.852984v-85.29424h29.852984z m-25.161801-139.882554c14.627962 30.492691 23.072092 58.767731 24.863271 87.511891l-29.852984 1.833826c-1.450002-24.479447-8.827954-49.172129-21.92062-76.466286z m-68.278039-119.028112l7.505893 14.286786 35.269168 58.213318-25.588272 15.352964-31.302986-51.517721a446.856524 446.856524 0 0 1-12.538253-22.858857l26.65445-13.47649zM458.264629 268.719504l25.75886 15.09708a192.082629 192.082629 0 0 0-15.99267 34.927991c-4.264712 12.836783-5.117654 24.820624-2.985298 37.955937l-29.426513 4.861772a106.191329 106.191329 0 0 1 4.136771-52.370663c4.776477-14.07355 11.002957-27.55004 18.50885-40.472117z m104.186914-99.282496l15.011786 25.844155a284.712174 284.712174 0 0 0-64.013327 49.641248l-21.707384-20.513265a314.351922 314.351922 0 0 1 70.708925-54.972138z m131.011953-51.261838l7.25001 29.000041a533.515472 533.515472 0 0 0-78.811878 26.014744l-11.642663-27.507393c25.588272-10.875016 53.436841-20.044146 83.161884-27.507392z" fill="#ffffff" p-id="6767"></path></svg>',
+        // }
     ])
 
     const airType = ref([
+        // {
+        //     name:"经纬 M30 系列",
+        //     checked:false,
+        // },{
+        //     name:"Mavic 3 行业系列",
+        //     checked:false,
+        // },
+        // {
+        //     name:"Matrice 3D 系列",
+        //     checked:false,
+        // },
+        // {
+        //     name:"Matrice 4 行业系列",
+        //     checked:false,
+        // },
         {
-            name:"经纬 M30 系列",
-            checked:false,
-        },{
-            name:"Mavic 3 行业系列",
-            checked:false,
-        },{
-            name:"Matrice 3D 系列",
-            checked:false,
-        },{
-            name:"Matrice 4 行业系列",
-            checked:false,
-        },{
             name:"Matrice 4D 系列",
             checked:false,
         }
@@ -125,7 +129,8 @@
         {
             name:"Matrice 4D",
             checked:false,
-        },{
+        },
+        {
             name:"Matrice 4TD",
             checked:false,
         }

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

@@ -20,7 +20,7 @@
                     </div>
 
                     <div class="group-container">
-                        <a-form-item ref="name" label="任务类型" name="taskType">
+                        <!-- <a-form-item ref="name" label="任务类型" name="taskType">
                             <div class="radio-box">
                                 <div v-for="(item,index) in taskTypeOptions" :key="index"
                                     :class=" submitForm.taskType == item.value ? 'radio-item-active':'radio-item'" 
@@ -29,7 +29,7 @@
                                     {{item.label}}
                                 </div>
                             </div>
-                        </a-form-item>
+                        </a-form-item> -->
     
                         <a-form-item ref="name" label="选择航线" name="name">
                             <a-button type="primary" style="width:100%;" @click="selectAriLine" v-show="!submitForm.airLineId">
@@ -80,8 +80,8 @@
     
                             <div class="radio-box">
                                 <div v-for="(item,index) in periodicFormulaOptions" :key="index"
-                                    :class=" submitForm.periodicFormula == item.value ? 'radio-item-active':'radio-item'" 
+                                    :class=" submitForm.taskType == item.value ? 'radio-item-active':'radio-item'" 
-                                    @click="submitForm.periodicFormula = item.value"
+                                    @click="submitForm.taskType = item.value"
                                     >
                                     {{item.label}}
                                 </div>
@@ -95,12 +95,12 @@
                         </a-form-item> 
 
                         <!-- 单次定时 -->
-                        <a-form-item v-if="submitForm.periodicFormula == 1" ref="accuracy" label="设置时间" name="accuracy">
+                        <a-form-item v-if="submitForm.taskType == 1" ref="accuracy" label="设置时间" name="accuracy">
                             <a-date-picker v-model:value="onceTime" valueFormat="YYYY-MM-DD HH:mm:ss" style="width:100%;" show-time placeholder="选择时间" @change="onOnceTimeChange"  />
                         </a-form-item> 
 
                         <!-- 重复定时 -->
-                        <div v-if="submitForm.periodicFormula == 2">
+                        <div v-if="submitForm.taskType == 2">
                             <a-form-item  ref="accuracy" label="选择日期" valueFormat="YYYY-M-D" name="accuracy">
                                 <a-range-picker v-model:value="repeatTime.date"  style="width:100%;"   @change="onRepeatDateChange" />
                             </a-form-item> 
@@ -492,17 +492,19 @@ const onOnceTimeChange = (e) => {
     let yearTime = time.getFullYear();
 
     let cronTime = secondTime+" "+minutisTime+" "+ hourTime+" "+ dayTime+" "+monthTime+" ? "+yearTime
+
+    submitForm.value.periodicFormula = cronTime;
 }
 
 
 // 选择日期
 const onRepeatDateChange = (e) =>{
-    console.log(e);
+    
 }
 
 // 选择时间
 const onRepeatTimeChange = (e) => {
-    console.log("123",e);
+    
 }
 
 // 重复定时
@@ -541,7 +543,7 @@ const handleRepeatTypeChange = (e)=>{
             break;
     }
 
-    submitForm.value.executeTime = cronTime;
+    submitForm.value.periodicFormula = cronTime;
 
 }
 

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

@@ -21,11 +21,13 @@
         :airInfo="airInfo"
         :polygonAirForm="polygonAirForm"
         :airRoute="props.airRoute"
+        :airPoints="airPoints"
         @calculatParamChange="calculatParamChange"
         @exitDraw="exitDraw"
       ></airPolygon>
     </div>
 
+
     <!-- 航点航线配置 -->
     <div class="airpoint-config-container" v-if="airPointConfigShow">
       <airPointConfig :currentAirPoint="currentAirPoint" ></airPointConfig>
@@ -147,11 +149,7 @@ const generatePreviewPoint = (placemark)=>{
       airPoints.value?.forEach((item, index) => {
         coordinates.push([item.lng, item.lat]);
       });
-
-      console.log('coordinates', coordinates);
-
       let line = turf.lineString(coordinates);
-
       preViewPolygonWayLine(line);
     }
   };
@@ -220,6 +218,7 @@ const generatePreviewPoint = (placemark)=>{
     drawGraphicLayer ? drawGraphicLayer.clear() : null;
     stickGroundPointLayer ? stickGroundPointLayer.clear() : null;
     lineGroundPointLayer ? lineGroundPointLayer.clear() : null;
+    labelGraphicLayer ? labelGraphicLayer.clear() : null;
     
     polygonGraphicLayer ? polygonGraphicLayer.clear() : null;
     polygonLineGraphicLayer ? polygonLineGraphicLayer.clear() : null;
@@ -268,7 +267,8 @@ const generatePreviewPoint = (placemark)=>{
     });
   });
 
-  const initMap = () => {
+// 初始化地图
+const initMap = () => {
   map = new mars3d.Map(vChartRef.value, {
     scene: {
       center: { lat: 35.132103, lng: 118.296315, alt: 260.9, heading: 357.9, pitch: -32 },
@@ -401,10 +401,6 @@ const generatePreviewPoint = (placemark)=>{
       isAutoEditing: false, // 是否自动激活编辑
     });
 
-      drawGraphicLayer = new mars3d.layer.GraphicLayer({
-        isAutoEditing:false,
-      })
-
     graphicLayer.bindContextMenu([
       {
         text: '按轴平移',
@@ -436,7 +432,6 @@ const generatePreviewPoint = (placemark)=>{
             map.removeThing(moveTool);
             moveTool.destroy();
             moveTool = null;
-              console.log('moveTool', moveTool);
           }
         },
       },
@@ -450,6 +445,17 @@ const generatePreviewPoint = (placemark)=>{
     ]);
 
     map.addLayer(graphicLayer);
+
+
+    // 参考起飞点图层
+    drawGraphicLayer = new mars3d.layer.GraphicLayer({
+      isAutoEditing:true,
+    })
+
+    drawGraphicLayer.on(mars3d.EventType.editMovePoint, function (event) {
+        flyPointMove(event);
+    });
+
     map.addLayer(drawGraphicLayer);
 
     // 航点地面投影点
@@ -482,29 +488,14 @@ const generatePreviewPoint = (placemark)=>{
     }
     // 加载长光高清影像
     // loadChangGuangLayer();
+
     emits('mapOnLoad',map)
-    });
-  };
     
-// 加载长光卫星高分影像
-const loadChangGuangLayer = ()=>{
-    var layer = new mars3d.layer.XyzLayer({
-        url: "https://api.jl1mall.com/getMap/{z}/{x}/{reverseY}",
-        queryParameters:{
-            mk:"73ad26c4aa6957eef051ecc5a15308b4",
-            tk:"5538f710dfc641048a8bdf1a7f705cd1",
-            pro:"9297426cbe4c4ac2a01ca228a4ad30f7",
-            vf:0
-        },
-        minimumLevel: 1,
-        maximumLevel: 18,
-        zIndex:2,
   });
-    map.addLayer(layer);
+};
-}
 
-  // 绑定地图右键菜单
+// 绑定地图右键菜单
-  const handlerBindMapMenus = () => {
+const handlerBindMapMenus = () => {
   const mapContextmenuItems = [
     {
       text: '飞行到此处',
@@ -537,107 +528,37 @@ const loadChangGuangLayer = ()=>{
     },
   ];
   map.bindContextMenu(mapContextmenuItems);
-  };
+};
+
+///////////////////////////////图层和影像加载////////////////////////////////////////////
 
 
-
+// 加载长光卫星高分影像
-  // 航点移动
+const loadChangGuangLayer = ()=>{
-  const pointMove = (e, id) => {
+    var layer = new mars3d.layer.XyzLayer({
-    const cartographic = mars3d.Cesium.Cartographic.fromCartesian(e.position);
+        url: "https://api.jl1mall.com/getMap/{z}/{x}/{reverseY}",
-    const longitude = mars3d.Cesium.Math.toDegrees(cartographic.longitude);
+        queryParameters:{
-    const latitude = mars3d.Cesium.Math.toDegrees(cartographic.latitude);
+            mk:"73ad26c4aa6957eef051ecc5a15308b4",
-    const height = cartographic.height; // 高度（米）
+            tk:"5538f710dfc641048a8bdf1a7f705cd1",
-    let stickGraphic = stickGroundPointLayer.getGraphicById('stick' + id);
+            pro:"9297426cbe4c4ac2a01ca228a4ad30f7",
-    if (stickGraphic) {
+            vf:0
-      stickGraphic.setOptions({
-        position: [longitude, latitude],
-        style: {
-          color: '#f5f5f5',
-          pixelSize: 8,
-          outline: true,
-          outlineColor: '#f5f5f5',
-          outlineWidth: 1,
-          clampToGround: true,
         },
+        minimumLevel: 1,
+        maximumLevel: 18,
+        zIndex:2,
     });
-    }
+    map.addLayer(layer);
-    let lineGraphic = lineGroundPointLayer.getGraphicById('line' + id);
+}
-    if (lineGraphic) {
-      lineGraphic.setOptions({
-        positions: [
-          [longitude, latitude, height],
-          [longitude, latitude, 0],
-        ],
-        style: {
-          color: '#f5f5f5',
-          width: 1,
-        },
-      });
-    }
 
-    // 更新坐标数据
-    airPoints.value?.forEach((item, index) => {
-      if (item.id == id) {
-        airPoints.value[index].lng = longitude;
-        airPoints.value[index].lat = latitude;
-        airPoints.value[index].alt = height;
-      }
-    });
 
-    // 更新航线
+///////////////////////////////参考起飞点////////////////////////////////////////////
-    handlerDrawLine();
-  };
 
-  // 绘制航线
+// 全局参考起飞点
-  const handlerDrawLine = () => {
+const startPosition = ref(null);
-    let positions = [];
-
-    airPoints.value?.forEach((item, index) => {
-      positions.push([item.lng, item.lat, item.alt]);
-    });
-
-    positions.unshift([startPosition.value[0], startPosition.value[1], airPoints.value[0].alt]);
-
-    positions.unshift([startPosition.value[0], startPosition.value[1], startPosition.value[2]]);
-
-    // 判断是否已经绘制
-    if (positions.length > 1) {
-      let lineGraphic = graphicLayer.getGraphicById('pointsLine');
-
-      if (lineGraphic) {
-        lineGraphic.setOptions({
-          id: 'pointsLine',
-          positions: positions,
-          style: {
-            width: 2,
-            color: '#3388ff',
-          },
-        });
-      } else {
-        const graphic = new mars3d.graphic.PolylineEntity({
-          id: 'pointsLine',
-          positions: positions,
-          style: {
-            width: 2,
-            color: '#3388ff',
-          },
-        });
-        graphicLayer.addGraphic(graphic);
-      }
-    }
-
-    // 计算航线长度
-    // let lineString = turf.lineString(positions);
-    // lineInfo.value.length = turf.length(lineString).toFixed(2);
-  };
-
-  const startPosition = ref(null);
-
-  // 设置起飞点
-  const setFlyPoint = async () => {
-
-    drawGraphicLayer ? drawGraphicLayer.clear : null;
 
+// 设置起飞点
+const setFlyPoint = async () => {
+  drawGraphicLayer ? drawGraphicLayer.clear() : null;
   const graphic = await drawGraphicLayer.startDraw({
     type: 'billboardP',
     style: {
@@ -654,20 +575,60 @@ const loadChangGuangLayer = ()=>{
       },
     },
   });
-
   startPosition.value = graphic.toJSON().position;
-
   polygonAirForm.value.startingPoint = graphic.toJSON().position;
-  };
 
-  // 全局区域
+  // 更新航线
-  const polygonGeoJson = ref();
+  updatePolygonLineByParams();
+};
 
-  // 绘制面状
+// 参考起飞点移动
-  const handlerDrawPolygon = async () => {
+const flyPointMove = (e) => {
+  let res = handlerGetLngLatHeight(e);
+  startPosition.value = [res.lng,res.lat,res.alt];
+  polygonAirForm.value.startingPoint = [res.lng,res.lat,res.alt];
+  // 更新航线
+  updatePolygonLineByParams();
+
+}
+
+// 处理Graphic鼠标事件返回信息
+const handlerGetLngLatHeight = (e)=>{
+
+  let cartographic = mars3d.Cesium.Cartographic.fromCartesian(e.cartesian);
+  let longitude = mars3d.Cesium.Math.toDegrees(cartographic.longitude);
+  let latitude = mars3d.Cesium.Math.toDegrees(cartographic.latitude);
+  let height = cartographic.height; 
+
+  let res = {
+    lng:longitude,
+    lat:latitude,
+    alt:height
+  }
+  return res;
+}
+
+///////////////////////////////面状航线计算////////////////////////////////////////////
+
+// 全局面状测区
+
+const polygonGeoJson = ref();
+
+const polygonCalculateParams = ref({
+    "gsd": 0,
+    "overlapY": 70,
+    "overlapX": 80,
+    "overlapAngle": 0,
+    "height": 0,
+    "spacing": 0,
+    "safeyFlyHeight":20,
+})
+
+// 绘制面状测区
+const handlerDrawPolygon = async () => {
   if (polygonGraphicLayer == null) {
       polygonGraphicLayer = new mars3d.layer.GraphicLayer({
-        isAutoEditing: false, // 是否自动激活编辑
+        isAutoEditing: true, // 是否自动激活编辑
       });
 
       polygonGraphicLayer.bindContextMenu([
@@ -679,6 +640,10 @@ const loadChangGuangLayer = ()=>{
           },
         },
       ]);
+
+      polygonGraphicLayer.on(mars3d.EventType.editMovePoint,(event)=>{
+        handlerPolygonEdit(event);
+      })
       map.addLayer(polygonGraphicLayer);
   }
 
@@ -701,19 +666,42 @@ const loadChangGuangLayer = ()=>{
   polygonGeoJson.value = coordinates;
 
   let polygon = turf.polygon([coordinates]);
-    let lines = generateScanLines(polygon, 0.005, 0);
 
-    // 绘制区域转存wkt
+  let spceing = parseFloat(polygonCalculateParams.value?.spacing) / 10000;
-    // let wkt = GeojsonToWkt(polygon.geometry);
+  let lines = generateScanLines(polygon,spceing, 0);
 
+  // 计算面积
   CalculateAreaInfo(polygon, lines);
-
   // 绘制面航线
   handlerDrawPolygonLine(lines);
-  };
+  // 计算边长等信息
+  handlerGetPolygonBorderInfo(polygonGeoJson.value);
+};
 
+// 测区编辑后重新计算航线
+const handlerPolygonEdit = (e)=>{
+
+  let coordinates = e.graphic.toJSON().positions;
+ 
+  coordinates.push(coordinates[0]);
+
+  polygonGeoJson.value = coordinates;
+
+  let polygon = turf.polygon([coordinates]);
+
+  let spceing = parseFloat(polygonCalculateParams.value?.spacing) / 10000;
+  let lines = generateScanLines(polygon,spceing, 0);
+
+  // 计算面积
+  CalculateAreaInfo(polygon, lines);
   // 绘制面航线
-  const handlerDrawPolygonLine = (lines) => {
+  handlerDrawPolygonLine(lines);
+  // 计算边长等信息
+  handlerGetPolygonBorderInfo(polygonGeoJson.value);
+
+}
+// 绘制面航线
+const handlerDrawPolygonLine = (lines) => {
 
   let nodeGraphic = polygonGraphicLayer.getGraphicById("polygon-node-1");
 
@@ -766,7 +754,7 @@ const loadChangGuangLayer = ()=>{
   lines.geometry.coordinates.unshift([
     polygonAirForm.value.startingPoint[0],
     polygonAirForm.value.startingPoint[1],
-      polygonAirForm.value.startingPoint[2] + 20,
+    polygonAirForm.value.startingPoint[2] + parseFloat(polygonCalculateParams.value.safeyFlyHeight),
   ]);
 
   lines.geometry.coordinates.unshift(polygonAirForm.value.startingPoint);
@@ -791,29 +779,13 @@ const loadChangGuangLayer = ()=>{
     });
     map.addLayer(polygonLineGraphicLayer);
   }
-  };
+};
 
-  // 删除面 和 面航线
+// 计算面航线
-  const handlerRemovePolygonArea = () => {
+function generateScanLines(polygon, spacing, angle = 0) {
-    if (polygonGraphicLayer) {
-      polygonGraphicLayer.clear();
-    }
-    if (polygonLineGraphicLayer) {
-      polygonLineGraphicLayer.clear();
-    }
-
-    airInfo.value = {
-      area: 0,
-      length: 0,
-      time: 0,
-      picture: '- -',
-    };
-  };
-
-  // 计算面航线
-  function generateScanLines(polygon, spacing, angle = 0) {
   
   if (!turf.booleanValid(polygon)) throw new Error('无效的多边形');
+
   spacing = Math.abs(spacing);
 
   // 获取多边形的旋转边界框
@@ -831,7 +803,7 @@ const loadChangGuangLayer = ()=>{
   const lines = [];
 
   for (let i = -1; i <= lineCount; i++) {
-      const y = bbox[1] + i * spacing * 0.1 - spacing * 0.1;
+    const y = bbox[1] + i * spacing * 0.11 - spacing * 0.11;
     lines.push(
       turf.lineString([
         [bbox[0] - spacing, y],
@@ -871,12 +843,31 @@ const loadChangGuangLayer = ()=>{
   });
 
   let connectedLine = connectLinesManual(turf.featureCollection(coverageLines));
-    console.log('connectedLine', connectedLine);
-    return connectedLine;
-  }
 
-  // 连接线段
+
-  const connectLinesManual = (lines) => {
+  // 将航点提取并添加到airPoints
+  airPoints.value = [];
+
+  connectedLine.geometry.coordinates?.forEach((item,index)=>{
+    let point = {
+        id: index,
+        lng: item[0],
+        lat: item[1],
+        alt: item[2],
+        aircraftHorizontalAngle: 0,
+        cameraHorizontalAngle: 0,
+        cameraVerticalAngle: 0,
+        focalLength: 1,
+    }
+    airPoints.value?.push(point);
+  })
+
+
+  return connectedLine;
+}
+
+// 处理面航线
+const connectLinesManual = (lines) => {
   // 确保输入是FeatureCollection
   if (lines.type !== 'FeatureCollection') {
     lines = turf.featureCollection([lines]);
@@ -885,9 +876,13 @@ const loadChangGuangLayer = ()=>{
   // 收集所有坐标点
   let allCoords = [];
   lines.features.forEach((line, index) => {
-      console.log('line.geometry.coordinates', line.geometry.coordinates);
+
+
+    // 相对起飞点高度
+    let relativeHeight = startPosition.value[2] + parseFloat(polygonCalculateParams.value.height);
+
     line.geometry.coordinates?.forEach((item, idx) => {
-        line.geometry.coordinates[idx].push(180);
+      line.geometry.coordinates[idx].push(relativeHeight);
     });
 
     if (line.geometry.type === 'LineString' && index % 2 == 0) {
@@ -897,7 +892,6 @@ const loadChangGuangLayer = ()=>{
     }
   });
 
-    console.log('allCoords', allCoords);
   // 移除连续重复的点
   const cleanedCoords = [];
   if (allCoords.length > 0) {
@@ -911,10 +905,10 @@ const loadChangGuangLayer = ()=>{
   }
 
   return turf.lineString(cleanedCoords);
-  };
+};
 
-  // 标绘起点
+// 标绘面状航线起点
-  const handlerDrawStartPoint = async () => {
+const handlerDrawStartPoint = async () => {
   graphic = await graphicLayer.startDraw({
     type: 'billboard',
     style: {
@@ -933,10 +927,10 @@ const loadChangGuangLayer = ()=>{
     },
   });
   // 设置贴地点 和 连接线
-  };
+};
 
-  // 计算面状测区信息
+// 计算面状测区面积、长度、完成用时、拍摄数量
-  const CalculateAreaInfo = (polygon, lines) => {
+const CalculateAreaInfo = (polygon, lines) => {
   // 测区面积
   airInfo.value.area = turf.area(polygon).toFixed(2);
 
@@ -949,14 +943,228 @@ const loadChangGuangLayer = ()=>{
   );
 
   // 照片数量
+};
+
+// 删除面状测区 和 面状航线
+const handlerRemovePolygonArea = () => {
+  if (polygonGraphicLayer) {
+    polygonGraphicLayer.clear();
+  }
+  if (polygonLineGraphicLayer) {
+    polygonLineGraphicLayer.clear();
+  }
+
+  labelGraphicLayer ? labelGraphicLayer.clear() : null;
+
+  polygonGeoJson.value = null;
+
+  airInfo.value = {
+    area: 0,
+    length: 0,
+    time: 0,
+    picture: '- -',
   };
+};
 
-    const uavPoints = ref([]);
+// 面状航线测区、参数改变
+const calculatParamChange = (params) => {
+    polygonCalculateParams.value = params;
+    
+    if(polygonGeoJson.value){
+      let polygon = turf.polygon([polygonGeoJson.value]);
+      let spceing = parseFloat(params.spacing) / 10000;
+      let angle = parseFloat(params.overlapAngle);
+      // 生成航线
+      let lines = generateScanLines(polygon, spceing,angle);
+      // 计算面积 长度
+      CalculateAreaInfo(polygon, lines);
+      // 绘制面航线
+      handlerDrawPolygonLine(lines);
+      // 计算边长等信息
+      handlerGetPolygonBorderInfo(polygonGeoJson.value);
+    }
+}
+
+// 根据参数更新面状航线
+const updatePolygonLineByParams = ()=>{
+
+  if(polygonGeoJson.value && polygonCalculateParams.value){
+      let polygon = turf.polygon([polygonGeoJson.value]);
+      let spceing = parseFloat(polygonCalculateParams.value.spacing) / 10000;
+      let angle = parseFloat(polygonCalculateParams.value.overlapAngle);
+      // 生成航线
+      let lines = generateScanLines(polygon, spceing,angle);
+      // 计算面积 长度
+      CalculateAreaInfo(polygon, lines);
+      // 绘制面航线
+      handlerDrawPolygonLine(lines);
+      // 计算边长等信息
+      handlerGetPolygonBorderInfo(polygonGeoJson.value);
+    }
+}
 
 
+// 计算绘制的多边形每条线的长度和中心点
+const polygonBorderInfo = ref([]);
+let labelGraphicLayer:mars3d.layer.GraphicLayer;
 
-    // 绘制航点
+// 计算测区各边长
-    const handlerDrawPoint = (e) => {
+const handlerGetPolygonBorderInfo = (polygonCoords) => {
+
+    // 创建Turf多边形对象
+    let polygon = turf.polygon([polygonCoords]);
+  
+    // 1. 计算边长
+    let coordinates = polygon.geometry.coordinates[0];
+    let edgeLengths = [];
+    
+    for (let i = 0; i < coordinates.length - 1; i++) {
+      let start = coordinates[i];
+      let end = coordinates[i + 1];
+      let distance = turf.distance(turf.point(start), turf.point(end), {units: 'meters'});
+      
+      let midpoint = turf.midpoint(start, end);
+
+      edgeLengths.push({
+        length: distance.toFixed(2),
+        center:midpoint?.geometry?.coordinates
+      });
+    }
+
+    handlerLoadLabelGraphicLayer(edgeLengths);
+    return edgeLengths;
+}
+
+// 绘制文本标注
+const handlerLoadLabelGraphicLayer = (info) => {
+
+  if(labelGraphicLayer == null){
+    labelGraphicLayer = new mars3d.layer.GraphicLayer({
+      isAutoEditing:false
+    })
+    map.addLayer(labelGraphicLayer);
+  }else{
+    labelGraphicLayer.clear();
+  }
+
+  info?.forEach((item,index)=>{
+    const graphic = new mars3d.graphic.LabelEntity({
+      position: [item.center[0], item.center[1], 0],
+      style: {
+        text: item.length+"m",
+        font_size: 15, 
+        scale: 1, 
+        font_family: "微软雅黑",
+        color: "#ffffff",
+        outline: true,
+        outlineColor: "#000000",
+        outlineWidth: 2,
+        horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
+        verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+        visibleDepth: false,
+        clampToGround:true,
+      },
+      attr: { remark: "示例1" }
+    })
+    labelGraphicLayer.addGraphic(graphic)
+  })
+}
+
+///////////////////////////////航点航线计算////////////////////////////////////////////
+// 航点移动
+const pointMove = (e, id) => {
+  const cartographic = mars3d.Cesium.Cartographic.fromCartesian(e.position);
+  const longitude = mars3d.Cesium.Math.toDegrees(cartographic.longitude);
+  const latitude = mars3d.Cesium.Math.toDegrees(cartographic.latitude);
+  const height = cartographic.height; // 高度（米）
+  let stickGraphic = stickGroundPointLayer.getGraphicById('stick' + id);
+  if (stickGraphic) {
+    stickGraphic.setOptions({
+      position: [longitude, latitude],
+      style: {
+        color: '#f5f5f5',
+        pixelSize: 8,
+        outline: true,
+        outlineColor: '#f5f5f5',
+        outlineWidth: 1,
+        clampToGround: true,
+      },
+    });
+  }
+  let lineGraphic = lineGroundPointLayer.getGraphicById('line' + id);
+  if (lineGraphic) {
+    lineGraphic.setOptions({
+      positions: [
+        [longitude, latitude, height],
+        [longitude, latitude, 0],
+      ],
+      style: {
+        color: '#f5f5f5',
+        width: 1,
+      },
+    });
+  }
+
+  // 更新坐标数据
+  airPoints.value?.forEach((item, index) => {
+    if (item.id == id) {
+      airPoints.value[index].lng = longitude;
+      airPoints.value[index].lat = latitude;
+      airPoints.value[index].alt = height;
+    }
+  });
+
+  // 更新航线
+  handlerDrawLine();
+};
+
+// 绘制航线
+const handlerDrawLine = () => {
+  let positions = [];
+
+  airPoints.value?.forEach((item, index) => {
+    positions.push([item.lng, item.lat, item.alt]);
+  });
+
+  positions.unshift([startPosition.value[0], startPosition.value[1], airPoints.value[0].alt]);
+
+  positions.unshift([startPosition.value[0], startPosition.value[1], startPosition.value[2]]);
+
+  // 判断是否已经绘制
+  if (positions.length > 1) {
+    let lineGraphic = graphicLayer.getGraphicById('pointsLine');
+
+    if (lineGraphic) {
+      lineGraphic.setOptions({
+        id: 'pointsLine',
+        positions: positions,
+        style: {
+          width: 2,
+          color: '#3388ff',
+        },
+      });
+    } else {
+      const graphic = new mars3d.graphic.PolylineEntity({
+        id: 'pointsLine',
+        positions: positions,
+        style: {
+          width: 2,
+          color: '#3388ff',
+        },
+      });
+      graphicLayer.addGraphic(graphic);
+    }
+  }
+
+  // 计算航线长度
+  // let lineString = turf.lineString(positions);
+  // lineInfo.value.length = turf.length(lineString).toFixed(2);
+};
+    
+const uavPoints = ref([]);
+
+// 绘制航点
+const handlerDrawPoint = (e) => {
     if (moveTool) {
         moveTool.destroy();
         moveTool = null;
@@ -1067,10 +1275,10 @@ const loadChangGuangLayer = ()=>{
 
     // 绘制航线
     handlerDrawLine();
-    };
+};
 
-    // 绘制镜头
+// 绘制镜头
-    const handlerDrawCamera = (e) => {
+const handlerDrawCamera = (e) => {
 
     // 判断是否已经添加
     const graphic = graphicLayer.getGraphicById("cameraGraphic");
@@ -1117,10 +1325,10 @@ const loadChangGuangLayer = ()=>{
         })
         graphicLayer.addGraphic(satelliteSensor)
     }
-    }
+}
 
-    // 更新航点
+// 更新航点
-    const updateAirPoint = (e) => {
+const updateAirPoint = (e) => {
     // 更新航点
     let graphic = graphicLayer.getGraphicById(e.id);
     if (graphic) {
@@ -1212,10 +1420,10 @@ const loadChangGuangLayer = ()=>{
 
     // 更新航线
     handlerDrawLine();
-    };
+};
 
-    // 删除航点
+// 删除航点
-    const deleteAirPoint = (e) => {
+const deleteAirPoint = (e) => {
     let id = e.graphic.id;
 
     // 删除航点
@@ -1239,12 +1447,12 @@ const loadChangGuangLayer = ()=>{
 
     // 更新航线
     handlerDrawLine();
-    };
+};
 
-    let stickGraphicLayer: mars3d.layer.GraphicLayer;
+let stickGraphicLayer: mars3d.layer.GraphicLayer;
 
-    // 飞行到此处
+// 飞行到此处
-    const flyToThere = (e) => {
+const flyToThere = (e) => {
     if (!uavGraphicLayer) {
     uavGraphicLayer = new mars3d.layer.GraphicLayer({
         isAutoEditing: false, // 是否自动激活编辑
@@ -1385,10 +1593,10 @@ const loadChangGuangLayer = ()=>{
     // 获取无人机的坐标并返回
     let flyToPosition = mars3d.LngLatPoint.fromCartesian(graphic.position);
     emits('flyToThere', flyToPosition);
-    };
+};
 
-    // 移动贴地点
+// 移动贴地点
-    const stickGraphicMove = (e) => {
+const stickGraphicMove = (e) => {
     return null;
     let uav = uavGraphicLayer.getGraphicById('flytothere-uav');
 
@@ -1428,10 +1636,10 @@ const loadChangGuangLayer = ()=>{
         },
     });
     }
-    };
+};
 
-    // 删除飞行到此处
+// 删除飞行到此处
-    const deleteFlyToThere = (e) => {
+const deleteFlyToThere = (e) => {
     let id = e.graphic.id;
 
     let uavGraphic = uavGraphicLayer.getGraphicById(id);
@@ -1454,10 +1662,10 @@ const loadChangGuangLayer = ()=>{
     moveTool = null;
     }
     emits('flyToThere', { _lng: null, _lat: null, _alt: null });
-    };
+};
 
-    // 无人机点按轴移动
+// 无人机点按轴移动
-    const uavGraphicMove = (e) => {
+const uavGraphicMove = (e) => {
     const cartographic = mars3d.Cesium.Cartographic.fromCartesian(e.position);
 
     // 弧度转度数
@@ -1498,10 +1706,10 @@ const loadChangGuangLayer = ()=>{
         },
     });
     }
-    };
+};
 
-    // 预览航点航线
+// 预览航点航线
-    const preViewPointWayLine = (position) => {
+const preViewPointWayLine = (position) => {
     if (moveTool) {
     moveTool.destroy();
       moveTool = null;
@@ -1585,15 +1793,15 @@ const loadChangGuangLayer = ()=>{
 
     // 绘制航线
     handlerDrawLine();
-    };
+};
 
-    // 预览面状航线
+// 预览面状航线
-    const preViewPolygonWayLine = (lines) => {
+const preViewPolygonWayLine = (lines) => {
     handlerDrawLine();
-    };
+};
 
-    // 清空所有图层
+// 清空所有图层
-    const clearAllLayer = () => {
+const clearAllLayer = () => {
     graphicLayer ? graphicLayer.clear() : null;
     stickGroundPointLayer ? stickGroundPointLayer.clear() : null;
     lineGroundPointLayer ? lineGroundPointLayer.clear() : null;
@@ -1601,10 +1809,13 @@ const loadChangGuangLayer = ()=>{
     polygonGraphicLayer ? polygonGraphicLayer.clear() : null;
     polygonLineGraphicLayer ? polygonLineGraphicLayer.clear() : null;
     airPoints.value = [];
-    };
+};
 
-    //   设置机场位置
+
-    const setAirportPosition = async () => {
+//////////////////////////////机场和无人机////////////////////////////////////////////
+
+//   设置机场位置
+const setAirportPosition = async () => {
     if(!graphicLayer){
       return
     }
@@ -1660,10 +1871,10 @@ const loadChangGuangLayer = ()=>{
     });
     graphicLayer.addGraphic(startGraphic);
     }
-    };
+};
 
-    // 项目首页设置机场位置
+// 项目首页设置机场位置
-    const homeSetAirportPosition = () => {
+const homeSetAirportPosition = () => {
   if(!graphicLayer){
       return
     }
@@ -1698,9 +1909,10 @@ const loadChangGuangLayer = ()=>{
     });
     graphicLayer.addGraphic(homeStartGraphic);
   }
-    }
+}
-    //   设置无人机轨迹
+
-    const setUAVPosition = () => {
+//   设置无人机轨迹
+const setUAVPosition = () => {
     let point = graphicLayer.getGraphicById('set-uav');
     const position = [props.uavTrack.longitude, props.uavTrack.latitude, props.uavTrack.height];
     // 更新航点
@@ -1751,29 +1963,8 @@ const loadChangGuangLayer = ()=>{
     );
     route.addTimePosition(positionVal);
     }
-    };
+};
 
-
-// 参数改变
-const calculatParamChange = (params) => {
-    console.log("params",params);
-
-    let spceing = parseFloat(params.spacing) / 10000;
-
-    console.log("spceing",spceing);
-
-    if(polygonGeoJson.value){
-      let polygon = turf.polygon([polygonGeoJson.value]);
-      let lines = generateScanLines(polygon, spceing, 0);
-      
-      // 计算面积 长度
-      CalculateAreaInfo(polygon, lines);
-
-      // 绘制面航线
-      handlerDrawPolygonLine(lines);
-    }
-    
-}
 </script>
 
 <style scoped>