fix:

1. 修正航点动作参数
2. 右侧控制栏的窗口不随控制栏一起关闭
3. 视图库机载\视频\多选功能\转存\删除功能
4. MMC_Gimbal_ZT60R挂载适配文件更新
5. 键盘控制功能

iframe/src/App.vue

@@ -66,6 +66,7 @@ export default {
      * 给父窗口发送消息
      */
     postTop(data) {
+      console.log('iframe postMessage', data);
       window.top.postMessage(
         {
           module: "MMCFlightControlCenter",

src/components/MMCFlightControlCenter/api/modules/viewLibrary.js

@@ -27,4 +27,12 @@ export default class ViewLibrary {
       params,
     });
   }
+
+  static delete(params) {
+    return request({
+      url: "/admin-api/data/view-library/delete",
+      method: "delete",
+      params,
+    });
+  }
 }

src/components/MMCFlightControlCenter/components/hangar/components/controlPanel/components/controlLeft/components/airwayList/components/normalTask/components/airwayEdit/components/actions/index.vue

@@ -58,7 +58,7 @@
     </div>
     <div class="rm-rp-btns">
       <div class="rm-rp-btn" v-hover @click="$emit('close')">取消</div>
-      <div class="rm-rp-btn save" v-hover @click="$emit('save', selectActions1)">保存</div>
+      <div class="rm-rp-btn save" v-hover @click="onSave">保存</div>
     </div>
   </div>
 </template>
@@ -133,9 +133,27 @@ export default {
       selectActions1: [], //选中的动作
     };
   },
-  created(){
+  created() {
     this.selectActions1 = JSON.parse(JSON.stringify(this.selectActions));
-  }
+    this.selectActions1.some((item) => {
+      if (item.label === "悬停") {
+        item.param1 /= 1000; // 毫秒转秒
+        return true;
+      }
+    });
+  },
+  methods: {
+    onSave() {
+      let actions = JSON.parse(JSON.stringify(this.selectActions1));
+      actions.some((item) => {
+        if (item.label === "悬停") {
+          item.param1 *= 1000; // 秒转毫秒
+          return true;
+        }
+      });
+      this.$emit("save", actions);
+    },
+  },
 };
 </script>
 

src/components/MMCFlightControlCenter/components/uavApplications/components/controlPanel/components/controlBottom/components/keyControl/index.vue

@@ -147,7 +147,7 @@
   </div>
 </template>
 <script>
-import * as mountCtrlList from "../../../../../../../mount/utils.js";
+import * as mountCtrlList from "../../../../../../../../../MMCMount/utils.js";
 import { mapState } from "vuex";
 export default {
   data() {

src/components/MMCFlightControlCenter/components/uavApplications/components/controlPanel/components/controlLeft/components/airwayList/components/airwayEdit/components/actions/index.vue

@@ -58,7 +58,7 @@
     </div>
     <div class="rm-rp-btns">
       <div class="rm-rp-btn" v-hover @click="$emit('close')">取消</div>
-      <div class="rm-rp-btn save" v-hover @click="$emit('save', selectActions1)">保存</div>
+      <div class="rm-rp-btn save" v-hover @click="onSave">保存</div>
     </div>
   </div>
 </template>
@@ -133,9 +133,27 @@ export default {
       selectActions1: [], //选中的动作
     };
   },
-  created(){
+  created() {
     this.selectActions1 = JSON.parse(JSON.stringify(this.selectActions));
-  }
+    this.selectActions1.some((item) => {
+      if (item.label === "悬停") {
+        item.param1 /= 1000; // 毫秒转秒
+        return true;
+      }
+    });
+  },
+  methods: {
+    onSave() {
+      let actions = JSON.parse(JSON.stringify(this.selectActions1));
+      actions.some((item) => {
+        if (item.label === "悬停") {
+          item.param1 *= 1000; // 秒转毫秒
+          return true;
+        }
+      });
+      this.$emit("save", actions);
+    },
+  },
 };
 </script>
 

src/components/MMCFlightControlCenter/components/uavApplications/components/controlPanel/components/controlLeft/components/airwayList/index.vue

@@ -74,6 +74,7 @@ export default {
             polyline: airway,
             id: airway.id,
           });
+          console.log("选中的航线", this.selectedAirway);
         } catch (e) {
           console.log("绘制航线失败", e);
         }
