Merge branch 'master' of http://139.196.74.78:10010/r/drone/drone-web-manage

rain

2025-04-18 9c873fee1a2d339319c3c4de68efdd7c3832cb68

 src/views/device/components/DockControlPanel.vue

@@ -8,14 +8,8 @@
    <div class="control-cmd-wrapper">
      <div class="control-cmd-header">
        远程调试
        <el-switch
          v-model="debugStatus"
          @change="onDeviceStatusChange"
          active-text="开"
          inactive-text="关"
          class="debug-btn"
          style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
        />
        <el-switch v-model="debugStatus" @change="onDeviceStatusChange" active-text="开" inactive-text="关"
          class="debug-btn" style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949" />
        <el-divider />
      </div>
      <div class="control-cmd-box">
@@ -25,15 +19,24 @@
            <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>无人机设置</el-divider>

      <!-- 设置 0:白热,1:黑热,2:描红,3:医疗,5:彩虹 1,6:铁红,8:北极,11:熔岩,12:热铁,13:彩虹 2 -->
      <div class="control-cmd-box">
        <div class="control-cmd-item">
          <div class="control-cmd-item-left">调色盘样式</div>
          <div class="control-cmd-item-right">
            <el-select @change="changs" 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>
        </div>
      </div>
@@ -42,137 +45,188 @@
</template>

<script setup>
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 } 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 Store from '@/store';
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 } from '@/api/device-setting'

const props = defineProps(['sn', 'deviceInfo']);
const initCmdList = baseCmdList.map(cmdItem => Object.assign({}, cmdItem));
const cmdList = ref(initCmdList);
import Store from '@/store'

const valueStyle = ref(0)

// 定义一个数据videoList
const videoList = reactive([])

// 调色盘选项数据
const paletteOptions = [
  { label: '白热', value: 0 },
  { label: '黑热', value: 1 },
  { label: '描红', value: 2 },
  { label: '医疗', value: 3 },
  { label: '彩虹1', value: 5 },
  { label: '铁红', value: 6 },
  { label: '北极', value: 8 },
  { label: '熔岩', value: 11 },
  { label: '热铁', value: 12 },
  { label: '彩虹2', value: 13 },
]

const props = defineProps(['sn', 'deviceInfo'])
const initCmdList = baseCmdList.map(cmdItem => Object.assign({}, cmdItem))
const cmdList = ref(initCmdList)
// dock 控制指令
const debugStatus = ref(props.deviceInfo.mode_code == EDockModeCode.Remote_Debugging);
const debugStatus = ref(props.deviceInfo.mode_code == EDockModeCode.Remote_Debugging)

// 根据机场指令执行状态更新信息
watch(
  () => Store.getters.devicesCmdExecuteInfo,
  devicesCmdExecuteInfo => {
    // console.log('设备指令执行状态变化', devicesCmdExecuteInfo)
    if (props.sn && devicesCmdExecuteInfo[props.sn]) {
      updateDeviceCmdInfoByExecuteInfo(cmdList.value, devicesCmdExecuteInfo[props.sn]);
      updateDeviceCmdInfoByExecuteInfo(cmdList.value, devicesCmdExecuteInfo[props.sn])
    }
  },
  {
    immediate: true,
    deep: true,
  }
);
)
watch(
  () => Store.state.device.videoSurveillance,
  newObj => {
    // console.log('视频类型监听中', newObj)
    // if (newObj && newObj.live_status && newObj.live_status.length) {
    //   let arr = newObj.live_status || []
    //   if (videoList.length == arr.length) {
    //     return
    //   }
    //   arr.forEach(element => {
    //      let video_id = element.video_id
    //     element.payIndex = video_id.split('/')[1].split('-')[1]
    //   })
    //   // videoList.length = 0 // 清空数组
    //   videoList.push(...arr) // 添加新元素
    // }
  },
  {
    immediate: true,
    deep: true,
  }
)

// 根据设备osd信息更新信息
watch(
  () => Store.getters.deviceState,
  value => {
    if (props.sn && (value.currentSn===props.deviceInfo.child_sn || value.currentSn===props.deviceInfo.device_sn)) {
    // console.log('设备状态变化', value)
    if (props.sn && (value.currentSn === props.deviceInfo.child_sn || value.currentSn === props.deviceInfo.device_sn)) {
      debugStatus.value = value.dockInfo[props.deviceInfo.device_sn]?.basic_osd?.mode_code === EDockModeCode.Remote_Debugging
      const devices = {}
      devices['device'] = value.deviceInfo[props.deviceInfo.child_sn]
      devices['dock'] = value.dockInfo[props.deviceInfo.device_sn]
      devices['gateway'] = value.gatewayInfo
      updateDeviceCmdInfoByOsd(cmdList.value, devices);
      updateDeviceCmdInfoByOsd(cmdList.value, devices)
    }
  },
  {
    immediate: true,
    deep: true,
  }
);
)

