consultoria-as/FRASA-CAS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(dark-mode): dark mode completo + gráficas adaptadas

Browse Source 
Dark mode fixes:
- Cards secundarias: Mis capturas, Mis clientes, Actividades, Apartados por vencer, Equipo
- Botones: Exportar, Descartar, Afluencia, Agendo, Forzar reconexión, Subir archivo
- Config: ModoTrabajo, Usuarios, Sistema, RolesPermisos, ConfigPage
- Cotizador: inputs, tabs, placeholder, botón compartir
- Alta clientes: BotonOcrIne, FileUploader
- Cobranza: toggle dashboard, modal abono
- Dashboards: tabs

Gráficas Recharts:
- CSS variables para colores chart (grid, text, tooltip)
- Helper isDark() + axisTextColor() + gridStroke() + tooltipProps()
- DashboardVendedor: grid, axes, tooltips adaptados
- TableroGeneral: grid, axes, tooltips (BarChart, Funnel, PieChart)
- MiTablero: tooltip adaptado
- Perfilamiento: grid, axes, tooltip

7 apps construidas limpias.
This commit is contained in:
Consult AS Technology
2026-09-07 06:44:08 +00:00
parent c77b4c0628
commit 8b65f903d3
20 changed files with 184 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
apps/dashboards/src/components/TableroGeneral.tsx
View File

@@ -15,6 +15,7 @@ import {
XAxis,
YAxis,
} from 'recharts'
import { axisTextColor, gridStroke, tooltipProps } from '../lib/chart-theme'
import KpiCard from './KpiCard'
import Perfilamiento from './Perfilamiento'
import SeccionEquipo from './SeccionEquipo'
@@ -160,10 +161,10 @@ export default function TableroGeneral({
<div className="h-72">
<ResponsiveContainer width="100%" height="100%">
<BarChart data={unidades} margin={{ top: 8, right: 8, left: -16, bottom: 0 }}>
<CartesianGrid strokeDasharray="3 3" vertical={false} />
<XAxis dataKey="desarrollo" tick={{ fontSize: 11 }} />
<YAxis allowDecimals={false} tick={{ fontSize: 11 }} />
<Tooltip />
<CartesianGrid strokeDasharray="3 3" stroke={gridStroke()} vertical={false} />
<XAxis dataKey="desarrollo" tick={{ fontSize: 11, fill: axisTextColor() }} />
<YAxis allowDecimals={false} tick={{ fontSize: 11, fill: axisTextColor() }} />
<Tooltip {...tooltipProps()} />
<Legend wrapperStyle={{ fontSize: 11 }} />
{Object.keys(COLORES_STATUS).map((status) => (
<Bar key={status} dataKey={status} stackId="unidades" fill={COLORES_STATUS[status]} />
@@ -183,10 +184,10 @@ export default function TableroGeneral({
<div className="h-80">
<ResponsiveContainer width="100%" height="100%">
<BarChart data={pipeline} layout="vertical" margin={{ top: 8, right: 24, left: 24, bottom: 0 }}>
<CartesianGrid strokeDasharray="3 3" horizontal={false} />
<XAxis type="number" allowDecimals={false} tick={{ fontSize: 11 }} />
<YAxis type="category" dataKey="etapa" width={90} tick={{ fontSize: 11 }} />
<Tooltip />
<CartesianGrid strokeDasharray="3 3" stroke={gridStroke()} horizontal={false} />
<XAxis type="number" allowDecimals={false} tick={{ fontSize: 11, fill: axisTextColor() }} />
<YAxis type="category" dataKey="etapa" width={90} tick={{ fontSize: 11, fill: axisTextColor() }} />
<Tooltip {...tooltipProps()} />
<Bar dataKey="valor" name="Unidades" fill="#2563EB" isAnimationActive={false} />
</BarChart>
</ResponsiveContainer>
@@ -203,7 +204,7 @@ export default function TableroGeneral({
<div className="h-72">
<ResponsiveContainer width="100%" height="100%">
<FunnelChart>
<Tooltip />
<Tooltip {...tooltipProps()} />
<Funnel dataKey="valor" data={funnel} nameKey="etapa" isAnimationActive={false}>
{funnel.map((etapa, i) => (
<Cell key={etapa.etapa} fill={COLORES_FUNNEL[i % COLORES_FUNNEL.length]} />
@@ -226,6 +227,7 @@ export default function TableroGeneral({
<div className="h-72">
<ResponsiveContainer width="100%" height="100%">
<PieChart>
<Tooltip {...tooltipProps()} />
<Pie
data={cobranza}
dataKey="valor"
@@ -240,7 +242,6 @@ export default function TableroGeneral({
<Cell key={rebanada.nombre} fill={COLORES_COBRANZA[i % COLORES_COBRANZA.length]} />
))}
</Pie>
<Tooltip />
</PieChart>
</ResponsiveContainer>
</div>