Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen Revision Vorhergehende Überarbeitung
Nächste Überarbeitung
Vorhergehende Überarbeitung
de:modul:m307:learningunits:lu00:07 [2026/06/02 14:37] vdemirde:modul:m307:learningunits:lu00:07 [2026/06/02 15:40] (aktuell) – [13.3 Technische Anforderungen] vdemir
Zeile 1: Zeile 1:
 ====== LU00f - LB02 Inhalt ====== ====== LU00f - LB02 Inhalt ======
-Bei der LB2 im Modul 307 wollen wir uns mit den CRUD-Operationen, die Sie im Unterricht kennen gelernt haben, beschäftigen. Dabei steht das Acronym CRUD für eine im Web gänige Operation. +Bei der LB2 im Modul 307 wollen wir uns mit den CRUD-Operationen, die Sie im Unterricht kennen gelernt haben, beschäftigen. Dabei steht das Acronym CRUD für die vier im Web gängigen Operationen:
  
   * **C**rud = Create, Neuanlegen   * **C**rud = Create, Neuanlegen
Zeile 19: Zeile 19:
   - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden.   - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden.
   - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden.   - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden.
-  - Filtern: Es soll nach allen vier Kriterien gefiltert werden können.+  - Filtern: Es soll nach allen Kriterien gefiltert werden können.
  
 ==== 1.3 Technische Anforderungen ==== ==== 1.3 Technische Anforderungen ====
Zeile 37: Zeile 37:
   - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden.   - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden.
   - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden.   - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden.
-  - Filtern: Es soll nach allen vier Kriterien gefiltert werden können.+  - Filtern: Es soll nach allen Kriterien gefiltert werden können.
  
 ==== 2.3 Technische Anforderungen ==== ==== 2.3 Technische Anforderungen ====
Zeile 55: Zeile 55:
   - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden.   - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden.
   - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden.   - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden.
-  - Filtern: Es soll nach allen vier Kriterien gefiltert werden können.+  - Filtern: Es soll nach allen Kriterien gefiltert werden können.
  
 ==== 3.3 Technische Anforderungen ==== ==== 3.3 Technische Anforderungen ====
Zeile 64: Zeile 64:
   * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap).   * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap).
  
-===== 4Fuhrpark =====+===== 4Fuhrpark =====
 ==== 4.1 Ausgangslage ===== ==== 4.1 Ausgangslage =====
 Unternehmen verwalten ihre Fahrzeuge häufig in einfachen Listen oder Tabellen. Sie erstellen eine Webanwendung zur digitalen Verwaltung eines Fuhrparks. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Fahrzeugdaten werden in einer lokalen JSON-Datei (vehicles.json) gespeichert und von dort gelesen. Unternehmen verwalten ihre Fahrzeuge häufig in einfachen Listen oder Tabellen. Sie erstellen eine Webanwendung zur digitalen Verwaltung eines Fuhrparks. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Fahrzeugdaten werden in einer lokalen JSON-Datei (vehicles.json) gespeichert und von dort gelesen.
Zeile 74: Zeile 74:
   - Bearbeiten (Update): Ein bestehender Fahrzeugeintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden.   - Bearbeiten (Update): Ein bestehender Fahrzeugeintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden.
   - Löschen (Delete): Jeder Fahrzeugeintrag kann über eine Schaltfläche aus der Liste entfernt werden.   - Löschen (Delete): Jeder Fahrzeugeintrag kann über eine Schaltfläche aus der Liste entfernt werden.
-  - Filtern: Es soll nach allen vier Kriterien gefiltert werden können.+  - Filtern: Es soll nach allen Kriterien gefiltert werden können.
  
 ==== 4.3 Technische Anforderungen ==== ==== 4.3 Technische Anforderungen ====
Zeile 83: Zeile 83:
   * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap).   * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap).
  
