diff --git a/app/secretary/appointments/page.tsx b/app/secretary/appointments/page.tsx index e2c4623..d3f995b 100644 --- a/app/secretary/appointments/page.tsx +++ b/app/secretary/appointments/page.tsx @@ -11,6 +11,7 @@ import { import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; import { Dialog } from "@/components/ui/dialog"; +import { Input } from "@/components/ui/input"; // Importei o Input import { Calendar as CalendarShadcn } from "@/components/ui/calendar"; import { Separator } from "@/components/ui/separator"; import { @@ -24,6 +25,7 @@ import { List, RefreshCw, Loader2, + Search, // Importei o ícone de busca } from "lucide-react"; import { format, parseISO, isValid, isToday, isTomorrow } from "date-fns"; import { ptBR } from "date-fns/locale"; @@ -43,6 +45,9 @@ export default function SecretaryAppointments() { const [deleteModal, setDeleteModal] = useState(false); const [editModal, setEditModal] = useState(false); + // Estado da Busca + const [searchTerm, setSearchTerm] = useState(""); + // Estado para o formulário de edição const [editFormData, setEditFormData] = useState({ date: "", @@ -50,7 +55,7 @@ export default function SecretaryAppointments() { status: "", }); - // Estado de data selecionada para o layout novo + // Estado de data selecionada const [selectedDate, setSelectedDate] = useState(new Date()); const fetchData = async () => { @@ -91,17 +96,31 @@ export default function SecretaryAppointments() { fetchData(); }, []); - // --- Agrupamento por dia para o layout novo --- + // --- Filtragem e Agrupamento --- const groupedAppointments = useMemo(() => { - const list = selectedDate - ? appointments.filter((apt) => { - if (!apt.scheduled_at) return false; - const iso = apt.scheduled_at.toString(); - return iso.startsWith(format(selectedDate, "yyyy-MM-dd")); - }) - : appointments; + let filteredList = appointments; - return list.reduce((acc: Record, apt: any) => { + // 1. Filtro de Texto (Nome do Paciente ou Médico) + if (searchTerm) { + const lowerTerm = searchTerm.toLowerCase(); + filteredList = filteredList.filter( + (apt) => + apt.patient.full_name.toLowerCase().includes(lowerTerm) || + apt.doctor.full_name.toLowerCase().includes(lowerTerm) + ); + } + + // 2. Filtro de Data (se selecionada) + if (selectedDate) { + filteredList = filteredList.filter((apt) => { + if (!apt.scheduled_at) return false; + const iso = apt.scheduled_at.toString(); + return iso.startsWith(format(selectedDate, "yyyy-MM-dd")); + }); + } + + // 3. Agrupamento por dia + return filteredList.reduce((acc: Record, apt: any) => { if (!apt.scheduled_at) return acc; const dateObj = new Date(apt.scheduled_at); if (!isValid(dateObj)) return acc; @@ -110,7 +129,7 @@ export default function SecretaryAppointments() { acc[key].push(apt); return acc; }, {}); - }, [appointments, selectedDate]); + }, [appointments, selectedDate, searchTerm]); // Dias que têm consulta (para destacar no calendário) const bookedDays = useMemo( @@ -134,7 +153,7 @@ export default function SecretaryAppointments() { return format(date, "EEEE, dd 'de' MMMM", { locale: ptBR }); }; - // --- LÓGICA DE EDIÇÃO --- + // --- LÓGICA DE EDIÇÃO E DELEÇÃO --- const handleEdit = (appointment: any) => { setSelectedAppointment(appointment); const appointmentDate = new Date(appointment.scheduled_at); @@ -172,9 +191,7 @@ export default function SecretaryAppointments() { }; await appointmentsService.update(selectedAppointment.id, updatePayload); - await fetchData(); - setEditModal(false); toast.success("Consulta atualizada com sucesso!"); } catch (error) { @@ -183,7 +200,6 @@ export default function SecretaryAppointments() { } }; - // --- LÓGICA DE DELEÇÃO --- const handleDelete = (appointment: any) => { setSelectedAppointment(appointment); setDeleteModal(true); @@ -204,39 +220,11 @@ export default function SecretaryAppointments() { } }; - // Mantidos caso use nos modais - const timeSlots = [ - "08:00", - "08:30", - "09:00", - "09:30", - "10:00", - "10:30", - "11:00", - "11:30", - "14:00", - "14:30", - "15:00", - "15:30", - "16:00", - "16:30", - "17:00", - "17:30", - ]; - const appointmentStatuses = [ - "requested", - "confirmed", - "checked_in", - "completed", - "cancelled", - "no_show", - ]; - return (
{/* Cabeçalho principal */} -
+

Agenda Médica @@ -245,43 +233,61 @@ export default function SecretaryAppointments() { Consultas para os pacientes

-
- - - -
+ + +
- {/* Subtítulo e ações (mostrar todas / atualizar) */} -
-

+ {/* Barra de Filtros e Ações */} +
+

{selectedDate ? `Agenda de ${format(selectedDate, "dd/MM/yyyy")}` - : "Próximas Consultas"} + : "Todas as Consultas"}

-
- - +
+ +
+ + +

@@ -326,9 +332,11 @@ export default function SecretaryAppointments() {

- {selectedDate - ? "Não há agendamentos para esta data." - : "Não há próximas consultas agendadas."} + {searchTerm + ? "Nenhum resultado para a busca." + : selectedDate + ? "Não há agendamentos para esta data." + : "Não há consultas agendadas."}

@@ -350,7 +358,7 @@ export default function SecretaryAppointments() { key={appointment.id} className="shadow-sm hover:shadow-md transition-shadow" > - + {/* Coluna 1: Paciente + hora */}
@@ -384,8 +392,8 @@ export default function SecretaryAppointments() {
{/* Coluna 3: Ações */} -
-
+
+
@@ -456,4 +465,4 @@ const getStatusBadge = (status: string) => { default: return {status}; } -}; +}; \ No newline at end of file