Co-authored-by: hjbeu <hjbeu@users.noreply.github.com>

src/components/Sidebar.js

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

src/components/patients/PatientForm.jsx

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import InputMask from "react-input-mask";
 
-function PatientForm({ onSave, onCancel, PatientDict }) {
+function PatientForm({ onSave, onCancel, PatientDict, patientID }) {
 
   const FormatTelefones = (valor) => {
     const digits = String(valor).replace(/\D/g, '').slice(0, 11);
@@ -87,13 +87,18 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
     contato: false,
   });
 
-  // Função para alternar o estado de colapso de uma seção
-  const handleToggleCollapse = (section) => {
-    setCollapsedSections(prevState => ({
-      ...prevState,
-      [section]: !prevState[section]
-    }));
-  };
+    // Estado para anexos existentes
+  const [anexos, setAnexos] = useState([]);
+
+  // GET dos anexos existentes
+  useEffect(() => {
+    if (!PatientDict?.id) return;
+
+    fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${PatientDict.id}/anexos`)
+      .then(res => res.json())
+      .then(data => setAnexos(data))
+      .catch(err => console.error("Erro ao buscar anexos:", err));
+  }, [PatientDict]);
 
   // Lógica para calcular o IMC
   useEffect(() => {
@@ -107,6 +112,13 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
     }
   }, [formData.peso, formData.altura]);
 
+  // Função para alternar o estado de colapso de uma seção
+  const handleToggleCollapse = (section) => {
+    setCollapsedSections(prevState => ({
+      ...prevState,
+      [section]: !prevState[section]
+    }));
+  };
 
   const handleChange = (e) => {
     const { name, value, type, checked, files } = e.target;
@@ -163,6 +175,25 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
     }
   };
 
+    // Enviar anexos
+  const uploadAnexo = () => {
+    if (!formData.anexos) return alert("Selecione um arquivo para enviar.");
+
+    const form = new FormData();
+    form.append("file", formData.anexos);
+
+    fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${PatientDict.id}/anexos`, {
+      method: "POST",
+      body: form
+    })
+      .then(res => res.json())
+      .then(data => {
+        setAnexos(prev => [...prev, data]);
+        setFormData(prev => ({ ...prev, anexos: null }));
+      })
+      .catch(err => console.error("Erro ao enviar anexo:", err));
+  };
+
   const handleSubmit = () => {
     if (!formData.nome || !formData.cpf || !formData.genero || !formData.dataNascimento){
       alert('Por favor, preencha Nome ,CPF, Gênero e data de nascimento.');
@@ -375,17 +406,20 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
             </div>
 
             {/* CAMPOS MOVIDOS */}
-            <div className="col-md-12 mb-3 mt-3">
-              <label style={{ fontSize: '1.1rem' }}>Observações:</label>
-              <textarea className="form-control" name="observacoes" value={formData.observacoes} onChange={handleChange} style={{ fontSize: '1.1rem' }}></textarea>
-            </div>
+
             <div className="col-md-12 mb-3">
-              <label style={{ fontSize: '1.1rem' }}>Anexos do Paciente:</label>
-              <div>
-                <label htmlFor="anexos-input" className="btn btn-secondary" style={{ fontSize: '1.1rem' }}>Escolher arquivo</label>
-                <input type="file" className="form-control d-none" name="anexos" id="anexos-input" onChange={handleChange} />
-                <span className="ms-2" style={{ fontSize: '1.1rem' }}>{formData.anexos ? formData.anexos.name : 'Nenhum arquivo escolhido'}</span>
-              </div>
+              <label>Anexos do Paciente:</label>
+              <input type="file" name="anexos" onChange={handleChange} />
+              <button type="button" onClick={uploadAnexo}>Enviar</button>
+
+              <ul>
+                {anexos.map(a => (
+                  <li key={a.id}>
+                    {a.nome}
+                    <button type="button" onClick={() => deleteAnexo(a.id)}>Excluir</button>
+                  </li>
+                ))}
+              </ul>
             </div>
 
           </div>

src/index.js

@@ -4,9 +4,9 @@ import './assets/scss/bootstrap.scss';
 import './assets/scss/app.scss';
 import App from './App';
 
-ReactDOM.render(
+const root = ReactDOM.createRoot(document.getElementById("root"));
+root.render(
   <React.StrictMode>
     <App />
-  </React.StrictMode>,
-  document.getElementById('root')
+  </React.StrictMode>
 );