<template>
  <div class="box">
    <div class="columns is-align-items-flex-end">
      <b-field class="column is-4 mb-0" label="Nombre del Carrito">
        <b-input
          type="text"
          placeholder="Nombre del carrito"
          icon="laptop"
          v-model="idCarrito"
          @keyup.enter.native="buscar()"
          rounded
        />
      </b-field>

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

    <div class="columns">
      <InfoCarrito :carrito="carrito" />
    </div>
  </div>
</template>

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

export default {
  components: { AdminEquipo, InfoCarrito },
  data() {
    return {
      idCarrito: '',
    }
  },
  props: {
    operador: { type: Object, required: true },
    carrito: { type: Object, required: true },
    imprimirError: { type: Function, required: true },
    imprimirWarning: { type: Function, required: true },
    imprimirMensaje: { type: Function, required: true },
    updateIsLoading: { type: Function, required: true },
    updateCarrito: { type: Function, required: true },
  },
  methods: {
    buscar() {
      if (this.idCarrito || this.carrito.id_carrito) {
        this.updateIsLoading(true)
        axios
          .get(
            `${process.env.api}/carrito/carrito?id_carrito=${
              this.idCarrito || this.carrito.id_carrito
            }`
          )
          .then((res) => {
            this.idCarrito = ''
            this.updateCarrito(res.data)
            this.updateIsLoading(false)
          })
          .catch((err) => {
            this.updateIsLoading(false)
            this.imprimirError(err.response.data)
          })
        localStorage.removeItem('carrito')
      }
    },
  },
  created() {
    this.idCarrito = this.$route.params.carrito
    if (this.idCarrito) this.buscar()
  },
}
</script>

<style></style>
