From 55e74685fe3a27bf061a2451b2a730ddb0bc7e9c Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Fri, 18 Apr 2025 23:54:45 +0800
Subject: [PATCH] feat: 抽出WS逻辑
---
src/components/CurrentTaskDetails/CurrentTaskDetails.vue | 120 ++++++++++++++++-------------------------------------------
1 files changed, 33 insertions(+), 87 deletions(-)
diff --git a/src/components/CurrentTaskDetails/CurrentTaskDetails.vue b/src/components/CurrentTaskDetails/CurrentTaskDetails.vue
index 3034518..1ec6661 100644
--- a/src/components/CurrentTaskDetails/CurrentTaskDetails.vue
+++ b/src/components/CurrentTaskDetails/CurrentTaskDetails.vue
@@ -22,7 +22,7 @@
</template>
<!-- 控制面板，里面有方法需要立即执行，不可用v-if -->
-<!-- <ControlPanel />-->
+ <!-- <ControlPanel />-->
<ControlPanel v-show="!isAutoControl" />
<img alt="" :src="amplifyImg" class="amplify" @click="isMaxMap = !isMaxMap" />
</div>
@@ -49,40 +49,42 @@
import { updateDroneQualityApi } from '@/api/drc'
import { getLiveAiLinkApi } from '@/api/payload'
import { CURRENT_CONFIG } from '@/utils/http/config'
+import { useDroneWS } from '@/components/CurrentTaskDetails/useDroneWS'
-const isAutoControl = ref(true)
+const isAutoControl = ref(true) //是否自动控制
const lineQuality = ref(1) //1流畅，2标清
-provide('isAutoControl', isAutoControl)
-provide('lineQuality', lineQuality)
-
-const taskDetailsViewer = ref(null)
-provide('taskDetailsViewer', taskDetailsViewer)
-
-let taskDetails = ref({})
-provide('taskDetails', taskDetails)
-const deviceOsdInfo = ref({})
-provide('deviceOsdInfo', deviceOsdInfo)
-
+const taskDetailsViewer = ref(null) //地图实例
+let taskDetails = ref({}) //任务详情
+const deviceOsdInfo = computed(() => wsInfo.value?.device_osd)
const dockSn = computed(() => taskDetails?.value?.device_sns?.[0])
const droneSn = computed(() => deviceOsdInfo?.value?.data?.sn)
+const trueAltitude = ref('') // 真实高度
+const isAiLive = ref(false) // 是ai直播
+const video_id = ref('') // 直播视频id
+const workspace_id = ref('')
+const isShow = defineModel('show') // 是否显示当前任务详情
+const props = defineProps(['id'])
+const currentLiveUrl = ref('') // 当前直播地址
+const isTakeOff = ref(false) // 是在飞行中
+const isMaxMap = ref(false) //是大地图
+
+provide('isAutoControl', isAutoControl)
+provide('lineQuality', lineQuality)
+provide('taskDetailsViewer', taskDetailsViewer)
+provide('taskDetails', taskDetails)
+provide('deviceOsdInfo', deviceOsdInfo)
+provide('dockOsdInfo', wsInfo?.value?.dock_osd)
provide('dockSn', dockSn)
provide('droneSn', droneSn)
-
-const trueAltitude = ref('')
provide('trueAltitude', trueAltitude)
-
-const isAiLive = ref(false)
provide('isAiLive', isAiLive)
-
-const isShow = defineModel('show')
-const props = defineProps(['id'])
-const currentLiveUrl = ref('')
-const isTakeOff = ref(false)
-const isMaxMap = ref(false)
-let droneWebSocket //WS实例
-
-const video_id = ref('')
provide('video_id', video_id)
+
+let wsInfo = useDroneWS(workspace_id)
+watch(wsInfo, () => {
+ setCurrentLiveUrl()
+}, { deep: true })
+provide('wsInfo', wsInfo)
// 获取机巢直播
const getDeviceLiveUrl = async () => {
@@ -90,10 +92,10 @@
currentLiveUrl.value = res.data.data.rtcs_url
}
-const getAiLiveUrl = async ()=>{
- const res =await getLiveAiLinkApi({
+const getAiLiveUrl = async () => {
+ const res = await getLiveAiLinkApi({
original_stream_url: `${CURRENT_CONFIG.rtmpURL}${video_id.value.replace(/\//g, '-')}`,
- video_id:video_id.value
+ video_id: video_id.value,
})
currentLiveUrl.value = res.data.data.rtcs_url
ElMessage.success('开启成功')
@@ -116,15 +118,13 @@
// 设置当前直播地址
const setCurrentLiveUrl = async () => {
- const data = deviceOsdInfo.value?.data
- const deviceInfo = data?.host
+ const deviceInfo = deviceOsdInfo.value?.data?.host
const currentIsTakeOff = ![14, 0].includes(deviceInfo.mode_code)
// 如果还是之前的状态，不切换
if (isTakeOff.value === currentIsTakeOff) return
isTakeOff.value = currentIsTakeOff
isTakeOff.value ? await getDroneLiveUrl() : await getDeviceLiveUrl()
}
-
// 获取任务详情获取航线文件
const getTaskDetails = () => {
if (!props.id) ElMessage.warning('请检查是否传入id')
@@ -132,59 +132,8 @@
taskDetails.value = res.data.data
await getDeviceLiveUrl()
taskDetails.value.workspace_id = taskDetails.value.way_lines[0]?.workspace_id
- createWsConnect()
+ workspace_id.value = taskDetails.value.workspace_id
})
-}
-
-const dockOsdInfo = ref({})
-provide('dockOsdInfo', dockOsdInfo)
-
-const wsInfo = ref({})
-provide('wsInfo', wsInfo)
-// websocket 的消息回调
-const messageHandler = result => {
- let payload = JSON.parse(result)
- wsInfo.value[payload.biz_code] = payload
- switch (payload.biz_code) {
- // 无人机
- case EBizCode.DeviceOsd: {
- deviceOsdInfo.value = payload
- setCurrentLiveUrl()
- console.log(payload, 'DeviceOsd--信息')
- break
- }
- // 遥控器
- case EBizCode.GatewayOsd: {
- console.log(payload, 'GatewayOsd--信息')
- break
- }
- // 机巢
- case EBizCode.DockOsd: {
- console.log(payload, 'DockOsd--信息')
- break
- }
- // PsdkWidgetValues
- case EBizCode.PsdkWidgetValues: {
- console.log(payload, 'PsdkWidgetValues--信息')
- break
- }
- // VideoSurveillance
- case EBizCode.VideoSurveillance: {
- console.log(payload, 'VideoSurveillance--信息')
- break
- }
- default:
- break
- }
-}
-
-// 创建ws连接
-const createWsConnect = () => {
- const workspaceId = taskDetails.value.workspace_id
- if (!workspaceId) return
- let webSocketUrl = getWebsocketUrl() + '&workspace-id=' + workspaceId
- // 监听ws 消息
- droneWebSocket = useConnectWebSocket(messageHandler, webSocketUrl)
}
onMounted(() => {
@@ -195,9 +144,6 @@
})
onBeforeUnmount(() => {
- droneWebSocket?.close()
- deviceOsdInfo.value = {}
- droneWebSocket = null
EventBus.off('CurrentTaskDetails-timeStop', changeLineQuality)
EventBus.off('CurrentTaskDetails-getAiLiveUrl', getAiLiveUrl)
EventBus.off('CurrentTaskDetails-getDroneLiveUrl', getDroneLiveUrl)
--
Gitblit v1.9.3