mono/ToldoConjunto
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

feat: mejorar ux y validaciones del toldo

Browse Source
This commit is contained in:
mono
2026-10-25 18:09:01 -05:00
parent 4ffce3e3cd
commit 8e286d6fec
24 changed files with 387 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
apps/toldo-app/src/components/Layout.vue
View File

@@ -1,21 +1,16 @@
<template>
<v-app>
<v-app-bar color="primary" density="compact">
<v-app-bar color="primary" elevation="2">
<v-app-bar-nav-icon data-testid="navigation-toggle" class="d-md-none" aria-label="Abrir navegación" @click="drawer = !drawer" />
<v-app-bar-title>ToldoConjunto - CESTA</v-app-bar-title>
<v-spacer></v-spacer>
<v-chip v-if="jornada" color="success" variant="tonal" class="mr-3" prepend-icon="mdi-circle">Jornada activa</v-chip>
</v-app-bar>
<v-navigation-drawer permanent>
<v-list density="compact">
<v-list-item to="/" prepend-icon="mdi-home" title="Inicio"></v-list-item>
<v-list-item to="/jornada" prepend-icon="mdi-calendar-check" title="Jornada (Apertura/Cierre)"></v-list-item>
<v-list-item to="/inventario" prepend-icon="mdi-package-variant" title="Inventario"></v-list-item>
<v-list-item to="/ventas" prepend-icon="mdi-cart" title="Ventas (POS)"></v-list-item>
<v-list-item to="/gastos" prepend-icon="mdi-cash-minus" title="Gastos"></v-list-item>
<v-list-item to="/cuadre" prepend-icon="mdi-cash-register" title="Cierre de Caja"></v-list-item>
<v-list-item to="/ajustes" prepend-icon="mdi-pencil" title="Ajustes"></v-list-item>
<v-list-item to="/reportes" prepend-icon="mdi-chart-bar" title="Reportes"></v-list-item>
<v-list-item to="/exportar" prepend-icon="mdi-export" title="Exportar/Importar"></v-list-item>
<v-navigation-drawer v-model="drawer" :permanent="!isMobile" :temporary="isMobile">
<v-list density="comfortable" nav>
<v-list-subheader>OPERACION</v-list-subheader>
<v-list-item to="/" prepend-icon="mdi-home" title="Inicio" @click="closeOnMobile"></v-list-item>
<v-list-item v-for="item in navItems" :key="item.to" :to="item.to" :prepend-icon="item.icon" :title="item.title" @click="closeOnMobile"></v-list-item>
</v-list>
</v-navigation-drawer>
@@ -26,3 +21,27 @@
</v-main>
</v-app>
</template>
<script setup lang="ts">
import { onMounted, onUnmounted, ref } from 'vue';
import { JornadaService } from '@toldo/services';
const drawer = ref(true);
const isMobile = ref(false);
const jornada = ref<any>(null);
const jornadaService = new JornadaService();
const navItems = [
{ to: '/jornada', icon: 'mdi-calendar-check', title: 'Jornada' },
{ to: '/inventario', icon: 'mdi-package-variant', title: 'Inventario' },
{ to: '/ventas', icon: 'mdi-cart', title: 'Ventas POS' },
{ to: '/gastos', icon: 'mdi-cash-minus', title: 'Gastos' },
{ to: '/cuadre', icon: 'mdi-cash-register', title: 'Cierre de caja' },
{ to: '/ajustes', icon: 'mdi-pencil', title: 'Ajustes' },
{ to: '/reportes', icon: 'mdi-chart-bar', title: 'Reportes' },
{ to: '/exportar', icon: 'mdi-export', title: 'Exportar / importar' },
];
function updateViewport() { isMobile.value = window.innerWidth < 960; if (isMobile.value) drawer.value = false; }
function closeOnMobile() { if (isMobile.value) drawer.value = false; }
onMounted(async () => { updateViewport(); window.addEventListener('resize', updateViewport); jornada.value = await jornadaService.getJornadaAbierta(); });
onUnmounted(() => window.removeEventListener('resize', updateViewport));
</script>