<template>
  <div class="column is-4">
    <h3 class="is-size-4 mb-4">Administrador</h3>

    <BotonDesactivar
      :admin="operador"
      :data="carrito"
      tipo="carrito"
      :cambiarStatus="cambiarStatus"
      :imprimirWarning="imprimirWarning"
    />

    <b-field
      label="Cambiar nombre del carrito"
      v-if="carrito.tipoCarrito.id_tipo_carrito"
    >
      <b-input
        icon="list-status"
        v-model="nuevoNombreCarrito"
        placeholder="Nuevo nombre del equipo"
        rounded
      />
    </b-field>

    <b-button
      class="my-5"
      type="is-link"
      v-show="carrito.id_carrito"
      @click="
        imprimirWarning(
          `¿Estas segur@ que deseas cambiar esta información?`,
          updateCarrito
        )
      "
      :disabled="mostrarBoton()"
      rounded
      expanded
    >
      Actualizar Información
    </b-button>
  </div>
</template>

<script>
import axios from 'axios'
import BotonDesactivar from '@/components/operador/BotonDesactivar'

export default {
  components: { BotonDesactivar },
  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 },
    buscar: { type: Function, required: true },
  },
  data() {
    return {
      isActivo: false,
      mostrarMotivo: false,

      nuevoNombreCarrito: '',
    }
  },
  methods: {
    mostrarBoton() {
      // if (
      //   this.idStatus != this.equipo.status.id_status ||
      //   (this.equipo.programa &&
      //     this.idPrograma != this.equipo.programa.id_programa) ||
      //   this.idCarrito != this.equipo.carrito.id_carrito
      // )
      //   return false
      // return true
    },
    cambiarStatus(dataSelect, status) {
      const data = { id_carrito: dataSelect.id_carrito, activo: status }
      this.updateIsLoading(true)

      axios
        .put(`${process.env.api}/carrito`, data)
        .then((res) => {
          this.buscar()
          this.updateIsLoading(false)
          this.imprimirMensaje(res.data.message)
        })
        .catch((err) => {
          this.updateIsLoading(false)
          this.imprimirError(err.response.data)
        })
    },
    updateCarrito() {
      const data = {
        id_carrito: this.carrito.id_carrito,
        carrito: this.nuevoNombreCarrito
          ? this.nuevoNombreCarrito
          : this.carrito.carrito,
      }
      this.updateIsLoading(true)
      axios
        .put(`${process.env.api}/carrito`, data, this.operador.token)
        .then((res) => {
          this.buscar()
          this.updateIsLoading(false)
          this.imprimirMensaje(res.data.message)
        })
        .catch((err) => {
          this.updateIsLoading(false)
          this.imprimirError(err.response.data)
        })
    },
  },
  watch: {
    carrito() {
      //   this.obtenerCatalogoCarritos()
      //   this.idStatus = this.equipo.status.id_status
      //   this.idCarrito = this.equipo.carrito.id_carrito
      //   if (this.equipo.programa)
      //     this.idPrograma = this.equipo.programa.id_programa
      console.log(this.carrito)
    },
  },
  created() {
    // if (this.operador.tipoUsuario.id_tipo_usuario === 3) {
    //   this.obtenerCatalogoStatus()
    //   this.idStatus = this.equipo.status.id_status
    // }
  },
}
</script>

<style></style>
