Modal de producto muestra cantidad pedida

This commit is contained in:
Alejandro Tasistro 2023-06-10 19:20:25 -03:00
parent 9bf68050a7
commit 121dfa4c49
2 changed files with 13 additions and 11 deletions

View File

@ -11,7 +11,7 @@
<p class="navbar-item"> <p class="navbar-item">
<slot name="subpedido"></slot> <slot name="subpedido"></slot>
</p> </p>
<chismosa-dropdown class="hide-above-1023"></chismosa-dropdown> <chismosa-dropdown v-if="this.$root.pedido != null" class="hide-above-1023" id="mobile"></chismosa-dropdown>
<a role="button" class="navbar-burger" :class="{'is-active':burgerActiva}" aria-label="menu" aria-expanded="false" data-target="nav-bar" @click="toggleBurger"> <a role="button" class="navbar-burger" :class="{'is-active':burgerActiva}" aria-label="menu" aria-expanded="false" data-target="nav-bar" @click="toggleBurger">
<span aria-hidden="true"></span> <span aria-hidden="true"></span>
<span aria-hidden="true"></span> <span aria-hidden="true"></span>
@ -28,7 +28,7 @@
</a> </a>
<input class="input is-small" type="text" placeholder="Harina" v-model="searchString" @keyup.enter="buscar" > <input class="input is-small" type="text" placeholder="Harina" v-model="searchString" @keyup.enter="buscar" >
</div> </div>
<chismosa-dropdown v-if="this.$root.pedido != null" class="hide-below-1024"></chismosa-dropdown> <chismosa-dropdown v-if="this.$root.pedido != null" class="hide-below-1024" id="wide"></chismosa-dropdown>
<div class="block navbar-item"> <div class="block navbar-item">
<a onclick="event.preventDefault(); document.getElementById('logout-form').submit();" class="text-a"> <a onclick="event.preventDefault(); document.getElementById('logout-form').submit();" class="text-a">
Cerrar sesión Cerrar sesión

View File

@ -26,7 +26,7 @@
<p class="subtitle is-5"><span v-text="producto.descripcion"></span></p> <p class="subtitle is-5"><span v-text="producto.descripcion"></span></p>
<div class="field has-addons is-centered is-thin-centered"> <div class="field has-addons is-centered is-thin-centered">
<p class="control"> <p class="control">
<button class="button" @click="cant !== 0 ? cant-- : cant"> <button class="button" @click="cantidad !== 0 ? cantidad-- : cantidad">
<span class="icon is-small"> <span class="icon is-small">
<!-- Habría que ver de poner un ícono de - --> <!-- Habría que ver de poner un ícono de - -->
</span> </span>
@ -34,10 +34,10 @@
</button> </button>
</p> </p>
<p class="control"> <p class="control">
<input id="cantidad" class="input" type="number" v-model.number="cant" style="text-align: center"> <input id="cantidad" class="input" type="number" v-model.number="cantidad" style="text-align: center">
</p> </p>
<p class="control"> <p class="control">
<button class="button" @click="cant++"> <button class="button" @click="cantidad++">
<span class="icon is-small"> <span class="icon is-small">
<!-- Habría que ver de poner un ícono de + --> <!-- Habría que ver de poner un ícono de + -->
</span> </span>
@ -49,7 +49,7 @@
</section> </section>
<footer class="modal-card-foot"> <footer class="modal-card-foot">
<!-- Habría que ver si cambiar el botón cuando al cantidad es 0 --> <!-- Habría que ver si cambiar el botón cuando al cantidad es 0 -->
<button class="button is-success" :disabled="cant <= 0" @click="agregarProducto">Aceptar</button> <button class="button is-success" :disabled="cantidad <= 0" @click="agregarProducto">Aceptar</button>
<button class="button" @click.capture="cerrar">Cancelar</button> <button class="button" @click.capture="cerrar">Cancelar</button>
</footer> </footer>
</div> </div>
@ -62,7 +62,7 @@
return { return {
producto: null, producto: null,
visible: false, visible: false,
cant: 0 cantidad: 0
} }
}, },
computed: { computed: {
@ -75,15 +75,15 @@
}, },
methods: { methods: {
cerrar() { cerrar() {
this.cant = 0; this.cantidad = 0;
this.visible = false; this.visible = false;
Event.$emit("migas-pop"); Event.$emit("migas-pop");
}, },
agregarProducto() { agregarProducto() {
if (this.cant < 0) alert("No se puede agregar cantidades negativas") if (this.cantidad < 0) alert("No se puede agregar cantidades negativas")
else if (!Number.isInteger(this.cant)) alert("Las cantidades deben ser números enteros") else if (!Number.isInteger(this.cantidad)) alert("Las cantidades deben ser números enteros")
else { else {
Event.$emit('sync-subpedido',this.cant, this.producto.id); Event.$emit('sync-subpedido',this.cantidad, this.producto.id);
this.cerrar(); this.cerrar();
} }
} }
@ -91,6 +91,8 @@
mounted() { mounted() {
Event.$on('producto-seleccionado', (producto) => { Event.$on('producto-seleccionado', (producto) => {
this.producto = producto; this.producto = producto;
this.cantidad = this.$root.pedido.productos.includes(producto) ?
producto.pivot.cantidad : 0
this.visible = true; this.visible = true;
Event.$emit("migas-agregar",this.miga); Event.$emit("migas-agregar",this.miga);
}); });