<template>
  <div>
    <el-card class="no-bottom">
      <el-form :model="form" inline>
        <el-form-item label="设备类型:">
          <el-select v-model="form.a" placeholder="请选择">
            <el-option label="类型一" :value="null" />
            <el-option label="类型二" :value="1" />
          </el-select>
        </el-form-item>
        <el-form-item label="设备实例:">
          <el-select v-model="form.a" placeholder="请选择">
            <el-option label="实例一" :value="null" />
            <el-option label="实例二" :value="1" />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary">查询</el-button>
        </el-form-item>
      </el-form>
    </el-card>
    <el-card class="margin-top-20">
      <div slot="header" class="clearfix">
        <span>类型信息</span>
      </div>
      <descriptions
        label-position="right"
        label-width="140px"
      >
        <descriptions-item label="设备类型" value="机床" />
        <descriptions-item label="数据模型" value="模型一，模型二" />
      </descriptions>
    </el-card>
    <el-card class="margin-top-20">
      <div slot="header" class="clearfix">
        <span>设备信息</span>
        <el-button style="float: right; padding: 3px 0" type="text">2020-08-12 12:22:21</el-button>
      </div>
      <descriptions
        label-position="right"
        label-width="140px"
      >
        <descriptions-item label="型号" value="AKB48" />
        <descriptions-item label="健康状态" value="健康" />
        <descriptions-item label="运行状态" value="运行中" />
        <descriptions-item label="上次启动时间" value="2020-08-12 12:22:21" />
        <descriptions-item label="运行时长" value="1d 27h 13m 21s" />
        <descriptions-item label="描述" value="非常贵的设备" />
      </descriptions>
    </el-card>
    <el-card class="margin-top-20">
      <el-tabs v-model="secondActiveName">
        <el-tab-pane label="模型一" name="first">
          <descriptions
            label-position="right"
            label-width="140px"
          >
            <descriptions-item label="温度" value="20 摄氏度" />
            <descriptions-item label="湿度" value="70%" />
            <descriptions-item label="压力" value="2500 帕斯卡" />
            <descriptions-item label="转子转速" value="1250 rpm/m" />
          </descriptions>
        </el-tab-pane>
        <el-tab-pane label="模型二" name="second">
          <descriptions
            label-position="right"
            label-width="140px"
          >
            <descriptions-item label="温度" value="20 摄氏度" />
            <descriptions-item label="湿度" value="70%" />
            <descriptions-item label="压力" value="2500 帕斯卡" />
            <descriptions-item label="转子转速" value="1250 rpm/m" />
          </descriptions>
        </el-tab-pane>
      </el-tabs>
    </el-card>
  </div>
</template>

<script>
export default {
  name: 'DeviceMonitoring',
  data() {
    return {
      form: {
        a: null,
        c: [],
        refresh: 1
      },
      activeName: 'first',
      secondActiveName: 'first'
    }
  }
}
</script>

<style scoped>

</style>
