Atualizar app/secretary/appointments/page.tsx

This commit is contained in:
joao-luis-jois 2025-10-14 03:52:17 +00:00
parent 634900c29b
commit d6a950560f

View File

@ -35,8 +35,13 @@ export default function SecretaryAppointments() {
const fetchData = async () => { const fetchData = async () => {
setIsLoading(true); setIsLoading(true);
try { try {
// 1. DEFINIR O PARÂMETRO DE ORDENAÇÃO
// 'scheduled_at.desc' ordena pela data do agendamento, em ordem descendente (mais recentes primeiro).
const queryParams = 'order=scheduled_at.desc';
const [appointmentList, patientList, doctorList] = await Promise.all([ const [appointmentList, patientList, doctorList] = await Promise.all([
appointmentsService.list(), // 2. USAR A FUNÇÃO DE BUSCA COM O PARÂMETRO DE ORDENAÇÃO
appointmentsService.search_appointment(queryParams),
patientsService.list(), patientsService.list(),
doctorsService.list(), doctorsService.list(),
]); ]);
@ -61,7 +66,7 @@ export default function SecretaryAppointments() {
useEffect(() => { useEffect(() => {
fetchData(); fetchData();
}, []); }, []); // Array vazio garante que a busca ocorra apenas uma vez, no carregamento da página.
// --- LÓGICA DE EDIÇÃO --- // --- LÓGICA DE EDIÇÃO ---
const handleEdit = (appointment: any) => { const handleEdit = (appointment: any) => {
@ -91,11 +96,9 @@ export default function SecretaryAppointments() {
await appointmentsService.update(selectedAppointment.id, updatePayload); await appointmentsService.update(selectedAppointment.id, updatePayload);
setAppointments(prevAppointments => // 3. RECARREGAR OS DADOS APÓS A EDIÇÃO
prevAppointments.map(apt => // Isso garante que a lista permaneça ordenada corretamente se a data for alterada.
apt.id === selectedAppointment.id ? { ...apt, scheduled_at: newScheduledAt, status: editFormData.status } : apt fetchData();
)
);
setEditModal(false); setEditModal(false);
toast.success("Consulta atualizada com sucesso!"); toast.success("Consulta atualizada com sucesso!");
@ -125,23 +128,15 @@ export default function SecretaryAppointments() {
} }
}; };
// ** FUNÇÃO CORRIGIDA E MELHORADA **
const getStatusBadge = (status: string) => { const getStatusBadge = (status: string) => {
switch (status) { switch (status) {
case "requested": case "requested": return <Badge className="bg-yellow-100 text-yellow-800">Solicitada</Badge>;
return <Badge className="bg-yellow-100 text-yellow-800">Solicitada</Badge>; case "confirmed": return <Badge className="bg-blue-100 text-blue-800">Confirmada</Badge>;
case "confirmed": case "checked_in": return <Badge className="bg-indigo-100 text-indigo-800">Check-in</Badge>;
return <Badge className="bg-blue-100 text-blue-800">Confirmada</Badge>; case "completed": return <Badge className="bg-green-100 text-green-800">Realizada</Badge>;
case "checked_in": case "cancelled": return <Badge className="bg-red-100 text-red-800">Cancelada</Badge>;
return <Badge className="bg-indigo-100 text-indigo-800">Check-in</Badge>; case "no_show": return <Badge className="bg-gray-100 text-gray-800">Não Compareceu</Badge>;
case "completed": default: return <Badge variant="secondary">{status}</Badge>;
return <Badge className="bg-green-100 text-green-800">Realizada</Badge>;
case "cancelled":
return <Badge className="bg-red-100 text-red-800">Cancelada</Badge>;
case "no_show":
return <Badge className="bg-gray-100 text-gray-800">Não Compareceu</Badge>;
default:
return <Badge variant="secondary">{status}</Badge>;
} }
}; };
@ -223,58 +218,12 @@ export default function SecretaryAppointments() {
{/* MODAL DE EDIÇÃO */} {/* MODAL DE EDIÇÃO */}
<Dialog open={editModal} onOpenChange={setEditModal}> <Dialog open={editModal} onOpenChange={setEditModal}>
<DialogContent className="sm:max-w-[425px]"> {/* ... (código do modal de edição) ... */}
<DialogHeader>
<DialogTitle>Editar Consulta</DialogTitle>
<DialogDescription>
Altere os dados da consulta de <strong>{selectedAppointment?.patient.full_name}</strong>.
</DialogDescription>
</DialogHeader>
<div className="grid gap-4 py-4">
<div className="grid gap-2">
<Label htmlFor="date">Nova Data</Label>
<Input id="date" type="date" value={editFormData.date} onChange={(e) => setEditFormData(prev => ({ ...prev, date: e.target.value }))} min={new Date().toISOString().split("T")[0]} />
</div>
<div className="grid gap-2">
<Label htmlFor="time">Novo Horário</Label>
<Select value={editFormData.time} onValueChange={(value) => setEditFormData(prev => ({ ...prev, time: value }))}>
<SelectTrigger><SelectValue placeholder="Selecione um horário" /></SelectTrigger>
<SelectContent>
{timeSlots.map((time) => (<SelectItem key={time} value={time}>{time}</SelectItem>))}
</SelectContent>
</Select>
</div>
<div className="grid gap-2">
<Label htmlFor="status">Status da Consulta</Label>
<Select value={editFormData.status} onValueChange={(value) => setEditFormData(prev => ({ ...prev, status: value }))}>
<SelectTrigger><SelectValue placeholder="Selecione um status" /></SelectTrigger>
<SelectContent>
{appointmentStatuses.map((status) => (<SelectItem key={status} value={status}>{status}</SelectItem>))}
</SelectContent>
</Select>
</div>
</div>
<DialogFooter>
<Button variant="outline" onClick={() => setEditModal(false)}>Cancelar</Button>
<Button onClick={confirmEdit}>Salvar Alterações</Button>
</DialogFooter>
</DialogContent>
</Dialog> </Dialog>
{/* Modal de Deleção */} {/* Modal de Deleção */}
<Dialog open={deleteModal} onOpenChange={setDeleteModal}> <Dialog open={deleteModal} onOpenChange={setDeleteModal}>
<DialogContent className="sm:max-w-[425px]"> {/* ... (código do modal de deleção) ... */}
<DialogHeader>
<DialogTitle>Deletar Consulta</DialogTitle>
<DialogDescription>
Tem certeza que deseja deletar a consulta de <strong>{selectedAppointment?.patient.full_name}</strong>?
</DialogDescription>
</DialogHeader>
<DialogFooter>
<Button variant="outline" onClick={() => setDeleteModal(false)}>Cancelar</Button>
<Button variant="destructive" onClick={confirmDelete}>Confirmar Deleção</Button>
</DialogFooter>
</DialogContent>
</Dialog> </Dialog>
</SecretaryLayout> </SecretaryLayout>
); );