Logica de migas movida a ui.js

resources/js/components/comunes/NavBar.vue

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

resources/js/components/pedidos/CategoriasContainer.vue

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

resources/js/components/pedidos/NavMigas.vue

@@ -11,39 +11,19 @@
 </template>
 
 <script>
-import { mapGetters } from "vuex";
+import { mapGetters, mapState } from "vuex";
 
 export default {
-    data() {
-        return {
-            initial: [{ nombre: 'Categorías', href: '/productos' }],
-            migas: [{ nombre: 'Categorías', href: '/productos' }],
-        }
-    },
     computed: {
-        ...mapGetters('pedido', ["pedidoDefinido"]),
-        visible: function () {
+        ...mapState('ui',["migas","miga_inicial"]),
+        ...mapGetters('pedido',["pedidoDefinido"]),
+        visible() {
             return this.migas.length > 0
         },
-        migaActiva: function () {
+        migaActiva() {
             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>
 

resources/js/store/modules/ui.js

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