<template>
  <section>
    <b-tabs type="is-toggle" :destroy-on-hide="true" v-model="tab" expanded>
      <b-tab-item label="Manual" icon="lead-pencil" value="0">
        <div class="columns">
          <ManualIdPrestamo :prestamoIdPrestamo="prestamoIdPrestamo" />

          <ManualNumeroInventario
            :operador="operador"
            :updateIsLoading="updateIsLoading"
          />
        </div>
      </b-tab-item>

      <b-tab-item label="Scanner" icon="qrcode-scan" value="1">
        <Scanner :prestamoIdPrestamo="prestamoIdPrestamo" />
      </b-tab-item>
    </b-tabs>
  </section>
</template>

<script>
import axios from 'axios'
import ManualIdPrestamo from '@/components/operador/ManualIdPrestamo'
import ManualNumeroInventario from '@/components/operador/ManualNumeroInventario'
import ModalMultaIdPrestamo from './ModalMultaIdPrestamo'
import Scanner from '@/components/operador/Scanner'

export default {
  components: { ManualIdPrestamo, ManualNumeroInventario, Scanner },
  props: {
    operador: { type: Object, required: true },
    updateIsLoading: { type: Function, required: true },
  },
  data() {
    return { idPrestamo: '', updateVariable: () => {}, tab: '0' }
  },
  methods: {
    revisionMulta() {
      const modalProps = {
        operador: this.operador,
        idPrestamo: this.idPrestamo,
        regresar: this.regresar,
        updateIsLoading: this.updateIsLoading,
      }

      this.$buefy.modal.open({
        props: modalProps,
        parent: this,
        component: ModalMultaIdPrestamo,
        hasModalCard: true,
        customClass: 'custom-class custom-class-2',
        trapFocus: true,
      })
    },
    entregar() {
      const data = {
        id_operador: this.operador.id_operador,
        id_prestamo: this.idPrestamo,
      }

      this.updateIsLoading(true)
      if (this.tab === '1') this.tab = '0'
      axios
        .put(`${process.env.api}/prestamo/entregar`, data, this.operador.token)
        .then((res) => {
          const equipo = res.data.equipo

          this.updateVariable()
          this.imprimirMensaje(
            this.$buefy,
            `
              Entregar al usuario el equipo:<br>
              Carrito: ${equipo.carrito.carrito}<br>
              Equipo: ${equipo.equipo}<br>
              Tipo: ${equipo.carrito.tipoCarrito.tipo_carrito}<br>
              Número de Inventario: ${equipo.numero_inventario}<br>
              Número de Serie: ${equipo.numero_serie}<br>
            `
          )
          this.updateIsLoading(false)
        })
        .catch((err) => {
          this.updateIsLoading(false)
          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
        })
    },
    regresar(descripcion, id_institucion_infraccion) {
      const data = {
        id_operador: this.operador.id_operador,
        id_prestamo: this.idPrestamo,
      }

      if (descripcion) data.descripcion = descripcion
      if (id_institucion_infraccion)
        data.id_institucion_infraccion = id_institucion_infraccion
      this.updateIsLoading(true)
      if (this.tab === '1') this.tab = '0'
      axios
        .put(`${process.env.api}/prestamo/regresar`, data, this.operador.token)
        .then((res) => {
          this.updateVariable()
          this.updateIsLoading(false)
          this.imprimirMensaje(this.$buefy, res.data.message)
        })
        .catch((err) => {
          this.updateIsLoading(false)
          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
        })
    },
    prestamoIdPrestamo(idPrestamo, updateVariable = () => {}) {
      this.updateIsLoading(true)
      this.idPrestamo = idPrestamo
      this.updateVariable = updateVariable
      axios
        .get(
          `${process.env.api}/prestamo?id_prestamo=${this.idPrestamo}`,
          this.operador.token
        )
        .then((res) => {
          let data = res.data

          if (data.activo) {
            if (data.Equipo.Status.idStatus === 2)
              this.$alertsGenericos.imprimirWarning(
                this.$buefy,
                'Esta a punto de entregar el equipo de cómputo al usuario y dar inicio a un préstamo. ¿Esta segur@ de querer realizar esta acción?',
                this.entregar
              )
            else if (data.Equipo.Status.idStatus === 3)
              this.$alertsGenericos.imprimirWarning(
                this.$buefy,
                `
                  Esta apunto de recibir el equipo:<br>
                  Equipo: ${data.Equipo.equipo}<br>
                  Carrito: ${data.Equipo.Carrito.carrito}<br>
                  Tipo: ${data.Equipo.Carrito.TipoCarrito.tipoCarrito}<br>
                  Número de Inventario: ${data.Equipo.numeroInventario}<br>
                  Número de Serie: ${data.Equipo.numeroSerie}<br>
                  y dar por terminado el préstamo. ¿Esta segur@ de querer realizar esta acción?
                `,
                this.revisionMulta
              )
          } else
            this.$alertsGenericos.imprimirError(this.$buefy, {
              message: 'Este préstamo ya no se encuentra activo.',
            })
          this.updateIsLoading(false)
        })
        .catch((err) => {
          this.updateIsLoading(false)
          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
        })
    },
  },
}
</script>

<style></style>
