diff --git a/Client/Components/kunde.ts b/Client/Components/kunde.ts index 291e390..89bbb5c 100644 --- a/Client/Components/kunde.ts +++ b/Client/Components/kunde.ts @@ -2,6 +2,7 @@ import m from "mithril" import {Form, iForm} from "./widgets/form" import { Input, iInput} from "./widgets/inputs" import {Treenode, iTreenode, Treetable, iTreetable, TopbarButton, iTopbarButton} from "./widgets/Treetable_V2" +import {iKunde, kundenDaten, getNewKundeId, addKunde, updateKunde} from "../models/kunde" export const kunde: m.ClosureComponent = (vnode) => { let currentKunde: iKunde = { @@ -50,7 +51,7 @@ export const kunde: m.ClosureComponent = (vnode) => { const cancel = (e: Event) => { m.route.set("/kundenliste") } - return m("div.w3-container.w3-twothird", + return m("div.w3-container.w3-auto", m("h1", currentKunde.id === -1 ? "Neuen Kunden anlegen" : "Kundenstammblatt"), m(Form, {showButtons: true, onsubmit: submit, oncancel: cancel} as iForm, [ m("label", "Kundenname", m(Input, {name: "kundenname", value: currentKunde.name, type: "text", required: true} as iInput)), @@ -64,39 +65,6 @@ export const kunde: m.ClosureComponent = (vnode) => { } } -interface iKunde { - id: number - name: string - strasse: string - plz: string - ort: string - land: string -} - -function getNewKundeId(): number { - if (kundenDaten.length === 0) { - return 1 - } - return Math.max(...kundenDaten.map((kunde: iKunde) => kunde.id)) + 1 -} - -function addKunde(kunde: iKunde): void { - kundenDaten.push(kunde) -} - -function updateKunde(kunde: iKunde): void { - const index = kundenDaten.findIndex((k: iKunde) => k.id === kunde.id) - if (index !== -1) { - kundenDaten[index] = kunde - } -} - -const kundenDaten: iKunde[] = [ - {id: 1, name: "Musterfirma GmbH", strasse: "Musterstraße 1", plz: "12345", ort: "Musterstadt", land: "Deutschland"}, - {id: 2, name: "Beispiel AG", strasse: "Beispielweg 2", plz: "54321", ort: "Beispielstadt", land: "Deutschland"}, - {id: 3, name: "Test Unternehmen", strasse: "Testallee 3", plz: "67890", ort: "Testdorf", land: "Österreich"} -] - /** * Erzeugt aus der Kundendatenliste die Treenode-Struktur für die Treetable der * Kundenliste. Jeder Kunde wird zu einem expandierten Treenode ohne Kinder @@ -164,11 +132,8 @@ export const kundenliste: m.ClosureComponent = (vnode) => { return { view: (vnode) => { - return m("div.w3-container", { + return m("div.w3-container.w3-auto", { style: { - 'max-width': '80%', - 'margin-left': 'auto', - 'margin-right': 'auto', display: 'flex', 'flex-direction': 'column', height: 'inherit', diff --git a/Client/models/kunde.ts b/Client/models/kunde.ts new file mode 100644 index 0000000..f92abe2 --- /dev/null +++ b/Client/models/kunde.ts @@ -0,0 +1,156 @@ +import m from "mithril" + +/** + * Datenmodell für einen Kunden. + * + * Modèle de données pour un client. + */ +export interface iKunde { + id: number + name: string + strasse: string + plz: string + ort: string + land: string +} + +/** + * In-Memory-Datenspeicher für Kunden. Wird als Fallback solange verwendet, + * bis die serverseitigen REST-Endpunkte verfügbar sind. + * + * Stockage en mémoire des clients. Utilisé comme solution de repli tant + * que les points de terminaison REST côté serveur ne sont pas disponibles. + */ +export const kundenDaten: iKunde[] = [ + {id: 1, name: "Musterfirma GmbH", strasse: "Musterstraße 1", plz: "12345", ort: "Musterstadt", land: "Deutschland"}, + {id: 2, name: "Beispiel AG", strasse: "Beispielweg 2", plz: "54321", ort: "Beispielstadt", land: "Deutschland"}, + {id: 3, name: "Test Unternehmen", strasse: "Testallee 3", plz: "67890", ort: "Testdorf", land: "Österreich"} +] + +/** + * Liefert die nächste freie Kunden-ID auf Basis des In-Memory-Speichers. + * Sobald die serverseitige ID-Vergabe verfügbar ist, entfällt diese Funktion. + * + * Retourne le prochain identifiant client libre à partir du stockage en + * mémoire. Cette fonction deviendra obsolète dès que l'attribution des + * identifiants côté serveur sera disponible. + */ +export function getNewKundeId(): number { + if (kundenDaten.length === 0) { + return 1 + } + return Math.max(...kundenDaten.map((kunde: iKunde) => kunde.id)) + 1 +} + +/** + * Fügt einen neuen Kunden dem In-Memory-Speicher hinzu. + * + * Ajoute un nouveau client au stockage en mémoire. + */ +export function addKunde(kunde: iKunde): void { + kundenDaten.push(kunde) +} + +/** + * Aktualisiert einen bestehenden Kunden im In-Memory-Speicher. + * + * Met à jour un client existant dans le stockage en mémoire. + */ +export function updateKunde(kunde: iKunde): void { + const index = kundenDaten.findIndex((k: iKunde) => k.id === kunde.id) + if (index !== -1) { + kundenDaten[index] = kunde + } +} + +/** + * Liefert eine Kopie aller Kunden aus dem In-Memory-Speicher. + * + * Retourne une copie de tous les clients du stockage en mémoire. + */ +export function getKunden(): iKunde[] { + return [...kundenDaten] +} + +/* ------------------------------------------------------------------ */ +/* REST-API-Aufrufe (Client-Seite) */ +/* ------------------------------------------------------------------ */ +/* Die folgenden Funktionen kapseln die Kommunikation mit den */ +/* serverseitigen REST-Endpunkten. Die Endpunkte sind noch nicht */ +/* implementiert und werden später nachgereicht. */ +/* */ +/* Les fonctions suivantes encapsulent la communication avec les */ +/* points de terminaison REST côté serveur. Ceux-ci ne sont pas encore */ +/* implémentés et seront fournis ultérieurement. */ +/* ------------------------------------------------------------------ */ + +/** + * Basis-Pfad der Kunden-REST-Endpunkte. + * + * Chemin de base des points de terminaison REST des clients. + */ +const KUNDE_REST_BASE = "/xhr/kunde" + +/** + * Lädt die Kundenliste vom Server. + * + * Charge la liste des clients depuis le serveur. + */ +export function fetchKunden(): Promise { + return m.request({ + method: "GET", + url: KUNDE_REST_BASE + "/list" + }).then((result) => result as iKunde[]) +} + +/** + * Lädt einen einzelnen Kunden anhand seiner ID vom Server. + * + * Charge un client unique identifié par son id depuis le serveur. + */ +export function fetchKundeById(id: number): Promise { + return m.request({ + method: "GET", + url: KUNDE_REST_BASE + "/get", + params: {id: id} + }).then((result) => result as iKunde) +} + +/** + * Legt einen neuen Kunden serverseitig an. + * + * Crée un nouveau client côté serveur. + */ +export function createKundeREST(kunde: iKunde): Promise { + return m.request({ + method: "POST", + url: KUNDE_REST_BASE + "/create", + body: kunde + }).then((result) => result as iKunde) +} + +/** + * Aktualisiert einen bestehenden Kunden serverseitig. + * + * Met à jour un client existant côté serveur. + */ +export function updateKundeREST(kunde: iKunde): Promise { + return m.request({ + method: "PUT", + url: KUNDE_REST_BASE + "/update", + body: kunde + }).then((result) => result as iKunde) +} + +/** + * Löscht einen Kunden serverseitig anhand seiner ID. + * + * Supprime un client côté serveur identifié par son id. + */ +export function deleteKundeREST(id: number): Promise { + return m.request({ + method: "DELETE", + url: KUNDE_REST_BASE + "/delete", + params: {id: id} + }).then(() => undefined) +}