<template>
  <v-card>
    <v-tabs
      v-model="tab"
    >
      <v-tabs-slider color="primary" />
      <v-tab href="#tab-project" class="text-capitalize">
        Project
      </v-tab>
      <v-tab href="#tab-auto-labeling" class="text-capitalize">
        Auto Labeling
      </v-tab>
    </v-tabs>
    <v-divider />

    <v-tabs-items v-model="tab">
      <v-tab-item value="tab-project">
        <project-config />
      </v-tab-item>
      <v-tab-item value="tab-auto-labeling">
        <config-list />
      </v-tab-item>
    </v-tabs-items>
  </v-card>
</template>

<script>
import ProjectConfig from '@/components/containers/projects/ProjectConfig'
import ConfigList from '@/components/containers/settings/ConfigList'

export default {
  layout: 'project',

  components: {
    ProjectConfig,
    ConfigList
  },

  data() {
    return {
      tab: null
    }
  },

  validate({ params }) {
    return /^\d+$/.test(params.id)
  }
}
</script>