-===== 5BZZ-Zimmerverwaltung =====+===== 5BZZ-Zimmerverwaltung =====
 ==== 5.1 Ausgangslage ===== ==== 5.1 Ausgangslage =====
 Sie erstellen eine einfache Webanwendung zur Verwaltung von Schulzimmern. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (rooms.json) gespeichert und von dort gelesen. Sie erstellen eine einfache Webanwendung zur Verwaltung von Schulzimmern. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (rooms.json) gespeichert und von dort gelesen.
Zeile 89: Zeile 89:
 ==== 5.2 Aufgabenstellung ==== ==== 5.2 Aufgabenstellung ====
 Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei rooms.json mit folgenden Funktionen: Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei rooms.json mit folgenden Funktionen:
-  Anzeigen (Read): Alle gespeicherten Schulzimmer werden beim Laden der Seite als Liste angezeigt (Zimmernummer, Stockwerk, Kapazität, Ausstattung). +  Anzeigen (Read): Alle gespeicherten Schulzimmer werden beim Laden der Seite als Liste angezeigt (Zimmernummer, Stockwerk, Kapazität, Ausstattung). 
-  Hinzufügen (Create): Über ein Formular kann ein neues Schulzimmer mit Zimmernummer, Stockwerk, Kapazität und Ausstattung erfasst und der Liste hinzugefügt werden. +  Hinzufügen (Create): Über ein Formular kann ein neues Schulzimmer mit Zimmernummer, Stockwerk, Kapazität und Ausstattung erfasst und der Liste hinzugefügt werden. 
-  Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. +  Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
-  Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. +  Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  - Filtern: Es soll nach allen Kriterien gefiltert werden können.
  
 ==== 5.3 Technische Anforderungen ==== ==== 5.3 Technische Anforderungen ====
Zeile 101: Zeile 101:
   * Die Anzahl der Fahrzeuge je Status (verfügbar / in Betrieb / in Wartung) wird unterhalb der Liste angezeigt.   * Die Anzahl der Fahrzeuge je Status (verfügbar / in Betrieb / in Wartung) wird unterhalb der Liste angezeigt.
   * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap).   * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap).
-  *  
-===== 6: BMS-Zeugnis ===== 
-  * . 
  
-===== 7: BMS-Zeugnis ===== +===== 6. EFZ/BMS/ABU-Zeugnis ===== 
-  +==== 6.1 Ausgangslage ==== 
 +Sie erstellen eine einfache Webanwendung zur Verwaltung von EFZ-Notenausweisen für Mediamatiker/innen. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (zeugnisse.json) gespeichert und von dort gelesen.
  
-===== 8: Lehrbetriebe ===== +==== 6.2 Aufgabenstellung ==== 
-  * .+Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei zeugnisse.json mit folgenden Funktionen: 
 +  - Anzeigen (Read): Alle gespeicherten Notenausweise werden beim Laden der Seite als Liste angezeigt (Name, Vorname, Lehrjahr, Gesamtnote, Bestanden/Nicht bestanden). 
 +  - Hinzufügen (Create): Über ein Formular kann ein neuer Notenausweis mit Name, Vorname, Lehrjahr sowie den vier Qualifikationsbereichsnoten (VPA, Mediamatikkompetenzen, Allgemeinbildung, Betrieb) erfasst werden. 
 +  - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
 +  - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  - **Bonus**: Gesamtnote berechnen: Die Gesamtnote wird automatisch aus den vier Qualifikationsbereichsnoten gemäss der offiziellen Gewichtung berechnet (VPA 30%, Mediamatikkompetenzen 30%, Allgemeinbildung 10%, Betrieb 20%, Erweiterte Grundkompetenzen 10%) und in der Liste angezeigt. 
 +  - Filtern: Es soll nach allen vier Kriterien gefiltert werden können.
  
