DashDescomplicar/okf/entidades/Painel-Dashboard.md

type, layer, tags, title

type	layer	tags	title
Entity	wiki	stack dashdescomplicar painel dashboard home	Painel-Dashboard

Painel-Dashboard

Página principal (home) do DashDescomplicar. Hero stats agregados do Desk CRM com resumo do dia, tarefas, tickets, leads, projectos, pipeline e métricas de tempo.

Responsabilidades

• Hero Stats: 5 métricas principais com sparklines, gradientes e tendências
• Resumo do Dia: Data formatada PT-PT, eventos hoje, tarefas urgentes/alta, tickets abertos
• Tarefas: Urgentes (priority 4), Alta (priority 3), Vencidas, Em Testes, Esta Semana
• Leads: Contactar, Follow-up, Proposta — com pipeline stage
• Projectos: Lista de projectos activos com progresso
• Calendário: Eventos de hoje e da semana (Google Calendar via Desk)
• Timesheet: Horas registadas hoje/semana
• Billing 360: Facturação do mês com progress ring
• Pipeline: Leads em pipeline por stage
• Monday Mood: Frase motivacional (apenas às segundas)

Stack

• React 19 + TypeScript 5.6
• Framer Motion: Stagger + spring + hover animations
• Lucide React: 25+ ícones (Calendar, AlertTriangle, Clock, RefreshCw, etc.)
• Tailwind CSS: Glass cards, gradientes, status pills
• Recharts: Sparkline (mini gráfico de tendência)

Componentes

• HeroStat: Métrica grande com ícone, gradiente, sparkline, tendência
• GlassCard: Card com accent color e contador
• Sparkline: Mini gráfico SVG de tendência
• StatusPill: Badge de status (emerald, amber, red)
• ProgressRing: Anel de progresso SVG circular
• SummaryWidget: Widget bento-style com resumo do dia
• ListItem: Item de lista com hover e badges

Tipos

• DashboardData: date, day_of_week, is_monday, monday_mood, tarefas (urgente, alta, vencidas, em_testes, esta_semana), tickets (abertos, alta_prioridade), leads (contactar, proposta, followup), projectos[], pipeline[], eventos (hoje[], semana[]), timesheet (hoje, semana), billing_360, resumo

API Consumida

API	Rota	Dados
Dashboard	GET /api/dashboard	16 queries paralelas ao Desk CRM

Localizações

• Código: src/App.tsx (função App(), linhas 416-818 + mock data)
• Rota: /

Dependências

• Express-API: Rota /api/dashboard (16 queries)
• MySQL-Pool: Dados do Desk CRM (tarefas, tickets, leads, projectos, calendário, timesheet, facturação)
• Dashboard-Engine: Layout (sidebar + header)

Estado

• Activo