72 lines
2.0 KiB
Markdown
72 lines
2.0 KiB
Markdown
---
|
|
type: Entity
|
|
layer: wiki
|
|
tags: [stack, dashdescomplicar, painel, operacoes, tickets, procs]
|
|
title: "Painel-Operacoes"
|
|
---
|
|
|
|
# Painel-Operacoes
|
|
|
|
Painel de gestão operacional via Desk CRM. Exibe tickets abertos, prioridades, distribuição por departamento e cobertura de PROCs.
|
|
|
|
## Responsabilidades
|
|
|
|
- **Tickets**: Total abertos (Open, In Progress, Answered), Alta Prioridade, Tempo Médio Resposta (90 dias)
|
|
- **Distribuição**: Tickets por departamento (gráfico de barras)
|
|
- **Cobertura PROCs**: Barra de progresso por departamento com percentagem
|
|
- **Thresholds**: ≥80% verde, ≥50% amarelo, <50% vermelho
|
|
|
|
## Stack
|
|
|
|
- **React 19** + TypeScript 5.6
|
|
- **Recharts 3**: BarChart para tickets por departamento
|
|
- **Framer Motion**: Stagger animations
|
|
- **Lucide React**: Ticket, AlertTriangle, Clock, FileText, Building2
|
|
- **Tailwind CSS**: Glass cards, progress bars coloridas
|
|
|
|
## Tipos
|
|
|
|
- `TicketsByDept`: dept, count
|
|
- `CoverageItem`: dept, procs, total_expected, pct
|
|
- `OperationsData`: tickets (open, high_priority, avg_response_hours, by_department), procedures (total, departments, coverage)
|
|
|
|
## Componentes
|
|
|
|
- `StatCard`: Métrica com label, valor, ícone, cor
|
|
- `ProgressBar`: Barra de progresso com cor condicional (emerald ≥80%, amber ≥50%, red <50%)
|
|
- `CustomTooltip`: Tooltip do Recharts
|
|
|
|
## Cobertura de PROCs (Dados Estáticos)
|
|
|
|
| Departamento | PROCs | Esperado | % |
|
|
|---|---|---|---|
|
|
| D7 — Tecnologia | 18 | 20 | 90% |
|
|
| D6 — Gestão | 8 | 10 | 80% |
|
|
| D1 — Comercial | 5 | 8 | 62% |
|
|
| D5 — Marketing | 5 | 8 | 62% |
|
|
| Cross-Departamental | 5 | 6 | 83% |
|
|
| D3 — Contabilidade | 3 | 5 | 60% |
|
|
| D2 — Suporte | 3 | 6 | 50% |
|
|
| D4 — RH | 1 | 4 | 25% |
|
|
|
|
## API Consumida
|
|
|
|
| API | Rota | Dados |
|
|
|---|---|---|
|
|
| Operations | `GET /api/operations` | Tickets Desk CRM + cobertura PROCs |
|
|
|
|
## Localizações
|
|
|
|
- **Código**: `src/pages/Operations.tsx` (323 linhas)
|
|
- **Rota**: `/operations`
|
|
|
|
## Dependências
|
|
|
|
- **Express-API**: Rota `/api/operations`
|
|
- **MySQL-Pool**: Dados de tickets do Desk CRM
|
|
- **Dashboard-Engine**: Layout, navegação
|
|
|
|
## Estado
|
|
|
|
- Activo
|