-===== 9: Kundenverwaltung ===== +==== 6.3 Technischen Anforderungen ==== 
-  * .+  * Die Datei zeugnisse.json enthält zu Beginn mindestens 3 Einträge als JSON-Array. 
 +  * Jeder Eintrag enthält mindestens: name, vorname, lehrjahr, noteVPA, noteMediamatik, noteAGB, noteBetrieb (alle als Zahl, halbe Noten erlaubt). 
 +  * Das Formular wird zur Eingabe und zur Bearbeitung verwendet (kein separates Formular). 
 +  * Pflichtfelder sind mit einer einfachen Validierung zu versehen (kein leerer Name, Noten zwischen 1.0 und 6.0). 
 +  * **Bonus:** Ein Eintrag wird in der Liste farblich hervorgehoben, wenn er nicht bestanden ist (Gesamtnote < 4.0). 
 +  * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap).
  
-===== 10: Standortverwaltung der Berufsschulen ===== +===== 7. Kundenverwaltung ===== 
-  .+==== 7.1 Ausgangslage ==== 
 +Sie erstellen eine einfache Webanwendung zur Verwaltung von Kunden. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (kunden.json) gespeichert und von dort gelesen.
  
-===== 11: Ferienverwaltung ===== +==== 7.2 Aufgabenstellung ==== 
-  * .+Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei kunden.json mit folgenden Funktionen: 
 +  * Anzeigen (Read): Alle gespeicherten Kunden werden beim Laden der Seite als Liste angezeigt (Vorname, Nachname, E-Mail, Telefon, Ort). 
 +  * Hinzufügen (Create): Über ein Formular kann ein neuer Kunde mit Vorname, Nachname, E-Mail, Telefon und Ort erfasst und der Liste hinzugefügt werden. 
 +  * Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
 +  * Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  * Filtern: Es soll nach allen Kriterien gefiltert werden können.
  
