From bd1ea9a206a402652fa7b59c00eb57d3aa5178be Mon Sep 17 00:00:00 2001
From: joao_pedro <jpbrasil763@gmail.com>
Date: Wed, 5 Nov 2025 20:32:27 -0300
Subject: [PATCH] =?UTF-8?q?Funcionalidade=20para=20mudar=20os=20bot=C3=B5e?=
 =?UTF-8?q?s=20se=20for=20cancelled=20ou=20confirmed?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/PagesPaciente/ConsultasPaciente.jsx       |   8 +-
 src/PagesPaciente/style.css                   |   7 +-
 .../AgendarConsulta/CardConsulta.jsx          | 139 +++++++++---------
 3 files changed, 83 insertions(+), 71 deletions(-)

diff --git a/src/PagesPaciente/ConsultasPaciente.jsx b/src/PagesPaciente/ConsultasPaciente.jsx
index 76b22ebb..bad704c6 100644
--- a/src/PagesPaciente/ConsultasPaciente.jsx
+++ b/src/PagesPaciente/ConsultasPaciente.jsx
@@ -191,6 +191,7 @@ 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'>
@@ -203,8 +204,9 @@ const confirmConsulta = (selectedPatientId) => {
                 <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">
@@ -252,13 +254,15 @@ const confirmConsulta = (selectedPatientId) => {
             </table>
         </div>   
             :
+            <div>
+                <h2 className='fila-titulo'>Suas proximas consultas</h2>
 
                <TabelaAgendamentoDia agendamentos={consultasOrganizadas} setDictInfo={setDictInfo} 
                selectedID={selectedID} setSelectedId={setSelectedId} setShowDeleteModal={setShowDeleteModal}
                coresConsultas={coresConsultas} setListaConsultaID={setListaConsultaID}
                listaConsultasID={listaConsultasID} setShowConfirmModal={setShowConfirmModal}
-
                />
+            </div>
             } 
              
                  {showDeleteModal && (
diff --git a/src/PagesPaciente/style.css b/src/PagesPaciente/style.css
index aef1b7ad..2d0b21f6 100644
--- a/src/PagesPaciente/style.css
+++ b/src/PagesPaciente/style.css
@@ -107,6 +107,9 @@
 
 .btns-container{
     display: flex;
-    gap: 10px;
-   
+    gap: 10px;  
 }
+
+.h2-proximos-agendamentos{
+    margin-top: 20px;
+}
\ No newline at end of file
diff --git a/src/components/AgendarConsulta/CardConsulta.jsx b/src/components/AgendarConsulta/CardConsulta.jsx
index 88f15808..f2df8b4b 100644
--- a/src/components/AgendarConsulta/CardConsulta.jsx
+++ b/src/components/AgendarConsulta/CardConsulta.jsx
@@ -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)
 
 
@@ -73,47 +44,81 @@ const CardConsulta = ( {DadosConsulta, TabelaAgendamento, setShowDeleteModal, se
       </div>
 
       <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})
-            }}
+  <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?.medico_nome
+      });
+    }}
+  >
+    <i className="bi bi-pencil me-1"></i>
+  </button>
 
-          >
-            <i className="bi bi-pencil me-1"></i>
-          </button>           
-          {DadosConsulta.status === "cancelled" ? 
-            <button
-              className="btn btn-sm btn-confirm-style"
-                            onClick={() => {
-                console.log(DadosConsulta.id)
-                setShowConfirmModal(true)
-                setSelectedId(DadosConsulta.id);             
-              }}
-            >
-             <i class="bi bi-check-lg"></i>
-            </button>
-            :
-            <button
-              className="btn btn-sm btn-delete-custom-style "
-                            onClick={() => {
-                console.log(DadosConsulta.id)
-                setSelectedId(DadosConsulta.id);
-            
+  {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);
+            setSelectedId(DadosConsulta.id);
+          }}
+        >
+          <i className="bi bi-check-lg"></i>
+        </button>
+      :
 
-               setShowDeleteModal(true);
-
-              }}
-            >
-              <i className="bi bi-trash me-1"></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>
+    </>
+  ) : (
+    // 🧩 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>
       :