forked from RiseUP/riseup-squad23
agendamento resolvido
This commit is contained in:
commit
23a912e1c0
@ -25,8 +25,16 @@ function Sidebar({ menuItems }) {
|
|||||||
|
|
||||||
const authHeader = getAuthorizationHeader();
|
const authHeader = getAuthorizationHeader();
|
||||||
|
|
||||||
|
let pathname = window.location.pathname.split("/")[1]
|
||||||
|
|
||||||
|
|
||||||
|
// useEffect para definir quais toggle da sidebar devem aparecer
|
||||||
|
useEffect(() => {
|
||||||
|
let teste = localStorage.getItem("roleUser")
|
||||||
|
setRoleUser(teste)
|
||||||
|
|
||||||
|
}, [authHeader])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Detecta se é mobile/tablet
|
// Detecta se é mobile/tablet
|
||||||
@ -37,14 +45,6 @@ function Sidebar({ menuItems }) {
|
|||||||
setIsActive(!mobile);
|
setIsActive(!mobile);
|
||||||
};
|
};
|
||||||
|
|
||||||
const fetchInfoUser = async () => {
|
|
||||||
const InfoUser = await UserInfos(authHeader);
|
|
||||||
console.log(InfoUser.roles, "dados")
|
|
||||||
|
|
||||||
setRoleUser(InfoUser.roles)
|
|
||||||
}
|
|
||||||
|
|
||||||
fetchInfoUser()
|
|
||||||
|
|
||||||
checkScreenSize();
|
checkScreenSize();
|
||||||
window.addEventListener("resize", checkScreenSize);
|
window.addEventListener("resize", checkScreenSize);
|
||||||
@ -117,13 +117,6 @@ function Sidebar({ menuItems }) {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if(roleUser.includes("admin")){
|
|
||||||
console.log("tem")
|
|
||||||
}
|
|
||||||
console.log(roleUser)
|
|
||||||
}, [roleUser])
|
|
||||||
|
|
||||||
const handleLogoutCancel = () => setShowLogoutModal(false);
|
const handleLogoutCancel = () => setShowLogoutModal(false);
|
||||||
|
|
||||||
|
|
||||||
@ -251,26 +244,26 @@ function Sidebar({ menuItems }) {
|
|||||||
<ul className="menu">
|
<ul className="menu">
|
||||||
|
|
||||||
{roleUser.includes("admin") &&
|
{roleUser.includes("admin") &&
|
||||||
<ToggleSidebar perfil={"administrador"} items={admItems}/>
|
<ToggleSidebar perfil={"administrador"} items={admItems} defaultOpen={pathname.includes("admin") } />
|
||||||
}
|
}
|
||||||
{roleUser.includes("admin") || roleUser.includes("secretaria") ?
|
{roleUser.includes("admin") || roleUser.includes("secretaria") ?
|
||||||
<ToggleSidebar perfil={"secretaria"} items={SecretariaItems}/>
|
<ToggleSidebar perfil={"secretaria"} items={SecretariaItems} defaultOpen={pathname.includes("secretaria")} />
|
||||||
:
|
:
|
||||||
null
|
null
|
||||||
}
|
}
|
||||||
|
|
||||||
{roleUser.includes("admin") || roleUser.includes("medico") ?
|
{roleUser.includes("admin") || roleUser.includes("medico") ?
|
||||||
<ToggleSidebar perfil={"medico"} items={DoctorItems}/>
|
<ToggleSidebar perfil={"medico"} items={DoctorItems} defaultOpen={pathname.includes("medico") } />
|
||||||
:null
|
:null
|
||||||
}
|
}
|
||||||
|
|
||||||
{roleUser.includes("admin") || roleUser.includes("financeiro") ?
|
{roleUser.includes("admin") || roleUser.includes("financeiro") ?
|
||||||
<ToggleSidebar perfil={"financeiro"} items={FinanceiroItems}/>
|
<ToggleSidebar perfil={"financeiro"} items={FinanceiroItems} defaultOpen={pathname.includes("financeiro") } />
|
||||||
:null
|
:null
|
||||||
}
|
}
|
||||||
|
|
||||||
{roleUser.includes("admin") || roleUser.includes("paciente") ?
|
{roleUser.includes("admin") || roleUser.includes("paciente") ?
|
||||||
<ToggleSidebar perfil={"paciente"} items={PacienteItems}/>
|
<ToggleSidebar perfil={"paciente"} items={PacienteItems} defaultOpen={pathname.includes("paciente") } />
|
||||||
: null
|
: null
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,10 +1,14 @@
|
|||||||
[
|
[
|
||||||
{
|
{
|
||||||
|
"name": "Início",
|
||||||
|
"icon": "house-fill",
|
||||||
|
"url": "/paciente"
|
||||||
|
},
|
||||||
|
{
|
||||||
"name": "Minhas consulta",
|
"name": "Minhas consulta",
|
||||||
"icon": "calendar-plus-fill",
|
"icon": "calendar-plus-fill",
|
||||||
"url": "/paciente/agendamento"
|
"url": "/paciente/agendamento"
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
"name": "Meus laudos",
|
"name": "Meus laudos",
|
||||||
"icon": "table",
|
"icon": "table",
|
||||||
|
|||||||
@ -276,14 +276,29 @@ const Agendamento = ({ setDictInfo }) => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<h1>Agendar nova consulta</h1>
|
<h1>Gerenciar consultas</h1>
|
||||||
<div className="btns-gerenciamento-e-consulta" style={{ display: 'flex', gap: '10px', marginBottom: '20px' }}>
|
<div className="btns-gerenciamento-e-consulta" style={{ display: 'flex', gap: '10px', marginBottom: '20px' }}>
|
||||||
{/* LIMPA O OBJETO DE EDIÇÃO AO CLICAR EM "ADICIONAR" */}
|
{/* LIMPA O OBJETO DE EDIÇÃO AO CLICAR EM "ADICIONAR" */}
|
||||||
|
<<<<<<< HEAD
|
||||||
<button className="btn btn-primary" onClick={() => {
|
<button className="btn btn-primary" onClick={() => {
|
||||||
setPageConsulta(true);
|
setPageConsulta(true);
|
||||||
setEditingAppointmentId(null);
|
setEditingAppointmentId(null);
|
||||||
|
=======
|
||||||
|
{!PageNovaConsulta ?
|
||||||
|
<button className="btn btn-primary" onClick={() => {
|
||||||
|
setPageConsulta(true);
|
||||||
|
setEditingAppointmentId(null);
|
||||||
|
>>>>>>> b64b664621626393863bd367709ca331df3ec00c
|
||||||
setAppointmentToEdit(null); // <-- LIMPA O OBJETO AQUI PARA GARANTIR MODO CADASTRO
|
setAppointmentToEdit(null); // <-- LIMPA O OBJETO AQUI PARA GARANTIR MODO CADASTRO
|
||||||
}}><i className="bi bi-plus-circle"></i> Adicionar Consulta</button>
|
}}><i className="bi bi-plus-circle"></i> Adicionar Consulta</button>
|
||||||
|
:
|
||||||
|
<button className={"btn btn-primary"} onClick={() => {
|
||||||
|
setPageConsulta(false);
|
||||||
|
}}>
|
||||||
|
Ver consultas
|
||||||
|
</button>
|
||||||
|
|
||||||
|
}
|
||||||
<button className="manage-button btn" onClick={() => navigate("/secretaria/excecoes-disponibilidade")}><i className="bi bi-gear-fill me-1"></i> Gerenciar Exceções</button>
|
<button className="manage-button btn" onClick={() => navigate("/secretaria/excecoes-disponibilidade")}><i className="bi bi-gear-fill me-1"></i> Gerenciar Exceções</button>
|
||||||
<button className='manage-button btn' onClick={() => navigate('/secretaria/disponibilidade')}><i className="bi bi-gear-fill me-1"></i> Mudar Disponibilidade</button>
|
<button className='manage-button btn' onClick={() => navigate('/secretaria/disponibilidade')}><i className="bi bi-gear-fill me-1"></i> Mudar Disponibilidade</button>
|
||||||
</div>
|
</div>
|
||||||
@ -458,6 +473,11 @@ const Agendamento = ({ setDictInfo }) => {
|
|||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
<<<<<<< HEAD
|
||||||
|
|
||||||
export default Agendamento;
|
export default Agendamento;
|
||||||
|
|
||||||
|
=======
|
||||||
|
|
||||||
|
export default Agendamento;
|
||||||
|
>>>>>>> b64b664621626393863bd367709ca331df3ec00c
|
||||||
|
|||||||
@ -4,36 +4,22 @@ import { useParams,Link, useNavigate, useLocation } from "react-router-dom";
|
|||||||
import { GetDoctorByID } from "../components/utils/Functions-Endpoints/Doctor";
|
import { GetDoctorByID } from "../components/utils/Functions-Endpoints/Doctor";
|
||||||
import { useAuth } from "../components/utils/AuthProvider";
|
import { useAuth } from "../components/utils/AuthProvider";
|
||||||
|
|
||||||
const Details = () => {
|
const DoctorDetails = ({doctor}) => {
|
||||||
const {getAuthorizationHeader} = useAuth();
|
const {getAuthorizationHeader} = useAuth();
|
||||||
const [doctor, setDoctor] = useState({});
|
|
||||||
const Parametros = useParams()
|
const Parametros = useParams()
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const location = useLocation();
|
const location = useLocation();
|
||||||
|
|
||||||
const Voltar = () => {
|
|
||||||
|
const Voltar = () => {
|
||||||
const prefixo = location.pathname.split("/")[1];
|
const prefixo = location.pathname.split("/")[1];
|
||||||
navigate(`/${prefixo}/medicos`);
|
navigate(`/${prefixo}/medicos`);
|
||||||
}
|
}
|
||||||
|
|
||||||
const doctorID = Parametros.id
|
|
||||||
useEffect(() => {
|
|
||||||
if (!doctorID) return;
|
|
||||||
|
|
||||||
const authHeader = getAuthorizationHeader()
|
|
||||||
|
|
||||||
GetDoctorByID(doctorID, authHeader)
|
|
||||||
.then((data) => {
|
|
||||||
console.log(data, "médico vindo da API");
|
|
||||||
setDoctor(data[0])
|
|
||||||
; // supabase retorna array
|
|
||||||
})
|
|
||||||
.catch((err) => console.error("Erro ao buscar paciente:", err));
|
|
||||||
|
|
||||||
|
|
||||||
}, [doctorID]);
|
|
||||||
|
|
||||||
//if (!doctor) return <p style={{ textAlign: "center" }}>Carregando...</p>;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@ -156,4 +142,4 @@ const Details = () => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Details;
|
export default DoctorDetails;
|
||||||
|
|||||||
@ -8,49 +8,23 @@ import API_KEY from "../components/utils/apiKeys";
|
|||||||
const ENDPOINT_AVAILABILITY =
|
const ENDPOINT_AVAILABILITY =
|
||||||
"https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctor_availability";
|
"https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctor_availability";
|
||||||
|
|
||||||
const DoctorEditPage = () => {
|
const DoctorEditPage = ({DictInfo}) => {
|
||||||
const { getAuthorizationHeader } = useAuth();
|
const { getAuthorizationHeader } = useAuth();
|
||||||
const [DoctorToPUT, setDoctorPUT] = useState({});
|
const [DoctorToPUT, setDoctorPUT] = useState({});
|
||||||
|
|
||||||
const Parametros = useParams();
|
const Parametros = useParams();
|
||||||
const [searchParams] = useSearchParams();
|
const [searchParams] = useSearchParams();
|
||||||
const DoctorID = Parametros.id;
|
|
||||||
|
const DoctorID = "b24c88b2-1d51-4c04-8fe8-e75c3f2817d1";
|
||||||
const availabilityId = searchParams.get("availabilityId");
|
const availabilityId = searchParams.get("availabilityId");
|
||||||
|
|
||||||
const [availabilityToPATCH, setAvailabilityToPATCH] = useState(null);
|
const [availabilityToPATCH, setAvailabilityToPATCH] = useState(null);
|
||||||
const [mode, setMode] = useState("doctor");
|
const [mode, setMode] = useState("doctor");
|
||||||
|
console.log("teste", DictInfo)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const authHeader = getAuthorizationHeader();
|
setDoctorPUT(DictInfo)
|
||||||
|
}, [DictInfo]);
|
||||||
if (availabilityId) {
|
|
||||||
setMode("availability");
|
|
||||||
|
|
||||||
fetch(`${ENDPOINT_AVAILABILITY}?id=eq.${availabilityId}&select=*`, {
|
|
||||||
method: "GET",
|
|
||||||
headers: {
|
|
||||||
apikey: API_KEY,
|
|
||||||
Authorization: authHeader,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
.then((res) => res.json())
|
|
||||||
.then((data) => {
|
|
||||||
if (data && data.length > 0) {
|
|
||||||
setAvailabilityToPATCH(data[0]);
|
|
||||||
console.log("Disponibilidade vinda da API:", data[0]);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((err) => console.error("Erro ao buscar disponibilidade:", err));
|
|
||||||
} else {
|
|
||||||
setMode("doctor");
|
|
||||||
GetDoctorByID(DoctorID, authHeader)
|
|
||||||
.then((data) => {
|
|
||||||
console.log(data, "médico vindo da API");
|
|
||||||
setDoctorPUT(data[0]);
|
|
||||||
})
|
|
||||||
.catch((err) => console.error("Erro ao buscar paciente:", err));
|
|
||||||
}
|
|
||||||
}, [DoctorID, availabilityId, getAuthorizationHeader]);
|
|
||||||
|
|
||||||
const HandlePutDoctor = async () => {
|
const HandlePutDoctor = async () => {
|
||||||
const authHeader = getAuthorizationHeader();
|
const authHeader = getAuthorizationHeader();
|
||||||
|
|||||||
@ -4,7 +4,7 @@ import { useAuth } from "../components/utils/AuthProvider";
|
|||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
import "./style/TableDoctor.css";
|
import "./style/TableDoctor.css";
|
||||||
|
|
||||||
function TableDoctor() {
|
function TableDoctor({setDictInfo}) {
|
||||||
const { getAuthorizationHeader, isAuthenticated } = useAuth();
|
const { getAuthorizationHeader, isAuthenticated } = useAuth();
|
||||||
|
|
||||||
const [medicos, setMedicos] = useState([]);
|
const [medicos, setMedicos] = useState([]);
|
||||||
@ -437,14 +437,14 @@ function TableDoctor() {
|
|||||||
<td>{medico.email || 'Não informado'}</td>
|
<td>{medico.email || 'Não informado'}</td>
|
||||||
<td>
|
<td>
|
||||||
<div className="d-flex gap-2">
|
<div className="d-flex gap-2">
|
||||||
<Link to={`${medico.id}`}>
|
<Link to={`details`}>
|
||||||
<button className="btn btn-sm btn-view">
|
<button className="btn btn-sm btn-view" onClick={() => setDictInfo({...medico})}>
|
||||||
<i className="bi bi-eye me-1"></i> Ver Detalhes
|
<i className="bi bi-eye me-1"></i> Ver Detalhes
|
||||||
</button>
|
</button>
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
<Link to={`${medico.id}/edit`}>
|
<Link to={`edit`}>
|
||||||
<button className="btn btn-sm btn-edit">
|
<button className="btn btn-sm btn-edit" onClick={() => setDictInfo({...medico})}>
|
||||||
<i className="bi bi-pencil me-1"></i> Editar
|
<i className="bi bi-pencil me-1"></i> Editar
|
||||||
</button>
|
</button>
|
||||||
</Link>
|
</Link>
|
||||||
|
|||||||
@ -1,40 +1,21 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
|
||||||
import PatientForm from '../components/patients/PatientForm'
|
import PatientForm from '../components/patients/PatientForm'
|
||||||
|
|
||||||
import {useEffect, useState} from 'react'
|
import {useEffect, useState} from 'react'
|
||||||
import { GetPatientByID } from '../components/utils/Functions-Endpoints/Patient'
|
import { GetPatientByID } from '../components/utils/Functions-Endpoints/Patient'
|
||||||
import API_KEY from '../components/utils/apiKeys'
|
import API_KEY from '../components/utils/apiKeys'
|
||||||
import {useNavigate, useParams } from 'react-router-dom'
|
import {useNavigate, useParams } from 'react-router-dom'
|
||||||
import { useAuth } from '../components/utils/AuthProvider'
|
import { useAuth } from '../components/utils/AuthProvider'
|
||||||
|
|
||||||
const EditPage = (DictInfo) => {
|
const EditPage = ({DictInfo}) => {
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
const Parametros = useParams()
|
|
||||||
const [PatientToPUT, setPatientPUT] = useState({})
|
const [PatientToPUT, setPatientPUT] = useState({})
|
||||||
|
|
||||||
const { getAuthorizationHeader, isAuthenticated } = useAuth();
|
const { getAuthorizationHeader, isAuthenticated } = useAuth();
|
||||||
console.log(DictInfo, "usuario vindo do set")
|
|
||||||
const PatientID = Parametros.id
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const authHeader = getAuthorizationHeader()
|
setPatientPUT(DictInfo)
|
||||||
console.log(DictInfo.DictInfo.id, "id do cabra")
|
|
||||||
|
|
||||||
GetPatientByID(DictInfo.DictInfo.id, authHeader)
|
|
||||||
.then((data) => {
|
|
||||||
console.log(data[0], "paciente vindo da API");
|
|
||||||
setPatientPUT(data[0]); // supabase retorna array
|
|
||||||
})
|
|
||||||
.catch((err) => console.error("Erro ao buscar paciente:", err));
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}, [DictInfo])
|
}, [DictInfo])
|
||||||
|
|
||||||
|
|
||||||
const HandlePutPatient = async () => {
|
const HandlePutPatient = async () => {
|
||||||
const authHeader = getAuthorizationHeader()
|
const authHeader = getAuthorizationHeader()
|
||||||
|
|
||||||
@ -44,9 +25,9 @@ const HandlePutPatient = async () => {
|
|||||||
myHeaders.append("Authorization", authHeader);
|
myHeaders.append("Authorization", authHeader);
|
||||||
myHeaders.append("Content-Type", "application/json");
|
myHeaders.append("Content-Type", "application/json");
|
||||||
|
|
||||||
var raw = JSON.stringify(PatientToPUT);
|
var raw = JSON.stringify({...PatientToPUT, bmi:Number(PatientToPUT) || null});
|
||||||
|
|
||||||
console.log("Enviando paciente para atualização:", PatientToPUT);
|
console.log("Enviando atualização:", PatientToPUT);
|
||||||
|
|
||||||
var requestOptions = {
|
var requestOptions = {
|
||||||
method: 'PATCH',
|
method: 'PATCH',
|
||||||
@ -55,25 +36,10 @@ const HandlePutPatient = async () => {
|
|||||||
redirect: 'follow'
|
redirect: 'follow'
|
||||||
};
|
};
|
||||||
|
|
||||||
try {
|
fetch(`https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/patients?id=eq.${PatientToPUT.id}`,requestOptions)
|
||||||
const response = await fetch(`https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/patients?id=eq.${PatientID}`,requestOptions);
|
.then(response => response.json)
|
||||||
console.log(response)
|
.then(result => console.log(result))
|
||||||
|
.catch(console.log("erro"))
|
||||||
|
|
||||||
if(response.ok === false){
|
|
||||||
console.error("Erro ao atualizar paciente:");
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
console.log("ATUALIZADO COM SUCESSO");
|
|
||||||
navigate('/secretaria/pacientes')
|
|
||||||
}
|
|
||||||
|
|
||||||
return response;
|
|
||||||
} catch (error) {
|
|
||||||
console.error("Erro ao atualizar paciente:", error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -1,6 +1,8 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect } from 'react';
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
import { FaUser, FaUserPlus, FaCalendarAlt, FaCalendarCheck } from 'react-icons/fa';
|
import { FaUser, FaUserPlus, FaCalendarAlt, FaCalendarCheck } from 'react-icons/fa';
|
||||||
|
import { useAuth } from '../components/utils/AuthProvider';
|
||||||
|
import API_KEY from '../components/utils/apiKeys';
|
||||||
import './style/Inicio.css';
|
import './style/Inicio.css';
|
||||||
|
|
||||||
import { Link } from 'react-router-dom';
|
import { Link } from 'react-router-dom';
|
||||||
@ -8,19 +10,142 @@ import { Link } from 'react-router-dom';
|
|||||||
function Inicio() {
|
function Inicio() {
|
||||||
|
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
const { getAuthorizationHeader, isAuthenticated } = useAuth();
|
||||||
const [pacientes, setPacientes] = useState([]);
|
const [pacientes, setPacientes] = useState([]);
|
||||||
|
const [medicos, setMedicos] = useState([]);
|
||||||
const [agendamentos, setAgendamentos] = useState([]);
|
const [agendamentos, setAgendamentos] = useState([]);
|
||||||
|
const [agendamentosComPacientes, setAgendamentosComPacientes] = useState([]);
|
||||||
|
const [loading, setLoading] = useState(true);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const fetchPacientes = async () => {
|
||||||
|
try {
|
||||||
|
const authHeader = getAuthorizationHeader();
|
||||||
|
|
||||||
|
const myHeaders = new Headers();
|
||||||
|
myHeaders.append("apikey", API_KEY);
|
||||||
|
myHeaders.append("Authorization", authHeader);
|
||||||
|
|
||||||
|
const requestOptions = {
|
||||||
|
method: 'GET',
|
||||||
|
headers: myHeaders,
|
||||||
|
redirect: 'follow'
|
||||||
|
};
|
||||||
|
|
||||||
|
const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/patients", requestOptions);
|
||||||
|
|
||||||
|
if (response.ok) {
|
||||||
|
const data = await response.json();
|
||||||
|
setPacientes(data);
|
||||||
|
console.log('Pacientes carregados:', data.length);
|
||||||
|
} else {
|
||||||
|
console.error(' Erro ao buscar pacientes:', response.status);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error(' Erro ao buscar pacientes:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const fetchMedicos = async () => {
|
||||||
|
try {
|
||||||
|
const authHeader = getAuthorizationHeader();
|
||||||
|
|
||||||
|
const myHeaders = new Headers();
|
||||||
|
myHeaders.append("apikey", API_KEY);
|
||||||
|
myHeaders.append("Authorization", authHeader);
|
||||||
|
|
||||||
|
const requestOptions = {
|
||||||
|
method: 'GET',
|
||||||
|
headers: myHeaders,
|
||||||
|
redirect: 'follow'
|
||||||
|
};
|
||||||
|
|
||||||
|
const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors", requestOptions);
|
||||||
|
|
||||||
|
if (response.ok) {
|
||||||
|
const data = await response.json();
|
||||||
|
setMedicos(data);
|
||||||
|
console.log(' Médicos carregados:', data.length);
|
||||||
|
} else {
|
||||||
|
console.error('Erro ao buscar médicos:', response.status);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error(' Erro ao buscar médicos:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const fetchAgendamentos = async () => {
|
||||||
|
try {
|
||||||
|
const authHeader = getAuthorizationHeader();
|
||||||
|
|
||||||
|
const myHeaders = new Headers();
|
||||||
|
myHeaders.append("apikey", API_KEY);
|
||||||
|
myHeaders.append("Authorization", authHeader);
|
||||||
|
|
||||||
|
const requestOptions = {
|
||||||
|
method: 'GET',
|
||||||
|
headers: myHeaders,
|
||||||
|
redirect: 'follow'
|
||||||
|
};
|
||||||
|
|
||||||
|
const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/appointments", requestOptions);
|
||||||
|
|
||||||
|
if (response.ok) {
|
||||||
|
const data = await response.json();
|
||||||
|
setAgendamentos(data);
|
||||||
|
console.log(' Agendamentos carregados:', data.length);
|
||||||
|
} else {
|
||||||
|
console.error(' Erro ao buscar agendamentos:', response.status);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error(' Erro ao buscar agendamentos:', error);
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (isAuthenticated) {
|
||||||
|
fetchPacientes();
|
||||||
|
fetchMedicos();
|
||||||
|
fetchAgendamentos();
|
||||||
|
}
|
||||||
|
}, [isAuthenticated, getAuthorizationHeader]);
|
||||||
|
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (agendamentos.length > 0 && pacientes.length > 0 && medicos.length > 0) {
|
||||||
|
const agendamentosComNomes = agendamentos.map(agendamento => {
|
||||||
|
const paciente = pacientes.find(p => p.id === agendamento.patient_id);
|
||||||
|
const medico = medicos.find(m => m.id === agendamento.doctor_id);
|
||||||
|
return {
|
||||||
|
...agendamento,
|
||||||
|
nomePaciente: paciente?.full_name || 'Paciente não encontrado',
|
||||||
|
nomeMedico: medico?.full_name || 'Médico não encontrado',
|
||||||
|
especialidadeMedico: medico?.specialty || ''
|
||||||
|
};
|
||||||
|
});
|
||||||
|
setAgendamentosComPacientes(agendamentosComNomes);
|
||||||
|
}
|
||||||
|
}, [agendamentos, pacientes, medicos]);
|
||||||
|
|
||||||
const totalPacientes = pacientes.length;
|
const totalPacientes = pacientes.length;
|
||||||
const novosEsseMes = pacientes.filter(p => p.createdAt && new Date(p.createdAt).getMonth() === new Date().getMonth()).length;
|
const novosEsseMes = pacientes.filter(p => p.created_at && new Date(p.created_at).getMonth() === new Date().getMonth()).length;
|
||||||
|
|
||||||
const hoje = new Date();
|
const hoje = new Date();
|
||||||
const agendamentosDoDia = agendamentos.filter(
|
hoje.setHours(0, 0, 0, 0);
|
||||||
a => a.data && new Date(a.data).getDate() === hoje.getDate()
|
|
||||||
);
|
const agendamentosDoDia = agendamentosComPacientes.filter(a => {
|
||||||
|
if (!a.scheduled_at) return false;
|
||||||
|
const dataAgendamento = new Date(a.scheduled_at);
|
||||||
|
dataAgendamento.setHours(0, 0, 0, 0);
|
||||||
|
return dataAgendamento.getTime() === hoje.getTime();
|
||||||
|
});
|
||||||
|
|
||||||
const agendamentosHoje = agendamentosDoDia.length;
|
const agendamentosHoje = agendamentosDoDia.length;
|
||||||
|
|
||||||
|
|
||||||
|
const pendencias = agendamentos.filter(a => a.status === 'pending' || a.status === 'scheduled').length;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="dashboard-container">
|
<div className="dashboard-container">
|
||||||
<div className="dashboard-header">
|
<div className="dashboard-header">
|
||||||
@ -57,7 +182,7 @@ function Inicio() {
|
|||||||
<div className="stat-card">
|
<div className="stat-card">
|
||||||
<div className="stat-info">
|
<div className="stat-info">
|
||||||
<span className="stat-label">PENDÊNCIAS</span>
|
<span className="stat-label">PENDÊNCIAS</span>
|
||||||
<span className="stat-value">0</span>
|
<span className="stat-value">{loading ? '...' : pendencias}</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="stat-icon-wrapper orange"><FaCalendarAlt className="stat-icon" /></div>
|
<div className="stat-icon-wrapper orange"><FaCalendarAlt className="stat-icon" /></div>
|
||||||
</div>
|
</div>
|
||||||
@ -92,14 +217,54 @@ function Inicio() {
|
|||||||
|
|
||||||
<div className="appointments-section">
|
<div className="appointments-section">
|
||||||
<h2>Próximos Agendamentos</h2>
|
<h2>Próximos Agendamentos</h2>
|
||||||
{agendamentosHoje > 0 ? (
|
{loading ? (
|
||||||
<div>
|
<div className="no-appointments-content">
|
||||||
{agendamentosDoDia.map(agendamento => (
|
<p>Carregando agendamentos...</p>
|
||||||
|
</div>
|
||||||
|
) : agendamentosHoje > 0 ? (
|
||||||
|
<div className="agendamentos-list">
|
||||||
|
{agendamentosDoDia.slice(0, 5).map(agendamento => (
|
||||||
<div key={agendamento.id} className="agendamento-item">
|
<div key={agendamento.id} className="agendamento-item">
|
||||||
<p>{agendamento.nomePaciente}</p>
|
<div className="agendamento-info">
|
||||||
<p>{new Date(agendamento.data).toLocaleTimeString()}</p>
|
<div className="agendamento-time-date">
|
||||||
|
<p className="agendamento-hora">
|
||||||
|
{new Date(agendamento.scheduled_at).toLocaleTimeString('pt-BR', {
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit'
|
||||||
|
})}
|
||||||
|
</p>
|
||||||
|
<p className="agendamento-data">
|
||||||
|
{new Date(agendamento.scheduled_at).toLocaleDateString('pt-BR', {
|
||||||
|
day: '2-digit',
|
||||||
|
month: '2-digit',
|
||||||
|
year: 'numeric'
|
||||||
|
})}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="agendamento-detalhes">
|
||||||
|
<p className="agendamento-paciente">
|
||||||
|
<strong>Paciente:</strong> {agendamento.nomePaciente}
|
||||||
|
</p>
|
||||||
|
<p className="agendamento-medico">
|
||||||
|
<strong>Dr(a):</strong> {agendamento.nomeMedico}
|
||||||
|
{agendamento.especialidadeMedico && ` - ${agendamento.especialidadeMedico}`}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<span className={`agendamento-status status-${agendamento.status}`}>
|
||||||
|
{agendamento.status === 'scheduled' ? 'Agendado' :
|
||||||
|
agendamento.status === 'completed' ? 'Concluído' :
|
||||||
|
agendamento.status === 'pending' ? 'Pendente' :
|
||||||
|
agendamento.status === 'cancelled' ? 'Cancelado' :
|
||||||
|
agendamento.status === 'requested' ? '' : agendamento.status}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
|
{agendamentosHoje > 5 && (
|
||||||
|
<button className="view-all-button" onClick={() => navigate('/secretaria/agendamento')}>
|
||||||
|
Ver todos os {agendamentosHoje} agendamentos
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className="no-appointments-content">
|
<div className="no-appointments-content">
|
||||||
|
|||||||
@ -118,6 +118,7 @@ function Login({ onEnterSystem }) {
|
|||||||
if (data.access_token) {
|
if (data.access_token) {
|
||||||
const UserData = await UserInfos(`bearer ${data.access_token}`);
|
const UserData = await UserInfos(`bearer ${data.access_token}`);
|
||||||
console.log(UserData, "Dados do usuário");
|
console.log(UserData, "Dados do usuário");
|
||||||
|
localStorage.setItem("roleUser", UserData.roles)
|
||||||
|
|
||||||
if (UserData?.roles?.includes("admin")) {
|
if (UserData?.roles?.includes("admin")) {
|
||||||
navigate(`/admin/`);
|
navigate(`/admin/`);
|
||||||
@ -131,7 +132,7 @@ function Login({ onEnterSystem }) {
|
|||||||
navigate(`/paciente/`);
|
navigate(`/paciente/`);
|
||||||
}
|
}
|
||||||
}else{
|
}else{
|
||||||
console.log("ERROROROROROOR")
|
console.log("Erro na tentativa de login")
|
||||||
setShowCabecalho(true)
|
setShowCabecalho(true)
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
273
src/pages/inicioPaciente.jsx
Normal file
273
src/pages/inicioPaciente.jsx
Normal file
@ -0,0 +1,273 @@
|
|||||||
|
import React, { useState, useEffect } from 'react';
|
||||||
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
import { FaCalendarAlt, FaCalendarCheck, FaFileAlt, FaUserMd, FaClock } from 'react-icons/fa';
|
||||||
|
import { useAuth } from '../components/utils/AuthProvider';
|
||||||
|
import API_KEY from '../components/utils/apiKeys';
|
||||||
|
import './style/inicioPaciente.css';
|
||||||
|
|
||||||
|
function InicioPaciente() {
|
||||||
|
const navigate = useNavigate();
|
||||||
|
const { getAuthorizationHeader, isAuthenticated } = useAuth();
|
||||||
|
const [agendamentos, setAgendamentos] = useState([]);
|
||||||
|
const [medicos, setMedicos] = useState([]);
|
||||||
|
const [agendamentosComMedicos, setAgendamentosComMedicos] = useState([]);
|
||||||
|
const [loading, setLoading] = useState(true);
|
||||||
|
const [pacienteId, setPacienteId] = useState(null);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const userId = localStorage.getItem('user_id') || localStorage.getItem('patient_id');
|
||||||
|
setPacienteId(userId);
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const fetchMedicos = async () => {
|
||||||
|
try {
|
||||||
|
const authHeader = getAuthorizationHeader();
|
||||||
|
|
||||||
|
const myHeaders = new Headers();
|
||||||
|
myHeaders.append("apikey", API_KEY);
|
||||||
|
myHeaders.append("Authorization", authHeader);
|
||||||
|
|
||||||
|
const requestOptions = {
|
||||||
|
method: 'GET',
|
||||||
|
headers: myHeaders,
|
||||||
|
redirect: 'follow'
|
||||||
|
};
|
||||||
|
|
||||||
|
const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors", requestOptions);
|
||||||
|
|
||||||
|
if (response.ok) {
|
||||||
|
const data = await response.json();
|
||||||
|
setMedicos(data);
|
||||||
|
console.log(' Médicos carregados:', data.length);
|
||||||
|
} else {
|
||||||
|
console.error(' Erro ao buscar médicos:', response.status);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error(' Erro ao buscar médicos:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const fetchAgendamentos = async () => {
|
||||||
|
try {
|
||||||
|
const authHeader = getAuthorizationHeader();
|
||||||
|
|
||||||
|
const myHeaders = new Headers();
|
||||||
|
myHeaders.append("apikey", API_KEY);
|
||||||
|
myHeaders.append("Authorization", authHeader);
|
||||||
|
|
||||||
|
const requestOptions = {
|
||||||
|
method: 'GET',
|
||||||
|
headers: myHeaders,
|
||||||
|
redirect: 'follow'
|
||||||
|
};
|
||||||
|
|
||||||
|
// Buscar todos os agendamentos (depois filtraremos pelo paciente)
|
||||||
|
const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/appointments", requestOptions);
|
||||||
|
|
||||||
|
if (response.ok) {
|
||||||
|
const data = await response.json();
|
||||||
|
setAgendamentos(data);
|
||||||
|
console.log(' Agendamentos carregados:', data.length);
|
||||||
|
} else {
|
||||||
|
console.error(' Erro ao buscar agendamentos:', response.status);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error(' Erro ao buscar agendamentos:', error);
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (isAuthenticated) {
|
||||||
|
fetchMedicos();
|
||||||
|
fetchAgendamentos();
|
||||||
|
}
|
||||||
|
}, [isAuthenticated, getAuthorizationHeader]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (agendamentos.length > 0 && medicos.length > 0) {
|
||||||
|
const agendamentosComNomes = agendamentos.map(agendamento => {
|
||||||
|
const medico = medicos.find(m => m.id === agendamento.doctor_id);
|
||||||
|
return {
|
||||||
|
...agendamento,
|
||||||
|
nomeMedico: medico?.full_name || 'Médico não encontrado',
|
||||||
|
especialidadeMedico: medico?.specialty || ''
|
||||||
|
};
|
||||||
|
});
|
||||||
|
setAgendamentosComMedicos(agendamentosComNomes);
|
||||||
|
}
|
||||||
|
}, [agendamentos, medicos]);
|
||||||
|
|
||||||
|
const meusAgendamentos = agendamentosComMedicos.filter(a =>
|
||||||
|
pacienteId ? a.patient_id === pacienteId : true
|
||||||
|
);
|
||||||
|
|
||||||
|
const hoje = new Date();
|
||||||
|
hoje.setHours(0, 0, 0, 0);
|
||||||
|
|
||||||
|
const agendamentosFuturos = meusAgendamentos.filter(a => {
|
||||||
|
if (!a.scheduled_at) return false;
|
||||||
|
const dataAgendamento = new Date(a.scheduled_at);
|
||||||
|
return dataAgendamento >= hoje && a.status !== 'cancelled' && a.status !== 'completed';
|
||||||
|
}).sort((a, b) => new Date(a.scheduled_at) - new Date(b.scheduled_at));
|
||||||
|
|
||||||
|
const proximasConsultas = agendamentosFuturos.length;
|
||||||
|
const consultasHoje = agendamentosFuturos.filter(a => {
|
||||||
|
const dataAgendamento = new Date(a.scheduled_at);
|
||||||
|
dataAgendamento.setHours(0, 0, 0, 0);
|
||||||
|
return dataAgendamento.getTime() === hoje.getTime();
|
||||||
|
}).length;
|
||||||
|
|
||||||
|
const consultasPendentes = meusAgendamentos.filter(a =>
|
||||||
|
a.status === 'pending' || a.status === 'requested'
|
||||||
|
).length;
|
||||||
|
|
||||||
|
const historicoConsultas = meusAgendamentos.filter(a =>
|
||||||
|
a.status === 'completed'
|
||||||
|
).length;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="dashboard-paciente-container">
|
||||||
|
<div className="dashboard-paciente-header">
|
||||||
|
<h1>Bem-vindo ao MediConnect</h1>
|
||||||
|
<p>Gerencie suas consultas e acompanhe seu histórico médico</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="stats-paciente-grid">
|
||||||
|
<div className="stat-paciente-card">
|
||||||
|
<div className="stat-paciente-info">
|
||||||
|
<span className="stat-paciente-label">Próximas Consultas</span>
|
||||||
|
<span className="stat-paciente-value">{proximasConsultas}</span>
|
||||||
|
</div>
|
||||||
|
<div className="stat-paciente-icon-wrapper blue">
|
||||||
|
<FaCalendarAlt className="stat-paciente-icon" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="stat-paciente-card">
|
||||||
|
<div className="stat-paciente-info">
|
||||||
|
<span className="stat-paciente-label">Consultas Hoje</span>
|
||||||
|
<span className="stat-paciente-value">{consultasHoje}</span>
|
||||||
|
</div>
|
||||||
|
<div className="stat-paciente-icon-wrapper green">
|
||||||
|
<FaCalendarCheck className="stat-paciente-icon" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="stat-paciente-card">
|
||||||
|
<div className="stat-paciente-info">
|
||||||
|
<span className="stat-paciente-label">Aguardando</span>
|
||||||
|
<span className="stat-paciente-value">{loading ? '...' : consultasPendentes}</span>
|
||||||
|
</div>
|
||||||
|
<div className="stat-paciente-icon-wrapper purple">
|
||||||
|
<FaClock className="stat-paciente-icon" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="stat-paciente-card">
|
||||||
|
<div className="stat-paciente-info">
|
||||||
|
<span className="stat-paciente-label">Realizadas</span>
|
||||||
|
<span className="stat-paciente-value">{historicoConsultas}</span>
|
||||||
|
</div>
|
||||||
|
<div className="stat-paciente-icon-wrapper orange">
|
||||||
|
<FaFileAlt className="stat-paciente-icon" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="quick-actions-paciente">
|
||||||
|
<h2>Acesso Rápido</h2>
|
||||||
|
<div className="actions-paciente-grid">
|
||||||
|
<div className="action-paciente-button" onClick={() => navigate('/paciente/agendamento')}>
|
||||||
|
<FaCalendarCheck className="action-paciente-icon" />
|
||||||
|
<div className="action-paciente-info">
|
||||||
|
<span className="action-paciente-title">Minhas Consultas</span>
|
||||||
|
<span className="action-paciente-desc">Ver todos os agendamentos</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="action-paciente-button" onClick={() => navigate('/paciente/laudo')}>
|
||||||
|
<FaFileAlt className="action-paciente-icon" />
|
||||||
|
<div className="action-paciente-info">
|
||||||
|
<span className="action-paciente-title">Meus Laudos</span>
|
||||||
|
<span className="action-paciente-desc">Acessar documentos médicos</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="action-paciente-button" onClick={() => navigate('/paciente/agendamento')}>
|
||||||
|
<FaUserMd className="action-paciente-icon" />
|
||||||
|
<div className="action-paciente-info">
|
||||||
|
<span className="action-paciente-title">Meus Médicos</span>
|
||||||
|
<span className="action-paciente-desc">Ver histórico de atendimentos</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="proximas-consultas-section">
|
||||||
|
<h2>Próximas Consultas</h2>
|
||||||
|
{loading ? (
|
||||||
|
<div className="no-consultas-content">
|
||||||
|
<p>Carregando suas consultas...</p>
|
||||||
|
</div>
|
||||||
|
) : agendamentosFuturos.length > 0 ? (
|
||||||
|
<div className="consultas-paciente-list">
|
||||||
|
{agendamentosFuturos.slice(0, 3).map(agendamento => (
|
||||||
|
<div key={agendamento.id} className="consulta-paciente-item">
|
||||||
|
<div className="consulta-paciente-info">
|
||||||
|
<div className="consulta-paciente-time-date">
|
||||||
|
<p className="consulta-paciente-hora">
|
||||||
|
{new Date(agendamento.scheduled_at).toLocaleTimeString('pt-BR', {
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit'
|
||||||
|
})}
|
||||||
|
</p>
|
||||||
|
<p className="consulta-paciente-data">
|
||||||
|
{new Date(agendamento.scheduled_at).toLocaleDateString('pt-BR', {
|
||||||
|
day: '2-digit',
|
||||||
|
month: 'short',
|
||||||
|
year: 'numeric'
|
||||||
|
})}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="consulta-paciente-detalhes">
|
||||||
|
<p className="consulta-paciente-medico">
|
||||||
|
<FaUserMd className="consulta-icon" />
|
||||||
|
<strong>Dr(a):</strong> {agendamento.nomeMedico}
|
||||||
|
</p>
|
||||||
|
{agendamento.especialidadeMedico && (
|
||||||
|
<p className="consulta-paciente-especialidade">
|
||||||
|
{agendamento.especialidadeMedico}
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<span className={`consulta-paciente-status status-${agendamento.status}`}>
|
||||||
|
{agendamento.status === 'scheduled' ? 'Confirmado' :
|
||||||
|
agendamento.status === 'pending' ? 'Aguardando' :
|
||||||
|
agendamento.status === 'requested' ? 'Solicitado' : agendamento.status}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
{agendamentosFuturos.length > 3 && (
|
||||||
|
<button className="view-all-paciente-button" onClick={() => navigate('/paciente/agendamento')}>
|
||||||
|
Ver todas as consultas
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div className="no-consultas-content">
|
||||||
|
<FaCalendarCheck className="no-consultas-icon" />
|
||||||
|
<p>Você não tem consultas agendadas</p>
|
||||||
|
<button className="agendar-paciente-button" onClick={() => navigate('/paciente/agendamento/criar')}>
|
||||||
|
Agendar Consulta
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default InicioPaciente;
|
||||||
@ -229,3 +229,191 @@ html[data-bs-theme="dark"] .manage-button {
|
|||||||
html[data-bs-theme="dark"] .manage-button:hover {
|
html[data-bs-theme="dark"] .manage-button:hover {
|
||||||
background-color: #2323b0;
|
background-color: #2323b0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Lista de Agendamentos */
|
||||||
|
.agendamentos-list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-item {
|
||||||
|
background-color: #f9fafb;
|
||||||
|
border-left: 4px solid #5d5dff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 1rem 1.25rem;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-item:hover {
|
||||||
|
background-color: #f0f2f5;
|
||||||
|
transform: translateX(5px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 1.5rem;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-time-date {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
min-width: 90px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-hora {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #5d5dff;
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-data {
|
||||||
|
font-size: 0.75rem;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #888;
|
||||||
|
margin: 0;
|
||||||
|
margin-top: 0.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-detalhes {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.5rem;
|
||||||
|
flex: 1;
|
||||||
|
min-width: 300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-paciente,
|
||||||
|
.agendamento-medico {
|
||||||
|
font-size: 0.95rem;
|
||||||
|
color: #444;
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-paciente strong,
|
||||||
|
.agendamento-medico strong {
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-status {
|
||||||
|
font-size: 0.75rem;
|
||||||
|
font-weight: 600;
|
||||||
|
padding: 0.4rem 0.8rem;
|
||||||
|
border-radius: 20px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-status.status-scheduled {
|
||||||
|
background-color: #e3f2fd;
|
||||||
|
color: #1976d2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-status.status-completed {
|
||||||
|
background-color: #e8f5e9;
|
||||||
|
color: #388e3c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-status.status-pending {
|
||||||
|
background-color: #fff3e0;
|
||||||
|
color: #f57c00;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-status.status-cancelled {
|
||||||
|
background-color: #ffebee;
|
||||||
|
color: #d32f2f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendamento-status.status-requested {
|
||||||
|
background-color: #f3e5f5;
|
||||||
|
color: #7b1fa2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-all-button {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 1rem;
|
||||||
|
background-color: #f0f2f5;
|
||||||
|
color: #5d5dff;
|
||||||
|
border: 2px solid #5d5dff;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 0.75rem 1.5rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-all-button:hover {
|
||||||
|
background-color: #5d5dff;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Dark Mode - Agendamentos */
|
||||||
|
html[data-bs-theme="dark"] .agendamento-item {
|
||||||
|
background-color: #2a2a2a;
|
||||||
|
border-left-color: #6c6cff;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-item:hover {
|
||||||
|
background-color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-hora {
|
||||||
|
color: #8888ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-data {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-paciente,
|
||||||
|
html[data-bs-theme="dark"] .agendamento-medico {
|
||||||
|
color: #d0d0d0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-paciente strong,
|
||||||
|
html[data-bs-theme="dark"] .agendamento-medico strong {
|
||||||
|
color: #e0e0e0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-status.status-scheduled {
|
||||||
|
background-color: #1a3a52;
|
||||||
|
color: #64b5f6;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-status.status-completed {
|
||||||
|
background-color: #1b3a1f;
|
||||||
|
color: #81c784;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-status.status-pending {
|
||||||
|
background-color: #3d2817;
|
||||||
|
color: #ffb74d;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-status.status-cancelled {
|
||||||
|
background-color: #3d1f1f;
|
||||||
|
color: #e57373;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendamento-status.status-requested {
|
||||||
|
background-color: #2d1f3d;
|
||||||
|
color: #ba68c8;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .view-all-button {
|
||||||
|
background-color: #2a2a2a;
|
||||||
|
color: #8888ff;
|
||||||
|
border-color: #6c6cff;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .view-all-button:hover {
|
||||||
|
background-color: #6c6cff;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
454
src/pages/style/inicioPaciente.css
Normal file
454
src/pages/style/inicioPaciente.css
Normal file
@ -0,0 +1,454 @@
|
|||||||
|
.dashboard-paciente-container {
|
||||||
|
padding: 2rem;
|
||||||
|
background-color: #f7f9fc;
|
||||||
|
flex-grow: 1;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Header - Paciente */
|
||||||
|
.dashboard-paciente-header {
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dashboard-paciente-header h1 {
|
||||||
|
font-size: 2rem;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dashboard-paciente-header p {
|
||||||
|
font-size: 1rem;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Estatísticas - Paciente */
|
||||||
|
.stats-paciente-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
||||||
|
gap: 1.5rem;
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-paciente-card {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 1.5rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
|
||||||
|
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-paciente-card:hover {
|
||||||
|
transform: translateY(-3px);
|
||||||
|
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-paciente-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-paciente-label {
|
||||||
|
font-size: 0.75rem;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #888;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-paciente-value {
|
||||||
|
font-size: 2.2rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #444;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-paciente-icon-wrapper {
|
||||||
|
width: 55px;
|
||||||
|
height: 55px;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-paciente-icon {
|
||||||
|
font-size: 1.4rem;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Cores dos ícones - Paciente */
|
||||||
|
.stat-paciente-icon-wrapper.blue { background-color: #5d5dff; }
|
||||||
|
.stat-paciente-icon-wrapper.green { background-color: #30d158; }
|
||||||
|
.stat-paciente-icon-wrapper.purple { background-color: #a272ff; }
|
||||||
|
.stat-paciente-icon-wrapper.orange { background-color: #f1952e; }
|
||||||
|
|
||||||
|
/* Ações Rápidas - Paciente */
|
||||||
|
.quick-actions-paciente h2 {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.actions-paciente-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||||
|
gap: 1.5rem;
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-paciente-button {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 1.5rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s ease-in-out;
|
||||||
|
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-paciente-button:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.12);
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-paciente-icon {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
margin-right: 1.2rem;
|
||||||
|
color: #5d5dff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-paciente-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-paciente-title {
|
||||||
|
font-size: 1.05rem;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #444;
|
||||||
|
margin-bottom: 0.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action-paciente-desc {
|
||||||
|
font-size: 0.85rem;
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Próximas Consultas - Paciente */
|
||||||
|
.proximas-consultas-section {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 2rem;
|
||||||
|
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.proximas-consultas-section h2 {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Lista de Consultas - Paciente */
|
||||||
|
.consultas-paciente-list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-item {
|
||||||
|
background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%);
|
||||||
|
border-left: 5px solid #5d5dff;
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 1.25rem 1.5rem;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-item:hover {
|
||||||
|
background: linear-gradient(135deg, #f0f2f5 0%, #fafbfc 100%);
|
||||||
|
transform: translateX(8px);
|
||||||
|
box-shadow: 0 4px 12px rgba(93, 93, 255, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 2rem;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-time-date {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
min-width: 90px;
|
||||||
|
padding: 0.5rem;
|
||||||
|
background-color: #f0f2ff;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-hora {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #5d5dff;
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-data {
|
||||||
|
font-size: 0.8rem;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #7777aa;
|
||||||
|
margin: 0;
|
||||||
|
margin-top: 0.25rem;
|
||||||
|
text-transform: capitalize;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-detalhes {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.5rem;
|
||||||
|
flex: 1;
|
||||||
|
min-width: 250px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-medico {
|
||||||
|
font-size: 1rem;
|
||||||
|
color: #444;
|
||||||
|
margin: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-icon {
|
||||||
|
color: #5d5dff;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-medico strong {
|
||||||
|
font-weight: 600;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-especialidade {
|
||||||
|
font-size: 0.85rem;
|
||||||
|
color: #666;
|
||||||
|
margin: 0;
|
||||||
|
margin-left: 1.6rem;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-status {
|
||||||
|
font-size: 0.75rem;
|
||||||
|
font-weight: 600;
|
||||||
|
padding: 0.5rem 1rem;
|
||||||
|
border-radius: 20px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-status.status-scheduled {
|
||||||
|
background-color: #e3f2fd;
|
||||||
|
color: #1976d2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-status.status-pending {
|
||||||
|
background-color: #fff3e0;
|
||||||
|
color: #f57c00;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-status.status-requested {
|
||||||
|
background-color: #f3e5f5;
|
||||||
|
color: #7b1fa2;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sem Consultas */
|
||||||
|
.no-consultas-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
text-align: center;
|
||||||
|
padding: 3rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-consultas-icon {
|
||||||
|
font-size: 4rem;
|
||||||
|
color: #bbb;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-consultas-content p {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
color: #666;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendar-paciente-button,
|
||||||
|
.view-all-paciente-button {
|
||||||
|
background-color: #5d5dff;
|
||||||
|
color: #fff;
|
||||||
|
border: none;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 0.875rem 2rem;
|
||||||
|
font-size: 1rem;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.agendar-paciente-button:hover,
|
||||||
|
.view-all-paciente-button:hover {
|
||||||
|
background-color: #4444ff;
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 4px 12px rgba(93, 93, 255, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-all-paciente-button {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 1rem;
|
||||||
|
background-color: #f0f2f5;
|
||||||
|
color: #5d5dff;
|
||||||
|
border: 2px solid #5d5dff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.view-all-paciente-button:hover {
|
||||||
|
background-color: #5d5dff;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Dark Mode - Paciente */
|
||||||
|
html[data-bs-theme="dark"] .dashboard-paciente-container {
|
||||||
|
background-color: #121212;
|
||||||
|
color: #e0e0e0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .dashboard-paciente-header h1,
|
||||||
|
html[data-bs-theme="dark"] .dashboard-paciente-header p,
|
||||||
|
html[data-bs-theme="dark"] .quick-actions-paciente h2,
|
||||||
|
html[data-bs-theme="dark"] .proximas-consultas-section h2,
|
||||||
|
html[data-bs-theme="dark"] .action-paciente-title,
|
||||||
|
html[data-bs-theme="dark"] .stat-paciente-value {
|
||||||
|
color: #e0e0e0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .stat-paciente-card,
|
||||||
|
html[data-bs-theme="dark"] .action-paciente-button,
|
||||||
|
html[data-bs-theme="dark"] .proximas-consultas-section {
|
||||||
|
background-color: #1e1e1e;
|
||||||
|
box-shadow: 0 4px 10px rgba(0,0,0,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .stat-paciente-label,
|
||||||
|
html[data-bs-theme="dark"] .action-paciente-desc,
|
||||||
|
html[data-bs-theme="dark"] .no-consultas-content p {
|
||||||
|
color: #b0b0b0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-item {
|
||||||
|
background: linear-gradient(135deg, #2a2a2a 0%, #1e1e1e 100%);
|
||||||
|
border-left-color: #6c6cff;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-item:hover {
|
||||||
|
background: linear-gradient(135deg, #333 0%, #252525 100%);
|
||||||
|
box-shadow: 0 4px 12px rgba(108, 108, 255, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-time-date {
|
||||||
|
background-color: #2a2a3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-hora {
|
||||||
|
color: #8888ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-data {
|
||||||
|
color: #9999cc;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-medico,
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-especialidade {
|
||||||
|
color: #d0d0d0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-medico strong {
|
||||||
|
color: #e0e0e0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-icon,
|
||||||
|
html[data-bs-theme="dark"] .action-paciente-icon {
|
||||||
|
color: #8888ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-status.status-scheduled {
|
||||||
|
background-color: #1a3a52;
|
||||||
|
color: #64b5f6;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-status.status-pending {
|
||||||
|
background-color: #3d2817;
|
||||||
|
color: #ffb74d;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .consulta-paciente-status.status-requested {
|
||||||
|
background-color: #2d1f3d;
|
||||||
|
color: #ba68c8;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .no-consultas-icon {
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendar-paciente-button {
|
||||||
|
background-color: #6c6cff;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .agendar-paciente-button:hover {
|
||||||
|
background-color: #5555dd;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .view-all-paciente-button {
|
||||||
|
background-color: #2a2a2a;
|
||||||
|
color: #8888ff;
|
||||||
|
border-color: #6c6cff;
|
||||||
|
}
|
||||||
|
|
||||||
|
html[data-bs-theme="dark"] .view-all-paciente-button:hover {
|
||||||
|
background-color: #6c6cff;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsivo */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.dashboard-paciente-container {
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stats-paciente-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.actions-paciente-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-info {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.consulta-paciente-time-date {
|
||||||
|
width: 100%;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -14,10 +14,13 @@ import DoctorEditPage from "../../pages/DoctorEditPage";
|
|||||||
import UserDashboard from '../../PagesAdm/gestao.jsx';
|
import UserDashboard from '../../PagesAdm/gestao.jsx';
|
||||||
import PainelAdministrativo from '../../PagesAdm/painel.jsx';
|
import PainelAdministrativo from '../../PagesAdm/painel.jsx';
|
||||||
import admItems from "../../data/sidebar-items-adm.json";
|
import admItems from "../../data/sidebar-items-adm.json";
|
||||||
|
import {useState} from "react"
|
||||||
|
|
||||||
// ...restante do código...
|
// ...restante do código...
|
||||||
function Perfiladm() {
|
function Perfiladm() {
|
||||||
|
|
||||||
|
const [DictInfo, setDictInfo] = useState({})
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
||||||
<div id="app" className="active">
|
<div id="app" className="active">
|
||||||
@ -27,12 +30,12 @@ function Perfiladm() {
|
|||||||
<Route path="/" element={<UserDashboard />} />
|
<Route path="/" element={<UserDashboard />} />
|
||||||
<Route path="/pacientes/cadastro" element={<PatientCadastroManager />} />
|
<Route path="/pacientes/cadastro" element={<PatientCadastroManager />} />
|
||||||
<Route path="/medicos/cadastro" element={<DoctorCadastroManager />} />
|
<Route path="/medicos/cadastro" element={<DoctorCadastroManager />} />
|
||||||
<Route path="/pacientes" element={<TablePaciente />} />
|
<Route path="/pacientes" element={<TablePaciente setDictInfo={setDictInfo}/>} />
|
||||||
<Route path="/medicos" element={<DoctorTable />} />
|
<Route path="/medicos" element={<DoctorTable setDictInfo={setDictInfo} />} />
|
||||||
<Route path="/pacientes/:id" element={<Details />} />
|
<Route path="/pacientes/details" element={<Details DictInfo={DictInfo} />} />
|
||||||
<Route path="/pacientes/:id/edit" element={<EditPage />} />
|
<Route path="/pacientes/edit" element={<EditPage DictInfo={DictInfo} />} />
|
||||||
<Route path="/medicos/:id" element={<DoctorDetails />} />
|
<Route path="/medicos/details" element={<DoctorDetails DictInfo={DictInfo}/>} />
|
||||||
<Route path="/medicos/:id/edit" element={<DoctorEditPage />} />
|
<Route path="/medicos/edit" element={<DoctorEditPage DictInfo={DictInfo}/>} />
|
||||||
<Route path="/agendamento" element={<Agendamento />} />
|
<Route path="/agendamento" element={<Agendamento />} />
|
||||||
<Route path="/laudo" element={<LaudoManager />} />
|
<Route path="/laudo" element={<LaudoManager />} />
|
||||||
|
|
||||||
|
|||||||
@ -2,6 +2,7 @@ import { Routes, Route } from "react-router-dom";
|
|||||||
import Sidebar from "../../components/Sidebar";
|
import Sidebar from "../../components/Sidebar";
|
||||||
import PacienteItems from "../../data/sidebar-items-paciente.json";
|
import PacienteItems from "../../data/sidebar-items-paciente.json";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
|
import InicioPaciente from "../../pages/inicioPaciente";
|
||||||
import LaudoManager from "../../pages/LaudoManager";
|
import LaudoManager from "../../pages/LaudoManager";
|
||||||
import ConsultaCadastroManager from "../../PagesPaciente/ConsultaCadastroManager";
|
import ConsultaCadastroManager from "../../PagesPaciente/ConsultaCadastroManager";
|
||||||
import ConsultasPaciente from "../../PagesPaciente/ConsultasPaciente";
|
import ConsultasPaciente from "../../PagesPaciente/ConsultasPaciente";
|
||||||
@ -16,7 +17,7 @@ const [dadosConsulta, setConsulta] = useState({})
|
|||||||
|
|
||||||
<div id="main">
|
<div id="main">
|
||||||
<Routes>
|
<Routes>
|
||||||
<Route path="/" element={<LaudoManager />} />
|
<Route path="/" element={<InicioPaciente />} />
|
||||||
<Route path="agendamento" element={<ConsultasPaciente setConsulta={setConsulta}/>} />
|
<Route path="agendamento" element={<ConsultasPaciente setConsulta={setConsulta}/>} />
|
||||||
<Route path="agendamento/criar" element={<ConsultaCadastroManager />} />
|
<Route path="agendamento/criar" element={<ConsultaCadastroManager />} />
|
||||||
<Route path="agendamento/edit" element={<ConsultaEditPage dadosConsulta={dadosConsulta} />} />
|
<Route path="agendamento/edit" element={<ConsultaEditPage dadosConsulta={dadosConsulta} />} />
|
||||||
|
|||||||
@ -31,11 +31,11 @@ function PerfilSecretaria({ onLogout }) {
|
|||||||
<Route path="pacientes/cadastro" element={<PatientCadastroManager />} />
|
<Route path="pacientes/cadastro" element={<PatientCadastroManager />} />
|
||||||
<Route path="medicos/cadastro" element={<DoctorCadastroManager />} />
|
<Route path="medicos/cadastro" element={<DoctorCadastroManager />} />
|
||||||
<Route path="pacientes" element={<TablePaciente setDictInfo={setDictInfo}/>} />
|
<Route path="pacientes" element={<TablePaciente setDictInfo={setDictInfo}/>} />
|
||||||
<Route path="medicos" element={<DoctorTable />} />
|
<Route path="medicos" element={<DoctorTable setDictInfo={setDictInfo} />} />
|
||||||
<Route path="pacientes/details" element={<Details DictInfo={DictInfo}/>} />
|
<Route path="pacientes/details" element={<Details DictInfo={DictInfo}/>} />
|
||||||
<Route path="pacientes/edit" element={<EditPage DictInfo={DictInfo}/>} />
|
<Route path="pacientes/edit" element={<EditPage DictInfo={DictInfo}/>} />
|
||||||
<Route path="medicos/:id" element={<DoctorDetails />} />
|
<Route path="medicos/details" element={<DoctorDetails doctor={DictInfo} />} />
|
||||||
<Route path="medicos/:id/edit" element={<DoctorEditPage />} />
|
<Route path="medicos/edit" element={<DoctorEditPage DictInfo={DictInfo} />} />
|
||||||
<Route path="agendamento" element={<Agendamento setDictInfo={setDictInfo}/>} />
|
<Route path="agendamento" element={<Agendamento setDictInfo={setDictInfo}/>} />
|
||||||
<Route path="agendamento/edit" element={<AgendamentoEditPage setDictInfo={setDictInfo} DictInfo={DictInfo}/>} />
|
<Route path="agendamento/edit" element={<AgendamentoEditPage setDictInfo={setDictInfo} DictInfo={DictInfo}/>} />
|
||||||
<Route path="laudo" element={<LaudoManager />} />
|
<Route path="laudo" element={<LaudoManager />} />
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user