无人机管理后台前端(已迁走)
张含笑
2025-09-01 2ca94de8ede18ac07ccfd8dec7b6f6a707adde9b
src/views/device/components/DockControlPanel.vue
@@ -3,7 +3,7 @@
    <!-- title -->
    <!-- setting -->
    <!-- <DeviceSettingBox :sn="props.sn" :deviceInfo="props.deviceInfo"></DeviceSettingBox> -->
    <DeviceSettingBox :sn="props.sn" :deviceInfo="props.deviceInfo"></DeviceSettingBox>
    <!-- cmd -->
    <div class="control-cmd-wrapper">
      <div class="control-cmd-header">
@@ -26,7 +26,7 @@
          </div>
        </div>
      </div>
      <el-divider v-if="deviceInfo">无人机设置</el-divider>
      <div class="control-cmd-box" v-for="(item, index) in cameras">
        <div>
@@ -54,7 +54,7 @@
          </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)"
            <el-select v-model="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>
@@ -62,7 +62,7 @@
          </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)"
            <el-select v-model="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>
@@ -77,22 +77,24 @@
<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'
import { getWebsocketUrl } from '@/websocket/util/config'
import { defineProps, ref, watch, reactive } from 'vue'
import { cmdList as baseCmdList } from '@/types/device-cmd'
import { useDockControl } from './use-dock-control'
import { EDockModeCode } from '@/types/device'
import { updateDeviceCmdInfoByOsd, updateDeviceCmdInfoByExecuteInfo } from '@/utils/device-cmd'
import { setThermalCurrentPaletteStyle, setPhotoStorageSet, setVideoStorageSet, getLiveStatus, setStreamsSwitch, photoAndVideoCmd } from '@/api/device-setting'
import DeviceSettingBox from './DeviceSettingBox.vue'
import Store from '@/store'
import { useConnectWebSocket } from '@/utils/websocket/connect-websocket';
import { getWebsocketUrl } from '@/utils/websocket/config';
import EventBus from '@/utils/eventBus';
const valueStyle = ref(0)
const cameraModeValue = ref(0)
const videoValue = ref("zoom")
const photo_storage_settings = ref([])
const video_storage_settings = ref([])
// 定义一个数据videoList
const videoList = reactive([])
@@ -233,6 +235,8 @@
      // 判断cameras列表长度是否为0,如果为0,则不执行后续操作
      if (cameras.length > 0) {
        cameraModeValue.value = cameras[0].camera_mode
        photo_storage_settings.value = cameras[0]?.photo_storage_settings ?? [];
        video_storage_settings.value = cameras[0]?.video_storage_settings ?? [];
      }
      deviceInfo = ref(value.deviceInfo[props.deviceInfo.child_sn])
      updateDeviceCmdInfoByOsd(cmdList.value, devices)
@@ -244,6 +248,9 @@
  }
)
onMounted(() => {
  const webSorketUrl = getWebsocketUrl() + '&workspace-id=' + props.deviceInfo.workspace_id
  // 监听ws 消息
  useConnectWebSocket(messageHandler, webSorketUrl)
  getLiveStatuss()
});
@@ -288,13 +295,11 @@
    action: cmdItem.action,
  }
  const success = await sendDockControlCmd(params, true)
  if (success) {
    updateDeviceSingleCmdInfo(cmdList.value[index])
  }
}
// webSocket 监听
const messageHandler = async payload => {
  payload = JSON.parse(payload)
  if (!payload) {
    return
  }
@@ -380,9 +385,6 @@
  }
}
const webSorketUrl = getWebsocketUrl() + '&workspace-id=' + props.deviceInfo.workspace_id
// 监听ws 消息
useConnectWebSocket(messageHandler, webSorketUrl)
// 添加 changs 方法
async function changs(value, item) {
@@ -528,4 +530,4 @@
    }
  }
}
</style>
</style>