diff --git a/src/App.js b/src/App.js index 9a16348..cb86164 100644 --- a/src/App.js +++ b/src/App.js @@ -7,7 +7,8 @@ import Forgot from "./pages/ForgotPassword"; import PerfilSecretaria from "./perfis/perfil_secretaria/PerfilSecretaria"; import LandingPage from './pages/LandingPage'; import PerfilFinanceiro from "./perfis/perfil_financeiro/PerfilFinanceiro"; -// Mantenha todas as importações de CSS globais aqui se houver! +import Perfiladm from "./perfis/Perfil_adm/Perfiladm"; +import PerfilMedico from "./perfis/Perfil_medico/PerfilMedico"; function App() { // O estado controla qual view mostrar: false = Landing Page, true = Dashboard @@ -37,6 +38,8 @@ function App() { } /> } /> } /> + } /> + } /> Página não encontrada} /> diff --git a/src/PagesAdm/gestao.css b/src/PagesAdm/gestao.css new file mode 100644 index 0000000..c881f06 --- /dev/null +++ b/src/PagesAdm/gestao.css @@ -0,0 +1,255 @@ + +.dashboard-container { + padding: 2rem; + font-family: 'Arial', sans-serif; + background-color: #f5f6fa; + min-height: 100vh; +} + + +.dashboard-header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 2rem; +} + +.dashboard-title { + font-size: 20px; + font-weight: bold; + margin: 0; + color: #333; +} + +.dashboard-subtitle { + margin: 0.2rem 0 0 0; + color: #000; + font-size: 0.95rem; +} + +.new-user-btn { + background-color: #1e3a8a; + color: white; + padding: 0.6rem 1.2rem; + border: none; + border-radius: 8px; + font-size: 1rem; + cursor: pointer; + transition: background-color 0.3s, transform 0.25s ease, box-shadow 0.25s ease; +} + +.new-user-btn:hover { + background-color: #162d6b; + transform: translateY(-2px); + box-shadow: 0px 4px 12px rgba(30, 58, 138, 0.3); +} + + +.filters-container { + background: #fff; + border-radius: 12px; + padding: 1.5rem; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + margin-bottom: 2rem; + transition: transform 0.2s ease, box-shadow 0.2s ease; +} + +.filters-container:hover { + transform: translateY(-3px); + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); +} + +.filters-title { + font-size: 18px; + font-weight: bold; + margin-bottom: 0.3rem; + color: #333; +} + +.filters-subtitle { + font-size: 0.9rem; + color: #666; + margin-bottom: 1rem; +} + +.filters-content { + display: flex; + gap: 1rem; + align-items: center; +} + +.filters-input { + flex: 1; + padding: 0.6rem 1rem; + border: 1px solid #d1d5db; + border-radius: 8px; + font-size: 0.95rem; + color: #333; + transition: border-color 0.2s, box-shadow 0.2s; +} + +.filters-input:focus { + border-color: #1e3a8a; + box-shadow: 0px 0px 0px 3px rgba(30, 58, 138, 0.2); + outline: none; +} + +.filters-select { + padding: 0.6rem 1rem; + border: 1px solid #d1d5db; + border-radius: 8px; + font-size: 0.95rem; + background: #fff; + color: #333; + cursor: pointer; + transition: border-color 0.2s, box-shadow 0.2s; +} + +.filters-select:focus { + border-color: #1e3a8a; + box-shadow: 0px 0px 0px 3px rgba(30, 58, 138, 0.2); + outline: none; +} + + +.cards-container { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 1.5rem; + margin-bottom: 2rem; +} + +.card { + background-color: white; + padding: 1.5rem; + border-radius: 12px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + border: 1px solid transparent; + transition: transform 0.25s ease, box-shadow 0.25s ease, border 0.25s ease, background 0.25s ease; + cursor: pointer; +} + +.card:hover { + transform: translateY(-6px); + box-shadow: 0 8px 20px rgba(30, 58, 138, 0.2); + background: #f8faff; + border: 1px solid #1e3a8a33; +} + +.card-label { + font-size: 0.9rem; + color: #999; + margin-bottom: 0.5rem; +} + +.card-value { + font-size: 1.8rem; + font-weight: bold; + margin: 0; + color: #333; +} + +.card-extra { + font-size: 0.85rem; + color: #666; +} + +.card-extra.positive { + color: #1e3a8a; +} + + +.user-table-container { + background: #fff; + border-radius: 12px; + padding: 1.5rem; + box-shadow: 0 4px 6px rgba(0,0,0,0.1); + margin-top: 2rem; + transition: transform 0.25s ease, box-shadow 0.25s ease; +} + +.user-table-container:hover { + transform: translateY(-4px); + box-shadow: 0 6px 14px rgba(0,0,0,0.15); +} + +.user-table-container h2 { + font-size: 18px; + font-weight: bold; + margin-bottom: 0.3rem; + color: #333; +} + +.user-table-container p { + font-size: 0.9rem; + color: #666; + margin-bottom: 1rem; +} + +.user-table { + width: 100%; + border-collapse: collapse; +} + +.user-table th, +.user-table td { + padding: 12px 15px; + text-align: left; + border-bottom: 1px solid #e0e0e0; +} + +.user-table th { + background-color: #f3f4f6; + color: #333; + font-weight: 600; +} + +.user-table tr { + transition: background-color 0.25s ease; +} + +.user-table tr:hover { + background-color: #f0f4ff; +} + +.profile-badge { + background-color: #1e3a8a; + color: #f7f7f7; + padding: 3px 8px; + border-radius: 8px; + font-size: 0.85rem; + display: inline-block; +} + +.status-badge { + padding: 3px 8px; + border-radius: 8px; + font-size: 0.85rem; + color: #fff; + display: inline-block; + text-transform: capitalize; +} + +.status-badge.ativo { + background-color: #28a745; +} + +.status-badge.inativo { + background-color: #dc3545; +} + +.actions { + display: flex; + gap: 10px; +} + +.action-icon { + cursor: pointer; + color: #555; + transition: color 0.2s, transform 0.2s; +} + +.action-icon:hover { + color: #1e3a8a; + transform: scale(1.2); +} diff --git a/src/PagesAdm/gestao.jsx b/src/PagesAdm/gestao.jsx new file mode 100644 index 0000000..40dd7f1 --- /dev/null +++ b/src/PagesAdm/gestao.jsx @@ -0,0 +1,142 @@ + +import React from "react"; +import "./gestao.css"; +import { FaEdit, FaTrash } from "react-icons/fa"; + + +function UserDashboard() { + return ( + +
+ +
+
+

Gestão de Usuários

+

+ Gerencie usuários, perfis e permissões do sistema +

+
+ +
+ +
+
+

Total de Usuários

+

15

+

+3 este mês

+
+
+

Usuários Ativos

+

12

+

80.0% do total

+
+
+

Tempo Médio Sessão

+

2h 30min

+

Última semana

+
+
+

Usuários Hoje

+

10

+

+2 desde ontem

+
+
+ +
+

Filtros

+

+ Use os filtros abaixo para encontrar usuários específicos +

+
+ + + +
+
+ +
+

Usuários do Sistema

+

