Lagerverwaltung & Zeiterfassung für Elektroteile

Warum: Ein solides Datenmodell verhindert spätere Inkonsistenzen und bildet alle Anforderungen (Teile, Entnahmen, Zeiten, Rollen) sauber ab.

Wie:

• Erstelle Tabellen für mitarbeiter (ID, Name, Rolle), bauteile (ID, Name, QR-Code, Bestand), entnahmen (ID, Mitarbeiter-ID, Bauteil-ID, Menge, Zeitstempel) und arbeitszeiten (ID, Mitarbeiter-ID, Start, Ende).
• Nutze PostgreSQL als relationale Cloud-Datenbank.

Erledigt, wenn: Das Schema als SQL-Skript oder ER-Diagramm vollständig dokumentiert ist.

Warum: Supabase bietet eine sofort einsatzbereite PostgreSQL-Datenbank, Authentifizierung und API-Endpunkte ohne komplexen Server-Setup.

Wie:

• Erstelle ein kostenloses Konto auf Supabase und lege ein neues Projekt an.
• Führe das zuvor definierte SQL-Schema im SQL-Editor von Supabase aus, um die Tabellen zu erstellen.
• Notiere dir die API-URL und den Anon-Key für die spätere Frontend-Anbindung.

Erledigt, wenn: Die Tabellen in der Supabase-Konsole sichtbar sind und die API-Verbindungsschlüssel bereitliegen.

Warum: React ermöglicht eine reaktive Benutzeroberfläche für mobile Geräte (Scannen) und Desktops (Admin-Panel).

Wie:

• Erstelle ein neues Projekt mit Vite: npm create vite@latest lagerverwaltung -- --template react-ts.
• Installiere Tailwind CSS für ein schnelles, responsives Design.
• Installiere den Supabase-JS-Client: npm install @supabase/supabase-js.

Erledigt, wenn: Die React-App lokal startet und eine Testverbindung zu Supabase erfolgreich aufgebaut wird.

Warum: Nur registrierte Mitarbeiter dürfen Zeiten erfassen und Admins müssen exklusiven Zugriff auf Abrechnungen haben.

Wie:

• Nutze Supabase Auth für E-Mail/Passwort-Login.
• Erstelle eine Spalte rolle (Admin, Mitarbeiter) in einer profile-Tabelle, die über einen Trigger bei der Registrierung befüllt wird.
• Baue eine Login-Maske im Frontend und leite Nutzer basierend auf ihrer Rolle weiter.

Erledigt, wenn: Ein Login möglich ist und die App erkennt, ob der angemeldete Nutzer Admin oder Mitarbeiter ist.

Warum: Mitarbeiter und Admins müssen den aktuellen Lagerbestand einsehen und neue Teile anlegen können.

Wie:

• Baue eine tabellarische Ansicht aller Bauteile mit Such- und Filterfunktion.
• Erstelle ein Formular für Admins, um neue Elektroteile (Name, Beschreibung, Mindestbestand, Lagerort) hinzuzufügen.
• Binde die Tabelle an die Supabase-Datenbank an, um Echtzeit-Updates anzuzeigen.

Erledigt, wenn: Bauteile im Frontend aufgelistet, gesucht und von Admins neu angelegt werden können.

Warum: Jedes Bauteil benötigt einen eindeutigen QR-Code, der auf der Verpackung oder dem Fach angebracht wird.

Wie:

• Installiere die Bibliothek qrcode.react im Frontend.
• Generiere für jedes Bauteil einen QR-Code, der die eindeutige ID (UUID) des Bauteils als Text enthält.
• Füge eine Druckfunktion hinzu, mit der Admins QR-Codes im passenden Etikettenformat ausdrucken können.

Erledigt, wenn: Zu jedem Bauteil ein QR-Code angezeigt und als Bild/PDF gedruckt werden kann.

Warum: Das Scannen per Smartphone-Kamera ermöglicht eine schnelle Erfassung direkt am Lagerregal ohne manuelle Suche.

Wie:

• Installiere die Open-Source-Bibliothek html5-qrcode im React-Projekt.
• Erstelle eine Scanner-Komponente, die Zugriff auf die Gerätekamera anfordert.
• Verarbeite das Scan-Ergebnis (die Bauteil-ID) und leite den Nutzer direkt zur Entnahme-Seite dieses Bauteils weiter.

Erledigt, wenn: Die Kamera im Browser öffnet, einen QR-Code scannt und die enthaltene ID korrekt ausliest.

Warum: Jede Bestandsänderung muss lückenlos dokumentiert werden, um Schwund zu vermeiden und Projekte korrekt abzurechnen.

Wie:

• Erstelle nach dem Scan eines Bauteils eine Ansicht mit Details zum Teil und einem Eingabefeld für die Menge.
• Implementiere zwei Buttons: "Entnehmen" und "Zurücklegen".
• Schreibe eine Transaktion in die Tabelle entnahmen und aktualisiere gleichzeitig den Bestand in bauteile (nutze eine PostgreSQL-Transaktion/RPC in Supabase, um Race Conditions zu vermeiden).

Erledigt, wenn: Eine Entnahme den Lagerbestand reduziert und einen Eintrag in der Historie erzeugt.

Warum: Die Arbeitszeiten der Mitarbeiter sind die Grundlage für die spätere automatisierte Monatsabrechnung.

Wie:

