diff --git a/src/assets/images/flightoperation/direction_controller.png b/src/assets/images/flightoperation/direction_controller.png index 441b268..7947699 100644 Binary files a/src/assets/images/flightoperation/direction_controller.png and b/src/assets/images/flightoperation/direction_controller.png differ diff --git a/src/assets/images/flightoperation/p-bottom-active.png b/src/assets/images/flightoperation/p-bottom-active.png new file mode 100644 index 0000000..3aa883a Binary files /dev/null and b/src/assets/images/flightoperation/p-bottom-active.png differ diff --git a/src/assets/images/flightoperation/p-bottom.png b/src/assets/images/flightoperation/p-bottom.png new file mode 100644 index 0000000..1642979 Binary files /dev/null and b/src/assets/images/flightoperation/p-bottom.png differ diff --git a/src/assets/images/flightoperation/p-left-active.png b/src/assets/images/flightoperation/p-left-active.png new file mode 100644 index 0000000..8370e8c Binary files /dev/null and b/src/assets/images/flightoperation/p-left-active.png differ diff --git a/src/assets/images/flightoperation/p-left.png b/src/assets/images/flightoperation/p-left.png new file mode 100644 index 0000000..e7bc3c4 Binary files /dev/null and b/src/assets/images/flightoperation/p-left.png differ diff --git a/src/assets/images/flightoperation/p-right-active.png b/src/assets/images/flightoperation/p-right-active.png new file mode 100644 index 0000000..268b2aa Binary files /dev/null and b/src/assets/images/flightoperation/p-right-active.png differ diff --git a/src/assets/images/flightoperation/p-right.png b/src/assets/images/flightoperation/p-right.png new file mode 100644 index 0000000..644ff1d Binary files /dev/null and b/src/assets/images/flightoperation/p-right.png differ diff --git a/src/assets/images/flightoperation/p-top-active.png b/src/assets/images/flightoperation/p-top-active.png new file mode 100644 index 0000000..54263a1 Binary files /dev/null and b/src/assets/images/flightoperation/p-top-active.png differ diff --git a/src/assets/images/flightoperation/p-top.png b/src/assets/images/flightoperation/p-top.png new file mode 100644 index 0000000..37cbb75 Binary files /dev/null and b/src/assets/images/flightoperation/p-top.png differ diff --git a/src/components/Application/src/AppLogo.vue b/src/components/Application/src/AppLogo.vue index 16b012d..ff09ed2 100644 --- a/src/components/Application/src/AppLogo.vue +++ b/src/components/Application/src/AppLogo.vue @@ -6,7 +6,7 @@
- {{ subjectLogoTitle ? subjectLogoTitle : title }} + {{ subjectLogoTitle ? subjectLogoTitle : shortName }}
@@ -42,7 +42,7 @@ const { prefixCls } = useDesign('app-logo'); const { getCollapsedShowTitle } = useMenuSetting(); const userStore = useUserStore(); - const { title } = useGlobSetting(); + const { shortName } = useGlobSetting(); const subjectLogoTitle = getAuthCache(SUBJECT_LOGO_TITLE); const go = useGo(); diff --git a/src/hooks/setting/index.ts b/src/hooks/setting/index.ts index 59326f3..dcdc166 100644 --- a/src/hooks/setting/index.ts +++ b/src/hooks/setting/index.ts @@ -3,14 +3,20 @@ import type { GlobConfig } from '#/config'; import { getAppEnvConfig } from '@/utils/env'; export const useGlobSetting = (): Readonly => { - const { VITE_GLOB_APP_TITLE, VITE_GLOB_API_URL, VITE_GLOB_API_URL_PREFIX, VITE_GLOB_UPLOAD_URL } = - getAppEnvConfig(); + const { + VITE_GLOB_APP_TITLE, + VITE_GLOB_API_URL, + VITE_GLOB_API_URL_PREFIX, + VITE_GLOB_UPLOAD_URL, + VITE_GLOB_APP_HEADER_TITLE, + } = getAppEnvConfig(); // Take global configuration const glob: Readonly = { title: VITE_GLOB_APP_TITLE, apiUrl: VITE_GLOB_API_URL, - shortName: VITE_GLOB_APP_TITLE.replace(/\s/g, '_').replace(/-/g, '_'), + // shortName: VITE_GLOB_APP_TITLE.replace(/\s/g, '_').replace(/-/g, '_'), + shortName: VITE_GLOB_APP_HEADER_TITLE, urlPrefix: VITE_GLOB_API_URL_PREFIX, uploadUrl: VITE_GLOB_UPLOAD_URL, }; diff --git a/src/utils/env.ts b/src/utils/env.ts index 9ae2561..10e1f8b 100644 --- a/src/utils/env.ts +++ b/src/utils/env.ts @@ -41,6 +41,7 @@ export function getAppEnvConfig() { VITE_GLOB_APP_TECHINICAL_SUPPORT, VITE_GLOB_APP_VERSIONS, VITE_GLOB_FILE_PREVIEW, + VITE_GLOB_APP_HEADER_TITLE, } = ENV; let { VITE_GLOB_API_URL } = ENV; if (localStorage.getItem(API_ADDRESS)) { @@ -59,6 +60,7 @@ export function getAppEnvConfig() { VITE_GLOB_APP_TECHINICAL_SUPPORT, VITE_GLOB_APP_VERSIONS, VITE_GLOB_FILE_PREVIEW, + VITE_GLOB_APP_HEADER_TITLE, }; } diff --git a/src/views/demo/workmanagement/flightoperation/index.vue b/src/views/demo/workmanagement/flightoperation/index.vue index c3e2960..0e93398 100644 --- a/src/views/demo/workmanagement/flightoperation/index.vue +++ b/src/views/demo/workmanagement/flightoperation/index.vue @@ -15,6 +15,7 @@ @changeLive="changeAirportLive" @changeRemote="changeRemote" :msgData="msgData" + v-if="changeSelectValue" /> @@ -39,6 +42,7 @@ @changeFlightControl="changeFlightControl" @clickTakeOff="clickTakeOff" @clickFlyTo="clickFlyTo" + :uavStatus="uavStatus" v-if="flightControlVisible" /> @@ -116,10 +120,10 @@ longitude: null, }); const uavTrack = ref({}); - const connected = ref(false) + const connected = ref(false); const connectCallback = () => { - connected.value = true - } + connected.value = true; + }; onMounted(() => { destroyConnection(); createConnection(connectCallback); @@ -127,12 +131,15 @@ // changeSelect(); // }, 1000); }); - watch(() => connected.value, (value) => { - if(value){ - console.log('start') - changeSelect() - } - }) + watch( + () => connected.value, + (value) => { + if (value) { + console.log('start'); + changeSelect(); + } + }, + ); onBeforeUnmount(() => { destroyConnection(); }); @@ -195,6 +202,7 @@ }; const msgData = ref({}); const changeSelect = async (value?: any) => { + createConnection(connectCallback); // 页面初始化 // 机场直播 airportLiveVisible.value = false; @@ -220,27 +228,32 @@ // 订阅飞行器消息 clientSubscribe(topicUAVUrl, { qos: 0 }); - // 接收消息 - getClient().on('message', (topic, message) => { - const rs = JSON.parse(message); - if (rs) { - msgData.value = { - topic: topic, - message: rs, - }; + if (!value) { + // 接收消息 + getClient().on('message', (topic, message) => { + const rs = JSON.parse(message); + if (rs) { + msgData.value = { + topic: topic, + message: rs, + }; - if (topic == topicUAVUrl) { - if (rs.data.latitude && rs.data.longitude) { - uavTrack.value = rs.data; - } - } else if (topic == topicUrl) { - if (rs.data.latitude && rs.data.longitude) { - airPort.value.latitude = rs.data.latitude; - airPort.value.longitude = rs.data.longitude; + if (topic == topicUAVUrl) { + if (rs.data.latitude && rs.data.longitude) { + uavTrack.value = rs.data; + } + } else if (topic == topicUrl) { + if (rs.data.latitude && rs.data.longitude) { + airPort.value.latitude = rs.data.latitude; + airPort.value.longitude = rs.data.longitude; + } + if (rs.data.sub_device) { + uavStatus.value = rs.data.sub_device.device_online_status; + } } } - } - }); + }); + } }; diff --git a/src/views/demo/workmanagement/flightoperation/src/FlyToForm.vue b/src/views/demo/workmanagement/flightoperation/src/FlyToForm.vue index aeb8b70..2f45779 100644 --- a/src/views/demo/workmanagement/flightoperation/src/FlyToForm.vue +++ b/src/views/demo/workmanagement/flightoperation/src/FlyToForm.vue @@ -44,7 +44,7 @@ >关闭 起飞执行 @@ -97,6 +97,9 @@ createMessage.warning('请先选择目标点'); return; } + data.points[0].latitude = Number(data.points[0].latitude); + data.points[0].longitude = Number(data.points[0].longitude); + data.points[0].height = Number(data.points[0].height); const querys = { bid: buildGUID(), data: data, @@ -118,9 +121,9 @@ onMounted(() => { // 定位到某个经纬度 EventBus.on('obtainTheLocation', (val: any) => { - data.points[0].latitude = val.lat; - data.points[0].longitude = val.lng; - data.points[0].height = val.alt; + data.points[0].latitude = val.lat.toFixed(6); + data.points[0].longitude = val.lng.toFixed(6); + data.points[0].height = val.alt.toFixed(2); }); }); diff --git a/src/views/demo/workmanagement/flightoperation/src/LivePreview.vue b/src/views/demo/workmanagement/flightoperation/src/LivePreview.vue index 1d80c4b..7b40ead 100644 --- a/src/views/demo/workmanagement/flightoperation/src/LivePreview.vue +++ b/src/views/demo/workmanagement/flightoperation/src/LivePreview.vue @@ -256,7 +256,7 @@ setTopic(querys); } setTimeout(() => { - startLiveFun(); + // startLiveFun(); playVideo(); getClient().on('message', (topic, message) => { const rs = JSON.parse(message); diff --git a/src/views/demo/workmanagement/flightoperation/src/LoadControl.vue b/src/views/demo/workmanagement/flightoperation/src/LoadControl.vue index fb1015b..41c0cd3 100644 --- a/src/views/demo/workmanagement/flightoperation/src/LoadControl.vue +++ b/src/views/demo/workmanagement/flightoperation/src/LoadControl.vue @@ -24,27 +24,63 @@ 单拍
- +
+ @mousedown="changeDrc('pitch_speed', 'up', '俯视')" + @mouseup="changeDrc('pitch_speed', 'up', '')" + > + + +
+ @mousedown="changeDrc('yaw_speed', 'up', '右移')" + @mouseup="changeDrc('yaw_speed', 'up', '')" + > + + +
+ @mousedown="changeDrc('pitch_speed', 'down', '仰视')" + @mouseup="changeDrc('pitch_speed', 'down', '')" + > + + +
+ @mousedown="changeDrc('yaw_speed', 'down', '左移')" + @mouseup="changeDrc('yaw_speed', 'down', '')" + > + + +
{ - if (!flightGrab.value) { - createMessage.warning('请先获取相机控制权'); - return; + const changeDrc = (type, val, name) => { + selectName.value = name; + if (name !== '') { + if (!flightGrab.value) { + createMessage.warning('请先获取相机控制权'); + return; + } + let isLongPress = false; + longPressTimer.value = setTimeout(() => { + console.log('长按事件触发！'); + isLongPress = true; + longPressInterval.value = setInterval(() => { + let querys = getDRCFlightQuery(type, val); + servicesTopicReize(querys); + createMessage.info(name + '指令已发送'); + }, 1000); + }, longPressDuration.value); + if (isLongPress) { + isLongPress = false; + return; + } + // 画面拖动控制 + let querys = getDRCFlightQuery(type, val); + servicesTopicReize(querys); + createMessage.info(name + '指令已发送'); + } else { + if (longPressTimer.value) { + clearTimeout(longPressTimer.value); + longPressTimer.value = null; + console.log('清除延时器'); + } + if (longPressInterval.value) { + clearTimeout(longPressInterval.value); + longPressInterval.value = null; + console.log('清除定时器'); + } + console.log('鼠标松开'); } + }; + const getDRCFlightQuery = (type, val) => { let data = { payload_index: uav.camera_index, locked: true, @@ -269,15 +349,15 @@ } else { data[type] = -8; } - console.log('data', data); - // 画面拖动控制 - servicesTopicReize({ + const querys = { bid: buildGUID(), method: 'camera_screen_drag', tid: buildGUID(), timestamp: new Date().getTime(), data: data, - }); + }; + console.log(querys); + return querys; }; onMounted(() => { // 获取mqtt客户端信息 @@ -382,41 +462,45 @@ .direction-controller { position: relative; margin-top: 20px; - img { + .controller-bg { margin-left: 60px; width: 200px; } .direction-controller-top { - width: 50px; - height: 50px; position: absolute; - top: 20px; - left: 130px; + top: 43px; + left: 120px; cursor: pointer; + img { + width: 80px; + } } .direction-controller-right { - width: 50px; - height: 50px; position: absolute; - top: 70px; - right: 100px; + top: 60px; + right: 127px; cursor: pointer; + img { + width: 38px; + } } .direction-controller-bottom { - width: 50px; - height: 50px; position: absolute; - bottom: 20px; - right: 160px; + bottom: 44px; + left: 120px; cursor: pointer; + img { + width: 80px; + } } .direction-controller-left { - width: 50px; - height: 50px; position: absolute; - top: 80px; - left: 80px; + top: 60px; + left: 103px; cursor: pointer; + img { + width: 38px; + } } } .zoom { diff --git a/src/views/demo/workmanagement/flightoperation/src/TakeOffForm.vue b/src/views/demo/workmanagement/flightoperation/src/TakeOffForm.vue index f62b602..fed2ad6 100644 --- a/src/views/demo/workmanagement/flightoperation/src/TakeOffForm.vue +++ b/src/views/demo/workmanagement/flightoperation/src/TakeOffForm.vue @@ -217,6 +217,9 @@ createMessage.warning('请先选择目标点'); return; } + data.target_height = Number(data.target_height); + data.target_latitude = Number(data.target_latitude); + data.target_longitude = Number(data.target_longitude); const querys = { bid: buildGUID(), data: data, @@ -238,9 +241,9 @@ onMounted(() => { // 定位到某个经纬度 EventBus.on('obtainTheLocation', (val: any) => { - data.target_latitude = val.lat; - data.target_longitude = val.lng; - data.target_height = val.alt; + data.target_latitude = val.lat.toFixed(6); + data.target_longitude = val.lng.toFixed(6); + data.target_height = val.alt.toFixed(2); }); }); diff --git a/src/views/demo/workmanagement/flightoperation/src/UAVInformation.vue b/src/views/demo/workmanagement/flightoperation/src/UAVInformation.vue index f58755d..ba88f44 100644 --- a/src/views/demo/workmanagement/flightoperation/src/UAVInformation.vue +++ b/src/views/demo/workmanagement/flightoperation/src/UAVInformation.vue @@ -121,10 +121,7 @@ >
- 负载直播
@@ -132,15 +129,21 @@