Dokumentation: PWA-API und Phase 4 Block 1 aktualisiert
- CLAUDE.md auf Stand 2026-04-17 gebracht
- Phase 3 (PWA MVP) und Phase 4 Block 1 als ✅ abgeschlossen dokumentiert
- Alle neuen REST-API-Endpoints aufgelistet (auth, orders, photo, pdf, pages)
- README.md: Neue PWA-Integration-Sektion mit API-Dokumentation
- Architektur erweitert um api/-Ordner mit JWT-Auth-Endpoints
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
74e4509eee
commit
e462134a17
2 changed files with 102 additions and 51 deletions
94
CLAUDE.md
94
CLAUDE.md
|
|
@ -1,8 +1,8 @@
|
|||
# Bericht-Modul — Projekt-Status & Architektur
|
||||
|
||||
## Stand 2026-04-08
|
||||
## Stand 2026-04-17
|
||||
|
||||
Dolibarr-Custom-Modul für Arbeitsberichte mit Browser-PDF-Editor.
|
||||
Dolibarr-Custom-Modul für Arbeitsberichte mit Browser-PDF-Editor + PWA-API-Layer.
|
||||
|
||||
## Architektur (final)
|
||||
|
||||
|
|
@ -86,60 +86,54 @@ Speichert: color, stroke, fontFamily, fontSize, bold, italic, zoom
|
|||
|
||||
---
|
||||
|
||||
## Phase 4 Block 1 ✅ (2026-04-09)
|
||||
|
||||
PWA-Usability-Features:
|
||||
- 4.g Seite löschen in PWA (ajax /api/pages.php DELETE)
|
||||
- 4.h Notiz pro Seite (POST /api/pages.php {note})
|
||||
- 4.j PDF-Vorschau-Modal nach Finalize (api/pdf.php liefert Blob mit JWT)
|
||||
- 4.b Touch-Unterschrift (openSignatureModal → api/pages.php?action=signature)
|
||||
- 4.e Web Share Target API (manifest + share.html + SW-Interception in IDB)
|
||||
|
||||
Neue API-Endpoints:
|
||||
- api/pages.php — DELETE/POST (note, rotation) + ?action=signature&bericht_id=
|
||||
- api/pdf.php — liefert Final-PDF oder on-the-fly Preview, JWT via Query-Param
|
||||
|
||||
PWA neue Modals (alle in app.js):
|
||||
- openPageActionsModal — tap auf Report-Page-Thumb, Notiz + Löschen
|
||||
- openPdfModal — iframe mit Blob-URL + Download-Link
|
||||
- openSignatureModal — Touch-Canvas 2:1, Clear, Save als PNG
|
||||
- openHelpModal — komplette Anleitung (bereits in v4 gebaut)
|
||||
|
||||
Service Worker v5 (Share Target), manifest.webmanifest mit share_target.
|
||||
|
||||
## Phase 2 — Mobile-Vorbereitung + API-Layer (geplant)
|
||||
- 2.1 Mobile-Upload-Token Tabelle + Cleanup-Cron
|
||||
- 2.2 QR-Upload Lite Modal im Editor
|
||||
- 2.3 API-Layer unter `bericht/api/` mit JWT-Auth
|
||||
- 2.4 REST-Endpoints: /auth/login, /orders, /orders/{id}, /orders/{id}/photos, /reports, /reports/{id}/pages
|
||||
|
||||
JWT-Secret aus `$dolibarr_main_instance_unique_id`, 7 Tage Lifetime, Multi-Device OK (stateless).
|
||||
|
||||
Auftragsfilter pro User: `fk_user_author`, `fk_user_valid`, `fk_user_modif` ODER `llx_element_contact` mit "intern verantwortlich".
|
||||
|
||||
---
|
||||
|
||||
## Phase 3 — PWA MVP (geplant)
|
||||
- Repo: `data-it/baustelle-pwa` (separates SvelteKit-Projekt)
|
||||
## Phase 3 — PWA MVP ✅ (2026-04-17)
|
||||
- Repo: `data-it/baustelle-pwa` (SvelteKit-Projekt)
|
||||
- Hosting: `awl.data-it-solution.de/baustelle/` (Apache-Alias)
|
||||
- Stack: SvelteKit + Workbox + idb-keyval
|
||||
- MVP: Login → Auftragsliste → Detail → Foto-Aufnahme → Offline-Queue → Sync
|
||||
- Features: Login → Auftragsliste → Order-Detail → Foto/Sprachnotiz/Materialliste → PDF-Viewing
|
||||
- **PDF-Viewer implementiert**: PDF.js Canvas-Rendering, Datei-Typ-Unterscheidung (Bilder/Audio/PDFs/Dokumente)
|
||||
- **Weitere Dokumente**: Order-Dateien aus `commande/<ref>/` als Inline-Viewer (PDF.js) oder Download
|
||||
|
||||
---
|
||||
## Phase 4 Block 1 ✅ (2026-04-09 bis 2026-04-17)
|
||||
|
||||
## Phase 4 — PWA Voll (geplant)
|
||||
- Sprachnotizen (MediaRecorder)
|
||||
- Touch-Skizzen-Editor
|
||||
- Schnell-Bericht in PWA
|
||||
- Touch-Unterschrift
|
||||
PWA-API-Layer + Usability-Features:
|
||||
- ✅ 2.3 API-Layer unter `bericht/api/` mit JWT-Auth (Login, Orders, Photos, Reports)
|
||||
- ✅ 2.4 REST-Endpoints: /auth.php, /orders, /orders/{id}, /orders/{id}/photos, /photo.php (Whitelist)
|
||||
- ✅ 4.j PDF-Vorschau-Modal + Inline-Viewing (PDF.js Canvas)
|
||||
- ✅ 4.g Seite löschen in PWA (DELETE /api/pages.php)
|
||||
- ✅ 4.h Notiz pro Seite (POST /api/pages.php {note})
|
||||
- ✅ 4.b Touch-Unterschrift (POST /api/pages.php?action=signature)
|
||||
- ✅ Datei-Typ-Unterscheidung: Bilder (Modal), Audio (Player), PDFs (Canvas), Dokumente (Download)
|
||||
|
||||
API-Endpoints (neue):
|
||||
- POST /api/auth.php — JWT-Login (username, password)
|
||||
- GET /api/orders.php — Aufträge des Users (filter: q, open)
|
||||
- GET /api/orders.php?id=<id> — Order-Detail
|
||||
- GET /api/orders.php?id=<id>&action=photos — Order-Dateien (Bilder/Audio/PDFs/Dokumente)
|
||||
- POST /api/orders.php?action=create — Neuer Order (socid, title, ref_client, date)
|
||||
- GET /api/photo.php?relpath=<path> — Datei-Serving (JWT via Header oder Query-Param, Whitelist: facture|commande|propal|bericht)
|
||||
- POST /api/pages.php?action=signature&bericht_id=<id> — Touch-Unterschrift
|
||||
- DELETE /api/pages.php?id=<id> — Seite löschen
|
||||
- POST /api/pages.php?id=<id> — Seite-Notiz / Rotation
|
||||
|
||||
PWA neue Komponenten (app.js):
|
||||
- openFileViewer() — Generischer Dateibetrachter (Bilder/PDFs/Audio/Download)
|
||||
- openPdfViewer() — PDF.js Canvas mit Zoom/Seitennavigation/Download
|
||||
- docIconFor(), formatFileSize(), formatShortDate() — Hilfsfunktionen
|
||||
- Unterschrift-Modal, Notiz-Modal, Seiten-Verwaltung
|
||||
|
||||
Service Worker v5: Offline-Queue, Sync, Share Target API.
|
||||
|
||||
## Phase 5 — PWA Erweiterungen (geplant)
|
||||
- Sprachnotizen-Transkription via Whisper (POST /api/transcribe.php)
|
||||
- PIN-Schutz / WebAuthn
|
||||
- Push-Notifications
|
||||
- Web Share Target API
|
||||
- Push-Notifications bei neuen Aufträgen
|
||||
- Offline-Queue Optimierung (Sync bei Netzwechsel)
|
||||
- QR-Code Scanner (Order-Lookup)
|
||||
- Batch-Unterschriften (mehrere Orders auf einmal)
|
||||
|
||||
---
|
||||
|
||||
## Phase 5 — Optional Später
|
||||
Stamps, Vorher/Nachher, Versionierung, Mess-Werkzeug, Bericht-Vorlagen, Batch-Modus, Whisper-Transkription, Offline-Map
|
||||
## Phase 6 — Optional Später
|
||||
Stamps, Vorher/Nachher, Versionierung, Mess-Werkzeug, Bericht-Vorlagen, Offline-Map, Geofencing
|
||||
|
||||
---
|
||||
|
||||
|
|
|
|||
59
README.md
59
README.md
|
|
@ -16,6 +16,8 @@ Bilder und PDFs lassen sich im Browser annotieren (Pfeile, Kreise, Rechtecke, Te
|
|||
- **Auftragsnummer** wird automatisch aus dem Extrafield `options_auftragsnummer` der Rechnung gezogen
|
||||
- **Mehrere Berichte pro Dokument** möglich
|
||||
- Berichte als **Entwurf** speichern (jederzeit wieder editierbar) oder **finalisieren** (PDF erzeugen)
|
||||
- **PWA-API** für Mobile-Nutzung: Aufträge, Fotos, Sprachnotizen, Materiallisten, Signaturen
|
||||
- **PDF-Viewer in PWA** mit PDF.js Canvas-Rendering (Zoom, Seitennummerierung, Download)
|
||||
|
||||
## Voraussetzungen
|
||||
|
||||
|
|
@ -59,6 +61,48 @@ Bilder und PDFs lassen sich im Browser annotieren (Pfeile, Kreise, Rechtecke, Te
|
|||
| `{bericht_titel}` | Titel des Berichts |
|
||||
| `{ersteller}` | Login-Name des erstellenden Users |
|
||||
|
||||
## PWA-Integration (Baustelle Mobile App)
|
||||
|
||||
Die **Baustelle-PWA** (`https://awl.data-it-solution.de/baustelle/`) nutzt die folgenden API-Endpoints des Bericht-Moduls:
|
||||
|
||||
### Authentifizierung
|
||||
```
|
||||
POST /custom/bericht/api/auth.php
|
||||
Body: { login: string, password: string }
|
||||
Response: { ok: true, token: JWT, user: {...} }
|
||||
```
|
||||
|
||||
JWT-Token hat 7 Tage Gültigkeit und enthält: `sub` (user id), `login`, `name`, `perms` (read/write/delete/admin).
|
||||
|
||||
### Order-APIs
|
||||
```
|
||||
GET /custom/bericht/api/orders.php
|
||||
GET /custom/bericht/api/orders.php?id=<id>
|
||||
GET /custom/bericht/api/orders.php?id=<id>&action=photos
|
||||
POST /custom/bericht/api/orders.php?action=create
|
||||
```
|
||||
|
||||
### Dateien
|
||||
```
|
||||
GET /custom/bericht/api/photo.php?relpath=<path>&jwt=<token>
|
||||
Liefert Dateien aus DOL_DATA_ROOT (Whitelist: facture/, commande/, propal/, bericht/)
|
||||
Optional: ?size=small|mini (Thumbnails), ?download=1 (Attachment-Header)
|
||||
```
|
||||
|
||||
### PDF-Ansicht
|
||||
```
|
||||
GET /custom/bericht/api/pdf.php?id=<bericht_id>&jwt=<token>
|
||||
Liefert finalisiertes Bericht-PDF als Blob
|
||||
```
|
||||
|
||||
### Seiten-Verwaltung (PWA)
|
||||
```
|
||||
DELETE /custom/bericht/api/pages.php?id=<page_id>
|
||||
POST /custom/bericht/api/pages.php?id=<page_id> Body: { note: string }
|
||||
POST /custom/bericht/api/pages.php?action=signature&bericht_id=<id>
|
||||
Body: FormData mit file=<PNG-Blob>, signer_name, gps_lat, gps_lon
|
||||
```
|
||||
|
||||
## Architektur
|
||||
|
||||
```
|
||||
|
|
@ -68,7 +112,7 @@ bericht/
|
|||
├── lib/bericht.lib.php Helper (Anhänge sammeln, Auftragsnr., Templates)
|
||||
├── bericht_card.php Editor-Seite (Tab-Inhalt)
|
||||
├── admin/setup.php Admin: ODT-Templates, Konstanten
|
||||
├── ajax/ Endpoints (Token-geschützt)
|
||||
├── ajax/ Legacy Endpoints (Token-geschützt)
|
||||
│ ├── _inc.php Gemeinsamer Header
|
||||
│ ├── add_attachment.php Anhang als Seite hinzufügen
|
||||
│ ├── upload_extra.php Direkter Upload
|
||||
|
|
@ -78,6 +122,19 @@ bericht/
|
|||
│ ├── delete_page.php
|
||||
│ ├── reorder_pages.php
|
||||
│ └── generate_pdf.php Finalisierung: TCPDF + FPDI + ODT-Deckblatt
|
||||
├── api/ REST-API (JWT-Auth)
|
||||
│ ├── _inc.php JWT-Authentifizierung + Dolibarr-Init
|
||||
│ ├── _jwt.php JWT encoding/decoding
|
||||
│ ├── auth.php Login-Endpoint
|
||||
│ ├── orders.php Order-Liste, Detail, Fotos, Create
|
||||
│ ├── photo.php Datei-Serving mit Whitelist
|
||||
│ ├── pdf.php Finalized Bericht-PDF
|
||||
│ ├── pages.php Seiten-Verwaltung (Note, Rotation, Signature)
|
||||
│ ├── reports.php Bericht-CRUD
|
||||
│ ├── templates.php ODT-Templates
|
||||
│ ├── materials.php Materiallisten
|
||||
│ ├── voice.php Sprachnotizen (Upload + Transkription)
|
||||
│ └── transcribe.php Whisper-Transkription
|
||||
├── js/
|
||||
│ ├── editor.js PDF.js + Fabric.js Integration
|
||||
│ └── lib/ PDF.js, Fabric.js, SortableJS (lokal)
|
||||
|
|
|
|||
Loading…
Reference in a new issue