Conectando-o-resto-das-API #2

Merged
pedro_afonso merged 3 commits from Conectando-o-resto-das-API into main 2025-09-25 00:21:40 +00:00
9 changed files with 6356 additions and 36 deletions

6151
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -6,7 +6,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<meta name="description" content="Web site created using create-react-app" /> <meta name="description" content="Web site created using create-react-app" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!-- Mazer CSS --> <!-- Mazer CSS -->
@ -21,8 +20,8 @@
<div id="root"></div> <div id="root"></div>
<!-- Mazer JS --> <!-- Mazer JS -->
<script src="%PUBLIC_URL%/vendors/perfect-scrollbar/perfect-scrollbar.min.js"></script> <!-- <script src="%PUBLIC_URL%/vendors/perfect-scrollbar/perfect-scrollbar.min.js"></script>
<script src="%PUBLIC_URL%/js/bootstrap.bundle.min.js"></script> <script src="%PUBLIC_URL%/js/bootstrap.bundle.min.js"></script>
<script src="%PUBLIC_URL%/js/main.js"></script> <script src="%PUBLIC_URL%/js/main.js"></script> -->
</body> </body>
</html> </html>

View File

@ -6,16 +6,6 @@
"src": "favicon.ico", "src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16", "sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon" "type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
} }
], ],
"start_url": ".", "start_url": ".",

View File

