feat:对接机巢状态和直播功能以及ws

chenyao

2025-04-02 ec3c634630d4fc44c01bf4e5902c7f9fee67adab

 src/views/SignMachineNest/components/MachineRight/MachineStatus.vue

@@ -6,13 +6,13 @@
      <div class="info">
        <img src="@/assets/images/signMachineNest/machineRight/wrj.png" alt="">
        <div class="info-right">
          <div class="name">Matrice 30</div>
          <div class="name">{{ osdVisible?.callsign || '--' }}</div>
          <div class="wz">
            <span class="left">当前位置：</span>
            <span class="right">450.32；210.56</span>
            <span class="right">{{ detailInfo.longitude }},{{ detailInfo.latitude }}</span>
          </div>
          <div class="close-wb">
            <div class="close">舱内关机</div>
            <div class="close">{{ AircraftStatus ? AircraftStatus : '舱内关机' }}</div>
            <div class="wb">需要维保</div>
          </div>
        </div>
@@ -23,28 +23,31 @@
            <img src="@/assets/images/signMachineNest/machineRight/height.png" alt="">
            <span class="text">实时真高</span>
          </div>
          <div class="text-data">200<span class="text">米</span></div>
          <div class="text-data">{{ detailInfo.height || '--' }}<span class="text">米</span></div>
        </div>
        <div class="card">
          <div>
            <img src="@/assets/images/signMachineNest/machineRight/speed.png" alt="">
            <span class="text">飞行速度</span>
          </div>
          <div class="text-data">12<span class="text">米/秒</span></div>
          <div class="text-data">{{ detailInfo.horizontal_speed }}<span class="text">米/秒</span></div>
        </div>
        <div class="card">
          <div>
            <img src="@/assets/images/signMachineNest/machineRight/signal.png" alt="">
            <span class="text">信号强度</span>
          </div>
          <div class="text-data">强</div>
          <div class="text-data">{{ detailInfo.quality }}</div>
        </div>
        <div class="card">
          <div>
            <img src="@/assets/images/signMachineNest/machineRight/electricity.png" alt="">
            <span class="text">电池电量</span>
          </div>
          <div class="text-data">98<span class="text">%</span></div>
          <div v-if="drone_charge_state.capacity_percent != 0" class="text-data">
            {{ drone_charge_state.capacity_percent }}<span class="text">%</span>
          </div>
          <div v-else class="text-data">{{ detailInfo.capacity_percent }}<span class="text">%</span></div>
        </div>
        <div class="card">
          <div>
@@ -67,6 +70,179 @@

<script setup>
import CommonTitle from '@/components/CommonTitle.vue';
import { EDeviceTypeName } from '@/utils/staticData/enums.js';
import { EModeCode, EDockModeText, EModeText } from '@/utils/staticData/device';
import { getLnglatAltitude } from '@/utils/cesium/mapUtil.js';
import { useStore } from 'vuex';

const store = useStore();
let osdVisible = computed(() => store.state.home.osdVisible);
let str = '--';
let drone_charge_state = ref({
  capacity_percent: '--',
  state: 0
})
let AircraftStatus = ref(null);
let detailInfo = ref({
  longitude: '--',
  latitude: '--',
  home_distance: '--',
  quality: '--',
  horizontal_speed: '--',
  height: '--',
  remain_flight_time: '--',
  capacity_percent: '--',
});
let quality = ref(['弱', '较弱', '中等', '较强', '强']);
let deviceInfo = ref({
  gateway: {
    capacity_percent: str,
    transmission_signal_quality: str,
  },
  dock: {},
  device: {
    gear: -1,
    mode_code: EModeCode.Disconnected,
    height: str,
    home_distance: str,
    horizontal_speed: str,
    vertical_speed: str,
    wind_speed: str,
    wind_direction: str,
    elevation: str,
    position_state: {
      gps_number: str,
      is_fixed: 0,
      rtk_number: str,
    },
    battery: {
      capacity_percent: str,
      landing_power: str,
      remain_flight_time: 0,
      return_home_power: str,
    },
    latitude: 0,
    longitude: 0,
  },
});
let mode_code = ref('已断开连接');

