forked from drone/command-center-dashboard

罗广辉
2025-04-18 76a3843d1cd480a345675b56e8e45693b0bf81cb
src/components/CurrentTaskDetails/ControlPanel/ControlPanel.vue
@@ -68,7 +68,7 @@
      </div>
      <!--     指南针-->
      <div class="compass">
         <ControlComPass :pitchAngle="pitchAngle.angle" :trueAltitude="trueAltitude" />
         <ControlComPass :options="compassOptions" />
      </div>
      <div class="ptzControlBox">
@@ -116,7 +116,7 @@
         </div>
         <div class="divider"></div>
         <div v-for="arr in list4" class="info">
         <div v-for="arr in baseInfo" class="info">
            <div v-for="item in arr" class="infoItem">
               <div class="infoName">{{ item.name }}</div>
               <div class="infoValue">{{ item.value + (item.unit || '') }}</div>
@@ -147,17 +147,26 @@
import _ from 'lodash'
import BaseControl from '@/components/CurrentTaskDetails/ControlPanel/BaseControl.vue'
import EventBus from '@/event-bus'
import { getPayloadControlApi, ptzControlApi } from '@/api/payload'
import { getPayloadControlApi } from '@/api/payload'
import { directionMap } from '@/const/drc'
const deviceOsdInfo = inject('deviceOsdInfo')
const host = computed(() => deviceOsdInfo?.value?.data?.host || {})
const wsInfo = inject('wsInfo')
const device_osd_host = computed(() => wsInfo?.value?.device_osd?.data?.host || {})
const dock_osd_host = computed(() => wsInfo?.value?.dock_osd?.data?.host || {})
const taskDetails = inject('taskDetails')
const dockSn = inject('dockSn')
const droneSn = inject('droneSn')
const trueAltitude = inject('trueAltitude')
const store = useStore()
const compassOptions = computed(() => {
   return {
      pitchAngle: pitchAngle.value.angle,
      trueAltitude: trueAltitude.value,
      yawAngle: yawAngle.value.angle,
   }
})
let mqttState = null
const client_id = ref('')
const valueTime = ref('00:00:00')
@@ -186,24 +195,26 @@
   { name: '左', key: KeyCode.ARROW_LEFT, operate: 'left', style: { left: '-70%' } },
]
const list4 = computed(() => {
   const { longitude, latitude, height, payloads } = host?.value || {}
   const { gimbal_pitch } = payloads?.[0] || {} //俯仰角度
const baseInfo = computed(() => {
   const usedStorage = dock_osd_host.value?.storage?.used || 0
   const zoom_factor = device_osd_host.value?.cameras?.[0]?.zoom_factor || 0
   const usedStorageGB = _.round(usedStorage / 1024 / 1024, 2)
   return [
      [
         { name: '焦距倍数', value: '0' },
         { name: '俯仰角度', value: pitchAngle.value.angle,unit:'°' },
         { name: '横向角度', value: yawAngle.value.angle,unit:'°' },
         { name: '焦距倍数', value: zoom_factor },
         { name: '俯仰角度', value: pitchAngle.value.angle, unit: '°' },
         { name: '横向角度', value: yawAngle.value.angle, unit: '°' },
      ],
      [
         { name: '储存', value: '64.5G' },
         { name: '储存', value: usedStorageGB, unit: 'G' },
         { name: '方向', value: pitchAngle.value.direction },
         { name: '方向', value: yawAngle.value.direction },
      ],
   ]
})
const pitchAngle = computed(() => {
   const { payloads } = host?.value || {}
   const { payloads } = device_osd_host?.value || {}
   const gimbal_pitch = payloads?.[0]?.gimbal_pitch || 0
   let direction = ''
   if (gimbal_pitch > -2 && gimbal_pitch < 2) {
@@ -224,8 +235,7 @@
})
const yawAngle = computed(() => {
   let { longitude, latitude, height, payloads, attitude_head } = host?.value || {}
   const gimbal_pitch = payloads?.[0]?.gimbal_pitch || 0
   let { payloads, attitude_head } = device_osd_host?.value || {}
   const gimbal_yaw = payloads?.[0]?.gimbal_yaw || 0
   attitude_head = attitude_head || 0
   let yaw = ''
@@ -244,45 +254,16 @@
   if ((yaw > -2 && yaw < 2) || parseInt(attitude_head) === parseInt(gimbal_yaw)) {
      result = attitude_head < 0 ? 180 + (180 + attitude_head) : attitude_head
   }
   let direction = ''
   const roundResult = Math.round(result)
   if (roundResult === 0) {
      direction = '正北'
   } else if (roundResult > 0 && roundResult < 45) {
      direction = '北偏东'
   } else if (roundResult === 45) {
      direction = '东北'
   } else if (roundResult > 45 && roundResult < 90) {
      direction = '北偏东'
   } else if (roundResult === 90) {
      direction = '正东'
   } else if (roundResult > 90 && roundResult < 135) {
      direction = '东偏南'
   } else if (roundResult === 135) {
      direction = '东南'
   } else if (roundResult > 135 && roundResult < 180) {
      direction = '南偏东'
   } else if (roundResult === 180) {
      direction = '正南'
   } else if (roundResult > 180 && roundResult < 225) {
      direction = '南偏西'
   } else if (roundResult === 225) {
      direction = '西南'
   } else if (roundResult > 225 && roundResult < 270) {
      direction = '西偏南'
   } else if (roundResult === 270) {
      direction = '正西'
   } else if (roundResult > 270 && roundResult < 315) {
      direction = '西偏北'
   } else if (roundResult === 315) {
      direction = '西北'
   } else if (roundResult > 315 && roundResult < 360) {
      direction = '北偏西'
   } else if (roundResult === 360) {
      direction = '正北'
   const roundResult = Math.round(result);
   let direction = '';
   for (const item of directionMap) {
      if (roundResult >= item.min && roundResult <= item.max) {
         direction = item.value;
         break;
      }
   }
   return {
      angle: _.round(result, 1) + '°',
      angle: _.round(result, 1),
      direction,
   }
})
@@ -400,7 +381,7 @@
// 返航或取消返航
const returnOrCancelReturn = () => {
   if (deviceOsdInfo.value?.data?.host?.mode_code === 9) {
   if (device_osd_host?.value?.mode_code === 9) {
      cancelBackDock()
   } else {
      onBackDock()