调试盘和照片和视频存储设置

linwei

2025-06-06 502c88c3193d037cc13f455edd3c21c40819ea6e

 src/views/device/components/DockControlPanel.vue

@@ -19,31 +19,64 @@
            <div class="item-status">{{ cmdItem.status }}</div>
          </div>
          <div class="control-cmd-item-right">
            <el-button :disabled="!debugStatus || cmdItem.disabled" :loading="cmdItem.loading" size="small" type="primary"
              @click="sendControlCmd(cmdItem, index)">
            <el-button :disabled="!debugStatus || cmdItem.disabled" :loading="cmdItem.loading" size="small"
              type="primary" @click="sendControlCmd(cmdItem, index)">
              {{ cmdItem.operateText }}
            </el-button>
          </div>
        </div>
      </div>
      
      <el-divider v-if="deviceInfo">无人机设置</el-divider>
      <!-- 设置 0:白热,1:黑热,2:描红,3:医疗,5:彩虹 1,6:铁红,8:北极,11:熔岩,12:热铁,13:彩虹 2 -->
      <div class="control-cmd-box">
        <div class="control-cmd-item" v-for="(item, index) in cameras">
          <div class="control-cmd-item-left">调色盘样式 {{ item.payload_index }}</div>
          <div class="control-cmd-item-right">
      <div class="control-cmd-box" v-for="(item, index) in cameras">
        <div>
          <el-form-item label="摄像头设置">
            <el-select @change="cameraSettings($event, item)" v-model="videoValue" placeholder="请选择">
              <el-option v-for="item in videoType" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="调色盘样式" v-if="videoValue == 'ir'">
            <el-select @change="changs($event, item)" v-model="valueStyle" placeholder="请选择">
              <el-option v-for="item in paletteOptions" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </div>
          </el-form-item>
        </div>

        <div>
          <el-form-item label="相机模式">
            <el-select @change="photoAndVideoCmdSettings($event, item)" v-model="cameraModeValue" placeholder="请选择">
              <el-option v-for="item in cameraMode" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="照片存储设置" v-if="cameraModeValue == 0">
            <el-select v-model="item.photo_storage_settings" collapse-tags @change="photoStorageTypeChang($event, item)"
              multiple placeholder="请选择">
              <el-option v-for="item in photoStorageType" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="视频存储设置" v-if="cameraModeValue == 1">
            <el-select v-model="item.video_storage_settings" collapse-tags @change="videoStorageTypeChang($event, item)"
              multiple placeholder="请选择">
              <el-option v-for="item in photoStorageType" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </div>

      </div>
    </div>
  </div>
</template>

<script setup>
import { ElMessage } from 'element-plus';
import EventBus from '@/event-bus'
import { EBizCode, ELocalStorageKey, ERouterName } from '@/types'
import { useConnectWebSocket } from '@/hooks/use-connect-websocket'
@@ -53,18 +86,56 @@
import { useDockControl } from './use-dock-control'
import { EDockModeCode } from '@/types/device'
import { updateDeviceCmdInfoByOsd, updateDeviceCmdInfoByExecuteInfo } from '@/utils/device-cmd'
import { setThermalCurrentPaletteStyle } from '@/api/device-setting'
import { setThermalCurrentPaletteStyle, setPhotoStorageSet, setVideoStorageSet, getLiveStatus, setStreamsSwitch, photoAndVideoCmd } from '@/api/device-setting'

import Store from '@/store'

const valueStyle = ref(0)
const cameraModeValue = ref(0)
const videoValue = ref("zoom")

// 定义一个数据videoList
const videoList = reactive([])
// 摄像头信息
let cameras = reactive([])
// let cameras = reactive([
//   {
//     camera_mode: 0,
//     liveview_world_region: {
//       bottom: 0.5515424609184265,
//       left: 0.42740535736083984,
//       right: 0.5581043362617493,
//       top: 0.42277535796165466
//     },
//     payload_index: "81-0-0",
//     photo_state: 0,
//     record_time: 0,
//     recording_state: 0,
//     remain_photo_num: 3931,
//     remain_record_duration: 0,
//     zoom_factor: 6.9999943,
//     ir_zoom_factor: 2,
//     photo_storage_settings: [
//       "vision",
//       "ir"
//     ],
//     video_storage_settings: [
//       "vision"
//     ]
//   }
// ])

// 无人机信息
let deviceInfo = ref()

// camera_mode {"0":"拍照","1":"录像","2":"智能低光","3":"全景拍照","-1":"不支持的模式"}
const cameraMode = [
  { label: '拍照', value: 0 },
  { label: '录像', value: 1 },
  { label: '智能低光', value: 2 },
  { label: '全景拍照', value: 3 },
  // { label: '不支持的模式', value: -1 },
]

// 调色盘选项数据
const paletteOptions = [
@@ -78,6 +149,22 @@
  { label: '熔岩', value: 11 },
  { label: '热铁', value: 12 },
  { label: '彩虹2', value: 13 },
]
// 视频类型 ZOOM("zoom"), WIDE("wide"), THERMAL("thermal"), NORMAL("normal"), IR("ir");
const videoType = [
  { label: '变焦', value: 'zoom' },
  { label: '广角', value: 'wide' },
  // { label: '热红外', value: 'thermal' },
  // { label: '正常', value: 'normal' },
  { label: '红外', value: 'ir' },
]
// 拍照存储类型{current, wide, zoom, ir}，可多选
const photoStorageType = [
  { label: '当前', value: 'current' },
  { label: '广角', value: 'wide' },
  { label: '变焦', value: 'zoom' },
  { label: '可见光', value: 'vision' },
  { label: '红外', value: 'ir' },
]

