diff --git a/susconecta/app/paciente/page.tsx b/susconecta/app/paciente/page.tsx index 44449d3..4ac5828 100644 --- a/susconecta/app/paciente/page.tsx +++ b/susconecta/app/paciente/page.tsx @@ -1,94 +1,572 @@ 'use client' -import { useAuth } from '@/hooks/useAuth' +// import { useAuth } from '@/hooks/useAuth' // removido duplicado + +import { useState } from 'react' import { Button } from '@/components/ui/button' +import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from '@/components/ui/dialog' import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card' -import { User, LogOut, Home } from 'lucide-react' +import { Input } from '@/components/ui/input' +import { Label } from '@/components/ui/label' +import { Textarea } from '@/components/ui/textarea' +import { Avatar, AvatarFallback } from '@/components/ui/avatar' +import { User, LogOut, Calendar, FileText, MessageCircle, UserCog, Home, Clock, FolderOpen, ChevronLeft, ChevronRight, MapPin, Stethoscope } from 'lucide-react' +import { SimpleThemeToggle } from '@/components/simple-theme-toggle' import Link from 'next/link' import ProtectedRoute from '@/components/ProtectedRoute' +import { useAuth } from '@/hooks/useAuth' +// Simulação de internacionalização básica +const strings = { + dashboard: 'Dashboard', + consultas: 'Consultas', + exames: 'Exames & Laudos', + mensagens: 'Mensagens', + perfil: 'Perfil', + sair: 'Sair', + proximaConsulta: 'Próxima Consulta', + ultimosExames: 'Últimos Exames', + mensagensNaoLidas: 'Mensagens Não Lidas', + agendar: 'Agendar', + reagendar: 'Reagendar', + cancelar: 'Cancelar', + detalhes: 'Detalhes', + adicionarCalendario: 'Adicionar ao calendário', + visualizarLaudo: 'Visualizar Laudo', + download: 'Download', + compartilhar: 'Compartilhar', + inbox: 'Caixa de Entrada', + enviarMensagem: 'Enviar Mensagem', + salvar: 'Salvar', + editarPerfil: 'Editar Perfil', + consentimentos: 'Consentimentos', + notificacoes: 'Preferências de Notificação', + vazio: 'Nenhum dado encontrado.', + erro: 'Ocorreu um erro. Tente novamente.', + carregando: 'Carregando...', + sucesso: 'Salvo com sucesso!', + erroSalvar: 'Erro ao salvar.', +} export default function PacientePage() { const { logout, user } = useAuth() + const [tab, setTab] = useState<'dashboard'|'consultas'|'exames'|'mensagens'|'perfil'>('dashboard') + + // Simulação de loaders, empty states e erro + const [loading, setLoading] = useState(false) + const [error, setError] = useState('') + const [toast, setToast] = useState<{type: 'success'|'error', msg: string}|null>(null) + + // Acessibilidade: foco visível e ordem de tabulação garantidos por padrão nos botões e inputs const handleLogout = async () => { - console.log('[PACIENTE] Iniciando logout...') - await logout() + setLoading(true) + setError('') + try { + await logout() + } catch { + setError(strings.erro) + } finally { + setLoading(false) + } } + // Estado para edição do perfil + const [isEditingProfile, setIsEditingProfile] = useState(false) + const [profileData, setProfileData] = useState({ + nome: "Maria Silva Santos", + email: user?.email || "paciente@example.com", + telefone: "(11) 99999-9999", + endereco: "Rua das Flores, 123", + cidade: "São Paulo", + cep: "01234-567", + biografia: "Paciente desde 2020. Histórico de consultas e exames regulares.", + }) + + const handleProfileChange = (field: string, value: string) => { + setProfileData(prev => ({ ...prev, [field]: value })) + } + const handleSaveProfile = () => { + setIsEditingProfile(false) + setToast({ type: 'success', msg: strings.sucesso }) + } + const handleCancelEdit = () => { + setIsEditingProfile(false) + } + function DashboardCards() { + return ( +
+ + + {strings.proximaConsulta} + 12/10/2025 + + + + {strings.ultimosExames} + 2 + + + + {strings.mensagensNaoLidas} + 1 + +
+ ) + } + + // Consultas fictícias + const [currentDate, setCurrentDate] = useState(new Date()) + const consultasFicticias = [ + { + id: 1, + medico: "Dr. Carlos Andrade", + especialidade: "Cardiologia", + local: "Clínica Coração Feliz", + data: new Date().toISOString().split('T')[0], + hora: "09:00", + status: "Confirmada" + }, + { + id: 2, + medico: "Dra. Fernanda Lima", + especialidade: "Dermatologia", + local: "Clínica Pele Viva", + data: new Date().toISOString().split('T')[0], + hora: "14:30", + status: "Pendente" + }, + { + id: 3, + medico: "Dr. João Silva", + especialidade: "Ortopedia", + local: "Hospital Ortopédico", + data: (() => { let d = new Date(); d.setDate(d.getDate()+1); return d.toISOString().split('T')[0] })(), + hora: "11:00", + status: "Cancelada" + }, + ]; + + function formatDatePt(dateStr: string) { + const date = new Date(dateStr); + return date.toLocaleDateString('pt-BR', { weekday: 'long', day: 'numeric', month: 'long', year: 'numeric' }); + } + + function navigateDate(direction: 'prev' | 'next') { + const newDate = new Date(currentDate); + newDate.setDate(newDate.getDate() + (direction === 'next' ? 1 : -1)); + setCurrentDate(newDate); + } + function goToToday() { + setCurrentDate(new Date()); + } + + const todayStr = currentDate.toISOString().split('T')[0]; + const consultasDoDia = consultasFicticias.filter(c => c.data === todayStr); + + function Consultas() { + return ( +
+
+

