Agregados componentes para ordenar el flujo de la aplicación + usandolo en la view + cambios en la store pedido por evitar redireccion

resources/js/components/AppMain.vue

@@ -0,0 +1,30 @@
+<script>
+import NavBar from "./comunes/NavBar.vue";
+import { mapActions, mapState } from "vuex";
+export default {
+    name: 'Main',
+    components: { NavBar },
+    computed: {
+        ...mapState('login',["rol"]),
+    },
+    methods: {
+        ...mapActions('login',["getRol"]),
+    },
+    async mounted() {
+        await this.getRol();
+    },
+}
+</script>
+
+<template>
+    <div id="main">
+        <nav-bar></nav-bar>
+        <pedidos-body v-if="rol === 'barrio'"></pedidos-body>
+        <admin-body v-if="rol === 'admin_barrio'"></admin-body>
+        <compras-body v-if="rol === 'comision'"></compras-body>
+    </div>
+</template>
+
+<style scoped>
+
+</style>

resources/js/components/pedidos/Body.vue

@@ -1,36 +1,19 @@
 <template>
-    <div class="columns ml-3 mr-3">
+    <div id="pedidos-body">
-        <categorias-container :class="chismosaActiva ? 'hide-below-1024' : ''"></categorias-container>
+        <pedido-select-section v-if="!pedidoDefinido"></pedido-select-section>
-        <productos-container :class="chismosaActiva ? 'hide-below-1024' : ''"></productos-container>
+        <productos v-else></productos>
-        <chismosa v-show="chismosaActiva"></chismosa>
     </div>
 </template>
 
 <script>
-import { mapActions } from "vuex";
+import { mapGetters } from "vuex";
-import Chismosa from "./Chismosa.vue";
+import PedidoSelectSection from "./PedidoSelectSection.vue";
-import ProductosContainer from "./ProductosContainer.vue";
+import Productos from "./Productos.vue";
-import CategoriasContainer from "./CategoriasContainer.vue";
 
 export default {
-    components: { CategoriasContainer, ProductosContainer, Chismosa },
+    components: { Productos, PedidoSelectSection },
-    data() {
+    computed: {
-        return {
+        ...mapGetters('pedido',["pedidoDefinido"]),
-            chismosaActiva: false,
-        }
-    },
-    methods: {
-        ...mapActions('productos',["init"]),
-        ...mapActions('pedido',["getPedido"]),
-        ...mapActions('barrio',["getGrupoDeCompra"]),
-    },
-    async mounted() {
-        await this.init();
-        await this.getGrupoDeCompra();
-        await this.getPedido();
-        Event.$on('toggle-chismosa', (activa) => {
-            this.chismosaActiva = activa;
-        });
     },
 }
 </script>

resources/js/components/pedidos/PedidoSelectSection.vue

@@ -0,0 +1,26 @@
+<script>
+import { defineComponent } from "vue";
+import SubpedidoSelect from "./SubpedidoSelect.vue";
+import { mapGetters } from "vuex";
+
+export default defineComponent({
+    components: { SubpedidoSelect },
+})
+</script>
+
+<template>
+    <section class="section">
+        <div id="root" class="container">
+            <h1 class="title">
+                Pedidos MPS
+            </h1>
+            <p class="subtitle">
+                Bienvenidx a la aplicación de pedidos del <strong>Mercado Popular de Subsistencia</strong>
+            </p>
+            <subpedido-select></subpedido-select>
+        </div>
+    </section>
+</template>
+
+<style scoped>
+</style>

resources/js/components/pedidos/Productos.vue

@@ -0,0 +1,38 @@
+<script >
+import CategoriasContainer from "./CategoriasContainer.vue";
+import ProductosContainer from "./ProductosContainer.vue";
+import Chismosa from "./Chismosa.vue";
+import { defineComponent } from "vue";
+import SubpedidoSelect from "./SubpedidoSelect.vue";
+import { mapActions } from "vuex";
+
+export default defineComponent({
+    components: { SubpedidoSelect, CategoriasContainer, ProductosContainer, Chismosa },
+    data() {
+        return {
+            chismosaActiva: false,
+        }
+    },
+    methods: {
+        ...mapActions('productos',["init"]),
+    },
+    async mounted() {
+        await this.init();
+        Event.$on('toggle-chismosa', (activa) => {
+            this.chismosaActiva = activa;
+        });
+    },
+})
+</script>
+
+<template>
+    <div class="columns ml-3 mr-3" v-else>
+        <categorias-container :class="chismosaActiva ? 'hide-below-1024' : ''"></categorias-container>
+        <productos-container :class="chismosaActiva ? 'hide-below-1024' : ''"></productos-container>
+        <chismosa v-show="chismosaActiva"></chismosa>
+    </div>
+</template>
+
+<style scoped>
+
+</style>

resources/js/components/pedidos/SubpedidoSelect.vue

@@ -74,14 +74,13 @@ export default {
             this.guardarSubpedidoEnSesion(subpedido);
         },
         guardarSubpedidoEnSesion(subpedido) {
-            console.log(`select: ${JSON.stringify(subpedido)}`);
+            this.elegirPedido({ pedido: subpedido });
             axios.post("/subpedidos/guardar_sesion", {
                 subpedido: subpedido,
                 grupo_de_compra_id: this.grupo_de_compra_id
             }).then(_ => {
                 Event.$emit('obtener-sesion')
             });
-            this.elegirPedido({ pedido: subpedido });
         }
     }
 }

resources/js/store/modules/pedido.js

@@ -45,7 +45,9 @@ const actions = {
     },
     async elegirPedido({ commit }, { pedido }) {
         await axios.post("/subpedidos/sesion", { id: pedido.id, });
-        window.location.href = 'productos';
+        const response = await axios.get(`/api/subpedidos/${pedido.id}`);
+        commit('setState', response.data.data);
+        // window.location.href = 'productos';
     },
     async modificarChismosa({ commit }, producto_id, cantidad, notas) {},
     async modificarDevoluciones({ commit }, monto, notas) {}

resources/views/subpedidos_create.blade.php

@@ -1,17 +1,7 @@
 @extends('layouts.app')
 
 @section('content')
-<section class="section">
+    <app-main></app-main>
-<div id="root" class="container">
-  <h1 class="title">
-    Pedidos MPS
-  </h1>
-  <p class="subtitle">
-    Bienvenidx a la aplicación de pedidos del <strong>Mercado Popular de Subsistencia</strong>
-  </p>
-  <pedidos-subpedido-select></pedidos-subpedido-select>
-</div>
-</section>
 @endsection
 
 @section('scripts')