Logica de migas movida a ui.js

This commit is contained in:
Alejandro Tasistro 2025-05-23 01:27:34 -03:00
parent 0381bb0567
commit 1e830e3cfd
4 changed files with 17 additions and 30 deletions

View file

@ -51,7 +51,7 @@
<script> <script>
import ChismosaDropdown from '../pedidos/ChismosaDropdown.vue'; import ChismosaDropdown from '../pedidos/ChismosaDropdown.vue';
import { mapActions, mapGetters, mapState } from "vuex"; import { mapActions, mapGetters, mapMutations, mapState } from "vuex";
export default { export default {
components: { ChismosaDropdown }, components: { ChismosaDropdown },
@ -68,6 +68,7 @@ export default {
}, },
methods: { methods: {
...mapActions('productos', ["filtrarProductos"]), ...mapActions('productos', ["filtrarProductos"]),
...mapMutations('ui',["addMiga"]),
toggleBurger() { toggleBurger() {
this.burgerActiva = !this.burgerActiva this.burgerActiva = !this.burgerActiva
}, },
@ -75,7 +76,7 @@ export default {
if (this.burgerActiva) if (this.burgerActiva)
this.toggleBurger(); this.toggleBurger();
this.filtrarProductos({ filtro: "nombre", valor: this.searchString }); this.filtrarProductos({ filtro: "nombre", valor: this.searchString });
Event.$emit('migas-agregar', { nombre: this.searchString }); this.addMiga({ nombre: this.searchString });
} }
}, },
}; };

View file

@ -18,7 +18,7 @@
</template> </template>
<script> <script>
import { mapActions, mapState } from "vuex"; import { mapActions, mapMutations, mapState } from "vuex";
export default { export default {
name: 'CategoriasContainer', name: 'CategoriasContainer',
computed: { computed: {
@ -28,10 +28,11 @@ export default {
} }
}, },
methods: { methods: {
...mapActions('productos', ["seleccionarCategoria"]), ...mapActions('productos',["seleccionarCategoria"]),
...mapMutations('ui',["addMiga"]),
seleccionar(categoria) { seleccionar(categoria) {
this.seleccionarCategoria({ categoria: categoria }); this.seleccionarCategoria({ categoria: categoria });
Event.$emit('migas-agregar', { nombre: categoria }); this.addMiga({ nombre: categoria });
} }
} }
} }

View file

@ -11,39 +11,19 @@
</template> </template>
<script> <script>
import { mapGetters } from "vuex"; import { mapGetters, mapState } from "vuex";
export default { export default {
data() {
return {
initial: [{ nombre: 'Categorías', href: '/productos' }],
migas: [{ nombre: 'Categorías', href: '/productos' }],
}
},
computed: { computed: {
...mapGetters('pedido', ["pedidoDefinido"]), ...mapState('ui',["migas","miga_inicial"]),
visible: function () { ...mapGetters('pedido',["pedidoDefinido"]),
visible() {
return this.migas.length > 0 return this.migas.length > 0
}, },
migaActiva: function () { migaActiva() {
return this.migas.length - 1 return this.migas.length - 1
} }
}, },
mounted() {
Event.$on('migas-setear-como-inicio', (miga) => {
this.migas = [];
this.migas.push(miga);
});
Event.$on('migas-agregar', (miga) => {
this.migas.push(miga);
});
Event.$on('migas-reset', () => {
this.migas = this.initial;
});
Event.$on('migas-pop', () => {
this.migas.pop();
});
}
} }
</script> </script>

View file

@ -1,6 +1,8 @@
const state = { const state = {
show_chismosa: false, show_chismosa: false,
show_devoluciones: false, show_devoluciones: false,
miga_inicial: { nombre: 'Categorias', href: '/pedido' },
migas: [{ nombre: 'Categorias', href: '/pedido' }],
}; };
const mutations = { const mutations = {
@ -10,6 +12,9 @@ const mutations = {
toggleDevoluciones(state) { toggleDevoluciones(state) {
state.show_devoluciones = !state.show_devoluciones; state.show_devoluciones = !state.show_devoluciones;
}, },
addMiga(state, miga) {
state.migas.push(miga);
}
}; };
export default { export default {