Merge branch 'main' of https://git.popcode.com.br/RiseUP/riseup-squad23

src/PagesPaciente/ConsultaCadastroManager.jsx

@@ -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
     });
     

src/PagesPaciente/ConsultasPaciente.jsx

@@ -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">
@@ -231,18 +236,7 @@ const confirmConsulta = (selectedPatientId) => {
                     <td><p>{item?.paciente_cpf} </p></td>
                     <td><p>{item?.medico_nome} </p></td>
                     <td>{dayjs(item?.created_at).format('DD/MM/YYYY HH:mm')}</td> 
-                    <td> <div className="d-flex gap-2">
+                    <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"
@@ -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 && (

src/PagesPaciente/FormConsultaPaciente.jsx

@@ -177,12 +177,8 @@ const handleSubmit = (e) => {
     <div className="form-container">
       
 
-      <form className="form-agendamento" onSubmit={handleSubmit}>
+      <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 */}

src/PagesPaciente/style.css

@@ -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;
+}

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"
+  <button className="btn btn-sm btn-edit-custom"
-            
+    onClick={() => {
-            onClick={() => {navigate(`edit`)
+      navigate(`edit`);
-                
+      console.log(DadosConsulta);
-              console.log(DadosConsulta)
+      setDictInfo({
-              setDictInfo({...DadosConsulta,paciente_cpf:DadosConsulta?.paciente_cpf, paciente_nome:DadosConsulta?.paciente_nome, nome_medico:DadosConsulta?.nome_medico})
+        ...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>
 
-          >
+  {indice_cor !== -1 ? (
-            <i className="bi bi-pencil me-1"></i>
+    // ✅ Caso o ID esteja na lista
-          </button>           
+    <>
-          {DadosConsulta.status === "cancelled" ? 
+    {coresConsultas[indice_cor] === "cancelled" ?
-            <button
+        <button
-              className="btn btn-sm btn-confirm-style"
+          className="btn btn-sm btn-confirm-style"
-                            onClick={() => {
+          onClick={() => {
-                console.log(DadosConsulta.id)
+            console.log(DadosConsulta.id);
-                setShowConfirmModal(true)
+            setShowConfirmModal(true);
-                setSelectedId(DadosConsulta.id);             
+            setSelectedId(DadosConsulta.id);
-              }}
+          }}
-            >
+        >
-             <i class="bi bi-check-lg"></i>
+          <i className="bi bi-check-lg"></i>
-            </button>
+        </button>
-            :
+      :
-            <button
-              className="btn btn-sm btn-delete-custom-style "
-                            onClick={() => {
-                console.log(DadosConsulta.id)
-                setSelectedId(DadosConsulta.id);
-            
 
-               setShowDeleteModal(true);
+       <button
-
+          className="btn btn-sm btn-delete-custom-style"
-              }}
+          onClick={() => {
-            >
+            console.log(DadosConsulta.id);
-              <i className="bi bi-trash me-1"></i>
+            setSelectedId(DadosConsulta.id);
-            </button>
+            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>
       : 

src/components/AgendarConsulta/FormNovaConsulta.jsx

@@ -19,8 +19,10 @@ 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);
     return digits
@@ -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,220 +177,218 @@ const FormNovaConsulta = ({ onCancel, onSave, setAgendamento, agendamento }) =>
 
   const handleCloseModal = () => {
     setShowSuccessModal(false);
-    onSave({ ...agendamento, horarioInicio: horarioInicio });
+    onSave({ ...agendamento, horarioInicio: horarioInicio, status:status });
   };
 
-  return (
+  const handleCheckbox = () => {
-    <div className="form-container">
+    if(status === "confirmed"){
-      {showSuccessModal && (
+      setStatus("requested")
-        <div className="modal-overlay">
+    }else{
-          <div className="modal-content">
+      setStatus("confirmed")
-            <div className="modal-header">
+    }
-              <h5 className="modal-title">Sucesso</h5>
+  
-              <button onClick={handleCloseModal} className="modal-close-btn">×</button>
+  }
-            </div>
+
-            <div className="modal-body">
+  return (<div className="form-container">
-              <p className="modal-message">Agendamento salvo com sucesso!</p>
+  {showSuccessModal && (
-            </div>
+    <div className="modal-overlay">
-            <div className="modal-footer">
+      <div className="modal-content">
-              <button onClick={handleCloseModal} className="modal-confirm-btn">Fechar</button>
+        <div className="modal-header">
-            </div>
+          <h5 className="modal-title">Sucesso</h5>
-          </div>
+          <button onClick={handleCloseModal} className="modal-close-btn">×</button>
         </div>
-      )}
+        <div className="modal-body">
-
+          <p className="modal-message">Agendamento salvo com sucesso!</p>
-      <form className="form-agendamento" onSubmit={handleSubmit}>
-        <h2 className="section-title">Informações do paciente</h2>
-
-        <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}/>
-          </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} />
-          </div>        
         </div>
-
+        <div className="modal-footer">
-        <div className="campos-informacoes-paciente" id="informacoes-paciente-linha-tres">
+          <button onClick={handleCloseModal} className="modal-confirm-btn">Fechar</button>
-          <div>
-            <label>Convênio</label>
-            <select name="convenio" onChange={handleChange} value={agendamento.insurance_provider}>
-              <option value="publico">Público</option>
-              <option value="unimed">Unimed</option>
-              <option value="bradesco_saude">Bradesco Saúde</option>
-              <option value="hapvida">Hapvida</option>
-            </select>
-          </div>
         </div>
-      
+      </div>
-        <h2 className="section-title">Informações do atendimento</h2>
+    </div>
+  )}
 
-        <div className="campo-informacoes-atendimento">
+  <form className="form-agendamento" onSubmit={handleSubmit}>
-          <div className="campo-de-input-container">
+    <h2 className="section-title">Informações do paciente</h2>
-            <div className="campo-de-input">
-              <label>Nome do profissional *</label>
-              <input 
-                type="text" 
-                name="nome_medico"
-                onChange={handleSearchProfissional} 
-                value={agendamento?.nome_medico || ''} 
-                autoComplete="off"
-                required 
-              />
-            </div>
 
-            {isDropdownOpen && profissionaisFiltrados.length > 0 && (
+    <div className="campos-informacoes-paciente" id="informacoes-paciente-linha-um">
-              <div className='dropdown-profissionais'>
+      <div className="campo-de-input">
-                {profissionaisFiltrados.map((profissional) => (
+        <label>CPF do paciente</label> 
-                  <div 
+        <input
-                    key={profissional.id}
+          type="text"
-                    className='dropdown-item'
+          name="paciente_cpf"
-                    onClick={() => handleSelectProfissional(profissional)}
+          placeholder="000.000.000-00"
-                  >
+          onChange={handleChange}
-                    {profissional.full_name}
+          value={agendamento.paciente_cpf}
-                  </div>
+        />
-                ))}
+      </div>
-              </div>
-            )}
-          </div>
-        
-          <div className="tipo_atendimento">
-            <label>Tipo de atendimento *</label>
-            <select onChange={handleChange} name="tipo_atendimento" value={agendamento.tipo_atendimento}>
-              <option value="presencial">Presencial</option>
-              <option value="teleconsulta">Teleconsulta</option>
-            </select>
-          </div>
-        </div>
 
-        <section id="informacoes-atendimento-segunda-linha">
+      <div className="campo-de-input">
-          <section id="informacoes-atendimento-segunda-linha-esquerda">
+        <label>Nome *</label>
-            <div className="campo-informacoes-atendimento">
+        <input
-              <div className="campo-de-input">
+          type="text"
-                <label>Data *</label>
+          name="paciente_nome"
-                <input type="date" name="dataAtendimento" onChange={handleChange} value={agendamento.dataAtendimento} required />
+          placeholder="Insira o nome do paciente"
-              </div>
+          required
+          onChange={handleChange}
+          value={agendamento.paciente_nome}
+        />
+      </div>
+    </div>
 
-              <div className="linha">
+    <div className="campos-informacoes-paciente" id="informacoes-paciente-linha-tres">
-                <div className="campo-de-input">
+      <div>
-                  <label htmlFor="inicio">Início *</label>
+        <label>Convênio</label>
-                  <select 
+        <select name="convenio" onChange={handleChange} value={agendamento.insurance_provider}>
-                    id="inicio"
+          <option value="publico">Público</option>
-                    name="inicio" 
+          <option value="unimed">Unimed</option>
-                    required
+          <option value="bradesco_saude">Bradesco Saúde</option>
-                    value={horarioInicio}
+          <option value="hapvida">Hapvida</option>
-                    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>
-
-                <div className='seletor-wrapper'>
-                  <label>Número de Sessões *</label>
-                  <div className='sessao-contador'>
-                    <button 
-                      type="button"
-                      onClick={() => setSessoes(prev => Math.max(0, prev - 1))}
-                      disabled={sessoes === 0}
-                    > 
-                      <i className="bi bi-chevron-compact-left"></i>
-                    </button>
-                    
-                    <p className='sessao-valor'>{sessoes}</p>
-                    
-                    <button 
-                      type="button"
-                      onClick={() => setSessoes(prev => Math.min(3, prev + 1))}
-                      disabled={sessoes === 3}
-                    >  
-                      <i className="bi bi-chevron-compact-right"></i>
-                    </button>
-                  </div>
-                </div>
-
-                <div className="campo-de-input">
-                  <label htmlFor="termino">Término *</label>
-                  <input
-                    type="text"
-                    id="termino"
-                    name="termino"
-                    value={horarioTermino || '— —'}
-                    readOnly
-                    className="horario-termino-readonly"
-                  />
-                </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>
     </div>
->>>>>>> melhoriasAgendamentos
 
-          <section className="informacoes-atendimento-segunda-linha-direita"> 
+    <h2 className="section-title">Informações do atendimento</h2>
-            <div className="campo-de-input">
-              <label>Observações</label>
-              <textarea name="observacoes" rows="4" cols="1" onChange={handleChange} value={agendamento.observacoes || ''}></textarea>
-            </div>
-          </section>
-        </section>
 
-        <div className="campo-de-input-check">
+    <div className="campo-informacoes-atendimento">
-          <input 
+      <div className="campo-de-input-container">
-            className="form-check-input form-custom-check" 
+        <div className="campo-de-input">
-            type="checkbox" 
+          <label>Nome do profissional *</label>
-            name="status" 
+          <input
-            onChange={handleChange}
+            type="text"
-            checked={agendamento.status === 'requested'}
+            name="nome_medico"
+            onChange={handleSearchProfissional}
+            value={agendamento?.nome_medico || ''}
+            autoComplete="off"
+            required
           />
-          <label className="form-check-label checkbox-label" htmlFor="status">
-            Adicionar a fila de espera
-          </label>
         </div>
 
-        <div className="form-actions">
+        {isDropdownOpen && profissionaisFiltrados.length > 0 && (
-          <button type="submit" className="btn-primary">Salvar agendamento</button>
+          <div className="dropdown-profissionais">
-          <button type="button" className="btn-cancel" onClick={onCancel}>Cancelar</button>
+            {profissionaisFiltrados.map((profissional) => (
-        </div>
+              <div
-      </form>
+                key={profissional.id}
+                className="dropdown-item"
+                onClick={() => handleSelectProfissional(profissional)}
+              >
+                {profissional.full_name}
+              </div>
+            ))}
+          </div>
+        )}
+      </div>
+
+      <div className="tipo_atendimento">
+        <label>Tipo de atendimento *</label>
+        <select name="tipo_atendimento" onChange={handleChange} value={agendamento.tipo_atendimento}>
+          <option value="presencial">Presencial</option>
+          <option value="teleconsulta">Teleconsulta</option>
+        </select>
+      </div>
     </div>
+
+    <section id="informacoes-atendimento-segunda-linha">
+      <div className="campo-informacoes-atendimento">
+        <div className="campo-de-input">
+          <label>Data *</label>
+          <input
+            type="date"
+            name="dataAtendimento"
+            onChange={handleChange}
+            value={agendamento.dataAtendimento}
+            required
+          />
+        </div>
+
+        <div className="linha">
+          <div className="campo-de-input">
+            <label htmlFor="inicio">Início *</label>
+            <select
+              id="inicio"
+              name="inicio"
+              required
+              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>
+
+          <div className="seletor-wrapper">
+            <label>Número de Sessões *</label>
+            <div className="sessao-contador">
+              <button
+                type="button"
+                onClick={() => setSessoes(prev => Math.max(0, prev - 1))}
+                disabled={sessoes === 0}
+              >
+                <i className="bi bi-chevron-compact-left"></i>
+              </button>
+
+              <p className="sessao-valor">{sessoes}</p>
+
+              <button
+                type="button"
+                onClick={() => setSessoes(prev => Math.min(3, prev + 1))}
+                disabled={sessoes === 3}
+              >
+                <i className="bi bi-chevron-compact-right"></i>
+              </button>
+            </div>
+          </div>
+
+          <div className="campo-de-input">
+            <label htmlFor="termino">Término *</label>
+            <input
+              type="text"
+              id="termino"
+              name="termino"
+              value={horarioTermino || '— —'}
+              readOnly
+              className="horario-termino-readonly"
+            />
+          </div>
+        </div>
+      </div>
+
+      <div className="campo-de-input observacoes">
+        <label>Observações</label>
+        <textarea
+          name="observacoes"
+          rows="4"
+          cols="1"
+          onChange={handleChange}
+          value={agendamento.observacoes || ''}
+        />
+      </div>
+    </section>
+
+    <div className="campo-de-input-check">
+      <input
+        className="form-check-input form-custom-check"
+        type="checkbox"
+        name="status"
+        onChange={handleCheckbox}
+        checked={status === "requested"}
+      />
+      <label className="form-check-label checkbox-label" htmlFor="status">
+        Adicionar à fila de espera
+      </label>
+    </div>
+
+    <div className="form-actions">
+      <button type="submit" className="btn-primary">Salvar agendamento</button>
+      <button type="button" className="btn-cancel" onClick={onCancel}>Cancelar</button>
+    </div>
+  </form>
+</div>
+
   );
 };
 

src/components/AgendarConsulta/TabelaAgendamentoMes.jsx

@@ -212,7 +212,7 @@ const TabelaAgendamentoMes = ({ ListarDiasdoMes, agendamentos, setShowDeleteModa
             {Object.keys(AgendamentosMensaisOrganizados[indice]).map((semanaKey) => {
               const semana = AgendamentosMensaisOrganizados[indice][semanaKey]
               console.log(AgendamentosMensaisOrganizados[indice][semanaKey], 'ajdsahchbaohdfoduh')
-
+             
 
               return(
                <tr key={semanaKey}>
@@ -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}/>

src/components/AgendarConsulta/style/card-consulta.css

@@ -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;
+
+}

src/components/AgendarConsulta/style/styleTabelas/tabelames.css

@@ -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 */
+}

src/pages/Agendamento.jsx

@@ -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..."

src/pages/AgendamentoCadastroManager.jsx

@@ -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`,

src/pages/style/Agendamento.css

@@ -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;