• Erstelle ein einfaches Dashboard für Mitarbeiter mit einem großen "Kommen"- und "Gehen"-Button.
• Beim Klick auf "Kommen" wird ein neuer Eintrag in arbeitszeiten mit dem aktuellen Zeitstempel (Serverzeit!) erstellt.
• Beim Klick auf "Gehen" wird der bestehende Eintrag mit dem End-Zeitstempel aktualisiert.

Erledigt, wenn: Mitarbeiter ihre Arbeitszeit starten und stoppen können und die Dauer korrekt in der Datenbank gespeichert wird.

Warum: Admins müssen neue Mitarbeiter anlegen, Arbeitszeiten korrigieren und Berechtigungen verwalten können.

Wie:

• Baue eine Admin-Ansicht zur Auflistung aller Mitarbeiter.
• Erstelle Formulare zum Bearbeiten von Arbeitszeit-Einträgen (falls jemand das Ausstempeln vergessen hat).
• Füge eine Übersicht der letzten Entnahmen hinzu, um zu sehen, wer welche Teile verwendet hat.

Erledigt, wenn: Admins Mitarbeiterdaten einsehen, bearbeiten und die Protokolle filtern können.

Warum: Die Berechnung von Arbeitsstunden und verbrauchten Teilen muss serverseitig und manipulationssicher erfolgen.

Wie:

• Schreibe eine PostgreSQL-Funktion (oder eine Serverless Function, z.B. Supabase Edge Functions), die für einen bestimmten Monat und Mitarbeiter alle Arbeitsstunden summiert.
• Berechne die Gesamtstunden abzüglich gesetzlicher Pausen und multipliziere sie mit dem hinterlegten Stundensatz des Mitarbeiters.
• Liste optional die entnommenen Materialien auf, die für Kundenprojekte verwendet wurden.

Erledigt, wenn: Die Funktion für einen Testmonat die exakte Stundenanzahl und den Bruttolohn eines Mitarbeiters berechnet.

Warum: Am Monatsende muss ein offizielles Dokument für die Buchhaltung und den Mitarbeiter generiert werden.

Wie:

• Nutze eine Bibliothek wie jsPDF im Frontend oder pdfkit in einer Edge Function.
• Gestalte ein sauberes Rechnungs-/Abrechnungslayout mit Firmenlogo, Mitarbeiterdaten, tabellarischer Auflistung der Arbeitstage, Gesamtstunden und dem Auszahlungsbetrag.
• Biete dem Admin einen Button "Monatsabrechnung generieren", der das PDF direkt herunterlädt.

Erledigt, wenn: Ein Klick auf den Button ein fehlerfreies, druckfertiges PDF mit den echten Daten des Vormonats erzeugt.

Warum: Die Automatisierung spart Zeit, indem sie die Abrechnung am 1. des Folgemonats direkt an Admin und Mitarbeiter sendet.

Wie:

• Nutze einen kostenlosen E-Mail-Dienst (z.B. Resend oder SendGrid) über eine Supabase Edge Function.
• Richte einen Cron-Job ein, der am 1. jedes Monats läuft.
• Der Job generiert die Abrechnungen und versendet sie als PDF-Anhang an die hinterlegten E-Mail-Adressen.

Erledigt, wenn: Eine Test-E-Mail mit der angehängten PDF-Abrechnung erfolgreich im Postfach ankommt.

Warum: Ohne RLS könnte jeder authentifizierte Nutzer über die API Daten anderer Mitarbeiter manipulieren oder Bestände fälschen.

Wie:

• Aktiviere RLS für alle Tabellen in Supabase.
• Erstelle eine Richtlinie (Policy) für arbeitszeiten: Mitarbeiter dürfen nur eigene Zeilen lesen/schreiben (auth.uid() = user_id). Admins dürfen alles.
• Erstelle Richtlinien für bauteile: Alle angemeldeten Nutzer dürfen lesen, aber nur Admins dürfen schreiben (INSERT/UPDATE/DELETE).

Erledigt, wenn: Ein Test mit einem normalen Mitarbeiter-Account fehlschlägt, wenn dieser versucht, Admin-Daten abzufragen oder Bestände direkt zu editieren.

Warum: Vor dem Produktiveinsatz muss sichergestellt werden, dass der QR-Scanner auf echten Smartphones funktioniert und die Abrechnung fehlerfrei ist.

Wie:

• Teste die Web-App auf verschiedenen Smartphones (iOS und Android) im mobilen Browser bezüglich Kamera-Zugriff und QR-Scan-Geschwindigkeit.
• Simuliere einen kompletten Monatszyklus: Einbuchen, Ausbuchen, Zeiterfassung über mehrere Tage, Generierung der Abrechnung.
• Überprüfe Rundungsfehler bei der Stundenberechnung.

Erledigt, wenn: Alle Kernfunktionen auf mindestens zwei mobilen Geräten und einem Desktop-PC fehlerfrei durchlaufen.

Warum: Ein Datenverlust bei Arbeitszeiten oder Lagerbeständen kann rechtliche und finanzielle Konsequenzen haben.

Wie:

• Aktiviere die täglichen automatischen Backups in den Supabase-Projekteinstellungen (im kostenpflichtigen Tarif enthalten) oder richte ein wöchentliches Backup-Skript über ein GitHub Action Workflow ein, das pg_dump nutzt.
• Sichere die Backups an einem separaten, verschlüsselten Cloud-Speicherort.

Erledigt, wenn: Ein automatisiertes Backup-Skript erfolgreich ein SQL-Dump der Datenbank in einem externen Speicher ablegt.