Lista completa de usuários e suas permissões

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NomeEmailPerfilDepartamentoStatusÚltimo AcessoAções
Ana Silvaana.silva@mediconnect.comGestão / CoordenaçãoAdministraçãoAtivo20/12/2024, 08:30 + + +
Dr. Carlos Santoscarlos.santos@mediconnect.comMédicoCardiologiaAtivo19/12/2024, 14:20 + + +
Maria Oliveiramaria.oliveira@mediconnect.comSecretáriaRecepçãoAtivo20/12/2024, 07:45 + + +
Dr. João Pereirajoao.pereira@mediconnect.comMédicoOrtopediaInativo15/12/2024, 16:30 + + +
+
+
+ ); +} + + +export default UserDashboard; \ No newline at end of file diff --git a/src/PagesAdm/painel.css b/src/PagesAdm/painel.css new file mode 100644 index 0000000..d476105 --- /dev/null +++ b/src/PagesAdm/painel.css @@ -0,0 +1,214 @@ +.painel-container { + padding: 2rem; + font-family: Arial, sans-serif; +} + +.painel-titulo { + font-size: 24px; + font-weight: bold; + margin-bottom: 0.5rem; +} + +.painel-subtitulo { + color: #666; + margin-bottom: 2rem; +} + +.painel-cards { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 1rem; +} + +.painel-card { + background: white; + border-radius: 10px; + padding: 1rem; + box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1); + transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease; + cursor: pointer; + border: 1px solid transparent; +} + + +.painel-card:hover { + transform: translateY(-6px); + box-shadow: 0px 8px 20px rgba(0, 102, 255, 0.2); + background: #f8faff; + border: 1px solid #0066ff33; +} + +.card-header { + display: flex; + justify-content: space-between; + font-size: 14px; + margin-bottom: 0.5rem; +} + +.badge { + background: #0066ff; + color: white; + padding: 2px 6px; + border-radius: 6px; + font-size: 12px; +} + +.card-numero { + font-size: 22px; + font-weight: bold; + margin: 0.3rem 0; +} + +.card-info { + font-size: 14px; + color: #666; +} + +.progress-bar { + background: #eee; + border-radius: 8px; + height: 8px; + margin-top: 0.5rem; + overflow: hidden; +} + +.progress-fill { + background: #0066ff; + height: 100%; + width: 80%; + border-radius: 8px; + transition: width 0.3s ease; +} + + +.painel-card:hover .progress-fill { + width: 90%; +} + +.painel-graficos { + margin-top: 2rem; + display: flex; + gap: 1.5rem; + flex-wrap: wrap; +} + +.grafico-card { + flex: 1; + min-width: 300px; + background: white; + border-radius: 10px; + padding: 1rem; + box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1); + transition: transform 0.25s ease, box-shadow 0.25s ease; +} + + +.grafico-card:hover { + transform: translateY(-4px); + box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.15); +} + +.grafico-titulo { + font-size: 16px; + font-weight: bold; + margin-bottom: 0.2rem; +} + +.grafico-subtitulo { + font-size: 13px; + color: #666; + margin-bottom: 1rem; +} + + +.performance-container { + background: #fff; + border-radius: 10px; + padding: 1.5rem; + box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1); + margin-top: 2rem; +} + +.performance-titulo { + font-size: 20px; + font-weight: bold; + margin-bottom: 0.2rem; +} + +.performance-subtitulo { + font-size: 14px; + color: #666; + margin-bottom: 1.5rem; +} + +.departamento { + margin-bottom: 1.2rem; +} + +.departamento-label { + display: flex; + justify-content: space-between; + font-size: 14px; + margin-bottom: 0.4rem; +} + +.departamento-barra { + background: #f0f2f5; + border-radius: 6px; + height: 10px; + overflow: hidden; +} + +.departamento-fill { + background: #001a40; + height: 100%; + width: 0%; + border-radius: 6px; + transition: width 0.4s ease; +} + + +.departamento-fill.ativo { + width: var(--percent, 0%); +} +.department-row { + display: flex; + align-items: center; + justify-content: space-between; + margin: 0.5rem 0; +} + +.department-name { + font-weight: bold; + color: #000; + min-width: 120px; +} + +.progress-wrapper { + display: flex; + align-items: center; + flex: 1; + gap: 0.5rem; +} + +.progress-bar { + flex: 1; + background: #eee; + border-radius: 8px; + height: 8px; + overflow: hidden; +} + +.progress-fill { + background: #0066ff; + height: 100%; + border-radius: 8px; + transition: width 0.3s ease; +} + +.department-info { + font-size: 13px; + color: #333; + white-space: nowrap; +} + diff --git a/src/PagesAdm/painel.jsx b/src/PagesAdm/painel.jsx new file mode 100644 index 0000000..f37716b --- /dev/null +++ b/src/PagesAdm/painel.jsx @@ -0,0 +1,193 @@ +import React from "react"; +import { + PieChart, + Pie, + Cell, + Tooltip, + BarChart, + Bar, + XAxis, + YAxis, + CartesianGrid, + ResponsiveContainer +} from "recharts"; +import "./painel.css"; + +export default function PainelAdministrativo() { + + const profileData = [ + { name: "Médico", value: 8 }, + { name: "Secretária", value: 5 }, + { name: "Gestão / Coordena", value: 3 }, + ]; + const COLORS = ["#1e3a8a", "#051AFF", "#0066ff"]; + + + const activityData = [ + { name: "Hoje", value: 10 }, + { name: "Esta Semana", value: 14 }, + { name: "Este Mês", value: 15 }, + ]; + + + const departamentos = [ + { nome: "Cardiologia", ativos: 3, total: 3 }, + { nome: "Ortopedia", ativos: 1, total: 2 }, + { nome: "Neurologia", ativos: 2, total: 2 }, + { nome: "Administração", ativos: 2, total: 2 }, + { nome: "Recepção", ativos: 5, total: 6 }, + ]; + + return ( +
+

Painel Administrativo

+

+ Visão geral completa do sistema MediConnect +

+ + +
+ +
+
+ Total de Usuários + 15 +
+

12

+

3 inativos

+
+
+
+
+ + +
+
+ Novos Usuários + +3 +
+

Este Mês

+

+20% comparado ao mês anterior

+
+ + +
+
+ Tempo Médio de Sessão +
+

2h 30min

+

+5% comparado à semana anterior

+
+ + +
+
+ Taxa de Atividade +
+

80.0%

+

Usuários ativos vs total

+
+
+ + +
+
+

Distribuição por Perfil

+

+ Quantidade de usuários por tipo de perfil +

+ + + `${name}: ${value}`} + > + {profileData.map((entry, index) => ( + + ))} + + + + +
+ + +
+

Atividade de Usuários

+

Usuários ativos por período

+ + + + + + + + + +
+
+ + +
+

Performance por Departamento

+

+ Atividade e engajamento dos usuários por departamento +

