Anzeige für lsitenplatz, sortierung nach Datum

apps/hub/app/(app)/admin/event/_components/AppointmentModal.tsx

@@ -45,8 +45,8 @@ export const AppointmentModal = ({
 	const participantTableRef = useRef<PaginatedTableRef>(null);
 
 	return (
-		<dialog ref={ref} className="modal">
-			<div className="modal-box">
+		<dialog ref={ref} className="modal ">
+			<div className="modal-box min-w-[900px]">
 				<form method="dialog">
 					{/* if there is a button in form, it will close the modal */}
 					<button
@@ -99,10 +99,40 @@ export const AppointmentModal = ({
 									header: "Nachname",
 								},
 								{
-									header: "Aktion",
+									accessorKey: "enscriptionDate",
+									header: "Einschreibedatum",
 									cell: ({ row }: CellContext<Participant, any>) => {
 										return (
-											<>
+											<span>
+												{new Date(
+													row.original.enscriptionDate,
+												).toLocaleString()}
+											</span>
+										);
+									},
+								},
+								{
+									header: "Anwesend",
+									cell: ({ row }: CellContext<Participant, any>) => {
+										if (row.original.attended) {
+											return <span className="text-green-500">Ja</span>;
+										} else if (row.original.appointmentCancelled) {
+											return (
+												<span className="text-red-500">
+													Nein (Termin abgesagt)
+												</span>
+											);
+										} else {
+											return <span>Abwarten</span>;
+										}
+									},
+								},
+								{
+									header: "Aktion",
+
+									cell: ({ row }: CellContext<Participant, any>) => {
+										return (
+											<div className="space-x-2">
 												<button
 													onClick={() => {
 														participantForm.reset(row.original);
@@ -121,6 +151,7 @@ export const AppointmentModal = ({
 																eventId: event!.id,
 																userId: participantForm.watch("userId"),
 																attended: true,
+																appointmentCancelled: false,
 															});
 															participantTableRef.current?.refresh();
 														}}
@@ -129,7 +160,33 @@ export const AppointmentModal = ({
 														Anwesend
 													</button>
 												)}
-											</>
+												{!row.original.attended && event?.hasPresenceEvents && (
+													<button
+														type="button"
+														onSubmit={() => {}}
+														onClick={async () => {
+															await upsertParticipant({
+																eventId: event!.id,
+																userId: participantForm.watch("userId"),
+																attended: false,
+																appointmentCancelled: true,
+																statusLog: [
+																	...(row.original.statusLog as any),
+																	{
+																		event: "Gefehlt",
+																		timestamp: new Date().toISOString(),
+																		user: `${session?.user?.firstname} (${session?.user?.lastname} - ${session?.user?.publicId})`,
+																	},
+																],
+															});
+															participantTableRef.current?.refresh();
+														}}
+														className="btn btn-outline btn-error btn-sm"
+													>
+														nicht da
+													</button>
+												)}
+											</div>
 										);
 									},
 								},

apps/hub/app/(app)/admin/event/_components/ParticipantModal.tsx

@@ -35,6 +35,11 @@ export const ParticipantModal = ({
 					})}
 					className="space-y-1"
 				>
+					<Switch
+						form={participantForm}
+						name="attended"
+						label="Termin Teilgenommen"
+					/>
 					<Switch
 						form={participantForm}
 						name="appointmentCancelled"
@@ -50,6 +55,18 @@ export const ParticipantModal = ({
 						name="completetionWorkflowFinished"
 						label="Abgeschlossen (E-Mail-Benachrichtigung senden)"
 					/>
+					<div className="w-full">
+						<h3 className="text-xl">Termine</h3>
+
+						<p className="w-full flex justify-between">
+							<span>Termin ausgewählt</span>
+							<span>
+								{new Date(
+									participantForm.watch("enscriptionDate"),
+								).toLocaleString()}
+							</span>
+						</p>
+					</div>
 					<div className="flex flex-col">
 						<h3 className="text-xl">Verlauf</h3>
 						{participantForm.watch("statusLog")?.map((s) => (
@@ -59,9 +76,12 @@ export const ParticipantModal = ({
 							</div>
 						))}
 					</div>
-					<Button type="submit">Speichern</Button>
+					<Button type="submit" className="btn btn-primary">
+						Speichern
+					</Button>
 					<Button
 						type="button"
+						className="btn btn-error btn-outline"
 						onSubmit={() => false}
 						onClick={() => {
 							deleteParticipant(participantForm.watch("id"));