init_richi/schichtplanung
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add specific shift date field for multi-day events with date selector in EventEditor and date badge in ShiftMatrix

Browse Source
This commit is contained in:
Richard
2026-07-31 10:52:20 +02:00
parent 67b02f6646
commit 821e14fcab
13 changed files with 104 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/App.jsx
+3
View File
@@ -321,11 +321,13 @@ export default function App() {
}
for (let sData of taData.shifts) {
const shiftDate = sData.date || eventPayload.start_date;
if (sData.id) {
await apiFetch(`/shifts/${sData.id}/`, {
method: 'PATCH',
body: JSON.stringify({
title: sData.title,
date: shiftDate,
start_time: sData.start_time,
end_time: sData.end_time,
max_participants: sData.max_participants,
@@ -338,6 +340,7 @@ export default function App() {
body: JSON.stringify({
task_area: taId,
title: sData.title,
date: shiftDate,
start_time: sData.start_time,
end_time: sData.end_time,
max_participants: sData.max_participants,
frontend/src/components/ShiftMatrixTable.jsx
+8 -1
View File
@@ -143,7 +143,14 @@ export default function ShiftMatrixTable({
) : null}
<td className="py-3.5 px-4">
<div className="font-semibold text-main">{shift.title}</div>
<div className="font-semibold text-main flex items-center gap-2 flex-wrap">
<span>{shift.title}</span>
{shift.date && (
<span className="text-[10px] font-mono font-bold text-indigo-400 bg-indigo-500/10 px-2 py-0.5 rounded-sm border border-indigo-500/20">
📅 {new Date(shift.date + 'T00:00:00').toLocaleDateString('de-DE', { weekday: 'short', day: '2-digit', month: '2-digit' })}
</span>
)}
</div>
<div className="text-[11px] font-mono text-muted flex items-center gap-1 mt-0.5">
<Clock className="w-3 h-3 text-muted shrink-0" />
<span>{shift.start_time} — {shift.end_time} Uhr</span>
frontend/src/pages/EventEditorPage.jsx
+15 -4
View File
@@ -25,6 +25,7 @@ export default function EventEditorPage({ eventToEdit, skills, onBack, onSubmit
shifts: (ta.shifts || []).map(s => ({
id: s.id,
title: s.title,
date: s.date || (eventToEdit ? eventToEdit.start_date : new Date().toISOString().split('T')[0]),
start_time: s.start_time,
end_time: s.end_time,
max_participants: s.max_participants || 1,
@@ -78,6 +79,7 @@ export default function EventEditorPage({ eventToEdit, skills, onBack, onSubmit
const updated = [...taskAreas];
updated[areaIndex].shifts.push({
title: `Schicht ${updated[areaIndex].shifts.length + 1}`,
date: startDate,
start_time: '14:00',
end_time: '18:00',
max_participants: 1,
@@ -300,7 +302,16 @@ export default function EventEditorPage({ eventToEdit, skills, onBack, onSubmit
placeholder="Titel"
value={shift.title}
onChange={(e) => updateShift(aIdx, sIdx, 'title', e.target.value)}
className="sm:col-span-4 px-2.5 py-1 rounded-sm input-field text-xs"
className="sm:col-span-3 px-2.5 py-1 rounded-sm input-field text-xs"
/>
<input
type="date"
title="Schichtdatum"
min={startDate}
max={endDate}
value={shift.date || startDate}
onChange={(e) => updateShift(aIdx, sIdx, 'date', e.target.value)}
className="sm:col-span-3 px-2 py-1 rounded-sm input-field text-xs font-mono text-indigo-400 font-bold"
/>
<input
type="text"
@@ -316,14 +327,14 @@ export default function EventEditorPage({ eventToEdit, skills, onBack, onSubmit
onChange={(e) => updateShift(aIdx, sIdx, 'end_time', e.target.value)}
className="sm:col-span-2 px-2.5 py-1 rounded-sm input-field text-xs"
/>
<div className="sm:col-span-3 flex items-center gap-1">
<span className="text-[11px] text-muted">Plätze:</span>
<div className="sm:col-span-1 flex items-center gap-1">
<input
type="number"
min="1"
title="Max. Plätze"
value={shift.max_participants}
onChange={(e) => updateShift(aIdx, sIdx, 'max_participants', parseInt(e.target.value) || 1)}
className="w-full px-2 py-1 rounded-sm input-field text-xs font-bold"
className="w-full px-1.5 py-1 rounded-sm input-field text-xs font-bold text-center"
/>
</div>
<button