<template>
  <div class="app-container">
    <p class="warn-content">
      无线智能设备信息表
    </p>
    <el-table
      v-loading="listLoading"
      :data="deviceList"
      style="width: 100%">
      <el-table-column
        prop="device_id"
        label="设备ID"
        min-width="180">
      </el-table-column>
      <el-table-column
        prop="device_name"
        label="设备名称"
        min-width="100">
      </el-table-column>
      <el-table-column
        prop="chip_type"
        label="芯片类型"
        min-width="100">
      </el-table-column>
      <el-table-column
        prop="chip_id"
        label="芯片ID"
        min-width="180">
      </el-table-column>
      <el-table-column
        prop="last_connect"
        label="上次连接时间"
        min-width="180">
      </el-table-column>
      <el-table-column
        prop="last_offline_time"
        label="上次离线时间"
        min-width="180">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { fetchDeviceList } from '@/api/counter'
export default {
  name: 'device',
  data() {
    return {
      deviceList: [],
      listLoading: true
    }
  },
  methods: {
    getDevices() {
      fetchDeviceList().then(response => {
        this.deviceList = response.data.results
        console.log(this.deviceList)
        this.listLoading = false
      })
    }
  },
  created() {
    this.getDevices()
  },
  deactivated() {
    this.$destroy(true)
  }
}
</script>

<style lang="scss">

</style>