Minhas Consultas

+
+ {/* Navegação de Data */} +
+
+ +

{formatDatePt(todayStr)}

+ + +
+
+ {consultasDoDia.length} consulta{consultasDoDia.length !== 1 ? 's' : ''} agendada{consultasDoDia.length !== 1 ? 's' : ''} +
+
+ {/* Lista de Consultas do Dia */} +
+ {consultasDoDia.length === 0 ? ( +
+ +

Nenhuma consulta agendada para este dia

+

Você pode agendar uma nova consulta

+ +
+ ) : ( + consultasDoDia.map(consulta => ( +
+
+
+
+
+
+ + {consulta.medico} +
+
+ {consulta.especialidade} • {consulta.local} +
+
+
+
+ + {consulta.hora} +
+
+
{consulta.status}
+
+
+ + {consulta.status !== 'Cancelada' && } + {consulta.status !== 'Cancelada' && } +
+
+
+ )) + )} +
+
+ ) + } + + // Exames e laudos fictícios + const examesFicticios = [ + { + id: 1, + nome: "Hemograma Completo", + data: "2025-09-20", + status: "Disponível", + prontuario: "Paciente apresenta hemograma dentro dos padrões de normalidade. Sem alterações significativas.", + }, + { + id: 2, + nome: "Raio-X de Tórax", + data: "2025-08-10", + status: "Disponível", + prontuario: "Exame radiológico sem evidências de lesões pulmonares. Estruturas cardíacas normais.", + }, + { + id: 3, + nome: "Eletrocardiograma", + data: "2025-07-05", + status: "Disponível", + prontuario: "Ritmo sinusal, sem arritmias. Exame dentro da normalidade.", + }, + ]; + + const laudosFicticios = [ + { + id: 1, + nome: "Laudo Hemograma Completo", + data: "2025-09-21", + status: "Assinado", + laudo: "Hemoglobina, hematócrito, leucócitos e plaquetas dentro dos valores de referência. Sem anemias ou infecções detectadas.", + }, + { + id: 2, + nome: "Laudo Raio-X de Tórax", + data: "2025-08-11", + status: "Assinado", + laudo: "Radiografia sem alterações. Parênquima pulmonar preservado. Ausência de derrame pleural.", + }, + { + id: 3, + nome: "Laudo Eletrocardiograma", + data: "2025-07-06", + status: "Assinado", + laudo: "ECG normal. Não há sinais de isquemia ou sobrecarga.", + }, + ]; + + const [exameSelecionado, setExameSelecionado] = useState(null) + const [laudoSelecionado, setLaudoSelecionado] = useState(null) + + function ExamesLaudos() { + return ( +
+