@@ -137,7 +138,7 @@ export default {
         callback: (res) => {
           this.airwayList = res?.records || [];
           this.$nextTick(() => {
-            if(id){
+            if (id) {
               this.selectedAirwayId = id;
             }
           });

src/components/MMCFlightControlCenter/components/uavApplications/components/controlPanel/components/controlRight/components/controlList/index.vue

 <template>
-  <div class="nset_control_box dialog1027">
-    <div class="dialog-header">
-      <img class="dialog-header__icon" src="../../assets/images/mount_head.png" />
-      <div class="dialog-header__title">操作区域</div>
-      <div class="dialog-header__close" @click="$emit('exit')">关闭</div>
-    </div>
-    <div class="nset_control_box_area">
-      <div class="wrj">
-        <!-- <div class="w48 h48 item mb3  cf  tc cp" @click="$emit('uav-location')">
+  <div>
+    <div class="nset_control_box dialog1027" v-if="show">
+      <div class="dialog-header">
+        <img class="dialog-header__icon" src="../../assets/images/mount_head.png" />
+        <div class="dialog-header__title">操作区域</div>
+        <div class="dialog-header__close" @click="$emit('exit')">关闭</div>
+      </div>
+      <div class="nset_control_box_area">
+        <div class="wrj">
+          <!-- <div class="w48 h48 item mb3  cf  tc cp" @click="$emit('uav-location')">
                     <SymbolIcon icon="dingwei" />
                     <span class="txt">定位</span>
-        </div>-->
-        <div class="item" @click="onSwitchAirline">
-          <SymbolIcon icon="guiji" />
-          <span class="txt">轨迹</span>
-        </div>
-        <div class="item" @click="onContinueFly">
-          <SymbolIcon icon="jixufeihang1" />
-          <span class="txt">继续飞行</span>
-        </div>
-        <div class="item" @click="onPauseFly">
-          <SymbolIcon icon="zantingfeihang1" />
-          <span class="txt">暂停飞行</span>
-        </div>
-        <div class="item" @click="safetyNotice = !safetyNotice">
-          <SymbolIcon icon="anquanjiangla1" />
-          <span class="txt">紧急迫降</span>
-        </div>
-        <div class="item" @click="showLogger = !showLogger">
-          <SymbolIcon icon="yunhangrizhi2" />
-          <span class="txt">运行日志</span>
-        </div>
-        <div class="item" @click="guideFlight" v-if="uav && uav.network === 2">
-          <SymbolIcon icon="tiaozhuandaozuobiao" />
-          <span class="txt">指点飞行</span>
-        </div>
-        <div class="item" @click="onInfieldControl" v-if="uav && uav.network === 2">
-          <img class="dib mt3" src="./assets/images/1.svg" alt />
-          <span class="txt">内场控制</span>
+          </div>-->
+          <div class="item" @click="onSwitchAirline">
+            <SymbolIcon icon="guiji" />
+            <span class="txt">轨迹</span>
+          </div>
+          <div class="item" @click="onContinueFly">
+            <SymbolIcon icon="jixufeihang1" />
+            <span class="txt">继续飞行</span>
+          </div>
+          <div class="item" @click="onPauseFly">
+            <SymbolIcon icon="zantingfeihang1" />
+            <span class="txt">暂停飞行</span>
+          </div>
+          <div class="item" @click="safetyNotice = !safetyNotice">
+            <SymbolIcon icon="anquanjiangla1" />
+            <span class="txt">紧急迫降</span>
+          </div>
+          <div class="item" @click="showLogger = !showLogger">
+            <SymbolIcon icon="yunhangrizhi2" />
+            <span class="txt">运行日志</span>
+          </div>
+          <div class="item" @click="guideFlight" v-if="uav && uav.network === 2">
+            <SymbolIcon icon="tiaozhuandaozuobiao" />
+            <span class="txt">指点飞行</span>
+          </div>
+          <div class="item" @click="onInfieldControl" v-if="uav && uav.network === 2">
+            <img class="dib mt3" src="./assets/images/1.svg" alt />
+            <span class="txt">内场控制</span>
+          </div>
         </div>
       </div>
-    </div>
-    <!-- 飞控 无人机 安全降落 -->
-    <el-dialog
-      :visible.sync="safetyNotice"
-      width="30%"
-      :append-to-body="true"
-      style="margin-top: 20vh"
-      custom-class="mmc"
-    >
-      <div class="endrenwu">
-        <div class="tishiyu">紧急迫降</div>
-        <div class="queding">无人机即将原地降落，请确认无人机下方是否安全！</div>
-        <div class="btn_kuang">
-          <div class="btn btn_lan" @click="safetyNotice = false">取消</div>
-          <div style="width: 20px"></div>
-          <div class="btn btn_lv" @click="onLand">确定</div>
+      <!-- 飞控 无人机 安全降落 -->
+      <el-dialog
+        :visible.sync="safetyNotice"
+        width="30%"
+        :append-to-body="true"
+        style="margin-top: 20vh"
+        custom-class="mmc"
+      >
+        <div class="endrenwu">
+          <div class="tishiyu">紧急迫降</div>
+          <div class="queding">无人机即将原地降落，请确认无人机下方是否安全！</div>
+          <div class="btn_kuang">
+            <div class="btn btn_lan" @click="safetyNotice = false">取消</div>
+            <div style="width: 20px"></div>
+            <div class="btn btn_lv" @click="onLand">确定</div>
+          </div>
         </div>
-      </div>
-    </el-dialog>
-    <!-- 强制切换外场权限 -->
-    <el-dialog
-      title
-      :visible.sync="showInfieldControlDialog"
-      width="30%"
-      :append-to-body="true"
-      style="margin-top: 20vh"
-    >
-      <div class="endrenwu">
-        <div class="tishiyu">温馨提示</div>
-        <div class="queding" v-if="!isAcceleratorMedian">
-          当前油门值为
-          <span style="color:red">{{uavRealTimeData.rcChannelState.toFixed(2)||0}}</span>,请调到中位(470-530)
-        </div>
-        <div class="queding" v-if="isAcceleratorMedian">摇杆已处于中位，即将切换内场权限</div>
-      </div>
-    </el-dialog>
-    <el-dialog
-      title
-      :visible.sync="guideFlightShow"
-      width="30%"
-      :append-to-body="true"
-      :show-close="false"
-      :close-on-click-modal="false"
-      style="margin-top: 20vh"
-      custom-class="mmc"
-    >
-      <div class="endrenwu guideFlight">
-        <div class="tishiyu">引导飞行确认</div>
-        <div class="queding">位置获取成功，请确认是否进行指点模式飞行</div>
-        <div class="fleSpeed">
-          指点飞行速度：
-          <el-input oninput="value=value.replace(/[^0-9.]/g,'')" v-model="flySpeed"></el-input>
-          <span style="opacity: 0;">1</span>(米/秒)
+      </el-dialog>
+      <!-- 强制切换外场权限 -->
+      <el-dialog
+        title
+        :visible.sync="showInfieldControlDialog"
+        width="30%"
+        :append-to-body="true"
+        style="margin-top: 20vh"
+      >
+        <div class="endrenwu">
+          <div class="tishiyu">温馨提示</div>
+          <div class="queding" v-if="!isAcceleratorMedian">
+            当前油门值为
+            <span style="color:red">{{uavRealTimeData.rcChannelState.toFixed(2)||0}}</span>,请调到中位(470-530)
+          </div>
+          <div class="queding" v-if="isAcceleratorMedian">摇杆已处于中位，即将切换内场权限</div>
         </div>
-        <div class="red" v-if="maxSpeed">指点飞行最大速度为8米/秒</div>
-        <div class="btn_kuang">
-          <div class="btn btn_lan" @click="onGuideFlightCancel">取消</div>
-          <div style="width: 20px"></div>
-          <div class="btn btn_lv" @click="onGuideFlightConfirm">确定</div>
+      </el-dialog>
+      <el-dialog
+        title
+        :visible.sync="guideFlightShow"
+        width="30%"
+        :append-to-body="true"
+        :show-close="false"
+        :close-on-click-modal="false"
+        style="margin-top: 20vh"
+        custom-class="mmc"
+      >
+        <div class="endrenwu guideFlight">
+          <div class="tishiyu">引导飞行确认</div>
+          <div class="queding">位置获取成功，请确认是否进行指点模式飞行</div>
+          <div class="fleSpeed">
+            指点飞行速度：
+            <el-input oninput="value=value.replace(/[^0-9.]/g,'')" v-model="flySpeed"></el-input>
+            <span style="opacity: 0;">1</span>(米/秒)
+          </div>
+          <div class="red" v-if="maxSpeed">指点飞行最大速度为8米/秒</div>
+          <div class="btn_kuang">
+            <div class="btn btn_lan" @click="onGuideFlightCancel">取消</div>
+            <div style="width: 20px"></div>
+            <div class="btn btn_lv" @click="onGuideFlightConfirm">确定</div>
+          </div>
         </div>
-      </div>
-    </el-dialog>
+      </el-dialog>
+    </div>
     <Logger v-if="showLogger" @close="showLogger = false"></Logger>
   </div>
 </template>
@@ -122,6 +124,10 @@ const Bus = new Vue();
 export default {
   components: { SymbolIcon, Logger },
   props: {
+    show: {
+      type: Boolean,
+      default: false,
+    },
     ModeStatus: {
       type: String,
       default: () => "",

src/components/MMCFlightControlCenter/components/uavApplications/components/controlPanel/components/controlRight/components/mount/index.vue

 <template>
   <div class="mountBox">
-    <div v-if="mountList.length > 0" class="list">
-      <div
-        class="mount-item pr mt6"
-        :class="{
+    <div class="main" v-if="show">
+      <div v-if="mountList.length > 0" class="list">
+        <div
+          class="mount-item pr mt6"
+          :class="{
                 active:
                   (selectMount && selectMount.gimbalName) === item.gimbalName,
               }"
-        v-for="(item, index) in mountList"
-        :key="index"
-      >
-        <div class="icon-box" @click="onSelectMount(item)">
-          <img class :src="item.icon" />
+          v-for="(item, index) in mountList"
+          :key="index"
+        >
+          <div class="icon-box" @click="onSelectMount(item)">
+            <img class :src="item.icon" />
+          </div>
         </div>
       </div>
     </div>
@@ -44,6 +46,10 @@ export default {
     ...mountComponents,
   },
   props: {
+    show: {
+      type: Boolean,
+      default: false,
+    },
     uavMountsPayload: {
       type: Array,
       default: () => [],
@@ -62,11 +68,11 @@ export default {
       "mountList",
       "airlineId",
       "selectMount",
-      "uavRealTimeData"
+      "uavRealTimeData",
     ]),
-    nxNormal(){
-      return this.uavRealTimeData?.healthData?.NX?.warningLevel === 'NORMAL';
-    }
+    nxNormal() {
+      return this.uavRealTimeData?.healthData?.NX?.warningLevel === "NORMAL";
+    },
   },
   created() {},
   mounted() {},
@@ -107,16 +113,19 @@ export default {
 </script>
 <style scoped lang="scss">
 .mountBox {
-  background: #222222;
-  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-  border-radius: 10px;
   position: absolute;
   // top: -152px;
   top: 63px;
   right: 65px;
-  min-width: 142px;
-  height: 48px;
-  padding: 0 5px;
+
+  .main {
+    background: #222222;
+    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+    border-radius: 10px;
+    min-width: 142px;
+    height: 48px;
+    padding: 0 5px;
+  }
 
   .list {
     display: flex;
@@ -141,5 +150,11 @@ export default {
       }
     }
   }
+
+  .mount-panel {
+    position: absolute;
+    top: 50px;
+    right: 0;
+  }
 }
 </style>

src/components/MMCFlightControlCenter/components/uavApplications/components/controlPanel/components/controlRight/components/viewLib/index.vue

@@ -13,6 +13,7 @@
             placeholder="全部"
             @change="onChangeAiType"
             v-if="viewLibTab == 0"
+            size="small"
           >
             <el-option
               v-for="item in aiTypeList"
@@ -21,11 +22,15 @@
               :value="item.id"
             ></el-option>
           </el-select>
+          <el-checkbox
+            v-if="viewLibTab === 1"
+            :indeterminate="isIndeterminate"
+            v-model="checkAll"
+            @change="handleCheckAllChange"
+          >全选</el-checkbox>
         </div>
         <div class="select">
-          <!-- <div class="btns" :class="fileType == 0 ? 'bg' : ''" @click="onChangeFileType(0)">图片</div>
-          <div class="btns" :class="fileType == 1 ? 'bg' : ''" @click="onChangeFileType(1)">视频</div>-->
-          <el-radio-group v-model="fileType">
+          <el-radio-group v-model="fileType" size="small">
             <el-radio-button label="图片"></el-radio-button>
             <el-radio-button label="视频"></el-radio-button>
           </el-radio-group>
@@ -37,97 +42,224 @@
         <a href="http://32.128.6.52:4500/11.11平台部署/ChromeStandaloneSetup64.exe">下载最新谷歌</a>
       </p>-->
       <div class="lists">
-        <ul v-if="photoListDate" class="infinite-list" style="overflow:auto">
-          <li v-for="item in photoListDate" class="infinite-list-item">
-            <template v-if="item.imgList.length > 0">
-              <div class="list-item-date">
-                <div>{{item.date}}</div>
-                <el-button type="text" size="small" @click="photoListDate = null;">返回></el-button>
-              </div>
-              <div class="list-item-imgs">
-                <template v-for="(img, i) in item.imgList">
-                  <MMCImage
-                    class="list-item__img"
-                    :key="i"
-                    fit="cover"
-                    :src="img || img"
-                    :preview-src-list="item.imgList"
-                    :initial-index="i"
-                    @error="onImgError"
-                    crossorigin
-                  >
-                    <div class="list-item__img-download" @click="onDownload(img)">下载</div>
-                  </MMCImage>
-                </template>
-              </div>
-            </template>
-          </li>
-        </ul>
-        <ul
+        <!-- 上传的资源 -->
+        <template v-if="viewLibTab === 0">
+          <ul v-if="!photoListDate" class="infinite-list" style="overflow:auto">
+            <li v-for="item in photoList" class="infinite-list-item">
+              <template v-if="item.imgList.length > 0">
+                <div class="list-item-date">
+                  <div>{{item.date}}</div>
+                  <el-button type="text" size="small" @click="photoListDate = [item]">更多></el-button>
+                </div>
+                <div class="list-item-imgs">
+                  <template v-for="(img, i) in item.imgList">
+                    <template v-if="i < 3">
+                      <MMCImage
+                        v-if="fileType === '图片'"
+                        class="list-item__img"
+                        :key="i"
+                        fit="cover"
+                        :src="img || img"
+                        :preview-src-list="item.imgList"
+                        :initial-index="i"
+                        crossorigin
+                      >
+                        <div class="list-item__img-download" @click="onDownload(img)">下载</div>
+                      </MMCImage>
+                      <LivePlayer
+                        v-else
+                        class="list-item__img"
+                        aspect="fulllscreen"
+                        :controls="false"
+                        :videoUrl="img"
+                        :autoplay="false"
+                      >
+                        <div class="list-item__img-download" @click="onDownload(img)">下载</div>
+                      </LivePlayer>
+                    </template>
+                  </template>
+                </div>
+              </template>
+            </li>
+          </ul>
+          <ul
+            v-else
+            class="infinite-list"
+            v-infinite-scroll="onLoadList"
+            style="overflow:auto"
+            infinite-scroll-immediate
+            :infinite-scroll-disabled="noMore"
+          >
+            <li v-for="item in photoListDate" class="infinite-list-item">
+              <template v-if="item.imgList.length > 0">
+                <div class="list-item-date">
+                  <div>{{item.date}}</div>
+                  <el-button type="text" size="small" @click="photoListDate = null;">返回></el-button>
+                </div>
+                <div class="list-item-imgs">
+                  <template v-for="(img, i) in item.imgList">
+                    <MMCImage
+                      v-if="fileType === '图片'"
+                      class="list-item__img"
+                      :key="i"
+                      fit="cover"
+                      :src="img || img"
+                      :preview-src-list="item.imgList"
+                      :initial-index="i"
+                      crossorigin
+                    >
+                      <div class="list-item__img-download" @click="onDownload(img)">下载</div>
+                    </MMCImage>
+                    <LivePlayer
+                      v-else
+                      class="list-item__img"
+                      aspect="fulllscreen"
+                      :controls="false"
+                      :videoUrl="img"
+                      :autoplay="false"
+                    >
+                      <div class="list-item__img-download" @click="onDownload(img)">下载</div>
+                    </LivePlayer>
+                  </template>
+                </div>
+              </template>
+            </li>
+          </ul>
+        </template>
+        <!-- 机载的资源 -->
+        <el-checkbox-group
           v-else
-          class="infinite-list"
-          v-infinite-scroll="onLoadList"
-          style="overflow:auto"
-          infinite-scroll-immediate
-          :infinite-scroll-disabled="noMore"
+          v-model="checkList"
+          @change="handleCheckedCitiesChange"
+          style="height: 100%;"
         >
-          <li v-for="item in photoList" class="infinite-list-item">
-            <template v-if="item.imgList.length > 0">
-              <div class="list-item-date">
-                <div>{{item.date}}</div>
-                <el-button type="text" size="small" @click="photoListDate = [item]">更多></el-button>
-              </div>
-              <div class="list-item-imgs">
-                <template v-for="(img, i) in item.imgList">
-                  <MMCImage
-                    v-if="i < 3"
-                    class="list-item__img"
-                    :key="i"
-                    fit="cover"
-                    :src="img || img"
-                    :preview-src-list="item.imgList"
-                    :initial-index="i"
-                    @error="onImgError"
-                    crossorigin
-                  >
-                    <div class="list-item__img-download" @click="onDownload(img)">下载</div>
-                  </MMCImage>
-                </template>
-              </div>
-            </template>
-          </li>
-        </ul>
+          <ul v-if="!photoListDate" class="infinite-list" style="overflow:auto">
+            <li v-for="item in photoList" class="infinite-list-item">
+              <template v-if="item.imgList.length > 0">
+                <div class="list-item-date">
+                  <div>{{item.date}}</div>
+                  <el-button type="text" size="small" @click="photoListDate = [item]">更多></el-button>
+                </div>
+                <div class="list-item-imgs">
+                  <template v-for="(img, i) in item.imgList">
+                    <el-checkbox v-if="i < 2" :label="img" :key="img">
+                      <MMCImage
+                        v-if="fileType === '图片'"
+                        class="list-item__img"
+                        :key="i"
+                        fit="cover"
+                        :src="img || img"
+                        :preview-src-list="item.imgList"
+                        :initial-index="i"
+                        crossorigin
+                      >
+                        <div class="list-item__img-download" @click="onDownload(img)">下载</div>
+                      </MMCImage>
+                      <LivePlayer
+                        v-else
+                        class="list-item__img"
+                        aspect="fulllscreen"
+                        :controls="false"
+                        :videoUrl="img"
+                        :autoplay="false"
+                      >
+                        <div class="list-item__img-download" @click="onDownload(img)">下载</div>
+                      </LivePlayer>
+                    </el-checkbox>
+                  </template>
+                </div>
+              </template>
+            </li>
+          </ul>
+          <ul
+            v-else
+            class="infinite-list"
+            v-infinite-scroll="onLoadList"
+            style="overflow:auto"
+            infinite-scroll-immediate
+            :infinite-scroll-disabled="noMore"
+          >
+            <li v-for="item in photoListDate" class="infinite-list-item">
+              <template v-if="item.imgList.length > 0">
+                <div class="list-item-date">
+                  <div>{{item.date}}</div>
+                  <el-button type="text" size="small" @click="photoListDate = null;">返回></el-button>
+                </div>
+                <div class="list-item-imgs">
+                  <template v-for="(img, i) in item.imgList">
+                    <!-- 机载带多选 -->
+                    <el-checkbox :label="img" :key="img">
+                      <MMCImage
+                        v-if="fileType === '图片'"
+                        class="list-item__img"
+                        :key="i"
+                        fit="cover"
+                        :src="img || img"
+                        :preview-src-list="item.imgList"
+                        :initial-index="i"
+                        crossorigin
+                      >
+                        <div class="list-item__img-download" @click="onDownload(img)">下载</div>
+                      </MMCImage>
+                      <LivePlayer
+                        v-else
+                        class="list-item__img"
+                        aspect="fulllscreen"
+                        :controls="false"
+                        :videoUrl="img"
+                        :autoplay="false"
+                      >
+                        <div class="list-item__img-download" @click="onDownload(img)">下载</div>
+                      </LivePlayer>
+                    </el-checkbox>
+                  </template>
+                </div>
+              </template>
+            </li>
+          </ul>
+        </el-checkbox-group>
       </div>
-      <div class="foot" v-if="viewLibTab == 1 || fileType2 == 2">
-        <div class="btns blue" v-if="selectAll">全选</div>
-        <div class="btns blue" v-else>取消全选</div>
-        <div class="btns" v-if="viewLibTab == 1">转存</div>
-        <div class="btns red" style>删除</div>
+      <div class="foot" v-if="viewLibTab == 1">
+        <el-button
+          type="primary"
+          size="small"
+          v-if="viewLibTab == 1"
+          @click="onTransfer"
+          :disabled="checkList.length === 0"
+          :loading="transferLoading"
+        >转存</el-button>
+        <el-button
+          type="danger"
+          size="small"
+          @click="onDel"
+          :disabled="checkList.length === 0"
+          :loading="delLoading"
+        >删除</el-button>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import {
-  flightTaskAPI,
-  Control_API,
-  ViewLibrary,
-} from "../../../../../../../../api";
+import { ViewLibrary } from "../../../../../../../../api";
 import { mapState } from "vuex";
 import MMCImage from "../../../../../../../../components/image";
 import mock from "./mock";
-import download from 'downloadjs';
+import download from "downloadjs";
+import LivePlayer from "@liveqing/liveplayer";
 
 export default {
   name: "ViewLib",
   components: {
     MMCImage,
+    LivePlayer,
   },
   inject: ["rootNode"],
   data() {
     return {
       checkList: [], // 多选结果
+      checkAll: false,
+      isIndeterminate: false,
       selectAll: false, //全选
       viewLibTab: 0, // 视图库tab索引, 0: 视图, 1: 机载
       aiType: 1, // 图片类型
@@ -195,8 +327,7 @@ export default {
         // },
       ], //视图库类型
       fileType: "图片", //视图文件类型 0：图片；1：视频
-      fileType2: 0, //机载文件类型
-      photoList: mock /* [] */, //资源列表
+      photoList: [], //资源列表对应的对象
       photoListDate: null, //某日期的所有资源
       moreShow: false, //显示更多,
       page: {
@@ -204,12 +335,23 @@ export default {
         pageSize: 10,
       },
       noMore: false, //是否没有更多数据了
-      
+      transferLoading: false, //转存中
+      delLoading: false, //删除中
     };
   },
   computed: {
     ...mapState("MMCFlightControlCenter/uav", ["uav"]),
     ...mapState("MMCFlightControlCenter", ["baseUrl"]),
+    // 全部图片
+    imgListAll() {
+      let list = [];
+      this.photoList.forEach((item) => {
+        item.imgList.forEach((img) => {
+          list.push(img);
+        });
+      });
+      return list;
+    },
   },
   watch: {
     fileType() {
@@ -217,13 +359,24 @@ export default {
     },
   },
   mounted() {
-    // this.init();
+    this.init();
   },
   methods: {
+    handleCheckAllChange(val) {
+      this.checkList = val ? this.imgListAll : [];
+      this.isIndeterminate = false;
+    },
+    handleCheckedCitiesChange(value) {
+      let checkedCount = value.length;
+      this.checkAll = checkedCount === this.imgListAll.length;
+      this.isIndeterminate =
+        checkedCount > 0 && checkedCount < this.imgListAll.length;
+    },
     async init() {
       this.page.pageNo = 1;
       this.photoList = [];
       this.noMore = false;
+      this.photoListDate = null;
       this.getPage();
     },
     async getPage() {
@@ -251,12 +404,14 @@ export default {
         });
         this.photoList = this.photoList.concat(photoList);
       }
+      // this.photoList = mock;
     },
     /**
      * 视图库tab更改
      */
     async onChangeViewLibTab(index) {
       this.viewLibTab = index;
+      this.init();
     },
     /**
      * 图片ai类型切换
@@ -271,13 +426,6 @@ export default {
       this.fileType = i;
       this.init();
     },
-    /**
-     * 更改机载中文件类型
-     */
-    onChangeFileType2(i) {
-      this.fileType2 = i;
-      this.init();
-    },
     onDownload(url) {
       download(url);
     },
@@ -288,10 +436,62 @@ export default {
       this.page.pageNo++;
       this.getPage();
     },
-    onImgError(e) {
-      /* if(e?.target){
-        e.target.crossOrigin  = '';
-      } */
+    /**
+     * 转存
+     */
+    async onTransfer() {
+      this.transferLoading = true;
+
+      try {
+        let req = [];
+        this.checkList.forEach((img) => {
+          req.push(
+            ViewLibrary.create({
+              fileUrl: img,
+              fileType: 1,
+              deviceId: this.uav.deviceId,
+            })
+          );
+        });
+        await Promise.all(req);
+        this.$message.success("转存完成");
+      } catch (e) {
+        this.$message.error("转存失败");
+      }
+
+      this.transferLoading = false;
+    },
+    /**
+     * 删除
+     */
+    async onDel() {
+      this.delLoading = true;
+
+      try {
+        let req = [];
+        this.checkList.forEach((url) => {
+          // 找出该url对应的资源id
+          let find = null;
+          this.photoList.find((item) => {
+            find = item.viewLibraryRespVOS.find(
+              (item1) => url === item1.fileUrl
+            );
+            return find;
+          });
+          req.push(
+            ViewLibrary.delete({
+              id: find.id,
+            })
+          );
+        });
+        await Promise.all(req);
+
+        this.$message.success("删除完成");
+      } catch (e) {
+        this.$message.error("删除失败");
+      }
+
+      this.delLoading = false;
     },
   },
 };
@@ -362,10 +562,8 @@ export default {
       flex-shrink: 0;
       margin-top: 12px;
       margin-bottom: 12px;
-      display: flex;
       // justify-content: space-between;
       align-items: center;
-      gap: 12px;
       .btns {
         width: 64px;
         height: 32px;

src/components/MMCFlightControlCenter/components/uavApplications/components/controlPanel/components/controlRight/components/viewLib/mock.js

@@ -2,11 +2,11 @@ export default [
   {
     date: '2024-8-13',
     imgList: [
-      'http://gips3.baidu.com/it/u=3886271102,3123389489&fm=3028&app=3028&f=JPEG&fmt=auto?w=1280&h=960',
-      2,
-      3,
-      4,
-      5
+      'https://live.mmcuav.cn/live/D_XIANGDAO.m3u8',
+      'https://live.mmcuav.cn/live/D_XIANGDAO1.m3u8',
+      'https://live.mmcuav.cn/live/D_XIANGDAO2.m3u8',
+      'https://live.mmcuav.cn/live/D_XIANGDAO3.m3u8',
+      'https://live.mmcuav.cn/live/D_XIANGDAO4.m3u8'
     ]
   }
 ]
\ No newline at end of file

src/components/MMCFlightControlCenter/components/uavApplications/components/controlPanel/components/controlRight/index.vue

@@ -51,11 +51,11 @@
       @clearId="$emit('clearId')"
       @closeIconShow="iconShow = false"
       @exit="showControlList = false"
-      v-if="showControlList"
+      :show="showControlList"
       :isHangar="isHangar"
     ></ControlList>
     <Health v-if="showHealth" @exit="showHealth = false"></Health>
-    <Mount v-if="showMount"></Mount>
+    <Mount :show="showMount"></Mount>
     <!-- 喊话器 -->
     <MMCGimbalP1
       class="PagerP1"

src/components/MMCFlightControlCenter/components/uavApplications/components/player/components/livenvr/index.vue

@@ -98,7 +98,7 @@ export default {
     },
   },
   mounted() {
-    window.player = this;
+    // window.player = this;
   },
   methods: {
     init(flag) {

src/components/MMCMount/MMC_Gimbal_ZT60R/index.vue

 <!-- 高清变焦相机Z60S -->
 <template>
-  <div class="cpt-MMC_Gimbal_ZT60R" :style="containerStyle" v-interact>
-    <div class="hd">
+  <div class="cpt-MMC_Gimbal_ZT60R" :style="containerStyle">
+    <div class="hd" v-interact>
       <div class="left ml8">
         <img src="../assets/images/mount/mount_head.png" />
-        <div class="title">高清变焦相机ZT60R</div>
+        <div class="title">高清变焦相机</div>
+      </div>
+      <div @click="close" class="close">关闭</div>
+    </div>
+    <div class="jcsb p10 f12 cf">
+      <div class="tc">
+        {{ jgcjData.zoom || "0" }}x
+        <div class="fw700 f14 mt10">云台变焦</div>
+      </div>
+      <div class="tc">
+        {{ gcs_status_gis.yaw || "0.00" }}
+        <div class="fw700 f14 mt10">云台偏航</div>
+      </div>
+      <div class="tc">
+        {{ gcs_status_gis.pitch || "0.00" }}
+        <div class="fw700 f14 mt10">云台俯仰</div>
+      </div>
+      <div class="tc">
+        {{ gcs_status || "未跟踪" }}
+        <div class="fw700 f14 mt10">跟踪状态</div>
+      </div>
+      <div class="tc">
+        {{ jgcjData.jgcj }}m
+        <div class="fw700 f14 mt10">激光测距</div>
       </div>
-      <div class="close" @click="close">关闭</div>
     </div>
     <div class="bd">
       <div class="form-wrap">
@@ -15,20 +37,20 @@
           <div class="input-box">
             <el-select
               v-model="control_mode"
+              @change="change_control_mode"
               size="mini"
               placeholder="选择模式"
-              @change="change_control_mode"
             >
-              <el-option label="一键向下" :value="0" />
-              <el-option label="航向回中" :value="1" />
-              <el-option label="俯仰水平" :value="2" />
-              <el-option label="回中" :value="3" />
+              <el-option label="一键向下" :value="0"></el-option>
+              <el-option label="航向回中" :value="1"></el-option>
+              <el-option label="俯仰水平" :value="2"></el-option>
+              <el-option label="回中" :value="3"></el-option>
             </el-select>
           </div>
         </div>
 
         <div class="form-item">
-          <div class="label-box">点 击</div>
+          <div class="label-box">模式</div>
           <div class="input-box">
             <div class="mono">
               <div class="mono-long">
@@ -36,17 +58,17 @@
                   class="mono-left mono_box"
                   :class="{ active: holderModelDomV1 == 0 }"
                   @click="handle_change_click_mode(0)"
-                />
+                ></div>
                 <div
                   class="mono-middle mono_box"
                   :class="{ active: holderModelDomV1 == 1 }"
                   @click="handle_change_click_mode(1)"
-                />
+                ></div>
                 <div
                   class="mono-right mono_box"
                   :class="{ active: holderModelDomV1 == 2 }"
                   @click="handle_change_click_mode(2)"
-                />
+                ></div>
               </div>
               <div class="text">
                 <div class="text-left">移动</div>
@@ -65,17 +87,17 @@
                   class="mono-left mono_box"
                   :class="{ active: holderModelDomV2 == 0 }"
                   @click="handle_change_ptz_mode(0)"
-                />
+                ></div>
                 <div
                   class="mono-middle mono_box"
                   :class="{ active: holderModelDomV2 == 1 }"
                   @click="handle_change_ptz_mode(1)"
-                />
+                ></div>
                 <div
                   class="mono-right mono_box"
                   :class="{ active: holderModelDomV2 == 2 }"
                   @click="handle_change_ptz_mode(2)"
-                />
+                ></div>
               </div>
               <div class="text">
                 <div class="text-left">锁定</div>
@@ -85,7 +107,7 @@
             </div>
           </div>
         </div>
-        <!-- <div class="form-item">
+        <div class="form-item">
           <div class="label-box">指点移动:</div>
           <div class="input-box">
             <el-radio-group @change="handle_change_zd_mode" v-model="zd_mode">
@@ -94,73 +116,56 @@
                 v-for="item in drd.dj_mode"
                 :key="item.id"
                 :label="item.id"
-              >{{ item.label }}</el-radio>
+                >{{ item.label }}</el-radio
+              >
             </el-radio-group>
           </div>
-        </div>-->
+        </div>
         <div class="form-item">
           <div class="label-box">跟踪控制:</div>
           <div class="input-box">
-            <el-radio-group v-model="dj_mode" @change="handle_change_dj_mode">
-              <el-radio v-for="item in drd.dj_mode" :key="item.id" size="mini" :label="item.id">
-                {{ item.label }}
-              </el-radio>
+            <el-radio-group @change="handle_change_dj_mode" v-model="dj_mode">
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
             </el-radio-group>
           </div>
         </div>
-        <div class="item-group jcsb ml100 w100">
-          <div class="item-box" @click="handle_take_photo">
-            <el-tooltip class="item" effect="dark" content="拍照" placement="top">
-              <div class="icon-box cp">
-                <!-- <span class="iconfont icon-paizhao1"></span> -->
-                <img src="../assets/images/mount/photo.png" alt />
-              </div>
-            </el-tooltip>
-          </div>
-          <div class="item-box" @click="handle_record">
-            <el-tooltip class="item" effect="dark" content="录像" placement="top">
-              <div class="icon-box cp">
-                <!-- <span class="iconfont icon-dandianshipin"></span> -->
-                <img v-if="!record" src="../assets/images/mount/record.png" alt />
-                <img v-else src="../assets/images/mount/stop.png" alt />
-              </div>
-            </el-tooltip>
-          </div>
-        </div>
+
         <div class="form-item">
-          <div class="label-box">AI识别:</div>
-          <div class="input-box">
-            <el-radio-group v-model="ai_mode" @change="handle_change_ai_mode">
-              <el-radio v-for="item in drd.dj_mode" :key="item.id" size="mini" :label="item.id">
-                {{ item.label }}
-              </el-radio>
-            </el-radio-group>
+          <div class="label-box">
+            变&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;倍
           </div>
-        </div>
-        <div class="form-item">
-          <div class="label-box">变&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;倍</div>
           <div class="input-box">
             <el-input
+              type="number"
               v-model.number="zoom"
               size="mini"
               max="60"
               min="0"
               value="0"
-              onblur="if(value>60)value=60;if(value<0)value=0;if(!value)value=0"
+              @focus="onFocus"
+              @blur="onBlur()"
               placeholder="请输入变倍"
             />
-            <el-button size="mini" type="primary" @click="handle_change_Zoom">
+            <!-- <el-button size="mini" type="primary" @click="handle_change_Zoom">
               <span class="cf">设置</span>
-            </el-button>
+            </el-button> -->
           </div>
         </div>
-        <div class="form-item">
-          <div class="label-box">俯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;仰</div>
+        <!-- <div class="form-item">
+          <div class="label-box">
+            俯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;仰
+          </div>
           <div class="input-box">
             <el-input
               v-model.number="pitch"
               size="mini"
-              max="30"
+              max="90"
               min="-90"
               value="0"
               onblur="if(value>30)value=30;if(value<-90)value=-90;if(!value)value=0"
@@ -172,23 +177,27 @@
           </div>
         </div>
         <div class="form-item">
-          <div class="label-box">航&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;向</div>
+          <div class="label-box">
+            航&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;向
+          </div>
           <div class="input-box">
             <el-input
-              v-model.number="yaw"
               max="145"
               min="-145"
               onblur="if(value>145)value=145;if(value<-145)value=-145;if(!value)value=0"
+              v-model.number="yaw"
               size="mini"
               placeholder="请输入航向"
             />
-            <el-button size="mini" type="primary" @click="handle_change_yaw">
+            <el-button @click="handle_change_yaw" size="mini" type="primary">
               <span class="cf">设置</span>
             </el-button>
           </div>
-        </div>
+        </div> -->
         <div class="form-item">
-          <div class="label-box">变&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;焦</div>
+          <div class="label-box">
+            变&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;焦
+          </div>
           <div class="input-box">
             <div
               class="mr10 cur"
@@ -196,7 +205,7 @@
               @mouseup="stopChange"
               @mouseout="stopChange"
             >
-              <span class="iconfont icon-shanchu3" />
+              <span class="iconfont icon-shanchu3"></span>
             </div>
             <el-slider
               v-model="value"
@@ -205,15 +214,14 @@
               :show-tooltip="false"
               style="width: 10px"
               @change="stopChange"
-              @input="onChangezoom"
-            />
+            ></el-slider>
             <div
               class="ml10 cur"
               @mousedown="handle_zoom_plus()"
               @mouseup="stopChange"
               @mouseout="stopChange"
             >
-              <span class="iconfont icon-tianjia1" />
+              <span class="iconfont icon-tianjia1"></span>
             </div>
           </div>
         </div>
@@ -222,14 +230,14 @@
           <div class="input-box">
             <el-select
               v-model="frameModel"
+              @change="change_frame_model"
               size="mini"
               placeholder="选择模式"
-              @change="change_frame_model"
             >
-              <el-option label="高清" :value="0" />
-              <el-option label="主高清" :value="1" />
-              <el-option label="主红外" :value="2" />
-              <el-option label="红外" :value="3" />
+              <el-option label="高清" :value="0"></el-option>
+              <el-option label="主高清" :value="1"></el-option>
+              <el-option label="主红外" :value="2"></el-option>
+              <el-option label="红外" :value="3"></el-option>
             </el-select>
           </div>
         </div>
@@ -238,75 +246,179 @@
           <div class="input-box">
             <el-select
               v-model="aqerturn_mode"
+              @change="change_aqerturn_mode"
               size="mini"
               placeholder="选择模式"
-              @change="change_aqerturn_mode"
             >
-              <el-option label="关" :value="0" />
-              <el-option label="1" :value="1" />
-              <el-option label="2" :value="2" />
-              <el-option label="3" :value="3" />
-              <el-option label="4" :value="3" />
+              <el-option label="关" :value="0"></el-option>
+              <el-option label="1" :value="1"></el-option>
+              <el-option label="2" :value="2"></el-option>
+              <el-option label="3" :value="3"></el-option>
+              <el-option label="4" :value="4"></el-option>
+              <el-option label="5" :value="5"></el-option>
+              <el-option label="6" :value="6"></el-option>
+              <el-option label="7" :value="7"></el-option>
+              <el-option label="8" :value="8"></el-option>
             </el-select>
           </div>
         </div>
         <div class="form-item">
-          <div class="label-box">红外色板</div>
+          <div class="label-box w87">可见度增强:</div>
           <div class="input-box">
-            <div class="mono">
-              <div class="mono-long">
-                <div
-                  class="mono-left mono_box"
-                  :class="{ active: holdercolorDomV1 == 0 }"
-                  @click="handle_change_click_color(0)"
-                />
-                <div
-                  class="mono-middle mono_box"
-                  :class="{ active: holdercolorDomV1 == 1 }"
-                  @click="handle_change_click_color(1)"
-                />
-                <div
-                  class="mono-right mono_box"
-                  :class="{ active: holdercolorDomV1 == 2 }"
-                  @click="handle_change_click_color(2)"
-                />
+            <el-radio-group
+              @change="handle_change_visibility_mode"
+              v-model="visibility"
+            >
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="label-box">降 噪:</div>
+          <div class="input-box">
+            <el-radio-group @change="handle_change_jz_mode" v-model="jz_mode">
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="label-box">宽 动 态:</div>
+          <div class="input-box">
+            <el-radio-group @change="handle_change_kdt_mode" v-model="Kdt_mode">
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="label-box">电子变倍:</div>
+          <div class="input-box">
+            <el-radio-group @change="handle_change_dz_mode" v-model="dz_mode">
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </div>
+        </div>
+
+        <div class="form-item">
+          <div class="label-box">AI识别:</div>
+          <div class="input-box">
+            <el-radio-group @change="handle_change_ai_mode" v-model="ai_mode">
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </div>
+        </div>
+      </div>
+      <div class="rocker-wrap">
+        <div class="item-group jcsb ml47 mb30 w150">
+          <div @click="handle_take_photo" class="item-box">
+            <el-tooltip
+              class="item"
+              effect="dark"
+              content="拍照"
+              placement="top"
+            >
+              <div class="icon-box cp">
+                <!-- <span class="iconfont icon-paizhao1"></span> -->
+                <img src="../assets/images/mount/photo.png" alt />
               </div>
-              <div class="text">
-                <div class="text-left">白热</div>
-                <div class="text-right">黑热</div>
-                <div class="text-right">彩色</div>
+            </el-tooltip>
+          </div>
+          <div @click="handle_record" class="item-box">
+            <el-tooltip
+              class="item"
+              effect="dark"
+              content="录像"
+              placement="top"
+            >
+              <div class="icon-box cp">
+                <!-- <span class="iconfont icon-dandianshipin"></span> -->
+                <img
+                  v-if="!record"
+                  src="../assets/images/mount/record.png"
+                  alt
+                />
+                <img v-else src="../assets/images/mount/stop.png" alt />
               </div>
-            </div>
+            </el-tooltip>
           </div>
         </div>
+        <div class="rocker" ref="rocker">
+          <div
+            class="shangUp"
+            @mousedown="fangxiang('up')"
+            @mouseup="stopfxFn"
+            @mouseout="stopfxFn"
+          ></div>
+          <div
+            class="xaiUp"
+            @mousedown="fangxiang('down')"
+            @mouseup="stopfxFn"
+            @mouseout="stopfxFn"
+          ></div>
+          <div
+            class="zuoUp"
+            @mousedown="fangxiang('left')"
+            @mouseup="stopfxFn"
+            @mouseout="stopfxFn"
+          ></div>
+          <div
+            class="youUp"
+            @mousedown="fangxiang('right')"
+            @mouseup="stopfxFn"
+            @mouseout="stopfxFn"
+          ></div>
+        </div>
         <div class="form-item">
           <div class="label-box">色彩增益</div>
           <div class="input-box">
             <el-select
               v-model="colour_mode"
+              @change="change_colour_mode"
               size="mini"
               placeholder="选择模式"
-              @change="change_colour_mode"
             >
-              <el-option label="关" :value="0" />
-              <el-option label="1" :value="1" />
-              <el-option label="2" :value="2" />
-              <el-option label="3" :value="3" />
-              <el-option label="4" :value="3" />
+              <el-option label="关" :value="0"></el-option>
+              <el-option label="1" :value="1"></el-option>
+              <el-option label="2" :value="2"></el-option>
+              <el-option label="3" :value="3"></el-option>
+              <el-option label="4" :value="3"></el-option>
+              <el-option label="5" :value="5"></el-option>
+              <el-option label="6" :value="6"></el-option>
+              <el-option label="7" :value="7"></el-option>
+              <el-option label="8" :value="8"></el-option>
             </el-select>
           </div>
         </div>
         <div class="form-item">
-          <div class="label-box w87">可见度增强:</div>
-          <div class="input-box">
-            <el-radio-group v-model="visibility" @change="handle_change_visibility_mode">
-              <el-radio v-for="item in drd.dj_mode" :key="item.id" size="mini" :label="item.id">
-                {{ item.label }}
-              </el-radio>
-            </el-radio-group>
-          </div>
-        </div>
-        <div class="form-item">
           <div class="label-box">电子增稳</div>
           <div class="input-box">
             <div class="mono">
@@ -315,17 +427,17 @@
                   class="mono-left mono_box"
                   :class="{ active: holder_electron_value == 0 }"
                   @click="handle_change_electron_mode(0)"
-                />
+                ></div>
                 <div
                   class="mono-middle mono_box"
                   :class="{ active: holder_electron_value == 1 }"
                   @click="handle_change_electron_mode(1)"
-                />
+                ></div>
                 <div
                   class="mono-right mono_box"
                   :class="{ active: holder_electron_value == 2 }"
                   @click="handle_change_electron_mode(2)"
-                />
+                ></div>
               </div>
               <div class="text">
                 <div class="text-left">关闭</div>
@@ -344,17 +456,17 @@
                   class="mono-left mono_box"
                   :class="{ active: holder_night_value == 0 }"
                   @click="handle_change_night_mode(0)"
-                />
+                ></div>
                 <div
                   class="mono-middle mono_box"
                   :class="{ active: holder_night_value == 1 }"
                   @click="handle_change_night_mode(1)"
-                />
+                ></div>
                 <div
                   class="mono-right mono_box"
                   :class="{ active: holder_night_value == 2 }"
                   @click="handle_change_night_mode(2)"
-                />
+                ></div>
               </div>
               <div class="text">
                 <div class="text-left">自动</div>
@@ -365,56 +477,6 @@
           </div>
         </div>
         <div class="form-item">
-          <div class="label-box">降 噪:</div>
-          <div class="input-box">
-            <el-radio-group v-model="jz_mode" @change="handle_change_jz_mode">
-              <el-radio v-for="item in drd.dj_mode" :key="item.id" size="mini" :label="item.id">
-                {{ item.label }}
-              </el-radio>
-            </el-radio-group>
-          </div>
-        </div>
-        <div class="form-item">
-          <div class="label-box">联控模式:</div>
-          <div class="input-box">
-            <el-radio-group v-model="lk_mode" @change="handle_change_lk_mode">
-              <el-radio v-for="item in drd.dj_mode" :key="item.id" size="mini" :label="item.id">
-                {{ item.label }}
-              </el-radio>
-            </el-radio-group>
-          </div>
-        </div>
-        <div class="form-item">
-          <div class="label-box">宽 动 态:</div>
-          <div class="input-box">
-            <el-radio-group v-model="Kdt_mode" @change="handle_change_kdt_mode">
-              <el-radio v-for="item in drd.dj_mode" :key="item.id" size="mini" :label="item.id">
-                {{ item.label }}
-              </el-radio>
-            </el-radio-group>
-          </div>
-        </div>
-        <div class="form-item">
-          <div class="label-box">电子变倍:</div>
-          <div class="input-box">
-            <el-radio-group v-model="dz_mode" @change="handle_change_dz_mode">
-              <el-radio v-for="item in drd.dj_mode" :key="item.id" size="mini" :label="item.id">
-                {{ item.label }}
-              </el-radio>
-            </el-radio-group>
-          </div>
-        </div>
-        <div class="form-item">
-          <div class="label-box">透雾:</div>
-          <div class="input-box">
-            <el-radio-group v-model="tw_mode" @change="handle_change_tw_mode">
-              <el-radio v-for="item in drd.dj_mode" :key="item.id" size="mini" :label="item.id">
-                {{ item.label }}
-              </el-radio>
-            </el-radio-group>
-          </div>
-        </div>
-        <div class="form-item">
           <div class="label-box">白 平 衡</div>
           <div class="input-box">
             <div class="mono">
@@ -423,17 +485,17 @@
                   class="mono-left mono_box"
                   :class="{ active: holder_bph_value == 0 }"
                   @click="handle_change_bph_mode(0)"
-                />
+                ></div>
                 <div
                   class="mono-middle mono_box"
                   :class="{ active: holder_bph_value == 1 }"
                   @click="handle_change_bph_mode(1)"
-                />
+                ></div>
                 <div
                   class="mono-right mono_box"
                   :class="{ active: holder_bph_value == 2 }"
                   @click="handle_change_bph_mode(2)"
-                />
+                ></div>
               </div>
               <div class="text">
                 <div class="text-left">自动</div>
@@ -443,88 +505,151 @@
             </div>
           </div>
         </div>
-      </div>
-      <div class="rocker-wrap">
-        <div ref="rocker" class="rocker">
-          <div
-            class="shangUp"
-            @mousedown="fangxiang('up')"
-            @mouseup="stopfxFn"
-            @mouseout="stopfxFn"
-          />
-          <div
-            class="xaiUp"
-            @mousedown="fangxiang('down')"
-            @mouseup="stopfxFn"
-            @mouseout="stopfxFn"
-          />
-          <div
-            class="zuoUp"
-            @mousedown="fangxiang('right')"
-            @mouseup="stopfxFn"
-            @mouseout="stopfxFn"
-          />
-          <div
-            class="youUp"
-            @mousedown="fangxiang('left')"
-            @mouseup="stopfxFn"
-            @mouseout="stopfxFn"
-          />
+        <div class="form-item">
+          <div class="label-box">红外色板</div>
+          <div class="input-box">
+            <div class="mono">
+              <div class="mono-long">
+                <div
+                  class="mono-left mono_box"
+                  :class="{ active: holdercolorDomV1 == 0 }"
+                  @click="handle_change_click_color(0)"
+                ></div>
+                <div
+                  class="mono-middle mono_box"
+                  :class="{ active: holdercolorDomV1 == 1 }"
+                  @click="handle_change_click_color(1)"
+                ></div>
+                <div
+                  class="mono-right mono_box"
+                  :class="{ active: holdercolorDomV1 == 2 }"
+                  @click="handle_change_click_color(2)"
+                ></div>
+              </div>
+              <div class="text">
+                <div class="text-left">白热</div>
+                <div class="text-right">黑热</div>
+                <div class="text-right">彩色</div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="label-box">透雾:</div>
+          <div class="input-box">
+            <el-radio-group @change="handle_change_tw_mode" v-model="tw_mode">
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </div>
         </div>
-        <div class="f12 mt20 ml10" style="color: #69e7f1">
+        <div class="form-item">
+          <div class="label-box">联控模式:</div>
+          <div class="input-box">
+            <el-radio-group @change="handle_change_lk_mode" v-model="lk_mode">
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </div>
+        </div>
+        <div class="form-item">
+          <div class="label-box">OSD:</div>
+          <div class="input-box">
+            <el-radio-group @change="handle_OSD" v-model="osd_mode">
+              <el-radio
+                size="mini"
+                v-for="item in drd.dj_mode"
+                :key="item.id"
+                :label="item.id"
+                >{{ item.label }}</el-radio
+              >
+            </el-radio-group>
+          </div>
+        </div>
+        <!-- <div class="f9 mt10 ml10" style="color: #69e7f1">
+          <div class="jcsb">
+            <div class="w70">
+              <span class="cf">俯仰</span>
+              {{ gcs_status_gis.pitch || "0.00" }}
+            </div>
+            <div class="w70">
+              <span class="cf">翻滚</span>
+              {{ gcs_status_gis.roll || "0.00" }}
+            </div>
+          </div>
+          <div class="jcsb mt10">
+            <div class="w70">
+              <span class="cf">航向</span>
+              {{ gcs_status_gis.yaw || "0.00" }}
+            </div>
+            <div class="w70">
+              <span class="cf">倍数</span>
+              {{ jgcjData.zoom || "0" }}
+            </div>
+          </div>
+        </div>
+        <div class="f9 mt10 ml10" style="color: #69e7f1">
           <span class="cf">跟踪状态：</span>
-          {{ gcs_status || '未跟踪' }}
+          {{ gcs_status || "未跟踪" }}
         </div>
         <div v-show="opacity.longitude">
-          <div class="f12 mt20 ml10" style="color: #69e7f1">
+          <div class="f9 mt10 ml10" style="color: #69e7f1">
             <span class="cf">目标经度：</span>
-            {{ opacity.longitude || '暂无' }}
+            {{ opacity.longitude || "暂无" }}
           </div>
-          <div class="f12 mt20 ml10" style="color: #69e7f1">
-            <span class="cf">目标维度：</span>
-            {{ opacity.latitude || '暂无' }}
+          <div class="f9 mt10 ml10" style="color: #69e7f1">
+            <span class="cf">目标纬度：</span>
+            {{ opacity.latitude || "暂无" }}
           </div>
-          <div class="f12 mt20 ml10" style="color: #69e7f1">
+          <div class="f9 mt10 ml10" style="color: #69e7f1">
             <span class="cf">激光测距：</span>
-            {{ jgcj }}m
+            {{ jgcjData.jgcj }}m
           </div>
-        </div>
+        </div> -->
       </div>
     </div>
   </div>
 </template>
 
 <script>
-import { MMC_Gimbal_Z60S } from './js/index_1.js';
-import { MMC_Gimbal_ZT60R } from './js/index.js';
-import svgMB from "./mb.svg";
+import { MMC_Gimbal_ZT60R } from "../utils.js";
 let targetPoint = null;
 export default {
   props: {
     containerStyle: {
       type: Object,
-      default: () => ({})
+      default: () => ({}),
     },
     device: {
       type: Object,
-      default: () => ({})
+      default: () => ({}),
     },
     selected_mount: {
       type: Object,
-      default: () => ({})
+      default: () => ({}),
     },
     moveType: {
       type: String,
-      default: () => ''
+      default: () => "",
     },
     keyFlag: {
       type: Boolean,
-      default: () => false
+      default: () => false,
     },
     payload_data: {
       type: Array,
-      default: () => []
-    }
+      default: () => [],
+    },
   },
 
   data() {
@@ -532,12 +657,12 @@ export default {
       // 画中画
       frameModel: 0,
       // 选择模式
-      control_mode: 3,
+      control_mode: null,
       // 红外色板
       holdercolorDomV1: 1,
       // 点击
       holderModelDomV1: 1,
-      // 云台模式
+      //云台模式
       holderModelDomV2: 1,
       // 跟踪控制
       dj_mode: 0,
@@ -545,7 +670,7 @@ export default {
       pitch: 0,
       // 航向
       yaw: 0,
-      // 变倍
+      //变倍
       zoom: 0,
       // 光圈调节
       aqerturn_mode: 0,
@@ -561,17 +686,19 @@ export default {
       jz_mode: 1,
       // 联控模式
       lk_mode: 0,
+      // osd
+      osd_mode: 1,
       zd_mode: 0,
       // 宽动态
       Kdt_mode: 0,
       // 电子变倍
       dz_mode: 0,
-      // 透雾
+      //透雾
       tw_mode: 0,
       // 白平衡
       holder_bph_value: 0,
       // AI识别
-      ai_mode: 1,
+      ai_mode: 0,
       timer: null,
       value: 25,
       value2: 25,
@@ -579,65 +706,109 @@ export default {
       record: false,
       radio: 1,
       opacity: {},
-      gcs_status: '',
-      jgcj: 0,
+      gcs_status_gis: { pitch: 0, roll: 0, yaw: 0 },
+      gcs_status: "",
+      jgcjData: {
+        jgcj: 0,
+        zoom: 0,
+      },
       drd: {
         dj_mode: [
-          { id: 0, label: '关闭' },
-          { id: 1, label: '打开' }
+          { id: 0, label: "关闭" },
+          { id: 1, label: "打开" },
         ],
         ptz_mode: [
-          { id: 0, label: '锁定' },
-          { id: 1, label: '跟随' },
-          { id: 2, label: '回中' }
-        ]
-      }
+          { id: 0, label: "锁定" },
+          { id: 1, label: "跟随" },
+          { id: 2, label: "回中" },
+        ],
+      },
+      flag: false,
+      watcher: null,
     };
   },
-  computed: {
-    isQingLiu() {
-      return this.$store.state.MMCFlightControlCenter.uav.isQingLiu;
-    }
-  },
   watch: {
     payload_data: {
       handler(value) {
         this.resolve_payload(value);
       },
-      deep: true
-    }
+      deep: true,
+    },
+  },
+  computed: {
+    stream() {
+      return this.$store.state.fckernel.stream;
+    },
+  },
+  mounted() {
+    this.getZoom();
   },
   beforeDestroy() {
     if (targetPoint) {
       window.viewer.entities.remove(targetPoint);
       targetPoint = null;
     }
-    this.$store.commit('device/SET_MOVE_DATA', {
+    this.$store.commit("device/SET_MOVE_DATA", {
       ...this.device,
-      mountStatus: 0
+      mountStatus: 0,
     });
   },
   methods: {
+    onFocus() {
+      if (this.watcher) {
+        this.watcher(); // 调用watcher对象的unwatch方法停止监听
+        this.watcher = null; // 重置watcher变量
+      }
+    },
+    onBlur() {
+      this.getZoom();
+    },
+    getZoom() {
+      setTimeout(() => {
+        this.watcher = this.$watch(
+          () => this.jgcjData,
+          (newValue, oldValue) => {
+            this.zoom = newValue.zoom;
+          }
+        );
+      }, 1000);
+    },
+    handle_OSD(num) {
+      console.log(num, "num");
+      let buffer = null;
+      if (num == 0) {
+        buffer = [165, 79, 13, 85, 170, 220, 8, 46, 1, 0, 1, 0, 1, 39, 69];
+      } else {
+        buffer = [165, 79, 13, 85, 170, 220, 8, 46, 1, 0, 0, 0, 0, 39, 42];
+      }
+      this.commit_directive(buffer);
+    },
     resolve_payload(buff) {
-      const dataArray = new Uint8Array(buff);
-      const opacity = MMC_Gimbal_ZT60R.gcs_transmit_ctrl(dataArray);
+      let dataArray = new Uint8Array(buff);
+      let opacity = MMC_Gimbal_ZT60R.gcs_transmit_ctrl(dataArray);
       if (opacity) {
         this.opacity = opacity;
       }
-      const status = MMC_Gimbal_ZT60R.gcs_status(dataArray);
+      let status = MMC_Gimbal_ZT60R.gcs_status(dataArray, 1);
       if (status) this.gcs_status = status;
       if (opacity) {
         this.init(opacity);
       }
-      const jgcj = MMC_Gimbal_ZT60R.get_msg_D1_parse(dataArray);
+      let gcs_status_gis = MMC_Gimbal_ZT60R.gcs_status(dataArray, 2);
+      if (gcs_status_gis) {
+        this.gcs_status_gis = gcs_status_gis;
+      }
+
+      let jgcj = MMC_Gimbal_ZT60R.get_msg_D1_parse(dataArray);
       if (jgcj != undefined) {
-        this.jgcj = jgcj;
+        this.jgcjData = jgcj;
       }
+      // let aaa = MMC_Gimbal_ZT60R.msg_id(dataArray);
     },
     init(opacity) {
       try {
         if (opacity && opacity.longitude) {
-          const position = Cesium.Cartesian3.fromDegrees(
+          let position = Cesium.Cartesian3.fromDegrees(
             opacity.longitude * 1,
             opacity.latitude * 1,
             opacity.altitude * 1
@@ -648,10 +819,10 @@ export default {
             targetPoint = window.viewer.entities.add({
               position: new Cesium.CallbackProperty(() => this.position, false),
               billboard: {
-                image: svgMB,
+                image: require("./mb.svg"),
                 width: 32,
-                height: 32
-              }
+                height: 32,
+              },
             });
           }
         }
@@ -662,97 +833,131 @@ export default {
     // 点击
     handle_change_click_mode(value) {
       this.holderModelDomV1 = value;
-      const list = {
+      let list = {
         0: [165, 79, 11, 85, 170, 220, 6, 30, 0, 1, 0, 25, 118],
         1: [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 5, 8, 2, 255, 134, 186],
-        2: [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 89, 2, 255, 214, 84]
+        2: [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 89, 2, 255, 214, 84],
       };
-      const buffer = list[value];
+      let buffer = list[value];
       this.commit_directive(buffer);
     },
     // 紅外色版
     handle_change_click_color(value) {
       this.holdercolorDomV1 = value;
-      const list = {
+      let list = {
         0: [165, 79, 10, 85, 170, 220, 5, 28, 3, 192, 218, 101],
         1: [165, 79, 10, 85, 170, 220, 5, 28, 3, 128, 154, 209],
-        2: [165, 79, 10, 85, 170, 220, 5, 28, 4, 128, 157, 165]
+        2: [165, 79, 10, 85, 170, 220, 5, 28, 4, 128, 157, 165],
       };
-      const buffer = list[value];
+      let buffer = list[value];
       this.commit_directive(buffer);
     },
     // 画中画
     change_frame_model(value) {
       this.frameModel = value;
-      const bufferList = {
+      let bufferList = {
         0: [165, 79, 10, 85, 170, 220, 5, 28, 0, 1, 24, 212],
         1: [165, 79, 10, 85, 170, 220, 5, 28, 0, 3, 26, 111],
         2: [165, 79, 10, 85, 170, 220, 5, 28, 0, 4, 29, 86],
-        3: [165, 79, 10, 85, 170, 220, 5, 28, 0, 2, 27, 170]
+        3: [165, 79, 10, 85, 170, 220, 5, 28, 0, 2, 27, 170],
       };
-      const buffer = bufferList[value];
+      let buffer = bufferList[value];
       this.commit_directive(buffer);
     },
     // 云台模式
     handle_change_ptz_mode(value) {
       this.holderModelDomV2 = value;
-      const bufferList = {
-        0: [165, 79, 17, 85, 170, 220, 12, 26, 10, 0, 0, 0, 0, 0, 0, 0, 0, 28, 197],
-        1: [165, 79, 17, 85, 170, 220, 12, 26, 3, 0, 0, 0, 0, 0, 0, 0, 0, 21, 53],
-        2: [165, 79, 17, 85, 170, 220, 12, 26, 4, 0, 0, 0, 0, 0, 0, 0, 0, 18, 101]
+      let bufferList = {
+        0: [
+          165, 79, 17, 85, 170, 220, 12, 26, 10, 0, 0, 0, 0, 0, 0, 0, 0, 28,
+          197,
+        ],
+        1: [
+          165, 79, 17, 85, 170, 220, 12, 26, 3, 0, 0, 0, 0, 0, 0, 0, 0, 21, 53,
+        ],
+        2: [
+          165, 79, 17, 85, 170, 220, 12, 26, 4, 0, 0, 0, 0, 0, 0, 0, 0, 18, 101,
+        ],
       };
-      const buffer = bufferList[value];
+      let buffer = bufferList[value];
+      this.commit_directive(buffer);
+    },
+    change_control_modeV2(val) {
+      let buffer = null;
+      if (val) {
+        buffer = [
+          165, 79, 17, 85, 170, 220, 12, 26, 18, 0, 0, 0, 0, 0, 0, 0, 0, 4, 105,
+        ];
+      } else {
+        buffer = [
+          165, 79, 17, 85, 170, 220, 12, 26, 4, 0, 0, 0, 0, 0, 0, 0, 0, 18, 101,
+        ];
+      }
       this.commit_directive(buffer);
     },
     // 控制选项
-    change_control_mode() {
-      const { control_mode } = this;
-      const control_modeList = {
-        0: [165, 79, 17, 85, 170, 220, 12, 26, 18, 0, 0, 0, 0, 0, 0, 0, 0, 4, 105],
-        1: [165, 79, 17, 85, 170, 220, 12, 26, 22, 0, 0, 0, 0, 0, 0, 0, 0, 0, 180],
-        2: [165, 79, 17, 85, 170, 220, 12, 26, 23, 0, 0, 0, 0, 0, 0, 0, 0, 1, 207],
-        3: [165, 79, 17, 85, 170, 220, 12, 26, 4, 0, 0, 0, 0, 0, 0, 0, 0, 18, 101]
+    change_control_mode(val) {
+      let { control_mode } = this;
+      let control_modeList = {
+        0: [
+          165, 79, 17, 85, 170, 220, 12, 26, 18, 0, 0, 0, 0, 0, 0, 0, 0, 4, 105,
+        ],
+        1: [
+          165, 79, 17, 85, 170, 220, 12, 26, 22, 0, 0, 0, 0, 0, 0, 0, 0, 0, 180,
+        ],
+        2: [
+          165, 79, 17, 85, 170, 220, 12, 26, 23, 0, 0, 0, 0, 0, 0, 0, 0, 1, 207,
+        ],
+        3: [
+          165, 79, 17, 85, 170, 220, 12, 26, 4, 0, 0, 0, 0, 0, 0, 0, 0, 18, 101,
+        ],
       };
-      const buffer = control_modeList[control_mode];
+      let buffer = control_modeList[val];
       this.commit_directive(buffer);
     },
-    // 跟踪控制
+    //跟踪控制
     handle_change_dj_mode(id) {
       let buffer = null;
       // 停止
       if (id == 0) {
-        const list = {
+        let list = {
           0: [165, 79, 11, 85, 170, 220, 6, 30, 0, 1, 0, 25, 118],
-          1: [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 5, 8, 2, 255, 134, 186],
-          2: [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 89, 2, 255, 214, 84]
+          1: [
+            165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 5, 8, 2, 255, 134, 186,
+          ],
+          2: [
+            165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 89, 2, 255, 214, 84,
+          ],
         };
-        const buffer = list[this.holderModelDomV1];
+        let buffer = list[this.holderModelDomV1];
         this.commit_directive(buffer);
-        this.$store.commit('device/SET_MOVE_DATA', {
+        this.$store.commit("device/SET_MOVE_DATA", {
           ...this.device,
-          mountStatus: 0
+          mountStatus: 0,
         });
       } else {
         // 控制
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 52, 3, 255, 186, 205];
-        this.$store.commit('device/SET_MOVE_DATA', {
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 52, 3, 255, 186, 205,
+        ];
+        this.$store.commit("device/SET_MOVE_DATA", {
           ...this.device,
           mountStatus: id,
           mountId: this.selected_mount.mountId,
           moveType: this.moveType,
-          name: this.selected_mount.name
+          name: this.selected_mount.name,
         });
       }
       this.commit_directive(buffer);
     },
     // 指点移动
     handle_change_zd_mode(id) {
-      this.$store.commit('device/SET_MOVE_DATA', {
+      this.$store.commit("device/SET_MOVE_DATA", {
         ...this.device,
         mountStatus: id,
         mountId: this.selected_mount.mountId,
         moveType: this.moveType,
-        name: this.selected_mount.name
+        name: this.selected_mount.name,
       });
     },
     handle_change_pitch() {
@@ -760,88 +965,175 @@ export default {
         this.pitch = 200;
       }
       if (this.pitch) {
-        const buffer = MMC_Gimbal_Z60S.change_pitch_angle(this.pitch);
+        let buffer = MMC_Gimbal_ZT60R.change_pitch_angle(this.pitch);
         this.commit_directive(buffer);
       }
     },
     handle_change_yaw() {
-      const buffer = MMC_Gimbal_Z60S.change_yaw_angle(this.yaw);
+      let buffer = MMC_Gimbal_ZT60R.change_yaw_angle(this.yaw);
       this.commit_directive(buffer);
     },
     // 变倍
     handle_change_Zoom() {
-      const buffer = MMC_Gimbal_ZT60R.zoomTo(this.zoom);
+      let buffer = MMC_Gimbal_ZT60R.zoomTo(this.zoom);
       this.commit_directive(buffer);
     },
-    // 变焦 -
+    //变焦 -
     handle_zoom_reduce() {
-      const list = {
+      let list = {
         0: [165, 79, 10, 85, 170, 220, 5, 28, 2, 57, 34, 195],
         1: [165, 79, 10, 85, 170, 220, 5, 28, 2, 59, 32, 120],
         2: [165, 79, 10, 85, 170, 220, 5, 28, 2, 60, 39, 65],
-        3: [165, 79, 10, 85, 170, 220, 5, 28, 2, 58, 33, 189]
+        3: [165, 79, 10, 85, 170, 220, 5, 28, 2, 58, 33, 189],
       };
       this.commit_directive(list[this.frameModel]);
     },
-    // 变焦 +
+    //变焦 +
     handle_zoom_plus() {
-      const list = {
+      let list = {
         0: [165, 79, 10, 85, 170, 220, 5, 28, 2, 121, 98, 119],
         1: [165, 79, 10, 85, 170, 220, 5, 28, 2, 123, 96, 204],
         2: [165, 79, 10, 85, 170, 220, 5, 28, 2, 124, 103, 245],
-        3: [165, 79, 10, 85, 170, 220, 5, 28, 2, 122, 97, 9]
+        3: [165, 79, 10, 85, 170, 220, 5, 28, 2, 122, 97, 9],
       };
       this.commit_directive(list[this.frameModel]);
     },
+    handle_zoom(e) {
+      let list = null;
+      if (e == 1) {
+        list = {
+          0: [165, 79, 10, 85, 170, 220, 5, 28, 2, 121, 98, 119],
+          1: [165, 79, 10, 85, 170, 220, 5, 28, 2, 123, 96, 204],
+          2: [165, 79, 10, 85, 170, 220, 5, 28, 2, 124, 103, 245],
+          3: [165, 79, 10, 85, 170, 220, 5, 28, 2, 122, 97, 9],
+        };
+      } else {
+        list = {
+          0: [165, 79, 10, 85, 170, 220, 5, 28, 2, 57, 34, 195],
+          1: [165, 79, 10, 85, 170, 220, 5, 28, 2, 59, 32, 120],
+          2: [165, 79, 10, 85, 170, 220, 5, 28, 2, 60, 39, 65],
+          3: [165, 79, 10, 85, 170, 220, 5, 28, 2, 58, 33, 189],
+        };
+      }
+      this.commit_directive(list[this.frameModel]);
+    },
     stopChange() {
       this.value = 25;
       this.value2 = 25;
-      const list = {
+      let list = {
         0: [165, 79, 10, 85, 170, 220, 5, 28, 0, 121, 96, 153],
         1: [165, 79, 10, 85, 170, 220, 5, 28, 0, 123, 98, 34],
         2: [165, 79, 10, 85, 170, 220, 5, 28, 0, 124, 101, 27],
-        3: [165, 79, 10, 85, 170, 220, 5, 28, 0, 122, 99, 231]
+        3: [165, 79, 10, 85, 170, 220, 5, 28, 0, 122, 99, 231],
       };
       this.commit_directive(list[this.frameModel]);
     },
-    handle_zoom(mode) {
-      const list = {
+    handle_zoom_zt60r(mode) {
+      let list = {
         0: [165, 79, 10, 85, 170, 220, 5, 28, 0, 121, 96, 153],
         1: [165, 79, 10, 85, 170, 220, 5, 28, 0, 123, 98, 34],
         2: [165, 79, 10, 85, 170, 220, 5, 28, 0, 124, 101, 27],
-        3: [165, 79, 10, 85, 170, 220, 5, 28, 0, 122, 99, 231]
+        3: [165, 79, 10, 85, 170, 220, 5, 28, 0, 122, 99, 231],
       };
       this.commit_directive(list[this.frameModel]);
     },
     // 光圈调节
     change_aqerturn_mode() {
-      const { aqerturn_mode } = this;
+      let { aqerturn_mode } = this;
       if (aqerturn_mode != 0) {
-        const buffer = [165, 79, 16, 85, 170, 220, 11, 255, 129, 1, 4, 36, 95, 0, 2, 255, 246, 82];
+        let buffer = [
+          165, 79, 16, 85, 170, 220, 11, 255, 129, 1, 4, 36, 95, 0, 2, 255, 246,
+          82,
+        ];
         this.commit_directive(buffer);
       }
       const aqerturn_mode_list = {
-        0: [165, 79, 16, 85, 170, 220, 11, 255, 129, 1, 4, 36, 95, 0, 0, 255, 244, 188],
-        1: [165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 2, 0, 255, 214, 106],
-        2: [165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 4, 0, 255, 208, 197],
-        3: [165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 6, 0, 255, 210, 160],
-        4: [165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 8, 0, 255, 220, 170]
+        0: [
+          165, 79, 16, 85, 170, 220, 11, 255, 129, 1, 4, 36, 95, 0, 0, 255, 244,
+          188,
+        ],
+        1: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 2, 0,
+          255, 214, 106,
+        ],
+        2: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 4, 0,
+          255, 208, 197,
+        ],
+        3: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 6, 0,
+          255, 210, 160,
+        ],
+        4: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 8, 0,
+          255, 220, 170,
+        ],
+        5: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 10, 0,
+          255, 222, 207,
+        ],
+        6: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 12, 0,
+          255, 216, 96,
+        ],
+        7: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 14, 0,
+          255, 218, 5,
+        ],
+        8: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 66, 0, 0, 15, 15,
+          255, 212, 48,
+        ],
       };
       this.commit_directive(aqerturn_mode_list[aqerturn_mode]);
     },
     // 色彩增益
     change_colour_mode() {
-      const { colour_mode } = this;
+      let { colour_mode } = this;
       if (colour_mode != 0) {
-        const buffer = [165, 79, 16, 85, 170, 220, 11, 255, 129, 1, 4, 36, 95, 0, 6, 255, 242, 191];
+        let buffer = [
+          165, 79, 16, 85, 170, 220, 11, 255, 129, 1, 4, 36, 95, 0, 6, 255, 242,
+          191,
+        ];
         this.commit_directive(buffer);
       }
       const colour_mode_list = {
-        0: [165, 79, 16, 85, 170, 220, 11, 255, 129, 1, 4, 36, 95, 0, 2, 255, 246, 82],
-        1: [165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 2, 0, 255, 221, 85],
-        2: [165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 4, 0, 255, 219, 250],
-        3: [165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 6, 0, 255, 217, 159],
-        4: [165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 8, 0, 255, 215, 149]
+        0: [
+          165, 79, 16, 85, 170, 220, 11, 255, 129, 1, 4, 36, 95, 0, 2, 255, 246,
+          82,
+        ],
+        1: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 2, 0,
+          255, 221, 85,
+        ],
+        2: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 4, 0,
+          255, 219, 250,
+        ],
+        3: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 6, 0,
+          255, 217, 159,
+        ],
+        4: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 8, 0,
+          255, 215, 149,
+        ],
+        5: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 10, 0,
+          255, 213, 240,
+        ],
+        6: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 12, 0,
+          255, 211, 95,
+        ],
+        7: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 14, 0,
+          255, 209, 58,
+        ],
+        8: [
+          165, 79, 18, 85, 170, 220, 13, 255, 129, 1, 4, 31, 73, 0, 0, 15, 15,
+          255, 223, 15,
+        ],
       };
       this.commit_directive(colour_mode_list[colour_mode]);
     },
@@ -849,9 +1141,13 @@ export default {
     handle_change_visibility_mode(num) {
       let buffer = null;
       if (num == 0) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 61, 3, 255, 179, 194];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 61, 3, 255, 179, 194,
+        ];
       } else {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 61, 6, 255, 182, 88];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 61, 6, 255, 182, 88,
+        ];
       }
       this.commit_directive(buffer);
     },
@@ -860,11 +1156,17 @@ export default {
       this.holder_electron_value = num;
       let buffer = null;
       if (num == 0) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 52, 3, 255, 186, 205];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 52, 3, 255, 186, 205,
+        ];
       } else if (num == 1) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 52, 2, 255, 187, 186];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 52, 2, 255, 187, 186,
+        ];
       } else {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 52, 2, 255, 187, 186];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 52, 2, 255, 187, 186,
+        ];
       }
       this.commit_directive(buffer);
     },
@@ -873,11 +1175,17 @@ export default {
       this.holder_night_value = num;
       let buffer = null;
       if (num == 0) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 81, 3, 255, 223, 134];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 81, 3, 255, 223, 134,
+        ];
       } else if (num == 1) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 1, 2, 255, 142, 87];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 1, 2, 255, 142, 87,
+        ];
       } else {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 1, 3, 255, 143, 32];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 1, 3, 255, 143, 32,