@ -1,8 +1,53 @@
import React from "react"; import React, { useState, useEffect } from "react";
import InputMask from "react-input-mask"; import InputMask from "react-input-mask";
import "./style/styleagendamentos.css"; import "./style/styleagendamentos.css";
const FormNovaConsulta = ({ onCancel }) => { const FormNovaConsulta = ({ onCancel, patientID }) => {
const [selectedFile, setSelectedFile] = useState(null);
const [anexos, setAnexos] = useState([]);
const [loadingAnexos, setLoadingAnexos] = useState(false);
useEffect(() => {
if (!patientID) return;
const fetchAnexos = async () => {
setLoadingAnexos(true);
try {
const res = await fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${patientID}/anexos`);
const data = await res.json();
setAnexos(data.data || []);
} catch (err) {
console.error("Erro ao buscar anexos:", err);
} finally {
setLoadingAnexos(false);
}
};
fetchAnexos();
}, [patientID]);
const handleUpload = async () => {
if (!selectedFile) return;
const formData = new FormData();
formData.append("file", selectedFile);
try {
const res = await fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${patientID}/anexos`, {
method: "POST",
body: formData
});
if (res.ok) {
const novoAnexo = await res.json();
setAnexos(prev => [...prev, novoAnexo]);
setSelectedFile(null);
} else {
console.error("Erro ao enviar anexo");
}
} catch (err) {
console.error("Erro ao enviar anexo:", err);
}
};
const handleSubmit = (e) => { const handleSubmit = (e) => {
e.preventDefault(); e.preventDefault();
alert("Agendamento salvo!"); alert("Agendamento salvo!");
@ -55,7 +100,29 @@ const FormNovaConsulta = ({ onCancel }) => {
<h3 className="section-subtitle">Informações adicionais</h3> <h3 className="section-subtitle">Informações adicionais</h3>
<button type="button" className="btn-secondary">Documentos e anexos</button> <button type="button" className="btn-secondary">Documentos e anexos</button>
<label htmlFor="anexo-input" className="btn btn-secondary">Adicionar Anexo</label>
<input
type="file"
id="anexo-input"
className="d-none"
onChange={(e) => setSelectedFile(e.target.files[0])}
/>
{selectedFile && (
<button type="button" className="btn btn-primary ms-2" onClick={handleUpload}>
Enviar
</button>
)}
<div className="anexos-list">
{loadingAnexos ? (
<p>Carregando anexos...</p>
) : (
anexos.map((anexo, index) => (
<div key={index} className="anexo-item">
<span>{anexo.nome || anexo.fileName}</span>
</div>
))
)}
</div>
<h2 className="section-title">Informações do atendimento</h2> <h2 className="section-title">Informações do atendimento</h2>
<label>Nome do profissional *</label> <label>Nome do profissional *</label>

View File

@ -56,7 +56,7 @@ function Sidebar(props) {
props.setCurrentPage('dashboard'); props.setCurrentPage('dashboard');
}} }}
> >
<hi>MediConnect</hi> <h1>MediConnect</h1>
</a> </a>
</div> </div>
<div className="toggler"> <div className="toggler">

View File

@ -167,7 +167,8 @@ function PatientForm({ onSave, onCancel,formData, setFormData }) {
} }
}; };
const handleSubmit = async () => { const handleSubmit = async (e) => {
e.preventDefault();
if (!formData.nome || !formData.cpf || !formData.sexo || !formData.data_nascimento){ if (!formData.nome || !formData.cpf || !formData.sexo || !formData.data_nascimento){
alert('Por favor, preencha Nome ,CPF, Gênero e data de nascimento.'); alert('Por favor, preencha Nome ,CPF, Gênero e data de nascimento.');
return; return;
@ -181,7 +182,7 @@ function PatientForm({ onSave, onCancel,formData, setFormData }) {
} }
onSave({ const pacienteSalvo = await onSave({
...formData, ...formData,
endereco: { endereco: {
cep: enderecoData.cep, cep: enderecoData.cep,
@ -214,8 +215,52 @@ function PatientForm({ onSave, onCancel,formData, setFormData }) {
pacienteVip: formData.pacienteVip, pacienteVip: formData.pacienteVip,
}, },
}); });
};
const pacienteId = pacienteSalvo.id;
try{
if (formData.foto) await uploadFotoPaciente(pacienteId, formData.foto);
if (formData.anexos) await uploadAnexoPaciente(pacienteId, formData.anexos);
alert("Paciente salvo com sucesso!");
} catch (error) {
console.error(error);
alert("Erro ao salvar paciente ou enviar arquivos.");
}
};
const uploadFotoPaciente = async (pacienteId, foto) => {
const formDataUpload = new FormData();
formDataUpload.append('foto', foto);
try {
const res = await fetch(`https://suaapi.com/pacientes/${pacienteId}/foto`, {
method: 'POST',
headers: { 'Authorization': 'Bearer <token>' },
body: formDataUpload
});
if (!res.ok) throw new Error('Erro ao enviar foto');
alert('Foto enviada com sucesso!');
} catch (err) {
console.error(err);
alert('Falha ao enviar foto');
}
};
const uploadAnexoPaciente = async (pacienteId, anexo) => {
const formDataUpload = new FormData();
formDataUpload.append('anexo', anexo);
try {
const res = await fetch(`https://suaapi.com/pacientes/${pacienteId}/anexos`, {
method: 'POST',
headers: { 'Authorization': 'Bearer <token>' },
body: formDataUpload
});
if (!res.ok) throw new Error('Erro ao enviar anexo');
alert('Anexo enviado com sucesso!');
} catch (err) {
console.error(err);
alert('Falha ao enviar anexo');
}
};
return ( return (
<div className="card p-3"> <div className="card p-3">
<h3 className="mb-4 text-center" style={{ fontSize: '2.5rem' }}>MediConnect</h3> <h3 className="mb-4 text-center" style={{ fontSize: '2.5rem' }}>MediConnect</h3>

View File

@ -1,12 +1,13 @@
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom/client';
import './assets/scss/bootstrap.scss'; import './assets/scss/bootstrap.scss';
import './assets/scss/app.scss'; import './assets/scss/app.scss';
import App from './App'; import App from './App';
ReactDOM.render( const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<React.StrictMode> <React.StrictMode>
<App /> <App />
</React.StrictMode>, </React.StrictMode>,
document.getElementById('root')
); );

View File

@ -3,17 +3,69 @@ import avatarPlaceholder from '../assets/images/avatar_placeholder.png';
const Details = ({ patientID, setCurrentPage }) => { const Details = ({ patientID, setCurrentPage }) => {
const [paciente, setPaciente] = useState({}); const [paciente, setPaciente] = useState({});
const [anexos, setAnexos] = useState([]);
const [selectedFile, setSelectedFile] = useState(null);
useEffect(() => { useEffect(() => {
if (!patientID) return; if (!patientID) return;
fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${patientID}`) fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${patientID}`)
.then(res => res.json()) .then(res => res.json())
.then(result => {setPaciente(result.data)}) .then(result => {setPaciente(result.data)})
.catch(err => console.error("Erro ao buscar paciente:", err)); .catch(err => console.error("Erro ao buscar paciente:", err));
fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${patientID}/anexos`)
.then(res => res.json())
.then(data => setAnexos(data.data || []))
.catch(err => console.error("Erro ao buscar anexos:", err));
}, [patientID]); }, [patientID]);
const handleUpload = async () => {
if (!selectedFile) return;
const formData = new FormData();
formData.append('file', selectedFile);
try {
const response = await fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${patientID}/anexos`, {
method: 'POST',
body: formData,
});
if (response.ok) {
const newAnexo = await response.json();
setAnexos(prev => [...prev, newAnexo]);
setSelectedFile(null);
} else {
console.error('Erro ao enviar anexo');
}
} catch (err) {
console.error('Erro ao enviar anexo:', err);
}
};
const handleDelete = async (anexoId) => {
try {
const response = await fetch(
`https://mock.apidog.com/m1/1053378-0-default/pacientes/${patientID}/anexos/${anexoId}`,
{
method: "DELETE",
}
);
if (response.ok) {
setAnexos((prev) => prev.filter((a) => a.id !== anexoId));
} else {
console.error("Erro ao deletar anexo");
}
} catch (err) {
console.error("Erro ao deletar anexo:", err);
}
};
return ( return (
@ -137,7 +189,29 @@ const Details = ({ patientID, setCurrentPage }) => {
</div> </div>
<div className="col-md-6 mb-3"> <div className="col-md-6 mb-3">
<label className="font-extrabold">Anexos do Paciente:</label> <label className="font-extrabold">Anexos do Paciente:</label>
<p>{ "-"}</p> {anexos.length > 0 ?(
<ul>
{anexos.map((anexo) => (
<li key={anexo.id} className="d-flex aling-items-center">
<a href={anexo.url} target="-blank" rel="noopener noreferrer">
{anexo.nome}
</a>
<button className="btn btn-danger btn-sm" onclick={() => handleDelete(anexo.id)} >Remover</button>
</li>
))}
</ul>
) : (
<p>-</p>
)}
</div>
<div className="col-md-6 mb-3">
<label htmlFor="foto-input" className="btn btn-primary" style={{ fontSize: '1rem' }}>
Carregar Um Novo Anexo
</label>
<input
type="file" className="form-control d-none" name="foto" id="foto-input" onChange={(e) => setSelectedFile(e.target.files[0])} accept="image/*"/>
{selectedFile && <span className="ms-2" style={{ fontSize: '1rem' }}>{selectedFile.name}</span>}
<button onClick={handleUpload} className="btn btn-success ms-2">Enviar</button>
</div> </div>
</div> </div>
</div> </div>

View File

@ -18,13 +18,14 @@ function Inicio({ setCurrentPage }) {
}; };
const fetchAgendamentos = async () => { const fetchAgendamentos = async () => {
try { return; // <===serve para que nao cause erro
const res = await fetch(); // try {
const data = await res.json(); // const res = await fetch();
setAgendamentos(data.data); // const data = await res.json();
} catch (error) { // setAgendamentos(data.data);
console.error("Erro ao buscar agendamentos:", error); // } catch (error) {
} // console.error("Erro ao buscar agendamentos:", error);
// }
}; };
fetchPacientes(); fetchPacientes();