Agregado componente para tabla totales

This commit is contained in:
Alejandro Tasistro 2025-09-13 18:15:56 -03:00
parent f521c726ef
commit 45c8fc1af0
2 changed files with 72 additions and 49 deletions

View file

@ -18,71 +18,25 @@
/> />
</tbody> </tbody>
</table> </table>
<table class="table is-striped is-bordered"> <tabla-totales/>
<tr>
<th colspan="2" class="has-background-black has-text-white has-text-centered">TOTALES</th>
</tr>
<tr>
<th>Total a recaudar:</th>
<td class="has-text-right">$ {{ devoluciones_habilitadas ? total_a_recaudar : total_sin_devoluciones }}</td>
</tr>
<tr>
<th>Total bonos barriales:</th>
<td class="has-text-right">$ {{ total_barrial }}</td>
</tr>
<tr v-if="devoluciones_habilitadas">
<th>Total devoluciones:</th>
<td class="has-text-right">- $ {{ total_devoluciones }}</td>
</tr>
<tr>
<th>Cantidad bonos de transporte:</th>
<td class="has-text-right">{{ cantidad_transporte }}</td>
</tr>
<tr>
<th>Total bonos de transporte:</th>
<td class="has-text-right">$ {{ total_transporte }}</td>
</tr>
<tr>
<th>Total de pedido:</th>
<td class="has-text-right">$ {{ total_de_pedido }}</td>
</tr>
<tr>
<th>{{ texto_saldo }}</th>
<td class="has-text-right"> $ {{ saldo }}</td>
</tr>
<tr>
<th>Total a transferir:</th>
<td class="has-text-right">$ {{ total_a_transferir }}</td>
</tr>
</table>
</div> </div>
</template> </template>
<script> <script>
import FilaPedido from "./FilaPedido.vue"; import FilaPedido from "./FilaPedido.vue";
import { mapGetters, mapState } from "vuex"; import { mapGetters, mapState } from "vuex";
import TablaTotales from "./TablaTotales.vue";
export default { export default {
components: { components: {
TablaTotales,
FilaPedido FilaPedido
}, },
computed: { computed: {
...mapState('admin', [ ...mapState('admin', [
"devoluciones_habilitadas", "devoluciones_habilitadas",
"pedidos", "pedidos",
"total_a_recaudar",
"total_sin_devoluciones",
"total_barrial",
"total_devoluciones",
"cantidad_transporte",
"total_transporte",
"total_de_pedido",
"total_a_transferir",
"saldo",
]), ]),
...mapGetters('admin', ['pedidosAprobados']), ...mapGetters('admin', ['pedidosAprobados']),
texto_saldo() {
return this.saldo < 0 ? "Deuda:" : "Saldo a favor:";
}
}, },
} }
</script> </script>

View file

@ -0,0 +1,69 @@
<script>
import { mapGetters, mapState } from "vuex";
export default {
name: 'TablaTotales',
computed: {
...mapState('admin', [
"devoluciones_habilitadas",
"total_a_recaudar",
"total_sin_devoluciones",
"total_barrial",
"total_devoluciones",
"cantidad_transporte",
"total_transporte",
"total_de_pedido",
"total_a_transferir",
"saldo",
]),
...mapGetters('admin', ['pedidosAprobados']),
texto_saldo() {
return this.saldo < 0 ? "Deuda:" : "Saldo a favor:";
}
}
}
</script>
<template>
<table class="table is-striped is-bordered">
<tr>
<th colspan="2" class="has-background-black has-text-white has-text-centered">TOTALES</th>
</tr>
<tr>
<th>Total a recaudar:</th>
<td class="has-text-right">$ {{ devoluciones_habilitadas ? total_a_recaudar : total_sin_devoluciones }}</td>
</tr>
<tr>
<th>Total bonos barriales:</th>
<td class="has-text-right">$ {{ total_barrial }}</td>
</tr>
<tr v-if="devoluciones_habilitadas">
<th>Total devoluciones:</th>
<td class="has-text-right">- $ {{ total_devoluciones }}</td>
</tr>
<tr>
<th>Cantidad bonos de transporte:</th>
<td class="has-text-right">{{ cantidad_transporte }}</td>
</tr>
<tr>
<th>Total bonos de transporte:</th>
<td class="has-text-right">$ {{ total_transporte }}</td>
</tr>
<tr>
<th>Total de pedido:</th>
<td class="has-text-right">$ {{ total_de_pedido }}</td>
</tr>
<tr>
<th>{{ texto_saldo }}</th>
<td class="has-text-right"> $ {{ saldo }}</td>
</tr>
<tr>
<th>Total a transferir:</th>
<td class="has-text-right">$ {{ total_a_transferir }}</td>
</tr>
</table>
</template>
<style>
</style>