<template>
  <div class="box">
    <div class="columns is-align-items-flex-end">
      <b-field class="column is-4 mb-0" label="Número de Inventario">
        <b-input
          type="text"
          placeholder="Número de Inventario"
          icon="laptop"
          v-model="numeroInventario"
          @keyup.enter.native="buscar()"
          rounded
        />
      </b-field>

      <div class="column is-2">
        <b-button
          label="Buscar"
          type="is-success"
          :disabled="!numeroInventario"
          @click="buscar()"
          rounded
          expanded
        />
      </div>
    </div>

    <div class="columns">
      <InfoEquipo
        :equipo="equipo"
        :updateIsLoading="updateIsLoading"
        :buscar="buscar"
      />

      <AdminEquipo
        :operador="operador"
        :equipo="equipo"
        :updateIsLoading="updateIsLoading"
        :buscar="buscar"
      />
    </div>
  </div>
</template>

<script>
import axios from 'axios'
import AdminEquipo from '@/components/operador/AdminEquipo'
import InfoEquipo from '@/components/operador/InfoEquipo'

export default {
  components: { AdminEquipo, InfoEquipo },
  data() {
    return {
      numeroInventario: '',
    }
  },
  props: {
    operador: { type: Object, required: true },
    equipo: { type: Object, required: true },
    updateIsLoading: { type: Function, required: true },
    obtenerMotivos: { type: Function, required: true },
    updateEquipo: { type: Function, required: true },
  },
  methods: {
    buscar() {
      if (this.numeroInventario || this.equipo.id_equipo) {
        this.updateIsLoading(true)
        axios
          .get(
            `${process.env.api}/equipo/equipo?id_institucion=${
              this.operador.institucion.id_institucion
            }&numero_inventario=${
              this.numeroInventario || this.equipo.numero_inventario
            }`,
            this.$getToken.token()
          )
          .then((res) => {
            this.updateEquipo(res.data)
            this.updateIsLoading(false)
            // this.obtenerPrestamos()
            // this.obtenerReportes()
            this.obtenerMotivos()
            this.$router.push(
              `/operador/equipos/buscar_equipo/${this.numeroInventario}`
            )
          })
          .catch((err) => {
            this.updateIsLoading(false)
            this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
          })
        localStorage.removeItem('numeroInventario')
      }
    },
  },
  created() {
    this.numeroInventario = this.$route.params.equipo
    if (this.numeroInventario) this.buscar()
  },
}
</script>

<style></style>
