src/PagesMedico/DoctorAgendamentoManager.jsx

@@ -10,13 +10,15 @@ import isBetween from 'dayjs/plugin/isBetween';
 import localeData from 'dayjs/plugin/localeData';
 import { Search, ChevronLeft, ChevronRight, Edit, Trash2, CheckCircle } from 'lucide-react';
 import "../pages/style/Agendamento.css";
-import "../pages/style/FilaEspera.css";
+import '../pages/style/FilaEspera.css';
-import Spinner from "../components/Spinner.jsx";
+import Spinner from '../components/Spinner.jsx';
 
-dayjs.locale("pt-br");
+
+dayjs.locale('pt-br');
 dayjs.extend(isBetween);
 dayjs.extend(localeData);
 
+
 const Agendamento = () => {
     const navigate = useNavigate();
     const { getAuthorizationHeader, user } = useAuth();
@@ -26,23 +28,21 @@ const Agendamento = () => {
     const ID_MEDICO_ESPECIFICO = "078d2a67-b4c1-43c8-ae32-c1e75bb5b3df";
 
     const [listaTodosAgendamentos, setListaTodosAgendamentos] = useState([]);
-  const [selectedID, setSelectedId] = useState("0");
+    const [selectedID, setSelectedId] = useState('0');
     const [filaEsperaData, setFilaEsperaData] = useState([]);
     const [FiladeEspera, setFiladeEspera] = useState(false);
     const [PageNovaConsulta, setPageConsulta] = useState(false);
-  const [DictAgendamentosOrganizados, setAgendamentosOrganizados] = useState(
+    const [DictAgendamentosOrganizados, setAgendamentosOrganizados] = useState({});
-    {}
-  );
     const [showDeleteModal, setShowDeleteModal] = useState(false);
     const [ListaDeMedicos, setListaDeMedicos] = useState([]);
     const [FiltredTodosMedicos, setFiltredTodosMedicos] = useState([]);
-  const [searchTermDoctor, setSearchTermDoctor] = useState("");
+    const [searchTermDoctor, setSearchTermDoctor] = useState('');
     const [MedicoFiltrado, setMedicoFiltrado] = useState({ id: "vazio" });
     const [motivoCancelamento, setMotivoCancelamento] = useState("");
     const [showSpinner, setShowSpinner] = useState(true);
-  const [waitlistSearch, setWaitlistSearch] = useState("");
+    const [waitlistSearch, setWaitlistSearch] = useState('');
     const [waitSortKey, setWaitSortKey] = useState(null);
-  const [waitSortDir, setWaitSortDir] = useState("asc");
+    const [waitSortDir, setWaitSortDir] = useState('asc');
     const [waitPage, setWaitPage] = useState(1);
     const [waitPerPage, setWaitPerPage] = useState(10);
     const [cacheMedicos, setCacheMedicos] = useState({});
@@ -52,7 +52,7 @@ const Agendamento = () => {
     const [agendamentoParaEdicao, setAgendamentoParaEdicao] = useState(null);
     const [quickJump, setQuickJump] = useState({
         month: currentDate.month(),
-    year: currentDate.year(),
+        year: currentDate.year()
     });
 
 
@@ -72,84 +72,60 @@ const Agendamento = () => {
             const data = await res.json();
             setListaTodosAgendamentos(data || []);
         } catch (err) {
-      console.error("Erro ao buscar agendamentos", err);
+            console.error('Erro ao buscar agendamentos', err);
             setListaTodosAgendamentos([]);
         } finally {
             setShowSpinner(false);
         }
     }, [authHeader, ID_MEDICO_ESPECIFICO]);
 
-  const updateAppointmentStatus = useCallback(
+
-    async (id, updates) => {
+    const updateAppointmentStatus = useCallback(async (id, updates) => {
         setShowSpinner(true);
         const myHeaders = new Headers();
         myHeaders.append("Authorization", authHeader);
         myHeaders.append("apikey", API_KEY);
         myHeaders.append("Content-Type", "application/json");
         myHeaders.append("Prefer", "return=representation");
-      const requestOptions = {
+        const requestOptions = { method: 'PATCH', headers: myHeaders, body: JSON.stringify(updates) };
-        method: "PATCH",
-        headers: myHeaders,
-        body: JSON.stringify(updates),
-      };
         try {
-        const response = await fetch(
+            const response = await fetch(`https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/appointments?id=eq.${id}`, requestOptions);
-          `https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/appointments?id=eq.${id}`,
-          requestOptions
-        );
             if (response.ok) {
                 await fetchAppointments();
                 return true;
             } else {
-          console.error(
+                console.error('Erro ao atualizar agendamento:', await response.text());
-            "Erro ao atualizar agendamento:",
-            await response.text()
-          );
                 return false;
             }
         } catch (error) {
-        console.error("Erro de rede/servidor:", error);
+            console.error('Erro de rede/servidor:', error);
             return false;
         } finally {
             setShowSpinner(false);
         }
-    },
+    }, [authHeader, fetchAppointments]);
-    [authHeader, fetchAppointments]
-  );
 
-  const deleteConsulta = useCallback(
+
-    async (id) => {
+    const deleteConsulta = useCallback(async (id) => {
-      const success = await updateAppointmentStatus(id, {
+        const success = await updateAppointmentStatus(id, { status: "cancelled", cancellation_reason: motivoCancelamento, updated_at: new Date().toISOString() });
-        status: "cancelled",
-        cancellation_reason: motivoCancelamento,
-        updated_at: new Date().toISOString(),
-      });
         if (success) {
             setShowDeleteModal(false);
             setMotivoCancelamento("");
-        setSelectedId("0");
+            setSelectedId('0');
         } else {
             alert("Falha ao cancelar a consulta.");
         }
-    },
+    }, [motivoCancelamento, updateAppointmentStatus]);
-    [motivoCancelamento, updateAppointmentStatus]
-  );
 
-  const confirmConsulta = useCallback(
+
-    async (id) => {
+    const confirmConsulta = useCallback(async (id) => {
-      const success = await updateAppointmentStatus(id, {
+        const success = await updateAppointmentStatus(id, { status: "agendado", cancellation_reason: null, updated_at: new Date().toISOString() });
-        status: "agendado",
-        cancellation_reason: null,
-        updated_at: new Date().toISOString(),
-      });
         if (success) {
-        setSelectedId("0");
+            setSelectedId('0');
         } else {
             alert("Falha ao reverter o cancelamento.");
         }
-    },
+    }, [updateAppointmentStatus]);
-    [updateAppointmentStatus]
-  );
 
     useEffect(() => {
         if(authHeader) {
@@ -182,7 +158,7 @@ const Agendamento = () => {
             const patientIdsToFetch = new Set();
             const doctorIdsToFetch = new Set();
 
-      appointmentsToShow.forEach((ag) => {
+            appointmentsToShow.forEach(ag => {
                 if (ag.patient_id && !cachePacientes[ag.patient_id]) {
                     patientIdsToFetch.add(ag.patient_id);
                 }
@@ -205,14 +181,11 @@ const Agendamento = () => {
             }
 
             if (doctorIdsToFetch.size > 0) {
-        const query = `id=in.(${Array.from(doctorIdsToFetch).join(",")})`;
+                const query = `id=in.(${Array.from(doctorIdsToFetch).join(',')})`;
                 fetchPromises.push(
-          fetch(
+                    fetch(`https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors?${query}&select=id,full_name`, {
-            `https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors?${query}&select=id,full_name`,
+                         headers: { apikey: API_KEY, Authorization: authHeader }
-            {
+                    }).then(res => res.json())
-              headers: { apikey: API_KEY, Authorization: authHeader },
-            }
-          ).then((res) => res.json())
                 );
             } else {
                 fetchPromises.push(Promise.resolve(null));
@@ -221,11 +194,10 @@ const Agendamento = () => {
             const [newPatients, newDoctors] = await Promise.all(fetchPromises);
 
             const updatedPatientCache = { ...cachePacientes };
-      if (newPatients)
+            if (newPatients) newPatients.forEach(p => updatedPatientCache[p.id] = p);
-        newPatients.forEach((p) => (updatedPatientCache[p.id] = p));
 
             const updatedDoctorCache = { ...cacheMedicos };
-      if (newDoctors) newDoctors.forEach((d) => (updatedDoctorCache[d.id] = d));
+            if (newDoctors) newDoctors.forEach(d => updatedDoctorCache[d.id] = d);
             
             setCachePacientes(updatedPatientCache);
             setCacheMedicos(updatedDoctorCache);
@@ -241,29 +213,22 @@ const Agendamento = () => {
 
                 const agendamentoMelhorado = {
                     ...agendamento,
-          medico_nome: medico.full_name || "N/A",
+                    medico_nome: medico.full_name || 'N/A',
-          paciente_nome: paciente.full_name || "N/A",
+                    paciente_nome: paciente.full_name || 'N/A',
-          paciente_cpf: paciente.cpf || "N/A",
+                    paciente_cpf: paciente.cpf || 'N/A'
                 };
 
                 if (agendamento.status === "requested") {
-          newFila.push({
+                    newFila.push({ agendamento: agendamentoMelhorado, Infos: agendamentoMelhorado });
-            agendamento: agendamentoMelhorado,
-            Infos: agendamentoMelhorado,
-          });
                 } else {
-          const DiaAgendamento = dayjs(agendamento.scheduled_at).format(
+                    const DiaAgendamento = dayjs(agendamento.scheduled_at).format("YYYY-MM-DD");
-            "YYYY-MM-DD"
-          );
                     if (!newDict[DiaAgendamento]) newDict[DiaAgendamento] = [];
                     newDict[DiaAgendamento].push(agendamentoMelhorado);
                 }
             }
 
             for (const key in newDict) {
-        newDict[key].sort(
+                newDict[key].sort((a, b) => new Date(a.scheduled_at) - new Date(b.scheduled_at));
-          (a, b) => new Date(a.scheduled_at) - new Date(b.scheduled_at)
-        );
             }
 
             setAgendamentosOrganizados(newDict);
@@ -284,7 +249,7 @@ const Agendamento = () => {
     const handleSearchMedicos = (term) => {
         setSearchTermDoctor(term);
         if (term.trim()) {
-      const filtered = ListaDeMedicos.filter((medico) =>
+            const filtered = ListaDeMedicos.filter(medico =>
                 medico.nomeMedico.toLowerCase().includes(term.toLowerCase())
             );
             setFiltredTodosMedicos(filtered);
@@ -296,11 +261,11 @@ const Agendamento = () => {
     
     const generateDateGrid = () => {
         const grid = [];
-    const startOfMonth = currentDate.startOf("month");
+        const startOfMonth = currentDate.startOf('month');
-    let currentDay = startOfMonth.subtract(startOfMonth.day(), "day");
+        let currentDay = startOfMonth.subtract(startOfMonth.day(), 'day');
         for (let i = 0; i < 42; i++) {
             grid.push(currentDay);
-      currentDay = currentDay.add(1, "day");
+            currentDay = currentDay.add(1, 'day');
         }
         return grid;
     };
@@ -328,62 +293,46 @@ const DeleteModal = () => (
             </div>
         </div>
     </div>
-  );
+);
+
 
     useEffect(() => {
         setQuickJump({
             month: currentDate.month(),
-      year: currentDate.year(),
+            year: currentDate.year()
         });
     }, [currentDate]);
     
     const filaEsperaFiltrada = useMemo(() => {
         if (!waitlistSearch.trim()) return filaEsperaData;
         const term = waitlistSearch.toLowerCase();
-    return filaEsperaData.filter(
+        return filaEsperaData.filter(item =>
-      (item) =>
+            (item?.Infos?.paciente_nome?.toLowerCase() || '').includes(term) ||
-        (item?.Infos?.paciente_nome?.toLowerCase() || "").includes(term) ||
+            (item?.Infos?.paciente_cpf?.toLowerCase() || '').includes(term) ||
-        (item?.Infos?.paciente_cpf?.toLowerCase() || "").includes(term) ||
+            (item?.Infos?.medico_nome?.toLowerCase() || '').includes(term)
-        (item?.Infos?.medico_nome?.toLowerCase() || "").includes(term)
         );
     }, [waitlistSearch, filaEsperaData]);
 
-  const applySortingWaitlist = useCallback(
+    const applySortingWaitlist = useCallback((arr) => {
-    (arr) => {
         if (!Array.isArray(arr) || !waitSortKey) return arr;
         const copy = [...arr];
         const key = waitSortKey;
-      const dir = waitSortDir === "asc" ? 1 : -1;
+        const dir = waitSortDir === 'asc' ? 1 : -1;
         copy.sort((a, b) => {
-        const valA =
+            const valA = key === 'data' ? new Date(a.agendamento.scheduled_at) : (a.Infos?.[`${key}_nome`] || '');
-          key === "data"
+            const valB = key === 'data' ? new Date(b.agendamento.scheduled_at) : (b.Infos?.[`${key}_nome`] || '');
-            ? new Date(a.agendamento.scheduled_at)
-            : a.Infos?.[`${key}_nome`] || "";
-        const valB =
-          key === "data"
-            ? new Date(b.agendamento.scheduled_at)
-            : b.Infos?.[`${key}_nome`] || "";
             if (valA < valB) return -1 * dir;
             if (valA > valB) return 1 * dir;
             return 0;
         });
         return copy;
-    },
+    }, [waitSortKey, waitSortDir]);
-    [waitSortKey, waitSortDir]
-  );
 
-  const filaEsperaOrdenada = useMemo(
+    const filaEsperaOrdenada = useMemo(() => applySortingWaitlist(filaEsperaFiltrada), [filaEsperaFiltrada, applySortingWaitlist]);
-    () => applySortingWaitlist(filaEsperaFiltrada),
+    const waitTotalPages = Math.ceil(filaEsperaOrdenada.length / waitPerPage) || 1;
-    [filaEsperaFiltrada, applySortingWaitlist]
-  );
-  const waitTotalPages =
-    Math.ceil(filaEsperaOrdenada.length / waitPerPage) || 1;
     const waitIndiceInicial = (waitPage - 1) * waitPerPage;
     const waitIndiceFinal = waitIndiceInicial + waitPerPage;
-  const filaEsperaPaginada = filaEsperaOrdenada.slice(
+    const filaEsperaPaginada = filaEsperaOrdenada.slice(waitIndiceInicial, waitIndiceFinal);
-    waitIndiceInicial,
-    waitIndiceFinal
-  );
 
     const gerarNumerosWaitPages = () => {
         const paginas = [];
@@ -395,12 +344,10 @@ const DeleteModal = () => (
         return paginas;
     };
 
-  useEffect(() => {
+    useEffect(() => { setWaitPage(1); }, [waitlistSearch, waitSortKey, waitSortDir]);
-    setWaitPage(1);
-  }, [waitlistSearch, waitSortKey, waitSortDir]);
 
     const handleQuickJumpChange = (type, value) => {
-    setQuickJump((prev) => ({ ...prev, [type]: Number(value) }));
+        setQuickJump(prev => ({ ...prev, [type]: Number(value) }));
     };
 
     const applyQuickJump = () => {

src/pages/FinanceiroDashboard.jsx

@@ -169,7 +169,7 @@ export default function FinanceiroDashboard() {
         recebido += valorLiquido;
         descontos += p.desconto;
       } else {
-        aReceber += valorLiquido; 
+        aReceber += p.valor; 
       }
     });
 
@@ -244,7 +244,8 @@ export default function FinanceiroDashboard() {
             <option value="vencido">Vencido</option>
           </select>
           <button 
-            className="btn btn-primary"
+            className="action-btn" 
+            style={{ background: "#3b82f6", color: "#fff", borderColor: "#3b82f6" }}
             onClick={() => { 
               setModalPagamento({
                 paciente: { nome:"", convenio: CONVENIOS_LIST[0] }, 
@@ -283,7 +284,7 @@ export default function FinanceiroDashboard() {
               <tbody>
                 {filteredPagamentos.map(p => (
                   <tr key={p.id}>
-                    <td style={{ fontWeight: 600 }}>{p.paciente.nome}</td>
+                    <td>{p.paciente.nome}</td>
                     <td>{p.paciente.convenio}</td>
                     <td>{formatCurrency(p.valor)}</td>
                     <td>{formatCurrency(p.desconto)}</td>
@@ -294,16 +295,16 @@ export default function FinanceiroDashboard() {
                     <td>
                       <div className="action-group"> 
                         <button 
-                          className="btn-view" 
+                          className="action-btn" 
                           onClick={() => { setModalPagamento({...p}); setNovoPagamento(false); }}
                         >
-                          <i className="bi bi-eye me-1"></i> Ver / Editar
+                          Ver / Editar
                         </button>
                         <button 
-                          className="btn-delete" 
+                          className="action-btn delete" 
                           onClick={() => handleDelete(p.id)}
                         >
-                          <i className="bi bi-trash me-1"></i> Excluir
+                          Excluir
                         </button>
                       </div>
                     </td>
@@ -415,14 +416,15 @@ export default function FinanceiroDashboard() {
             </div>
 
             <div className="modal-footer">
-              <button className="btn-view" onClick={() => handleSave(modalPagamento)}>
+              <button className="action-btn" onClick={() => handleSave(modalPagamento)}>
-                <i className="bi bi-check-circle me-1"></i> Salvar
+                Salvar
               </button>
               <button 
-                className="btn-delete" 
+                className="action-btn" 
                 onClick={closeModal} 
+                style={{ borderColor: '#d1d5db', color: '#4b5563' }}
               >
-                <i className="bi bi-x-circle me-1"></i> Cancelar
+                Cancelar
               </button>
             </div>
           </div>

src/pages/style/Agendamento.css

@@ -273,7 +273,6 @@
   justify-content: space-between;
   align-items: center;
   margin: 15px 0 20px;
-  color: #fff;
 }
 
 .tabs-agenda-fila {

src/pages/style/FinanceiroDashboard.css

@@ -39,7 +39,6 @@
     margin: 0 0 8px 0;
     font-size: 14px;
     font-weight: 500;
-    color: #fff;
     opacity: 0.9;
 }
 
@@ -108,79 +107,35 @@
 }
 
 /* Botões de ação */
+.action-group {
+    display: flex;
+    gap: 8px;
+    align-items: center;
+}
 
-.btn-view {
+.action-btn {
-  background-color: #E6F2FF !important;
-  color: #004085 !important;
-  border: 1px solid #B8D4F0 !important;
-  padding: 0.375rem 0.75rem;
-  font-size: 0.875rem;
-  border-radius: 6px;
     cursor: pointer;
-  transition: all 0.15s ease-in-out;
+    padding: 6px 12px;
-  text-decoration: none;
-  display: inline-block;
-  text-align: center;
-}
-
-.btn-view:hover {
-  background-color: #D1E7FF !important;
-  border-color: #9EC5FE !important;
-}
-
-.btn-edit {
-  background-color: #FFF3CD !important;
-  color: #856404 !important;
-  border: 1px solid #FFEAA7 !important;
-  padding: 0.375rem 0.75rem;
-  font-size: 0.875rem;
     border-radius: 6px;
-  cursor: pointer;
+    border: 1px solid #d7e6fb;
-  transition: all 0.15s ease-in-out;
+    background: #fff;
-  text-decoration: none;
+    transition: all 0.2s ease;
-  display: inline-block;
+    font-size: 13px;
-  text-align: center;
 }
 
-.btn-edit:hover {
+.action-btn:hover {
-  background-color: #FFEEBA !important;
+    background: #f6f9fc;
-  border-color: #FFE087 !important;
+    border-color: #93c5fd;
 }
 
-.btn-delete:hover {
+.action-btn.delete {
-  background-color: #F1B0B7 !important;
+    border-color: #fca5a5;
-  border-color: #ED969E !important;
+    color: #b91c1c;
-}
-.btn-delete {
-  background-color: #F8D7DA !important;
-  color: #721C24 !important;
-  border: 1px solid #F5C6CB !important;
-  padding: 0.375rem 0.75rem;
-  font-size: 0.875rem;
-  border-radius: 6px;
-  cursor: pointer;
-  transition: all 0.15s ease-in-out;
-  text-decoration: none;
-  display: inline-block;
-  text-align: center;
 }
 
-html[data-bs-theme="dark"] .btn-view {
+.action-btn.delete:hover {
-  background-color: #1e3a8a !important;
+    background: #fee2e2;
-  color: #e0e0e0 !important;
+    border-color: #ef4444;
-  border-color: #374151 !important;
-}
-
-html[data-bs-theme="dark"] .btn-edit {
-  background-color: #78350f !important;
-  color: #fef3c7 !important;
-  border-color: #374151 !important;
-}
-
-html[data-bs-theme="dark"] .btn-delete {
-  background-color: #7f1d1d !important;
-  color: #fee2e2 !important;
-  border-color: #374151 !important;
 }
 
 /* Badges de status */
@@ -227,7 +182,7 @@ html[data-bs-theme="dark"] .btn-delete {
     padding: 24px;
     width: 100%;
     max-width: 550px;
-    max-height: 85vh; 
+    max-height: 90vh;
     overflow-y: auto;
     box-sizing: border-box;
     box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
@@ -253,12 +208,6 @@ html[data-bs-theme="dark"] .btn-delete {
     gap: 16px;
 }
 
-.modal-card .input-field,
-.modal-card .select-field,
-.modal-card textarea {
-    width: 100%;
-}
-
 .form-group {
     display: flex;
     flex-direction: column;
@@ -292,23 +241,12 @@ html[data-bs-theme="dark"] .btn-delete {
     gap: 10px;
     margin-top: 24px;
 }
-.input-field,
-.select-field,
-textarea {
-    padding: 10px 12px;
-    border: 1px solid #d1d5db;
-    border-radius: 8px;
-    box-sizing: border-box;
-    font-size: 14px;
-    transition: border-color 0.2s, box-shadow 0.2s;
-    background-color: #fff;
-}
-
 
 /* Inputs e selects */
 .input-field,
 .select-field,
 textarea {
+    width: 100%;
     padding: 10px 12px;
     border: 1px solid #d1d5db;
     border-radius: 8px;
@@ -331,18 +269,6 @@ textarea {
     min-height: 80px;
 }
 
-.financeiro-wrap .input-field:not(.modal-card *),
-.financeiro-wrap .select-field:not(.modal-card *),
-.financeiro-wrap textarea:not(.modal-card *) {
-    width: 30%;
-}
-
-.modal-card .input-field,
-.modal-card .select-field,
-.modal-card textarea {
-    width: 100%;
-}
-
 /* Mensagem quando não há pagamentos */
 .empty {
     text-align: center;

src/pages/style/Inicio.css

@@ -70,10 +70,10 @@
 }
 
 /* Cores dos ícones */
-.stat-icon-wrapper.blue { background-color: #1D3B88; }
+.stat-icon-wrapper.blue { background-color: #5d5dff; }
-.stat-icon-wrapper.green { background-color: #399CE5; }
+.stat-icon-wrapper.green { background-color: #30d158; }
-.stat-icon-wrapper.purple { background-color: #5F5DF2; }
+.stat-icon-wrapper.purple { background-color: #a272ff; }
-.stat-icon-wrapper.orange { background-color: #051AFF; }
+.stat-icon-wrapper.orange { background-color: #f1952e; }
 
 /* Seção de Ações Rápidas */
 .quick-actions h2 {