<template>
  <div>
    <el-tabs v-model="activeTab" @tab-click="handleClick">
      <el-tab-pane label="全部" name="/dictionary/newDictionary/list">
        <dictList v-if="activeTab == '/dictionary/newDictionary/list'" />
      </el-tab-pane>
      <el-tab-pane label="下拉框字典" name="/dictionary/newDictionary/select">
        <dictSelect v-if="activeTab == '/dictionary/newDictionary/select'" />
      </el-tab-pane>
      <el-tab-pane label="枚举字典" name="/dictionary/newDictionary/enum">
        <dictEnum v-if="activeTab == '/dictionary/newDictionary/enum'" />
      </el-tab-pane>
      <el-tab-pane label="布尔字典" name="/dictionary/newDictionary/bool">
        <dictBool v-if="activeTab == '/dictionary/newDictionary/bool'" />
      </el-tab-pane>
      <el-tab-pane label="字典类型配置" name="/dictionary/newDictionary/config">
        <dictConfig v-if="activeTab == '/dictionary/newDictionary/config'" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import dictList from './list/index'
import dictSelect from './select/index'
import dictEnum from './enum/index'
import dictBool from './bool/index'
import dictConfig from './setting/index'
export default {
  components: {
    dictList, dictSelect, dictEnum, dictBool, dictConfig
  },
  data() {
    return {
      activeTab: '/dictionary/newDictionary/list'
    }
  },
  created() {
  },
  methods: {
    handleClick(tab) {
    }
  }
}
</script>

<style lang="scss">
  .trial-detail{
    height: 100%;
    // box-sizing: border-box;
    // overflow-y: auto;
    .el-tabs{
      height: 100%;
      display: flex;
      flex-direction: column;
      .el-tabs__header {
        margin: 0;
        height: 40px;
      }
      .el-tabs__content{
        flex: 1;
        .el-tab-pane{
          height: 100%;
          overflow-y: auto;
          box-sizing: border-box;
        }
      }
    }
  }
</style>
