<template>
  <div class="iotTab" style="height: 500px;">
    <iot-tab @change="changeTab">
      <iot-tab-item label="控制" name="something">
        这里是控制的
      </iot-tab-item>
      <iot-tab-item label="指令" name="otherthing">
        这里是指令的
      </iot-tab-item>
    </iot-tab>
  </div>
</template>

<script lang="ts">
import Vue from 'vue'
import { IotTab, IotTabItem, Icon, PushBar } from '../../tunas'

export default Vue.extend({
  components: {
    IotTab,
    IotTabItem,
    Icon,
    PushBar
  },
  data() {
    return {
      tabIndex: 0,
      list: [{
        title: '标题文案',
        text: '最普通的列表',
        desc: '98%',
        type: ''
      }, {
        text: '这里有一个小箭头',
        desc: '97%',
        type: 'arrow'
      }],
      list2: [{
        check: true,
        text: '开关',
        type: 'switch',
        clickBack: (val) => {
          val.check = !val.check
        }
      }]
    }
  },
  methods: {
    // 点击
    handClick(val) {
      console.log(val, '点击返回数据')
    },

    // 切换tag
    changeTab(val, key) {
      console.log(val, key, '**')
    }
  }
})
</script>

<style lang="stylus" scoped>

</style>
