feat: 控制台云台回中功能

罗广辉

2025-04-17 bf483860821fb7a3dbeb9c76192c1c1e3e35f1df

feat: 控制台云台回中功能

 src/api/payload.js

@@ -53,12 +53,21 @@
// 相机参数调整
export async function cameraParamsChangeApi(data) {
  return await request({
    url:`/drone-device-core/payload-control/payload/zoom/level`,
    url:`${API_PREFIX}/devices/payload-control/payload/zoom/level`,
    method:'post',
    data
  })
}

// 云台重置
export async function ptzResetModeApi(params) {
  return await request({
    url:`${API_PREFIX}/devices/payload-control/payload/reset`,
    method:'get',
    params
  })
}



// 切换直播镜头

 src/components/CurrentTaskDetails/ControlPanel/BaseControl.vue

@@ -55,6 +55,7 @@
}

function turnBack() {
    isAutoControl.value = true
    EventBus.emit('controlPanel-returnOrCancelReturn')
}
</script>

 src/components/CurrentTaskDetails/ControlPanel/ControlPanel.vue

@@ -88,6 +88,7 @@
                        :style="item.style"
                        class="ptzControlItem"
                        @mousedown="onMouseDown(item.key)"
                        @mouseup="onMouseUp"
                    ></div>

                    <div

 src/components/CurrentTaskDetails/TaskDetailsLeft.vue

@@ -11,8 +11,8 @@
            {{ item.name }}相机
        </div>
        <div class="multiCol">
            <div @click="faceToCenter">云台回中</div>
            <div @click="faceToDown">云台朝下</div>
            <div @click="ptzResetMode(0)">云台回中</div>
            <div @click="ptzResetMode(1)">云台朝下</div>
        </div>
        <el-select class="qualityChange" v-model="lineQuality" @change="qualityChange">
            <el-option v-for="item in qualityList" :key="item.id" :label="item.name" :value="item.id" />
@@ -30,8 +30,9 @@
            <el-slider
                v-model="cameraParams.zoom_factor"
                vertical
                :max="cameraParams.camera_type === 'ir' ? 20 : 50"
                @input="sliderChange"
                :min="cameraParams.camera_type === 'ir' ? 2 : 0"
                :max="cameraParams.camera_type === 'ir' ? 200 : 200"
                @change="sliderChange"
            />
        </div>
    </div>
@@ -39,7 +40,7 @@

<script setup>
import EventBus from '@/event-bus'
import { callPhotoAndVideoCmd, cameraParamsChangeApi } from '@/api/payload'
import { callPhotoAndVideoCmd, cameraParamsChangeApi, ptzResetModeApi } from '@/api/payload'
import { ElMessage } from 'element-plus'
import { throttle } from 'lodash'

@@ -65,9 +66,9 @@
    { name: '超清', id: 4 },
]

function faceToCenter() {}

function faceToDown() {}
function ptzResetMode(resetMode) {
    ptzResetModeApi({ sn: dockSn.value, resetMode })
}

// 倍率调整
function sliderChange(val) {
@@ -82,9 +83,11 @@

// 修改相机参数
function cameraParamsChange() {
    const { camera_type, zoom_factor} = cameraParams.value
    cameraParamsChangeApi({
        sn: dockSn.value,
        ...cameraParams.value,
        zoom_factor: camera_type === 'wide' ? undefined : zoom_factor,
    })
}

@@ -97,7 +100,7 @@
        cameraParams.value.zoom_factor = 5
    }
    if (row.key === 'ir') {
        cameraParams.value.zoom_factor = 0
        cameraParams.value.zoom_factor = 2
    }
    cameraParamsChange()
}

 src/hooks/controlDrone/useManualControl.js

@@ -40,7 +40,6 @@
    let genPortOne = true //是一代机场
    const mqttHooks = useMqtt(mqttState,deviceTopicInfo)
    let seq = 0
    let throttledPtz = null

    function handlePublish(params) {
        const body = {
@@ -131,24 +130,29 @@
                activeCodeKey.value = keyCode
                break
            case 'ArrowUp':
                ptzThrottle[0]()
                if (activeCodeKey.value === keyCode) return
                myInterval = setInterval(()=>ptzControl('up'), 50)
                activeCodeKey.value = keyCode
                break
            case 'ArrowDown':
                ptzThrottle[1]()
                if (activeCodeKey.value === keyCode) return
                myInterval = setInterval(()=>ptzControl('down'), 50)
                activeCodeKey.value = keyCode
                break
            case 'ArrowLeft':
                ptzThrottle[2]()
                if (activeCodeKey.value === keyCode) return
                myInterval = setInterval(()=>ptzControl('left'), 50)
                activeCodeKey.value = keyCode
                break
            case 'ArrowRight':
                ptzThrottle[3]()
                if (activeCodeKey.value === keyCode) return
                myInterval = setInterval(()=>ptzControl('right'), 50)
                activeCodeKey.value = keyCode
                break
            default:
                break
        }
    }

    // 云台控制节流list
    const ptzThrottle = ['up','down','left','right'].map(key => throttle(()=>ptzControl(key), 500))

    // 云台上下左右
    function ptzControl(key) {