feat: add UI prototype v8d source files (index.html, app.compiled.js, interactions.js, style.css)

2026-07-13 09:51:03 +02:00
parent afe6d0a168
commit be5a339b32
4 changed files with 7711 additions and 0 deletions
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
+  <title>ERP Nutzfahrzeuge - Prototyp</title>
+  <link rel="stylesheet" href="style.css?v=8d">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+  <script src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
+  <script src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
+  <script src="interactions.js?v=8d"></script>
+</head>
+<body>
+  <a href="#main-content" class="skip-link">Skip to main content</a>
+  <div id="root"></div>
+  <script src="app.compiled.js?v=8d"></script>
+</body>
+</html>
@@ -0,0 +1,563 @@
+/* ============================================
+   ERP Nutzfahrzeuge - Shared Interactions
+   ============================================ */
+
+// i18n Translations
+const translations = {
+  de: {
+    // Navigation
+    'nav.dashboard': 'Dashboard',
+    'nav.fahrzeuge': 'Fahrzeugbestand',
+    'nav.fahrzeuge.liste': 'Bestandsliste',
+    'nav.fahrzeuge.neu': 'Neues Fahrzeug',
+    'nav.kontakte': 'Kontakte',
+    'nav.verkauf': 'Verkauf',
+    'nav.dateien': 'Dateien',
+    'nav.ki-copilot': 'KI-Copilot',
+    'nav.einstellungen': 'Einstellungen',
+    'nav.benutzerverwaltung': 'Benutzerverwaltung',
+    'nav.datev': 'DATEV-Export',
+    'nav.rechnungen': 'Rechnungen',
+    'nav.main': 'Hauptmenü',
+    'nav.verwaltung': 'Verwaltung',
+    'nav.ki': 'Künstliche Intelligenz',
+    // Topbar
+    'topbar.search': 'Fahrzeuge, Kontakte, FIN suchen...',
+    'topbar.profile': 'Profil',
+    'topbar.logout': 'Abmelden',
+    'topbar.role': 'Rolle',
+    // Dashboard
+    'dash.title': 'Dashboard',
+    'dash.fahrzeuge_im_bestand': 'Fahrzeuge im Bestand',
+    'dash.verkaufe_diesen_monat': 'Verkäufe diesen Monat',
+    'dash.offene_tasks': 'Offene Tasks',
+    'dash.mobilede_sync': 'mobile.de Sync-Status',
+    'dash.schnellzugriffe': 'Schnellzugriffe',
+    'dash.neues_fahrzeug': 'Neues Fahrzeug anlegen',
+    'dash.neuer_verkauf': 'Neuer Verkauf',
+    'dash.ki_copilot': 'KI-Copilot öffnen',
+    'dash.letzte_aktivitaeten': 'Letzte Aktivitäten',
+    'dash.bevorstehende_tasks': 'Bevorstehende Tasks',
+    'dash.verkaeufe_entwicklung': 'Verkäufe Entwicklung',
+    'dash.top_fahrzeuge': 'Fahrzeuge mit meisten Anfragen',
+    'dash.weiter': 'Weiter',
+    // Fahrzeugbestand
+    'fb.title': 'Fahrzeugbestand',
+    'fb.suche': 'Fahrzeug suchen (Marke, Modell, FIN)...',
+    'fb.filter': 'Filter',
+    'fb.alle': 'Alle',
+    'fb.lkw': 'LKW',
+    'fb.baumaschine': 'Baumaschine',
+    'fb.transporter': 'Transporter',
+    'fb.add_new': 'Fahrzeug hinzufügen',
+    'fb.marke': 'Marke',
+    'fb.modell': 'Modell',
+    'fb.fin': 'FIN',
+    'fb.baujahr': 'Baujahr',
+    'fb.km_stand': 'KM-Stand',
+    'fb.betriebsstunden': 'Betriebsstunden',
+    'fb.preis': 'Preis',
+    'fb.status': 'Status',
+    'fb.mobilede': 'mobile.de',
+    'fb.typ': 'Typ',
+    'fb.standort': 'Standort',
+    'fb.verfuegbarkeit': 'Verfügbarkeit',
+    'fb.verfuegbar': 'Verfügbar',
+    'fb.reserviert': 'Reserviert',
+    'fb.verkauft': 'Verkauft',
+    'fb.gelistet': 'Gelistet',
+    'fb.nicht_gelistet': 'Nicht gelistet',
+    'fb.fehler': 'Fehler',
+    'fb.aktion': 'Aktion',
+    'fb.bearbeiten': 'Bearbeiten',
+    'fb.details': 'Details',
+    'fb.anzeigen': 'Anzeigen',
+    'fb.keine_fahrzeuge': 'Keine Fahrzeuge gefunden',
+    'fb.keine_fahrzeuge_text': 'Es sind noch keine Fahrzeuge im Bestand. Legen Sie Ihr erstes Fahrzeug an.',
+    'fb.fahrzeug_hinzufuegen': 'Fahrzeug hinzufügen',
+    'fb.export': 'Export (CSV)',
+    'fb.filter_zuruecksetzen': 'Filter zurücksetzen',
+    // Fahrzeug Detail
+    'fd.titel': 'Fahrzeugdetails',
+    'fd.allgemein': 'Allgemein',
+    'fd.technische_daten': 'Technische Daten',
+    'fd.baumaschinen_daten': 'Baumaschinen-Daten',
+    'fd.verkaufsinfo': 'Verkaufsinfo',
+    'fd.dokumente': 'Dokumente',
+    'fd.fotos': 'Fotos',
+    'fd.mobilede_status': 'mobile.de Status',
+    'fd.bearbeiten': 'Bearbeiten',
+    'fd.verkaufen': 'Verkaufen',
+    'fd.zurueck': 'Zurück zur Liste',
+    'fd.hauptfoto': 'Hauptfoto',
+    'fd.keine_fotos': 'Keine Fotos vorhanden',
+    'fd.foto_hochladen': 'Foto hochladen',
+    'fd.dokument_hochladen': 'Dokument hochladen',
+    'fd.kategorie': 'Kategorie',
+    'fd.dateiname': 'Dateiname',
+    'fd.groesse': 'Größe',
+    'fd.upload_datum': 'Upload-Datum',
+    'fd.sync_mobilede': 'Auf mobile.de synchronisieren',
+    'fd.delisting': 'mobile.de Listing entfernen',
+    'fd.bildretusche': 'KI-Bildretusche',
+    'fd.preisvergleich': 'Preisvergleich mobile.de',
+    // Fahrzeug Formular
+    'ff.titel_neu': 'Neues Fahrzeug anlegen',
+    'ff.titel_bearbeiten': 'Fahrzeug bearbeiten',
+    'ff.speichern': 'Speichern',
+    'ff.abbrechen': 'Abbrechen',
+    'ff.pflichtfeld': 'Pflichtfeld',
+    'ff.ocr_upload': 'OCR-Upload (ZB I / ZB II)',
+    'ff.ocr_text': 'Fahrzeugschein oder Fahrzeugbrief fotografieren und Daten automatisch ausfüllen',
+    'ff.ocr_ausloesen': 'OCR starten',
+    'ff.standard_daten': 'Standarddaten',
+    'ff.baumaschinen_daten': 'Baumaschinen-spezifische Daten',
+    'ff.fahrzeugtyp': 'Fahrzeugtyp',
+    'ff.fin_hinweis': '17 Zeichen, eindeutige Fahrzeugidentifikationsnummer',
+    'ff.fin_ungueltig': 'FIN muss genau 17 Zeichen haben',
+    'ff.fin_doppelt': 'FIN bereits vorhanden',
+    'ff.leistung': 'Leistung (kW)',
+    'ff.leistung_ps': 'Leistung (PS)',
+    'ff.kraftstoffart': 'Kraftstoffart',
+    'ff.getriebe': 'Getriebe',
+    'ff.farbe': 'Farbe',
+    'ff.zustand': 'Zustand',
+    'ff.erstzulassung': 'Erstzulassung',
+    'ff.neu': 'Neu',
+    'ff.gebraucht': 'Gebraucht',
+    'ff.lkw_typ': 'LKW-Typ',
+    'ff.art': 'Art (Bagger, Radlader, etc.)',
+    'ff.aufbau': 'Aufbau',
+    'ff.betriebsstunden_wert': 'Betriebsstunden',
+    'ff.betriebsstunden_einheit': 'Einheit',
+    'ff.stunden': 'Stunden (h)',
+    'ff.minuten': 'Minuten (min)',
+    'ff.manuell': 'Manuell',
+    'ff.automatik': 'Automatik',
+    'ff.diesel': 'Diesel',
+    'ff.benzin': 'Benzin',
+    'ff.elektro': 'Elektro',
+    'ff.hybrid': 'Hybrid',
+    // Kontakte
+    'kt.title': 'Kontakt- & Kundenverwaltung',
+    'kt.suche': 'Kontakte suchen (Name, Firma, Land)...',
+    'kt.add_new': 'Neuer Kontakt',
+    'kt.firmenname': 'Firmenname',
+    'kt.ansprechpartner': 'Ansprechpartner',
+    'kt.land': 'Land',
+    'kt.rolle': 'Rolle',
+    'kt.ust_id': 'USt-IdNr.',
+    'kt.ust_status': 'USt-Status',
+    'kt.geprueft': 'Geprüft',
+    'kt.ungeprueft': 'Ungeprüft',
+    'kt.manuell_best': 'Manuell bestätigt',
+    'kt.kaeufer': 'Käufer',
+    'kt.verkaeufer': 'Verkäufer',
+    'kt.beides': 'Käufer & Verkäufer',
+    'kt.detail': 'Detail',
+    'kt.keine_kontakte': 'Keine Kontakte gefunden',
+    'kt.keine_kontakte_text': 'Es sind noch keine Kontakte angelegt.',
+    'kt.neuer_kontakt': 'Neuen Kontakt anlegen',
+    // Verkauf
+    'vk.title': 'Verkaufsmodul',
+    'vk.neuer_verkauf': 'Neuer Verkauf',
+    'vk.fahrzeug': 'Fahrzeug',
+    'vk.kaeufer': 'Käufer',
+    'vk.verkaeufer': 'Verkäufer',
+    'vk.preis': 'Preis',
+    'vk.zahlungsart': 'Zahlungsart',
+    'vk.uebergabedatum': 'Übergabedatum',
+    'vk.vertragsart': 'Vertragsart',
+    'vk.inland': 'EU-Inland',
+    'vk.eu_ausland': 'EU-Ausland',
+    'vk.drittland': 'Drittland',
+    'vk.kaufvertrag': 'Kaufvertrag erstellen',
+    'vk.rechnung': 'Rechnung erstellen',
+    'vk.lieferbescheinigung': 'Lieferbescheinigung',
+    'vk.ust_pruefung': 'USt-IdNr.-Prüfung',
+    'vk.gwG_warnung': 'GwG-Warnung: Barzahlung über 10.000 €',
+    'vk.gwG_meldung': 'Meldepflicht nach GwG (§ 11 GwG) - Barzahlung überschreitet 10.000 €',
+    'vk.identifikation': 'Identifikation des Vertragspartners',
+    'vk.ausweis_typ': 'Ausweistyp',
+    'vk.ausweis_nr': 'Ausweisnummer',
+    'vk.ausstellungsland': 'Ausstellungsland',
+    'vk.datum': 'Datum',
+    'vk.barzahlung': 'Barzahlung',
+    'vk.ueberweisung': 'Überweisung',
+    'vk.speichern': 'Verkauf speichern',
+    'vk.pdf_generieren': 'PDF generieren',
+    // KI Copilot
+    'ki.title': 'KI-Copilot',
+    'ki.placeholder': 'Fragen Sie den KI-Assistenten... (z.B. "Lege neues Fahrzeug an: MAN TGL 2018, 120000 km, 32000 €")',
+    'ki.senden': 'Senden',
+    'ki.spracheingabe': 'Spracheingabe',
+    'ki.historie': 'Verlauf',
+    'ki.beispiele': 'Beispiel-Befehle',
+    'ki.beispiel1': 'Lege neues Fahrzeug an: Mercedes Actros 2019, 150000 km, 45000 €',
+    'ki.beispiel2': 'Finde alle LKW unter 30.000 €',
+    'ki.beispiel3': 'Verkaufe Fahrzeug FIN W0LPEHAZ1S8012345 an Müller GmbH',
+    'ki.beispiel4': 'Erstelle Kaufvertrag für Fahrzeug FIN W0LPEHAZ1S8012345 an Müller GmbH',
+    // Common
+    'common.laden': 'Laden...',
+    'common.speichern': 'Speichern',
+    'common.abbrechen': 'Abbrechen',
+    'common.schliessen': 'Schließen',
+    'common.ja': 'Ja',
+    'common.nein': 'Nein',
+    'common.bestaetigen': 'Bestätigen',
+    'common.loeschen': 'Löschen',
+    'common.bearbeiten': 'Bearbeiten',
+    'common.suchen': 'Suchen',
+    'common.filtern': 'Filtern',
+    'common.sortieren': 'Sortieren',
+    'common.alle': 'Alle',
+    'common.eintraege': 'Einträge',
+    'common.von': 'von',
+    'common.seite': 'Seite',
+    'common.aktion_erfolgreich': 'Aktion erfolgreich',
+    'common.fehler_aufgetreten': 'Ein Fehler ist aufgetreten',
+    'common.erneut_versuchen': 'Erneut versuchen',
+    'common.nicht_verfuegbar': 'Nicht verfügbar',
+    'common.aktion_nicht_erlaubt': 'Sie haben keine Berechtigung für diese Aktion',
+    // Settings
+    'set.title': 'Einstellungen',
+    'set.stammdaten': 'Stammdaten',
+    'set.vertragsvorlagen': 'Vertragsvorlagen',
+    'set.benutzerverwaltung': 'Benutzerverwaltung',
+    'set.firmenprofil': 'Firmenprofil',
+    'set.sprache': 'Sprache',
+    'set.design': 'Design',
+    'set.dark_mode': 'Dunkler Modus',
+  },
+  en: {
+    'nav.dashboard': 'Dashboard',
+    'nav.fahrzeuge': 'Vehicle Inventory',
+    'nav.fahrzeuge.liste': 'Inventory List',
+    'nav.fahrzeuge.neu': 'New Vehicle',
+    'nav.kontakte': 'Contacts',
+    'nav.verkauf': 'Sales',
+    'nav.dateien': 'Files',
+    'nav.ki-copilot': 'AI Copilot',
+    'nav.einstellungen': 'Settings',
+    'nav.benutzerverwaltung': 'User Management',
+    'nav.datev': 'DATEV Export',
+    'nav.rechnungen': 'Invoices',
+    'nav.main': 'Main Menu',
+    'nav.verwaltung': 'Administration',
+    'nav.ki': 'Artificial Intelligence',
+    'topbar.search': 'Search vehicles, contacts, VIN...',
+    'topbar.profile': 'Profile',
+    'topbar.logout': 'Logout',
+    'topbar.role': 'Role',
+    'dash.title': 'Dashboard',
+    'dash.fahrzeuge_im_bestand': 'Vehicles in Stock',
+    'dash.verkaufe_diesen_monat': 'Sales This Month',
+    'dash.offene_tasks': 'Open Tasks',
+    'dash.mobilede_sync': 'mobile.de Sync Status',
+    'dash.schnellzugriffe': 'Quick Actions',
+    'dash.neues_fahrzeug': 'Add New Vehicle',
+    'dash.neuer_verkauf': 'New Sale',
+    'dash.ki_copilot': 'Open AI Copilot',
+    'dash.letzte_aktivitaeten': 'Recent Activities',
+    'dash.bevorstehende_tasks': 'Upcoming Tasks',
+    'dash.verkaeufe_entwicklung': 'Sales Development',
+    'dash.top_fahrzeuge': 'Most Requested Vehicles',
+    'dash.weiter': 'More',
+    'fb.title': 'Vehicle Inventory',
+    'fb.suche': 'Search vehicle (make, model, VIN)...',
+    'fb.filter': 'Filter',
+    'fb.alle': 'All',
+    'fb.lkw': 'Truck',
+    'fb.baumaschine': 'Construction Machine',
+    'fb.transporter': 'Van',
+    'fb.add_new': 'Add Vehicle',
+    'fb.marke': 'Make',
+    'fb.modell': 'Model',
+    'fb.fin': 'VIN',
+    'fb.baujahr': 'Year',
+    'fb.km_stand': 'Mileage',
+    'fb.betriebsstunden': 'Operating Hours',
+    'fb.preis': 'Price',
+    'fb.status': 'Status',
+    'fb.mobilede': 'mobile.de',
+    'fb.typ': 'Type',
+    'fb.standort': 'Location',
+    'fb.verfuegbarkeit': 'Availability',
+    'fb.verfuegbar': 'Available',
+    'fb.reserviert': 'Reserved',
+    'fb.verkauft': 'Sold',
+    'fb.gelistet': 'Listed',
+    'fb.nicht_gelistet': 'Not Listed',
+    'fb.fehler': 'Error',
+    'fb.aktion': 'Action',
+    'fb.bearbeiten': 'Edit',
+    'fb.details': 'Details',
+    'fb.anzeigen': 'View',
+    'fb.keine_fahrzeuge': 'No vehicles found',
+    'fb.keine_fahrzeuge_text': 'No vehicles in inventory yet. Add your first vehicle.',
+    'fb.fahrzeug_hinzufuegen': 'Add Vehicle',
+    'fb.export': 'Export (CSV)',
+    'fb.filter_zuruecksetzen': 'Reset Filters',
+    'fd.titel': 'Vehicle Details',
+    'fd.allgemein': 'General',
+    'fd.technische_daten': 'Technical Data',
+    'fd.baumaschinen_daten': 'Machine Data',
+    'fd.verkaufsinfo': 'Sales Info',
+    'fd.dokumente': 'Documents',
+    'fd.fotos': 'Photos',
+    'fd.mobilede_status': 'mobile.de Status',
+    'fd.bearbeiten': 'Edit',
+    'fd.verkaufen': 'Sell',
+    'fd.zurueck': 'Back to List',
+    'fd.hauptfoto': 'Main Photo',
+    'fd.keine_fotos': 'No photos available',
+    'fd.foto_hochladen': 'Upload Photo',
+    'fd.dokument_hochladen': 'Upload Document',
+    'fd.kategorie': 'Category',
+    'fd.dateiname': 'Filename',
+    'fd.groesse': 'Size',
+    'fd.upload_datum': 'Upload Date',
+    'fd.sync_mobilede': 'Sync to mobile.de',
+    'fd.delisting': 'Remove mobile.de Listing',
+    'fd.bildretusche': 'AI Photo Retouching',
+    'fd.preisvergleich': 'Price Comparison mobile.de',
+    'ff.titel_neu': 'Add New Vehicle',
+    'ff.titel_bearbeiten': 'Edit Vehicle',
+    'ff.speichern': 'Save',
+    'ff.abbrechen': 'Cancel',
+    'ff.pflichtfeld': 'Required field',
+    'ff.ocr_upload': 'OCR Upload (ZB I / ZB II)',
+    'ff.ocr_text': 'Photograph vehicle registration or title document and auto-fill data',
+    'ff.ocr_ausloesen': 'Start OCR',
+    'ff.standard_daten': 'Standard Data',
+    'ff.baumaschinen_daten': 'Machine-Specific Data',
+    'ff.fahrzeugtyp': 'Vehicle Type',
+    'ff.fin_hinweis': '17 characters, unique vehicle identification number',
+    'ff.fin_ungueltig': 'VIN must be exactly 17 characters',
+    'ff.fin_doppelt': 'VIN already exists',
+    'ff.leistung': 'Power (kW)',
+    'ff.leistung_ps': 'Power (HP)',
+    'ff.kraftstoffart': 'Fuel Type',
+    'ff.getriebe': 'Transmission',
+    'ff.farbe': 'Color',
+    'ff.zustand': 'Condition',
+    'ff.erstzulassung': 'First Registration',
+    'ff.neu': 'New',
+    'ff.gebraucht': 'Used',
+    'ff.lkw_typ': 'Truck Type',
+    'ff.art': 'Type (Excavator, Wheel Loader, etc.)',
+    'ff.aufbau': 'Body/Equipment',
+    'ff.betriebsstunden_wert': 'Operating Hours',
+    'ff.betriebsstunden_einheit': 'Unit',
+    'ff.stunden': 'Hours (h)',
+    'ff.minuten': 'Minutes (min)',
+    'ff.manuell': 'Manual',
+    'ff.automatik': 'Automatic',
+    'ff.diesel': 'Diesel',
+    'ff.benzin': 'Petrol',
+    'ff.elektro': 'Electric',
+    'ff.hybrid': 'Hybrid',
+    'kt.title': 'Contact & Customer Management',
+    'kt.suche': 'Search contacts (name, company, country)...',
+    'kt.add_new': 'New Contact',
+    'kt.firmenname': 'Company Name',
+    'kt.ansprechpartner': 'Contact Person',
+    'kt.land': 'Country',
+    'kt.rolle': 'Role',
+    'kt.ust_id': 'VAT ID',
+    'kt.ust_status': 'VAT Status',
+    'kt.geprueft': 'Verified',
+    'kt.ungeprueft': 'Unverified',
+    'kt.manuell_best': 'Manually Confirmed',
+    'kt.kaeufer': 'Buyer',
+    'kt.verkaeufer': 'Seller',
+    'kt.beides': 'Buyer & Seller',
+    'kt.detail': 'Detail',
+    'kt.keine_kontakte': 'No contacts found',
+    'kt.keine_kontakte_text': 'No contacts have been added yet.',
+    'kt.neuer_kontakt': 'Add New Contact',
+    'vk.title': 'Sales Module',
+    'vk.neuer_verkauf': 'New Sale',
+    'vk.fahrzeug': 'Vehicle',
+    'vk.kaeufer': 'Buyer',
+    'vk.verkaeufer': 'Seller',
+    'vk.preis': 'Price',
+    'vk.zahlungsart': 'Payment Method',
+    'vk.uebergabedatum': 'Handover Date',
+    'vk.vertragsart': 'Contract Type',
+    'vk.inland': 'EU Domestic',
+    'vk.eu_ausland': 'EU Foreign',
+    'vk.drittland': 'Third Country',
+    'vk.kaufvertrag': 'Create Purchase Contract',
+    'vk.rechnung': 'Create Invoice',
+    'vk.lieferbescheinigung': 'Delivery Certificate',
+    'vk.ust_pruefung': 'VAT ID Verification',
+    'vk.gwG_warnung': 'AML Warning: Cash payment over 10,000 €',
+    'vk.gwG_meldung': 'Reporting obligation under GwG (§ 11 GwG) - Cash payment exceeds 10,000 €',
+    'vk.identifikation': 'Partner Identification',
+    'vk.ausweis_typ': 'ID Type',
+    'vk.ausweis_nr': 'ID Number',
+    'vk.ausstellungsland': 'Issuing Country',
+    'vk.datum': 'Date',
+    'vk.barzahlung': 'Cash',
+    'vk.ueberweisung': 'Bank Transfer',
+    'vk.speichern': 'Save Sale',
+    'vk.pdf_generieren': 'Generate PDF',
+    'ki.title': 'AI Copilot',
+    'ki.placeholder': 'Ask the AI assistant... (e.g. "Add new vehicle: MAN TGL 2018, 120000 km, 32000 €")',
+    'ki.senden': 'Send',
+    'ki.spracheingabe': 'Voice Input',
+    'ki.historie': 'History',
+    'ki.beispiele': 'Example Commands',
+    'ki.beispiel1': 'Add new vehicle: Mercedes Actros 2019, 150000 km, 45000 €',
+    'ki.beispiel2': 'Find all trucks under 30,000 €',
+    'ki.beispiel3': 'Sell vehicle VIN W0LPEHAZ1S8012345 to Müller GmbH',
+    'ki.beispiel4': 'Create purchase contract for vehicle VIN W0LPEHAZ1S8012345 to Müller GmbH',
+    'common.laden': 'Loading...',
+    'common.speichern': 'Save',
+    'common.abbrechen': 'Cancel',
+    'common.schliessen': 'Close',
+    'common.ja': 'Yes',
+    'common.nein': 'No',
+    'common.bestaetigen': 'Confirm',
+    'common.loeschen': 'Delete',
+    'common.bearbeiten': 'Edit',
+    'common.suchen': 'Search',
+    'common.filtern': 'Filter',
+    'common.sortieren': 'Sort',
+    'common.alle': 'All',
+    'common.eintraege': 'entries',
+    'common.von': 'of',
+    'common.seite': 'Page',
+    'common.aktion_erfolgreich': 'Action successful',
+    'common.fehler_aufgetreten': 'An error occurred',
+    'common.erneut_versuchen': 'Try Again',
+    'common.nicht_verfuegbar': 'Not available',
+    'common.aktion_nicht_erlaubt': 'You do not have permission for this action',
+    'set.title': 'Settings',
+    'set.stammdaten': 'Master Data',
+    'set.vertragsvorlagen': 'Contract Templates',
+    'set.benutzerverwaltung': 'User Management',
+    'set.firmenprofil': 'Company Profile',
+    'set.sprache': 'Language',
+    'set.design': 'Design',
+    'set.dark_mode': 'Dark Mode',
+  }
+};
+
+// State Management
+let currentLang = localStorage.getItem('erp-lang') || 'de';
+let currentRole = localStorage.getItem('erp-role') || 'admin';
+let darkMode = localStorage.getItem('erp-dark') === 'true';
+
+function t(key) {
+  const lang = currentLang;
+  return (translations[lang] && translations[lang][key]) || translations.de[key] || key;
+}
+
+function setLang(lang) {
+  currentLang = lang;
+  localStorage.setItem('erp-lang', lang);
+  document.documentElement.lang = lang;
+  applyTranslations();
+  updateLangSwitcher();
+}
+
+function applyTranslations() {
+  document.querySelectorAll('[data-i18n]').forEach(el => {
+    const key = el.getAttribute('data-i18n');
+    el.textContent = t(key);
+  });
+  document.querySelectorAll('[data-i18n-placeholder]').forEach(el => {
+    const key = el.getAttribute('data-i18n-placeholder');
+    el.placeholder = t(key);
+  });
+  document.querySelectorAll('[data-i18n-title]').forEach(el => {
+    const key = el.getAttribute('data-i18n-title');
+    el.title = t(key);
+  });
+}
+
+function updateLangSwitcher() {
+  document.querySelectorAll('.lang-btn').forEach(btn => {
+    btn.classList.toggle('active', btn.dataset.lang === currentLang);
+  });
+}
+
+function setRole(role) {
+  currentRole = role;
+  localStorage.setItem('erp-role', role);
+  applyRolePermissions();
+  updateRoleSwitcher();
+}
+
+function applyRolePermissions() {
+  document.querySelectorAll('[data-role]').forEach(el => {
+    const roles = el.dataset.role.split(',');
+    el.style.display = roles.includes(currentRole) ? '' : 'none';
+  });
+}
+
+function updateRoleSwitcher() {
+  document.querySelectorAll('.role-btn').forEach(btn => {
+    btn.classList.toggle('active', btn.dataset.role === currentRole);
+  });
+}
+
+function toggleDarkMode() {
+  darkMode = !darkMode;
+  localStorage.setItem('erp-dark', darkMode);
+  document.documentElement.setAttribute('data-theme', darkMode ? 'dark' : 'light');
+  updateDarkModeToggle();
+}
+
+function updateDarkModeToggle() {
+  const toggle = document.getElementById('darkModeToggle');
+  if (toggle) toggle.classList.toggle('active', darkMode);
+}
+
+function toggleSidebar() {
+  const sidebar = document.querySelector('.sidebar');
+  const overlay = document.querySelector('.sidebar-overlay');
+  if (sidebar) sidebar.classList.toggle('open');
+  if (overlay) overlay.classList.toggle('show');
+}
+
+function closeSidebar() {
+  const sidebar = document.querySelector('.sidebar');
+  const overlay = document.querySelector('.sidebar-overlay');
+  if (sidebar) sidebar.classList.remove('open');
+  if (overlay) overlay.classList.remove('show');
+}
+
+// Format helpers
+function formatPrice(price, lang) {
+  const l = lang || currentLang;
+  return new Intl.NumberFormat(l === 'de' ? 'de-DE' : 'en-US', {
+    style: 'currency', currency: 'EUR', minimumFractionDigits: 0, maximumFractionDigits: 0
+  }).format(price);
+}
+
+function formatNumber(num, lang) {
+  const l = lang || currentLang;
+  return new Intl.NumberFormat(l === 'de' ? 'de-DE' : 'en-US').format(num);
+}
+
+function formatDate(dateStr, lang) {
+  const l = lang || currentLang;
+  const d = new Date(dateStr);
+  return new Intl.DateTimeFormat(l === 'de' ? 'de-DE' : 'en-US', {
+    day: '2-digit', month: '2-digit', year: 'numeric'
+  }).format(d);
+}
+
+// Init on page load
+document.addEventListener('DOMContentLoaded', () => {
+  document.documentElement.lang = currentLang;
+  if (darkMode) document.documentElement.setAttribute('data-theme', 'dark');
+  applyTranslations();
+  applyRolePermissions();
+  updateLangSwitcher();
+  updateRoleSwitcher();
+  updateDarkModeToggle();
+});