<template>
  <div>
    <!-- 物联数据-->
    <div class="basic-details" id="internet">
      <div class="basic-details-title">
        <span class="border-span">物联数据</span>
        <el-button type="primary" @click="updateInfo">更新</el-button>
      </div>
    </div>
    <div class="basic-details-name">{{ name }}</div>
    <!-- 挤压机 65 -->
    <!-- <InternetExtruder :info="info" v-if="parentClassId == '65'" /> -->
    <!-- 干燥箱 57 -->
    <!-- <InternetDryingBox :info="info" v-else-if="parentClassId == '57'" /> -->
    <!-- 其他设备 -->
    <!-- <InternetOther v-else :id="id"></InternetOther> -->
     <internetDetail ref="internetDetailRef" :info="info" :id="id"></internetDetail>
  </div>
</template>

<script>
  import InternetExtruder from './InternetExtruder/InternetExtruder';
  import InternetDryingBox from './InternetDryingBox/InternetDryingBox';
  import InternetOther from './InternetOther';
  import internetDetail from './components/internetDetail.vue';
  import { getDetail } from '@/api/ledgerAssets/equipment';
  export default {
    props: ['id', 'name'],
    components: { InternetExtruder, InternetDryingBox, InternetOther, internetDetail },

    data() {
      return {
        iotId: null,
        // 设备信息
        info: '',
        // 设备名称
        // name: '',
        // 父类id
        parentClassId: '65'
      };
    },
    created() {
      this.getInfo();
    },
    methods: {
      getInfo() {
        getDetail(
          this.id
        ).then((res) => {
          this.info = res;
          console.log(this.info);
          // this.parentClassId = this.setParentClassId(
          //   this.info.information.classificationUrlId
          // );
        });
      },
      // 获取父类id
      setParentClassId(val) {
        let data = JSON.parse(val);
        return data[1];
      },
      // 更新信息
      updateInfo() {
        this.$refs.internetDetailRef.getRealData();
      }
    }
  };
</script>
<style lang="scss" scoped>
  .basic-details {
    background: #fff;
    padding: 20px;
  }
  .basic-details-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .basic-details-name {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
    margin-left: 5px;
  }
  .wrapper {
    background: #fff;
    padding: 20px;
  }

  .no-data {
    background: #fff;
    line-height: 100px;
    font-size: 26px;
    text-align: center;
  }
</style>
