nucleo000/analiticaNucleo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mejoras de ui UX demasido intensas

Browse Source
This commit is contained in:
josedario87
2025-10-01 07:44:14 -06:00
parent 32b10e1ad6
commit 053501a16d
5 changed files with 545 additions and 276 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
nuxt4-app/app/pages/comparativa-cosechas.vue
View File

@@ -58,6 +58,17 @@
<!-- Main Content -->
<template v-else>
<!-- Metadatos de Resumen de Ingresos -->
<UCard class="brand-card border border-transparent">
<template #header>
<div class="flex items-center gap-2">
<UIcon name="i-lucide-database" class="size-5 text-[#c08040]" />
<h3 class="text-base font-semibold text-[var(--brand-text)]">Fuente de Datos: Resumen Diario de Ingresos</h3>
</div>
</template>
<MetadatosCard v-if="resumenIngresosMetadata" :metadata="resumenIngresosMetadata" :compact="true" />
</UCard>
<!-- Selector de Cosechas -->
<UCard class="brand-card border border-transparent">
<template #header>
@@ -105,32 +116,6 @@
</div>
</UCard>
<!-- Metadatos de Resumen de Ingresos -->
<div v-if="cosechasSeleccionadas.length > 0" class="grid grid-cols-1 gap-5">
<UCard class="brand-card border border-transparent">
<template #header>
<div class="flex items-center gap-2">
<UIcon name="i-lucide-database" class="size-5 text-[#c08040]" />
<h3 class="text-base font-semibold text-[var(--brand-text)]">Fuente de Datos: Resumen Diario de Ingresos</h3>
</div>
</template>
<div class="flex flex-col gap-3">
<MetadatosCard v-if="resumenIngresosMetadata" :metadata="resumenIngresosMetadata" :compact="true" />
<div class="text-xs text-[var(--brand-text-muted)] p-3 rounded-lg bg-[var(--brand-bg-secondary)] border border-[var(--brand-border)]">
<p class="font-semibold mb-2">Métricas utilizadas (registros diarios):</p>
<ul class="list-disc list-inside space-y-1 ml-2">
<li><strong>total_peso_seco</strong> (qq)</li>
<li><strong>peso_neto_uva</strong> (qq)</li>
<li><strong>peso_neto_verde</strong> (qq)</li>
<li><strong>sacos_total_dia</strong></li>
<li><strong>Lempiras por tipo:</strong> uva, verde, mojado+oreado (combinados)</li>
</ul>
<p class="mt-2 text-[10px] italic">Todas las cosechas inician el 8 de septiembre y terminan el 7 de septiembre del siguiente año.</p>
</div>
</div>
</UCard>
</div>
<!-- Vista Heatmap -->
<div v-if="cosechasSeleccionadas.length > 0 && pageSections.heatmap">
<ComparativaCosechasHeatmap :ingresos="resumenIngresos" :cosechas-seleccionadas="cosechasSeleccionadas" />
@@ -377,7 +362,7 @@ const estilosGraficasDefault = {
// Cargar configuración desde cookies
function cargarConfiguracionDesdeCookies() {
const cookie = useCookie('estilos-graficas', {
const cookie = useCookie<typeof estilosGraficasDefault>('estilos-graficas', {
maxAge: 60 * 60 * 24 * 365, // 1 año
sameSite: 'lax'
})
@@ -399,7 +384,7 @@ const estilosGraficas = ref(cargarConfiguracionDesdeCookies())
// Guardar en cookies cuando cambie la configuración
watch(estilosGraficas, (newValue) => {
const cookie = useCookie('estilos-graficas', {
const cookie = useCookie<typeof estilosGraficasDefault>('estilos-graficas', {
maxAge: 60 * 60 * 24 * 365, // 1 año
sameSite: 'lax'
})
@@ -425,7 +410,7 @@ const cosechasDefiniciones = [
{ id: 'cosecha-23-24', label: 'Cosecha 23-24', periodo: '8 Sep 2023 - 7 Sep 2024', fechaInicio: '2023-09-08', fechaFin: '2024-09-07' },
{ id: 'cosecha-24-25', label: 'Cosecha 24-25', periodo: '8 Sep 2024 - 7 Sep 2025', fechaInicio: '2024-09-08', fechaFin: '2025-09-07' },
{ id: 'cosecha-25-26', label: 'Cosecha 25-26', periodo: '8 Sep 2025 - Hoy', fechaInicio: '2025-09-08', fechaFin: new Date().toISOString().split('T')[0] }
]
] as const satisfies readonly { id: string; label: string; periodo: string; fechaInicio: string; fechaFin: string }[]
// Calcular cuántos registros tiene cada cosecha
const registrosPorCosecha = computed(() => {
@@ -453,8 +438,12 @@ const cosechasDisponibles = computed(() => {
}))
})
// Cosechas seleccionadas (por defecto las más recientes con datos)
const cosechasSeleccionadas = ref<string[]>([])
// Cosechas seleccionadas (persistir en cookies)
const cosechasSeleccionadas = useCookie<string[]>('comparativa-cosechas-seleccionadas', {
default: () => [],
maxAge: 60 * 60 * 24 * 365, // 1 año
sameSite: 'lax'
})
// Watch para filtrar cosechas deshabilitadas y seleccionar las más recientes con datos
watch(cosechasDisponibles, (disponibles) => {