pcpuma_unam_operador/components/operador/Carrito.vue

<template>
  <section class="mb-5">
    <BuscarCarrito
      :operador="operador"
      :carrito="carrito"
      :updateIsLoading="updateIsLoading"
      :updateCarrito="updateCarrito"
    />

    <TablaEquipos
      :equipos="equipos"
      :page="page"
      :total="total"
      :obtenerEquipos="obtenerEquipos"
      :onPageChange="onPageChange"
      :isLoadingTable="isLoadingTable"
    />
  </section>
</template>

<script>
import axios from 'axios'
import BuscarCarrito from '@/components/buscar/BuscarCarrito'
import TablaEquipos from '@/components/tablas/TablaEquipos'

export default {
  components: { BuscarCarrito, TablaEquipos },
  data() {
    return {
      equipos: [],
      isLoadingTable: false,
      page: 1,
      total: 0,
      carrito: { modulo: {}, tipoCarrito: {} },
    }
  },
  props: {
    operador: { type: Object, required: true },
    updateIsLoading: { type: Function, required: true },
  },
  methods: {
    obtenerEquipos() {
      axios
        .get(
          `${process.env.api}/equipo/equipos?pagina=${this.page}&id_carrito=${this.carrito.id_carrito}`,
          this.$getToken.token()
        )
        .then((res) => {
          this.equipos = res.data[0]
          this.total = res.data[1]
          this.isLoadingTable = false
        })
        .catch((err) => {
          this.isLoadingTable = false
          this.$alertsGenericos.imprimirError(this.$buefy, err.response.data)
        })
    },
    onPageChange(page) {
      this.page = page
      this.obtenerEquipos()
    },
    updateCarrito(valorObject) {
      this.carrito = valorObject
    },
  },
  watch: {
    carrito() {
      this.obtenerEquipos()
    },
  },
}
</script>

<style></style>