From 6c2ba37964e75f168999ae976b1ead5ad7dd3783 Mon Sep 17 00:00:00 2001 From: Caio Miguel Lima Nunes Date: Wed, 15 Oct 2025 19:32:56 -0300 Subject: [PATCH] =?UTF-8?q?Cria=C3=A7=C3=A3o=20dos=20filtros?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/DoctorTable.jsx | 463 ++++++++++++++++++++++-------- src/pages/TablePaciente.jsx | 415 +++++++++++++++++--------- src/pages/style/TableDoctor.css | 237 +++++++++++++++ src/pages/style/TablePaciente.css | 237 +++++++++++++++ 4 files changed, 1105 insertions(+), 247 deletions(-) create mode 100644 src/pages/style/TableDoctor.css create mode 100644 src/pages/style/TablePaciente.css diff --git a/src/pages/DoctorTable.jsx b/src/pages/DoctorTable.jsx index 019f7f7..3c67b7d 100644 --- a/src/pages/DoctorTable.jsx +++ b/src/pages/DoctorTable.jsx @@ -2,30 +2,40 @@ import React, { useState, useEffect } from "react"; import API_KEY from "../components/utils/apiKeys"; import { useAuth } from "../components/utils/AuthProvider"; import { Link } from "react-router-dom"; +import "./style/TableDoctor.css"; function TableDoctor() { const { getAuthorizationHeader, isAuthenticated } = useAuth(); const [medicos, setMedicos] = useState([]); const [search, setSearch] = useState(""); + const [filtroEspecialidade, setFiltroEspecialidade] = useState("Todos"); + // REMOVIDO: const [filtroVIP, setFiltroVIP] = useState(false); const [filtroAniversariante, setFiltroAniversariante] = useState(false); - // estados do modal + // Estados para filtros avançados + const [showFiltrosAvancados, setShowFiltrosAvancados] = useState(false); + const [filtroCidade, setFiltroCidade] = useState(""); + const [filtroEstado, setFiltroEstado] = useState(""); + const [idadeMinima, setIdadeMinima] = useState(""); + const [idadeMaxima, setIdadeMaxima] = useState(""); + const [dataInicial, setDataInicial] = useState(""); + const [dataFinal, setDataFinal] = useState(""); + + // estados do modal const [showDeleteModal, setShowDeleteModal] = useState(false); const [selectedDoctorId, setSelectedDoctorId] = useState(null); // Função para excluir médicos const deleteDoctor = async (id) => { - const authHeader = getAuthorizationHeader() console.log(id, 'teu id') - + var myHeaders = new Headers(); - myHeaders.append('apikey', API_KEY); - myHeaders.append("Authorization", authHeader) - - - var requestOptions = { method: "DELETE", redirect: "follow", headers:myHeaders }; + myHeaders.append('apikey', API_KEY); + myHeaders.append("Authorization", authHeader) + + var requestOptions = { method: "DELETE", redirect: "follow", headers: myHeaders }; try { const result = await fetch( @@ -53,90 +63,323 @@ function TableDoctor() { ); }; - // Buscar médicos da API - useEffect(() => { + // Função para calcular idade a partir da data de nascimento + const calcularIdade = (dataNascimento) => { + if (!dataNascimento) return 0; + const hoje = new Date(); + const nascimento = new Date(dataNascimento); + let idade = hoje.getFullYear() - nascimento.getFullYear(); + const mes = hoje.getMonth() - nascimento.getMonth(); - const authHeader = getAuthorizationHeader() - - console.log(authHeader, 'aqui autorização') - - var myHeaders = new Headers(); - myHeaders.append("apikey", API_KEY); - myHeaders.append("Authorization", `${authHeader}`); - var requestOptions = { - method: 'GET', - headers: myHeaders, - redirect: 'follow' + if (mes < 0 || (mes === 0 && hoje.getDate() < nascimento.getDate())) { + idade--; + } + return idade; }; - fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors", requestOptions) - .then(response => response.json()) - .then(result => setMedicos(result)) - .catch(error => console.log('error', error)); - }, []); + // Função para limpar todos os filtros + const limparFiltros = () => { + setSearch(""); + setFiltroEspecialidade("Todos"); + // REMOVIDO: setFiltroVIP(false); + setFiltroAniversariante(false); + setShowFiltrosAvancados(false); // Adicionado para fechar os avançados + setFiltroCidade(""); + setFiltroEstado(""); + setIdadeMinima(""); + setIdadeMaxima(""); + setDataInicial(""); + setDataFinal(""); + }; - // ✨ CORREÇÃO AQUI: Verificamos se 'medicos' é um array antes de filtrar. - const medicosFiltrados = Array.isArray(medicos) ? medicos.filter( - (medico) => - `${medico.nome} ${medico.cpf} ${medico.email} ${medico.telefone}` - .toLowerCase() - .includes(search.toLowerCase()) && - (filtroAniversariante ? ehAniversariante(medico.data_nascimento) : true) - ) : []; // Se não for um array, usamos um array vazio como fallback. + // Buscar médicos da API + useEffect(() => { + const authHeader = getAuthorizationHeader() + console.log(authHeader, 'aqui autorização') + + var myHeaders = new Headers(); + myHeaders.append("apikey", API_KEY); + myHeaders.append("Authorization", `${authHeader}`); + var requestOptions = { + method: 'GET', + headers: myHeaders, + redirect: 'follow' + }; + + fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors", requestOptions) + .then(response => response.json()) + .then(result => setMedicos(result)) + .catch(error => console.log('error', error)); + }, [isAuthenticated, getAuthorizationHeader]); + + // ✨ FILTRO CORRIGIDO - Baseado na estrutura real dos dados + const medicosFiltrados = Array.isArray(medicos) ? medicos.filter((medico) => { + // Filtro por nome OU CPF - usando campos reais da API + const buscaNome = medico.full_name?.toLowerCase().includes(search.toLowerCase()); + const buscaCPF = medico.cpf?.toLowerCase().includes(search.toLowerCase()); + const buscaEmail = medico.email?.toLowerCase().includes(search.toLowerCase()); + const passaBusca = search === "" || buscaNome || buscaCPF || buscaEmail; + + // Filtro por especialidade - ajustando para campo real + const passaEspecialidade = filtroEspecialidade === "Todos" || medico.specialty === filtroEspecialidade; + + // REMOVIDO: Filtro VIP - Não é mais utilizado + // const passaVIP = filtroVIP ? medico.vip === true : true; + + // Filtro aniversariante + const passaAniversario = filtroAniversariante + ? ehAniversariante(medico.birth_date) + : true; + + // Filtros avançados - ajustando para campos reais + const passaCidade = filtroCidade ? + medico.city?.toLowerCase().includes(filtroCidade.toLowerCase()) : true; + + const passaEstado = filtroEstado ? + medico.state?.toLowerCase().includes(filtroEstado.toLowerCase()) : true; + + // Filtro por idade - usando birth_date + const idade = calcularIdade(medico.birth_date); + const passaIdadeMinima = idadeMinima ? idade >= parseInt(idadeMinima) : true; + const passaIdadeMaxima = idadeMaxima ? idade <= parseInt(idadeMaxima) : true; + + // Filtro por data de cadastro - usando created_at ou similar + const passaDataInicial = dataInicial ? + medico.created_at && new Date(medico.created_at) >= new Date(dataInicial) : true; + + const passaDataFinal = dataFinal ? + medico.created_at && new Date(medico.created_at) <= new Date(dataFinal) : true; + + // Combinação de todos os filtros (passaVIP removido) + const resultado = passaBusca && passaEspecialidade && passaAniversario && + passaCidade && passaEstado && passaIdadeMinima && passaIdadeMaxima && + passaDataInicial && passaDataFinal; + + return resultado; + }) : []; + + // Contador de médicos filtrados + useEffect(() => { + console.log(` Médicos totais: ${medicos.length}, Filtrados: ${medicosFiltrados.length}`); + }, [medicos, medicosFiltrados, search]); return ( <>

Lista de Médicos

-
+
-
-
+
+

Médicos Cadastrados

- -
-
- setSearch(e.target.value)} - className="form-control" - style={{ maxWidth: "300px" }} - /> + {/* Seção de Filtros */} +
+
+ {" "} + Filtros +
- + {/* Busca por nome OU CPF ou email */} +
+ setSearch(e.target.value)} + /> + + Digite o nome completo ou número do CPF + +
+ + {/* Filtros Básicos - LADO A LADO */} +
+ + +
+ {/* REMOVIDO: Botão VIP + */} + + +
+
+ + {/* Botão para mostrar/ocultar filtros avançados */} +
{/* Adicionado mt-3 para separar do anterior */} + + + +
+ + {/* Filtros Avançados */} + {showFiltrosAvancados && ( +
+
Filtros Avançados
+ +
+ {/* Localização */} +
+ + setFiltroCidade(e.target.value)} + /> +
+
+ + setFiltroEstado(e.target.value)} + /> +
+ + {/* Intervalo de Idade */} +
+ + setIdadeMinima(e.target.value)} + min="0" + max="150" + /> +
+
+ + setIdadeMaxima(e.target.value)} + min="0" + max="150" + /> +
+ + {/* Data de Cadastro */} +
+ + setDataInicial(e.target.value)} + /> +
+
+ + setDataFinal(e.target.value)} + /> +
+
+
+ )}
+ {/* Informações dos filtros ativos */} + {(search || filtroEspecialidade !== "Todos" || filtroAniversariante || // filtroVIP removido + filtroCidade || filtroEstado || idadeMinima || idadeMaxima || dataInicial || dataFinal) && ( +
+ Filtros ativos: +
+ {search && Busca: "{search}"} + {filtroEspecialidade !== "Todos" && Especialidade: {filtroEspecialidade}} + {/* REMOVIDO: {filtroVIP && VIP} */} + {filtroAniversariante && Aniversariantes} + {filtroCidade && Cidade: {filtroCidade}} + {filtroEstado && Estado: {filtroEstado}} + {idadeMinima && Idade mín: {idadeMinima}} + {idadeMaxima && Idade máx: {idadeMaxima}} + {dataInicial && Data inicial: {dataInicial}} + {dataFinal && Data final: {dataFinal}} +
+
+ )} + + {/* Contador de resultados */} +
+ + {medicosFiltrados.length} de {medicos.length} médicos encontrados + +
+ + {/* Tabela de Médicos */}
- +
+ - - @@ -144,66 +387,45 @@ function TableDoctor() { {medicosFiltrados.length > 0 ? ( medicosFiltrados.map((medico) => ( - - - - + + - + - @@ -231,10 +453,10 @@ function TableDoctor() { - {/* Modal de confirmação de exclusão */} + {/* Modal de confirmação */} {showDeleteModal && (
-
-
Confirmação de Exclusão
+
+
+ Confirmação de Exclusão +
+
-

+

Tem certeza que deseja excluir este médico?

+
+
-
+ {/* Seção de Filtros */} +
{" "} Filtros
-
+ {/* Busca por nome ou CPF */} +
setSearch(e.target.value)} - style={{ - minWidth: 250, - maxWidth: 300, - width: 260, - flex: "0 0 auto", - }} /> + + Digite o nome completo ou número do CPF + +
+ {/* Filtros Básicos */} +
+ + {/* Botão para mostrar/ocultar filtros avançados */} +
+ + + +
+ + {/* Filtros Avançados */} + {showFiltrosAvancados && ( +
+
Filtros Avançados
+ +
+ {/* Localização */} +
+ + setFiltroCidade(e.target.value)} + /> +
+
+ + setFiltroEstado(e.target.value)} + /> +
+ + {/* Intervalo de Idade */} +
+ + setIdadeMinima(e.target.value)} + min="0" + max="150" + /> +
+
+ + setIdadeMaxima(e.target.value)} + min="0" + max="150" + /> +
+ + {/* Data do Último Atendimento */} +
+ + setDataInicial(e.target.value)} + /> +
+
+ + setDataFinal(e.target.value)} + /> +
+
+
+ )}
+ {/* Informações dos filtros ativos */} + {(search || filtroConvenio !== "Todos" || filtroVIP || filtroAniversariante || + filtroCidade || filtroEstado || idadeMinima || idadeMaxima || dataInicial || dataFinal) && ( +
+ Filtros ativos: +
+ {search && Busca: "{search}"} + {filtroConvenio !== "Todos" && Convênio: {filtroConvenio}} + {filtroVIP && VIP} + {filtroAniversariante && Aniversariantes} + {filtroCidade && Cidade: {filtroCidade}} + {filtroEstado && Estado: {filtroEstado}} + {idadeMinima && Idade mín: {idadeMinima}} + {idadeMaxima && Idade máx: {idadeMaxima}} + {dataInicial && Data inicial: {dataInicial}} + {dataFinal && Data final: {dataFinal}} +
+
+ )} + + {/* Contador de resultados */} +
+ + {pacientesFiltrados.length} de {pacientes.length} pacientes encontrados + +
+ + {/* Tabela de Pacientes */}
-
Nome CPFEspecialidade EmailTelefone Ações
{medico.full_name}{medico.cpf}{medico.email}{medico.telefone} - - {medico.ativo} +
+ {medico.full_name} + {ehAniversariante(medico.birth_date) && ( + + + + )} + {/* REMOVIDO: Badge VIP + {medico.vip && ( + + VIP + + )} */} +
+ 		{medico.cpf} + + {medico.specialty || 'Não informado'} {medico.email || 'Não informado'}
- {/* Ver Detalhes */} - - {/* Editar */} - + -
+ Nenhum médico encontrado.
+
+ - - @@ -248,62 +424,46 @@ const pacientesFiltrados = Array.isArray(pacientes) ? pacientes.filter((paciente {pacientesFiltrados.length > 0 ? ( pacientesFiltrados.map((paciente) => ( - - - - + + + - @@ -334,7 +494,7 @@ const pacientesFiltrados = Array.isArray(pacientes) ? pacientes.filter((paciente {/* Modal de confirmação */} {showDeleteModal && (
- -
-
+
+
Confirmação de Exclusão
-
Nome CPFConvênio EmailTelefone Ações
{paciente.full_name}{paciente.cpf}{paciente.email}{paciente.telefone} - - {paciente.ativo} +
+ {paciente.full_name} +
+ {ehAniversariante(paciente.birth_date) && ( + + + + )} + {paciente.vip && ( + + VIP + + )} +
+
+ 		{paciente.cpf} + + {paciente.insurance_plan || 'Não informado'} {paciente.email || 'Não informado'}
- - - {/* Botão que abre o modal */}
+ Nenhum paciente encontrado.