飞行指令打开

husq

2023-09-18 1ef360a14efab8a1defa1dfdc13bb5af64a9d621

 src/components/g-map/DroneControlPanel.vue

@@ -1,10 +1,10 @@
<template>
  <div class="drone-control-wrapper">
    <div class="drone-control-header">Drone Flight Control</div>
    <div class="drone-control-header">无人机飞行控制</div>
    <div class="drone-control-box">
      <div class="box">
        <div class="row">
          <div class="drone-control"><Button :ghost="!flightController" size="small"  @click="onClickFightControl">{{ flightController ? 'Exit Remote Control' : 'Enter Remote Control'}}</Button></div>
          <div class="drone-control"><Button :ghost="!flightController" size="small"  @click="onClickFightControl">{{ flightController ? '退出控制' : '进入控制'}}</Button></div>
        </div>
        <div class="row">
          <div class="drone-control-direction">
@@ -35,7 +35,7 @@
            </Button>
          </div>
          <Button type="primary" size="small" danger ghost @click="handleEmergencyStop" >
            <template #icon><PauseCircleOutlined/></template><span>Break</span>
            <template #icon><PauseCircleOutlined/></template><span>结束</span>
          </Button>
        </div>
        <div class="row">
@@ -62,11 +62,11 @@
              </div>
            </template>
            <Button size="small" ghost @click="onShowFlyToPopover" >
              <span>Fly to</span>
              <span>起飞</span>
            </Button>
          </DroneControlPopover>
          <Button size="small" ghost @click="onStopFlyToPoint" >
            <span>Stop Fly to</span>
            <span>停止起飞</span>
          </Button>
          <DroneControlPopover
            :visible="takeoffToPointPopoverData.visible"
@@ -115,10 +115,10 @@
              </div>
            </template>
            <Button size="small" ghost @click="onShowTakeoffToPointPopover" >
              <span>Take off</span>
              <span>起飞</span>
            </Button>
          </DroneControlPopover>
          <Button :loading="cmdItem.loading" size="small" ghost @click="sendControlCmd(cmdItem, index)">
          <Button :loading="cmdItem.loading" size="small" ghost @click="sendControlCmd(cmdItem, 0)">
          {{ cmdItem.operateText }}
          </Button>
        </div>
@@ -127,7 +127,7 @@
      <div class="row">
        <Select v-model:value="payloadSelectInfo.value" style="width: 110px; marginRight: 5px" :options="payloadSelectInfo.options" @change="handlePayloadChange"/>
        <div class="drone-control">
          <Button type="primary" size="small" @click="onAuthPayload">Payload Control</Button>
          <Button type="primary" size="small" @click="onAuthPayload">负载控制</Button>
        </div>
      </div>
      <div class="row">
@@ -150,24 +150,24 @@
            </div>
          </template>
          <Button size="small" ghost @click="onShowGimbalResetPopover">
            <span>Gimbal Reset</span>
            <span>复位</span>
          </Button>
        </DroneControlPopover>
        <Button size="small" ghost @click="onSwitchCameraMode">
          <span>Camera Mode Switch</span>
          <span>相机模式开关</span>
        </Button>
      </div>
      <div class="row">
        <Button size="small" ghost @click="onStartCameraRecording">
          <span>Start Recording</span>
          <span>开始录制</span>
        </Button>
        <Button size="small" ghost @click="onStopCameraRecording">
          <span>Stop Recording</span>
          <span>停止录制</span>
        </Button>
      </div>
      <div class="row">
        <Button size="small" ghost  @click="onTakeCameraPhoto">
          <span>Take Photo</span>
          <span>拍照</span>
        </Button>
        <DroneControlPopover
          :visible="zoomFactorPopoverData.visible"
@@ -192,7 +192,7 @@
            </div>
          </template>
          <Button size="small" ghost @click="($event) => onShowZoomFactorPopover()">
            <span class="word" @click=";">Zoom</span>
            <span class="word" @click=";">聚焦</span>
          </Button>
        </DroneControlPopover>
        <DroneControlPopover
@@ -226,14 +226,14 @@
              </div>
            </template>
            <Button size="small" ghost @click="($event) => onShowCameraAimPopover()">
              <span class="word" @click=";">AIM</span>
              <span class="word" @click=";">目标</span>
            </Button>
          </DroneControlPopover>
      </div>
    </div>
    </div>
    <!-- 信息提示 -->
    <DroneControlInfoPanel :message="drcInfo"></DroneControlInfoPanel>
    <!-- <DroneControlInfoPanel :message="drcInfo"></DroneControlInfoPanel> -->
  </div>
</template>

@@ -269,8 +269,9 @@
  return store.state.clientId
})

const initCmdList = baseCmdList.find(item => item.cmdKey === DeviceCmd.ReturnHome)
const initCmdList = baseCmdList.find(item => item.cmdKey === DeviceCmd.ReturnHome) as DeviceCmdItem
const cmdItem = ref(initCmdList)
console.log(cmdItem, 'cmdItem')

const {
  sendDockControlCmd
@@ -284,7 +285,10 @@
    action: cmdItem.action
  }, false)
  if (result && flightController.value) {
    message.success('Return home successful')
    exitFlightCOntrol()
  } else {
    message.error('Failed to return home')
  }
  cmdItem.loading = false
}
@@ -346,7 +350,7 @@
  maxSpeed: MAX_SPEED,
  rthAltitude: null as null | number,
  rcLostAction: LostControlActionInCommandFLight.RETURN_HOME,
  exitWaylineWhenRcLost: WaylineLostControlActionInCommandFlight.RETURN_HOME
  exitWaylineWhenRcLost: WaylineLostControlActionInCommandFlight.EXEC_LOST_ACTION
})

function onShowTakeoffToPointPopover () {
@@ -357,7 +361,7 @@
  takeoffToPointPopoverData.securityTakeoffHeight = null
  takeoffToPointPopoverData.rthAltitude = null
  takeoffToPointPopoverData.rcLostAction = LostControlActionInCommandFLight.RETURN_HOME
  takeoffToPointPopoverData.exitWaylineWhenRcLost = WaylineLostControlActionInCommandFlight.RETURN_HOME
  takeoffToPointPopoverData.exitWaylineWhenRcLost = WaylineLostControlActionInCommandFlight.EXEC_LOST_ACTION
}

async function onTakeoffToPointConfirm (confirm: boolean) {
@@ -396,10 +400,10 @@
useMqtt(deviceTopicInfo)

// 飞行控制
const drcState = computed(() => {
  return store.state.deviceState?.dockInfo[props.sn]?.link_osd?.drc_state === DrcStateEnum.CONNECTED
})
const flightController = ref(drcState.value)
// const drcState = computed(() => {
//   return store.state.deviceState?.dockInfo[props.sn]?.link_osd?.drc_state === DrcStateEnum.CONNECTED
// })
const flightController = ref(false)

async function onClickFightControl () {
  if (flightController.value) {
@@ -452,7 +456,7 @@
}

// drc mqtt message
const { drcInfo } = useDroneControlMqttEvent(props.sn)
const { drcInfo, errorInfo } = useDroneControlMqttEvent(props.sn)

const {
  handleKeyup,
@@ -688,6 +692,17 @@
  }
  cameraAimPopoverData.visible = false
}

watch(() => errorInfo, (errorInfo) => {
  if (errorInfo.value) {
    message.error(errorInfo.value)
    console.error(errorInfo.value)
    errorInfo.value = ''
  }
}, {
  immediate: true,
  deep: true
})
</script>

<style lang='scss' scoped>