<script lang="ts" setup>
  import { computed } from 'vue';
  import COAPDescription from './COAPDescription.vue';
  import DefaultConfiguration from './DefaultConfiguration.vue';
  import LWM2MDescription from './LWM2MDescription.vue';
  import MQTTConfiguration from './MQTTConfiguration.vue';
  import SNMPDescription from './SNMPDescription.vue';
  import TCPDescription from './TCPDescription.vue';
  import { DeviceProfileDetail } from '/@/api/device/model/deviceConfigModel';
  import { TransportTypeEnum } from '/@/enums/deviceEnum';

  const props = defineProps<{
    record: DeviceProfileDetail;
  }>();

  const getTransportInfo = computed(() => {
    const { record } = props;
    return record.profileData.transportConfiguration;
  });
</script>

<template>
  <section>
    <DefaultConfiguration
      :record="getTransportInfo"
      v-if="
        getTransportInfo.type === TransportTypeEnum.DEFAULT ||
        getTransportInfo.type === TransportTypeEnum.GBT28181
      "
    />

    <MQTTConfiguration
      :record="getTransportInfo"
      v-if="getTransportInfo.type === TransportTypeEnum.MQTT"
    />

    <COAPDescription
      :record="getTransportInfo"
      v-if="getTransportInfo.type === TransportTypeEnum.COAP"
    />

    <LWM2MDescription
      :record="getTransportInfo"
      v-if="getTransportInfo.type === TransportTypeEnum.LWM2M"
    />

    <SNMPDescription
      :record="getTransportInfo"
      v-if="getTransportInfo.type === TransportTypeEnum.SNMP"
    />

    <TCPDescription
      :record="getTransportInfo"
      v-if="getTransportInfo.type === TransportTypeEnum.TCP"
    />
  </section>
</template>