fix: Preserve eventId in EventEditorPage so editing existing events performs PATCH instead of creating new events

This commit is contained in:
Richard
2026-07-31 12:12:40 +02:00
parent 883d5b8dab
commit bad119b69b
4 changed files with 47 additions and 1292 deletions
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -11,7 +11,7 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<title>Schichtplaner — Veranstaltungsschichtpläne</title> <title>Schichtplaner — Veranstaltungsschichtpläne</title>
<script type="module" crossorigin src="/assets/index-DwImwxk6.js"></script> <script type="module" crossorigin src="/assets/index-g0sgtMk-.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-fTGRNVay.css"> <link rel="stylesheet" crossorigin href="/assets/index-fTGRNVay.css">
</head> </head>
<body class="bg-paper text-main font-sans antialiased min-h-screen"> <body class="bg-paper text-main font-sans antialiased min-h-screen">
+1
View File
@@ -378,6 +378,7 @@ export default function App() {
showNotification(eventPayload.id ? 'Veranstaltung & Schichten aktualisiert!' : 'Veranstaltung erfolgreich erstellt!'); showNotification(eventPayload.id ? 'Veranstaltung & Schichten aktualisiert!' : 'Veranstaltung erfolgreich erstellt!');
await refreshEvents(); await refreshEvents();
setEventToEdit(null);
handleSelectEvent(targetEventId); handleSelectEvent(targetEventId);
}; };
+32 -10
View File
@@ -5,6 +5,7 @@ import { ArrowLeft, Calendar, Layers, Plus, Trash2, Edit3, CheckCircle2, AlertCi
import { apiFetch } from '../api/client'; import { apiFetch } from '../api/client';
export default function EventEditorPage({ eventToEdit, skills, user, onBack, onSubmit, onDeleteEvent }) { export default function EventEditorPage({ eventToEdit, skills, user, onBack, onSubmit, onDeleteEvent }) {
const [eventId, setEventId] = useState(eventToEdit?.id || null);
const [title, setTitle] = useState(eventToEdit?.title || ''); const [title, setTitle] = useState(eventToEdit?.title || '');
const [description, setDescription] = useState(eventToEdit?.description || ''); const [description, setDescription] = useState(eventToEdit?.description || '');
const [location, setLocation] = useState(eventToEdit?.location || ''); const [location, setLocation] = useState(eventToEdit?.location || '');
@@ -13,7 +14,7 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
// Co-managers state // Co-managers state
const [coManagerIds, setCoManagerIds] = useState( const [coManagerIds, setCoManagerIds] = useState(
eventToEdit?.co_managers ? eventToEdit.co_managers.map(u => u.id) : [] eventToEdit?.co_managers ? eventToEdit.co_managers.map(u => (typeof u === 'object' ? u.id : u)) : []
); );
const [allUsers, setAllUsers] = useState([]); const [allUsers, setAllUsers] = useState([]);
@@ -25,7 +26,18 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
useEffect(() => { useEffect(() => {
fetchUsers(); fetchUsers();
if (eventToEdit && eventToEdit.task_areas && eventToEdit.task_areas.length > 0) { if (eventToEdit) {
setEventId(eventToEdit.id);
setTitle(eventToEdit.title || '');
setDescription(eventToEdit.description || '');
setLocation(eventToEdit.location || '');
setStartDate(eventToEdit.start_date || new Date().toISOString().split('T')[0]);
setEndDate(eventToEdit.end_date || new Date().toISOString().split('T')[0]);
setCoManagerIds(
eventToEdit.co_managers ? eventToEdit.co_managers.map(u => (typeof u === 'object' ? u.id : u)) : []
);
if (eventToEdit.task_areas && eventToEdit.task_areas.length > 0) {
const formattedAreas = eventToEdit.task_areas.map(ta => ({ const formattedAreas = eventToEdit.task_areas.map(ta => ({
id: ta.id, id: ta.id,
name: ta.name, name: ta.name,
@@ -33,15 +45,25 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
shifts: (ta.shifts || []).map(s => ({ shifts: (ta.shifts || []).map(s => ({
id: s.id, id: s.id,
title: s.title, title: s.title,
date: s.date || (eventToEdit ? eventToEdit.start_date : new Date().toISOString().split('T')[0]), date: s.date || eventToEdit.start_date,
start_time: s.start_time, start_time: s.start_time,
end_time: s.end_time, end_time: s.end_time,
max_participants: s.max_participants || 1, max_participants: s.max_participants || 1,
required_skill_ids: s.required_skills ? s.required_skills.map(sk => sk.id) : [] required_skill_ids: s.required_skills ? s.required_skills.map(sk => (typeof sk === 'object' ? sk.id : sk)) : []
})) }))
})); }));
setTaskAreas(formattedAreas); setTaskAreas(formattedAreas);
} else if (!eventToEdit) { } else {
setTaskAreas([]);
}
} else {
setEventId(null);
setTitle('');
setDescription('');
setLocation('');
setStartDate(new Date().toISOString().split('T')[0]);
setEndDate(new Date().toISOString().split('T')[0]);
setCoManagerIds([]);
setTaskAreas([ setTaskAreas([
{ {
name: 'Tresendienst', name: 'Tresendienst',
@@ -138,7 +160,7 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
setSubmitting(true); setSubmitting(true);
try { try {
await onSubmit({ await onSubmit({
id: eventToEdit?.id, id: eventId || eventToEdit?.id,
title, title,
description, description,
location, location,
@@ -166,7 +188,7 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
</button> </button>
<span className="text-muted border border-grid px-2.5 py-0.5 rounded-sm"> <span className="text-muted border border-grid px-2.5 py-0.5 rounded-sm">
MODE: {eventToEdit ? 'EVENT EDIT' : 'NEW EVENT'} MODE: {eventId || eventToEdit ? 'EVENT EDIT' : 'NEW EVENT'}
</span> </span>
</div> </div>
@@ -174,11 +196,11 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
<div className="hallmark-panel rounded-sm p-6 sm:p-8 border border-grid space-y-2"> <div className="hallmark-panel rounded-sm p-6 sm:p-8 border border-grid space-y-2">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<div className="w-10 h-10 rounded-sm bg-blue-500/10 text-blue-500 border border-blue-500/20 flex items-center justify-center font-bold"> <div className="w-10 h-10 rounded-sm bg-blue-500/10 text-blue-500 border border-blue-500/20 flex items-center justify-center font-bold">
{eventToEdit ? <Edit3 className="w-5 h-5" /> : <Calendar className="w-5 h-5" />} {eventId || eventToEdit ? <Edit3 className="w-5 h-5" /> : <Calendar className="w-5 h-5" />}
</div> </div>
<div> <div>
<h2 className="font-serif text-3xl font-bold uppercase tracking-tight text-main"> <h2 className="font-serif text-3xl font-bold uppercase tracking-tight text-main">
{eventToEdit ? 'Veranstaltung & Schichten Bearbeiten' : 'Neue Veranstaltung Erstellen'} {eventId || eventToEdit ? 'Veranstaltung & Schichten Bearbeiten' : 'Neue Veranstaltung Erstellen'}
</h2> </h2>
<p className="text-xs text-muted font-mono mt-0.5"> <p className="text-xs text-muted font-mono mt-0.5">
Konfiguriere Stammdaten, Co-Verwalter, Aufgabenfelder, Schichtzeiten & Qualifikationen Konfiguriere Stammdaten, Co-Verwalter, Aufgabenfelder, Schichtzeiten & Qualifikationen
@@ -435,7 +457,7 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
{/* Submit Actions */} {/* Submit Actions */}
<div className="flex items-center justify-between gap-3 pt-2 font-mono"> <div className="flex items-center justify-between gap-3 pt-2 font-mono">
{eventToEdit && onDeleteEvent && user && (user.is_admin_user || user.is_staff || user.is_superuser || eventToEdit.created_by === user.id || eventToEdit.created_by?.id === user.id) ? ( {(eventId || eventToEdit) && onDeleteEvent && user && (user.is_admin_user || user.is_staff || user.is_superuser || eventToEdit?.created_by === user.id || eventToEdit?.created_by?.id === user.id) ? (
<button <button
type="button" type="button"
onClick={() => onDeleteEvent(eventToEdit)} onClick={() => onDeleteEvent(eventToEdit)}