feat: mejorar ux y validaciones del toldo

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

View File

@@ -1,16 +1,13 @@
<template>
<div>
<h2>Exportar / Importar</h2>
<div class="mb-5"><div class="text-overline text-primary">DATOS LOCALES</div><h1 class="text-h4 mb-1">Exportar e importar</h1><div class="text-body-2 text-medium-emphasis">Haz copias de seguridad para continuar trabajando sin internet.</div></div>
<section>
<h3>Exportar Datos</h3>
<button @click="exportar">Exportar JSON</button>
<v-card class="mb-4"><v-card-title>Exportar copia de seguridad</v-card-title><v-card-text><p class="mb-3">Incluye catálogo, movimientos, ventas, gastos, cuadres y jornadas.</p><v-btn @click="exportar" color="primary" prepend-icon="mdi-download">Descargar JSON</v-btn></v-card-text></v-card>
</section>
<section>
<h3>Importar Datos</h3>
<input type="file" accept=".json" @change="onFileChange" />
<button @click="importar" :disabled="!archivo">Importar JSON</button>
<v-card><v-card-title>Restaurar datos</v-card-title><v-card-text><v-file-input accept=".json" label="Seleccionar copia JSON" @update:model-value="archivo = $event" /><v-alert v-if="mensaje" :type="tipoMensaje" variant="tonal" class="mb-3">{{ mensaje }}</v-alert><v-btn @click="importar" :disabled="!archivo" color="secondary" prepend-icon="mdi-upload">Importar datos</v-btn></v-card-text></v-card>
</section>
</div>
</template>
@@ -22,6 +19,8 @@ import { ExportImportService } from '@toldo/services';
const exportService = new ExportImportService();
const archivo = ref<File | null>(null);
const mensaje = ref('');
const tipoMensaje = ref<'success' | 'error'>('success');
function onFileChange(e: any) {
archivo.value = e.target.files[0];
@@ -37,6 +36,7 @@ async function exportar() {
gastos: await db.gastos.toArray(),
ajustes: await db.ajustes.toArray(),
cuadres: await db.cuadres.toArray(),
jornadas: await db.jornadas.toArray(),
};
const exp = exportService.exportAll(data);
const blob = new Blob([JSON.stringify(exp, null, 2)], { type: 'application/json' });
@@ -62,9 +62,10 @@ async function importar() {
if (imp.data.gastos.length) await db.gastos.bulkPut(imp.data.gastos);
if (imp.data.ajustes.length) await db.ajustes.bulkPut(imp.data.ajustes);
if (imp.data.cuadres.length) await db.cuadres.bulkPut(imp.data.cuadres);
alert('Datos importados correctamente');
if (imp.data.jornadas?.length) await db.jornadas.bulkPut(imp.data.jornadas);
tipoMensaje.value = 'success'; mensaje.value = 'Datos importados correctamente.';
} catch (e: any) {
alert(e.message);
tipoMensaje.value = 'error'; mensaje.value = e.message;
}
}
</script>