<template>
  <td class="text-center">
    <button v-if="currentRoundReleasableStatus[loopIndex - 1] == RELEASED" disabled type="button"
      @click="releaseFromVesting(currentFirstScheduleIndex + loopIndex - 1)" class="btn btn-meta-1">
      <span class="badge bg-secondary">{{ $t(i18nConst.vestingWithdrawn) }}</span>
    </button>
    <button v-else-if="currentRoundReleasableStatus[loopIndex - 1] == NOT_RELEASABLE" disabled type="button"
      @click="releaseFromVesting(currentFirstScheduleIndex + loopIndex - 1)" class="btn btn-meta-1">
      <span class="badge bg-danger">{{ $t(i18nConst.vestingLockedcaps) }}</span>
    </button>
    <button v-else-if="currentRoundReleasableStatus[loopIndex - 1] == RELEASABLE" type="button"
      @click="releaseFromVesting(currentFirstScheduleIndex + loopIndex - 1)" class="btn btn-meta-1">
      <span>{{ $t(i18nConst.vestingWithdraw) }}</span>
    </button>
    <button v-else-if="currentRoundReleasableStatus[loopIndex - 1] == PENDING_RELEASE" disabled type="button"
      @click="releaseFromVesting(currentFirstScheduleIndex + loopIndex - 1)" class="btn btn-meta-1">
      <span class="badge bg-secondary">WITHDRAWING...</span>
    </button>
  </td>
</template>
<script>
import { mapGetters } from "vuex";
import typeActions from "../../../store/typeActions";
import constantes from "@/constantes/constantes.js";
import i18nConstantes from "@/constantes/i18n.constantes.js";

export default {
  data() {
    return {
      i18nConst: i18nConstantes,
      constantes: constantes,
      RELEASED: 0,
      NOT_RELEASABLE: 1,
      RELEASABLE: 2,
      PENDING_RELEASE: 3,
    }
  },
  props: {
    currentFirstScheduleIndex: Number,
    loopIndex: Number,
    roundMultiple: Number,
  },
  computed: {
    ...mapGetters("vesting", [
      "vestingSchedulesCount",
      "vestingSchedulesInfo",
    ]),
    currentRoundReleasableStatus() {
      const releasable = [];
      for (let i = 0; i < this.roundMultiple; i++) {
        if (new Date(parseInt(this.vestingSchedulesInfo[this.currentFirstScheduleIndex + i].cliff) * 1000) < Date.now()) {
          releasable[i] = this.RELEASABLE;
        }else{
          releasable[i] = this.NOT_RELEASABLE;
          continue;
        }

        if (!this.vestingSchedulesInfo[this.currentFirstScheduleIndex + i].revoked) {
          releasable[i] = this.NOT_RELEASABLE;
        }

        if (parseInt(this.vestingSchedulesInfo[this.currentFirstScheduleIndex + i].released) > 0) {
          releasable[i] = this.RELEASED;
        } else {
          releasable[i] = this.RELEASABLE;
        }
      }
      return releasable;
    },
  },
  methods: {
    async releaseFromVesting(index) {
      await this.$store.dispatch(typeActions.releaseFromScheduleByIndex, index);
      await this.$store.dispatch(typeActions.getAllVestingSchedules, { count: this.vestingSchedulesCount });
    }
  }
}
</script>