Implement Delete Event Feature

This commit is contained in:
2025-07-01 18:49:25 +00:00
parent 37332249aa
commit 7d773739d5
3 changed files with 74 additions and 3 deletions

View File

@@ -14,3 +14,12 @@ export async function fetchEvents(groupId: string) {
if (!res.ok || data.error) throw new Error(data.error || 'Fehler beim Laden der Termine');
return data;
}
export async function deleteEvent(eventId: string) {
const res = await fetch(`/api/events/${encodeURIComponent(eventId)}`, {
method: 'DELETE',
});
const data = await res.json();
if (!res.ok || data.error) throw new Error(data.error || 'Fehler beim Löschen des Termins');
return data;
}

View File

@@ -12,10 +12,11 @@ import {
} from '@syncfusion/ej2-react-schedule';
import { DropDownListComponent } from '@syncfusion/ej2-react-dropdowns';
import { L10n, loadCldr, setCulture } from '@syncfusion/ej2-base';
import type { EventRenderedArgs } from '@syncfusion/ej2-react-schedule';
import type { EventRenderedArgs, ActionEventArgs } from '@syncfusion/ej2-react-schedule';
import { fetchEvents } from './apiEvents';
import { fetchGroups } from './apiGroups';
import { getGroupColor } from './groupColors';
import { deleteEvent } from './apiEvents';
// Typ für Gruppe ergänzen
type Group = {
@@ -64,6 +65,24 @@ L10n.load({
agenda: 'Agenda',
today: 'Heute',
noEvents: 'Keine Termine',
allDay: 'Ganztägig',
start: 'Start',
end: 'Ende',
event: 'Termin',
save: 'Speichern',
cancel: 'Abbrechen',
delete: 'Löschen',
edit: 'Bearbeiten',
newEvent: 'Neuer Termin',
title: 'Titel',
description: 'Beschreibung',
location: 'Ort',
recurrence: 'Wiederholung',
repeat: 'Wiederholen',
deleteEvent: 'Termin löschen',
deleteContent: 'Möchten Sie diesen Termin wirklich löschen?',
moreDetails: 'Mehr Details',
addTitle: 'Termintitel',
},
},
});
@@ -135,7 +154,7 @@ const Appointments: React.FC = () => {
/>
</div>
<ScheduleComponent
key={selectedGroupId} // <- erzwingt komplettes Neurendern bei Gruppenwechsel
key={selectedGroupId}
height="750px"
locale="de"
currentView="Week"
@@ -143,7 +162,6 @@ const Appointments: React.FC = () => {
dataSource: events,
}}
eventRendered={(args: EventRenderedArgs) => {
// Farbe basierend auf der Gruppe setzen
if (selectedGroupId && args.data && args.data.Id) {
const groupColor = getGroupColor(selectedGroupId, groups);
if (groupColor) {
@@ -151,6 +169,37 @@ const Appointments: React.FC = () => {
}
}
}}
actionBegin={async (args: ActionEventArgs) => {
if (args.requestType === 'eventRemove') {
// args.data ist ein Array von zu löschenden Events
const toDelete = Array.isArray(args.data) ? args.data : [args.data];
for (const ev of toDelete) {
try {
await deleteEvent(ev.Id); // Deine API-Funktion
} catch (err) {
// Optional: Fehlerbehandlung
console.error('Fehler beim Löschen:', err);
}
}
// Events nach Löschen neu laden
if (selectedGroupId) {
fetchEvents(selectedGroupId)
.then((data: RawEvent[]) => {
const mapped: Event[] = data.map(e => ({
Id: e.Id,
Subject: e.Subject,
StartTime: new Date(e.StartTime),
EndTime: new Date(e.EndTime),
IsAllDay: e.IsAllDay,
}));
setEvents(mapped);
})
.catch(console.error);
}
// Syncfusion soll das Event nicht selbst löschen
args.cancel = true;
}
}}
firstDayOfWeek={1}
>
<ViewsDirective>

View File

@@ -34,3 +34,16 @@ def get_events():
})
session.close()
return jsonify(result)
@events_bp.route("/<event_id>", methods=["DELETE"])
def delete_event(event_id):
session = Session()
event = session.query(Event).filter_by(id=event_id).first()
if not event:
session.close()
return jsonify({"error": "Termin nicht gefunden"}), 404
session.delete(event)
session.commit()
session.close()
return jsonify({"success": True})