<template>
  <app-tabs ref="appTab" :tab-list="tabList" class="flex-col fullheight" @tabClick="changeTab">
    <template #tabPane="{ item }">
      <component v-if="activeName === item.name" :is="item.name" :ref="item.name" />
    </template>
  </app-tabs>
</template>

<script>
// import odsTask from './odsTask.vue';

import javaTask from './javaTask.vue';

import kettleTask from './kettleTask.vue';

import shellTask from './shellTask.vue';

import ETLTask from './ETLTask.vue';

export default {
  components: { javaTask, kettleTask, shellTask, ETLTask },
  data() {
    return {
      activeName: 'javaTask',
      tabList: [
        { label: 'java程序采集', name: 'javaTask' },
        // { label: 'ods配置采集', name: 'odsTask' },
        { label: 'kettle配置采集', name: 'kettleTask' },
        { label: 'shell配置采集', name: 'shellTask' },
        { label: 'ETL配置采集', name: 'ETLTask' },
      ],
    };
  },
  computed: {
    currentConfig() {
      return '';
    },
  },
  mounted() {},
  methods: {
    changeTab(tab) {
      this.activeName = tab.paneName;
    },
  },
};
</script>

<style lang="scss" scoped>
.com {
  transition: opacity 0.3s;
}

.leave {
  opacity: 0;
}
</style>
