felix
/
pedi2
forked from nathalie/pedi2
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Agregados botones para cantidad en el modal de agregar producto

This commit is contained in:
Alejandro Tasistro 2022-02-28 13:08:03 -03:00
parent 3bf776b6f7
commit 2f397c88d4
2 changed files with 63 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
public/css/productos.css vendored
View File

@ -2,3 +2,9 @@ figure.image.icono {
float: right;
margin: 4px;
}
.is-thin-centered {
width: 50%;
margin-left: auto;
margin-right: auto;
}

32
public/js/productos.js vendored
View File

@ -120,7 +120,8 @@ Vue.component('producto-container', {
<section class="modal-card-body">
<div class="card-image">
<figure class="image is-4by3">
<img v-bind:src="producto.imagen ? producto.imagen : 'https://bulma.io/images/placeholders/1280x960.png'">
<img
v-bind:src="producto.imagen ? producto.imagen : 'https://bulma.io/images/placeholders/1280x960.png'">
</figure>
<figure v-show="producto.nacional" class="image icono is-32x32">
<img src="/assets/uruguay.png">
@ -133,10 +134,31 @@ Vue.component('producto-container', {
<p class="title is-4" v-text="producto.proveedor"></p>
<p class="subtitle is-4">$<span v-text="producto.precio"></span></p>
<p class="subtitle is-5"><span v-text="producto.descripcion"></span></p>
<div class="field has-addons is-centered is-thin-centered">
<p class="control">
<button class="button" @click="cant !== 0 ? cant-- : cant">
<span class="icon is-small">
<!-- Habría que ver de poner un ícono de - -->
</span>
<span>-</span>
</button>
</p>
<p class="control">
<input id="cantidad" class="input" type="number" :value=cant style="text-align: center">
</p>
<p class="control">
<button class="button" @click="cant++">
<span class="icon is-small">
<!-- Habría que ver de poner un ícono de + -->
</span>
<span>+</span>
</button>
</p>
</div>
</div>
</section>
<footer class="modal-card-foot">
<button class="button is-success">Agregar a la chismosa</button>
<button class="button is-success" @click="agregarProducto">Agregar a la chismosa</button>
<button class="button" @click.capture="cerrar">Cancelar</button>
</footer>
</div>
@ -144,7 +166,8 @@ Vue.component('producto-container', {
data() {
return {
producto: null,
visible: false
visible: false,
cant: 0
}
},
computed: {
@ -159,6 +182,9 @@ Vue.component('producto-container', {
cerrar() {
this.visible = false;
Event.$emit("migas-pop");
},
agregarProducto() {
Event.$emit("producto-add");
}
},
mounted() {