+        ];
       }
       this.commit_directive(buffer);
     },
@@ -885,9 +1193,13 @@ export default {
     handle_change_jz_mode(num) {
       let buffer = null;
       if (num == 0) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 83, 0, 255, 222, 122];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 83, 0, 255, 222, 122,
+        ];
       } else {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 83, 5, 255, 219, 224];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 83, 5, 255, 219, 224,
+        ];
       }
       this.commit_directive(buffer);
     },
@@ -904,9 +1216,13 @@ export default {
     handle_change_kdt_mode(num) {
       let buffer = null;
       if (num == 0) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 61, 3, 255, 179, 194];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 61, 3, 255, 179, 194,
+        ];
       } else {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 61, 2, 255, 178, 181];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 61, 2, 255, 178, 181,
+        ];
       }
       this.commit_directive(buffer);
     },
@@ -914,9 +1230,13 @@ export default {
     handle_change_dz_mode(num) {
       let buffer = null;
       if (num == 0) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 6, 3, 255, 136, 37];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 6, 3, 255, 136, 37,
+        ];
       } else {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 6, 2, 255, 137, 82];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 6, 2, 255, 137, 82,
+        ];
       }
       this.commit_directive(buffer);
     },
@@ -924,9 +1244,15 @@ export default {
     handle_change_tw_mode(num) {
       let buffer = null;
       if (num == 0) {
-        buffer = [165, 79, 15, 85, 170, 220, 10, 255, 129, 1, 4, 55, 3, 0, 255, 186, 187];
+        buffer = [
+          165, 79, 15, 85, 170, 220, 10, 255, 129, 1, 4, 55, 3, 0, 255, 186,
+          187,
+        ];
       } else {
-        buffer = [165, 79, 15, 85, 170, 220, 10, 255, 129, 1, 4, 55, 2, 3, 255, 184, 136];
+        buffer = [
+          165, 79, 15, 85, 170, 220, 10, 255, 129, 1, 4, 55, 2, 3, 255, 184,
+          136,
+        ];
       }
       this.commit_directive(buffer);
     },
@@ -935,11 +1261,17 @@ export default {
       this.holder_bph_value = num;
       let buffer = null;
       if (num == 0) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 53, 0, 255, 184, 254];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 53, 0, 255, 184, 254,
+        ];
       } else if (num == 1) {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 53, 1, 255, 185, 137];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 53, 1, 255, 185, 137,
