<template>
  <TablaCarritos
    :carritos="carritos"
    :isLoadingTable="isLoadingTable"
    :onPageChange="onPageChange"
    :page="page"
    :total="total"
    :operador="operador"
  />
</template>

<script>
import axios from 'axios'
import TablaCarritos from '@/components/tablas/TablaCarritos'

export default {
  components: { TablaCarritos },
  props: {
    modulo: { type: Object, required: true, default: () => ({}) },
    operador: { type: Object, required: true, default: () => ({}) },
  },
  data() {
    return {
      carritos: [],
      page: 1,
      total: 0,
      isLoadingTable: false,
    }
  },
  methods: {
    obtenerCarritos() {
      this.isLoadingTable = true
      return axios
        .get(
          `${process.env.api}/carrito/carritos?pagina=${this.page}&id_modulo=${this.modulo.id_modulo}`,
          this.$getToken.token()
        )
        .then(async (res) => {
          this.carritos = res.data[0]
          this.total = res.data[1]
          this.isLoadingTable = false
        })
        .catch((err) => {
          this.isLoadingTable = false
          this.$alertsGenericos.imprimirError(
            this.$buefy,
            this.$router,
            err.response.data
          )
        })
    },
    onPageChange(page) {
      this.page = page
      this.obtenerCarritos()
    },
  },
  created() {
    this.obtenerCarritos()
  },
}
</script>
