Refactor: controlar peticiones a Metabase en panorama facturador
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 47s
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 47s
Cambios realizados: - Mover botón "Actualizar" al footer del card de Filtros - Implementar guard para prevenir peticiones simultáneas - Eliminar watcher automático de fechas - Deshabilitar recarga automática al cambiar "incluir anulados" - Usuario debe hacer clic explícito en "Actualizar" para cargar datos Esto garantiza que solo una petición a Metabase esté activa a la vez y da control total al usuario sobre cuándo recargar los datos.
This commit is contained in:
@@ -13,7 +13,7 @@
|
||||
<!-- Error State -->
|
||||
<div v-else-if="error" class="rounded-lg border border-red-500/40 bg-red-500/18 p-4 text-sm text-red-200">
|
||||
<p>Error al cargar datos: {{ error }}</p>
|
||||
<UButton class="mt-4" @click="loadData" color="primary">
|
||||
<UButton class="mt-4" :loading="loading" :disabled="loading" @click="loadData" color="primary">
|
||||
Reintentar
|
||||
</UButton>
|
||||
</div>
|
||||
@@ -58,23 +58,14 @@
|
||||
/>
|
||||
|
||||
<template #footer>
|
||||
<div class="text-xs text-[var(--brand-text-muted)]">
|
||||
Rango activo: {{ rangoLegible }} · Registros considerados: Ingresos {{ data.conteos.ingresos_filtrados }}/{{ data.conteos.ingresos_total }} · Rechazos {{ data.conteos.rechazos_filtrados }}/{{ data.conteos.rechazos_total }}
|
||||
</div>
|
||||
</template>
|
||||
</UCard>
|
||||
|
||||
<!-- Totales Financieros - Resumen Principal -->
|
||||
<UCard class="brand-card border border-transparent">
|
||||
<template #header>
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h2 class="text-2xl font-bold brand-section-title">Totales Financieros</h2>
|
||||
<p class="text-sm text-[var(--brand-text-muted)] mt-1">Vista general de ingresos, inversiones y rechazos</p>
|
||||
<div class="flex flex-col sm:flex-row items-center justify-between gap-3">
|
||||
<div class="text-xs text-[var(--brand-text-muted)]">
|
||||
Rango activo: {{ rangoLegible }} · Registros considerados: Ingresos {{ data.conteos.ingresos_filtrados }}/{{ data.conteos.ingresos_total }} · Rechazos {{ data.conteos.rechazos_filtrados }}/{{ data.conteos.rechazos_total }}
|
||||
</div>
|
||||
<UButton
|
||||
:loading="loading"
|
||||
:ui="{ base: 'bg-[#c08040] text-[#1b1209] border border-[#d99a56] hover:bg-[#d99a56] hover:border-[#f0c07c]' }"
|
||||
:disabled="loading"
|
||||
:ui="{ base: 'bg-[#c08040] text-[#1b1209] border border-[#d99a56] hover:bg-[#d99a56] hover:border-[#f0c07c] disabled:opacity-50 disabled:cursor-not-allowed' }"
|
||||
size="sm"
|
||||
@click="loadData"
|
||||
>
|
||||
@@ -85,6 +76,16 @@
|
||||
</UButton>
|
||||
</div>
|
||||
</template>
|
||||
</UCard>
|
||||
|
||||
<!-- Totales Financieros - Resumen Principal -->
|
||||
<UCard class="brand-card border border-transparent">
|
||||
<template #header>
|
||||
<div>
|
||||
<h2 class="text-2xl font-bold brand-section-title">Totales Financieros</h2>
|
||||
<p class="text-sm text-[var(--brand-text-muted)] mt-1">Vista general de ingresos, inversiones y rechazos</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<div class="rounded-lg border border-[#3a2a16] bg-[#1c140c] px-6 py-4">
|
||||
@@ -172,6 +173,12 @@ const formatCurrency = (value: number) => {
|
||||
|
||||
// Methods
|
||||
async function loadData() {
|
||||
// Prevenir múltiples peticiones simultáneas
|
||||
if (loading.value) {
|
||||
console.warn('Ya hay una petición en proceso, ignorando nueva solicitud')
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
error.value = null
|
||||
|
||||
@@ -218,8 +225,7 @@ async function onToggleAnulados(newValue: boolean | 'indeterminate') {
|
||||
}
|
||||
}
|
||||
|
||||
// Recargar datos con el nuevo valor
|
||||
await loadData()
|
||||
// NO recargar automáticamente - el usuario debe hacer clic en "Actualizar"
|
||||
}
|
||||
|
||||
function onUpdatePreset(value: PresetValue) {
|
||||
@@ -234,11 +240,6 @@ function onUpdateFechaHasta(value: string | null) {
|
||||
fechaHasta.value = value
|
||||
}
|
||||
|
||||
// Watchers - reload data when filters change
|
||||
watch([fechaDesde, fechaHasta], () => {
|
||||
loadData()
|
||||
})
|
||||
|
||||
// Load data on mount
|
||||
onMounted(() => {
|
||||
// Default preset: cosecha 25-26
|
||||
|
||||
Reference in New Issue
Block a user