// 远程控制开关
async function onDeviceStatusChange(status) {
  let result = false;
async function onDeviceStatusChange (status) {
  let result = false
  if (status) {
    result = await dockDebugOnOff(props.sn, true);
    result = await dockDebugOnOff(props.sn, true)
  } else {
    result = await dockDebugOnOff(props.sn, false);
    result = await dockDebugOnOff(props.sn, false)
  }
  console.log(result, '---1------');

  if (!result) {
    if (status) {
      debugStatus.value = false;
      debugStatus.value = false
    } else {
      debugStatus.value = true;
      debugStatus.value = true
    }
  }
}

const { sendDockControlCmd, dockDebugOnOff } = useDockControl();
const { sendDockControlCmd, dockDebugOnOff } = useDockControl()

async function sendControlCmd(cmdItem, index) {
async function sendControlCmd (cmdItem, index) {
  const params = {
    sn: props.sn,
    cmd: cmdItem.cmdKey,
    action: cmdItem.action,
  };
  const success = await sendDockControlCmd(params, true);
  }
  const success = await sendDockControlCmd(params, true)
  if (success) {
    updateDeviceSingleCmdInfo(cmdList.value[index]);
    updateDeviceSingleCmdInfo(cmdList.value[index])
  }
}

// webSocket 监听
const messageHandler = async payload => {
  if (!payload) {
    return;
    return
  }
  switch (payload.biz_code) {
    case EBizCode.GatewayOsd: {
      Store.commit('SET_GATEWAY_INFO', payload.data);
      break;
      Store.commit('SET_GATEWAY_INFO', payload.data)
      break
    }
    // 飞行器
    case EBizCode.DeviceOsd: {
      Store.commit('SET_DEVICE_INFO', payload.data);
      break;
      Store.commit('SET_DEVICE_INFO', payload.data)
      break
    }
    // 机场
    case EBizCode.DockOsd: {
      Store.commit('SET_DOCK_INFO', payload.data);
      break;
      Store.commit('SET_DOCK_INFO', payload.data)
      break
    }
    case EBizCode.MapElementCreate: {
      Store.commit('SET_MAP_ELEMENT_CREATE', payload.data);
      break;
      Store.commit('SET_MAP_ELEMENT_CREATE', payload.data)
      break
    }
    case EBizCode.MapElementUpdate: {
      Store.commit('SET_MAP_ELEMENT_UPDATE', payload.data);
      break;
      Store.commit('SET_MAP_ELEMENT_UPDATE', payload.data)
      break
    }
    case EBizCode.MapElementDelete: {
      Store.commit('SET_MAP_ELEMENT_DELETE', payload.data);
      break;
      Store.commit('SET_MAP_ELEMENT_DELETE', payload.data)
      break
    }
    case EBizCode.DeviceOnline: {
      Store.commit('SET_DEVICE_ONLINE', payload.data);
      break;
      Store.commit('SET_DEVICE_ONLINE', payload.data)
      break
    }
    case EBizCode.DeviceOffline: {
      Store.commit('SET_DEVICE_OFFLINE', payload.data);
      break;
      Store.commit('SET_DEVICE_OFFLINE', payload.data)
      break
    }
    case EBizCode.FlightTaskProgress:
    case EBizCode.FlightTaskMediaProgress:
    case EBizCode.FlightTaskMediaHighestPriority: {
      EventBus.emit('flightTaskWs', payload);
      break;
      EventBus.emit('flightTaskWs', payload)
      break
    }
    case EBizCode.DeviceHms: {
      Store.commit('SET_DEVICE_HMS_INFO', payload.data);
      break;
      Store.commit('SET_DEVICE_HMS_INFO', payload.data)
      break
    }
    case EBizCode.VideoSurveillance: {
      if (payload.data.live_status && payload.data.live_status.length) {
        Store.commit('SAVE_VIDEO_SURVEILLANCE_INFO', payload.data)
      }
      break
    }
    case EBizCode.DeviceReboot:
    case EBizCode.DroneOpen:
@@ -189,25 +243,39 @@
        biz_code: payload.biz_code,
        timestamp: payload.timestamp,
        ...payload.data,
      });
      break;
      })
      break
    }
    case EBizCode.ControlSourceChange:
    case EBizCode.FlyToPointProgress:
    case EBizCode.TakeoffToPointProgress:
    case EBizCode.JoystickInvalidNotify:
    case EBizCode.DrcStatusNotify: {
      EventBus.emit('droneControlWs', payload);
      break;
      EventBus.emit('droneControlWs', payload)
      break
    }
    default:
      break;
      break
  }
};
}

const webSorketUrl = getWebsocketUrl() + '&workspace-id=' + props.deviceInfo.workspace_id;
const webSorketUrl = getWebsocketUrl() + '&workspace-id=' + props.deviceInfo.workspace_id
// 监听ws 消息
useConnectWebSocket(messageHandler, webSorketUrl);
useConnectWebSocket(messageHandler, webSorketUrl)

// 添加 changs 方法
async function changs (value) {
  const payload = {
    thermal_current_palette_style: value
  }
  console.log('payload1111111', payload)
  console.log('deviceInfo22222222', props.sn)
  console.log('deviceInfo22222222', props.deviceInfo.workspace_id)
  let data = await setThermalCurrentPaletteStyle(props.sn, props.deviceInfo.workspace_id, payload)
  if (data.code === 0) {
    message.success('修改成功')
  }
}
</script>

<style lang="scss" scoped>
@@ -236,6 +304,7 @@
      flex-wrap: wrap;
      justify-content: space-between;
      padding: 4px 15px;

      .control-cmd-item {
        width: 320px;
        height: 58px;
@@ -258,5 +327,30 @@
      }
    }
  }

  ::v-deep {
    .el-form {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      padding: 4px 15px;
    }

    .el-form-item {
      width: 320px;
      height: 58px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border: 1px solid #666;
      margin: 8px 0;
      padding: 0 8px;
      border-radius: 2px;
    }

    .el-select__wrapper {
      width: 160px;
    }
  }
}
</style>
</style>