Muestra producto-cantidad cuando aprobado, quitado mensaje de 'n en chismosa'

resources/js/components/AppLogin.vue

@@ -16,9 +16,9 @@ export default {
 <template>
 <div id="login-form" :class="estilos.fondo">
     <section class="section">
-        <login-dropdown class="is-hidden-tablet"></login-dropdown>
-        <login-titulos></login-titulos>
-        <login-input></login-input>
+        <login-dropdown class="is-hidden-tablet"/>
+        <login-titulos/>
+        <login-input/>
     </section>
 </div>
 </template>

resources/js/components/AppMain.vue

@@ -22,11 +22,11 @@ export default {
 
 <template>
     <div id="app-main">
-        <nav-bar></nav-bar>
-        <pedidos-body v-if="rol === 'barrio'"></pedidos-body>
-        <admin-body v-if="rol === 'admin_barrio'"></admin-body>
-        <comisiones-body v-if="rol === 'comision'"></comisiones-body>
-        <info-tags></info-tags>
+        <nav-bar/>
+        <pedidos-body v-if="rol === 'barrio'"/>
+        <admin-body v-else-if="rol === 'admin_barrio'"/>
+        <comisiones-body v-else-if="rol === 'comision'"/>
+        <info-tags/>
     </div>
 </template>
 

resources/js/components/admin/Body.vue

@@ -1,11 +1,11 @@
 <template>
     <div class="block ml-3 mr-3 is-max-widescreen is-max-desktop">
-        <tabs-secciones :tabs="tabs" :tabInicial="tabActiva"></tabs-secciones>
+        <tabs-secciones :tabs="tabs" :tabInicial="tabActiva"/>
         <div class="block" id="pedidos-seccion"
             :class="seccionActiva === 'pedidos-seccion' ? 'is-active' : 'is-hidden'">
             <div class="block pb-6" id="pedidos-tabla-y-dropdown" v-if="hayPedidos">
-                <dropdown-descargar></dropdown-descargar>
-                <tabla-pedidos></tabla-pedidos>
+                <dropdown-descargar/>
+                <tabla-pedidos/>
             </div>
             <p class="has-text-centered" v-else>
                 Todavía no hay ningún pedido para administrar.
@@ -13,7 +13,7 @@
         </div>
         <div class="block pb-6" id="caracteristicas-seccion"
              :class="seccionActiva === 'caracteristicas-seccion' ? 'is-active' : 'is-hidden'">
-            <caracteristicas-opcionales></caracteristicas-opcionales>
+            <caracteristicas-opcionales/>
         </div>
     </div>
 </template>

resources/js/components/admin/CaracteristicasOpcionales.vue

@@ -29,8 +29,8 @@ export default {
                 <fila-caracteristica
                     v-for="(c,i) in caracteristicas"
                     :key="i"
-                    :caracteristica="c">
-                </fila-caracteristica>
+                    :caracteristica="c"
+                />
             </tbody>
         </table>
     </div>

resources/js/components/admin/TablaPedidos.vue

@@ -14,8 +14,8 @@
             <fila-pedido
                 v-for="pedido in pedidos"
                 :pedido_id="pedido.id"
-                :key="pedido.id">
-            </fila-pedido>
+                :key="pedido.id"
+            />
         </tbody>
         </table>
         <table class="table is-striped is-bordered">

resources/js/components/comisiones/Body.vue

@@ -4,8 +4,7 @@
         <div class="block pb-6" id="pedidos-comisiones-seccion"
              :class="seccionActiva === 'pedidos-comisiones-seccion' ? 'is-active' : 'is-hidden'">
             <div class="block" id="pedidos-comisiones-tabla-y-dropdown">
-                <dropdown-descargar>
-                </dropdown-descargar>
+                <dropdown-descargar/>
             </div>
         </div>
         <div class="block pb-6" id="canasta-comisiones-seccion"
@@ -37,7 +36,7 @@
                     </div>
                 </article>
                 <div class="buttons is-right">
-                    <canasta-input></canasta-input>
+                    <canasta-input/>
                 </div>
             </div>
         </div>

resources/js/components/comunes/InfoTags.vue

@@ -1,13 +1,14 @@
 <script>
-import { mapActions, mapState } from "vuex";
+import { mapActions, mapMutations, mapState } from "vuex";
 
 export default {
     name: "InfoTags",
     computed: {
-        ...mapState("ui", ["canasta_actual"])
+        ...mapState("ui", ["canasta_actual", "show_tags"])
     },
     methods: {
         ...mapActions("ui", ["getCanastaActual"]),
+        ...mapMutations("ui", ["toggleTags"])
     },
     async mounted() {
         await this.getCanastaActual();
@@ -19,7 +20,6 @@ export default {
         return {
             nombreCanasta: "",
             fechaCanasta: "",
-            visible: true,
         }
     },
 }
@@ -27,14 +27,14 @@ export default {
 
 <template>
     <div>
-        <div v-if="!visible" class="info-tab" @click="visible = true">
+        <div v-if="!show_tags" class="info-tab" @click="toggleTags(true)">
             <button class="button is-borderless" type="button">
                 <span class="icon">
                     <i class="fas fa-info-circle"></i>
                 </span>
             </button>
         </div>
-        <div v-if="visible" class="box sticky-tags">
+        <div v-if="show_tags" class="box sticky-tags">
             <div class="field is-grouped is-grouped-multiline">
                 <div class="control">
                     <div class="tags has-addons">
@@ -48,7 +48,7 @@ export default {
                         <span class="tag is-danger">{{ fechaCanasta }}</span>
                     </div>
                 </div>
-                <button class="delete" type="button" @click="visible = false"></button>
+                <button class="delete" type="button" @click="toggleTags(true)"></button>
             </div>
         </div>
     </div>

resources/js/components/comunes/NavBar.vue

@@ -10,8 +10,8 @@
             <chismosa-dropdown
                 v-if="pedidoDefinido"
                 class="hide-above-1023"
-                ariaControls="mobile">
-            </chismosa-dropdown>
+                ariaControls="mobile"
+            />
             <a role="button" class="navbar-burger" :class="{'is-active':burgerActiva}" aria-label="menu"
                aria-expanded="false" data-target="nav-bar" @click="toggleBurger">
                 <span aria-hidden="true"></span>

resources/js/components/login/LoginInput.vue

@@ -14,8 +14,8 @@ export default {
 
 <template>
     <div>
-        <user-login v-if="urlRol === 'comisiones'"></user-login>
-        <barrio-login v-else></barrio-login>
+        <user-login v-if="urlRol === 'comisiones'"/>
+        <barrio-login v-else/>
     </div>
 </template>
 

resources/js/components/login/LoginTitulos.vue

@@ -23,7 +23,7 @@ export default {
             </div>
         </div>
         <div class="column is-2 is-hidden-mobile">
-            <login-dropdown></login-dropdown>
+            <login-dropdown/>
         </div>
     </div>
 </template>

resources/js/components/login/input/BarrioLogin.vue

@@ -17,8 +17,8 @@ export default defineComponent({
 
 <template>
     <div class="block">
-        <region-select></region-select>
-        <barrio-select></barrio-select>
+        <region-select/>
+        <barrio-select/>
     </div>
 </template>
 

resources/js/components/login/input/UserLogin.vue

@@ -10,8 +10,8 @@ export default defineComponent({
 
 <template>
     <div class="block">
-        <user-input></user-input>
-        <password-input></password-input>
+        <user-input/>
+        <password-input/>
     </div>
 </template>
 

resources/js/components/login/input/barrio/BarrioSelect.vue

@@ -20,7 +20,7 @@
 				</div>
 			</div>
 		</div>
-        <password-input v-if="grupo_de_compra_elegido"></password-input>
+        <password-input v-if="grupo_de_compra_elegido"/>
         <input readonly v-model="nombre" type="hidden" name="name">
 	</div>
 </template>

resources/js/components/pedidos/Canasta.vue

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

resources/js/components/pedidos/Chismosa.vue

@@ -33,7 +33,7 @@
             </tr>
             </tfoot>
             <tbody>
-            <producto-row v-for="producto in productos" :producto="producto" :key="producto.id"></producto-row>
+            <producto-row v-for="producto in productos" :producto="producto" :key="producto.id"/>
             </tbody>
         </table>
         <p class="has-text-centered" v-show="!mostrar_tabla">

resources/js/components/pedidos/NavMigas.vue

@@ -3,8 +3,10 @@
          aria-label="breadcrumbs" v-show="visible">
         <ul class="mt-4">
             <li v-for="(miga, i) in migas" :key="i" :class="{'is-active': i === migaActiva}">
-                <a @click="clickMiga({ miga: miga })" v-text="miga.nombre"
-                   :class="{'has-text-danger': i !== migaActiva}"></a>
+                <a @click="clickMiga({ miga: miga })"
+                   v-text="miga.nombre"
+                   :class="{'has-text-danger': i !== migaActiva}">
+                </a>
             </li>
         </ul>
     </nav>

resources/js/components/pedidos/PedidoSelect.vue

@@ -5,9 +5,9 @@
                 Pedidos MPS
             </h1>
             <p class="subtitle">
-                Bienvenidx a la aplicación de pedidos del <strong>Mercado Popular de Subsistencia</strong>
+                Bienvenidx a la aplicación de pedidos del
+                <strong>Mercado Popular de Subsistencia</strong>
             </p>
-
             <div>
                 <label class="label">Escribí el nombre de tu familia o grupo de convivencia</label>
                 <div class="columns">
@@ -16,11 +16,13 @@
                             <div class="control">
                                 <input class="input" @input="onType" v-model="searchString"/>
                             </div>
-                            <p class="help">Debe ser claro para que tus compas del barrio te identifiquen.</p>
+                            <p class="help">
+                                Debe ser clarx para que tus compas del barrio te identifiquen.
+                            </p>
                         </div>
                     </div>
                     <div class="column is-one-third buttons">
-                        <button class="button is-danger" v-if="!deshabilitado" @click="submit(undefined)">
+                        <button class="button is-danger" v-if="!deshabilitado" @click="submit()">
                             Crear nuevo pedido
                         </button>
                     </div>
@@ -51,18 +53,20 @@
             </div>
         </div>
     </section>
-</template><script>
+</template>
+
+<script>
 import { mapActions, mapMutations, mapState } from "vuex";
 import axios from "axios";
 
 export default {
     name: 'PedidoSelect',
     async mounted() {
+        this.toggleTags(false);
         await this.getGrupoDeCompra();
         const sesion = await axios.get("/pedido/sesion");
-        if (sesion.data.id) {
+        if (sesion.data.id)
             await this.elegirPedido({ pedido_id: sesion.data.id });
-        }
     },
     data() {
         return {
@@ -72,13 +76,14 @@ export default {
     },
     computed: {
         ...mapState('pedido', ["grupo_de_compra"]),
-        deshabilitado: function () {
+        deshabilitado() {
             return !this.searchString?.trim()
                 || this.pedidos.some(p => p.nombre.toLowerCase() === this.searchString.toLowerCase())
         }
     },
     methods: {
         ...mapActions('pedido', ["getGrupoDeCompra", "crearPedido", "elegirPedido"]),
+        ...mapMutations("ui", ["toggleTags"]),
         async getPedidos(nombre) {
             const response = await axios.get('/api/subpedidos/',{
                 params: {
@@ -89,17 +94,19 @@ export default {
             this.pedidos = response.data;
         },
         onType() {
-            if (!this.searchString) {
-                this.setPedidos([]);
-                return;
-            }
+            if (!this.searchString)
+                this.pedidos = [];
+            else
                 this.getPedidos(this.searchString);
         },
         async submit(pedido) {
             if (pedido)
                 await this.elegirPedido({ pedido_id: pedido.id });
             else
-                await this.crearPedido({ nombre: this.searchString, grupo_de_compra_id: this.grupo_de_compra.id });
+                await this.crearPedido({
+                    nombre: this.searchString,
+                    grupo_de_compra_id: this.grupo_de_compra.id
+                });
         },
     }
 }

resources/js/components/pedidos/ProductoCard.vue

@@ -52,13 +52,9 @@ export default {
             <div class="column mt-auto"
                  :class="conIconos ? 'is-three-quarters-mobile is-two-thirds-tablet' : 'is-full'">
                 <producto-cantidad
-                    v-if="!aprobado"
                     :producto_id="producto.id"
-                    :requiere_notas="producto.requiere_notas">
-                </producto-cantidad>
-                <div class="has-text-centered mt-2" v-if="fuePedido && aprobado">
-                    <p class="subtitle is-7">{{ cantidadEnChismosa }} en chismosa</p>
-                </div>
+                    :requiere_notas="producto.requiere_notas"
+                />
             </div>
         </div>
     </div>

resources/js/components/pedidos/ProductoRow.vue

@@ -4,8 +4,8 @@
         <td class="has-text-right">
             <producto-cantidad
                 :producto_id="producto.id"
-                :requiere_notas="producto.requiere_notas">
-            </producto-cantidad>
+                :requiere_notas="producto.requiere_notas"
+            />
         </td>
         <td class="has-text-right">{{ `${cantidad(producto.id) * producto.precio}` }}</td>
     </tr>

resources/js/components/pedidos/ProductosContainer.vue

@@ -6,9 +6,7 @@
             <div v-for="(producto,i) in this.productos"
                  class="block column is-full-mobile is-half-tablet is-one-quarter-fullhd"
                 :class="show_chismosa ? 'is-half-desktop' : 'is-one-third-desktop'">
-                <producto-card :key="i"
-                    :producto="producto">
-                </producto-card>
+                <producto-card :key="i" :producto="producto"/>
             </div>
         </div>
     </div>

resources/js/store/modules/ui.js

@@ -1,6 +1,8 @@
 const state = {
     show_chismosa: false,
     show_devoluciones: false,
+    show_tags: true,
+    tags_interactuada: false,
     migas: [{ nombre: 'Pedidos', action: 'pedido/resetear' }],
     canasta_actual: null,
 };
@@ -15,6 +17,11 @@ const mutations = {
     toggleDevoluciones(state) {
         state.show_devoluciones = !state.show_devoluciones;
     },
+    toggleTags(state, manual) {
+        if (manual)
+            state.tags_interactuada = true;
+        state.show_tags = !state.show_tags;
+    },
     addMiga(state, miga) {
         state.migas.push(miga);
     },