pedi2/resources/js/components/SubpedidosGdc.vue

<template>
    <div class="container is-max-widescreen is-max-desktop animate__animated" :class="animation" v-show="!init">
        <div class="buttons is-right">
            <a class="button is-success" :href="'/admin/exportar-pedido-a-csv/'+gdc">
                <span>
                    Exportar pedido barrial
                </span>
                <span class="icon is-small">
                    <i class="fas fa-download"></i>
                </span>
            </a>
            <a class="button is-info" :href="'/admin/exportar-planillas-a-pdf/'+gdc">
                <span>
                    Imprimir Planillas
                </span>
                <span class="icon is-small">
                  <i class="fas fa-print"></i>
                </span>
            </a>
        </div>
        <table v-show="this.subpedidos.length !== 0" class="table is-fullwidth is-striped is-bordered">
            <thead>
                <tr>
                    <th>Núcleo</th>
                    <th><abbr title="Total a Pagar">Total $</abbr></th>
                    <th class="is-1"><abbr title="Aprobacion">Aprobación</abbr></th>
                </tr>
            </thead>
            <tfoot>
                <tr>
                    <th></th>
                    <th>Total de los aprobados</th>
                    <th>$ {{ totalAprobados() }}</th>
                </tr>
            </tfoot>
            <tbody>
                <subpedido-row v-for="subpedido in this.subpedidos"
                               :subpedido="subpedido" :key="subpedido.id">
                </subpedido-row>
            </tbody>
        </table>
        <p class="has-text-centered" v-show="this.subpedidos.length === 0">
            Todavía no hay ningún pedido para administrar.
        </p>
    </div>
</template>

<script>
import SubpedidoRow from "./SubpedidoRow";
export default {
    name: "SubpedidosGdc",
    components: {SubpedidoRow},
    data() {
        return {
            gdc: 0,
            subpedidos: []
        }
    },
    beforeCreate() {
        axios.get("/admin/obtener_sesion").then(response => {
            this.gdc = response.data.gdc;
            this.fetchSubpedidos();
        });
    },
    methods: {
        fetchSubpedidos() {
            axios.get("/api/subpedidos/resources", {
                params: {
                    grupo_de_compra: this.gdc
                }
            }).then(response => {
                this.subpedidos = response.data.data
            });
        },
        totalAprobados() {
            let suma = 0;
            let aprobados = this.subpedidos.filter(sp => sp.aprobado);
            for (let i = 0; i < aprobados.length; i++) {
                suma += parseFloat(aprobados[i].total.replace(/,/g, ''));
            }
            return suma;
        }
    },
    mounted() {
        Event.$on('sync-aprobacion', (_) => {
            this.fetchSubpedidos();
        })
    }
}
</script>

<style>

</style>