<template>
  <div>
    <div v-if="budgetCategory">
      <budget-five-edit ref="talentBudgetA" :budgetList.sync="budgetList" :budgetType.sync="budgetType"></budget-five-edit>
    </div>
    <div v-else>
      <budget-three-edit ref="talentBudgetB" :budgetList.sync="budgetList" :budgetType.sync="budgetType"></budget-three-edit>
    </div>
  </div>
</template>

<script>
import budgetFiveEdit from '@/views/report/talent/components/budgetFiveEdit'
import budgetThreeEdit from '@/views/report/talent/components/budgetThreeEdit'

export default {
  name: "budgetEdit",
  props: {
    budgetList: {
      type: Array,
      default: () => {
        return [{ ...Budget }];
      },
    },
    budgetType: {
      type: Object,
      default: () => {
        return null
      }
    }
  },
  components: {
    budgetFiveEdit, budgetThreeEdit, 
  },
  data() {
    return {
      budgetCategory: null,
    }
  },
  created() {
    if (!this.budgetType) {
      if (this.budgetType.type === 'HTTalent') {
        this.budgetCategory = true
      } else {
        this.budgetCategory = false
      }
    }
  },
  methods: {
    getTotalFee() {
      if (this.budgetType.type === 'HTTalent') {
        return this.$refs.talentBudgetA ? this.$refs.talentBudgetA.getTotalFee() : 0
      } else {
        return this.$refs.talentBudgetB ? this.$refs.talentBudgetB.getTotalFee() : 0
      }
    }
  }
}
</script>