+        ];
       } else {
-        buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 53, 2, 255, 186, 16];
+        buffer = [
+          165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 53, 2, 255, 186, 16,
+        ];
       }
       this.commit_directive(buffer);
     },
@@ -955,111 +1287,134 @@ export default {
     },
     close() {
       if (this.record) {
-        this.$message.info('请结束录像后再关闭！');
+        this.$message.info("请结束录像后再关闭！");
       } else {
-        this.$emit('close');
+        this.$emit("close");
       }
     },
     handle_take_photo() {
-      // let { position } = this;
-      // let buffer = MMC_Gimbal_Z30Pro.take_photo(position || {});
-      if (!this.keyFlag) return this.$message.error('拍照失败，NX通信异常！');
-      const streamData = {
+      const buffer = [165, 79, 10, 85, 170, 220, 5, 28, 4, 192, 221, 17];
+      this.commit_directive(buffer);
+      if (!this.keyFlag) return this.$message.error("板载拍照失败，板载通信异常！");
+      let streamData = {
         data: {
           data: {
-            videoID: 1
-          }
+            videoID: 1,
+          },
         },
-        type: 528
+        type: 528,
       };
-      if (this.isQingLiu) {
+      if (this.stream == "QingLiu") {
         streamData.data.messageID = 1016;
       } else {
         streamData.data.messageID = 1007;
       }
-      this.$emit('take_photo', streamData);
+      this.$emit("take_photo", streamData);
     },
     handle_record() {
-      if (!this.keyFlag) return this.$message.error('录像失败，NX通信异常！');
       this.record = !this.record;
-      const streamData = {
+      if (this.record) {
+        this.commit_directive([
+          165, 79, 10, 85, 170, 220, 5, 28, 5, 0, 28, 139,
+        ]);
+      } else {
+        this.commit_directive([
+          165, 79, 10, 85, 170, 220, 5, 28, 5, 64, 92, 63,
+        ]);
+      }
+      if (!this.keyFlag) return this.$message.error("板载录像失败，板载通信异常！");
+      let streamData = {
         data: {
           data: {
-            videoID: 1
-          }
+            videoID: 1,
+          },
         },
-        type: 528
+        type: 528,
       };
-      if (this.isQingLiu) {
+      if (this.stream == "QingLiu") {
         streamData.data.messageID = 1017;
         streamData.data.data.status = this.record;
       } else {
         streamData.data.messageID = 1006;
         streamData.data.data.recordControl = this.record;
       }
-      this.$emit('record', streamData);
+      this.$emit("record", streamData);
 
       // let buffer = MMC_Gimbal_Z30Pro.record(this.record);
       // this.commit_directive(buffer);
     },
 
     onChangezoom(e) {
-      console.log(e, 'e');
       if (e < 25) {
-        const arr = [165, 4, 3, 0, 4];
+        let arr = [165, 4, 3, 0, 4];
         this.commit_directive(arr);
         // this.handle_zoom(0);
       }
       if (e > 25) {
-        const arr = [165, 4, 3, 2, 102];
+        let arr = [165, 4, 3, 2, 102];
         this.commit_directive(arr);
       }
       if (e == 25) {
-        this.handle_zoom(1);
+        this.handle_zoom_zt60r(1);
       }
       this.value2 = e;
     },
 
     commit_directive(buffer) {
-      // console.log(buffer, "buffer");
-      this.$emit('directive', buffer);
+      console.log(buffer, "buffer");
+      this.$emit("directive", buffer);
     },
     fangxiang(type) {
       let buffer = null;
       switch (type) {
-        case 'up':
-          buffer = [165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 4, 176, 118, 108];
+        case "up":
+          buffer = [
+            165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 4, 176,
+            118, 108,
+          ];
           this.commit_directive(buffer);
 
           break;
-        case 'left':
-          buffer = [165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 7, 8, 0, 0, 5, 220, 205, 15];
+        case "left":
+          buffer = [
+            165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 4, 176, 0, 0, 5, 220,
+            118, 216,
+          ];
           this.commit_directive(buffer);
           break;
-        case 'right':
-          buffer = [165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 4, 176, 0, 0, 5, 220, 118, 216];
+        case "right":
+          buffer = [
+            165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 7, 8, 0, 0, 5, 220,
+            205, 15,
+          ];
           this.commit_directive(buffer);
 
           break;
-        case 'down':
-          buffer = [165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 7, 8, 205, 85];
+        case "down":
+          buffer = [
+            165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 7, 8,
+            205, 85,
+          ];
           this.commit_directive(buffer);
       }
     },
     stopfxFn() {
-      const buffer = [165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 5, 220, 27, 60];
+      let buffer = [
+        165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 5, 220, 27,
+        60,
+      ];
       this.commit_directive(buffer);
-    }
-  }
+    },
+  },
 };
 </script>
 
 <style lang="scss" scoped>
 .cpt-MMC_Gimbal_ZT60R {
-  width: 470px;
-  height: 290px;
+  width: 500px;
   background: rgba(0, 23, 79, 0.7);
-  box-shadow: 0 2px 4px 0 rgba(1, 162, 255, 0.35), inset 0 0 40px 0 rgba(0, 184, 255, 0.5);
+  box-shadow: 0 2px 4px 0 rgba(1, 162, 255, 0.35),
+    inset 0 0 40px 0 rgba(0, 184, 255, 0.5);
   border-radius: 10px;
   background-size: 100% 100%;
   box-sizing: border-box;
@@ -1112,70 +1467,16 @@ export default {
     padding: 10px 20px;
     display: flex;
     justify-content: space-between;
-    overflow: auto;
-    height: 230px;
-
+    overflow-y: auto;
+    height: 387px;
+    overflow-x: hidden;
+    margin-top: 10px;
     .form-wrap {
       flex-shrink: 0;
-
-      .form-item {
-        display: flex;
-        align-items: center;
-        height: 40px;
-
-        .label-box {
-          color: #cbd0eb;
-          width: 75px;
-        }
-
-        .input-box {
-          display: flex;
-          align-items: center;
-
-          .mono {
-            display: flex;
-            flex-direction: column;
-
-            .mono-long {
-              display: flex;
-              justify-content: space-between;
-              width: 168px;
-              height: 17px;
-              background: url('../assets/images/mount_long.png') no-repeat;
-              background-size: 100%;
-              margin-bottom: 5px;
-
-              .mono_box {
-                width: 28px;
-                height: 13px;
-                border-radius: 3px;
-                margin-top: 2px;
-                cursor: pointer;
-              }
-
-              .active {
-                background: url('../assets/images/mount/mount_control.png') no-repeat !important;
-                background-size: 100% 100%;
-              }
-            }
-
-            .text {
-              font-size: 14px;
-              font-family: MicrosoftYaHei;
-              color: #ffffff;
-              display: flex;
-              justify-content: space-between;
-              font-size: 14px;
-            }
-          }
-        }
-      }
     }
 
     .rocker-wrap {
-      position: absolute;
-      right: 30px;
-      // flex: 1;
+      flex: 1;
 
       .title-box {
         .title {
@@ -1184,12 +1485,12 @@ export default {
       }
 
       .rocker {
-        // margin: 10px auto 0;
+        margin: 10px auto 0;
         width: 150px;
         height: 150px;
         position: relative;
         margin: 0 auto;
-        background: center url('../assets/images/accident/caozuo.png') no-repeat;
+        background: center url("../assets/images/accident/caozuo.png") no-repeat;
         background-size: 100% 100%;
 
         .shangUp {
@@ -1238,8 +1539,111 @@ export default {
       }
     }
   }
+  .form-item {
+    display: flex;
+    align-items: center;
+    height: 40px;
+    margin-bottom: 13px;
+    .label-box {
+      color: #cbd0eb;
+      width: 75px;
+    }
+
+    .input-box {
+      display: flex;
+      align-items: center;
+
+      .mono {
+        display: flex;
+        flex-direction: column;
+
+        .mono-long {
+          display: flex;
+          justify-content: space-between;
+          width: 140px;
+          height: 17px;
+          background: url("../assets/images/mount_long.png") no-repeat;
+          background-size: 100%;
+          margin-bottom: 5px;
+
+          .mono_box {
+            width: 28px;
+            height: 13px;
+            border-radius: 3px;
+            margin-top: 2px;
+            cursor: pointer;
+          }
+
+          .active {
+            background: url("../assets/images/mount/mount_control.png")
+              no-repeat !important;
+            background-size: 100% 100%;
+          }
+        }
+
+        .text {
+          font-size: 14px;
+          font-family: MicrosoftYaHei;
+          color: #ffffff;
+          display: flex;
+          justify-content: space-between;
+          font-size: 14px;
+        }
+      }
+    }
+  }
 }
-::v-deep.el-slider__bar {
+
+::v-deep {
+  .el-select {
+    width: 165px;
+    margin-right: 5px;
+
+    .el-input {
+      .el-input__inner {
+        background: #000000;
+        border: 1px solid #004fff;
+        color: #dce9ff;
+      }
+    }
+  }
+
+  .el-input {
+    width: 100px;
+    margin-right: 5px;
+
+    .el-input__inner {
+      background: #000000;
+      border: 1px solid #004fff;
+      color: #dce9ff;
+    }
+  }
+
+  .el-radio-group {
+    .el-radio {
+      .el-radio__input {
+        &.is-checked {
+          .el-radio__inner {
+            border-color: #004fff;
+            background: #004fff;
+          }
+        }
+      }
+
+      .el-radio__label {
+        color: #cbd0eb;
+      }
+    }
+  }
+
+  .el-button {
+    background: #004fff;
+    color: #000;
+    border: none;
+  }
+}
+
+.el-slider__bar::v-deep {
   background: #fff;
 }
 
@@ -1267,10 +1671,13 @@ export default {
 }
 
 // 变焦功能
-::v-deep .el-slider__runway {
+.el-slider__runway::v-deep {
   visibility: hidden;
 }
 
+.el-input__icon::v-deep {
+  line-height: 35px;
+}
 .cur {
   cursor: pointer;
 }

src/components/MMCMount/MMC_Gimbal_ZT60R/js/index.js

-// CRC 校验表
+//CRC 校验表
 var crc_table = new Array(
-  0x00,
-  0x31,
-  0x62,
-  0x53,
-  0xc4,
-  0xf5,
-  0xa6,
-  0x97,
-  0xb9,
-  0x88,
-  0xdb,
-  0xea,
-  0x7d,
-  0x4c,
-  0x1f,
-  0x2e,
-  0x43,
-  0x72,
-  0x21,
-  0x10,
-  0x87,
-  0xb6,
-  0xe5,
-  0xd4,
-  0xfa,
-  0xcb,
-  0x98,
-  0xa9,
-  0x3e,
-  0x0f,
-  0x5c,
-  0x6d,
-  0x86,
-  0xb7,
-  0xe4,
-  0xd5,
-  0x42,
-  0x73,
-  0x20,
-  0x11,
-  0x3f,
-  0x0e,
-  0x5d,
-  0x6c,
-  0xfb,
-  0xca,
-  0x99,
-  0xa8,
-  0xc5,
-  0xf4,
-  0xa7,
-  0x96,
-  0x01,
-  0x30,
-  0x63,
-  0x52,
-  0x7c,
-  0x4d,
-  0x1e,
-  0x2f,
-  0xb8,
-  0x89,
-  0xda,
-  0xeb,
-  0x3d,
-  0x0c,
-  0x5f,
-  0x6e,
-  0xf9,
-  0xc8,
-  0x9b,
-  0xaa,
-  0x84,
-  0xb5,
-  0xe6,
-  0xd7,
-  0x40,
-  0x71,
-  0x22,
-  0x13,
-  0x7e,
-  0x4f,
-  0x1c,
-  0x2d,
-  0xba,
-  0x8b,
-  0xd8,
-  0xe9,
-  0xc7,
-  0xf6,
-  0xa5,
-  0x94,
-  0x03,
-  0x32,
-  0x61,
-  0x50,
-  0xbb,
-  0x8a,
-  0xd9,
-  0xe8,
-  0x7f,
-  0x4e,
-  0x1d,
-  0x2c,
-  0x02,
-  0x33,
-  0x60,
-  0x51,
-  0xc6,
-  0xf7,
-  0xa4,
-  0x95,
-  0xf8,
-  0xc9,
-  0x9a,
-  0xab,
-  0x3c,
-  0x0d,
-  0x5e,
-  0x6f,
-  0x41,
-  0x70,
-  0x23,
-  0x12,
-  0x85,
-  0xb4,
-  0xe7,
-  0xd6,
-  0x7a,
-  0x4b,
-  0x18,
-  0x29,
-  0xbe,
-  0x8f,
-  0xdc,
-  0xed,
-  0xc3,
-  0xf2,
-  0xa1,
-  0x90,
-  0x07,
-  0x36,
-  0x65,
-  0x54,
-  0x39,
-  0x08,
-  0x5b,
-  0x6a,
-  0xfd,
-  0xcc,
-  0x9f,
-  0xae,
-  0x80,
-  0xb1,
-  0xe2,
-  0xd3,
-  0x44,
-  0x75,
-  0x26,
-  0x17,
-  0xfc,
-  0xcd,
-  0x9e,
-  0xaf,
-  0x38,
-  0x09,
-  0x5a,
-  0x6b,
-  0x45,
-  0x74,
-  0x27,
-  0x16,
-  0x81,
-  0xb0,
-  0xe3,
-  0xd2,
-  0xbf,
-  0x8e,
-  0xdd,
-  0xec,
-  0x7b,
-  0x4a,
-  0x19,
-  0x28,
-  0x06,
-  0x37,
-  0x64,
-  0x55,
-  0xc2,
-  0xf3,
-  0xa0,
-  0x91,
-  0x47,
-  0x76,
-  0x25,
-  0x14,
-  0x83,
-  0xb2,
-  0xe1,
-  0xd0,
-  0xfe,
-  0xcf,
-  0x9c,
-  0xad,
-  0x3a,
-  0x0b,
-  0x58,
-  0x69,
-  0x04,
-  0x35,
-  0x66,
-  0x57,
-  0xc0,
-  0xf1,
-  0xa2,
-  0x93,
-  0xbd,
-  0x8c,
-  0xdf,
-  0xee,
-  0x79,
-  0x48,
-  0x1b,
-  0x2a,
-  0xc1,
-  0xf0,
-  0xa3,
-  0x92,
-  0x05,
-  0x34,
-  0x67,
-  0x56,
-  0x78,
-  0x49,
-  0x1a,
-  0x2b,
-  0xbc,
-  0x8d,
-  0xde,
-  0xef,
-  0x82,
-  0xb3,
-  0xe0,
-  0xd1,
-  0x46,
-  0x77,
-  0x24,
-  0x15,
-  0x3b,
-  0x0a,
-  0x59,
-  0x68,
-  0xff,
-  0xce,
-  0x9d,
-  0xac
+  0x00, 0x31, 0x62, 0x53, 0xc4, 0xf5, 0xa6, 0x97, 0xb9, 0x88, 0xdb, 0xea, 0x7d, 0x4c, 0x1f, 0x2e,
+  0x43, 0x72, 0x21, 0x10, 0x87, 0xb6, 0xe5, 0xd4, 0xfa, 0xcb, 0x98, 0xa9, 0x3e, 0x0f, 0x5c, 0x6d,
+  0x86, 0xb7, 0xe4, 0xd5, 0x42, 0x73, 0x20, 0x11, 0x3f, 0x0e, 0x5d, 0x6c, 0xfb, 0xca, 0x99, 0xa8,
+  0xc5, 0xf4, 0xa7, 0x96, 0x01, 0x30, 0x63, 0x52, 0x7c, 0x4d, 0x1e, 0x2f, 0xb8, 0x89, 0xda, 0xeb,
+  0x3d, 0x0c, 0x5f, 0x6e, 0xf9, 0xc8, 0x9b, 0xaa, 0x84, 0xb5, 0xe6, 0xd7, 0x40, 0x71, 0x22, 0x13,
+  0x7e, 0x4f, 0x1c, 0x2d, 0xba, 0x8b, 0xd8, 0xe9, 0xc7, 0xf6, 0xa5, 0x94, 0x03, 0x32, 0x61, 0x50,
+  0xbb, 0x8a, 0xd9, 0xe8, 0x7f, 0x4e, 0x1d, 0x2c, 0x02, 0x33, 0x60, 0x51, 0xc6, 0xf7, 0xa4, 0x95,
+  0xf8, 0xc9, 0x9a, 0xab, 0x3c, 0x0d, 0x5e, 0x6f, 0x41, 0x70, 0x23, 0x12, 0x85, 0xb4, 0xe7, 0xd6,
+  0x7a, 0x4b, 0x18, 0x29, 0xbe, 0x8f, 0xdc, 0xed, 0xc3, 0xf2, 0xa1, 0x90, 0x07, 0x36, 0x65, 0x54,
+  0x39, 0x08, 0x5b, 0x6a, 0xfd, 0xcc, 0x9f, 0xae, 0x80, 0xb1, 0xe2, 0xd3, 0x44, 0x75, 0x26, 0x17,
+  0xfc, 0xcd, 0x9e, 0xaf, 0x38, 0x09, 0x5a, 0x6b, 0x45, 0x74, 0x27, 0x16, 0x81, 0xb0, 0xe3, 0xd2,
+  0xbf, 0x8e, 0xdd, 0xec, 0x7b, 0x4a, 0x19, 0x28, 0x06, 0x37, 0x64, 0x55, 0xc2, 0xf3, 0xa0, 0x91,
+  0x47, 0x76, 0x25, 0x14, 0x83, 0xb2, 0xe1, 0xd0, 0xfe, 0xcf, 0x9c, 0xad, 0x3a, 0x0b, 0x58, 0x69,
+  0x04, 0x35, 0x66, 0x57, 0xc0, 0xf1, 0xa2, 0x93, 0xbd, 0x8c, 0xdf, 0xee, 0x79, 0x48, 0x1b, 0x2a,
+  0xc1, 0xf0, 0xa3, 0x92, 0x05, 0x34, 0x67, 0x56, 0x78, 0x49, 0x1a, 0x2b, 0xbc, 0x8d, 0xde, 0xef,
+  0x82, 0xb3, 0xe0, 0xd1, 0x46, 0x77, 0x24, 0x15, 0x3b, 0x0a, 0x59, 0x68, 0xff, 0xce, 0x9d, 0xac
 );
-// A1
+// A1 
 var A1_SERVO_STATUS = {
   motoroff: 0x00,
   manualcontrol: 0x01,
@@ -268,13 +28,13 @@ var A1_SERVO_STATUS = {
   lockyaw: 0x0a,
   turntoframeangle: 0x0b,
   rcmode: 0x0d,
-  movetofinger: 0x0e,
+  movetofinger: 0x0E,
   noaction: 0x0f,
   lookdown: 0x12,
   centeryaw: 0x16,
   levelpitch: 0x17
-};
-// crc校验字节生成函数
+}
+//crc校验字节生成函数
 function cal_crc_table(array) {
   var crc = 0;
   var i = 1;
@@ -290,14 +50,14 @@ var A1_PARAM_INT16 = {
   PARAM2: 0x0000,
   PARAM3: 0x0000,
   PARAM4: 0x0000
-};
+}
 var A1_CMD_ANGLE = {
   server_status: A1_SERVO_STATUS.noaction,
   param1: A1_PARAM_INT16.PARAM1,
   param2: A1_PARAM_INT16.PARAM2,
   param3: A1_PARAM_INT16.PARAM3,
   param4: A1_PARAM_INT16.PARAM4
-};
+}
 var viewlink_cmdLEN = {
   // cmd_DATA_len + 3(len+cmdid+cs)
   A1C1E1: 17,
@@ -319,7 +79,7 @@ var viewlink_cmdLEN = {
   M_AHRS: 45,
   HEART_BEAT: 4,
   SHAKE_HAND: 4,
-  // //FOLLOW CMD NOT +3
+  ////FOLLOW CMD NOT +3
   T1F1B1D1_DATA: 41,
   T2F2B2D2_DATA: 49,
   T1_DATA: 22,
@@ -330,10 +90,9 @@ var viewlink_cmdLEN = {
   F2_DATA: 15,
   B2_DATA: 11,
   D2_DATA: 5
-};
+}
 var viewlinkheadlen = 3;
-var viewlinkFrameLen = {
-  // the position of checksum
+var viewlinkFrameLen = { // the position of checksum
   A1C1E1: viewlink_cmdLEN.A1C1E1 + viewlinkheadlen,
   A1C1E1S1: viewlink_cmdLEN.A1C1E1S1 + viewlinkheadlen,
   A2C2E2: viewlink_cmdLEN.A2C2E2 + viewlinkheadlen,
@@ -350,12 +109,12 @@ var viewlinkFrameLen = {
   V: viewlink_cmdLEN.V + viewlinkheadlen,
   M_AHRS: viewlink_cmdLEN.M_AHRS + viewlinkheadlen,
   HEART_BEAT: viewlink_cmdLEN.HEART_BEAT + viewlinkheadlen,
-  SHAKE_HAND: viewlink_cmdLEN.SHAKE_HAND + viewlinkheadlen
-};
+  SHAKE_HAND: viewlink_cmdLEN.SHAKE_HAND + viewlinkheadlen,
 
-var mmcAddLen = 2; // (len+cs)
-var mmcCmdLen = {
-  // the position of checksum
+}
+
+var mmcAddLen = 2; //(len+cs)
+var mmcCmdLen = { // the position of checksum
   A1C1E1: viewlinkFrameLen.A1C1E1 + mmcAddLen,
   A1C1E1S1: viewlinkFrameLen.A1C1E1S1 + mmcAddLen,
   A2C2E2: viewlinkFrameLen.A2C2E2 + mmcAddLen,
@@ -372,8 +131,8 @@ var mmcCmdLen = {
   V: viewlinkFrameLen.V + mmcAddLen,
   M_AHRS: viewlinkFrameLen.M_AHRS + mmcAddLen,
   HEART_BEAT: viewlinkFrameLen.HEART_BEAT + mmcAddLen,
-  SHAKE_HAND: viewlinkFrameLen.SHAKE_HAND + mmcAddLen
-};
+  SHAKE_HAND: viewlinkFrameLen.SHAKE_HAND + mmcAddLen,
+}
 
 function C2_to_array(C2_CMD) {
   var array = new Array();
@@ -383,8 +142,7 @@ function C2_to_array(C2_CMD) {
   return array;
 }
 var mmcHeadLen = 2;
-var mmcFrameLen = {
-  // the position of checksum
+var mmcFrameLen = { // the position of checksum
   A1C1E1: mmcCmdLen.A1C1E1 + mmcHeadLen,
   A1C1E1S1: mmcCmdLen.A1C1E1S1 + mmcHeadLen,
   A2C2E2: mmcCmdLen.A2C2E2 + mmcHeadLen,
@@ -401,11 +159,10 @@ var mmcFrameLen = {
   V: mmcCmdLen.V + mmcHeadLen,
   M_AHRS: mmcCmdLen.M_AHRS + mmcHeadLen,
   HEART_BEAT: mmcCmdLen.HEART_BEAT + mmcHeadLen,
-  SHAKE_HAND: mmcCmdLen.SHAKE_HAND + mmcHeadLen
-};
+  SHAKE_HAND: mmcCmdLen.SHAKE_HAND + mmcHeadLen,
+}
 var viewlinkheadlen = 3;
-var viewlinkFrameLen = {
-  // the position of checksum
+var viewlinkFrameLen = { // the position of checksum
   A1C1E1: viewlink_cmdLEN.A1C1E1 + viewlinkheadlen,
   A1C1E1S1: viewlink_cmdLEN.A1C1E1S1 + viewlinkheadlen,
   A2C2E2: viewlink_cmdLEN.A2C2E2 + viewlinkheadlen,
@@ -422,49 +179,49 @@ var viewlinkFrameLen = {
   V: viewlink_cmdLEN.V + viewlinkheadlen,
   M_AHRS: viewlink_cmdLEN.M_AHRS + viewlinkheadlen,
   HEART_BEAT: viewlink_cmdLEN.HEART_BEAT + viewlinkheadlen,
-  SHAKE_HAND: viewlink_cmdLEN.SHAKE_HAND + viewlinkheadlen
-};
+  SHAKE_HAND: viewlink_cmdLEN.SHAKE_HAND + viewlinkheadlen,
+
+}
 // D1光学状态
 const D1_CMD = {
-  SENSOR: 0, // bit0-2
-  IR_DZOOM: 0, // bit3-6
-  IR_WHITE_BLACK: 0, // bit7
-  // res: 0x00,
+  SENSOR: 0, //bit0-2
+  IR_DZOOM: 0, //bit3-6
+  IR_WHITE_BLACK: 0, //bit7
+  //res: 0x00,
   recstatus: 0, // bit0-1
-  ir_gray_color: 0, // bit2-5
-  eo_dzoom: 0, // bit6-9
-  res: 0, // bit10-15
-  lrf_value: 0, // byte 5-6
+  ir_gray_color: 0, //bit2-5
+  eo_dzoom: 0, //bit6-9
+  res: 0, //bit10-15
+  lrf_value: 0, //byte 5-6
   v_fov: 0,
   h_fov: 0,
-  eo_zoom: 0
+  eo_zoom: 0,
 };
 
 var viewlink_cmdID = {
-  A1C1E1: 0x30,
-  A1C1E1S1: 0x32,
-  A2C2E2: 0x31,
-  A2C2E2S2: 0x33,
-  A1: 0x1a,
-  A2: 0x2a,
-  C1: 0x1c,
-  C2: 0x2c,
-  E1: 0x1e,
-  E2: 0x2e,
-  S1: 0x16,
-  S2: 0x26,
-  U: 0x01,
-  V: 0x02,
-  M_AHRS: 0xb1,
-  HEART_BEAT: 0x10,
-  SHAKE_HAND: 0x00,
+  A1C1E1: 0X30,
+  A1C1E1S1: 0X32,
+  A2C2E2: 0X31,
+  A2C2E2S2: 0X33,
+  A1: 0X1A,
+  A2: 0X2A,
+  C1: 0X1C,
+  C2: 0X2C,
+  E1: 0x1E,
+  E2: 0X2E,
+  S1: 0X16,
+  S2: 0X26,
+  U: 0X01,
+  V: 0X02,
+  M_AHRS: 0XB1,
+  HEART_BEAT: 0X10,
+  SHAKE_HAND: 0X00,
   T1F1B1D1: 0x40,
-  T2F2B2D2: 0x41,
-  FW: 0xff
-};
+  T2F2B2D2: 0X41,
+  FW: 0XFF
+}
 
-var mmc_cs_pos = {
-  // the position of checksum
+var mmc_cs_pos = { // the position of checksum
   A1C1E1: mmcFrameLen.A1C1E1 - 1,
   A1C1E1S1: mmcFrameLen.A1C1E1S1 - 1,
   A2C2E2: mmcFrameLen.A2C2E2 - 1,
@@ -481,34 +238,34 @@ var mmc_cs_pos = {
   V: mmcFrameLen.V - 1,
   M_AHRS: mmcFrameLen.M_AHRS - 1,
   HEART_BEAT: mmcFrameLen.HEART_BEAT - 1,
-  SHAKE_HAND: mmcFrameLen.SHAKE_HAND - 1
-};
+  SHAKE_HAND: mmcFrameLen.SHAKE_HAND - 1,
+}
 
 const T1_1_012_LRFsource = {
   noObject: 0,
   LRFvalue: 1,
   altitudevalue: 2,
-  rfvalue: 3
+  rfvalue: 3,
 };
 const T1_1_34_signal = {
   nosignal: 0,
   timelock: 1,
   lock2D: 2,
-  lock3D: 3
+  lock3D: 3,
 };
 const T1_1_567_GPS_H_signal = {
-  data: 1
+  data: 1,
 };
 
 const T1_2_012_GPS_V_signal = {
-  data: 1
+  data: 1,
 };
 const T1_2_3_S2 = {
   no: 0,
-  yes: 1
+  yes: 1,
 };
 const T1_2_4567_N = {
-  gyrooffsetadj: 0
+  gyrooffsetadj: 0,
 };
 
 const T1_CMD = {
@@ -518,15 +275,14 @@ const T1_CMD = {
   B2_bit012: T1_2_012_GPS_V_signal.data,
   B2_bit3: T1_2_3_S2.no,
   B2_bit4567: T1_2_4567_N.gyrooffsetadj,
-  UAV_latitude: 0x00000000, // 1e7
+  UAV_latitude: 0x00000000, //1e7
   UAV_longitude: 0x00000000,
   UAV_altitude: 0x0000,
   Target_latitude: 0x00000000,
   Target_longitude: 0x00000000,
-  Target_altitude: 0x0000
+  Target_altitude: 0x0000,
 };
-var viewlink_cs_pos = {
-  // the position of checksum
+var viewlink_cs_pos = { // the position of checksum
   A1C1E1: viewlinkFrameLen.A1C1E1 - 1,
   A1C1E1S1: viewlinkFrameLen.A1C1E1S1 - 1,
   A2C2E2: viewlinkFrameLen.A2C2E2 - 1,
@@ -543,8 +299,8 @@ var viewlink_cs_pos = {
   V: viewlinkFrameLen.V - 1,
   M_AHRS: viewlinkFrameLen.M_AHRS - 1,
   HEART_BEAT: viewlinkFrameLen.HEART_BEAT - 1,
-  SHAKE_HAND: viewlinkFrameLen.SHAKE_HAND - 1
-};
+  SHAKE_HAND: viewlinkFrameLen.SHAKE_HAND - 1,
+}
 const C2_ctrl = {
   noaction: 0,
   eodzoomon: 6,
@@ -564,12 +320,12 @@ const C2_ctrl = {
   eoICRon: 0x4a,
   eoICRoff: 0x4b,
   eozoomto: 0x53,
-  laserctrl: 0x74
+  laserctrl: 0x74,
 };
 const C2_CMD_ZOOM = {
   ctrl: C2_ctrl.eozoomto,
   param: 0x0000
-};
+}
 
 function msg_TIF1B1D1_parse(rdata) {
   var msgdata = new Uint8Array(rdata);
@@ -618,7 +374,7 @@ function msg_TIF1B1D1_parse_d1(rdata) {
 }
 
 function msg_D1_parse(rdata) {
-  // 品灵云台d1包解包函数
+  //品灵云台d1包解包函数
   D1_CMD.SENSOR = rdata[0] & 0x07;
   D1_CMD.IR_DZOOM = (rdata[0] & 0x78) >> 3;
   D1_CMD.IR_WHITE_BLACK = rdata[0] >> 7;
@@ -633,29 +389,36 @@ function msg_D1_parse(rdata) {
   // //Z30Pro关掉录像测距
   // set_record_mode(mode);
   // set_zoom_times(D1_CMD.eo_zoom);
-  return D1_CMD.lrf_value / 10;
+  return {
+    zoom: D1_CMD.eo_zoom.toFixed(2),
+    jgcj: D1_CMD.lrf_value / 10 //激光测距
+  }
 }
 
 function msg_T1_parse(rdata) {
-  // 品灵云台F1包解包函数
-  T1_CMD.UAV_latitude = ((rdata[2] << 24) | (rdata[3] << 16) | (rdata[4] << 8) | rdata[5]) / 1e7;
-  T1_CMD.UAV_longitude = ((rdata[6] << 24) | (rdata[7] << 16) | (rdata[8] << 8) | rdata[9]) / 1e7;
+  //品灵云台F1包解包函数
+  T1_CMD.UAV_latitude =
+    ((rdata[2] << 24) | (rdata[3] << 16) | (rdata[4] << 8) | rdata[5]) / 1e7;
+  T1_CMD.UAV_longitude =
+    ((rdata[6] << 24) | (rdata[7] << 16) | (rdata[8] << 8) | rdata[9]) / 1e7;
   T1_CMD.UAV_altitude = (rdata[10] << 8) | rdata[11];
   T1_CMD.Target_latitude =
-    ((rdata[12] << 24) | (rdata[13] << 16) | (rdata[14] << 8) | rdata[15]) / 1e7;
+    ((rdata[12] << 24) | (rdata[13] << 16) | (rdata[14] << 8) | rdata[15]) /
+    1e7;
   T1_CMD.Target_longitude =
-    ((rdata[16] << 24) | (rdata[17] << 16) | (rdata[18] << 8) | rdata[19]) / 1e7;
+    ((rdata[16] << 24) | (rdata[17] << 16) | (rdata[18] << 8) | rdata[19]) /
+    1e7;
   T1_CMD.Target_altitude = (rdata[20] << 8) | rdata[21];
 
   var int16data = new Int16Array(1);
   int16data[0] = (rdata[20] << 8) | rdata[21];
   T1_CMD.Target_altitude = int16data[0];
-
   return {
     longitude: T1_CMD.Target_longitude,
     latitude: T1_CMD.Target_latitude,
-    altitude: T1_CMD.Target_altitude
-  };
+    altitude: T1_CMD.Target_altitude,
+  }
+
 }
 
 function A1_to_array(A1_CMD) {
@@ -688,20 +451,19 @@ function viewlink_checksum(array) {
 }
 
 function pack_A1(A1CMD) {
-  const A1_data_array = A1_to_array(A1CMD); // 9
-  const A1pack_array = [0x55, 0xaa, 0xdc, 0x00, 0x00];
-  A1pack_array[3] = viewlink_cmdLEN.A1; // 12
+  let A1_data_array = A1_to_array(A1CMD); //9
+  let A1pack_array = [0x55, 0xaa, 0xdc, 0X00, 0X00];
+  A1pack_array[3] = viewlink_cmdLEN.A1; //12
   A1pack_array[4] = viewlink_cmdID.A1;
 
-  A1_data_array.forEach(function (item) {
-    // 将A1CMD的数据提取出，拼接在A1pack_array
-    A1pack_array.push(item);
-  });
+  A1_data_array.forEach(function (item) { // 将A1CMD的数据提取出，拼接在A1pack_array
+    A1pack_array.push(item)
+  })
 
   A1pack_array[viewlink_cs_pos.A1] = viewlink_checksum(A1pack_array);
   return A1pack_array;
 }
-// 数据分包发送函数
+//数据分包发送函数
 function package_send(buff, len) {
   var i = 0;
   var j = 0;
@@ -710,6 +472,7 @@ function package_send(buff, len) {
   var hexbuf = [];
   var sendbuf = [];
 
+
   if (len % 48 == 0) {
     count = parseInt(len / 48, 10);
   } else {
@@ -717,24 +480,26 @@ function package_send(buff, len) {
   }
 
   for (i = 0; i < count; i++) {
-    if (count - i == 1) {
+    if ((count - i) == 1) {
       for (j = 0; j < len - i * 48; j++) {
         sendbuf[j] = buff[i * 48 + j];
         hexbuf[j] = Number(buff[i * 48 + j]).toString(16);
       }
-      return sendbuf;
+      return sendbuf
     } else {
+
       for (j = 0; j < 48; j++) {
         sendbuf[j] = buff[i * 48 + j];
         hexbuf[j] = Number(buff[i * 48 + j]).toString(16);
       }
-      return sendbuf;
+      return sendbuf
     }
   }
+
 }
 
 function pack_C2(C2_CMD) {
-  var C2_data_array = C2_to_array(C2_CMD); // 9
+  var C2_data_array = C2_to_array(C2_CMD); //9
   var C2pack_array = [0x55, 0xaa, 0xdc, 0x00, 0x00];
   C2pack_array[3] = viewlink_cmdLEN.C2;
   C2pack_array[4] = viewlink_cmdID.C2;
@@ -746,17 +511,17 @@ function pack_C2(C2_CMD) {
 }
 
 function set_tracker_status(trackstatus) {
-  if (trackstatus == 3) {
-    return '丢失';
-  } else if (trackstatus == 2) {
-    return '跟踪中';
-  } else if (trackstatus == 1) {
-    return '搜索';
-  } else return '停止';
+  if (trackstatus == 3)
+    return "丢失";
+  else if (trackstatus == 2)
+    return "跟踪中";
+  else if (trackstatus == 1)
+    return '搜索'
+  else return "停止";
 }
 
 function msg_F1_parse(rdata) {
-  // 品灵云台f1包解包函数
+  //品灵云台f1包解包函数
   F1_CMD.tracksource = rdata & 0x07;
   F1_CMD.trackstatus = (rdata & 0x18) >> 3;
   return set_tracker_status(F1_CMD.trackstatus);
@@ -765,13 +530,13 @@ function msg_F1_parse(rdata) {
 const F1_tracksensor = {
   eo1: 0,
   ir: 1,
-  eo2: 2
+  eo2: 2,
 };
 const F1_trackstatus = {
   stop: 0,
   search: 1,
   tracking: 2,
-  lost: 3
+  lost: 3,
 };
 const F1_CMD = {
   tracksource: F1_tracksensor.eo1,
@@ -780,10 +545,31 @@ const F1_CMD = {
   trackstatus: F1_trackstatus.stop,
   trackstatus: F1_trackstatus.search,
   trackstatus: F1_trackstatus.tracking,
-  trackstatus: F1_trackstatus.lost
+  trackstatus: F1_trackstatus.lost,
+};
+const B1_servo_status = {
+  motorsw: 0x00,
+  manualcontrol: 0x01,
+  followyaw: 0x03,
+  homeposition: 0x04,
+  trackmode: 0x06,
+  turntorelativeangle: 0x09,
+  lockyaw: 0x0a,
+  turntoframeangle: 0x0b,
+  RCcontrol: 0x0d,
+  fingerto: 0x0e,
+  error: 0x0f,
+};
+const B1_CMD = {
+  GIMrollangle_8_11: 0,
+  servestatus: B1_servo_status.manualcontrol,
+  GIMrollangle_0_7: 0x00,
+  GIMrollangle: 0,
+  GIMyawangle: 0,
+  GIMpitchangle: 0,
 };
 
-function msg_TIF1B1D1_parse_F1(rdata) {
+function msg_TIF1B1D1_parse_F1(rdata, num) {
   var msgdata = new Uint8Array(rdata);
   var T1buf = new Uint8Array(22);
   var F1buf = new Uint8Array(1);
@@ -803,19 +589,164 @@ function msg_TIF1B1D1_parse_F1(rdata) {
   for (i = 0; i < 12; i++) {
     D1buf[i] = msgdata[i + 34];
   }
-  return msg_F1_parse(F1buf);
+  if (num == 1) {
+
+    return msg_F1_parse(F1buf);
+  } else {
+    return msg_B1_parse(B1buf)
+  }
 }
 
+function msg_B1_parse(rdata) {
+  //品灵云台B1包解包函数
+  B1_CMD.GIMrollangle_8_11 = rdata[0] & 0x0f;
+  B1_CMD.servestatus = rdata[0] >> 4;
+  B1_CMD.GIMrollangle_0_7 = rdata[1];
+  B1_CMD.GIMrollangle =
+    (((B1_CMD.GIMrollangle_8_11 << 8) | B1_CMD.GIMrollangle_0_7) * 180) / 4095;
+  B1_CMD.GIMrollangle = B1_CMD.GIMrollangle - 90;
+  B1_CMD.GIMyawangle = (((rdata[2] << 8) | rdata[3]) * 360) / 65536;
+  B1_CMD.GIMpitchangle = (((rdata[4] << 8) | rdata[5]) * 360) / 65536;
+  B1_CMD.GIMyawangle = ((B1_CMD.GIMyawangle + 540) % 360) - 180;
+  B1_CMD.GIMpitchangle = ((B1_CMD.GIMpitchangle + 540) % 360) - 180;
+  // 俯仰偏航 翻滚
+  return {
+    pitch: B1_CMD.GIMpitchangle.toFixed(2),
+    roll: B1_CMD.GIMrollangle.toFixed(2),
+    yaw: B1_CMD.GIMyawangle.toFixed(2),
+  }
+}
 export const MMC_Gimbal_ZT60R = {
+  change_pitch_angle(angle) {
+ 
+    let A1_CMD_ANGLE= {
+      "server_status": 11,
+      "param1": 0,
+      "param2": 0,
+      "param3": 0,
+      "param4": 0
+  }
+    var buff = new Array(0xA5, 0x4f, 0x00);
+    buff[2] = 17;
+    A1_CMD_ANGLE.server_status = 11;
+    var pitchangle = 0;
+    if (angle >= 0) {
+        pitchangle = angle;
+        A1_CMD_ANGLE.param2 = pitchangle * 65536 / 360;
+    }
+    else {
+        pitchangle = angle;
+        A1_CMD_ANGLE.param2 = pitchangle * 65536 / 360 + 65536;
+    }
+    var buff_arr = pack_A1(A1_CMD_ANGLE);
+    buff_arr.forEach(function (item) {
+        buff.push(item)
+    })
+    buff[18] = cal_crc_table(buff);
+
+    return package_send(buff, 19);
+
+
+},
+change_yaw_angle(num) {
+  let angle = Number(num);
+  let buff = new Array(0xA5, 0x4f, 0x00);
+  buff[2] = mmcCmdLen.A1;
+  A1_CMD_ANGLE.server_status = A1_SERVO_STATUS.turntoframeangle;
+  let yawangle = 0;
+  if (angle >= 0) {
+      yawangle = angle;
+      A1_CMD_ANGLE.param1 = yawangle * 65536 / 360;
+  }
+  else {
+      yawangle = angle;
+      A1_CMD_ANGLE.param1 = yawangle * 65536 / 360 + 65536;
+  }
+  let buff_arr = pack_A1(A1_CMD_ANGLE);
+  buff_arr.forEach(function (item) {
+      buff.push(item)
+  })
+  console.log(buff_arr,'buff_arr');
+  buff[mmc_cs_pos.A1] = cal_crc_table(buff);
+  return package_send(buff, mmcFrameLen.A1);
+
+},
+  gimbal_pitch_ctrl(type) {
+    let buffer = null
+    if (type == 1) {
+      buffer = [
+        165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 4, 176,
+        118, 108,
+      ];
+    } else if(type == -1) {
+      buffer = [
+        165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 7, 8,
+        205, 85,
+      ];
+    } else {
+      buffer = [
+        165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 5, 220, 27,
+        60,
+      ];
+    }
+    return buffer
+  },
+  gimbal_yaw_ctrl(type) {
+    let buffer = null
+    if (type == 1) {
+      buffer = [
+        165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 7, 8, 0, 0, 5, 220,
+        205, 15,
+      ];
+    } else if(type == -1) {
+      buffer = [
+        165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 4, 176, 0, 0, 5, 220,
+        118, 216,
+      ];
+    } else {
+       buffer = [
+        165, 79, 17, 85, 170, 220, 12, 26, 13, 0, 0, 5, 220, 0, 0, 5, 220, 27,
+        60,
+      ];
+    }
+    return buffer
+  },
+  zoom(val, model) {
+    console.log(val,model);
+    let list = []
+    if (!val) {
+      list = {
+        0: [165, 79, 10, 85, 170, 220, 5, 28, 2, 57, 34, 195],
+        1: [165, 79, 10, 85, 170, 220, 5, 28, 2, 59, 32, 120],
+        2: [165, 79, 10, 85, 170, 220, 5, 28, 2, 60, 39, 65],
+        3: [165, 79, 10, 85, 170, 220, 5, 28, 2, 58, 33, 189],
+      }
+    } else if(val == 2) {
+      list = {
+        0: [165, 79, 10, 85, 170, 220, 5, 28, 2, 121, 98, 119],
+        1: [165, 79, 10, 85, 170, 220, 5, 28, 2, 123, 96, 204],
+        2: [165, 79, 10, 85, 170, 220, 5, 28, 2, 124, 103, 245],
+        3: [165, 79, 10, 85, 170, 220, 5, 28, 2, 122, 97, 9],
+      }
+    }else if(val == 1) {
+      list = {
+        0: [165, 79, 10, 85, 170, 220, 5, 28, 0, 121, 96, 153],
+        1: [165, 79, 10, 85, 170, 220, 5, 28, 0, 123, 98, 34],
+        2: [165, 79, 10, 85, 170, 220, 5, 28, 0, 124, 101, 27],
+        3: [165, 79, 10, 85, 170, 220, 5, 28, 0, 122, 99, 231],
+      }
+    }
+    return list[model]
+  },
   zoomTo(value) {
     const zoom = Number(value);
-    const buff = [0xa5, 0x4f, 0x00];
+    const buff = [0xA5, 0x4f, 0x00];
     buff[2] = mmcCmdLen.C2;
     C2_CMD_ZOOM.param = zoom * 10;
     const buff_arr = pack_C2(C2_CMD_ZOOM);
     buff_arr.forEach(function (item) {
-      buff.push(item);
-    });
+      buff.push(item)
+    })
     buff[mmc_cs_pos.C2] = cal_crc_table(buff);
     return package_send(buff, mmcFrameLen.C2);
   },
@@ -842,7 +773,7 @@ export const MMC_Gimbal_ZT60R = {
     }
   },
 
-  gcs_status(rdata) {
+  gcs_status(rdata,num) {
     var i = 0;
     var viewlinkframelen = 0;
     if (rdata[3] == 0x55 && rdata[4] == 0xaa && rdata[5] == 0xdc) {
@@ -856,7 +787,7 @@ export const MMC_Gimbal_ZT60R = {
         if (viewlink_checksum(readdata) == readdata[viewlinkframelen - 1]) {
           switch (rdata[7]) {
             case viewlink_cmdID.T1F1B1D1:
-              return msg_TIF1B1D1_parse_F1(readdata);
+              return msg_TIF1B1D1_parse_F1(readdata,num);
               break;
           }
         }
@@ -874,7 +805,6 @@ export const MMC_Gimbal_ZT60R = {
         for (i = 0; i < viewlinkframelen; i++) {
           readdata[i] = rdata[i + 3];
         }
-
         if (viewlink_checksum(readdata) == readdata[viewlinkframelen - 1]) {
           switch (rdata[7]) {
             case viewlink_cmdID.T1F1B1D1:
@@ -886,4 +816,4 @@ export const MMC_Gimbal_ZT60R = {
       }
     }
   }
-};
+}
\ No newline at end of file

src/components/MMCMount/MMC_Gimbal_ZT60R/js/index_1.js

-// CRC 校验表
-var crc_table = new Array(
-  0x00,
-  0x31,
-  0x62,
-  0x53,
-  0xc4,
-  0xf5,
-  0xa6,
-  0x97,
-  0xb9,
-  0x88,
-  0xdb,
-  0xea,
-  0x7d,
-  0x4c,
-  0x1f,
-  0x2e,
-  0x43,
-  0x72,
-  0x21,
-  0x10,
-  0x87,
-  0xb6,
-  0xe5,
-  0xd4,
-  0xfa,
-  0xcb,
-  0x98,
-  0xa9,
-  0x3e,
-  0x0f,
-  0x5c,
-  0x6d,
-  0x86,
-  0xb7,
-  0xe4,
-  0xd5,
-  0x42,
-  0x73,
-  0x20,
-  0x11,
-  0x3f,
-  0x0e,
-  0x5d,
-  0x6c,
-  0xfb,
-  0xca,
-  0x99,
-  0xa8,
-  0xc5,
-  0xf4,
-  0xa7,
-  0x96,
-  0x01,
-  0x30,
-  0x63,
-  0x52,
-  0x7c,
-  0x4d,
-  0x1e,
-  0x2f,
-  0xb8,
-  0x89,
-  0xda,
-  0xeb,
-  0x3d,
-  0x0c,
-  0x5f,
-  0x6e,
-  0xf9,
-  0xc8,
-  0x9b,
-  0xaa,
-  0x84,
-  0xb5,
-  0xe6,
-  0xd7,
-  0x40,
-  0x71,
-  0x22,
-  0x13,
-  0x7e,
-  0x4f,
-  0x1c,
-  0x2d,
-  0xba,
-  0x8b,
-  0xd8,
-  0xe9,
-  0xc7,
-  0xf6,
-  0xa5,
-  0x94,
-  0x03,
-  0x32,
-  0x61,
-  0x50,
-  0xbb,
-  0x8a,
-  0xd9,
-  0xe8,
-  0x7f,
-  0x4e,
-  0x1d,
-  0x2c,
-  0x02,
-  0x33,
-  0x60,
-  0x51,
-  0xc6,
-  0xf7,
-  0xa4,
-  0x95,
-  0xf8,
-  0xc9,
-  0x9a,
-  0xab,
-  0x3c,
-  0x0d,
-  0x5e,
-  0x6f,
-  0x41,
-  0x70,
-  0x23,
-  0x12,
-  0x85,
-  0xb4,
-  0xe7,
-  0xd6,
-  0x7a,
-  0x4b,
-  0x18,
-  0x29,
-  0xbe,
-  0x8f,
-  0xdc,
-  0xed,
-  0xc3,
-  0xf2,
-  0xa1,
-  0x90,
-  0x07,
-  0x36,
-  0x65,
-  0x54,
-  0x39,
-  0x08,
-  0x5b,
-  0x6a,
-  0xfd,
-  0xcc,
-  0x9f,
-  0xae,
-  0x80,
-  0xb1,
-  0xe2,
-  0xd3,
-  0x44,
-  0x75,
-  0x26,
-  0x17,
-  0xfc,
-  0xcd,
-  0x9e,
-  0xaf,
-  0x38,
-  0x09,
-  0x5a,
-  0x6b,
-  0x45,
-  0x74,
-  0x27,
-  0x16,
-  0x81,
-  0xb0,
-  0xe3,
-  0xd2,
-  0xbf,
-  0x8e,
-  0xdd,
-  0xec,
-  0x7b,
-  0x4a,
-  0x19,
-  0x28,
-  0x06,
-  0x37,
-  0x64,
-  0x55,
-  0xc2,
-  0xf3,
-  0xa0,
-  0x91,
-  0x47,
-  0x76,
-  0x25,
-  0x14,
-  0x83,
-  0xb2,
-  0xe1,
-  0xd0,
-  0xfe,
-  0xcf,
-  0x9c,
-  0xad,
-  0x3a,
-  0x0b,
-  0x58,
-  0x69,
-  0x04,
-  0x35,
-  0x66,
-  0x57,
-  0xc0,
-  0xf1,
-  0xa2,
-  0x93,
-  0xbd,
-  0x8c,
-  0xdf,
-  0xee,
-  0x79,
-  0x48,
-  0x1b,
-  0x2a,
-  0xc1,
-  0xf0,
-  0xa3,
-  0x92,
-  0x05,
-  0x34,
-  0x67,
-  0x56,
-  0x78,
-  0x49,
-  0x1a,
-  0x2b,
-  0xbc,
-  0x8d,
-  0xde,
-  0xef,
-  0x82,
-  0xb3,
-  0xe0,
-  0xd1,
-  0x46,
-  0x77,
-  0x24,
-  0x15,
-  0x3b,
-  0x0a,
-  0x59,
-  0x68,
-  0xff,
-  0xce,
-  0x9d,
-  0xac
-);
-// A1
-var A1_SERVO_STATUS = {
-  motoroff: 0x00,
-  manualcontrol: 0x01,
-  followyaw: 0x03,
-  homeposition: 0x04,
-  trackmode: 0x06,
-  turntorelativeangle: 0x09,
-  lockyaw: 0x0a,
-  turntoframeangle: 0x0b,
-  rcmode: 0x0d,
-  movetofinger: 0x0e,
-  noaction: 0x0f,
-  lookdown: 0x12,
-  centeryaw: 0x16,
-  levelpitch: 0x17
-};
-// crc校验字节生成函数
-function cal_crc_table(array) {
-  var crc = 0;
-  var i = 1;
-  var len = array[2];
-  while (len--) {
-    crc = crc_table[crc ^ array[i]];
-    i++;
-  }
-  return crc;
-}
-var A1_PARAM_INT16 = {
-  PARAM1: 0x0000,
-  PARAM2: 0x0000,
-  PARAM3: 0x0000,
-  PARAM4: 0x0000
-};
-var A1_CMD_ANGLE = {
-  server_status: A1_SERVO_STATUS.noaction,
-  param1: A1_PARAM_INT16.PARAM1,
-  param2: A1_PARAM_INT16.PARAM2,
-  param3: A1_PARAM_INT16.PARAM3,
-  param4: A1_PARAM_INT16.PARAM4
-};
-var viewlink_cmdLEN = {
-  // cmd_DATA_len + 3(len+cmdid+cs)
-  A1C1E1: 17,
-  A1C1E1S1: 31,
-  A2C2E2: 13,
-  A2C2E2S2: 18,
-  T1F1B1D1: 44,
-  T2F2B2D2: 52,
-  A1: 12,
-  A2: 5,
-  C1: 5,
-  C2: 6,
-  E1: 6,
-  E2: 8,
-  S1: 17,
-  S2: 8,
-  U: 5,
-  V: 5,
-  M_AHRS: 45,
-  HEART_BEAT: 4,
-  SHAKE_HAND: 4,
-  // //FOLLOW CMD NOT +3
-  T1F1B1D1_DATA: 41,
-  T2F2B2D2_DATA: 49,
-  T1_DATA: 22,
-  F1_DATA: 1,
-  B1_DATA: 6,
-  D1_DATA: 12,
-  T2_DATA: 18,
-  F2_DATA: 15,
-  B2_DATA: 11,
-  D2_DATA: 5
-};
-var viewlinkheadlen = 3;
-var viewlinkFrameLen = {
-  // the position of checksum
-  A1C1E1: viewlink_cmdLEN.A1C1E1 + viewlinkheadlen,
-  A1C1E1S1: viewlink_cmdLEN.A1C1E1S1 + viewlinkheadlen,
-  A2C2E2: viewlink_cmdLEN.A2C2E2 + viewlinkheadlen,
-  A2C2E2S2: viewlink_cmdLEN.A2C2E2S2 + viewlinkheadlen,
-  A1: viewlink_cmdLEN.A1 + viewlinkheadlen,
-  A2: viewlink_cmdLEN.A2 + viewlinkheadlen,
-  C1: viewlink_cmdLEN.C1 + viewlinkheadlen,
-  C2: viewlink_cmdLEN.C2 + viewlinkheadlen,
-  E1: viewlink_cmdLEN.E1 + viewlinkheadlen,
-  E2: viewlink_cmdLEN.E2 + viewlinkheadlen,
-  S1: viewlink_cmdLEN.S1 + viewlinkheadlen,
-  S2: viewlink_cmdLEN.S2 + viewlinkheadlen,
-  U: viewlink_cmdLEN.U + viewlinkheadlen,
-  V: viewlink_cmdLEN.V + viewlinkheadlen,
-  M_AHRS: viewlink_cmdLEN.M_AHRS + viewlinkheadlen,
-  HEART_BEAT: viewlink_cmdLEN.HEART_BEAT + viewlinkheadlen,
-  SHAKE_HAND: viewlink_cmdLEN.SHAKE_HAND + viewlinkheadlen
-};
-
-var mmcAddLen = 2; // (len+cs)
-var mmcCmdLen = {
-  // the position of checksum
-  A1C1E1: viewlinkFrameLen.A1C1E1 + mmcAddLen,
-  A1C1E1S1: viewlinkFrameLen.A1C1E1S1 + mmcAddLen,
-  A2C2E2: viewlinkFrameLen.A2C2E2 + mmcAddLen,
-  A2C2E2S2: viewlinkFrameLen.A2C2E2S2 + mmcAddLen,
-  A1: viewlinkFrameLen.A1 + mmcAddLen,
-  A2: viewlinkFrameLen.A2 + mmcAddLen,
-  C1: viewlinkFrameLen.C1 + mmcAddLen,
-  C2: viewlinkFrameLen.C2 + mmcAddLen,
-  E1: viewlinkFrameLen.E1 + mmcAddLen,
-  E2: viewlinkFrameLen.E2 + mmcAddLen,
-  S1: viewlinkFrameLen.S1 + mmcAddLen,
-  S2: viewlinkFrameLen.S2 + mmcAddLen,
-  U: viewlinkFrameLen.U + mmcAddLen,
-  V: viewlinkFrameLen.V + mmcAddLen,
-  M_AHRS: viewlinkFrameLen.M_AHRS + mmcAddLen,
-  HEART_BEAT: viewlinkFrameLen.HEART_BEAT + mmcAddLen,
-  SHAKE_HAND: viewlinkFrameLen.SHAKE_HAND + mmcAddLen
-};
-var mmcHeadLen = 2;
-var mmcFrameLen = {
-  // the position of checksum
-  A1C1E1: mmcCmdLen.A1C1E1 + mmcHeadLen,
-  A1C1E1S1: mmcCmdLen.A1C1E1S1 + mmcHeadLen,
-  A2C2E2: mmcCmdLen.A2C2E2 + mmcHeadLen,
-  A2C2E2S2: mmcCmdLen.A2C2E2S2 + mmcHeadLen,
-  A1: mmcCmdLen.A1 + mmcHeadLen,
-  A2: mmcCmdLen.A2 + mmcHeadLen,
-  C1: mmcCmdLen.C1 + mmcHeadLen,
-  C2: mmcCmdLen.C2 + mmcHeadLen,
-  E1: mmcCmdLen.E1 + mmcHeadLen,
-  E2: mmcCmdLen.E2 + mmcHeadLen,
-  S1: mmcCmdLen.S1 + mmcHeadLen,
-  S2: mmcCmdLen.S2 + mmcHeadLen,
-  U: mmcCmdLen.U + mmcHeadLen,
-  V: mmcCmdLen.V + mmcHeadLen,
-  M_AHRS: mmcCmdLen.M_AHRS + mmcHeadLen,
-  HEART_BEAT: mmcCmdLen.HEART_BEAT + mmcHeadLen,
-  SHAKE_HAND: mmcCmdLen.SHAKE_HAND + mmcHeadLen
-};
-var viewlinkheadlen = 3;
-var viewlinkFrameLen = {
-  // the position of checksum
-  A1C1E1: viewlink_cmdLEN.A1C1E1 + viewlinkheadlen,
-  A1C1E1S1: viewlink_cmdLEN.A1C1E1S1 + viewlinkheadlen,
-  A2C2E2: viewlink_cmdLEN.A2C2E2 + viewlinkheadlen,
-  A2C2E2S2: viewlink_cmdLEN.A2C2E2S2 + viewlinkheadlen,
-  A1: viewlink_cmdLEN.A1 + viewlinkheadlen,
-  A2: viewlink_cmdLEN.A2 + viewlinkheadlen,
-  C1: viewlink_cmdLEN.C1 + viewlinkheadlen,
-  C2: viewlink_cmdLEN.C2 + viewlinkheadlen,
-  E1: viewlink_cmdLEN.E1 + viewlinkheadlen,
-  E2: viewlink_cmdLEN.E2 + viewlinkheadlen,
-  S1: viewlink_cmdLEN.S1 + viewlinkheadlen,
-  S2: viewlink_cmdLEN.S2 + viewlinkheadlen,
-  U: viewlink_cmdLEN.U + viewlinkheadlen,
-  V: viewlink_cmdLEN.V + viewlinkheadlen,
-  M_AHRS: viewlink_cmdLEN.M_AHRS + viewlinkheadlen,
-  HEART_BEAT: viewlink_cmdLEN.HEART_BEAT + viewlinkheadlen,
-  SHAKE_HAND: viewlink_cmdLEN.SHAKE_HAND + viewlinkheadlen
-};
-var viewlink_cmdID = {
-  A1C1E1: 0x30,
-  A1C1E1S1: 0x32,
-  A2C2E2: 0x31,
-  A2C2E2S2: 0x33,
-  A1: 0x1a,
-  A2: 0x2a,
-  C1: 0x1c,
-  C2: 0x2c,
-  E1: 0x1e,
-  E2: 0x2e,
-  S1: 0x16,
-  S2: 0x26,
-  U: 0x01,
-  V: 0x02,
-  M_AHRS: 0xb1,
-  HEART_BEAT: 0x10,
-  SHAKE_HAND: 0x00,
-  T1F1B1D1: 0x40,
-  T2F2B2D2: 0x41,
-  FW: 0xff
-};
-
-var mmc_cs_pos = {
-  // the position of checksum
-  A1C1E1: mmcFrameLen.A1C1E1 - 1,
-  A1C1E1S1: mmcFrameLen.A1C1E1S1 - 1,
-  A2C2E2: mmcFrameLen.A2C2E2 - 1,
-  A2C2E2S2: mmcFrameLen.A2C2E2S2 - 1,
-  A1: mmcFrameLen.A1 - 1,
-  A2: mmcFrameLen.A2 - 1,
-  C1: mmcFrameLen.C1 - 1,
-  C2: mmcFrameLen.C2 - 1,
-  E1: mmcFrameLen.E1 - 1,
-  E2: mmcFrameLen.E2 - 1,
-  S1: mmcFrameLen.S1 - 1,
-  S2: mmcFrameLen.S2 - 1,
-  U: mmcFrameLen.U - 1,
-  V: mmcFrameLen.V - 1,
-  M_AHRS: mmcFrameLen.M_AHRS - 1,
-  HEART_BEAT: mmcFrameLen.HEART_BEAT - 1,
-  SHAKE_HAND: mmcFrameLen.SHAKE_HAND - 1
-};
-
-var viewlink_cs_pos = {
-  // the position of checksum
-  A1C1E1: viewlinkFrameLen.A1C1E1 - 1,
-  A1C1E1S1: viewlinkFrameLen.A1C1E1S1 - 1,
-  A2C2E2: viewlinkFrameLen.A2C2E2 - 1,
-  A2C2E2S2: viewlinkFrameLen.A2C2E2S2 - 1,
-  A1: viewlinkFrameLen.A1 - 1,
-  A2: viewlinkFrameLen.A2 - 1,
-  C1: viewlinkFrameLen.C1 - 1,
-  C2: viewlinkFrameLen.C2 - 1,
-  E1: viewlinkFrameLen.E1 - 1,
-  E2: viewlinkFrameLen.E2 - 1,
-  S1: viewlinkFrameLen.S1 - 1,
-  S2: viewlinkFrameLen.S2 - 1,
-  U: viewlinkFrameLen.U - 1,
-  V: viewlinkFrameLen.V - 1,
-  M_AHRS: viewlinkFrameLen.M_AHRS - 1,
-  HEART_BEAT: viewlinkFrameLen.HEART_BEAT - 1,
-  SHAKE_HAND: viewlinkFrameLen.SHAKE_HAND - 1
-};
-
-function A1_to_array(A1_CMD) {
-  var array = new Array();
-  array[0] = A1_CMD.server_status;
-
-  array[1] = A1_CMD.param1 >> 8;
-  array[2] = A1_CMD.param1 & 0xff;
-
-  array[3] = A1_CMD.param2 >> 8;
-  array[4] = A1_CMD.param2 & 0xff;
-
-  array[5] = A1_CMD.param3 >> 8;
-  array[6] = A1_CMD.param3 & 0xff;
-
-  array[7] = A1_CMD.param4 >> 8;
-  array[8] = A1_CMD.param4 & 0xff;
-  return array;
-}
-function viewlink_checksum(array) {
-  var checksum = array[3];
-  var i = 4;
-  var len = (array[3] & 0x3f) - 2;
-  while (len--) {
-    checksum = checksum ^ array[i];
-    i++;
-  }
-  return checksum;
-}
-function pack_A1(A1CMD) {
-  const A1_data_array = A1_to_array(A1CMD); // 9
-  const A1pack_array = [0x55, 0xaa, 0xdc, 0x00, 0x00];
-  A1pack_array[3] = viewlink_cmdLEN.A1; // 12
-  A1pack_array[4] = viewlink_cmdID.A1;
-
-  A1_data_array.forEach(function (item) {
-    // 将A1CMD的数据提取出，拼接在A1pack_array
-    A1pack_array.push(item);
-  });
-
-  A1pack_array[viewlink_cs_pos.A1] = viewlink_checksum(A1pack_array);
-  return A1pack_array;
-}
-// 数据分包发送函数
-function package_send(buff, len) {
-  var i = 0;
-  var j = 0;
-  var count = 0;
-  // var alen = len;
-  var hexbuf = [];
-  var sendbuf = [];
-
-  if (len % 48 == 0) {
-    count = parseInt(len / 48, 10);
-  } else {
-    count = parseInt(len / 48, 10) + 1;
-  }
-
-  for (i = 0; i < count; i++) {
-    if (count - i == 1) {
-      for (j = 0; j < len - i * 48; j++) {
-        sendbuf[j] = buff[i * 48 + j];
-        hexbuf[j] = Number(buff[i * 48 + j]).toString(16);
-      }
-      return sendbuf;
-    } else {
-      for (j = 0; j < 48; j++) {
-        sendbuf[j] = buff[i * 48 + j];
-        hexbuf[j] = Number(buff[i * 48 + j]).toString(16);
-      }
-      return sendbuf;
-    }
-  }
-}
-export const MMC_Gimbal_Z60S = {
-  change_pitch_angle(angle) {
-    const A1_CMD_ANGLE = {
-      server_status: 11,
-      param1: 0,
-      param2: 0,
-      param3: 0,
-      param4: 0
-    };
-    var buff = new Array(0xa5, 0x4f, 0x00);
-    buff[2] = 17;
-    A1_CMD_ANGLE.server_status = 11;
-    var pitchangle = 0;
-    if (angle >= 0) {
-      pitchangle = angle;
-      A1_CMD_ANGLE.param2 = (pitchangle * 65536) / 360;
-    } else {
-      pitchangle = angle;
-      A1_CMD_ANGLE.param2 = (pitchangle * 65536) / 360 + 65536;
-    }
-    var buff_arr = pack_A1(A1_CMD_ANGLE);
-    buff_arr.forEach(function (item) {
-      buff.push(item);
-    });
-    buff[18] = cal_crc_table(buff);
-
-    return package_send(buff, 19);
-  },
-  change_yaw_angle(num) {
-    const angle = Number(num);
-    const buff = new Array(0xa5, 0x4f, 0x00);
-    buff[2] = mmcCmdLen.A1;
-    A1_CMD_ANGLE.server_status = A1_SERVO_STATUS.turntoframeangle;
-    let yawangle = 0;
-    if (angle >= 0) {
-      yawangle = angle;
-      A1_CMD_ANGLE.param1 = (yawangle * 65536) / 360;
-    } else {
-      yawangle = angle;
-      A1_CMD_ANGLE.param1 = (yawangle * 65536) / 360 + 65536;
-    }
-    const buff_arr = pack_A1(A1_CMD_ANGLE);
-    buff_arr.forEach(function (item) {
-      buff.push(item);
-    });
-    console.log(buff_arr, 'buff_arr');
-    buff[mmc_cs_pos.A1] = cal_crc_table(buff);
-    return package_send(buff, mmcFrameLen.A1);
-  }
-};

src/components/MMCMount/MMC_Gimbal_ZT60R/mb.svg

@@ -147,4 +147,4 @@
             </g>
         </g>
     </g>
-</svg>
+</svg>
\ No newline at end of file

src/components/MMCMount/index.js

-import svg001 from './assets/images/observe/001.svg';
-import svg002 from './assets/images/observe/002.svg';
-import svg004 from './assets/images/observe/004.svg';
-import svg005 from './assets/images/observe/005.svg';
-import svg006 from './assets/images/observe/006.svg';
-import svg007 from './assets/images/observe/007.svg';
-import svg009 from './assets/images/observe/009.svg';
-import svg010 from './assets/images/observe/010.svg';
-import svg011 from './assets/images/observe/011.svg';
-import svg019 from './assets/images/observe/019.svg';
+import svg001 from "./assets/images/observe/001.svg";
+import svg002 from "./assets/images/observe/002.svg";
+import svg004 from "./assets/images/observe/004.svg";
+import svg005 from "./assets/images/observe/005.svg";
+import svg006 from "./assets/images/observe/006.svg";
+import svg007 from "./assets/images/observe/007.svg";
+import svg009 from "./assets/images/observe/009.svg";
+import svg010 from "./assets/images/observe/010.svg";
+import svg011 from "./assets/images/observe/011.svg";
+import svg019 from "./assets/images/observe/019.svg";
 
-import png008 from './assets/images/observe/008.png';
-import png014 from './assets/images/observe/014.png';
-import png015 from './assets/images/observe/015.png';
-import png016 from './assets/images/observe/016.png';
-import png017 from './assets/images/observe/017.png';
-import png018 from './assets/images/observe/018.png';
+import png008 from "./assets/images/observe/008.png";
+import png014 from "./assets/images/observe/014.png";
+import png015 from "./assets/images/observe/015.png";
+import png016 from "./assets/images/observe/016.png";
+import png017 from "./assets/images/observe/017.png";
+import png018 from "./assets/images/observe/018.png";
 
-import pngZ40S from './assets/images/observe/MMC_Gimbal_Z40S.png';
-import pngZT60R from './assets/images/observe/MMC_Gimbal_ZT60R.png'
-import svgGAS from './assets/images/observe/MMC_Gimbal_GAS.svg'
+import pngZ40S from "./assets/images/observe/MMC_Gimbal_Z40S.png";
+import pngZT60R from "./assets/images/observe/MMC_Gimbal_ZT60R.png";
+import svgGAS from "./assets/images/observe/MMC_Gimbal_GAS.svg";
 
 export default {
   type_list: [
     {
       id: 1,
-      title: '巡查'
+      title: "巡查",
     },
     {
       id: 2,
-      title: '预警'
+      title: "预警",
     },
     {
       id: 3,
-      title: '侦察'
+      title: "侦察",
     },
     {
       id: 4,
-      title: '服务'
+      title: "服务",
     },
     {
       id: 5,
-      title: '救援'
+      title: "救援",
     },
     {
       id: 6,
-      title: '处置'
+      title: "处置",
     },
     {
       id: 7,
-      title: '打击'
+      title: "打击",
     },
     {
       id: 8,
-      title: '宣传'
-    }
+      title: "宣传",
+    },
   ],
   list: [
     {
-      title: '高清变焦相机',
+      title: "高清变焦相机",
       icon: svg001,
-      name: 'DJI_H20T',
+      name: "DJI_H20T",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./DJI_H20T')
+      component: () => import("./DJI_H20T"),
     },
     {
-      title: '高清变焦相机',
+      title: "高清变焦相机",
       icon: svg001,
-      name: 'MMC_Gimbal_Z40',
+      name: "MMC_Gimbal_Z40",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./MMC_Gimbal_Z40')
+      component: () => import("./MMC_Gimbal_Z40"),
     },
     {
-      title: '高清变焦相机',
+      title: "高清变焦相机",
       icon: svg001,
-      name: 'MMC_Gimbal_Z40N',
+      name: "MMC_Gimbal_Z40N",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./MMC_Gimbal_Z40N')
+      component: () => import("./MMC_Gimbal_Z40N"),
     },
     {
-      title: '高清变焦相机Z33N',
+      title: "高清变焦相机Z33N",
       icon: svg001,
-      name: 'MMC_Gimbal_Z33N',
+      name: "MMC_Gimbal_Z33N",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./MMC_Gimbal_Z33N')
+      component: () => import("./MMC_Gimbal_Z33N"),
     },
     // Z40高清相机
     {
-      title: '高清变焦相机Z20',
+      title: "高清变焦相机Z20",
       icon: png014,
-      name: 'MMC_Gimbal_Z20',
+      name: "MMC_Gimbal_Z20",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./MMC_Gimbal_Z20')
+      component: () => import("./MMC_Gimbal_Z20"),
     },
     // Z40S高清相机
     {
-      title: '高清变焦相机Z40S',
+      title: "高清变焦相机Z40S",
       icon: pngZ40S,
-      name: 'MMC_Gimbal_Z40S',
+      name: "MMC_Gimbal_Z40S",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./MMC_Gimbal_Z40S')
+      component: () => import("./MMC_Gimbal_Z40S"),
     },
     // ZT60R高清相机
     {
-      title: '高清变焦相机ZT60R',
+      title: "高清变焦相机ZT60R",
       icon: pngZT60R,
-      name: 'MMC_Gimbal_ZT60R',
+      name: "MMC_Gimbal_ZT60R",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./MMC_Gimbal_ZT60R/index.vue')
-    },
-        // ZT60R高清相机
-        {
-          title: '高清变焦相机ZT60R',
-          icon: pngZT60R,
-          name: 'MMC_Gimbal_Z60R',
-          type: [1, 2, 3, 4, 5, 6, 8],
-          component: () => import('./MMC_Gimbal_Z60R/index.vue')
-        },
+      component: () => import("./MMC_Gimbal_ZT60R/index.vue"),
+    },
+    // ZT60R高清相机
+    {
+      title: "高清变焦相机ZT60R",
+      icon: pngZT60R,
+      name: "MMC_Gimbal_Z60R",
+      type: [1, 2, 3, 4, 5, 6, 8],
+      component: () => import("./MMC_Gimbal_Z60R/index.vue"),
+    },
     // Z30Pro高清相机
     {
-      title: '高清变焦相机Z30Pro',
+      title: "高清变焦相机Z30Pro",
       icon: png015,
-      name: 'MMC_Gimbal_Z30Pro',
+      name: "MMC_Gimbal_Z30Pro",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./MMC_Gimbal_Z30Pro/index.vue')
+      component: () => import("./MMC_Gimbal_Z30Pro/index.vue"),
     },
     {
-      title: '喊话器',
+      title: "喊话器",
       icon: svg002,
-      name: 'MMC_Gimbal_P0_Pro',
+      name: "MMC_Gimbal_P0_Pro",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./MMC_Gimbal_P0_Pro')
+      component: () => import("./MMC_Gimbal_P0_Pro"),
     },
     {
-      title: '喊话器',
+      title: "喊话器",
       icon: svg002,
-      name: 'MMC_Gimbal_P1_4G',
+      name: "MMC_Gimbal_P1_4G",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./PagerP1_New')
+      component: () => import("./PagerP1_New"),
     },
     {
-      title: '探照灯',
+      title: "探照灯",
       icon: svg004,
-      name: 'MMC_Gimbal_L60',
+      name: "MMC_Gimbal_L60",
       type: [3, 4],
-      component: () => import('./MMC_Gimbal_L60')
+      component: () => import("./MMC_Gimbal_L60"),
     },
     // 探照灯L50
     {
-      title: '探照灯',
+      title: "探照灯",
       icon: png016,
-      name: 'MMC_Gimbal_L50',
+      name: "MMC_Gimbal_L50",
       type: [3, 4],
-      component: () => import('./MMC_Gimbal_L50')
+      component: () => import("./MMC_Gimbal_L50"),
     },
     {
-      title: '红外热成像',
+      title: "红外热成像",
       icon: png016,
-      name: 'MMC_Gimbal_ZT1',
+      name: "MMC_Gimbal_ZT1",
       type: [3, 4, 5, 6],
-      component: () => import('./MMC_Gimbal_ZT1')
+      component: () => import("./MMC_Gimbal_ZT1"),
     },
     {
-      title: '抛投',
+      title: "抛投",
       icon: svg006,
-      name: 'MMC_Gimbal_S1',
+      name: "MMC_Gimbal_S1",
       type: [5, 6],
-      component: () => import('./MMC_Gimbal_S1')
+      component: () => import("./MMC_Gimbal_S1"),
     },
     {
-      title: '喷火器',
+      title: "喷火器",
       icon: png008,
-      name: 'MMC_Gimbal_FF6',
+      name: "MMC_Gimbal_FF6",
       type: [5],
-      component: () => import('./MMC_Gimbal_FF6')
+      component: () => import("./MMC_Gimbal_FF6"),
     },
     {
-      title: '水体采样器',
+      title: "水体采样器",
       icon: png017,
-      name: 'MMC_Gimbal_QS',
+      name: "MMC_Gimbal_QS",
       type: [5],
-      component: () => import('./MMC_Gimbal_QS')
+      component: () => import("./MMC_Gimbal_QS"),
     },
     {
-      title: '双光',
+      title: "双光",
       icon: svg007,
-      name: 'MMC_Gimbal_ZT30N',
+      name: "MMC_Gimbal_ZT30N",
       type: [6],
-      component: () => import('./MMC_Gimbal_ZT30N')
+      component: () => import("./MMC_Gimbal_ZT30N"),
     },
     {
-      title: '霹雳火',
+      title: "霹雳火",
       icon: svg005,
-      name: 'MMC_Gimbal_S79',
+      name: "MMC_Gimbal_S79",
       type: [7],
-      component: () => import('./MMC_Gimbal_S79')
+      component: () => import("./MMC_Gimbal_S79"),
     },
     {
-      title: '催泪弹',
+      title: "催泪弹",
       icon: svg009,
-      name: 'MMC_Gimbal_FE8',
+      name: "MMC_Gimbal_FE8",
       type: [7, 8],
-      component: () => import('./MMC_Gimbal_FE8')
+      component: () => import("./MMC_Gimbal_FE8"),
     },
     {
-      title: '破窗灭火器',
+      title: "破窗灭火器",
       icon: svg010,
-      name: 'MMC_Gimbal_FB1',
+      name: "MMC_Gimbal_FB1",
       type: [7],
-      component: () => import('./MMCGimbalFB1')
+      component: () => import("./MMCGimbalFB1"),
     },
     {
-      title: '网枪',
+      title: "网枪",
       icon: svg011,
-      name: 'MMC_Gimbal_FN3',
+      name: "MMC_Gimbal_FN3",
       type: [7, 8],
-      component: () => import('./MMCGimbalFN3')
+      component: () => import("./MMCGimbalFN3"),
     },
     {
-      title: '喊话器P3',
+      title: "喊话器P3",
       icon: svg002,
-      name: 'MMC_Gimbal_P3',
+      name: "MMC_Gimbal_P3",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./PagerP1_New')
+      component: () => import("./PagerP1_New"),
     },
     {
-      title: '驱散器',
+      title: "驱散器",
       icon: png018,
-      name: 'MMC_Gimbal_P4',
+      name: "MMC_Gimbal_P4",
       type: [1, 2, 3, 4, 5, 6, 8],
-      component: () => import('./PagerP1_New')
+      component: () => import("./PagerP1_New"),
     },
     {
-      title: '干粉灭火器',
+      title: "干粉灭火器",
       icon: svg019,
-      name: 'MMC_Gimbal_FE3',
-      component: () => import('./MMC_Gimbal_FE3')
+      name: "MMC_Gimbal_FE3",
+      component: () => import("./MMC_Gimbal_FE3"),
     },
     {
-      title: '多气体检测',
+      title: "多气体检测",
       icon: svgGAS,
-      name: 'MMC_Gimbal_G6',
-      component: () => import('./MMC_Gimbal_GAS/index.vue')
-    }
-  ]
+      name: "MMC_Gimbal_G6",
+      component: () => import("./MMC_Gimbal_GAS/index.vue"),
+    },
+  ],
 };

src/components/MMCMount/utils.js

@@ -1513,3 +1513,5 @@ export const MMC_Gimbal_Z33N = {
     return buff;
   }
 };
+
+export * from './MMC_Gimbal_ZT60R/js/index.js';
\ No newline at end of file