| | |
| | | <div class="drone-control-box"> |
| | | <div class="box"> |
| | | <div class="row"> |
| | | <div class="drone-control"><Button :ghost="!flightController" size="small" @click="onClickFightControl">{{ flightController ? '退出控制' : '进入控制'}}</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"> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_Q)" @onmouseup="onMouseUp"> |
| | | <template #icon><UndoOutlined /></template><span class="word">Q</span> |
| | | <template #icon> |
| | | <UndoOutlined/> |
| | | </template> |
| | | <span class="word">Q</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_W)" @onmouseup="onMouseUp"> |
| | | <template #icon><UpOutlined/></template><span class="word">W</span> |
| | | <template #icon> |
| | | <UpOutlined/> |
| | | </template> |
| | | <span class="word">W</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_E)" @onmouseup="onMouseUp"> |
| | | <template #icon><RedoOutlined /></template><span class="word">E</span> |
| | | <template #icon> |
| | | <RedoOutlined/> |
| | | </template> |
| | | <span class="word">E</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.ARROW_UP)" @onmouseup="onMouseUp"> |
| | | <template #icon><ArrowUpOutlined /></template> |
| | | <template #icon> |
| | | <ArrowUpOutlined/> |
| | | </template> |
| | | </Button> |
| | | <br /> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_A)" @onmouseup="onMouseUp"> |
| | | <template #icon><LeftOutlined/></template><span class="word">A</span> |
| | | <template #icon> |
| | | <LeftOutlined/> |
| | | </template> |
| | | <span class="word">A</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_S)" @onmouseup="onMouseUp"> |
| | | <template #icon><DownOutlined/></template><span class="word">S</span> |
| | | <template #icon> |
| | | <DownOutlined/> |
| | | </template> |
| | | <span class="word">S</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.KEY_D)" @onmouseup="onMouseUp"> |
| | | <template #icon><RightOutlined/></template><span class="word">D</span> |
| | | <template #icon> |
| | | <RightOutlined/> |
| | | </template> |
| | | <span class="word">D</span> |
| | | </Button> |
| | | <Button size="small" ghost @mousedown="onMouseDown(KeyCode.ARROW_DOWN)" @onmouseup="onMouseUp"> |
| | | <template #icon><ArrowDownOutlined /></template> |
| | | <template #icon> |
| | | <ArrowDownOutlined/> |
| | | </template> |
| | | </Button> |
| | | </div> |
| | | <Button type="primary" size="small" danger ghost @click="handleEmergencyStop" > |
| | | <template #icon><PauseCircleOutlined/></template><span>结束</span> |
| | | <template #icon> |
| | | <PauseCircleOutlined/> |
| | | </template> |
| | | <span>结束</span> |
| | | </Button> |
| | | </div> |
| | | <div class="row"> |
| | |
| | | </div> |
| | | <div class="box"> |
| | | <div class="row"> |
| | | <Select v-model:value="payloadSelectInfo.value" style="width: 110px; marginRight: 5px" :options="payloadSelectInfo.options" @change="handlePayloadChange"/> |
| | | <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">负载控制</Button> |
| | | </div> |
| | |
| | | </div> |
| | | <div> |
| | | <span class="form-label">缩放:</span> |
| | | <a-input-number v-model:value="zoomFactorPopoverData.zoomFactor" :min="2" :max="200" /> |
| | | <a-input-number v-model:value="zoomFactorPopoverData.zoomFactor" :min="2" |
| | | :max="200"/> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | import { useMyStore } from '/@/store' |
| | | import { postDrcEnter, postDrcExit } from '/@/api/drc' |
| | | import { useMqtt, DeviceTopicInfo } from './use-mqtt' |
| | | import { DownOutlined, UpOutlined, LeftOutlined, RightOutlined, PauseCircleOutlined, UndoOutlined, RedoOutlined, ArrowUpOutlined, ArrowDownOutlined, CloseOutlined } from '@ant-design/icons-vue' |
| | | import { |
| | | DownOutlined, |
| | | UpOutlined, |
| | | LeftOutlined, |
| | | RightOutlined, |
| | | PauseCircleOutlined, |
| | | UndoOutlined, |
| | | RedoOutlined, |
| | | ArrowUpOutlined, |
| | | ArrowDownOutlined, |
| | | CloseOutlined |
| | | } from '@ant-design/icons-vue' |
| | | import { useManualControl, KeyCode } from './use-manual-control' |
| | | import { usePayloadControl } from './use-payload-control' |
| | | import { CameraMode, CameraType, CameraTypeOptions, ZoomCameraTypeOptions, CameraListItem } from '/@/types/live-stream' |
| | | import { useDroneControlWsEvent } from './use-drone-control-ws-event' |
| | | import { useDroneControlMqttEvent } from './use-drone-control-mqtt-event' |
| | | import { postFlightAuth, LostControlActionInCommandFLight, WaylineLostControlActionInCommandFlight } from '/@/api/drone-control/drone' |
| | | import { |
| | | postFlightAuth, |
| | | LostControlActionInCommandFLight, |
| | | WaylineLostControlActionInCommandFlight |
| | | } from '/@/api/drone-control/drone' |
| | | import { useDroneControl } from './use-drone-control' |
| | | import { GimbalResetMode, GimbalResetModeOptions, LostControlActionInCommandFLightOptions, WaylineLostControlActionInCommandFlightOptions } from '/@/types/drone-control' |
| | | import { |
| | | GimbalResetMode, |
| | | GimbalResetModeOptions, |
| | | LostControlActionInCommandFLightOptions, |
| | | WaylineLostControlActionInCommandFlightOptions |
| | | } from '/@/types/drone-control' |
| | | import DroneControlPopover from './DroneControlPopover.vue' |
| | | import DroneControlInfoPanel from './DroneControlInfoPanel.vue' |
| | | import { noDebugCmdList as baseCmdList, DeviceCmdItem, DeviceCmd } from '/@/types/device-cmd' |
| | |
| | | } |
| | | cmdItem.loading = false |
| | | } |
| | | |
| | | const emits = defineEmits(['update:modelValue']) |
| | | // 关闭弹窗 |
| | | const closeDrone = () => { |
| | |
| | | } |
| | | enterFlightControl() |
| | | } |
| | | |
| | | // 进入飞行控制 |
| | | async function enterFlightControl () { |
| | | if (!clientId.value) { |
| | | message.error('无人机不在空中,不能进入指挥飞行模式。') |
| | | return |
| | | } |
| | | try { |
| | | const { code, data } = await postDrcEnter({ |
| | | client_id: clientId.value, |
| | |
| | | .drone-control-box { |
| | | display: flex; |
| | | flex-wrap: 1; |
| | | |
| | | .box { |
| | | width: 50%; |
| | | padding: 5px; |