<template>
  <div class="mt-6">
    <h3 class="title">Reasignación de programas</h3>

    <p class="is-size-6 mb-4">
      A continuación inserte el usaurio que desea eliminiar, los programas que
      este usuario tenga seran asignados a este: {{ responsable.usuario }}
    </p>

    <b-field label="Usuario/Correo electrónico">
      <b-input
        type="email"
        placeholder="Usuario"
        v-model="correoOtroResponsable"
      />
    </b-field>

    <b-field class="pt-5">
      <b-button
        type="is-info"
        :disabled="mostrarBoton()"
        @click="
          imprimirWarning(
            `¿Seguro(a) que quiere eliminar a ${correoOtroResponsable} y pasar todos los programas a ${responsable.usuario}?`,
            reasignarProgramas
          )
        "
      >
        Reasignar
      </b-button>
    </b-field>
  </div>
</template>

<script>
import axios from 'axios'
import validator from 'validator'

export default {
  props: {
    admin: { type: Object, required: true },
    responsable: { type: Object, required: true },
    imprimirError: { type: Function, required: true },
    imprimirMensaje: { type: Function, required: true },
    imprimirWarning: { type: Function, required: true },
    updateIsLoading: { type: Function, required: true },
  },
  data() {
    return { correoOtroResponsable: '' }
  },
  methods: {
    mostrarBoton() {
      if (
        !this.correoOtroResponsable ||
        !validator.isEmail(this.correoOtroResponsable) ||
        this.responsable.usuario === this.correoOtroResponsable
      )
        return true
      return false
    },
    reasignarProgramas() {
      const data = {
        idUsuario: this.responsable.idUsuario,
        correoOtroResponsable: this.correoOtroResponsable,
      }

      this.updateIsLoading(true)
      axios
        .put(
          `${process.env.api}/programa/reasignar_programas`,
          data,
          this.admin.token
        )
        .then((res) => {
          this.updateIsLoading(false)
          this.imprimirMensaje(res.data.message)
          this.$router.push('/admin/responsables/responsable')
        })
        .catch((err) => {
          this.updateIsLoading(false)
          this.imprimirError(err.response.data)
        })
    },
  },
}
</script>

<style scoped></style>
