5.2 KiB
[COMPLETED] MASTER PLAN: Box/Container Scanning & Printing Architecture
Important
STATUS: FULLY IMPLEMENTED (v1.5.0) Date: 2026-04-12 This plan is no longer active. All phases (OCR, Smart Routing, Label Printing) have been merged into the main codebase.
Etapele Implementării
ETAPA 1: Local OCR Box Scanning (Funcționalitate Principală)
Această etapă extinde logica existență a scanner-ului pentru a citi local (via Tesseract.js pe frontend) textul generic scris pe cutii și a direcționa utilizatorul automat spre inventarul acelei cutii.
Pasul 1.1: Backend și Modele de Date
- Database Migration: Rularea efectivă (prin
sqlite3 / bash) pe baza de date de producție a unui query:ALTER TABLE items ADD COLUMN box_label TEXT; - File
backend/models.py: Adăugarea coloaneibox_label = Column(String, index=True, nullable=True)în modelulItem. - File
backend/schemas.py: Expoziția acesteia prin Pydantic:box_label: Optional[str] = NoneînItemBase. - File
backend/routers/items.py: Maparea noului câmp la crearea și editarea de itemi, dar CRITIC: actualizarea snapshot-urilor JSON de audit (AuditLogs), adăugând"box_label": db_item.box_labella istoricul imuabil.
Pasul 1.2: Frontend Offline Storage & Formulare UI
- File
frontend/lib/db.ts: Adăugareabox_label?: string;în interfața TypeScriptItem. Upgrade la Dexie database version pentru indexareaitems: '++id, barcode, name, category, box_label, ...'. - File
frontend/components/AIOnboarding.tsx&page.tsx(Meniul de Editare):- Adăugarea câmpului UI "Box/Container Label".
- Câmpul devine un
datalistdropdown conectat la un array derivatexistingBoxes:Array.from(new Set(inventory.map(i => i.box_label).filter(Boolean))). - Asta permite la Onboarding selecția rapidă dintr-o listă a unei cutii deja utilizate.
- File
frontend/app/page.tsx(Bara de Căutare Generală): Extinderea filtrelor de vizibilitateinventory.filter()pentru a include textul introdus în caseta de căutare principală dacă matcheaza cu unbox_label.
Pasul 1.3: Router-ul de Inteligență al Scannerului (onOCRMatch)
- Fișier Principal
frontend/app/page.tsx: Acolo unde rulează buclaScanner.tsxOCR o dată la 4 secunde, se injectează logica nouă de intercepție înonOCRMatch(). - Logica Funcțională:
- Fuzzy String Match: Compară masiv șirul dezordonat venit de la cameră cu toate
item.box_labelexistente. - Filtrăm array-ul temporar
possibleBoxMatches. - Dacă
possibleBoxMatches.length === 1: Sistemul selectează instant acel produs ->setShowScanner(false); setSelectedItem(match);. Trecere directă la editare stoc (din cauză că este o cutie dedicată). - Dacă
possibleBoxMatches.length > 1: S-a recunoscut "cutia cu SFP-uri" care conține 5 modele diferite. Sistemul va popa un Modal Interstitial NOU: "Alegeți Item-ul din Cutie". Acest modal randează un array vizual ca meniu. Odată făcut click pe un item, deschide panoul de CheckIn/Out pentru el. - Dacă cutia nu matchează cu niciun
box_label, dăfallbackla logica clasică deonOCRMatch(să recunoască S/N-ul individual sau Part Number-ul exact).
- Fuzzy String Match: Compară masiv șirul dezordonat venit de la cameră cu toate
ETAPA 2: Sistem de Generare și Printare Etichete pe Cutii (Funcționalitate Secundară)
Misiunea de a crea un cod unic perfect (lipsit de ratele de eroare ale OCR-ului generic) pentru cutii, pe care angajații să îl poată printa direct pe o imprimantă Dymo/Brother sau descărca ca poză.
Pasul 2.1: Identificatori Generatori Vizuali
- Logică PWA: Nu vom rula backend separat pentru imagini; le vom genera via HTML Canvas pe Frontend pentru lățime de bandă 0.
- Dependință Nouă UI: Instalarea
react-barcode/qrcode.reactpe frontend pentru desenarea instantanee vizuală bazată pe șirul textual dinbox_label(ex: textul "SFPx5-BOX" -> devine un QRCode valid).
Pasul 2.2: Managementul Meniului de Printare
- Afișare Modul
[📦 Tablou Cutii], vizibil din Setări/Admin sau în meniul Item-urilor, care grupează itemii perbox_label. - Fiecare categorie de "cutie" are buton dedicat: [Printează Etichetă (Generează Cod)].
- Metoda Multi-Platformă:
- Când este apăsat generăm un obiect izolat DOM (div hidden).
- Folosim clase CSS media de izolare
@media print { @page { size: 62mm 29mm; } body * { display: none; } #print-area { display: block; } }. - Asta triggerează popup-ul de print nativ MacOS/Windows perfect adaptat unei imprimante etichetatoare de birou Dymo/Brother.
- Fallback Mobil (iOS/Android): Lângă opțiunea de "Print direct", adăugăm buton de [Salvează pe Telefon (Imagine.png)]. Utilizatorul transferă imaginea perfect rasterizată (canvas via
toDataURL()) în rola foto pentru a deschide aplicația portabilă proprietară de print Bluetooth (ex: Niimbot app).
Validarea Aprobării
Important
REGULA DE AUR PENTRU AI: Nu ai voie să scrii cod din acest plan dacă utilizatorul nu a aprobat explicit începerea implementării Etapelor! Citește acest document ori de câte ori continui logica sistemului PWA aInventory.