Agregado input para cantidad de ollas
This commit is contained in:
parent
b1b764fd7c
commit
5d7d533083
2 changed files with 56 additions and 2 deletions
49
resources/js/components/ollas/CantidadOllas.vue
Normal file
49
resources/js/components/ollas/CantidadOllas.vue
Normal file
|
@ -0,0 +1,49 @@
|
||||||
|
<script>
|
||||||
|
import { mapActions, mapGetters, mapState } from "vuex";
|
||||||
|
export default {
|
||||||
|
name: "CantidadOllas",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
cantidadControl: 0,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
decrementar() {
|
||||||
|
this.cantidadControl -= 1;
|
||||||
|
},
|
||||||
|
incrementar() {
|
||||||
|
this.cantidadControl += 1;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="notification has-text-centered">
|
||||||
|
<label class="label">Cantidad de ollas:</label>
|
||||||
|
<div class="field has-addons is-justify-content-center contador">
|
||||||
|
<div class="control">
|
||||||
|
<button class="button is-small"
|
||||||
|
:disabled="cantidadControl < 1"
|
||||||
|
@click.capture="decrementar">
|
||||||
|
<i class="fa fa-solid fa-minus"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="control">
|
||||||
|
<input id="cantidad"
|
||||||
|
v-model="cantidadControl"
|
||||||
|
class="input is-small"
|
||||||
|
type="number"
|
||||||
|
style="text-align: center">
|
||||||
|
</div>
|
||||||
|
<div class="control">
|
||||||
|
<button class="button is-small" @click="incrementar">
|
||||||
|
<i class="fa fa-solid fa-plus"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
</style>
|
|
@ -1,10 +1,11 @@
|
||||||
<script>
|
<script>
|
||||||
import PedidosMain from "../pedidos/PedidosMain.vue";
|
import PedidosMain from "../pedidos/PedidosMain.vue";
|
||||||
import { mapActions, mapMutations } from "vuex";
|
import { mapActions, mapMutations } from "vuex";
|
||||||
|
import CantidadOllas from "./CantidadOllas.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "OllasBody",
|
name: "OllasBody",
|
||||||
components: { PedidosMain },
|
components: { CantidadOllas, PedidosMain },
|
||||||
methods: {
|
methods: {
|
||||||
...mapActions('pedido', ["getPedidoDeOllas", "getGrupoDeCompra"]),
|
...mapActions('pedido', ["getPedidoDeOllas", "getGrupoDeCompra"]),
|
||||||
...mapMutations('ui', ["migasOllas"])
|
...mapMutations('ui', ["migasOllas"])
|
||||||
|
@ -19,7 +20,11 @@ export default {
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div id="ollas-body" class="pb-6 mb-6">
|
<div id="ollas-body" class="pb-6 mb-6">
|
||||||
<pedidos-main></pedidos-main>
|
<pedidos-main>
|
||||||
|
<template v-slot:cartel>
|
||||||
|
<cantidad-ollas/>
|
||||||
|
</template>
|
||||||
|
</pedidos-main>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue