<template>
  <a-card :bordered="false">
    <a-tabs v-model:activeKey="activeKey" @change="change">
      <a-tab-pane key="1" tab="原物料管理" force-render>
        <tbl-material-list></tbl-material-list>
      </a-tab-pane>
      <a-tab-pane key="2" tab="半成品管理">
        <template v-if="TblSemiFinishedListFlag">
          <tbl-semi-finished-list></tbl-semi-finished-list>
        </template>
      </a-tab-pane>
      <a-tab-pane key="3" tab="成品管理">
        <template v-if="TblMaterialListFlag">
          <finish-product-manage-list></finish-product-manage-list>
        </template>
      </a-tab-pane>
      <a-tab-pane key="4" tab="耗材管理">
        <template v-if="TblConsumablesListFlag">
          <tbl-consumables-list></tbl-consumables-list>
        </template>
      </a-tab-pane>
      <a-tab-pane key="5" tab="劳保管理">
        <template v-if="TblProtectionListFlag">
          <tbl-protection-list></tbl-protection-list>
        </template>
      </a-tab-pane>
    </a-tabs>
  </a-card>
</template>

<script>
import FinishProductManageList from './FinishProductManageList'
import TblMaterialList from './TblMaterialList'
import TblSemiFinishedList from './TblSemiFinishedList'
import TblConsumablesList from './TblConsumablesList.vue'
import TblProtectionList from './TblProtectionList.vue'
export default {
  components: {
    FinishProductManageList,
    TblMaterialList,
    TblSemiFinishedList,
    TblConsumablesList,
    TblProtectionList
  },
  data() {
    return {
      activeKey: "1",
      TblMaterialListFlag: false,
      TblSemiFinishedListFlag: false,
      TblConsumablesListFlag: false,
      TblProtectionListFlag: false
    }
  },
  methods: {
    change(e) {
      switch (e) {
        case "1":
          break;
        case "2":
          this.TblSemiFinishedListFlag = true;
          break;
        case "3":
          this.TblMaterialListFlag = true;
          break;
        case "4":
          this.TblConsumablesListFlag = true;
        case "5":
          this.TblProtectionListFlag = true;
        default:
          break;
      }
    },
  }
}
</script>