Exames

+
+

Meus Exames

+
+ {examesFicticios.map(exame => ( +
+
+
{exame.nome}
+
Data: {new Date(exame.data).toLocaleDateString('pt-BR')}
+
+
+ + +
+
+ ))} +
+
+

Laudos

+
+

Meus Laudos

+
+ {laudosFicticios.map(laudo => ( +
+
+
{laudo.nome}
+
Data: {new Date(laudo.data).toLocaleDateString('pt-BR')}
+
+
+ + +
+
+ ))} +
+
+ + {/* Modal Prontuário Exame */} + !open && setExameSelecionado(null)}> + + + Prontuário do Exame + + {exameSelecionado && ( + <> +
{exameSelecionado.nome}
+
Data: {new Date(exameSelecionado.data).toLocaleDateString('pt-BR')}
+
{exameSelecionado.prontuario}
+ + )} + + + + + + + + + {/* Modal Visualizar Laudo */} + !open && setLaudoSelecionado(null)}> + + + Laudo Médico + + {laudoSelecionado && ( + <> +
{laudoSelecionado.nome}
+
Data: {new Date(laudoSelecionado.data).toLocaleDateString('pt-BR')}
+
{laudoSelecionado.laudo}
+ + )} + + + + + + + +
+ ) + } + + // Mensagens fictícias recebidas do médico + const mensagensFicticias = [ + { + id: 1, + medico: "Dr. Carlos Andrade", + data: "2025-10-06T15:30:00", + conteudo: "Olá Maria, seu exame de hemograma está normal. Parabéns por manter seus exames em dia!", + lida: false + }, + { + id: 2, + medico: "Dra. Fernanda Lima", + data: "2025-09-21T10:15:00", + conteudo: "Maria, seu laudo de Raio-X já está disponível no sistema. Qualquer dúvida, estou à disposição.", + lida: true + }, + { + id: 3, + medico: "Dr. João Silva", + data: "2025-08-12T09:00:00", + conteudo: "Bom dia! Lembre-se de agendar seu retorno para acompanhamento da ortopedia.", + lida: true + }, + ]; + + function Mensagens() { + return ( +
+

Mensagens Recebidas

+
+ {mensagensFicticias.length === 0 ? ( +
+ +

Nenhuma mensagem recebida

+

Você ainda não recebeu mensagens dos seus médicos.

+
+ ) : ( + mensagensFicticias.map(msg => ( +
+
+
+ + {msg.medico} + {!msg.lida && Nova} +
+
{new Date(msg.data).toLocaleString('pt-BR')}
+
{msg.conteudo}
+
+
+ )) + )} +
+
+ ) + } + + function Perfil() { + return ( +
+
+

Meu Perfil

+ {!isEditingProfile ? ( + + ) : ( +
+ + +
+ )} +
+
+ {/* Informações Pessoais */} +
+

Informações Pessoais

+
+ +

{profileData.nome}

+ Este campo não pode ser alterado +
+
+ + {isEditingProfile ? ( + handleProfileChange('email', e.target.value)} /> + ) : ( +

{profileData.email}

+ )} +
+
+ + {isEditingProfile ? ( + handleProfileChange('telefone', e.target.value)} /> + ) : ( +

{profileData.telefone}

+ )} +
+
+ {/* Endereço e Contato */} +
+

Endereço

+
+ + {isEditingProfile ? ( + handleProfileChange('endereco', e.target.value)} /> + ) : ( +

{profileData.endereco}

+ )} +
+
+ + {isEditingProfile ? ( + handleProfileChange('cidade', e.target.value)} /> + ) : ( +

{profileData.cidade}

+ )} +
+
+ + {isEditingProfile ? ( + handleProfileChange('cep', e.target.value)} /> + ) : ( +

{profileData.cep}

+ )} +
+
+ + {isEditingProfile ? ( +