- Derzeit sind keine Abgaben fällig. -
-{submission.course}
-Vergleiche Bildsprache und Stimmung der beiden Gedichte.
Arbeitsauftrag: Belege deine Aussage mit je einer Textstelle und einem Fachbegriff.
', date: daysAgo(1), attachments: [{ name: 'Gedichtvergleich-Leitfaden.pdf', url: '/files/gedichtvergleich-leitfaden.pdf' }] }, b2e1: { id: 'b2e1', title: 'Lineare Funktionen und Steigung', content: 'Lies Steigung und y-Achsenabschnitt aus dem Graphen ab und zeichne die Funktion.
Arbeitsauftrag: Notiere jeden Rechenschritt und prüfe einen Punkt durch Einsetzen.
', date: daysAgo(2), attachments: [{ name: 'Funktionsgraphen-Arbeitsblatt.pdf', url: '/files/funktionsgraphen-arbeitsblatt.pdf' }] }, @@ -704,6 +762,57 @@ export function getMockResponse(url: string, method: string, config: any): { dat { date: weekDate(4), course: 'Informatik 9c', entry: 'Barrierefreie Website', url: '' }, ] } } }; } + if (u.startsWith('/meinunterricht/submissions/file/') && method === 'get') { + return { status: 200, data: new Blob(['Demo-Abgabedatei'], { type: 'text/plain' }) }; + } + if (u === '/meinunterricht/submissions/upload' && method === 'post') { + const uploadId = mockFormValue(config?.data, 'upload_id'); + const summary = mockSubmissions.find(item => `upload-${item.id}` === uploadId) || mockSubmissions[0]; + const files = getMockSubmissionFiles(summary); + const names = mockUploadedNames(config?.data); + const uploadedNames = names.length > 0 ? names : ['demo-upload.pdf']; + const statuses = uploadedNames.map(name => { + const nextIndex = files.reduce((highest, file) => Math.max(highest, Number(file.index) || 0), 0) + 1; + files.push(createMockSubmissionFile(summary, nextIndex, name)); + return { name, status: 'erfolgreich', message: null }; + }); + summary.uploaded_count = files.length; + syncMockCourseSubmissionCount(summary); + return { status: 200, data: { success: true, all_succeeded: true, files: statuses } }; + } + if (u === '/meinunterricht/submissions/file' && method === 'delete') { + const uploadId = mockFormValue(config?.data, 'upload_id'); + const summary = mockSubmissions.find(item => `upload-${item.id}` === uploadId) || mockSubmissions[0]; + const files = getMockSubmissionFiles(summary); + const fileIndex = mockFormValue(config?.data, 'file_index'); + const index = files.findIndex(file => file.index === fileIndex); + if (index >= 0) files.splice(index, 1); + summary.uploaded_count = files.length; + syncMockCourseSubmissionCount(summary); + return { status: 200, data: { success: true, code: '1', message: 'File deleted successfully' } }; + } + if (u.startsWith('/meinunterricht/submissions/') && method === 'get') { + const ref = u.split('/').pop() || 'demo-s1'; + const summary = mockSubmissions.find(item => item.detail_ref === ref) || mockSubmissions[0]; + const ownFiles = getMockSubmissionFiles(summary); + return { status: 200, data: { success: true, submission: { + ...summary, + upload_id: `upload-${summary.id}`, + start: 'Montag, 21.09.2026 · 08:00 Uhr', + deadline: summary.date_text, + automatic_deletion: '30.09.2026', + allows_multiple_files: true, + allows_multiple_attempts: true, + visibility: 'Nur Lehrkräfte', + allowed_file_types: ['PDF', 'DOCX'], + max_file_size: '10 MB', + additional_text: 'Bitte nur die fertige Datei abgeben.', + own_files: ownFiles, + public_files: [{ name: 'Hinweise.pdf', index: '99', time: null, comment: null, person: 'Frau Vogel', download_ref: 'demo-public-file', public: true }], + can_upload: summary.status === 'open', + can_delete: ownFiles.length > 0, + } } }; + } if (u === '/meinunterricht/submissions' && method === 'get') { return { status: 200, data: { success: true, submissions: mockSubmissions } }; } if (u === '/meinunterricht/homework-done' && method === 'post') { return { status: 200, data: { success: true } }; } diff --git a/src/components/submissions/Submissions.tsx b/src/components/submissions/Submissions.tsx new file mode 100644 index 00000000..29fe9183 --- /dev/null +++ b/src/components/submissions/Submissions.tsx @@ -0,0 +1,443 @@ +import React, { useEffect, useMemo, useRef, useState } from 'react'; +import { useNavigate, useParams } from 'react-router-dom'; +import { + ArrowDownTrayIcon, + ArrowLeftIcon, + ArrowPathIcon, + CheckCircleIcon, + ClockIcon, + DocumentArrowUpIcon, + DocumentTextIcon, + ExclamationCircleIcon, + InformationCircleIcon, + LockClosedIcon, + TrashIcon, + XMarkIcon, +} from '@heroicons/react/24/outline'; +import clsx from 'clsx'; +import axios from 'axios'; +import { useAuth } from '../../contexts/AuthContext'; +import { useBasePath } from '../../contexts/BasePathContext'; +import { coursesAPI } from '../../services/api'; +import { Submission, SubmissionDetail, SubmissionUploadStatus } from '../../types'; + +const statusLabel = (status: string) => status === 'open' ? 'Offen' : 'Geschlossen'; + +const statusClasses = (status: string) => status === 'open' + ? 'bg-emerald-100 text-emerald-800 dark:bg-emerald-950/60 dark:text-emerald-200' + : 'bg-surface-200 text-surface-700 dark:bg-surface-800 dark:text-surface-300'; + +const parseMaxBytes = (value?: string | null) => { + if (!value) return null; + const match = value.replace(',', '.').match(/([\d.]+)\s*(KB|MB|GB)/i); + if (!match) return null; + const amount = Number(match[1]); + const multiplier = match[2].toUpperCase() === 'GB' + ? 1_000_000_000 + : match[2].toUpperCase() === 'MB' ? 1_000_000 : 1_000; + return Number.isFinite(amount) ? amount * multiplier : null; +}; + +const formatBytes = (bytes: number) => { + if (bytes < 1_000_000) return `${Math.round(bytes / 1_000)} KB`; + return `${(bytes / 1_000_000).toFixed(bytes >= 10_000_000 ? 0 : 1)} MB`; +}; + +const extensionOf = (filename: string) => filename.split('.').pop()?.toLowerCase() || ''; + +const allowedExtension = (filename: string, allowed: string[]) => { + if (!allowed.length || allowed.some(value => value.trim().toLowerCase() === 'alle')) return true; + const extension = extensionOf(filename); + return allowed.some(value => value.trim().replace(/^\./, '').toLowerCase() === extension); +}; + +const SubmissionStatus: React.FC<{ status: string }> = ({ status }) => ( + + {status === 'open' ?{name}
+ {meta &&{meta}
} +Upload-Ergebnis
+ {statuses.map((item, index) => ( +{detail.course_name || 'Kurs'}
+Abgabe
Das Schulportal verlangt dein Passwort, um diese Datei endgültig zu löschen.
{deleteError &&Upload-Aufträge und Fristen
+Aufträge
{submissions.length}
Offen
{openCount}
Abgegeben
{submissions.filter(item => (item.uploaded_count || 0) > 0).length}
Sobald dir ein Upload-Auftrag zugewiesen wurde, erscheint er hier.