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

Centralizada logica para mostrar categorias o productos

Browse source
This commit is contained in:
Alejandro Tasistro 2025-07-20 11:47:25 -03:00
parent 9c07a91914
commit 96516a5083
4 changed files with 14 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
resources/js/components/pedidos/Canasta.vue
View file

@ -1,6 +1,6 @@
<script > <script >
import { defineComponent } from "vue"; import { defineComponent } from "vue";
import { mapMutations, mapState } from "vuex"; import { mapGetters, mapMutations, mapState } from "vuex";
import CategoriasContainer from "./CategoriasContainer.vue"; import CategoriasContainer from "./CategoriasContainer.vue";
import ProductosContainer from "./ProductosContainer.vue"; import ProductosContainer from "./ProductosContainer.vue";
import Chismosa from "./Chismosa.vue"; import Chismosa from "./Chismosa.vue";
@ -9,7 +9,8 @@ import DevolucionesModal from "./DevolucionesModal.vue";
export default defineComponent({ export default defineComponent({
components: { DevolucionesModal, CategoriasContainer, ProductosContainer, Chismosa }, components: { DevolucionesModal, CategoriasContainer, ProductosContainer, Chismosa },
computed: { computed: {
...mapState('ui', ["show_chismosa", "show_devoluciones", "tags_interactuada"]) ...mapState('ui', ["show_chismosa", "show_devoluciones", "tags_interactuada"]),
...mapGetters('productos', ["mostrarProductos"]),
}, },
methods: { methods: {
...mapMutations("ui", ["toggleTags"]), ...mapMutations("ui", ["toggleTags"]),
@ -23,8 +24,8 @@ export default defineComponent({
<template> <template>
<div class="columns ml-3 mr-3" v-else> <div class="columns ml-3 mr-3" v-else>
<categorias-container :class="show_chismosa ? 'hide-below-1024' : ''"/> <productos-container v-if="mostrarProductos" :class="show_chismosa ? 'hide-below-1024' : ''"/>
<productos-container :class="show_chismosa ? 'hide-below-1024' : ''"/> <categorias-container v-else :class="show_chismosa ? 'hide-below-1024' : ''"/>
<devoluciones-modal v-show="show_devoluciones"/> <devoluciones-modal v-show="show_devoluciones"/>
</div> </div>
</template> </template>

5
resources/js/components/pedidos/CategoriasContainer.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<div v-show="visible" class="column"> <div class="column">
<div ref="categorias" <div ref="categorias"
class="columns is-multiline is-mobile" class="columns is-multiline is-mobile"
:class="{ 'align-last-left': isLastRowIncomplete }"> :class="{ 'align-last-left': isLastRowIncomplete }">
@ -28,9 +28,6 @@ export default {
computed: { computed: {
...mapState('productos', ["categorias", "filtro"]), ...mapState('productos', ["categorias", "filtro"]),
...mapState('ui', ["show_chismosa"]), ...mapState('ui', ["show_chismosa"]),
visible() {
return this.filtro === null;
}
}, },
methods: { methods: {
...mapActions('productos', ["seleccionarCategoria"]), ...mapActions('productos', ["seleccionarCategoria"]),

5
resources/js/components/pedidos/ProductosContainer.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<div v-show="visible" class="column"> <div class="column">
<div ref="productos" <div ref="productos"
class="columns is-multiline is-mobile" class="columns is-multiline is-mobile"
:class="{ 'align-last-left': isLastRowIncomplete }"> :class="{ 'align-last-left': isLastRowIncomplete }">
@ -21,9 +21,6 @@ export default {
computed: { computed: {
...mapState('productos', ["productos", "filtro"]), ...mapState('productos', ["productos", "filtro"]),
...mapState('ui', ["show_chismosa"]), ...mapState('ui', ["show_chismosa"]),
visible() {
return this.filtro !== null;
},
miga: function () { miga: function () {
return { return {
nombre: this.filtro.valor, nombre: this.filtro.valor,

7
resources/js/store/modules/productos/index.ts
View file

@ -49,9 +49,16 @@ const actions = {
} }
}; };
const getters = {
mostrarProductos() {
return state.filtro !== undefined;
}
};
export default { export default {
namespaced: true, namespaced: true,
state, state,
mutations, mutations,
actions, actions,
getters,
}; };