| | |
| | | <a-col span="6"> |
| | | <a-tooltip title="海拔高度"> |
| | | <span>ASL</span> |
| | | <span class="ml5">{{ deviceInfo.device.height === str ? str : deviceInfo.device.height.toFixed(2) + 'm'}}</span> |
| | | <span class="ml5">{{ deviceInfo.device.height === str ? str : deviceInfo.device.height.toFixed(2) + |
| | | 'm' }}</span> |
| | | </a-tooltip> |
| | | </a-col> |
| | | <a-col span="6"> |
| | | <a-tooltip title="高于起飞高度"> |
| | | <span>ALT</span> |
| | | <span class="ml5">{{ deviceInfo.device.elevation === str ? str : deviceInfo.device.elevation.toFixed(2) + 'm' }}</span> |
| | | <span class="ml5">{{ deviceInfo.device.elevation === str ? str : deviceInfo.device.elevation.toFixed(2) + |
| | | 'm' }}</span> |
| | | </a-tooltip> |
| | | </a-col> |
| | | <a-col span="6"> |
| | |
| | | <a-col span="6"> |
| | | <a-tooltip title="风速"> |
| | | <span>W.S</span> |
| | | <span class="ml5">{{ deviceInfo.device.wind_speed === str ? str : (deviceInfo.device.wind_speed / |
| | | 10).toFixed(2) + ' m/s' }}</span> |
| | | <span class="ml5">{{ deviceInfo.device.wind_speed === str ? str : (deviceInfo.device.wind_speed / 10).toFixed(2) + ' m/s' }}</span> |
| | | </a-tooltip> |
| | | </a-col> |
| | | </a-row> |
| | |
| | | <!-- 机场OSD --> |
| | | <!-- && osdVisible.is_dock --> |
| | | <div class="osd-panel fz12" v-if="osdVisible.visible"> |
| | | <div class="fz16 pl5 pr5 flex-align-center flex-row flex-justify-between" |
| | | <div class="fz16 pr5 flex-align-center flex-row flex-justify-between" |
| | | style="border-bottom: 1px solid #515151; height: 10%;"> |
| | | <span>{{ osdVisible.gateway_callsign }}</span> |
| | | <span><a style="color: white;" @click="closeOsdWindow"> |
| | | <div class="flex-align-center flex-justify-center" style="display: flex;"> |
| | | <div v-if="osdVisible.latest_wayline_job" class="flex-column flex-align-center flex-justify-center"> |
| | | <div class="task_wrapper"> |
| | | <div class="task_content task_content_way" v-if="deviceInfo.device && deviceInfo.device?.mode_code === 5"> |
| | | <div class="task_status"> |
| | | <ContainerOutlined /> |
| | | <span>执行任务中</span> |
| | | </div> |
| | | </div> |
| | | <div class="task_content" v-else> |
| | | <div class="task_status"> |
| | | <ContainerOutlined /> |
| | | <span>待执行</span> |
| | | </div> |
| | | <div class="task_info">{{osdVisible.latest_wayline_job.is_later ? '今天': '明天'}}{{convertTimestampToDate(osdVisible.latest_wayline_job.begin_time, 'hh:mm')}}</div> |
| | | </div> |
| | | <div class="task_title">{{osdVisible.latest_wayline_job.name}}</div> |
| | | </div> |
| | | </div> |
| | | <span :style="[osdVisible.latest_wayline_job?'margin-left:20px':'']">{{ osdVisible.gateway_callsign }}</span> |
| | | </div> |
| | | <div> |
| | | <a style="color: white;" @click="closeOsdWindow"> |
| | | <CloseOutlined /> |
| | | </a></span> |
| | | </a> |
| | | </div> |
| | | </div> |
| | | <!-- 机场 --> |
| | | <div class="flex-display" style="border-bottom: 1px solid #515151;"> |
| | | <div class="flex-column flex-align-stretch flex-justify-center" style="width: 60px; background: #2d2d2d;"> |
| | | <a-tooltip :title="osdVisible.model"> |
| | | <a-tooltip :title="osdVisible.gateway_callsign"> |
| | | <div class="flex-column flex-align-center flex-justify-center" style="width: 90%;"> |
| | | <span> |
| | | <RobotFilled style="font-size: 48px;" /> |
| | |
| | | <a-col span="2"></a-col> |
| | | <a-col span="8"> |
| | | <a-button :class="[airPortOption ? 'active-color' : 'unactive-color']" class="width-100" type="primary" |
| | | size="small" @click="openFlySetting"> |
| | | size="small" @click="openFlySetting"> |
| | | 操作 |
| | | </a-button> |
| | | </a-col> |
| | |
| | | <a-tooltip :title="osdVisible.model"> |
| | | <div style="width: 90%;" class="flex-column flex-align-center flex-justify-center"> |
| | | <span><a-image :src="M30" :preview="false" /></span> |
| | | <span>M30</span> |
| | | <span>{{ DEVICE_NAME[`${osdVisible.device_domain}-${osdVisible.device_type}-${osdVisible.device_sub_type}`] |
| | | }}</span> |
| | | </div> |
| | | </a-tooltip> |
| | | </div> |
| | | <div class="osd flex-1"> |
| | | <a-row class="mr-20" align="middle"> |
| | | <a-col span="9" |
| | | :style="deviceInfo.device || deviceInfo.device?.mode_code !== EModeCode.Disconnected ? 'color: rgb(25,190,107)' : deviceInfo.dock.basic_osd?.drone_in_dock === 0 ?'color: red; font-weight: 700;': '' "> |
| | | :style="deviceInfo.device && deviceInfo.device?.mode_code !== EModeCode.Disconnected ? 'color: rgb(25,190,107)' : deviceInfo.dock.basic_osd?.drone_in_dock === 1 ? 'color: rgb(25,190,107)' : 'color: red; font-weight: 700;'"> |
| | | <!-- DroneInDockEnum[deviceInfo.dock.basic_osd?.drone_in_dock] --> |
| | | {{ deviceInfo.device ? EModeText[deviceInfo.device?.mode_code] : (deviceInfo.dock.basic_osd?.drone_in_dock === 1) ? '舱内关机' : EModeText[EModeCode.Disconnected] |
| | | {{ deviceInfo.device ? EModeText[deviceInfo.device?.mode_code] : (deviceInfo.dock.basic_osd?.drone_in_dock |
| | | === 1) ? '舱内关机' : EModeText[EModeCode.Disconnected] |
| | | }}</a-col> |
| | | <a-col span="15"> |
| | | <div style="width:100%;padding:0 5px;background-color: #5d5f61;color: #fff;font-size: 10px;">{{deviceInfo.device?.mode_code == 14 || !deviceInfo.device ? 'N/A' : '当前正常'}}</div> |
| | | <!-- <a-select :showArrow="false" v-model:value="aircraSelected" :bordered="false" :options="aircraftList" |
| | | :placeholder="aircraftList.length == 0 ? 'N/A' : '请选择'" :disabled="aircraftList.length == 0 ? true : false" |
| | | size="small" style="width:100%;background-color: #5d5f61;color: #fff;" @change="selectChange"></a-select> --> |
| | | <div style="width:100%;padding:0 5px;background-color: #5d5f61;color: #fff;font-size: 10px;"> |
| | | {{ deviceInfo.device?.mode_code == 14 || !deviceInfo.device ? 'N/A' : '当前正常' }}</div> |
| | | </a-col> |
| | | </a-row> |
| | | <a-row align="middle" justify="center"> |
| | |
| | | class="flex-display flex-justify-center mt5 mb5">当前设备已关机,无法进行直播</div> |
| | | </a-col> |
| | | </a-row> |
| | | <a-row class="p5" v-if="deviceInfo.device?.mode_code != 14 && deviceInfo.device" align="middle" justify="space-between"> |
| | | <a-row class="p5" v-if="deviceInfo.device?.mode_code != 14 && deviceInfo.device" align="middle" |
| | | justify="space-between"> |
| | | <a-col span="11"> |
| | | <a-button :class="[aircrafIndex === 0 ? 'active-color' : 'unactive-color']" class="width-100" type="primary" size="small" |
| | | @click="openAircra(0)"> |
| | | <a-button :class="[aircrafIndex === 0 ? 'active-color' : 'unactive-color']" class="width-100" type="primary" |
| | | size="small" @click="openAircra(0)"> |
| | | 飞行相机 |
| | | </a-button> |
| | | </a-col> |
| | |
| | | </a-button> |
| | | </a-col> |
| | | </a-row> |
| | | <a-row v-if="deviceInfo.device?.mode_code != 14 && deviceInfo.device" class="p5" align="middle" justify="space-between"> |
| | | <a-row class="p5" align="middle" justify="space-between"> |
| | | <a-col span="24"> |
| | | <!-- <a-button v-if="controlStatus != ''" :class="[openDroneControl ? 'active-color' : 'unactive-color']" class="width-100" type="primary" |
| | | size="small" @click="openDeviceSetting"> |
| | | 飞行控制(<DesktopOutlined v-if="controlStatus === 'A'" /> <RobotFilled v-else />{{ controlStatus === 'A' ? 'A控' : 'B控'}}) |
| | | </a-button> |
| | | <a-button v-else :class="[openDroneControl ? 'active-color' : 'unactive-color']" class="width-100" type="primary" |
| | | size="small" @click="openDeviceSetting"> |
| | | 飞行控制 |
| | | </a-button> --> |
| | | <a-button :class="[openDroneControl ? 'active-color' : 'unactive-color']" class="width-100" type="primary" |
| | | size="small" @click="openDeviceSetting"> |
| | | 操作 |
| | | 飞行控制 |
| | | </a-button> |
| | | </a-col> |
| | | </a-row> |
| | |
| | | import { getLiveCapacity, startLivestream, stopLivestream } from '/@/api/manage' |
| | | import { |
| | | DeviceOsd, DeviceStatus, DockOsd, EGear, EModeCode, GatewayOsd, EDockModeCode, EDockModeText, EModeText, |
| | | NetworkStateQualityEnum, NetworkStateTypeEnum, RainfallEnum, DroneInDockEnum |
| | | NetworkStateQualityEnum, NetworkStateTypeEnum, RainfallEnum, DroneInDockEnum, DEVICE_NAME |
| | | } from '/@/types/device' |
| | | import pin from '/@/assets/icons/pin-2d8cf0.svg' |
| | | import M30 from '/@/assets/icons/m30.png' |
| | | import { |
| | | BorderOutlined, LineOutlined, CloseOutlined, ControlOutlined, TrademarkOutlined, ArrowDownOutlined, |
| | | BorderOutlined, LineOutlined, ControlOutlined, TrademarkOutlined, ArrowDownOutlined, |
| | | ThunderboltOutlined, SignalFilled, GlobalOutlined, HistoryOutlined, CloudUploadOutlined, RocketOutlined, |
| | | FieldTimeOutlined, CloudOutlined, CloudFilled, FolderOpenOutlined, RobotFilled, ArrowUpOutlined, CarryOutOutlined |
| | | FieldTimeOutlined, CloudOutlined, CloudFilled, FolderOpenOutlined, RobotFilled, ArrowUpOutlined, CarryOutOutlined, |
| | | DesktopOutlined, CloseOutlined, ContainerOutlined |
| | | } from '@ant-design/icons-vue' |
| | | import { EDeviceTypeName } from '../types' |
| | | import DockControlPanel from './g-map/DockControlPanel.vue' |
| | |
| | | import DroneControlPanel from './g-map/DroneControlPanel.vue' |
| | | import { useConnectMqtt } from './g-map/use-connect-mqtt' |
| | | import Cesium from './cesiumMap/cesium.vue' |
| | | import { convertTimestampToDate } from '/@/utils/time' |
| | | export default defineComponent({ |
| | | components: { |
| | | BorderOutlined, |
| | | LineOutlined, |
| | | CloseOutlined, |
| | | ContainerOutlined, |
| | | ControlOutlined, |
| | | TrademarkOutlined, |
| | | ThunderboltOutlined, |
| | |
| | | DockControlPanel, |
| | | DroneControlPanel, |
| | | CarryOutOutlined, |
| | | RocketOutlined |
| | | RocketOutlined, |
| | | DesktopOutlined, |
| | | }, |
| | | name: 'GMap', |
| | | props: {}, |
| | |
| | | airPortUrl.value = res.data.url |
| | | }) |
| | | } |
| | | // 下拉框选择变化 |
| | | const selectChange = async (e) => { |
| | | // await closeFly() |
| | | // setTimeout(async () => { |
| | | await flyOnStart() |
| | | // }, 500) |
| | | } |
| | | // 关闭设备直播 |
| | | const onClose = async () => { |
| | | const videoId = droneList.value[droneIndex.value].value + '/' + cameraList.value[cameraIndex.value].value + '/' + videoList.value[videoIndex.value].value |
| | |
| | | airPortOption.value = false |
| | | openDroneControl.value = !openDroneControl.value |
| | | } |
| | | // 飞行控制状态 |
| | | const controlStatus = computed(() => store.state.common.droneControlSource) |
| | | watch(() => store.state.deviceStatusEvent, |
| | | data => { |
| | | if (Object.keys(data.deviceOnline).length !== 0) { |
| | |
| | | str, |
| | | EDockModeCode, |
| | | EDockModeText, |
| | | DEVICE_NAME, |
| | | EModeText, |
| | | dockControlPanelVisible, |
| | | setDockControlPanelVisible, |
| | |
| | | aircraftUrl, |
| | | aircraftList, |
| | | aircraSelected, |
| | | selectChange, |
| | | closeOperate, |
| | | closeOsdWindow, |
| | | openDroneControl, |
| | |
| | | airTimeout, |
| | | flyTimeout, |
| | | aircrafIndex, |
| | | airPortOption |
| | | airPortOption, |
| | | controlStatus, |
| | | convertTimestampToDate |
| | | } |
| | | } |
| | | }) |
| | |
| | | &::after { |
| | | display: none; |
| | | } |
| | | } |
| | | |
| | | &:deep(.ant-btn > .anticon + span, .ant-btn > span + .anticon, .ant-btn > .anticon + span, .ant-btn > span + .anticon) { |
| | | margin-left: 5px !important; |
| | | } |
| | | } |
| | | |
| | |
| | | position: absolute; |
| | | min-height: 2px; |
| | | border-radius: 2px; |
| | | }</style> |
| | | } |
| | | .task_wrapper { |
| | | display: flex; |
| | | align-items: center; |
| | | font-size: 12px; |
| | | .task_content { |
| | | background-color: #41bbfa; |
| | | padding: 2px 4px; |
| | | } |
| | | |
| | | .task_content_way { |
| | | background-color: #19be6b; |
| | | } |
| | | .task_title { |
| | | margin-left: 5px; |
| | | font-size: 14px; |
| | | } |
| | | } |
| | | </style> |