From f713b336e30b5154f9a4a680ab136cbd97263e28 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Sat, 19 Apr 2025 15:54:54 +0800
Subject: [PATCH] feat: 获取直播能力
---
src/api/payload.js | 32 ++++++++++------
src/components/CurrentTaskDetails/TaskDetailsLeft.vue | 6 +-
src/components/CurrentTaskDetails/TaskDetailsRight.vue | 2
src/components/CurrentTaskDetails/CurrentTaskDetails.vue | 44 +++++++++++++++++++---
4 files changed, 62 insertions(+), 22 deletions(-)
diff --git a/src/api/payload.js b/src/api/payload.js
index 8bc5a14..1d9d374 100644
--- a/src/api/payload.js
+++ b/src/api/payload.js
@@ -24,17 +24,17 @@
}
// 获得有效载荷控制
-export async function getPayloadControlApi(params) {
- return await request({
- url:`${API_PREFIX}/devices/payload-control/requests`,
- method:'get',
+export function getPayloadControlApi(params) {
+ return request({
+ url: `${API_PREFIX}/devices/payload-control/requests`,
+ method: 'get',
params
})
}
// 云台控制api
-export async function ptzControlApi(key,params) {
- return await request({
+export function ptzControlApi(key,params) {
+ return request({
url:`${API_PREFIX}/devices/payload-control/payload/${key}`,
method:'get',
params
@@ -42,8 +42,8 @@
}
// 拍照和录像
-export async function callPhotoAndVideoCmd(sn, type) {
- return await request({
+export function callPhotoAndVideoCmd(sn, type) {
+ return request({
url:`${API_PREFIX}/devices/${sn}/payload/photoAndVideoCmd/${type}`,
method:'get',
})
@@ -51,17 +51,25 @@
// 相机参数调整
-export async function cameraParamsChangeApi(data) {
- return await request({
+export function cameraParamsChangeApi(data) {
+ return request({
url:`${API_PREFIX}/devices/payload-control/payload/zoom/level`,
method:'post',
data
})
}
+export function getLiveCapacityApi(workspace_id,params) {
+ return request({
+ url:`/drone-device-core/manage/api/v1/live/capacity${workspace_id}`,
+ method:'get',
+ params
+ })
+}
+
// 云台重置
-export async function ptzResetModeApi(params) {
- return await request({
+export function ptzResetModeApi(params) {
+ return request({
url:`${API_PREFIX}/devices/payload-control/payload/reset`,
method:'get',
params
diff --git a/src/components/CurrentTaskDetails/CurrentTaskDetails.vue b/src/components/CurrentTaskDetails/CurrentTaskDetails.vue
index a9d4cdb..8e33996 100644
--- a/src/components/CurrentTaskDetails/CurrentTaskDetails.vue
+++ b/src/components/CurrentTaskDetails/CurrentTaskDetails.vue
@@ -4,9 +4,9 @@
* @LastEditors: shuishen 1109946754@qq.com
* @LastEditTime: 2025-04-19 15:07:04
* @FilePath: \command-center-dashboard\src\components\CurrentTaskDetails\CurrentTaskDetails.vue
- * @Description:
- *
- * Copyright (c) 2025 by shuishen, All Rights Reserved.
+ * @Description:
+ *
+ * Copyright (c) 2025 by shuishen, All Rights Reserved.
-->
<!--当前任务详情-->
<template>
@@ -20,7 +20,7 @@
>
<div class="content-container" v-if="isShow">
<!-- 视频直播 -->
- <div :class="`${isMaxMap ? 'minBox' : 'maxBox'}`">
+ <div :class="`${isMaxMap ? 'minBox' : 'maxBox'} centerPoint`">
<LiveVideo :videoUrl="currentLiveUrl" :controls="false" />
</div>
<!-- 展示地图 -->
@@ -52,7 +52,7 @@
import { ElMessage } from 'element-plus'
import EventBus from '@/event-bus'
import { updateDroneQualityApi } from '@/api/drc'
-import { getLiveAiLinkApi } from '@/api/payload'
+import { getLiveAiLinkApi, getLiveCapacityApi } from '@/api/payload'
import { CURRENT_CONFIG } from '@/utils/http/config'
import { useDroneWS } from '@/hooks/useDroneWS'
import { useTaskDetails } from '@/hooks/useTaskDetails/useTaskDetails'
@@ -79,7 +79,16 @@
currentLiveUrl.value = res.data.data.rtcs_url
}
-let { taskDetails, workspace_id, getTaskDetails } = useTaskDetails(getDeviceLiveUrl)
+//获取相机能力
+async function getLiveCapacity() {
+ const res = await getLiveCapacityApi(workspace_id.value,{ sn: dockSn.value})
+ console.log(res.data.data,66666666)
+}
+const useTaskDetailsCallBack = () => {
+ getDeviceLiveUrl()
+}
+
+let { taskDetails, workspace_id, getTaskDetails } = useTaskDetails(useTaskDetailsCallBack)
let { wsInfo, removeWS } = useDroneWS(workspace_id) //ws信息,是一个ref对象
provide('wsInfo', wsInfo)
@@ -95,6 +104,14 @@
provide('isAiLive', isAiLive)
provide('video_id', video_id)
provide('client_id', client_id)
+
+let once = true
+watch(deviceOsdInfo,()=>{
+ if (once){
+ getLiveCapacity()
+ once =false
+ }
+})
watch(
wsInfo,
@@ -201,6 +218,21 @@
border-radius: 4rem;
overflow: hidden;
+ .centerPoint {
+ &:before {
+ content: '+';
+ font-size: 30px;
+ color: white;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ pointer-events: none;
+ font-weight: bold;
+ text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black; /* 四方向描边 */
+ }
+ }
+
.maxBox {
width: 100%;
height: 100%;
diff --git a/src/components/CurrentTaskDetails/TaskDetailsLeft.vue b/src/components/CurrentTaskDetails/TaskDetailsLeft.vue
index ec3b707..f0745fb 100644
--- a/src/components/CurrentTaskDetails/TaskDetailsLeft.vue
+++ b/src/components/CurrentTaskDetails/TaskDetailsLeft.vue
@@ -21,7 +21,7 @@
<div @click="takePictures">拍照</div>
<div @click="recordFun">{{ isRecording ? '录像中...' : '录像' }}</div>
</div>
- <div class="multiCol">
+ <div class="multiCol" v-if="wsInfo?.psdk_widget_values">
<div @click="shoutFun">{{ isRecordShouting ? '喊话' : '停止喊话' }}</div>
<div @click="broadcastFun">广播</div>
</div>
@@ -102,9 +102,9 @@
import Recorder from 'js-audio-recorder';
import dayjs from 'dayjs'
+const wsInfo = inject('wsInfo')
// 初始化喊话
let globalShout = null
-
const isRecording = ref(false)
const list1 = ref([
@@ -346,7 +346,7 @@
top: 50%;
transform: translateY(-60%);
width: 178px;
- height: 416px;
+ padding: 20px 0;
background: rgba(0, 0, 0, 0.5);
backdrop-filter: blur(5px);
border-radius: 20px 20px 20px 20px;
diff --git a/src/components/CurrentTaskDetails/TaskDetailsRight.vue b/src/components/CurrentTaskDetails/TaskDetailsRight.vue
index 2a3ad92..e2652c0 100644
--- a/src/components/CurrentTaskDetails/TaskDetailsRight.vue
+++ b/src/components/CurrentTaskDetails/TaskDetailsRight.vue
@@ -58,7 +58,7 @@
top: 0;
width: 297px;
height: 1002px;
- background: rgba(31, 31, 31, 0.15);
+ background: rgba(31, 31, 31, 0.5);
backdrop-filter: blur(0.5rem);
border-radius: 0px 40px 40px 0px;
display: flex;
--
Gitblit v1.9.3