<template>
  <basic-container>
    <div class="app-container">
      <div class="query-box" ref="queryBox">
        <div class="btn-box">
          <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="总览" name="1"></el-tab-pane>
            <el-tab-pane label="设备信息" name="2"></el-tab-pane>
          </el-tabs>
        </div>
      </div>
      <!--总览-->
      <overview v-if="activeName == '1'" v-loading="loading" />
      <!--设备信息-->
      <device v-if="activeName == '2'" v-loading="loading" />
    </div>
  </basic-container>
</template>

<script>
import overview from '@/views/nh/components/overview.vue'
import device from '@/views/nh/components/device.vue'

export default {
  name: "StationDetail",
  components: { overview, device },
  data() {
    return {
      activeName: '1',
      loading: false
    };
  },
  created() {
    var power_station_detail_id = JSON.parse(localStorage.getItem('power_station_detail_id'));
    let power_station_detail_device = JSON.parse(localStorage.getItem('power_station_detail_device'));
    if(power_station_detail_device==2){
      this.activeName = 2;
      localStorage.removeItem("power_station_detail_device");
    }
    console.log(power_station_detail_id)
  },
  methods: {
    handleClick(e) {
      this.loading = true;
      setTimeout(() => {
        this.loading = false;
      }, 500);
    },
  }
}
</script>
