feat: 获取直播能力

罗广辉

2025-04-19 f713b336e30b5154f9a4a680ab136cbd97263e28

feat: 获取直播能力

 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

 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%;

 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;

 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;