nathalie
/
pedi2
3
3
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity

Moví la chismosa a la derecha de los productos

This commit is contained in:
Rodrigo 2024-09-10 21:31:49 -03:00
parent 1204a80b3c
commit 69cd306263
5 changed files with 71 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
resources/js/app.js vendored
View File

@ -111,6 +111,7 @@ const app = new Vue({
}).then((response) => {
this.pedido = response.data.data
this.$toast('Pedido actualizado exitosamente')
Event.$emit("pedido-actualizado");
});
});
// Actualizar monto y notas de devoluciones

62
resources/js/components/Chismosa.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
<table v-show="productos.length != 0" class="chismosa-tabla table is-narrow is-striped is-bordered">
<div class="column">
<table v-show="mostrar_tabla" class="chismosa-tabla table is-narrow is-striped is-bordered">
<thead>
<tr>
<th>Producto</th>
@ -13,15 +13,15 @@
<tfoot>
<tr>
<th><abbr title="Bonos de Transporte">B. Transporte</abbr></th>
<th class="has-text-right">{{ cantidadBonosDeTransporte }}</th>
<th class="has-text-right">{{ totalBonosDeTransporte }}</th>
<th class="has-text-right">{{ cantidadBonosDeTransporte() }}</th>
<th class="has-text-right">{{ totalBonosDeTransporte() }}</th>
<th></th>
<th></th>
</tr>
<tr v-if="this.$root.devoluciones">
<th><p>Devoluciones</p></th>
<td><p :title="this.$root.pedido.devoluciones_notas">...</p></td>
<th class="has-text-right">-{{ this.$root.pedido.devoluciones_total }}</th>
<td><p :title="notasDevoluciones()">...</p></td>
<th class="has-text-right">-{{ devoluciones() }}</th>
<th>
<button @click.capture="modificarDevoluciones()" class="button is-warning">
<span class="icon">
@ -34,16 +34,16 @@
<tr>
<th>Total total</th>
<th></th>
<th class="has-text-right">{{ total }}</th>
<th class="has-text-right">{{ total() }}</th>
<th></th>
<th></th>
</tr>
</tfoot>
<tbody>
<producto-row v-for="producto in productos" :producto="producto" :key="producto.id"></producto-row>
<producto-row v-for="producto in productos()" :producto="producto" :key="producto.id"></producto-row>
</tbody>
</table>
<p class="has-text-centered" v-show="productos.length == 0">
<p class="has-text-centered" v-show="!mostrar_tabla">
Compa, todavía no agregaste nada a la chismosa.
</p>
</div>
@ -51,32 +51,40 @@
<script>
export default {
computed: {
data() {
return {
mostrar_tabla: false,
}
},
mounted() {
Event.$on('pedido-actualizado', this.pedidoActualizado);
Event.$on('toggle-chismosa', this.pedidoActualizado);
},
methods: {
pedidoActualizado: function() {
this.mostrar_tabla = this.$root.productos.length > 0;
},
total: function() {
return this.$limpiarInt(this.$root.devoluciones ? this.$root.pedido.total_menos_devoluciones : this.$root.pedido.total)
},
productos: function() {
return this.$root.productos
},
modificarDevoluciones: function() {
Event.$emit("modificar-devoluciones");
},
cantidadBonosDeTransporte: function() {
return this.$limpiarInt(this.$root.pedido.subtotal_bonos_de_transporte) / 15
},
totalBonosDeTransporte: function() {
return this.$limpiarInt(this.$root.pedido.subtotal_bonos_de_transporte)
},
total: function() {
return this.$limpiarInt(this.$root.devoluciones ? this.$root.pedido.total_menos_devoluciones : this.$root.pedido.total)
}
},
methods: {
modificarDevoluciones: function() {
Event.$emit("modificar-devoluciones");
devoluciones: function() {
return this.$root.pedido.devoluciones_total;
},
}
notasDevoluciones: function() {
return this.$root.pedido.devoluciones_notas;
},
},
}
</script>
<style>
@media (max-width: 719px) {
.chismosa-tabla {
max-width: 80vw;
}
}
</style>
</script>

30
resources/js/components/ChismosaDropdown.vue
View File

@ -8,13 +8,6 @@
<span v-text="'$' + this.$limpiarInt($root.devoluciones ? $root.pedido.total_menos_devoluciones : $root.pedido.total)"></span>
</a>
</div>
<div class="dropdown-menu chismosa-menu" :id="id" role="menu">
<div class="dropdown-content">
<div class="dropdown-item">
<chismosa></chismosa>
</div>
</div>
</div>
</div>
</template>
@ -37,28 +30,9 @@ export default {
},
methods: {
toggle() {
this.activa = !this.activa
this.activa = !this.activa;
Event.$emit("toggle-chismosa");
},
},
}
</script>
<style>
@media (max-width: 719px) {
.chismosa-menu {
vertical-align: top;
overflow-y: auto;
max-height: 75vh;
max-width: 100vw;
}
}
@media (min-width: 720px) {
.chismosa-menu {
vertical-align: top;
overflow-y: auto;
max-height: 75vh;
}
}
</style>

32
resources/js/components/PedidoBody.vue Normal file
View File

@ -0,0 +1,32 @@
<template>
<div class="columns">
<categorias-container></categorias-container>
<productos-container></productos-container>
<chismosa v-show="chismosaActiva"></chismosa>
</div>
</template>
<script>
import Chismosa from './Chismosa.vue';
import ProductosContainer from './ProductosContainer.vue';
import CategoriasContainer from './CategoriasContainer.vue';
export default {
componets: {
Chismosa,
ProductosContainer,
CategoriasContainer,
},
data() {
return {
chismosaActiva: false,
}
},
mounted() {
Event.$on('toggle-chismosa', () => {
this.chismosaActiva = !this.chismosaActiva;
console.log(this.chismosaActiva);
});
},
}
</script>

5
resources/views/productos.blade.php
View File

@ -1,9 +1,6 @@
@extends('layouts.app')
@section('content')
<chismosa></chismosa>
<categorias-container></categorias-container>
<productos-container></productos-container>
<producto-modal></producto-modal>
<pedido-body></pedido-body>
<devoluciones-modal></devoluciones-modal>
@endsection