飞行逻辑调整

src/components/sceneAtttribute/camera/camera.vue

@@ -15,29 +15,13 @@
           <input type="file" accept=".fpf" id="flyFile" style="width: 100%" />
         </div>
         <div class="flybox">
-          <i
-            class="el-icon-video-play flyBtn"
-            @click="flyStart"
-            :title="Resource.startFly"
-          ></i>
-          <i
-            class="el-icon-video-pause flyBtn"
-            @click="flyPause"
-            :title="Resource.pauseFly"
-          ></i>
-          <i
-            class="el-icon-document-delete flyBtn"
-            @click="flyStop"
-            :title="Resource.stopFly"
-          ></i>
+          <i class="el-icon-video-play flyBtn" @click="flyStart" :title="Resource.startFly"></i>
+          <i class="el-icon-video-pause flyBtn" @click="flyPause" :title="Resource.pauseFly"></i>
+          <i class="el-icon-document-delete flyBtn" @click="flyStop" :title="Resource.stopFly"></i>
         </div>
         <div class="sm-function-module-sub-section">
           <label class="label-container">{{ Resource.stopChoose }}</label>
-          <select
-            class="sm-select"
-            id="stopList"
-            v-model="stopSelected"
-          ></select>
+          <select class="sm-select" id="stopList" v-model="stopSelected"></select>
         </div>
         <div class="sm-function-module-sub-section">
           <label class="label-container">{{ Resource.observe }}</label>
@@ -61,24 +45,8 @@
           </div>
           <label class="label-container">{{ Resource.rotateSpeed }}</label>
           <div class="sm-solider-input-box">
-            <input
-              class="min-solider"
-              min="0"
-              max="50"
-              step="0.1"
-              style="width: 63%"
-              type="range"
-              v-model="speed"
-            />
-            <input
-              class="min-solider"
-              min="0"
-              max="50"
-              step="0.1"
-              style="width: 34%"
-              type="number"
-              v-model="speed"
-            />
+            <input class="min-solider" min="0" max="50" step="0.1" style="width: 63%" type="range" v-model="speed" />
+            <input class="min-solider" min="0" max="50" step="0.1" style="width: 34%" type="number" v-model="speed" />
           </div>
         </div>
         <div class="sm-function-module-sub-section">
@@ -92,43 +60,21 @@
             <label class="label-container">{{
               Resource.cameraMinimumZoomDistance
             }}</label>
-            <input
-              class="sm-input-long"
-              min="0"
-              type="number"
-              v-model="cameraMinimumZoomDistance"
-            />
+            <input class="sm-input-long" min="0" type="number" v-model="cameraMinimumZoomDistance" />
           </div>
           <div class="sm-function-module-sub-section">
             <label class="label-container">{{
               Resource.SurfaceTransparency
             }}</label>
-            <input
-              class="sm-input-long"
-              min="0"
-              max="1.0"
-              step="0.01"
-              type="number"
-              v-model="SurfaceTransparency"
-            />
+            <input class="sm-input-long" min="0" max="1.0" step="0.01" type="number" v-model="SurfaceTransparency" />
           </div>
         </div>
       </TabPane>
       <TabPane :label="Resource.createFlyRoute" name="cjfxxl">
         <div class="icon-list" style="width: 12.96rem">
-          <span
-            v-for="(item, index) in state.itemOptions"
-            :key="index"
-            class="icon-span"
-            :title="item.lable"
-            :class="item.isSelect ? 'selected-icon' : ''"
-            @click="changleIconItem(item)"
-          >
-            <i
-              class="iconfont iconSize"
-              :class="item.iconName"
-              style="margin-top: 0px"
-            ></i>
+          <span v-for="(item, index) in state.itemOptions" :key="index" class="icon-span" :title="item.lable"
+            :class="item.isSelect ? 'selected-icon' : ''" @click="changleIconItem(item)">
+            <i class="iconfont iconSize" :class="item.iconName" style="margin-top: 0px"></i>
           </span>
         </div>
         <div v-show="state.customRouteNames.length > 0">
@@ -142,12 +88,7 @@
                 value-field="index"
               /> -->
               <el-select v-model="state.selectedAddedStopIndex">
-                <el-option
-                  v-for="item in state.routeStops"
-                  :key="item.value"
-                  :label="item.stopName"
-                  :value="item.index"
-                >
+                <el-option v-for="item in state.routeStops" :key="item.value" :label="item.stopName" :value="item.index">
                 </el-option>
               </el-select>
             </div>
@@ -156,27 +97,16 @@
           <div class="row-item" style="margin-bottom: 0px">
             <span></span>
             <div class="row-content" style="display: flex">
-              <el-checkbox v-model="showRoute" /><span class="checkbox-lable"
-                >显示路线</span
-              >
-              <el-checkbox v-model="showStop" /><span class="checkbox-lable"
-                >显示站点</span
-              >
+              <el-checkbox v-model="showRoute" /><span class="checkbox-lable">显示路线</span>
+              <el-checkbox v-model="showStop" /><span class="checkbox-lable">显示站点</span>
             </div>
           </div>
 
           <div>
             <label class="label-container">飞行速度</label>
             <div class="sm-solider-input-box">
-              <input
-                class="min-solider"
-                min="0"
-                max="500"
-                step="1"
-                style="width: 63%"
-                type="range"
-                v-model="state.routeSpeed"
-              />
+              <input class="min-solider" min="0" max="500" step="1" style="width: 63%" type="range"
+                v-model="state.routeSpeed" />
               <span>{{ state.routeSpeed }}</span>
             </div>
           </div>
@@ -188,53 +118,27 @@
           </div> -->
 
           <div class="icon-list" style="width: 12.96rem">
