<template>
  <div class="pack-box">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="生成批次" name="first">
        <generate-batch />
      </el-tab-pane>
      <el-tab-pane label="批次列表" name="second">
        <batch-list ref="list" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script lang="ts">
import { Component, Prop, Vue, Watch } from "vue-property-decorator";
import GenerateBatch from "./compoments/generateBatch.vue";
import BatchList from "./compoments/batchList.vue";
@Component({components:{GenerateBatch, BatchList}})
export default class PackBatchManage extends Vue {
  activeName:string='first'

  handleClick(v){
    if(v.name =='second') {
      (this.$refs.list as any).getList();
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
<style lang="scss">
.pack-box{
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 0 16px;
  .el-tabs{
    width: 100%;
    height: 100%;
  }
  .el-tabs__header{
    margin: 0 !important;
  }
  .el-tabs__content{
    height: calc(100% - 40px);
    padding-top: 8px;
    box-sizing: border-box;
    overflow: hidden;
    .el-tab-pane{
      width: 100%;
      height: 100%;
    }
  }
}
</style>