const template = html`
  <div class="text-right" v-if="canApprove">
    <div class="btn-group btn-group-sm">
      <span class="btn btn-success" @click="update('approved')">
        Approve
      </span>
      <span class="btn btn-danger" @click="update('declined')">
        Decline
      </span>
    </div>
  </div>
`;
import api from "../../api.js";
export default {
  props: ["id", "userId"],
  data: function() {
    return {};
  },
  computed: {
    canApprove() {
      return permission.hasPermission("access_hr");
    }
  },
  components: {},
  methods: {
    async update(status) {
      await api.put[`hr/holiday/${this.id}`]({}, { status });
      const holiday = await api.get["hr/holiday"]({ user_id: this.userId });
      state.set(`hr/holiday/${this.userId}`, holiday);
    }
  },
  template
};