-            <span
-              v-for="(item, index) in state.actionOptions"
-              :key="index"
-              class="icon-span"
-              :title="item.lable"
-              :class="item.isSelect ? 'selected-icon' : ''"
-              @click="changleIconItemAction(item)"
-            >
-              <i
-                class="iconfont iconSize"
-                :class="item.iconName"
-                style="margin-top: 0px"
-              ></i>
+            <span v-for="(item, index) in state.actionOptions" :key="index" class="icon-span" :title="item.lable"
+              :class="item.isSelect ? 'selected-icon' : ''" @click="changleIconItemAction(item)">
+              <i class="iconfont iconSize" :class="item.iconName" style="margin-top: 0px"></i>
             </span>
           </div>
 
           <div class="btn-row-item" style="margin-left: 0.94rem">
-            <el-button
-              type="info"
-              color="#3499E5"
-              text-color="#fff"
-              @click="downLoad"
-              style="margin-right: 0.1rem; margin-left: 0.03rem"
-              >下载</el-button
-            >
-            <el-button
-              class="btn-secondary"
-              @click="clearRoute"
-              color="rgba(255, 255, 255, 0.65)"
-              ghost
-              >清除</el-button
-            >
+            <el-button type="info" color="#3499E5" text-color="#fff" @click="downLoad"
+              style="margin-right: 0.1rem; margin-left: 0.03rem">下载</el-button>
+            <el-button class="btn-secondary" @click="clearRoute" color="rgba(255, 255, 255, 0.65)" ghost>清除</el-button>
           </div>
         </div>
         <!-- <rotate></rotate> -->
         <div class="row-item">
-        <span>绕点旋转</span>
-        <!-- <div style="width: 12.96rem">
+          <span>绕点旋转</span>
+          <!-- <div style="width: 12.96rem">
           <n-switch v-model="state.rotateShow" size="small" />
         </div> -->
-        <el-switch
-          v-model="state.rotateShow"
-          active-color="#13ce66"
-          inactive-color="#ff4949"
-        >
-        </el-switch>
-      </div>
+          <el-switch v-model="state.rotateShow" active-color="#13ce66" inactive-color="#ff4949">
+          </el-switch>
+        </div>
         <div v-show="state.rotateShow">
           <div class="flexbox">
             <el-button type="primary" size="mini" @click="onSpinClk">{{
@@ -252,24 +156,8 @@
           </div>
           <label class="label-container">{{ Resource.rotateSpeed }}</label>
           <div class="sm-solider-input-box">
-            <input
-              class="min-solider"
-              min="0"
-              max="50"
-              step="0.1"
-              style="width: 63%"
-              type="range"
-              v-model="speed"
-            />
-            <input
-              class="min-solider"
-              min="0"
-              max="50"
-              step="0.1"
-              style="width: 34%"
-              type="number"
-              v-model="speed"
-            />
+            <input class="min-solider" min="0" max="50" step="0.1" style="width: 63%" type="range" v-model="speed" />
+            <input class="min-solider" min="0" max="50" step="0.1" style="width: 34%" type="number" v-model="speed" />
           </div>
         </div>
       </TabPane>
@@ -423,22 +311,9 @@ export default {
     }
     //初始化站点文件保存
     this.initFlyManager();
-  },
-  methods: {
-    //子组件部分
-    init() {
-      if (camera) {
-        return;
-      }
-      camera = scene.camera;
-      camera.flyCircleLoop = true;
-    },
-    flyStart() {
-      console.log(flyManager, "flyManager");
 
-      // if (flyManager) {
-      //   flyManager.play();
-      // } else {
+    const fileInput = document.getElementById('flyFile');
+    fileInput.addEventListener('change', function (event) {
       let routes = new Cesium.RouteCollection(viewer.entities);
       let fileInput = document.getElementById("flyFile");
       let file = fileInput.files[0];
@@ -480,7 +355,67 @@ export default {
           flyManager.play();
         });
       }
-      // }
+
+
+    });
+  },
+  methods: {
+    //子组件部分
+    init() {
+      if (camera) {
+        return;
+      }
+      camera = scene.camera;
+      camera.flyCircleLoop = true;
+    },
+    flyStart() {
+      console.log(flyManager, "flyManager");
+
+      if (flyManager) {
+        flyManager.play();
+      } else {
+        let routes = new Cesium.RouteCollection(viewer.entities);
+        let fileInput = document.getElementById("flyFile");
+        let file = fileInput.files[0];
+        if (!file) {
+          return; // 没有选择fpf文件无法开始执行
+        }
+        let reader = new FileReader();
+        reader.onload = function (e) {
+          // 读取操作完成时出发
+          let XMLContent = e.target.result;
+
+          routes.fromXML(XMLContent);
+        };
+        reader.readAsBinaryString(file);
+        //创建飞行管理对象
+        flyManager = new Cesium.FlyManager({
+          scene: scene,
+          routes: routes,
+        });
+        flyManager.stopArrived.addEventListener(function (routeStop) {
+          routeStop.waitTime = 1;
+        });
+        if (flyManager.readyPromise) {
+          Cesium.when(flyManager.readyPromise, function () {
+            let currentRoute = flyManager.currentRoute;
+            currentRoute.isLineVisible = true;
+            currentRoute.isStopVisible = true;
+
+            let allStops = flyManager.getAllRouteStops();
+            let menu = document.getElementById("stopList");
+            for (let i = 0, j = allStops.length; i < j; i++) {
+              let option = document.createElement("option");
+              option.textContent = Resource.stop + (i + 1);
+              console.log(Resource, "asdas");
+
+              option.value = allStops[i].index;
+              menu.appendChild(option);
+            }
+            flyManager.play();
+          });
+        }
+      }
     },
     flyPause() {
       flyManager && flyManager.pause();