<template>

  <div>
<!--    <el-button @click="dialogVisible = true">-->
<!--      显示-->
<!--    </el-button>-->
<!--    <div class="table-box">-->
<!--      <span>生成的表达式为：{{ extractionPeriod }}</span>-->
<!--    </div>-->

      <div slot="title" style="font-size:16px;color:#666666;"></div>
        <el-tabs tab-position="left" style="height: 310px;overflow-y: scroll;">
          <el-tab-pane label="快捷生成">
            <quick-cron  v-model = extractionPeriod></quick-cron>
          </el-tab-pane>
          <el-tab-pane label="自定义生成">
            <cron v-model = extractionPeriod></cron>
          </el-tab-pane>
        </el-tabs>
<!--      <el-tabs tab-position="left" style="height: 310px; overflow-y: scroll">-->
<!--        <el-tab-pane label="快捷生成" name="first">-->
<!--          666-->
<!--              <quick-cron  v-model = cronExpression></quick-cron>-->
<!--&lt;!&ndash;          <CronDefault ref="CronDefault" v-if="activeName === 'first'"></CronDefault>&ndash;&gt;-->
<!--        </el-tab-pane>-->
<!--        <el-tab-pane label="自定义生成" name="second">-->
<!--          <cron v-model = cronExpression></cron>-->
<!--&lt;!&ndash;          <CronExc ref="CronExc" v-if="activeName === 'second'"></CronExc>&ndash;&gt;-->
<!--        </el-tab-pane>-->
<!--      </el-tabs>-->
  </div>
</template>
<script>
import Cron from '../quartz/cron/cron'
import QuickCron from '../quartz/quickCron/quickCron'
export default {
  watch: {
    extractionPeriod () {
      this.$emit('update:extractionPeriod', this.extractionPeriod)
    }
  },
  components: { QuickCron, Cron },
  data () {
    return {
      dialogVisible: false,
      extractionPeriod: '',
      dataInfo: {
        datasetName: '', // 数据集名称
        extractionPeriod: '', // 抽取周期
        extractioNumber: ''// 抽取次数
      }
    }
  }

}
</script>
<style lang="css">
.cron-box-dialog-first {
  width: 700px;
}
.cron-box-dialog-first .el-dialog__header {
  padding: 10px;
  text-align: center;
}
.cron-box-dialog-first .el-dialog__header .el-dialog__headerbtn {
  top: 12px;
  right: 8px;
}
.cron-box-dialog-first .el-dialog__body {
  padding: 0 10px;
}
.cron-box-dialog-first .el-dialog__footer {
  padding: 10px;
  text-align: center;
}
</style>
