Visualização e Edição de Clientes
Visão Geral
A tela de Visualização e Edição de Clientes é o centro de gerenciamento completo de cada cliente. Organizada em abas laterais, permite acesso rápido a todas as informações, processos, tarefas, compromissos, finanças, comunicações e documentos relacionados ao cliente.
Estrutura da Interface
Cabeçalho
- Título: Nome do cliente em destaque
- Barra de Progresso: Indica qual aba está ativa
- Navegação: Menu lateral com abas disponíveis
Menu Lateral de Abas
O menu lateral apresenta 9 abas principais:
- 📋 Informações - Dados cadastrais
- 💬 Whatsapp - Conversas pelo WhatsApp
- 🔄 Histórico - Anotações e histórico
- 📂 Google Drive - Arquivos e documentos
- 📅 Compromissos - Audiências e compromissos
- ⚖️ Processos - Processos vinculados
- 💰 Financeiro - Movimentações financeiras
- ✅ Tarefas - Tarefas relacionadas
- 📧 Agendar - Mensagens agendadas
Rodapé de Ações
- Botões de navegação: Setas para alternar entre abas
- Botão Fechar: Retorna à listagem
- Botão Salvar: Salva alterações (apenas no modo edição)
Aba 1: Informações
Exibe e permite editar todos os dados cadastrais do cliente.
Seção: Identificação
Campos expandíveis organizados em accordion:
Dados Principais
- Nome (obrigatório)
- Ícone de copiar ao lado
- Validação: mínimo 2 palavras
- Celular
- Formatação automática
- Ícone de WhatsApp quando preenchido (permite limpar)
- Email
- Validação de formato
- Ícone de copiar
Documentação
- CPF/CNPJ (obrigatório)
- Ícone de copiar
- Validação automática
- Dados sensíveis
- Campo protegido
- Informações sigilosas
- Data de nascimento
- Seletor de data
- Formato DD/MM/AAAA
Categorização
- Etiquetas
- Seleção múltipla
- Botão "+" para criar nova etiqueta
- Chips coloridos exibindo categorias selecionadas
Seção: Dados (Expandível)
Informações complementares:
- Estado civil
- Profissão
- Nacionalidade
- Naturalidade
- Outros campos personalizados
Seção: Endereço (Expandível)
- CEP (com busca automática)
- Rua
- Número
- Complemento
- Bairro
- Cidade
- UF
Funcionalidades Especiais
Botões de Ação
- Copiar: Ícone ao lado de Nome, Celular, Email e CPF/CNPJ
- Limpar telefone: Remove número de WhatsApp vinculado
- Buscar CEP: Preenche endereço automaticamente
Salvamento Automático
- Alterações em campos individuais salvam automaticamente
- Feedback visual de salvamento bem-sucedido
- Validações em tempo real
Aba 2: WhatsApp
Interface de conversação integrada com WhatsApp.
Interface de Chat
Cabeçalho
- Foto e nome do cliente
- Número de telefone
- Fontes
Área de Mensagens
- Mensagens em bolhas
- Cor azul para mensagens enviadas (direita)
- Cor cinza para mensagens recebidas (esquerda)
- Horário de cada mensagem
- Agrupamento por data
Campo de Envio
- Botão "+" para anexos
- Botão de anexar arquivo 📎
- Campo de texto: "Digite sua mensagem..."
- Botão de envio 🎤 (microfone/voz)
Funcionalidades
Enviar Mensagem
- Digite no campo de texto
- Pressione Enter ou clique no botão de envio
- Mensagem aparece imediatamente na conversa
Enviar Arquivo
- Clique no ícone de anexo
- Selecione arquivo
- Adicione legenda (opcional)
- Envie
Filtrar Conversas por Fontes
- Cada fonte representa um número de telefone diferente
- O usuário pode selecionar qual fonte deseja visualizar
- O usuário pode enviar e receber mensagens de qualquer fonte ativa
As mensagens são sincronizadas em tempo real com o WhatsApp.
Aba 3: Histórico
Registro de anotações e histórico de interações com o cliente.
Interface
Botão "+ Nova anotação"
- Localizado no topo
- Cor azul destacada
- Abre modal de criação
Card de Anotação
Cada anotação exibe:
| Elemento | Descrição |
|---|---|
| Nome do autor | Usuário que criou a anotação |
| Data e hora | Timestamp no formato DD/MM/AAAA HH:MM:SS |
| Conteúdo | Texto da anotação |
| Menu de ações (⋮) | Editar ou excluir |
Funcionalidades
Criar Anotação
- Clique em "+ Nova anotação"
- Digite o conteúdo no modal
- Salve
Editar Anotação
- Clique no menu (⋮)
- Selecione "Editar"
- Modifique o texto
- Salve alterações
Excluir Anotação
- Clique no menu (⋮)
- Selecione "Excluir"
- Confirme a exclusão
Características
- Ordenação: Mais recentes primeiro
- Autor identificado: Nome do usuário visível
- Timestamp completo: Data e hora exatos
- Sem limite: Adicione quantas anotações necessárias
Anotações são visíveis para todos os usuários com acesso ao cliente.
Aba 4: Google Drive
Gerenciamento de documentos e arquivos do cliente.
Estrutura de Pastas
Breadcrumb
- Navegação hierárquica
- Exemplo:
🏠 JustiPlus > Pedro Dircksen - Clicável para retornar a níveis anteriores
Visualização de Arquivos
Área de Pastas
- Título: "Pastas"
- Mensagem: "Nenhuma pasta encontrada" (quando vazio)
- Lista de subpastas (quando existentes)
Área de Arquivos
- Título: "Arquivos"
- Miniatura de visualização
- Nome do arquivo
- Menu de ações (⋮)
Ações Disponíveis
Botão "+ Novo"
- Criar nova pasta
- Upload de arquivo
- Criar documento
Botão para remover vínculo com a pasta do drive
Ao clicar no botão vermelho, a pasta do cliente será desvinculada. Os documentos não serão apagados, apenas deixarão de estar vinculados ao cliente.
Menu de Ações do Arquivo (⋮)
- Visualizar: Abre prévia do arquivo
- Download: Baixa o arquivo
- Compartilhar: Gera link de compartilhamento
- Renomear: Altera nome do arquivo
- Mover: Move para outra pasta
- Excluir: Remove arquivo
Botão com Ícone de Lixeira
- Exclui pasta atual
- Solicita confirmação
- Remove pasta e conteúdo
Organize os arquivos em pastas por tipo ou processo para facilitar a localização.
Aba 5: Compromissos (Agenda)
Lista audiências e compromissos do cliente.
Informações Exibidas
| Campo | Descrição |
|---|---|
| Nome | Tipo de compromisso (ex: Audiência) |
| Tag | Categoria (ex: Escritório) |
| Início | Data e hora de início |
| Fim | Data e hora de término |
Características
- Indicador de tempo: Ponto azul para início, ponto vermelho para fim
- Paginação: Controles para navegar entre registros
- Categorização: Tags coloridas para fácil identificação
Aba 6: Processos
Lista todos os processos judiciais vinculados ao cliente.
Visualização
Tabela com as seguintes colunas:
| Coluna | Descrição |
|---|---|
| Número | Número do processo (clicável, com ícone de copiar) |
| Usuário | Responsável pelo processo |
| Tribunal | Órgão judicial (ex: SEEU, TJSC) |
| Última Atualização | Data e hora da última movimentação |
Funcionalidades
- Paginação: Controles na parte inferior
- Clique no número: Abre detalhes do processo
- Ícone de copiar: Copia número do processo
- Link para tribunal: Abre tribunal em nova aba
Os processos são atualizados automaticamente quando novos são vinculados ao cliente.
Aba 7: Financeiro
Controle de movimentações financeiras do cliente.
Visualização
Tabela completa de transações:
| Coluna | Descrição |
|---|---|
| Título | Descrição da movimentação (clicável) |
| Valor | Montante (-R$ para saída, +R$ para entrada) |
| Data | Data da transação |
| Tipo | Saída / Entrada (chip colorido) |
| Ações | Visualizar / Editar / Excluir |
Funcionalidades
Botão "+ Novo"
- Localizado no canto superior direito
- Cria nova movimentação financeira
- Abre modal de cadastro
Ações por Item
- Visualizar (👁️): Abre detalhes da movimentação
- Editar (✏️): Permite alteração
- Excluir (🗑️): Remove registro (com confirmação)
Paginação
- Navegação entre páginas
- Controles "1", "2", ">"
- Exibe número total de registros
Destaque Visual
- Saídas: Chip vermelho e valor negativo
- Entradas: Chip verde e valor positivo
- Valores: Formatação monetária brasileira (R$)
Aba 8: Tarefas
Gerenciamento de tarefas relacionadas ao cliente.
Exibição
Tabela com informações detalhadas:
| Coluna | Descrição |
|---|---|
| Título | Nome da tarefa (clicável) |
| Status | Aberto / Em progresso / Concluída |
| Prioridade | Baixa / Média / Alta (com indicador visual) |
| Data Entrega | Prazo da tarefa |
| Responsável | Usuário atribuído |
Funcionalidades
- Botão "+ Ver mais": Carrega mais tarefas (se disponíveis)
- Clique no título: Abre modal de detalhes da tarefa
- Indicadores visuais:
- Status com chips coloridos (azul para "Em progresso", amarelo para "Aberto")
- Prioridade com bolinhas coloridas (vermelho para Alta)
Ações Rápidas
- Visualizar detalhes
- Editar tarefa
- Marcar como concluída
Aba 9: Agendar (Mensagens)
Gerenciamento de mensagens agendadas para o cliente.
Interface
Área de Mensagens
- Lista de mensagens agendadas
- Exibe destinatário, status e conteúdo
- Data e hora de agendamento
Elementos Visuais
- Nome do destinatário: Em destaque
- Status: Chip colorido (Pendente = amarelo)
- Prévia da mensagem: Primeiras palavras
- Data/Hora: Timestamp do agendamento
Funcionalidades
Botão "+ Nova Mensagem"
- Cria novo agendamento
- Permite selecionar data/hora
- Campo de texto para mensagem
Ações por Mensagem
- Editar (✏️): Modifica mensagem ou horário
- Excluir (🗑️): Remove agendamento
Mensagens são enviadas automaticamente no horário programado.
Boas Práticas
Organização
- Mantenha dados cadastrais atualizados na aba Informações
- Use etiquetas para categorização eficiente
- Organize arquivos em pastas lógicas no Drive
Comunicação
- Registre todas as interações importantes em Anotações
- Use WhatsApp integrado para histórico centralizado
- Agende mensagens para follow-ups automáticos
Gestão
- Vincule todos os processos relevantes
- Crie tarefas com prazos e responsáveis definidos
- Mantenha compromissos atualizados
Documentação
- Anexe documentos importantes no Drive
- Use nomes descritivos para arquivos
- Faça backup em locais externos regularmente
Financeiro
- Registre todas as movimentações financeiras
- Categorize corretamente entradas e saídas
- Revise periodicamente o histórico financeiro