tiagoandClaude Sonnet 5
323912748f
Adiciona o frontend Next.js em frontend/ (setup, design system, autenticação/tema, layout/navegação, área master, área tenant completa: clientes, produtos, vendas, recebimentos, whatsapp, e-mail, alertas, equipe e perfil). Estende o backend de forma aditiva e autorizada: cookie httpOnly para refresh token (Etapa 13) e CRUD de equipe + edição de perfil do tenant (Etapa 18, módulo src/modules/equipe/ novo e PUT /tenant/perfil). Detalhes completos em Etapas/V2/*. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
87 lines
3.8 KiB
Markdown
87 lines
3.8 KiB
Markdown
# Etapa 16 — Área Tenant: Dashboard, Clientes e Produtos
|
||
|
||
## Contexto do projeto
|
||
|
||
Continuação do frontend do **SeConectai Vendas**. Já existem: setup,
|
||
design system, autenticação/tema, layout/navegação e a área master
|
||
completa. Esta etapa inicia as telas de negócio da área `/app` (o
|
||
painel que os seus clientes usam), consumindo os endpoints das Etapas 5
|
||
e 6 (parte de dashboard) do backend.
|
||
|
||
## Objetivo desta etapa
|
||
|
||
Dashboard inicial do tenant, e os cadastros de clientes (customers) e
|
||
produtos/serviços — a base de dados que toda venda vai referenciar.
|
||
|
||
## Tarefas
|
||
|
||
1. **`/app/dashboard`**
|
||
- Cards de resumo: total recebido no mês, total a receber
|
||
(pendente+atrasado, com o atrasado destacado visualmente, ex: cor
|
||
de alerta), quantidade de vendas no mês.
|
||
- Gráfico de resumo semanal/mensal de vendas (Recharts), consumindo
|
||
as views de dashboard do backend.
|
||
- Lista das próximas parcelas a vencer (top 5–10), com link direto
|
||
para `/app/recebimentos`.
|
||
- Grid responsivo: 2–3 colunas no desktop, coluna única no mobile,
|
||
gráfico sempre com largura total.
|
||
|
||
2. **`/app/clientes`**
|
||
- Listagem (`Table`, vira cards no mobile) com busca por
|
||
nome/documento, filtro por ativo/inativo, paginação.
|
||
- Colunas/cards mostrando: razão social, documento, telefone/e-mail,
|
||
status.
|
||
- Botão "Novo cliente" → `/app/clientes/novo`.
|
||
|
||
3. **`/app/clientes/novo` e `/app/clientes/:id`**
|
||
- Formulário completo: dados cadastrais (razão social, nome
|
||
fantasia, documento, e-mail, telefone/WhatsApp, endereço, cidade,
|
||
UF, observações).
|
||
- No detalhe (`:id`), usar `Tabs`: Dados cadastrais (editável),
|
||
Contatos (CRUD aninhado — lista de `customer_contacts` com
|
||
indicação clara de qual é o principal e ação de marcar
|
||
principal), Histórico de vendas (lista somente leitura das vendas
|
||
desse cliente, com link para o detalhe de cada venda — mesmo que a
|
||
tela de vendas só seja construída na próxima etapa, deixar o link
|
||
já apontando para a rota correta).
|
||
- Ação de desativar (soft delete) com confirmação, mantendo o
|
||
registro visível no histórico.
|
||
|
||
4. **`/app/produtos`**
|
||
- Listagem com filtro por tipo (`produto`/`servico`) e por ativo,
|
||
busca por nome/SKU.
|
||
- Colunas/cards: nome, tipo (`StatusPill` ou badge simples), valor de
|
||
venda, SKU, status.
|
||
|
||
5. **`/app/produtos/novo` e `/app/produtos/:id`**
|
||
- Formulário: tipo (produto/serviço), nome, descrição, SKU (opcional,
|
||
validar unicidade — mostrar erro claro se a API retornar conflito),
|
||
valor de venda, valor de custo (opcional), unidade, flag
|
||
"recorrente".
|
||
- Ação de desativar (soft delete) com confirmação.
|
||
|
||
6. **Validação e limites de plano**
|
||
- Ao tentar criar cliente ou produto além do limite do plano do
|
||
tenant, a API retorna erro — o frontend deve mostrar essa mensagem
|
||
de forma clara (ex: banner ou toast explicando o limite atingido),
|
||
não travar silenciosamente o formulário.
|
||
|
||
## Critérios de aceite
|
||
|
||
- [ ] Dashboard do tenant mostra números batendo com dados de teste
|
||
conhecidos
|
||
- [ ] CRUD completo de clientes funciona, incluindo contatos aninhados e
|
||
regra de contato principal único
|
||
- [ ] Histórico de vendas no detalhe do cliente lista corretamente
|
||
(mesmo que a tela de destino ainda não exista até a próxima etapa)
|
||
- [ ] CRUD completo de produtos/serviços funciona, incluindo validação
|
||
de SKU duplicado
|
||
- [ ] Tentar exceder limite do plano (clientes ou produtos) mostra
|
||
mensagem clara ao usuário
|
||
- [ ] Desativar cliente/produto pede confirmação e reflete corretamente
|
||
na listagem (sai da lista de ativos, mas seria visível com filtro
|
||
"inativos")
|
||
- [ ] Todas as listagens com busca, filtro, paginação e estados de
|
||
loading/vazio
|
||
- [ ] Todas as telas testadas em 375px, 768px e 1280px
|