<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,
    },
    imprimirError: {
      type: Function,
      required: true,
    },
    imprimirMensaje: {
      type: Function,
      required: true,
    },
    updateIsLoadingPage: {
      type: Function,
      required: true,
    },
  },
  methods: {
    cancelar(motivo) {
      const data = {
        idOperador: this.operador.idOperador,
        idPrestamo: this.prestamo.idPrestamo,
        motivo,
      }

      console.log(data)
      this.updateIsLoadingPage(true)
      axios
        .put(
          `${process.env.api}/prestamo/cancelar_operador`,
          data,
          this.operador.token
        )
        .then((res) => {
          this.updateIsLoadingPage(false)
          this.imprimirMensaje(res.data.message)
        })
        .catch((err) => {
          this.updateIsLoadingPage(false)
          this.imprimirError(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>