+ {departamentos.map((dep, index) => { + const percentual = Math.round((dep.ativos / dep.total) * 100); + return ( +
+ + + {dep.nome} + + + +
+
+
+ + + + {dep.ativos}/{dep.total} ({percentual}%) + +
+ ); + })} +
+
+ ); +} diff --git a/src/PagesMedico/Agendamento.jsx b/src/PagesMedico/Agendamento.jsx new file mode 100644 index 0000000..e0afc24 --- /dev/null +++ b/src/PagesMedico/Agendamento.jsx @@ -0,0 +1,209 @@ +import React, { useState, useMemo } from "react"; +import dayjs from "dayjs"; + +// Importe os componentes que você está usando +import TabelaAgendamentoDia from "../components/AgendarConsulta/TabelaAgendamentoDia"; +import TabelaAgendamentoSemana from "../components/AgendarConsulta/TabelaAgendamentoSemana"; +import TabelaAgendamentoMes from "../components/AgendarConsulta/TabelaAgendamentoMes"; +import FormNovaConsulta from "../components/AgendarConsulta/FormNovaConsulta"; + +// Importe os estilos +import "./styleMedico/Agendamento.css"; +import "./styleMedico/FilaEspera.css"; + +// --- DADOS E FUNÇÕES FORA DO COMPONENTE --- + +const filaEsperaData = [ + { nome: 'Ricardo Pereira', email: 'ricardo.pereira@gmail.com', cpf: '444.777.666-55', telefone: '(79) 99123-4567', entrada: '25/09/2025 às 08:00' }, + { nome: 'Ana Costa', email: 'ana.costa@gmail.com', cpf: '321.654.987-00', telefone: '(79) 97777-3333', entrada: '25/09/2025 às 08:30' }, + { nome: 'Lucas Martins', email: 'lucas.martins@gmail.com', cpf: '777.666.555-33', telefone: '(79) 99654-3210', entrada: '25/09/2025 às 09:00' }, + { nome: 'João Souza', email: 'joao.souza@gmail.com', cpf: '987.654.321-00', telefone: '(79) 98888-2222', entrada: '25/09/2025 às 14:00' }, + { nome: 'Maria Silva', email: 'maria.silva@gmail.com', cpf: '123.456.789-00', telefone: '(79) 99999-1111', entrada: '25/09/2025 às 14:30' }, + { nome: 'Fernanda Lima', email: 'fernanda.lima@gmail.com', cpf: '888.999.000-22', telefone: '(79) 98877-6655', entrada: '26/09/2025 às 09:30' }, + { nome: 'Carlos Andrade', email: 'carlos.andrade@gmail.com', cpf: '222.555.888-11', telefone: '(79) 99876-5432', entrada: '26/09/2025 às 10:00' }, + { nome: 'Juliana Oliveira', email: 'juliana.o@gmail.com', cpf: '111.222.333-44', telefone: '(79) 98765-1234', entrada: '26/09/2025 às 11:30' }, +]; + +const ListarDiasdoMes = (ano, mes) => { + const diasDaSemana = [[], [], [], [], [], [], []]; // 0: Domingo, 1: Segunda, ... + const base = dayjs(`${ano}-${mes}-01`); + const diasNoMes = base.daysInMonth(); + + for (let d = 1; d <= diasNoMes; d++) { + const data = dayjs(`${ano}-${mes}-${d}`); + const diaDaSemana = data.day(); // Retorna um número de 0 (Dom) a 6 (Sáb) + diasDaSemana[diaDaSemana].push(d); + } + + // Retornando apenas os dias úteis (Segunda a Sexta) + return [ + diasDaSemana[1], // Segundas + diasDaSemana[2], // Terças + diasDaSemana[3], // Quartas + diasDaSemana[4], // Quintas + diasDaSemana[5], // Sextas + ]; +}; + + +// --- COMPONENTE PRINCIPAL --- + +const Agendamento = () => { + const [FiladeEspera, setFiladeEspera] = useState(false); + const [tabela, setTabela] = useState('diario'); + const [PageNovaConsulta, setPageConsulta] = useState(false); + const [searchTerm, setSearchTerm] = useState(''); + + const filteredFila = useMemo(() => + filaEsperaData.filter(item => + item.nome.toLowerCase().includes(searchTerm.toLowerCase()) || + item.email.toLowerCase().includes(searchTerm.toLowerCase()) || + item.cpf.includes(searchTerm) || + item.telefone.includes(searchTerm) + ), [searchTerm]); + + const handleClickAgendamento = (agendamento) => { + if (agendamento.status !== 'vazio') return; + setPageConsulta(true); + }; + + const handleClickCancel = () => setPageConsulta(false); + + return ( +
+

Agendar nova consulta

+ + {!PageNovaConsulta ? ( +
+ + {/* ✅ BARRA DE BUSCA E FILTRO FOI MOVIDA PARA DENTRO DO CALENDÁRIO */} + + {/* ✅ BARRA DE UNIDADE E PROFISSIONAL REMOVIDA (COMENTADA) */} + {/* +
+ + +
+ */} + + {/* Botões para alternar Agenda / Fila de Espera */} +
+ + +
+ +
+ {!FiladeEspera ? ( +
+
+
+
+ + + +
+
+
Realizado
+
Confirmado
+
Agendado
+
Cancelado
+
+
+ + {/* ✅ BARRA DE BUSCA MOVIDA PARA CÁ */} +
+
+ + +
+
+ +
+
+ + {tabela === "diario" && } + {tabela === 'semanal' && } + {tabela === 'mensal' && } +
+
+ ) : ( +
+
+ setSearchTerm(e.target.value)} + /> +

Fila de Espera

+
+ + + + + + + + + + + + {filteredFila.map((item, index) => ( + + + + + + + + ))} + +
NomeEmailCPFTelefoneEntrou na fila de espera
{item.nome}{item.email}{item.cpf}{item.telefone}{item.entrada}
+
+ )} +
+
+ ) : ( + + )} +
+ ); +}; + +export default Agendamento; \ No newline at end of file diff --git a/src/PagesMedico/Chat.jsx b/src/PagesMedico/Chat.jsx new file mode 100644 index 0000000..7ba817b --- /dev/null +++ b/src/PagesMedico/Chat.jsx @@ -0,0 +1,204 @@ +import React, { useState, useRef, useEffect } from 'react'; +import './styleMedico/chat.css'; // Importa o ficheiro de estilos + +// --- DADOS MOCK (Simulação de um banco de dados) --- +const conversationsData = [ + { + id: 1, + patientName: 'Ana Costa', + avatarUrl: 'https://placehold.co/100x100/E2D9FF/6B46C1?text=AC', + lastMessage: 'Ok, doutor. Muito obrigada!', + timestamp: '10:45', + unread: 2, + messages: [ + { id: 1, sender: 'Ana Costa', text: 'Boa tarde, doutor. Estou sentindo uma dor de cabeça persistente desde ontem.', time: '09:15' }, + { id: 2, sender: 'Você', text: 'Olá, Ana. Além da dor de cabeça, você tem algum outro sintoma, como febre ou enjoo?', time: '09:17' }, + { id: 3, sender: 'Ana Costa', text: 'Não, apenas a dor de cabeça mesmo. É uma pressão na parte da frente.', time: '09:20' }, + { id: 4, sender: 'Você', text: 'Entendido. Por favor, continue monitorando e me avise se piorar. Recomendo repouso e boa hidratação.', time: '09:22' }, + { id: 5, sender: 'Ana Costa', text: 'Ok, doutor. Muito obrigada!', time: '10:45' }, + ], + }, + { + id: 2, + patientName: 'Carlos Andrade', + avatarUrl: 'https://placehold.co/100x100/D1E7DD/146C43?text=CA', + lastMessage: 'Amanhã, às 14h, está ótimo.', + timestamp: 'Ontem', + unread: 0, + messages: [ + { id: 1, sender: 'Carlos Andrade', text: 'Doutor, preciso remarcar minha consulta de amanhã.', time: 'Ontem' }, + { id: 2, sender: 'Você', text: 'Claro, Carlos. Qual seria o melhor horário para você?', time: 'Ontem' }, + { id: 3, sender: 'Carlos Andrade', text: 'Amanhã, às 14h, está ótimo.', time: 'Ontem' }, + ], + }, + { + id: 3, + patientName: 'Juliana Oliveira', + avatarUrl: 'https://placehold.co/100x100/F8D7DA/842029?text=JO', + lastMessage: 'O resultado do exame ficou pronto.', + timestamp: 'Sexta-feira', + unread: 0, + messages: [ + { id: 1, sender: 'Juliana Oliveira', text: 'O resultado do exame ficou pronto.', time: 'Sexta-feira' } + ], + }, + { + id: 4, + patientName: 'Ricardo Pereira', + avatarUrl: 'https://placehold.co/100x100/FFF3CD/856404?text=RP', + lastMessage: 'Estou me sentindo muito melhor, obrigado!', + timestamp: 'Quinta-feira', + unread: 0, + messages: [ + { id: 1, sender: 'Ricardo Pereira', text: 'Estou me sentindo muito melhor, obrigado!', time: 'Quinta-feira' } + ], + }, +]; + +// --- COMPONENTES --- + +const ConversationListItem = ({ conversation, isActive, onClick }) => ( +
+ {conversation.patientName} +
+
+

