diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index 5f17672..6ff2c7e 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -25,6 +25,20 @@ function App() { const [editingAppointment, setEditingAppointment] = useState(null); const [isModalOpen, setIsModalOpen] = useState(false); const [appointmentToDeleteId, setAppointmentToDeleteId] = useState(null); + + // Helfer: Start des heutigen Tages für Filter "aktuelle Termine" + const startOfToday = new Date(); + startOfToday.setHours(0, 0, 0, 0); + + // Gefilterte Liste: nur nicht erledigte Termine ab heute + const currentAppointments = appointments + .filter(a => !a.erledigt && a.termin >= startOfToday) + .sort((a, b) => a.termin - b.termin); + + // Drucken triggern + const handlePrintCurrent = () => { + window.print(); + }; // NEU: Lädt Termine vom Backend beim Start useEffect(() => { @@ -188,29 +202,68 @@ function App() { return (
- {/* ... (Header und Formular-Einbindung) ... */} - setEditingAppointment(null)} - /> - {/* ... */} - setEditingAppointment(app)} - onDelete={openDeleteModal} +
+ {/* Druck-Button für aktuelle Termine */} +
+ +
+ + {/* Formular */} + setEditingAppointment(null)} /> + + {/* Gesamte Liste */} + setEditingAppointment(app)} + onDelete={openDeleteModal} + /> + {/* NEU: MODAL KOMPONENTE */} - - {/* Debug Output kann nun entfernt werden */} + +
+ + {/* Druckansicht: nur aktuelle (offene) Termine ab heute */} +
+

Aktuelle Arzt-Termine

+ {currentAppointments.length === 0 ? ( +

Keine aktuellen Termine vorhanden.

+ ) : ( + + + + + + + + + + + {currentAppointments.map(app => ( + + + + + + + ))} + +
ArztFachrichtungDatumBemerkungen
{app.arztName}{app.arztArt || ''}{app.termin.toLocaleString('de-DE')}{app.bemerkungen || ''}
+ )} +
); } diff --git a/frontend/src/AppStyles.css b/frontend/src/AppStyles.css index 0063fb6..5190e8b 100644 --- a/frontend/src/AppStyles.css +++ b/frontend/src/AppStyles.css @@ -207,4 +207,72 @@ body { .cancel-button:hover { background-color: #c82333; +} + +/* Druck-Funktionalität */ +.print-controls { + display: flex; + justify-content: flex-end; + margin-bottom: 20px; +} + +.print-button { + background-color: #007bff; + color: white; + padding: 10px 16px; + border: none; + border-radius: 5px; + cursor: pointer; + font-size: 14px; +} + +.print-button:hover { + background-color: #0069d9; +} + +/* Standard: Druckbereich ausblenden, Bildschirm-Inhalte anzeigen */ +.print-only { + display: none; +} + +@media print { + /* Bildschirm-UI ausblenden */ + .screen-only, .screen-only * { + display: none !important; + } + + /* Nur Druckbereich anzeigen */ + .print-only { + display: block !important; + } + + body { + background: #ffffff; + margin: 10mm; + color: #000; + } + + .print-only h1 { + margin-top: 0; + font-size: 20px; + } + + .print-table { + width: 100%; + border-collapse: collapse; + font-size: 12px; + } + + .print-table th, + .print-table td { + border: 1px solid #000; + padding: 6px; + text-align: left; + } + + .print-table thead th { + background: #eee; + -webkit-print-color-adjust: exact; + print-color-adjust: exact; + } } \ No newline at end of file