This commit is contained in:
pedrofedericoo 2025-11-05 23:25:02 -03:00
commit f332ee0147
12 changed files with 333 additions and 304 deletions

View File

@ -47,7 +47,7 @@ const ConsultaCadastroManager = () => {
"patient_notes": "Prefiro horário pela manhã",
"insurance_provider": Dict.convenio,
"status": Dict.status,
"status": "confirmed",
"created_by": idUsuario
});

View File

@ -191,17 +191,22 @@ const confirmConsulta = (selectedPatientId) => {
<div>
<h1> Gerencie suas consultas</h1>
{/*Adicionei esse className para poder ter o fundo branco presente no style, mesmo não sendo para um form */}
<div className='form-container'>
<div className='btns-container'>
<button className="btn btn-primary" onClick={() => { navigate("criar") }}>
<i className="bi bi-plus-circle"></i> Adicionar Consulta
</button>
{!viewFila ?
<button onClick={() => setViewFila(true)}> Fila de espera</button>
<button onClick={() => setViewFila(true)} className="btn btn-primary">Ver fila de espera</button>
:
<button onClick={() => setViewFila(false)}>Consultas </button>
<button onClick={() => setViewFila(false)} className="btn btn-primary">Ver consultas </button>
}
</div>
<h2>Seus próximos atendimentos</h2>
{viewFila ?
<div className="fila-container">
<div className="fila-header">
@ -233,17 +238,6 @@ const confirmConsulta = (selectedPatientId) => {
<td>{dayjs(item?.created_at).format('DD/MM/YYYY HH:mm')}</td>
<td> <div className="d-flex gap-2">
<button className="btn btn-sm btn-edit"
onClick={() => {
console.log(item, 'item')
navigate(`${2}/edit`)
}}
>
<i className="bi bi-pencil me-1"></i> Editar
</button>
<button
className="btn btn-sm btn-delete"
onClick={() => {
@ -260,13 +254,15 @@ const confirmConsulta = (selectedPatientId) => {
</table>
</div>
:
<div>
<h2 className='fila-titulo'>Suas proximas consultas</h2>
<TabelaAgendamentoDia agendamentos={consultasOrganizadas} listaConsultasID={[]} setDictInfo={setDictInfo}
<TabelaAgendamentoDia agendamentos={consultasOrganizadas} setDictInfo={setDictInfo}
selectedID={selectedID} setSelectedId={setSelectedId} setShowDeleteModal={setShowDeleteModal}
coresConsultas={coresConsultas} setListaConsultaID={setListaConsultaID}
listaConsultasID={listaConsultasID} setShowConfirmModal={setShowConfirmModal}
/>
</div>
}
{showDeleteModal && (

View File

@ -178,11 +178,7 @@ const handleSubmit = (e) => {
<form className="form-agendamento" onSubmit={handleSubmit}>
1
<h2 className="section-title">Informações do atendimento</h2>
<div className="campo-informacoes-atendimento">
<div className="campo-de-input-container"> {/* NOVO CONTAINER PAI */}

View File

@ -104,3 +104,12 @@
background-color: #c82333; /* Um vermelho um pouco mais escuro para o hover */
filter: brightness(90%); /* Alternativa: escurecer um pouco mais */
}
.btns-container{
display: flex;
gap: 10px;
}
.h2-proximos-agendamentos{
margin-top: 20px;
}

View File

@ -15,38 +15,9 @@ const CardConsulta = ( {DadosConsulta, TabelaAgendamento, setShowDeleteModal, se
const [decidirBotton, setDecidirBotton] = useState("")
/* const ids = useMemo(() => {
return {
doctor_id: DadosConsulta?.doctor_id,
patient_id: DadosConsulta?.patient_id,
status: DadosConsulta?.status
};
}, [DadosConsulta]);
*/
/*
useEffect(() => {
const BuscarMedicoEPaciente = async () => {
if (!ids.doctor_id || !ids.patient_id || ids.status === 'nada') return;
try {
const [Doctor, Patient] = await Promise.all([
GetDoctorByID(ids.doctor_id, authHeader),
GetPatientByID(ids.patient_id, authHeader)
]);
setMedico(Doctor?.[0] || null);
setPaciente(Patient?.[0] || null);
} catch (error) {
console.error('Erro ao buscar médico/paciente:', error);
}
};
BuscarMedicoEPaciente();
}, [ids, authHeader]);*/
let nameArrayPaciente = DadosConsulta?.paciente_nome?.split(' ')
let nameArrayMedico = DadosConsulta?.medico_nome?.split(' ')
let indice_cor = listaConsultasID.indexOf(DadosConsulta.id)
@ -74,37 +45,42 @@ const CardConsulta = ( {DadosConsulta, TabelaAgendamento, setShowDeleteModal, se
<div className='actions-container'>
<button className="btn btn-sm btn-edit-custom"
onClick={() => {navigate(`edit`)
console.log(DadosConsulta)
setDictInfo({...DadosConsulta,paciente_cpf:DadosConsulta?.paciente_cpf, paciente_nome:DadosConsulta?.paciente_nome, nome_medico:DadosConsulta?.nome_medico})
onClick={() => {
navigate(`edit`);
console.log(DadosConsulta);
setDictInfo({
...DadosConsulta,
paciente_cpf: DadosConsulta?.paciente_cpf,
paciente_nome: DadosConsulta?.paciente_nome,
nome_medico: DadosConsulta?.medico_nome
});
}}
>
<i className="bi bi-pencil me-1"></i>
</button>
{DadosConsulta.status === "cancelled" ?
{indice_cor !== -1 ? (
// Caso o ID esteja na lista
<>
{coresConsultas[indice_cor] === "cancelled" ?
<button
className="btn btn-sm btn-confirm-style"
onClick={() => {
console.log(DadosConsulta.id)
setShowConfirmModal(true)
console.log(DadosConsulta.id);
setShowConfirmModal(true);
setSelectedId(DadosConsulta.id);
}}
>
<i class="bi bi-check-lg"></i>
<i className="bi bi-check-lg"></i>
</button>
:
<button
className="btn btn-sm btn-delete-custom-style"
onClick={() => {
console.log(DadosConsulta.id)
console.log(DadosConsulta.id);
setSelectedId(DadosConsulta.id);
setShowDeleteModal(true);
}}
>
<i className="bi bi-trash me-1"></i>
@ -112,9 +88,38 @@ const CardConsulta = ( {DadosConsulta, TabelaAgendamento, setShowDeleteModal, se
}
</>
) : (
// 🧩 Caso normal segue a lógica do status
<>
{DadosConsulta.status === "cancelled" ? (
<button
className="btn btn-sm btn-confirm-style"
onClick={() => {
console.log(DadosConsulta.id);
setShowConfirmModal(true);
setSelectedId(DadosConsulta.id);
}}
>
<i className="bi bi-check-lg"></i>
</button>
) : (
<button
className="btn btn-sm btn-delete-custom-style"
onClick={() => {
console.log(DadosConsulta.id);
setSelectedId(DadosConsulta.id);
setShowDeleteModal(true);
}}
>
<i className="bi bi-trash me-1"></i>
</button>
)}
</>
)}
</div>
</div>
:
null

View File

@ -19,7 +19,9 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
const [horarioTermino, setHorarioTermino] = useState('');
const [horariosDisponiveis, sethorariosDisponiveis] = useState([]);
const authHeader = getAuthorizationHeader();
const [status, setStatus] = useState("confirmed")
let authHeader = getAuthorizationHeader()
const FormatCPF = (valor) => {
const digits = String(valor).replace(/\D/g, '').slice(0, 11);
@ -69,16 +71,16 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
}, [authHeader]);
useEffect(() => {
<<<<<<< Updated upstream
ChamarMedicos();
}, [ChamarMedicos]);
=======
console.log("Horario","tessssste" )
if (agendamento?.scheduled_at) {
setHorarioInicio(formatarHora(agendamento.scheduled_at));
}
}, [])
>>>>>>> Stashed changes
useEffect(() => {
ChamarMedicos();
}, [ChamarMedicos]);
useEffect(() => {
if (!agendamento.dataAtendimento || !agendamento.doctor_id) return;
@ -175,11 +177,19 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
const handleCloseModal = () => {
setShowSuccessModal(false);
onSave({ ...agendamento, horarioInicio: horarioInicio });
onSave({ ...agendamento, horarioInicio: horarioInicio, status:status });
};
return (
<div className="form-container">
const handleCheckbox = () => {
if(status === "confirmed"){
setStatus("requested")
}else{
setStatus("confirmed")
}
}
return (<div className="form-container">
{showSuccessModal && (
<div className="modal-overlay">
<div className="modal-content">
@ -203,12 +213,25 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
<div className="campos-informacoes-paciente" id="informacoes-paciente-linha-um">
<div className="campo-de-input">
<label>CPF do paciente</label>
<input type="text" name="paciente_cpf" placeholder="000.000.000-00" onChange={handleChange} value={agendamento.paciente_cpf}/>
<input
type="text"
name="paciente_cpf"
placeholder="000.000.000-00"
onChange={handleChange}
value={agendamento.paciente_cpf}
/>
</div>
<div className="campo-de-input">
<label>Nome *</label>
<input type="text" name="paciente_nome" value={agendamento.paciente_nome} placeholder="Insira o nome do paciente" required onChange={handleChange} />
<input
type="text"
name="paciente_nome"
placeholder="Insira o nome do paciente"
required
onChange={handleChange}
value={agendamento.paciente_nome}
/>
</div>
</div>
@ -241,11 +264,11 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
</div>
{isDropdownOpen && profissionaisFiltrados.length > 0 && (
<div className='dropdown-profissionais'>
<div className="dropdown-profissionais">
{profissionaisFiltrados.map((profissional) => (
<div
key={profissional.id}
className='dropdown-item'
className="dropdown-item"
onClick={() => handleSelectProfissional(profissional)}
>
{profissional.full_name}
@ -257,7 +280,7 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
<div className="tipo_atendimento">
<label>Tipo de atendimento *</label>
<select onChange={handleChange} name="tipo_atendimento" value={agendamento.tipo_atendimento}>
<select name="tipo_atendimento" onChange={handleChange} value={agendamento.tipo_atendimento}>
<option value="presencial">Presencial</option>
<option value="teleconsulta">Teleconsulta</option>
</select>
@ -265,11 +288,16 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
</div>
<section id="informacoes-atendimento-segunda-linha">
<section id="informacoes-atendimento-segunda-linha-esquerda">
<div className="campo-informacoes-atendimento">
<div className="campo-de-input">
<label>Data *</label>
<input type="date" name="dataAtendimento" onChange={handleChange} value={agendamento.dataAtendimento} required />
<input
type="date"
name="dataAtendimento"
onChange={handleChange}
value={agendamento.dataAtendimento}
required
/>
</div>
<div className="linha">
@ -284,11 +312,7 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
>
<option value="" disabled>Selecione a hora de início</option>
{opcoesDeHorario.map((opcao, index) => (
<option
key={index}
value={opcao.value}
disabled={opcao.disabled}
>
<option key={index} value={opcao.value} disabled={opcao.disabled}>
{opcao.label}
{opcao.disabled && " (Indisponível)"}
</option>
@ -296,9 +320,9 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
</select>
</div>
<div className='seletor-wrapper'>
<div className="seletor-wrapper">
<label>Número de Sessões *</label>
<div className='sessao-contador'>
<div className="sessao-contador">
<button
type="button"
onClick={() => setSessoes(prev => Math.max(0, prev - 1))}
@ -307,7 +331,7 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
<i className="bi bi-chevron-compact-left"></i>
</button>
<p className='sessao-valor'>{sessoes}</p>
<p className="sessao-valor">{sessoes}</p>
<button
type="button"
@ -332,54 +356,29 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
</div>
</div>
</div>
<<<<<<< HEAD
</section>
=======
</div>
<div className="linha">
{/* Dropdown de Início (Não modificado) */}
<div className="campo-de-input">
<label htmlFor="inicio">Início *</label>
<select
id="inicio"
name="inicio"
value={horarioInicio}
onChange={(e) => setHorarioInicio(e.target.value)}
>
<option value="" disabled>Selecione a hora de início</option>
{opcoesDeHorario?.map((opcao, index) => (
<option
key={index}
value={opcao.value}
disabled={opcao.disabled}
>
{opcao.label}
{opcao.disabled && " (Indisponível)"}
</option>
))}
</select>
</div>
>>>>>>> melhoriasAgendamentos
<section className="informacoes-atendimento-segunda-linha-direita">
<div className="campo-de-input">
<div className="campo-de-input observacoes">
<label>Observações</label>
<textarea name="observacoes" rows="4" cols="1" onChange={handleChange} value={agendamento.observacoes || ''}></textarea>
<textarea
name="observacoes"
rows="4"
cols="1"
onChange={handleChange}
value={agendamento.observacoes || ''}
/>
</div>
</section>
</section>
<div className="campo-de-input-check">
<input
className="form-check-input form-custom-check"
type="checkbox"
name="status"
onChange={handleChange}
checked={agendamento.status === 'requested'}
onChange={handleCheckbox}
checked={status === "requested"}
/>
<label className="form-check-label checkbox-label" htmlFor="status">
Adicionar a fila de espera
Adicionar à fila de espera
</label>
</div>
@ -389,6 +388,7 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
</div>
</form>
</div>
);
};

View File

@ -220,6 +220,9 @@ const TabelaAgendamentoMes = ({ ListarDiasdoMes, agendamentos, setShowDeleteModa
{
semana && typeof semana === "object" && Object.keys(semana).map((dia) => (
<td key={dia} >
<div className='dia-tabelamensal'>
<p> {(semana[dia]|| [])[0]?.scheduled_at.split("-")[2].split("T")[0]}</p>
</div>
<CardConsulta TabelaAgendamento={'mes'} DadosConsulta={((semana[dia]|| [])[0]) || {status:'vazio'}} setShowDeleteModal={setShowDeleteModal} setSelectedId={setSelectedId} setDictInfo={setDictInfo} setShowConfirmModal={setShowConfirmModal} coresConsultas={coresConsultas} setListaConsultaID={setListaConsultaID} listaConsultasID={listaConsultasID}/>
<CardConsulta TabelaAgendamento={'mes'} DadosConsulta={((semana[dia]|| [])[1]) || {status:'vazio'}} setShowDeleteModal={setShowDeleteModal} setSelectedId={setSelectedId} setDictInfo={setDictInfo} setShowConfirmModal={setShowConfirmModal} coresConsultas={coresConsultas} setListaConsultaID={setListaConsultaID} listaConsultasID={listaConsultasID}/>
<CardConsulta TabelaAgendamento={'mes'} DadosConsulta={((semana[dia]|| [])[2]) || {status:'vazio'}} setShowDeleteModal={setShowDeleteModal} setSelectedId={setSelectedId} setDictInfo={setDictInfo} setShowConfirmModal={setShowConfirmModal} coresConsultas={coresConsultas} setListaConsultaID={setListaConsultaID} listaConsultasID={listaConsultasID}/>

View File

@ -55,10 +55,7 @@
/* 7. Estilos para os ícones dentro dos botões (já está no JSX com fs-4) */
/* .fs-4 do Bootstrap já cuida do tamanho do ícone. Se precisar de mais controle, adicione aqui. */
.action-button .bi {
/* Exemplo: se precisar de um ajuste fino além do fs-4 */
/* font-size: 1.5rem; */
}
.btn-confirm-style{
background-color: #5ce687;
@ -70,3 +67,21 @@
border: #91d392;
}
/* Aplique isso às classes que contêm os nomes do Médico e do Paciente */
.cardconsulta-infosecundaria p,
.cardconsulta-infoprimaria p {
/* 1. Força o texto a não quebrar para a próxima linha */
white-space: nowrap;
/* 2. Oculta qualquer texto que ultrapasse a largura do contêiner */
overflow: hidden;
/* 3. Adiciona reticências (...) ao final do texto truncado */
text-overflow: ellipsis;
}
.tabelamensal .container-cardconsulta{
width: 24rem;
}

View File

@ -231,3 +231,9 @@ html[data-bs-theme="dark"] .cards-que-faltam {
}
.dia-tabelamensal p {
font-weight: bold; /* Deixa o número em negrito */
color: #0078d7; /* Garante que seja preto */
font-size: 16px; /* Ajuste o tamanho para harmonizar com o restante */
/* Adicione a mesma família de fonte usada para o restante do app, se necessário */
}

View File

@ -325,7 +325,7 @@ useEffect(() => {
return (
<div>
<div className='spinner'></div>
<h1>Agendar nova consulta</h1>
<div className="btns-gerenciamento-e-consulta" style={{ display: 'flex', gap: '10px', marginBottom: '20px' }}>
@ -355,8 +355,8 @@ useEffect(() => {
<div className='busca-atendimento-container'>
<div className='input-e-dropdown-wrapper'>
<div className='busca-atendimento'>
<div>
<i className="fa-solid fa-calendar-day"></i>
<div className='col-md-6 mb-3'>
<input
type="text"
placeholder="Filtrar atendimento por médico..."

View File

@ -43,6 +43,7 @@ const AgendamentoCadastroManager = ({setPageConsulta, Dict}) => {
myHeaders.append("Content-Type", "application/json");
var raw = JSON.stringify({
"patient_id": Dict.patient_id,
"doctor_id": Dict.doctor_id,
"scheduled_at": `${Dict.dataAtendimento}T${Dict.horarioInicio}:00.000Z`,

View File

@ -194,9 +194,7 @@ html[data-bs-theme="dark"] {
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}
.unidade-selecionarprofissional input,
.unidade-selecionarprofissional select,
.busca-atendimento select,
.busca-atendimento input {
background-color: #2c2c2c;
color: #e0e0e0;