{conversation.patientName}

+ {conversation.timestamp} +
+
+

{conversation.lastMessage}

+ {conversation.unread > 0 && ( + {conversation.unread} + )} +
+
+
+); + +const ChatMessage = ({ message, isDoctor }) => ( +
+
+

{message.text}

+

{message.time}

+
+
+); + +const App = () => { + const [conversations, setConversations] = useState(conversationsData); + const [activeConversationId, setActiveConversationId] = useState(1); + const [newMessage, setNewMessage] = useState(''); + const chatEndRef = useRef(null); + + const activeConversation = conversations.find(c => c.id === activeConversationId); + + useEffect(() => { + chatEndRef.current?.scrollIntoView({ behavior: 'smooth' }); + }, [activeConversation]); + + const handleSendMessage = (e) => { + e.preventDefault(); + if (newMessage.trim() === '') return; + + const messageToSend = { + id: Date.now(), + sender: 'Você', + text: newMessage, + time: new Date().toLocaleTimeString('pt-BR', { hour: '2-digit', minute: '2-digit' }), + }; + + const updatedConversations = conversations.map(convo => { + if (convo.id === activeConversationId) { + return { + ...convo, + messages: [...convo.messages, messageToSend], + lastMessage: newMessage, + timestamp: 'Agora' + }; + } + return convo; + }); + + setConversations(updatedConversations); + setNewMessage(''); + }; + + const handleConversationClick = (id) => { + setActiveConversationId(id); + const updatedConversations = conversations.map(convo => + convo.id === id ? { ...convo, unread: 0 } : convo + ); + setConversations(updatedConversations); + }; + + return ( +
+ {/* Barra Lateral de Conversas */} + + + {/* Painel Principal do Chat */} +
+ {activeConversation ? ( + <> +
+ {activeConversation.patientName} +
+

{activeConversation.patientName}

+

Online

+
+
+
+ {activeConversation.messages.map(msg => ( + + ))} +
+
+
+
+ setNewMessage(e.target.value)} + placeholder="Digite sua mensagem..." + className="message-input" + autoComplete="off" + /> + +
+
+ + ) : ( +
+

Selecione uma conversa para começar.

+
+ )} +
+
+ ); +}; + +export default App; + diff --git a/src/PagesMedico/InicioMedico.jsx b/src/PagesMedico/InicioMedico.jsx new file mode 100644 index 0000000..dc47fae --- /dev/null +++ b/src/PagesMedico/InicioMedico.jsx @@ -0,0 +1,139 @@ +import React, { useState, useEffect } from 'react'; +import { FaUser, FaUserPlus, FaCalendarAlt, FaCalendarCheck } from 'react-icons/fa'; +import './style/Inicio.css'; + +function Inicio({ setCurrentPage }) { + const [pacientes, setPacientes] = useState([]); + const [agendamentos, setAgendamentos] = useState([]); + + useEffect(() => { + const fetchPacientes = async () => { + try { + const res = await fetch("https://mock.apidog.com/m1/1053378-0-default/pacientes"); + const data = await res.json(); + console.log(data) + //setPacientes(data.data); + } catch (error) { + console.error("Erro ao buscar pacientes:", error); + } + }; + + const fetchAgendamentos = async () => { + return; // <===serve para que nao cause erro + // try { + // const res = await fetch(); + // const data = await res.json(); + // setAgendamentos(data.data); + // } catch (error) { + // console.error("Erro ao buscar agendamentos:", error); + // } + }; + + fetchPacientes(); + fetchAgendamentos(); + }, []); + + const totalPacientes = pacientes.length; + const novosEsseMes = pacientes.filter(p => p.createdAt && new Date(p.createdAt).getMonth() === new Date().getMonth()).length; + + const hoje = new Date(); + const agendamentosDoDia = agendamentos.filter( + a => a.data && new Date(a.data).getDate() === hoje.getDate() + ); + const agendamentosHoje = agendamentosDoDia.length; + + return ( +
+
+ +

Bem-vindo ao MediConnect



+ +
+ +
+
+
+ TOTAL DE PACIENTES + {totalPacientes} +
+
+
+ +
+
+ NOVOS ESTE MÊS + {novosEsseMes} +
+
+
+ +
+
+ AGENDAMENTOS HOJE + {agendamentosHoje} +
+
+
+ +
+
+ PENDÊNCIAS + 0 +
+
+
+
+ +
+

Ações Rápidas

+
+
setCurrentPage('form-layout')}> + +
+ Novo Paciente + Cadastrar um novo paciente +
+
+
setCurrentPage('table')}> + +
+ Lista de Pacientes + Ver todos os pacientes +
+
+
setCurrentPage('agendamento')}> + +
+ Agendamentos + Gerenciar consultas +
+
+
+
+ +
+

Próximos Agendamentos

+ {agendamentosHoje > 0 ? ( +
+ {agendamentosDoDia.map(agendamento => ( +
+

{agendamento.nomePaciente}

+

{new Date(agendamento.data).toLocaleTimeString()}

+
+ ))} +
+ ) : ( +
+ +

Nenhum agendamento para hoje

+ +
+ )} +
+
+ ); +} + +export default Inicio; \ No newline at end of file diff --git a/src/PagesMedico/prontuario.jsx b/src/PagesMedico/prontuario.jsx new file mode 100644 index 0000000..38ce873 --- /dev/null +++ b/src/PagesMedico/prontuario.jsx @@ -0,0 +1,123 @@ +import React from "react"; +import "./styleMedico/geral.css"; + +const pacientes = [ + { + id: 1, + nome: "Maria Oliveira", + idade: 45, + sexo: "Feminino", + alergias: "Penicilina", + historico: [ + { data: "2025-09-15", descricao: "Consulta de acompanhamento de hipertensão. Pressão arterial controlada." }, + { data: "2025-07-20", descricao: "Relatou dores de cabeça frequentes." }, + ], + medicamentos: [ + { nome: "Losartana 50mg", uso: "1x ao dia pela manhã" }, + { nome: "Dipirona 500mg", uso: "Em caso de dor" }, + ], + }, + { + id: 2, + nome: "Carlos Souza", + idade: 62, + sexo: "Masculino", + alergias: "Nenhuma conhecida", + historico: [ + { data: "2025-09-01", descricao: "Check-up anual. Glicemia de jejum elevada." }, + { data: "2025-03-12", descricao: "Queixa de dor no joelho direito após esforço." }, + ], + medicamentos: [ + { nome: "Metformina 850mg", uso: "2x ao dia, após as refeições" }, + ], + }, + { + id: 3, + nome: "Ana Costa", + idade: 28, + sexo: "Feminino", + alergias: "Pólen e poeira", + historico: [ + { data: "2025-08-22", descricao: "Crise de rinite alérgica. Prescrito novo anti-histamínico." }, + { data: "2025-01-30", descricao: "Consulta de rotina ginecológica." }, + ], + medicamentos: [ + { nome: "Loratadina 10mg", uso: "1x ao dia durante crises alérgicas" }, + ], + }, + { + id: 4, + nome: "João da Silva", + idade: 35, + sexo: "Masculino", + alergias: "Nenhuma conhecida", + historico: [ + { data: "2025-09-10", descricao: "Consulta de rotina – tudo normal" }, + { data: "2025-08-05", descricao: "Exame de sangue – colesterol levemente alto" }, + ], + medicamentos: [ + { nome: "Atorvastatina 10mg", uso: "1x ao dia" }, + ], + }, + { + id: 5, + nome: "Pedro Rocha", + idade: 55, + sexo: "Masculino", + alergias: "Frutos do mar", + historico: [ + { data: "2025-09-18", descricao: "Relatou dor e inchaço no tornozelo esquerdo." }, + { data: "2025-04-11", descricao: "Exames de rotina, sem alterações significativas." }, + ], + medicamentos: [ + { nome: "Nimesulida 100mg", uso: "2x ao dia por 5 dias" }, + ], + }, +]; + +function Prontuario() { + return ( + <> + {pacientes.map((paciente) => ( +
+

Prontuário Médico de {paciente.nome}

+ + {/* ---- Agrupe as seções em um container flex ---- */} +
+
+

Dados do Paciente

+

Nome: {paciente.nome}

+

Idade: {paciente.idade}

+

Sexo: {paciente.sexo}

+

Alergias: {paciente.alergias}

+
+ +
+

Histórico de Consultas

+
    + {paciente.historico.map((item, i) => ( +
  • + {item.data}: {item.descricao} +
    • + ))} +
+
+ +
+

Medicamentos em Uso

+
    + {paciente.medicamentos.map((med, i) => ( +
  • + {med.nome} – {med.uso} +
    • + ))} +
+
+
+
+ ))} + + ); +} + +export default Prontuario; diff --git a/src/PagesMedico/relatorio.jsx b/src/PagesMedico/relatorio.jsx new file mode 100644 index 0000000..bd90bb5 --- /dev/null +++ b/src/PagesMedico/relatorio.jsx @@ -0,0 +1,115 @@ +import React, { useState } from 'react'; +import './styleMedico/geral.css'; + +const mockData = { + atendimentos: [ + { id: 1, paciente: 'Carlos Andrade', data: '2025-09-25', motivo: 'Consulta de rotina', medico: 'Dr. House' }, + { id: 2, paciente: 'Beatriz Costa', data: '2025-09-24', motivo: 'Retorno', medico: 'Dr. Wilson' }, + { id: 3, paciente: 'Juliana Ferreira', data: '2025-09-23', motivo: 'Exames de sangue', medico: 'Dr. House' }, + { id: 4, paciente: 'Marcos Souza', data: '2025-09-22', motivo: 'Consulta de rotina', medico: 'Dr. Cuddy' }, + ], + pacientes: [ + { id: 1, nome: 'Carlos Andrade', idade: 45, cadastro: '2024-03-10' }, + { id: 2, nome: 'Beatriz Costa', idade: 29, cadastro: '2023-11-20' }, + { id: 3, nome: 'Juliana Ferreira', idade: 34, cadastro: '2025-01-15' }, + { id: 4, nome: 'Marcos Souza', idade: 52, cadastro: '2022-07-01' }, + { id: 5, nome: 'Fernanda Lima', idade: 25, cadastro: '2025-08-05' }, + ], +}; + +function Relatorio() { + // ...restante do código igual... + const [tipoRelatorio, setTipoRelatorio] = useState(''); + const [dados, setDados] = useState(null); + const [dataInicio, setDataInicio] = useState(''); + const [dataFim, setDataFim] = useState(''); + + const handleGerarRelatorio = () => { + if (!tipoRelatorio) { + alert('Por favor, selecione um tipo de relatório.'); + return; + } + setDados(mockData[tipoRelatorio] || []); + }; + + const renderizarTabela = () => { + if (!dados) { + return

Selecione os filtros e clique em "Gerar Relatório" para começar.

; + } + + if (dados.length === 0) { + return

Nenhum dado encontrado para os filtros selecionados.

; + } + + const headers = Object.keys(dados[0]); + + return ( + + + + {headers.map(header => )} + + + + {dados.map(item => ( + + {headers.map(header => )} + + ))} + +
{header.toUpperCase()}
{item[header]}
+ ); + }; + + return ( +
+

Página de Relatórios

+ +
+
+ + +
+ +
+ + setDataInicio(e.target.value)} + /> +
+ +
+ + setDataFim(e.target.value)} + /> +
+ + +
+ +
+

