<template>
    <div class="container is-max-widescreen is-max-desktop animate__animated" :class="animation" v-show="!init">
        <pedidos-admin-dropdown-descargar v-show="hayPedidos" 
            :gdc="gdc">
        </pedidos-admin-dropdown-descargar>
        <pedidos-admin-tabla-pedidos v-show="hayPedidos"
            :pedidos="pedidos">
        </pedidos-admin-tabla-pedidos>
        <p class="has-text-centered" v-show="!hayPedidos">
            Todavía no hay ningún pedido para administrar.
        </p>
    </div>
</template>

<script>
import PedidosAdminDropdownDescargar from "./PedidosAdminDropdownDescargar.vue";
import PedidosAdminTablaPedidos from "./PedidosAdminTablaPedidos.vue";
export default {
    name: "PedidosAdminBody",
    components: {
        PedidosAdminDropdownDescargar,
        PedidosAdminTablaPedidos
    },
    data() {
        return {
            gdc: 0,
            pedidos: []
        }
    },
    computed: {
        hayPedidos: function() {
            return this.pedidos.length !== 0
        },
        hayAprobados: function() {
            return this.pedidos.filter(p => p.aprobado).length > 0
        }
    },
    beforeCreate() {
        axios.get("/admin/obtener_sesion").then(response => {
            this.gdc = response.data.gdc;
            this.fetchPedidos();
        });
    },
    methods: {
        fetchPedidos() {
            axios.get("/api/subpedidos/resources", {
                    params: {
                        grupo_de_compra: this.gdc
                    }})
                 .then(response => {
                    this.pedidos = response.data.data
                });
        },
        totalAprobados() {
            let suma = 0;
            let aprobados = this.pedidos.filter(p => p.aprobado);
            for (let i = 0; i < aprobados.length; i++) {
                suma += parseFloat(aprobados[i].total.replace(/,/g, ''));
            }
            return suma;
        }
    },
    mounted() {
        Event.$on('sync-aprobacion', (_) => {
            this.fetchPedidos();
        })
    }
}
</script>

<style>

</style>