// 监听实时信息
watch(store.state.home.wsMessage, (newValue) => {
    if (newValue || newValue.mode_code === 14) return
    if (Object.keys(newValue).length === 0) return
    detailInfo.value.longitudee = newValue?.longitude.toFixed(6) || '--';
      detailInfo.value.latitude = newValue?.latitude.toFixed(6) || '--';
    getLnglatAltitude(newValue?.longitude,newValue?.latitude).then((res) => {
      const height = newValue?.height - res?.height;
      //针对西安实时高度进行降低
      const wId = localStorage.getItem('bs_workspace_id');
      if (wId == 'f47ac10b-58cc-4372-a567-0e02b2c3d479') {
        detailInfo.value.height = reduceHeight(height);
      } else {
        detailInfo.value.height = height.toFixed(1) || '--';
      }

      detailInfo.value.quality = quality.value[newValue?.position_state.quality - 1] || '--';
      detailInfo.value.horizontal_speed = newValue?.horizontal_speed.toFixed(1) || '--';
      detailInfo.value.remain_flight_time = (newValue?.battery.remain_flight_time / 60).toFixed(0) || '--';
      detailInfo.value.capacity_percent = (newValue?.battery.capacity_percent).toFixed(0) || '--';
    });
  },
  { immediate: true, deep: true }
);
// 获取最新机场状态
watch(store.state.home.deviceState, (newValue) => {
    // if (data.currentSn !== osdVisible.gateway_sn) return;
    if (newValue.currentType === EDeviceTypeName.Dock && newValue.dockInfo[newValue.currentSn]) {
      // 机场状态
      mode_code.value = EDockModeText[newValue.dockInfo[newValue.currentSn]?.basic_osd?.mode_code];
      // this.$emit('updateModeCode', mode_code.value);
      // 舱内状态
      AircraftStatus.value =
        EModeText[newValue.deviceInfo[
            deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ??
            osdVisible.sn
          ]?.mode_code
        ];
      // 舱内关机时显示的电量
      let child_sn = newValue.dockInfo[newValue.currentSn].basic_osd.sub_device.device_sn;
      // 飞机在线时取飞机中的电量
      if(newValue.deviceInfo[child_sn]) {
        drone_charge_state.value = {
          capacity_percent: newValue.deviceInfo[child_sn].battery.capacity_percent,
          state: newValue.deviceInfo[child_sn].battery.landing_power
        }
      } else{
        // 遥控器这里拿不到值data.drone_charge_state_new == undefined 会一直报错
        if (newValue.drone_charge_state_new) {
          drone_charge_state.value = newValue.drone_charge_state_new;
        }
      }
      if (osdVisible.visible && osdVisible.is_dock && osdVisible.gateway_sn !== '') {
        deviceInfo.value.dock = newValue.dockInfo[osdVisible.gateway_sn];
        deviceInfo.value.device =
        newValue.deviceInfo[deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ??
            osdVisible.sn
          ];
        // 设备关机即不显示信息
        // 兼容遥控器 关闭无人机 mode_code返回的是14 不是undefined
        if (
          newValue.deviceInfo[
            deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ??
            osdVisible.sn
          ]?.mode_code == undefined || newValue.deviceInfo[
            deviceInfo.value.dock.basic_osd?.sub_device?.device_sn ??
            osdVisible.sn
          ]?.mode_code == 14
        ) {
          detailInfo.value = {
            longitude: '--',
            latitude: '--',
            home_distance: '--',
            quality: '--',
            horizontal_speed: '--',
            remain_flight_time: '--',
            height: '--',
            capacity_percent: '--',
          };
        }
      }
    }
  },
  { immediate: true, deep: true }
);

const reduceHeight = (height) => {
  if (!Number(height)) return '--';
  let theFinheight = 0;
  if (height < 120) {
    theFinheight = height;
  } else if (height > 220) {
    theFinheight = height - 110;
  } else if (height > 210) {
    theFinheight = height - 100;
  } else if (height > 200) {
    theFinheight = height - 90;
  } else if (height > 190) {
    theFinheight = height - 80;
  } else if (height > 180) {
    theFinheight = height - 70;
  } else if (height > 170) {
    theFinheight = height - 60;
  } else if (height > 160) {
    theFinheight = height - 50;
  } else if (height > 150) {
    theFinheight = height - 40;
  } else if (height > 140) {
    theFinheight = height - 30;
  } else if (height > 130) {
    theFinheight = height - 20;
  } else if (height > 120) {
    theFinheight = height - 10;
  }
  return theFinheight.toFixed(1);
};
</script>

<style lang="scss" scoped>