gora.
Jusmila — moto-dalių katalogas Lietuvoje

Admin skydelis

Ką sandėlio operatorius mato ir daro: katalogas, užsakymai, importai, pristatymo žemėlapiai, session replay.

~3 min skaityti · 555 žodžių

TL;DR

Jusmila administravimo skydelis — atskira SPA programa, sukurta su Vite + React 18, prieinama tik sandėlio darbuotojams ir vadybininkui. Valdo 10 000+ detalių katalogą, užsakymų eilę, importus iš tiekėjų, pristatymo zonas žemėlapyje ir integruotą session replay UX problemų analizei.

Administravimo skydelio apžvalga

Administravimo skydelis — tai antroji sistemos pusė. Vitrinoje pirkėjas mato katalogą ir pateikia užsakymą. Administravimo skydelyje sandėlio darbuotojas apdoroja užsakymus ir palaiko katalogą aktualų. Tarp jų — bendras API, sukurtas su NestJS.

Katalogas

Pagrindinis administravimo skydelio ekranas — prekių sąrašas su filtrais: prieinamumo būsena, kategorija, tiekėjas. Galima sukurti naują kortelę, redaguoti esamą (pavadinimą, aprašymą, kainas, nuotraukas, suderinamumą), masiškai atnaujinti likučius.

Kiekviena detalė turi fitment lentelę (suderinamumą): kuriems motociklų modeliams tinka, nuo kurių metų. Ši lentelė reikalinga „pagal modelį" filtrui vitrinoje. Be jos klientas nesupras, ar detalė tiks jo motociklui.

Kategorijos — medžio struktūros: motociklai → susidėvinčios dalys → stabdžių sistemos → kaladėlės. Pridedant naują prekę, pasirenkama galutinė kategorija (medžio lapas), ir vitrinoje ji automatiškai atsiranda reikiamame sąraše.

Užsakymai

Užsakymų eilė — pagrindinis operacinis ekranas. Darbuotojas mato visus naujus užsakymus realiu laiku (Socket.IO). Kiekvienas užsakymas turi pozicijas su artikulais ir kiekiais, pristatymo adresą, apmokėjimo būdą, būseną.

Užsakymo gyvavimo ciklas: newconfirmedpickingpackedshippeddelivered. Kiekviename perėjime klientas gauna pranešimą.

Jei sandėlyje neatsirado visų pozicijų (likučių neatitikimas), darbuotojas perkelia užsakymą į partial: nurodo, ko trūksta, klientui ateina laiškas su variantais — laukti, pakeisti, atšaukti.

Importai

Atskiras skyrius importo skriptams. Šiuo metu veikia mototex ir anjese pipeline'ai — tai tiekėjai, turintys savo katalogą viešame internete. Importas paleidžiamas iš administravimo skydelio mygtuku; rezultatas — žurnalas realiu laiku per Socket.IO: kurie SKU atnaujinti, kurie pridėti, kurie praleisti dėl konfliktų.

Po gaubtu — chrome-devtools MCP: atidaroma reali naršyklė, parsinami prekių kortelės, artikulai ir kainos, po to jie patenka į atnaujinimo eilę per API.

Žemėlapiai ir zonos

Integruotas Leaflet — operatorius gali matyti pristatymo zonas kaip poligonus Lietuvos žemėlapyje. Kiekvienoje zonoje — taisyklės: minimali užsakymo suma, pristatymo laikas, antkainis už atstumą. Vadybininkas gali perbraižyti zonos ribas neliesdamas kodo.

Pateikiant užsakymą klientas įveda adresą, jis geokoduojamas į koordinates, ir sistema patikrina, kurioje zonoje jis yra. Jei nė vienoje — „pristatymas nepasiekia jūsų rajono".

Session replay

Neįprasčiausia administravimo skydelyje — integruotas rrweb-player. Kai klientas praneša apie klaidą („negaliu pridėti į krepšelį", „mokėjimas neįvyko"), operatorius atidaro to kliento sesiją, peržiūri įrašą ir mato tikslią paspaudimų seką bei DOM būsenas.

rrweb įrašo įvykius kliento pusėje (slepiant slaptažodžius ir mokėjimo duomenis), siunčia į backend'ą, o tas juos saugo Postgres. Administravimo skydelyje grotuvas rodo sesiją kaip mini vaizdo įrašą: galima persukti, pristabdyti, filtruoti pagal įvykius.

Tai kritiška UX tobulinimui: vietoj „man neveikia" operatorius mato konkretų elgesio modelį, o inžinierius gauna atkartojamą pranešimą.

Analitika

Recharts piešia bazinius grafikus: pardavimai pagal dienas, populiariausios kategorijos, konversija pagal pristatymo zonas. Tai ne BI lygmuo, o operatyvinė santrauka — vadybininkas atidaro administravimo skydelį, mato savaitės grafiką, priima sprendimą „reikia pridėti vairuotojų į šią zoną" arba „išplėsti asortimentą šioje kategorijoje".

Eksportas ir ataskaitos

jsPDF generuoja važtaraščius, aktus ir ataskaitas tiesiai naršyklėje. Sandėlio darbuotojas spausdina važtaraštį surenkant užsakymą; vadybininkas eksportuoja mėnesinę pardavimų ataskaitą į PDF.

Prieiga ir rolės

Autentifikacija — JWT per NestJS Passport. Dvi pagrindinės rolės: manager (viskas, įskaitant kainodarą) ir warehouse (tik užsakymai, likučiai ir surinkimas). Jei rytoj atsiras dispečeris ar rinkodaros specialistas — naujos rolės pridėjimas yra permissions lentelės redagavimas, o ne refaktoringas.