-===== 12: CV Arbeitszeugnisse ===== +==== 7.3 Technischen Anforderungen ==== 
-  * .+Technische Anforderungen 
 +  * Die Datei kunden.json enthält zu Beginn mindestens 3 Einträge als JSON-Array. 
 +  * Das Formular wird zur Eingabe und zur Bearbeitung verwendet (kein separates Formular). 
 +  * Pflichtfelder sind mit einer einfachen Validierung zu versehen (kein leerer Name, gültige E-Mail-Adresse). 
 +  * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap). 
 + 
 + 
 +===== 8. Lehrbetriebe ===== 
 +==== 8.1 Ausgangslage ==== 
 +Sie erstellen eine einfache Webanwendung zur Verwaltung von Lehrbetrieben. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (lehrbetriebe.json) gespeichert und von dort gelesen. 
 + 
 +==== 8.2 Aufgabenstellung ==== 
 +Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei lehrbetriebe.json mit folgenden Funktionen: 
 +  - Anzeigen (Read): Alle gespeicherten Lehrbetriebe werden beim Laden der Seite als Liste angezeigt (Firmenname, Branche, Kontaktperson, Telefon, Ort). 
 +  - Hinzufügen (Create): Über ein Formular kann ein neuer Lehrbetrieb mit Firmenname, Branche, Kontaktperson, Telefon und Ort erfasst und der Liste hinzugefügt werden. 
 +  - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
 +  - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  - Filtern: Es soll nach allen Kriterien gefiltert werden können. 
 + 
 +==== 8.3 Technischen Anforderungen ==== 
 +  * Die Datei lehrbetriebe.json enthält zu Beginn mindestens 3 Einträge als JSON-Array. 
 +  * Das Formular wird zur Eingabe und zur Bearbeitung verwendet (kein separates Formular). 
 +  * Pflichtfelder sind mit einer einfachen Validierung zu versehen (kein leerer Firmenname, kein leere Kontaktperson). 
 +  * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap). 
 + 
 +===== 9. Staatsoberhäupter & Prime-Minister ===== 
 +==== 9.1 Ausgangslage ==== 
 +Sie erstellen eine einfache Webanwendung zur Verwaltung von Staatsoberhäuptern und Präsidenten. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (staatsoberhaupter.json) gespeichert und von dort gelesen. 
 + 
 +==== 9.2 Aufgabenstellung ==== 
 +Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei staatsoberhaupter.json mit folgenden Funktionen: 
 +  - Anzeigen (Read): Alle gespeicherten Staatsoberhäupter werden beim Laden der Seite als Liste angezeigt (Vorname, Nachname, Land, Titel, Amtsantritt). 
 +  - Hinzufügen (Create): Über ein Formular kann ein neues Staatsoberhaupt mit Vorname, Nachname, Land, Titel (z. B. Präsident, König, Bundeskanzler) und Amtsantritt (Jahr) erfasst und der Liste hinzugefügt werden. 
 +  - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
 +  - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  - **Bonus**Amtsdauer berechnen: Die bisherige Amtsdauer in Jahren wird automatisch aus dem Amtsantritt berechnet und in der Liste angezeigt. 
 +  - Filtern: Es soll nach allen Kriterien gefiltert werden können. 
 + 
 +==== 9.3 Technische Anforderungen ==== 
 +  * Die Datei staatsoberhaupter.json enthält zu Beginn mindestens 3 Einträge als JSON-Array. 
 +  * Jeder Eintrag enthält mindestens: vorname, nachname, land, titel, amtsantritt (als vierstellige Jahreszahl). 
 +  * Das Formular wird zur Eingabe und zur Bearbeitung verwendet (kein separates Formular). 
 +  * Pflichtfelder sind mit einer einfachen Validierung zu versehen (kein leerer Name, kein leeres Land, Amtsantritt muss eine gültige vierstellige Jahreszahl sein). 
 +  * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap). 
 + 
 +===== 10. Gebäudeverwaltung ===== 
 +==== 10.1 Ausgangslage ==== 
 +Sie erstellen eine einfache Webanwendung zur Verwaltung der Gebäude und Schulstandorte einer Schule. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (gebaeude.json) gespeichert und von dort gelesen. 
 + 
 +==== 10.2 Aufgabenstellung ==== 
 +Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei gebaeude.json mit folgenden Funktionen: 
 +  - Anzeigen (Read): Alle gespeicherten Gebäude werden beim Laden der Seite als Liste angezeigt (Bezeichnung, Adresse, Anzahl Stockwerke, Anzahl Schulzimmer, Baujahr). 
 +  - Hinzufügen (Create): Über ein Formular kann ein neues Gebäude mit Bezeichnung, Adresse, Anzahl Stockwerke, Anzahl Schulzimmer und Baujahr erfasst und der Liste hinzugefügt werden. 
 +  - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
 +  - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  - **Bonus:**Gebäudealter berechnen: Das Alter des Gebäudes in Jahren wird automatisch aus dem Baujahr berechnet und in der Liste angezeigt. 
 +  - Filtern: Es soll nach allen Kriterien gefiltert werden können. 
 + 
 +==== 10.3 Technische Anforderungen ==== 
 +  * Die Datei gebaeude.json enthält zu Beginn mindestens 3 Einträge als JSON-Array. 
 +  * Jeder Eintrag enthält mindestens: bezeichnung, adresse, stockwerke, schulzimmer, baujahr (als vierstellige Jahreszahl). 
 +  * Das Formular wird zur Eingabe und zur Bearbeitung verwendet (kein separates Formular). 
 +  * Pflichtfelder sind mit einer einfachen Validierung zu versehen (keine leere Bezeichnung, keine leere Adresse, Baujahr als gültige vierstellige Jahreszahl). 
 +  * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap). 
 + 
 +===== 11. Ferienverwaltung  ===== 
 +==== 11.1 Ausgangslage ==== 
 +Sie erstellen eine einfache Webanwendung zur Verwaltung persönlicher Ferienreisen. Die Anwendung ermöglicht es, vergangene und geplante Reisen festzuhalten – wohin man gereist ist, wann, wie lange und wie viel die Reise gekostet hat. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (reisen.json) gespeichert und von dort gelesen. 
 + 
 +==== 11.2 Aufgabenstellung ==== 
 +Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei reisen.json mit folgenden Funktionen: 
 +  - Anzeigen (Read): Alle gespeicherten Reisen werden beim Laden der Seite als Liste angezeigt (Reiseziel, Land, Abreisedatum, Rückreisedatum, Transportmittel, Kosten in CHF). 
 +  - Hinzufügen (Create): Über ein Formular kann eine neue Reise mit Reiseziel, Land, Abreisedatum, Rückreisedatum, Transportmittel (z. B. Flugzeug, Zug, Auto, Schiff) und Kosten in CHF erfasst werden. 
 +  - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
 +  - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  - **Bonus** Reisedauer berechnen: Die Reisedauer in Tagen wird automatisch aus Abreise- und Rückreisedatum berechnet und in der Liste angezeigt. 
 +  - **Bonus** Gesamtkosten anzeigen: Unterhalb der Liste wird die Summe aller Reisekosten in CHF automatisch berechnet und angezeigt. 
 +  - Filtern: Es soll nach allen Kriterien gefiltert werden können. 
 + 
 +==== 11.3 Technische Anforderungen ==== 
 +Technische Anforderungen 
 +  * Die Datei reisen.json enthält zu Beginn mindestens 3 Einträge als JSON-Array. 
 +  * Jeder Eintrag enthält mindestens: reiseziel, land, abreise (YYYY-MM-DD), rueckreise (YYYY-MM-DD), transportmittel, kosten (Zahl). 
 +  * Das Formular wird zur Eingabe und zur Bearbeitung verwendet (kein separates Formular). 
 +  * Pflichtfelder sind mit einer einfachen Validierung zu versehen (kein leeres Reiseziel, kein leeres Land, Rückreisedatum darf nicht vor dem Abreisedatum liegen). 
 +  * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap). 
 + 
 + 
 +===== 12. Strafzettel-Management  ===== 
 +==== 12.1 Ausgangslage ==== 
 +Sie entwickeln eine einfache Webanwendung zur Verwaltung von Strafzetteln (Verkehrsbussen). Die Anwendung ermöglicht es, ausgestellte Strafzettel zu erfassen, einzusehen, zu bearbeiten und zu löschen. 
 + 
 +Zu jedem Strafzettel werden Angaben zum Fahrzeughalter, dem Kennzeichen, der Verstossart, dem Ort sowie der Busse in CHF gespeichert. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (strafzettel.json) gespeichert und von dort gelesen. 
 + 
 +==== 12.2 Aufgabenstellung ==== 
 +Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei strafzettel.json mit folgenden Funktionen: 
 +  Anzeigen (Read): Alle gespeicherten Strafzettel werden beim Laden der Seite als Liste angezeigt (Name des Halters, Kennzeichen, Verstoss, Ort, Datum, Bussbetrag in CHF). 
 +  - Hinzufügen (Create): Über ein Formular kann ein neuer Strafzettel mit Name des Fahrzeughalters, Kennzeichen, Verstossart (z. B. Falschparken, Geschwindigkeitsübertretung, Rotlichtmissachtung, Handynutzung am Steuer), Ort, Datum und Bussbetrag in CHF erfasst werden. 
 +  - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
 +  - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  - **Bonus** Bussenkategorie anzeigen: Anhand des Bussbetrags wird automatisch eine Kategorie berechnet und angezeigt: «Gering» (unter 100 CHF), «Mittel» (100–299 CHF), «Hoch» (ab 300 CHF). 
 +  - **Bonus** Gesamtbussen anzeigen: Unterhalb der Liste wird die Summe aller Bussbeträge in CHF automatisch berechnet und angezeigt. 
 +  - Filtern: Es soll nach allen Kriterien gefiltert werden können. 
 + 
 + 
 +==== 12.3 Technische Anforderungen ==== 
 +  * Die Datei strafzettel.json enthält zu Beginn mindestens 3 Einträge als JSON-Array. 
 +  * Jeder Eintrag enthält mindestens: name, kennzeichen, verstoss, ort, datum (YYYY-MM-DD), betrag (Zahl). 
 +  * Das Formular wird zur Eingabe und zur Bearbeitung verwendet (kein separates Formular). 
 +  * Pflichtfelder sind mit einer einfachen Validierung zu versehen: kein leeres Namensfeld, kein leeres Kennzeichen, Datum darf nicht in der Zukunft liegen, Betrag muss eine positive Zahl sein. 
 +  * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap). 
 + 
 +===== 13. Equipment-Verwaltung  ===== 
 +==== 13.1 Ausgangslage ==== 
 +Sie entwickeln eine einfache Webanwendung zur Verwaltung von Equipment (z. B. Kameras, Stative, Blitzgeräte, Notebooks, Mikrofone). Die Anwendung ermöglicht es, vorhandene Geräte zu erfassen, einzusehen, zu bearbeiten und zu löschen. 
 + 
 +Zu jedem Gerät werden Angaben zur Bezeichnung, Kategorie, Seriennummer, Standort, Anschaffungsdatum und Wert in CHF gespeichert. Die Anwendung besteht aus einer einzigen HTML-Seite mit eingebettetem JavaScript. Alle Daten werden in einer lokalen JSON-Datei (equipment.json) gespeichert und von dort gelesen. 
 + 
 + 
 +==== 13.2 Aufgabenstellung ==== 
 +Erstellen Sie eine HTML-Seite index.html sowie eine Datendatei equipment.json mit folgenden Funktionen: 
 +  - Anzeigen (Read): Alle gespeicherten Geräte werden beim Laden der Seite als Liste angezeigt (Bezeichnung, Kategorie, Seriennummer, Standort, Anschaffungsdatum, Wert in CHF). 
 +  - Hinzufügen (Create): Über ein Formular kann ein neues Gerät mit Bezeichnung, Kategorie (z. B. Kamera, Stativ, Blitz, Notebook, Mikrofon, Sonstiges), Seriennummer, Standort, Anschaffungsdatum und Wert in CHF erfasst werden. 
 +  - Bearbeiten (Update): Ein bestehender Eintrag kann ausgewählt, im Formular bearbeitet und gespeichert werden. 
 +  - Löschen (Delete): Jeder Listeneintrag kann über eine Schaltfläche entfernt werden. 
 +  - **Bonus** Alter des Geräts berechnen: Das Alter des Geräts in Jahren wird automatisch aus dem Anschaffungsdatum berechnet und in der Liste angezeigt. 
 +  - **Bonus** Gesamtwert anzeigen: Unterhalb der Liste wird die Summe aller Gerätewerte in CHF automatisch berechnet und angezeigt. 
 +  - Filtern nach Kategorie: Über ein Dropdown kann die Liste nach Kategorie gefiltert werden, sodass nur Geräte der gewählten Kategorie angezeigt werden. 
 + 
 + 
 +==== 13.3 Technische Anforderungen ==== 
 +  * Die Datei equipment.json enthält zu Beginn mindestens 3 Einträge als JSON-Array. 
 +  * Jeder Eintrag enthält mindestens: bezeichnung, kategorie, seriennummer, standort, anschaffung (YYYY-MM-DD), wert (Zahl). 
 +  * Das Formular wird zur Eingabe und zur Bearbeitung verwendet (kein separates Formular). 
 +  * Pflichtfelder sind mit einer einfachen Validierung zu versehen: keine leere Bezeichnung, keine leere Seriennummer, Anschaffungsdatum darf nicht in der Zukunft liegen, Wert muss eine positive Zahl sein. 
 +  * Die Anwendung soll ohne externe Frameworks auskommen (kein jQuery, kein Bootstrap).
  
-===== 13: Staatsoberhäupter & Prime-Minister ===== 
-  * . 
  
-===== 14: Staatsformen ===== 
-  * . 
  
 ---- ----
  • de/modul/m307/learningunits/lu00/07.1780403861.txt.gz
  • Zuletzt geändert: 2026/06/02 14:37
  • von vdemir