<template>
  <b-field>
    <b-button type="is-danger" @click="prompt()"> Cancelar </b-button>
  </b-field>
</template>

<script>
import axios from 'axios'

export default {
  props: {
    operador: {
      type: Object,
      required: true,
    },
    prestamo: {
      type: Object,
      required: true,
    },
    updateIsLoadingPage: {
      type: Function,
      required: true,
    },
  },
  methods: {
    cancelar(motivo) {
      const data = {
        id_operador: this.operador.id_operador,
        id_prestamo: this.prestamo.id_prestamo,
        motivo,
      }

      this.updateIsLoadingPage(true)
      axios
        .put(
          `${process.env.api}/prestamo/cancelar-operador`,
          data,
          this.$getToken.token()
        )
        .then((res) => {
          this.updateIsLoadingPage(false)
          this.$alertsGenericos.imprimirMensaje(this.$buefy, res.data.message)
        })
        .catch((err) => {
          this.updateIsLoadingPage(false)
          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
        })
    },
    prompt() {
      this.$buefy.dialog.prompt({
        type: 'is-warning',
        title: '¡Espera un minuto!',
        message: `¿Estas segur@ que deseas cancelar este préstamo?`,
        inputAttrs: {
          type: 'text',
          placeholder: 'Motivo de cancelación',
          min: 1,
          max: 500,
        },
        trapFocus: true,
        hasIcon: true,
        iconPack: 'mdi',
        icon: 'help-circle',
        cancelText: 'Cancelar',
        onConfirm: (value) => this.cancelar(value),
      })
    },
  },
}
</script>

<style></style>
