fix(contabilidad): "sin datos" ya no se ve igual que "se rompió"

En /app/contabilidad/cuentas-cobro la petición respondía bien pero la tabla
quedaba en blanco, sin nada que dijera qué había pasado.

Probando la vista real con axios simulado quedó claro que el problema no
era el renderizado: con datos pinta bien, y que falle /clientes/select
tampoco la rompe. Lo que faltaba era distinguir el caso vacío.

Dos arreglos, uno en cada punta:

- Las 8 consultas de contabilidad declaraban `var items []T`, que sin filas
  se serializa como null y no como []. La vista hacía x-for sobre null y no
  pintaba nada; peor, con null se colaba además una fila basura.

- Ninguna de las 5 tablas tenía estado vacío. Ahora dicen "No hay ...
  registradas", así que cero filas se lee como cero filas.

El x-for además queda blindado con (items || []) para no depender de que
todos los endpoints devuelvan siempre una lista.

Verificado con la vista real en tres escenarios: con datos pinta la fila,
vacío y null muestran el mensaje y ninguna fila de más.

Si la pantalla sigue sin traer registros después de esto, ya no es la
vista: es que la consulta no encuentra filas, y el mensaje lo va a decir.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Lizandro Guarnizo
2026-08-15 20:47:24 -05:00
co-authored by Claude Sonnet 5
parent c6266d9f69
commit 351454c018
6 changed files with 44 additions and 13 deletions
+4 -1
View File
@@ -24,7 +24,10 @@
<template x-if="loading">
<tr><td colspan="6" class="text-center py-10 text-slate-400">Cargando...</td></tr>
</template>
<template x-for="c in items" :key="c.ID">
<template x-if="!loading && (!items || items.length===0)">
<tr><td colspan="6" class="text-center py-10 text-slate-400">No hay cuentas registradas.</td></tr>
</template>
<template x-for="c in (items || [])" :key="c.ID">
<tr class="hover:bg-slate-50">
<td class="px-4 py-3 font-mono text-xs text-slate-500" x-text="c.codigo||'-'"></td>
<td class="px-4 py-3 text-slate-700">
@@ -35,7 +35,10 @@
<template x-if="loading">
<tr><td colspan="7" class="text-center py-10 text-slate-400">Cargando...</td></tr>
</template>
<template x-for="c in items" :key="c.ID">
<template x-if="!loading && (!items || items.length===0)">
<tr><td colspan="7" class="text-center py-10 text-slate-400">No hay cuentas de cobro registradas.</td></tr>
</template>
<template x-for="c in (items || [])" :key="c.ID">
<tr class="hover:bg-slate-50">
<td class="px-4 py-3 text-xs text-slate-500" x-text="formatDate(c.fecha)"></td>
<td class="px-4 py-3 text-slate-700 font-medium" x-text="c.cliente?.nombre||'-'"></td>
@@ -35,7 +35,10 @@
<template x-if="loading">
<tr><td colspan="7" class="text-center py-10 text-slate-400">Cargando...</td></tr>
</template>
<template x-for="c in items" :key="c.ID">
<template x-if="!loading && (!items || items.length===0)">
<tr><td colspan="7" class="text-center py-10 text-slate-400">No hay cuentas por pagar registradas.</td></tr>
</template>
<template x-for="c in (items || [])" :key="c.ID">
<tr class="hover:bg-slate-50">
<td class="px-4 py-3 text-xs text-slate-500" x-text="formatDate(c.fecha)"></td>
<td class="px-4 py-3 text-slate-700 font-medium" x-text="c.entidad?.nombre||'-'"></td>
+4 -1
View File
@@ -30,7 +30,10 @@
<template x-if="loading">
<tr><td colspan="8" class="text-center py-10 text-slate-400">Cargando...</td></tr>
</template>
<template x-for="e in items" :key="e.ID">
<template x-if="!loading && (!items || items.length===0)">
<tr><td colspan="8" class="text-center py-10 text-slate-400">No hay entidades registradas.</td></tr>
</template>
<template x-for="e in (items || [])" :key="e.ID">
<tr class="hover:bg-slate-50">
<td class="px-4 py-3 text-slate-700 font-medium" x-text="e.nombre"></td>
<td class="px-4 py-3"><span class="badge" :class="{'badge-green':e.tipo==='cliente','badge-blue':e.tipo==='proveedor','badge-slate':e.tipo==='ambos'}" x-text="e.tipo||'-'"></span></td>
@@ -46,7 +46,10 @@
<template x-if="loading">
<tr><td colspan="8" class="text-center py-10 text-slate-400">Cargando...</td></tr>
</template>
<template x-for="t in items" :key="t.ID">
<template x-if="!loading && (!items || items.length===0)">
<tr><td colspan="8" class="text-center py-10 text-slate-400">No hay transacciones registradas.</td></tr>
</template>
<template x-for="t in (items || [])" :key="t.ID">
<tr class="hover:bg-slate-50">
<td class="px-4 py-3 text-xs text-slate-500" x-text="formatDate(t.fecha)"></td>
<td class="px-4 py-3">