const props = defineProps(['sn', 'deviceInfo'])
@@ -103,7 +190,7 @@
watch(
  () => Store.state.device.videoSurveillance,
  newObj => {
    console.log('视频类型监听中', newObj)
    // console.log('视频类型监听中', newObj)
    if (newObj && newObj.live_status && newObj.live_status.length) {
      let arr = newObj.live_status || []
      if (videoList.length == arr.length) {
@@ -112,8 +199,14 @@
      arr.forEach(element => {
        let video_id = element.video_id
        element.payIndex = video_id.split('/')[1].split('-')[1]
        if (props.deviceInfo.child_sn == video_id.split('/')[0]) {
          if (element.video_type == 'normal' || element.video_type == 'thermal') {
            videoValue.value = 'wide'
          } else {
            videoValue.value = element.video_type
          }
        }
      })
      // videoList.length = 0 // 清空数组
      videoList.push(...arr) // 添加新元素
    }
  },
@@ -135,7 +228,12 @@
      devices['dock'] = value.dockInfo[props.deviceInfo.device_sn]
      devices['gateway'] = value.gatewayInfo
      let cameraList = value.deviceInfo[props.deviceInfo.child_sn]?.cameras || []
      cameras = reactive([...cameraList])
      cameras = cameraList
      // console.log('设备osd.cameras信息变化', cameras)
      // 判断cameras列表长度是否为0，如果为0，则不执行后续操作
      if (cameras.length > 0) {
        cameraModeValue.value = cameras[0].camera_mode
      }
      deviceInfo = ref(value.deviceInfo[props.deviceInfo.child_sn])
      updateDeviceCmdInfoByOsd(cmdList.value, devices)
    }
@@ -145,9 +243,26 @@
    deep: true,
  }
)
onMounted(() => {
  getLiveStatuss()
});

async function getLiveStatuss() {
  let result = await getLiveStatus(props.sn)
  result.data.data.live_status.forEach(item => {
    if (props.deviceInfo.child_sn == item.video_id.split('/')[0]) {
      if (item.video_type == 'normal' || item.video_type == 'thermal') {
        videoValue.value = 'wide'
      } else {
        videoValue.value = item.video_type
      }
    }
  })
}


// 远程控制开关
async function onDeviceStatusChange (status) {
async function onDeviceStatusChange(status) {
  let result = false
  if (status) {
    result = await dockDebugOnOff(props.sn, true)
@@ -166,7 +281,7 @@

const { sendDockControlCmd, dockDebugOnOff } = useDockControl()

async function sendControlCmd (cmdItem, index) {
async function sendControlCmd(cmdItem, index) {
  const params = {
    sn: props.sn,
    cmd: cmdItem.cmdKey,
@@ -270,7 +385,7 @@
useConnectWebSocket(messageHandler, webSorketUrl)

// 添加 changs 方法
async function changs (value, item) {
async function changs(value, item) {
  const payload = {
    [item.payload_index]: {
      thermal_current_palette_style: value
@@ -278,8 +393,62 @@
  }
  console.log('payload', payload)
  let data = await setThermalCurrentPaletteStyle(props.sn, props.deviceInfo.workspace_id, payload)
  if (data.code === 0) {
    message.success('修改成功')
  if (data.data.code === 0) {
    ElMessage.success('修改成功');
  }
}
// 摄像头设置
async function cameraSettings(value, item) {
  const payload = {
    // 1581F6Q8D245U00G57GJ/81-0-0/normal-0
    video_id: props.deviceInfo.child_sn + '/' + item.payload_index + '/normal-0',
    video_type: value
  }
  let data = await setStreamsSwitch(payload)
  if (data.data.code === 0) {
    ElMessage.success('修改成功');
  }
}
// 相机模式设置
async function photoAndVideoCmdSettings(value, item) {
  // photo 0 video_start 1 video_stop
  item.camera_mode = value
  let data = await photoAndVideoCmd(props.deviceInfo.child_sn, value)
  if (data.data.code == 0) {
    ElMessage.success('修改成功');
  }
}
// 照片存储设置
async function photoStorageTypeChang(value, item) {
  // value 不能为空
  if (!value) {
    ElMessage.error('请选择存储方式');
    return;
  }
  const payload = {
    payload_index: item.payload_index,
    photo_storage_settings: value
  }
  item.photo_storage_settings = value
  let data = await setPhotoStorageSet(props.sn, payload)
  if (data.data.code == 0) {
    ElMessage.success('修改成功');
  }
}
// 视频存储设置
async function videoStorageTypeChang(value, item) {
  if (!value) {
    ElMessage.error('请选择存储方式');
    return;
  }
  const payload = {
    payload_index: item.payload_index,
    video_storage_settings: value
  }
  item.video_storage_settings = value
  let data = await setVideoStorageSet(props.sn, payload)
  if (data.data.code == 0) {
    ElMessage.success('修改成功');
  }
}
</script>