Resultado

+ {renderizarTabela()} +
+
+ ); +} + +export default Relatorio; \ No newline at end of file diff --git a/src/PagesMedico/styleMedico/Agendamento.css b/src/PagesMedico/styleMedico/Agendamento.css new file mode 100644 index 0000000..6b887ab --- /dev/null +++ b/src/PagesMedico/styleMedico/Agendamento.css @@ -0,0 +1,151 @@ +/* --- Esconde a barra de unidade e profissional --- */ +.unidade-selecionarprofissional { + display: none; +} + +/* --- Posiciona a barra de busca corretamente --- */ +.busca-atendimento { + display: flex; + align-items: center; /* Alinha os itens verticalmente */ + margin-top: 20px; /* Espaço acima da barra de busca */ + padding: 0 10px; /* Adiciona um padding lateral para alinhar com o resto */ + gap: 15px; +} + +.busca-atendimento > div:first-child { + width: 400px; /* Define um tamanho para a barra de pesquisa */ + display: flex; + align-items: center; +} + +.busca-atendimento input { + margin-left: 8px; + border-radius: 8px; + padding: 8px; + width: 100%; + border: 1px solid #ccc; +} + +.busca-atendimento select { + padding: 8px; + border-radius: 8px; + background-color: #0078d7; + color: white; + font-weight: bold; + border: none; +} + +/* --- Estilos dos botões de Dia, Semana, Mês --- */ +.btn-selecionar-tabeladia, +.btn-selecionar-tabelasemana, +.btn-selecionar-tabelames { + background-color: rgba(231, 231, 231, 0.808); + padding: 8px 10px; + font-size: larger; + font-weight: bold; + border-style: hidden; + cursor: pointer; +} + +.btn-selecionar-tabeladia { + border-radius: 10px 0px 0px 10px; +} + +.btn-selecionar-tabelames { + border-radius: 0px 10px 10px 0px; +} + +.btn-selecionar-tabeladia.ativo, +.btn-selecionar-tabelasemana.ativo, +.btn-selecionar-tabelames.ativo { + background-color: lightcyan; + border-color: darkcyan; + font-weight: bolder; +} + +/* --- Container dos botões e legenda --- */ +.btns-e-legenda-container { + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 10px; + padding: 0 10px; +} + +/* --- Legendas --- */ +.legenda-tabela { + display: flex; + gap: 15px; +} + +#status-card-consulta-realizado, .legenda-item-realizado { + background-color: #b7ffbd; + border: 3px solid #91d392; + padding: 5px; + font-weight: bold; + border-radius: 10px; +} + +#status-card-consulta-cancelado, .legenda-item-cancelado { + background-color: #ffb7cc; + border: 3px solid #ff6c84; + padding: 5px; + font-weight: bold; + border-radius: 10px; +} + +#status-card-consulta-confirmado, .legenda-item-confirmado { + background-color: #eef8fb; + border: 3px solid #d8dfe7; + padding: 5px; + font-weight: bold; + border-radius: 10px; +} + +#status-card-consulta-agendado, .legenda-item-agendado { + background-color: #f7f7c4; + border: 3px solid #f3ce67; + padding: 5px; + font-weight: bold; + border-radius: 10px; +} + +/* --- Estrutura Geral --- */ +.calendario { + border-collapse: collapse; + width: 100%; + border-radius: 10px; + overflow: hidden; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); + border: 1px solid #eee; + background-color: #ffffff; +} + +.calendario-ou-filaespera { + margin-top: 0; +} + +.container-btns-agenda-fila_esepera { + margin-top: 30px; + display: flex; + flex-direction: row; + gap: 20px; + margin-left: 20px; +} + +.btn-fila-espera, +.btn-agenda { + background-color: transparent; + border: 0px; + border-bottom: 3px solid transparent; + padding: 8px; + border-radius: 10px 10px 0px 0px; + font-weight: bold; + cursor: pointer; +} + +.opc-filaespera-ativo, +.opc-agenda-ativo { + color: white; + background-color: #5980fd; +} \ No newline at end of file diff --git a/src/PagesMedico/styleMedico/FilaEspera.css b/src/PagesMedico/styleMedico/FilaEspera.css new file mode 100644 index 0000000..e27086b --- /dev/null +++ b/src/PagesMedico/styleMedico/FilaEspera.css @@ -0,0 +1,97 @@ +/* ===== Fila de Espera ===== */ +.fila-container { + width: 100%; + max-width: none; + margin: 0; /* >>> sem espaço para encostar no topo <<< */ + background: #ffffff; + border-radius: 12px; + padding: 24px; + box-shadow: 0 4px 12px rgba(0,0,0,0.08); + border: 10px solid #ffffff; + box-sizing: border-box; +} + +.fila-titulo { + text-align: center; + font-size: 1.8rem; + font-weight: bold; + margin-bottom: 20px; + color: #333; + border-bottom: 2px solid #e0e0e0; + padding-bottom: 10px; +} + +.fila-tabela { + width: 100%; + border-collapse: collapse; + font-size: 1rem; +} + +.fila-tabela thead { + background-color: #f7fbff; +} + +.fila-tabela th, +.fila-tabela td { + padding: 12px 16px; + text-align: left; + border-bottom: 1px solid #e0e0e0; +} + +.fila-tabela th { + font-weight: bold; + color: #444; + background-color: #f1f1f1 +} + +/* --- Linhas alternadas cinza/branco --- */ +.fila-tabela tbody tr:nth-child(even) { + background-color: #f9f9f9; /* cinza clarinho */ +} +.fila-tabela tbody tr:nth-child(odd) { + background-color: #ffffff; /* branco */ +} + +.fila-tabela tbody tr:hover { + background-color: #f1f6fa; /* hover sutil */ +} + +@media (max-width: 768px) { + .fila-tabela th, .fila-tabela td { + padding: 8px; + font-size: 0.9rem; + } + .fila-titulo { + font-size: 1.5rem; + } +} +.fila-header { + position: relative; + display: flex; + align-items: center; + justify-content: center; /* centraliza o título */ + margin-bottom: 16px; + height: 40px; /* altura da linha */ +} + +.busca-fila-espera { + position: absolute; + left: 0; /* barra na esquerda */ + padding: 6px 12px; + border: 1px solid #ccc; + border-radius: 6px; + font-size: 1rem; + width: 350px; + outline: none; + transition: border-color 0.2s; +} + +.busca-fila-espera:focus { + border-color: #888; +} + +.fila-header h2 { + margin: 0; + font-size: 1.5rem; + text-align: center; +} diff --git a/src/PagesMedico/styleMedico/chat.css b/src/PagesMedico/styleMedico/chat.css new file mode 100644 index 0000000..3f6042c --- /dev/null +++ b/src/PagesMedico/styleMedico/chat.css @@ -0,0 +1,298 @@ +/* --- Variáveis de Estilo Globais --- */ +:root { + --cor-fundo-app: #F9FAFB; + --cor-fundo-sidebar: #FFFFFF; + --cor-fundo-chat: #F9FAFB; + --cor-borda: #E5E7EB; + --cor-texto-principal: #1F2937; + --cor-texto-secundario: #6B7280; + --cor-primaria: #3B82F6; /* Azul */ + --cor-primaria-hover: #2563EB; + --cor-destaque: #EF4444; /* Vermelho para notificações */ + --cor-online: #10B981; /* Verde */ + + --font-principal: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; +} + +/* --- Estilo Base e Container Principal --- */ +.chat-app-container { + display: flex; + height: 100vh; + background-color: var(--cor-fundo-app); + font-family: var(--font-principal); + color: var(--cor-texto-principal); +} + +/* --- Barra Lateral (Sidebar) --- */ +.sidebar { + width: 30%; + min-width: 320px; + max-width: 400px; + height: 100%; + background-color: var(--cor-fundo-sidebar); + border-right: 1px solid var(--cor-borda); + display: flex; + flex-direction: column; +} + +.sidebar-header { + padding: 1rem; + border-bottom: 1px solid var(--cor-borda); + position: sticky; + top: 0; + background-color: var(--cor-fundo-sidebar); + z-index: 10; +} + +.sidebar-header h1 { + font-size: 1.5rem; + font-weight: 700; +} + +.search-container { + position: relative; + margin-top: 1rem; +} + +.search-input { + width: 100%; + padding: 0.5rem 0.5rem 0.5rem 2.5rem; /* Espaço para o ícone */ + border: 1px solid #D1D5DB; + border-radius: 0.5rem; + outline: none; + transition: box-shadow 0.2s; +} +.search-input:focus { + box-shadow: 0 0 0 2px var(--cor-primaria); +} + +.search-icon { + width: 1.25rem; + height: 1.25rem; + color: var(--cor-texto-secundario); + position: absolute; + left: 0.75rem; + top: 50%; + transform: translateY(-50%); +} + +.conversation-list { + flex: 1; + overflow-y: auto; + padding: 0.5rem; +} + +/* --- Item da Lista de Conversas --- */ +.conversation-item { + display: flex; + align-items: center; + padding: 0.75rem; + cursor: pointer; + border-radius: 0.5rem; + transition: background-color 0.2s ease-in-out; +} + +.conversation-item:hover { + background-color: #F3F4F6; +} + +.conversation-item.active { + background-color: var(--cor-primaria); + color: white; +} + +.avatar { + width: 3rem; + height: 3rem; + border-radius: 9999px; + margin-right: 1rem; +} + +.conversation-details { + flex: 1; + min-width: 0; +} + +.conversation-header, .conversation-body { + display: flex; + justify-content: space-between; + align-items: center; +} + +.patient-name { + font-weight: 700; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.timestamp { + font-size: 0.75rem; + color: var(--cor-texto-secundario); +} +.conversation-item.active .timestamp { + color: #D1D5DB; +} + +.last-message { + font-size: 0.875rem; + color: var(--cor-texto-secundario); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + padding-right: 0.5rem; +} +.conversation-item.active .last-message { + color: #E5E7EB; +} + +.unread-badge { + background-color: var(--cor-destaque); + color: white; + font-size: 0.75rem; + font-weight: 700; + border-radius: 9999px; + width: 1.25rem; + height: 1.25rem; + display: flex; + align-items: center; + justify-content: center; + flex-shrink: 0; +} + +/* --- Janela Principal do Chat --- */ +.main-chat { + flex: 1; + display: flex; + flex-direction: column; + height: 100%; +} + +.chat-header { + display: flex; + align-items: center; + padding: 1rem; + border-bottom: 1px solid var(--cor-borda); + background-color: var(--cor-fundo-sidebar); +} +.chat-patient-name { + font-size: 1.125rem; + font-weight: 700; +} +.chat-status { + font-size: 0.875rem; + color: var(--cor-online); +} + +.messages-body { + flex: 1; + overflow-y: auto; + padding: 1.5rem; + background-color: var(--cor-fundo-chat); +} + +.message-footer { + padding: 1rem; + background-color: var(--cor-fundo-sidebar); + border-top: 1px solid var(--cor-borda); +} + +.message-form { + display: flex; + align-items: center; + gap: 1rem; +} + +.message-input { + flex: 1; + padding: 0.75rem 1rem; + border: 1px solid #D1D5DB; + border-radius: 9999px; + outline: none; + transition: box-shadow 0.2s; +} +.message-input:focus { + box-shadow: 0 0 0 2px var(--cor-primaria); +} + +.send-button { + background-color: var(--cor-primaria); + color: white; + padding: 0.75rem; + border: none; + border-radius: 9999px; + cursor: pointer; + transition: background-color 0.2s, transform 0.1s; +} +.send-button:hover { + background-color: var(--cor-primaria-hover); +} +.send-button:active { + transform: scale(0.95); +} + +.send-icon { + width: 1.5rem; + height: 1.5rem; + transform: rotate(90deg); +} + +/* --- Balões de Mensagem --- */ +.message-container { + display: flex; + margin: 0.5rem 0; +} +.message-container.sent { + justify-content: flex-end; +} +.message-container.received { + justify-content: flex-start; +} + +.message-bubble { + max-width: 75%; + padding: 0.75rem 1rem; + border-radius: 1.25rem; +} +.message-text { + font-size: 0.875rem; +} +.message-time { + font-size: 0.75rem; + text-align: right; + margin-top: 0.25rem; + opacity: 0.7; +} + +.message-container.sent .message-bubble { + background-color: var(--cor-primaria); + color: white; + border-bottom-right-radius: 0.25rem; +} + +.message-container.received .message-bubble { + background-color: #E5E7EB; + color: var(--cor-texto-principal); + border-bottom-left-radius: 0.25rem; +} + +/* --- Estado Vazio --- */ +.no-conversation-selected { + display: flex; + align-items: center; + justify-content: center; + height: 100%; + color: var(--cor-texto-secundario); +} + +/* --- Responsividade --- */ +@media (max-width: 768px) { + .main-chat { + display: none; + } + .sidebar { + width: 100%; + min-width: 100%; + max-width: 100%; + } +} diff --git a/src/PagesMedico/styleMedico/geral.css b/src/PagesMedico/styleMedico/geral.css new file mode 100644 index 0000000..94918bd --- /dev/null +++ b/src/PagesMedico/styleMedico/geral.css @@ -0,0 +1,189 @@ +/* --- Estilos Gerais e Reset Básico --- */ +:root { + --cor-primaria: #0078d7; /* Azul principal */ + --cor-fundo: #f4f7f9; /* Cinza bem claro para o fundo da página */ + --cor-card: #ffffff; /* Branco para os cards */ + --cor-texto: #333333; /* Cor principal do texto */ + --cor-borda: #e1e5e8; /* Cor suave para bordas */ + --sombra-card: 0 4px 12px rgba(0, 0, 0, 0.08); /* Sombra sutil */ +} + +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; + background-color: var(--cor-fundo); + color: var(--cor-texto); +} + +h1 { + color: var(--cor-primaria); + margin-bottom: 20px; + padding-bottom: 10px; + border-bottom: 2px solid var(--cor-borda); + font-size: 1.8rem; +} + +h2 { + color: var(--cor-texto); + margin-bottom: 15px; + font-size: 1.3rem; + border-bottom: 1px solid #eee; + padding-bottom: 8px; +} + +/* --- Estilos da Página de Prontuários --- */ + +.prontuario-container { + background-color: var(--cor-card); + border-radius: 10px; + box-shadow: var(--sombra-card); + margin: 2rem; + padding: 2rem; + border: 1px solid var(--cor-borda); +} + +.prontuario-sections { + display: flex; + gap: 2rem; + flex-wrap: wrap; /* Permite que as seções quebrem a linha em telas menores */ +} + +.prontuario-section { + flex: 1; /* Faz com que as seções dividam o espaço igualmente */ + min-width: 300px; /* Largura mínima antes de quebrar a linha */ + background-color: #fdfdfd; + border: 1px solid #f0f0f0; + border-radius: 8px; + padding: 1.5rem; +} + +.prontuario-section ul { + list-style-type: none; /* Remove os marcadores da lista */ +} + +.prontuario-section li { + padding: 10px 0; + border-bottom: 1px solid #f0f0f0; /* Linha separadora entre os itens */ +} + +.prontuario-section li:last-child { + border-bottom: none; /* Remove a linha do último item */ +} + +.prontuario-section p { + line-height: 1.6; + margin-bottom: 10px; +} + +.prontuario-section strong { + color: #555; +} + + +/* --- Estilos da Página de Relatórios --- */ + +.relatorios-container { + background-color: var(--cor-card); + border-radius: 10px; + box-shadow: var(--sombra-card); + margin: 2rem; + padding: 2rem; + border: 1px solid var(--cor-borda); +} + +.filtros-container { + display: flex; + flex-wrap: wrap; + gap: 20px; + align-items: flex-end; /* Alinha os itens na base, fica ótimo com o botão */ + background-color: #f8f9fa; + padding: 20px; + border-radius: 8px; + margin-bottom: 2rem; + border: 1px solid var(--cor-borda); +} + +.filtro-item { + display: flex; + flex-direction: column; + gap: 5px; + flex: 1; + min-width: 180px; +} + +.filtro-item label { + font-weight: 600; + font-size: 0.9em; + color: #555; +} + +.filtro-item input[type="date"], +.filtro-item select { + padding: 10px; + border: 1px solid #ccc; + border-radius: 5px; + font-size: 1rem; + width: 100%; +} + +.btn-gerar { + padding: 10px 25px; + background-color: var(--cor-primaria); + color: white; + border: none; + border-radius: 5px; + font-size: 1rem; + font-weight: bold; + cursor: pointer; + transition: background-color 0.2s ease; +} + +.btn-gerar:hover { + background-color: #005a9e; /* Um tom de azul mais escuro */ +} + +.resultado-container { + margin-top: 2rem; +} + +.info-text { + text-align: center; + padding: 2rem; + color: #777; + font-style: italic; + background-color: #f8f9fa; + border-radius: 8px; +} + +/* Estilização da Tabela de Resultados */ +table { + width: 100%; + border-collapse: collapse; + margin-top: 1rem; +} + +thead th { + background-color: var(--cor-primaria); + color: white; + font-weight: 600; + padding: 12px; + text-align: left; +} + +tbody tr:nth-child(even) { + background-color: #f8f9fa; /* Linhas zebradas */ +} + +tbody tr:hover { + background-color: #e9ecef; /* Efeito ao passar o mouse */ +} + +td { + padding: 12px; + border-bottom: 1px solid var(--cor-borda); +} \ No newline at end of file diff --git a/src/components/Sidebar.jsx b/src/components/Sidebar.jsx index 43b5c5b..ecc49fd 100644 --- a/src/components/Sidebar.jsx +++ b/src/components/Sidebar.jsx @@ -1,5 +1,6 @@ import React, { useState } from "react"; import { Link } from "react-router-dom"; +import menuItems from "../data/sidebar-items-medico.json"; // Use "sidebar-items-secretaria.json" para secretaria e "sidebar-items-adm.json" para ADM // 1. Recebe 'menuItems' e 'onLogout' como props function Sidebar({ menuItems, onLogout }) { diff --git a/src/data/sidebar-items-adm.json b/src/data/sidebar-items-adm.json new file mode 100644 index 0000000..4b38b61 --- /dev/null +++ b/src/data/sidebar-items-adm.json @@ -0,0 +1,60 @@ +[ + { + "name": "Menu", + "isTitle": true + }, + + { + "name":"Início", + "url": "/admin/", + "icon": "house" + }, + + { + "name": "Cadastro de Pacientes", + "url": "/admin/pacientes/cadastro", + "icon": "heart-pulse-fill" + }, + + { + "name": "Cadastro do Médico", + "url": "/admin/medicos/cadastro", + "icon": "capsule" + }, + + { + "name": "Lista de Pacientes", + "icon": "clipboard-heart-fill", + "url": "/admin/pacientes" + }, + + { + "name": "Lista de Médico", + "icon": "hospital-fill", + "url": "/admin/medicos" + }, + { + "name": "Agendar consulta", + "icon": "calendar-plus-fill", + "url": "/admin/agendamento" + }, + + { + "name": "Gestão de Usuários", + "icon": "person-badge-fill", + "url": "/admin/gestao" + }, + + { + "name": "Painel Administrativo", + "icon": "file-bar-graph-fill", + "url": "/admin/painel" + }, + + { + "name": "Laudo do Paciente", + "icon": "table", + "url": "/admin/laudo" + } + +] \ No newline at end of file diff --git a/src/data/sidebar-items-medico.json b/src/data/sidebar-items-medico.json new file mode 100644 index 0000000..4a6717d --- /dev/null +++ b/src/data/sidebar-items-medico.json @@ -0,0 +1,43 @@ +[ + { + "name": "Menu", + "isTitle": true + }, + + { + "name":"Início", + "url": "/medico/", + "icon": "house" + }, + + { + "name": "Prontuário", + "icon": "calendar-plus-fill", + "url": "/medico/prontuario" + }, + + { + "name": "Laudos", + "icon": "table", + "url": "/medico/laudo" + }, +{ + "name": "Seus Agendamentos", + "icon": "calendar", + "url": "/medico/agendamentoMedico" +}, + + { + "name": "Relatórios", + "icon": "file-earmark-text-fill", + "url": "/medico/relatorios" + }, + + { + "name": "Chat com pacientes", + "icon": "chat-dots-fill", + "url": "/medico/chat" + } + + +] diff --git a/src/data/sidebar-items.json b/src/data/sidebar-items-secretaria.json similarity index 94% rename from src/data/sidebar-items.json rename to src/data/sidebar-items-secretaria.json index b2b5e9d..1944cdd 100644 --- a/src/data/sidebar-items.json +++ b/src/data/sidebar-items-secretaria.json @@ -1,35 +1,35 @@ -[ - { - "name": "Menu", - "isTitle": true - }, - - { - "name":"Início", - "url": "/secretaria/inicio", - "icon": "house" - }, - - { - "name": "Lista de Pacientes", - "icon": "clipboard-heart-fill", - "url": "/secretaria/pacientes" - }, - - { - "name": "Lista de Médico", - "icon": "hospital-fill", - "url": "/secretaria/medicos" - }, - { - "name": "Agendar consulta", - "icon": "calendar-plus-fill", - "url": "/secretaria/agendamento" - }, - - { - "name": "Laudo do Paciente", - "icon": "table", - "url": "/secretaria/laudo" - } +[ + { + "name": "Menu", + "isTitle": true + }, + + { + "name":"Início", + "url": "/secretaria/inicio", + "icon": "house" + }, + + { + "name": "Lista de Pacientes", + "icon": "clipboard-heart-fill", + "url": "/secretaria/pacientes" + }, + + { + "name": "Lista de Médico", + "icon": "hospital-fill", + "url": "/secretaria/medicos" + }, + { + "name": "Agendar consulta", + "icon": "calendar-plus-fill", + "url": "/secretaria/agendamento" + }, + + { + "name": "Laudo do Paciente", + "icon": "table", + "url": "/secretaria/laudo" + } ] \ No newline at end of file diff --git a/src/pages/Login.jsx b/src/pages/Login.jsx index 0145951..f93d3ab 100644 --- a/src/pages/Login.jsx +++ b/src/pages/Login.jsx @@ -20,7 +20,7 @@ function Login({ onEnterSystem }) { console.log("Tentando logar com:", form); if (form.username && form.password) { // ...login logic... - navigate('/financeiro/inicio'); + navigate('/admin/inicio'); } else { diff --git a/src/pages/style/Agendamento.css b/src/pages/style/Agendamento.css index 3bb469a..e5d4de4 100644 --- a/src/pages/style/Agendamento.css +++ b/src/pages/style/Agendamento.css @@ -39,7 +39,7 @@ display: flex; flex-direction: row; margin:10px; - justify-content: flex-end; + justify-content: flex-start; } .busca-atendimento select{ diff --git a/src/perfis/Perfil_adm/Perfiladm.jsx b/src/perfis/Perfil_adm/Perfiladm.jsx new file mode 100644 index 0000000..a3c72bb --- /dev/null +++ b/src/perfis/Perfil_adm/Perfiladm.jsx @@ -0,0 +1,47 @@ +import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; +import Sidebar from "../../components/Sidebar"; +import Inicio from "../../pages/Inicio"; +import TablePaciente from "../../pages/TablePaciente"; +import PatientCadastroManager from "../../pages/PatientCadastroManager"; +import DoctorCadastroManager from "../../pages/DoctorCadastroManager"; +import DoctorTable from "../../pages/DoctorTable"; +import Agendamento from "../../pages/Agendamento"; +import LaudoManager from "../../pages/LaudoManager"; +import Details from "../../pages/Details"; +import EditPage from "../../pages/EditPage"; +import DoctorDetails from "../../pages/DoctorDetails"; +import DoctorEditPage from "../../pages/DoctorEditPage"; +import UserDashboard from '../../PagesAdm/gestao.jsx'; +import PainelAdministrativo from '../../PagesAdm/painel.jsx'; +import admItems from "../../data/sidebar-items-adm.json"; +// ...restante do código... +function Perfiladm() { + return ( + +
+ +
+ + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + Página não encontrada} /> + +
+
+ + ); +} + +export default Perfiladm; \ No newline at end of file diff --git a/src/perfis/Perfil_medico/PerfilMedico.jsx b/src/perfis/Perfil_medico/PerfilMedico.jsx new file mode 100644 index 0000000..a3407fd --- /dev/null +++ b/src/perfis/Perfil_medico/PerfilMedico.jsx @@ -0,0 +1,33 @@ +import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; +import Sidebar from "../../components/Sidebar"; + +import Inicio from "../../pages/Inicio"; +import LaudoManager from "../../pages/LaudoManager"; +import Prontuario from "../../PagesMedico/prontuario"; +import Relatorio from "../../PagesMedico/relatorio"; +import Agendamento from "../../PagesMedico/Agendamento"; +import Chat from "../../PagesMedico/Chat"; +import DoctorItems from "../../data/sidebar-items-medico.json"; +// ...existing code... + +function PerfilMedico() { + return ( + +
+ +
+ + } /> + } /> + } /> + } /> + } /> + } /> {/* <-- nova rota */} + +
+
+ + ); +} + +export default PerfilMedico; \ No newline at end of file diff --git a/src/perfis/perfil_secretaria/PerfilSecretaria.jsx b/src/perfis/perfil_secretaria/PerfilSecretaria.jsx index 3bb4343..4928d6a 100644 --- a/src/perfis/perfil_secretaria/PerfilSecretaria.jsx +++ b/src/perfis/perfil_secretaria/PerfilSecretaria.jsx @@ -3,7 +3,7 @@ import { Routes, Route } from "react-router-dom"; import Sidebar from "../../components/Sidebar"; import FinanceiroDashboard from "../../pages/FinanceiroDashboard"; -import SecretariaItems from "../../data/sidebar-items.json"; +import SecretariaItems from "../../data/sidebar-items-secretaria.json"; import Inicio from "../../pages/Inicio"; import TablePaciente from "../../pages/TablePaciente"; import PatientCadastroManager from "../../pages/PatientCadastroManager";