Admin skydelis

TL;DR

Administravimo skydelis — tai operacinis platformos smegenys. Apie 50 puslapių, keturi prieigos lygiai (Platform Admin, Store Admin, Manager, Dispatcher, Driver), trys skirtingi layout kontekstai: savininko desktop, vairuotojo mobilus ekranas ir dispečerio mobilus ekranas. Vienoje sistemoje vienu metu gyvena užsakymai, katalogas, inventorius, akcijų mechanikos (nuo bulk kodų generavimo iki QR kampanijų ir Mix & Match), ataskaitos su dienos finansiniu sutikrinimu, klientų piniginės, atsiliepimų moderavimas ir floto valdymas. Atskiras sluoksnis — analitika: registracijos, prisijungimo ir checkout konversijos piltuvėliai, incidentų monitorius, veiksmų žurnalas su vartotojų sesijų įrašymu ir audit trail katalogo redagavimams. Dizainas sukurtas aplink tamsiai žalią #0e3814 kaip pagrindinę spalvą ir tankias lentelinio tipo sąsajas su reusable komponentais: StatCard, DataTable, statuso badge'ai, modaliniai langai. Šio skyriaus tikslas — parodyti, ką savininkas ir jo komanda gali padaryti rankomis, neatidarydami duomenų bazės ir neskambindami programuotojui.

Kontekstas ir rolės

Platforma aptarnauja vietinį prekių pristatymą iki galutinio vartotojo durų. Tai nėra įprastas e-commerce: kiekvienas užsakymas gali apimti atsiskaitymą grynaisiais, atskirą scenarijų, kai vairuotojas išduoda grąžą, susiejimą su pamaina, pristatymo zonų patikrinimą, ZIP kodų apribojimus piko valandomis. Todėl už vieno žodžio „administravimo skydelis" slepiasi keletas skirtingų darbo vietų.

Prieiga paskirstyta per RoleGuard:

• Platform Admin — vienintelė rolė, turinti prieigą prie Audit Trail. Mato absoliučiai viską.
• Store Admin — valdo parduotuvę: katalogas, inventorius, akcijos, ataskaitos, piniginės, nustatymai.
• Manager — katalogas, inventorius, vairuotojų ir automobilių flotas, atsiliepimų moderavimas.
• Dispatcher — mobilus layout su dispečerine konsole, žemėlapiu, sąskaitomis.
• Driver — mobilus layout su vairuotojo dashboard, mano užsakymais, uždarbiu.

Tas pats URL gali atrodyti visiškai kitaip priklausomai nuo rolės. Maršrutai, kurie nėra prieinami, neatvaizduojami navigacijoje, o bandymas atidaryti tiesiogiai nukreipia į leidžiamą pradinį puslapį.

Savininko Dashboard

Dashboard (/)

Tai komandos centras savininkui. Pirmame ekrane — du KPI lygiai: lifetime (Collection, Sales, Orders, Users — už visą laiką) ir daily (tas pats už šiandien). Lifetime suteikia verslo masto pojūtį, daily — pulsas šiuo metu.

Centrinis elementas — Revenue Chart, paremtas Recharts BarChart, su date range picker, perjungikliu tarp Revenue ir Orders bei refresh mygtuku. Po juo summary skydelis lygina Lifetime ir Today su TrendingUp/Down ikonomis ir pokyčio procentu, kad savininkas iškart matytų, ar diena buvo virš ar po vidurkio.

Atskirai — lentelė „Users Sale": klientų sąrašas su užsakymų skaičiumi, apyvarta, kiekvieno pelno/nuostolio įvertinimu ir Customer Since stulpeliu. Tai jau ne tik KPI, o greitas būdas suprasti, kurie klientai yra branduolys, o kurie — vienkartiniai.

Operations: užsakymai, klientai, flotas

Orders (/orders)

Puslapis su visais užsakymais. Viršuje — OrderFilters su paieška, datų diapazono pasirinkimu, filtru pagal statusą ir vairuotoją, plius download mygtukas eksportui. Toliau — Total Orders ir Average Delivery Time skaitikliai bei paginuota OrdersTable. Kiekviena eilutė yra klikuojama ir atidaro OrderDetailModal.

Modaliame lange operatorius atlieka tris veiksmus: keičia užsakymo statusą per leidžiamus perėjimus su privaloma pastaba, priskiria vairuotoją iš dropdown su prieinamais vykdytojais ir atnaujina duomenis. Tai pagrindinis ekranas tam, kuris sėdi prie telefono su klientu.

Customers (/customers) ir Customer Detail (/customers/:id)

Klientų sąrašas su paieška ir perėjimu į asmeninę kortelę. Kortelėje surenkami kontaktai, užsakymų istorija, susiejimas su planu, piniginės likutis — viskas, ko reikia operations vadybininkui pokalbiui su konkrečiu žmogumi.

Drivers (/drivers) ir Vehicles (/vehicles)

Floto valdymas, prieinamas nuo Manager rolės ir aukščiau. Drivers — kurjerių sąrašas su jų statusais ir metrikomis. Vehicles — automobilių žinynas: markė, modelis, numeris, susiejimas su vairuotojais, dokumentai.

Reviews (/reviews)

Prekių ir užsakymų atsiliepimų moderavimas. Manager ir aukščiau gali patvirtinti, paslėpti ar ištrinti atsiliepimą prieš jam patekant į viešą katalogą.

Katalogas

Catalog → Products (/catalog/products)

Pagrindinis prekių valdytojo ekranas. ProductFilters suteikia paiešką, filtrą pagal kategoriją ir brendą. ProductsTable rodo prekes su edit, delete ir toggle visibility veiksmais — pastarasis ypač svarbus SKU, kuriuos reikia greitai pašalinti netrinant. ProductFormModal — kūrimo ir redagavimo forma su nuotraukų įkėlimu, susiejimu su kategorija, brendu, kaina, savikaina ir inventoriumi.

Catalog → Categories (/catalog/categories)

Kategorijų hierarchija. CRUD: kūrimas, redagavimas, ištrynimas, pertvarkymas — verslui tai katalogo rubrikatorius, SEO — URL struktūra.

Catalog → Brands (/catalog/brands)

Brendų registras su CRUD. Naudojamas tiek filtracijoje, tiek prekės kortelėse, tiek banerių logotipuose. Atskira esybė, nes vienas brendas gali apimti dešimtis prekių.

Inventory

Inventory (/inventory)

Savarankiškas modulis su trimis tabais ir komponentų rinkiniu: InventoryStats, InventoryFilters, InventoryTable, StockAdjustmentModal, LowStockAlerts, InventoryLogs.

Pirmas tabas — Inventory List. Filtravimas, likučių koregavimas per StockAdjustmentModal (nurodant priežastį) ir print mygtukas, kuris atidaro inventory/print naujame lange fiziniam sutikrinimui sandėlyje.

Antras tabas — Stock Alerts. Čia surinktos low-stock ir out-of-stock pozicijos su badge skaitikliu tiesiai ant tabo ikonos, kad operatorius matytų problemų skaičių neatidarydamas skyriaus.

Trečias tabas — Activity Logs. Pilna paginuota visų koregavimų istorija: kas, ką, kada, su kokia priežastimi. Tai vienas iš vidaus kontrolės ir neatitikimų tyrimo įrankių.

Promotions

Platformoje egzistuoja visas atskiras domenas — akcijų mechanikos. Jų penkios:

Promotions (/promotions)

Baziniai akcijų kodai. Paieška pagal kodą, filtras pagal statusą, pridėjimas ir redagavimas per PromoFormModal. CRUD operacijos: pridėti, atnaujinti, ištrinti, perjungti statusą. Tai visų nuolaidų šaknis.

Promo Code Batches (/promotions/promocodes)

Bulk unikalių kodų generavimas akcijoms ir partnerystėms. Viduje — du view.

Batches View — grupių lentelė: pavadinimas, nuolaidos tipas (% arba $), naudojimo progresas, galiojimo laikotarpis, sukūrimo data.

Generate Modal — galingas įrankis: nurodai kiekį (1–1000), prefiksą, kodo ilgį (4–12 simbolių), nuolaidos tipą ir vertę, minimalų krepšelį, maksimalų nuolaidos dydį, galiojimo laikotarpį. Atskiri checkboxai — „First Order Only" (kodas veikia tik pirmam kliento užsakymui) ir „Cashback to Wallet" su nurodytu procentu, kad nuolaida grįžtų į piniginę, o ne būtų nurašyta nuo sąskaitos užsakymo metu. Dešinėje modalinio lango pusėje — code preview, kad matytum, kaip atrodys konkretus kodas.

Codes View — batch viduje: paieška, filtras pagal statusą (Unused / Used), vieno kodo kopijavimas, Copy All ir eksportas į CSV. Marketingo specialistas sugeneravo tūkstantį kodų kampanijai, eksportavo CSV, perdavė partneriui — viskas.

Campaigns (/promotions/campaigns)

QR kampanijos. Viršuje keturi StatCard: Active Campaigns, Total Scans, Total Orders, Avg Conversion %. Po jais lentelė: name, code, QR mygtukas, susietas promo code, skenavimų skaičius, užsakymų skaičius, konversija procentais, pajamos ir statusas (Active / Paused / Ended).

Create/Edit Modal leidžia įvesti kodą rankiniu būdu arba sugeneruoti, nurodyti tikslinį URL, pasirinkti susietą promo kodą iš dropdown, įjungti auto-apply (akcija pritaikoma automatiškai perėjus per QR), nustatyti galiojimo laikotarpį.

QR Modal renderina QR kodą per QRCodeCanvas, jį galima atsisiųsti kaip PNG. Sekimo URL — {API}/api/v1/c/{campaignCode} — fiksuoja kiekvieną skenavimą ir susiejimą su kitu užsakymu, kad konversija būtų skaičiuojama sąžiningai.

Banners (/promotions/banners)

Banerių valdymas vitrinoje. Lentelė: thumbnail, title, tipas (Normal / Category / Promo), tikslinis įrenginys (Desktop / Mobile / All), rūšiavimo tvarka, active perjungiklis.

Modaliame lange du paveikslėlio įkėlimo būdai: drag-and-drop failas (JPEG, PNG, WebP, AVIF, GIF, iki 10 MB) arba išorinio paveikslėlio URL. Papildomai — title, target URL, banner type, target device, kategorijos selektorius (jei pasirinktas type=category), sort order ir statusas. Geras pavyzdys, kaip operacinis ekranas uždaro turinio užduotį be atskiros CMS.

Day-wise Discounts (/promotions/daywise)

Nuolaidos pagal savaitės dienas — po vieną kiekvienai dienai. Lentelė: diena, pavadinimas, nuolaidos dydis (% arba $), minimalus krepšelis, informacija apie nemokamą dovaną, cashback dydis, statusas, edit ir delete mygtukai.

Modalinis langas suskirstytas į temines sekcijas: Basic Info (diena, name, aprašymas), Discount (tipas, vertė, minimalus krepšelis), Free Product (checkbox plius pavadinimas ir cart limit, prie kurio dovana išduodama), Wallet Cashback (suma ir cart limit), Military Discount (checkbox plius procentas atskirai klientų kategorijai) ir Status. Vienas ekranas — visa savaitinės aktyvacijos strategija.

Mix & Match (/promotions/mix-match)

Sudėtingiausias akcijų įrankis: pakopinės nuolaidos pagal kiekį. Lentelė: name + label, taisyklės tipas, default discount, minimalus kiekis, tier skaičius, statusas.

Modalinis langas dalijasi į blokus: Basic Info (name, label, taisyklės tipas — category_mix arba product_bundle, aprašymas), Discount Settings (tipas, default value, minimalus krepšelis pagal sumą ir pagal kiekį), Tiers (pakopų pridėjimas ir šalinimas — kiekviena su savo threshold pagal kiekį, verte ir nuolaidos tipu), Scope (bazinės kategorijos ID, taikomų kategorijų sąrašas ir taikomų prekių sąrašas per UUID). Taip verslas sudaro mechanikas tipo „pirk 3 — gauk 10%, pirk 5 — 20%".

Reports: finansai ir operacinė atskaitomybė

Didžiausias administravimo skydelio skyrius. Čia gyvena viskas, ko savininkui ar buhalteriui reikia kasdien, kas savaitę ir mėnesio pabaigoje.

Sales Report (/reports/sales)

Recharts BarChart „Sales Over Time" rodo pajamas pagal dienas, savaites ar mėnesius. Virš grafiko — laikotarpių išankstiniai nustatymai: Today, Yesterday, This Week, Last Week, This Month, Last Month, This Year, Custom. Group By nustato detalumą.

KPI Cards eina su laikotarpis-su-laikotarpiu palyginimu, su rodyklėmis aukštyn ir žemyn: Total Revenue, Total Orders, Average Order Value, Pending Orders. Po jais Secondary Stats: Discounts, Tax Collected, Delivery Fees, Tips, Cancelled count, Cancelled Value.

Lentelės papildo vaizdą: Payment Methods (Cash, Zelle, CashApp, Venmo, Split — užsakymai ir suma kiekvienam), COD Collection Methods, Top Selling Products (rank, name, qty, revenue), Previous Period Comparison.

Reconciliation Report (/reports/reconciliation)

Finansinis sutikrinimas. Tai jau ne marketingas, o buhalterija. KPI Cards viršuje: Gross Revenue, Net Revenue, Total Orders, Cost of Goods, Estimated Profit.

Financial Breakdown išskaido pajamas: Gross, Discounts Applied, Wallet Used, Rewards Used, Net, Tax, Delivery Fees. Lentelė Payment Methods rodo apmokėjimų struktūrą.

Cash Flow — atskiras blokas apie grynuosius: COD Sales Total, Cash in Envelope, Digital Payments (already on account), Change to Customer Wallets, Cash in Envelope (Net), Owner's Cash Total. Tai kritiška, nes dalis pinigų fiziškai ateina vokelyje nuo vairuotojo, o dalis išeina į kliento piniginę kaip grąža.

P&L Summary — tamsiai žalias baneris: Revenue, Tax, Delivery Fees, COGS, Estimated Profit. Po juo collapsible Order Details sekcija, kur kiekvienam užsakymui: order #, date, customer, items, subtotal, discount, wallet used, cashback, total, payment method, cash received, change to wallet. Kai reikia suprasti, kodėl diena užsidarė būtent taip — tai pagrindinis ekranas.

EOD Report (/reports/eod)

End of Day — ataskaita už vieną konkrečią dieną, su CSV ir PDF download. Metric Cards: Total Orders, ASAP Orders, Revenue, Collections, Avg Delivery Time, New Customers, Completed, Pending.

Cash Summary išskaido dieną pagal mokėjimo būdus: COD Sales, Cash Envelope, Digital Payments, Change to Wallets, Owner's Cash, Card Sales, Crypto. Atskira lentelė Products Sold su nuotraukos peržiūra, kiekiu, kategorija ir brendu. Financial Summary uždaro bloką mokesčiais, pristatymu, arbatpinigiais ir nuolaidomis. Ši ataskaita kiekvieną vakarą savininkui išsiunčiama kaip PDF.

Driver Report (/reports/driver)

Vairuotojų produktyvumas. Filters: datų diapazonas, konkretus vairuotojas, regionas. Lentelė: Driver Name, First Delivery, Last Delivery, # Deliveries, Avg Delivery Time, Sales, Cash Collected. Apačioje eilutė su totalsais. Šio ekrano pagrindu mokama alga ir priimami sprendimai dėl floto plėtros.

Cash Drop Report (/reports/cash-drop)

Grynųjų sutikrinimas tarp vairuotojo ir parduotuvės pamainos pabaigoje. Viršuje forma „Record Cash Drop": vairuotojo selektorius, laikotarpio pradžia ir pabaiga, Calculate mygtukas.

Po skaičiavimo atsiranda laukiamos sumos: Envelope Orders, Expected Cash, To Wallets, Owner's Cash ir atskiras callout apie digital payments, kad jų nebūtų galima supainioti. Toliau — Actual Amount laukas su live skirtumo (Difference) skaičiavimu, Notes laukas ir Record mygtukas.

Summary Cards: Total Expected, Total Dropped, Difference, Total Drops. Istorija apačioje — visų drop'ų lentelė: data, vairuotojas, tikėtasi, faktiškai, skirtumas (color-coded), užsakymų skaičius, statusas (verified / disputed / pending). Vienas iš svarbiausių finansinių kontrolių sistemoje: būtent čia užfiksuojamas trūkumas.

Affiliate Report (/reports/affiliate)

Partnerių programa. Filters: laikotarpis, paieška pagal vardą / email / kodą. Summary Cards: Total Affiliates, Total Referrals, Total Revenue, Total Commission su nurodyta komisijos norma. Lentelė su išskirstymu pagal affiliate ir Export CSV mygtuku.

COG Report (/individual/cog)

Cost of Goods, prieinamas nuo Store Admin rolės ir aukščiau. KPI: Revenue, Cost of Goods, Gross Profit, Gross Margin %, Inventory at Cost. Jei kai kurioms prekėms nėra savikainos, viršuje kabo warning banner. Product Breakdown rodo kiekvienam SKU: name, qty sold, revenue, cost, profit (žalias plius, raudonas minus), margin % su tokia pat spalvine koduote. Tai vienas iš naudingiausių analitinių ekranų produktui: jis iš karto parodo, kurios prekės uždirba pinigus, o kurios tiesiog perkelia likučius.

Invoices (/reports/invoices)

Užsakymų sąskaitos. Filters: datų diapazonas, checkboxai New Registration, Min Qty, Next Day Only, CSV download mygtukas. Lentelė: data, time slot, telefonas, vartotojas, email, parduotuvė, vairuotojas, statusas, sukūrimo data, grand total, view mygtukas.

Invoice Detail Modal — savarankiškas artefaktas. Shipping label peržiūra 80×80 mm formatu, Print Label mygtukas ir PDF download per jsPDF + autoTable. PDF apima: parduotuvės duomenis, užsakymo detales, informaciją apie klientą, vairuotoją, pozicijų lentelę ir visų totalsų išskaidymą. Iš esmės — tai pilnavertis dokumentas spausdinimui ir atskaitomybei.

Daily Orders (/reports/daily-orders)

Užsakymai pagal pamainas. Smith čia niuansas: pamaina prasideda 06:00 pagal Miami laiką, ir ataskaita gerbia šį poslinkį, kad duomenys nebūtų suskaidomi pagal kalendorinę vidurnaktį.

Wallet History (/reports/wallet-history)

Klientų piniginių operacijų istorija ataskaitos pjūviu (o ne atskirų vartotojų).

Settings

Settings → Store (/settings)

Keturi tabai:

• Store — bendra parduotuvės konfigūracija: pavadinimas, kontaktai, rekvizitai, nustatymai.
• Time Slots — pristatymo slotų pridėjimas, redagavimas, ištrynimas ir kiekvieno aktyvumo perjungiklis.
• Delivery Zones — CRUD pristatymo zonoms (su taisyklėmis pagal sumą ir laiką).
• Traffic Windows — ZIP apribojimai piko valandoms: piko metu galima išjungti dalį zonų, ir storefront tai matys.

Roles (/settings/roles)

RBAC rolių valdymas. Lentelė: name, description, trumpas teisių aprašymas, tipas (System / Custom), statusas, edit ir delete mygtukai (sisteminių ištrinti negalima). Teisių priskyrimas — modulių lygiu. Tai suteikia savininkui lankstumą nepriimant programuotojo, kad pridėtų naują rolę buhalteriui ar sandėlininkui.

Employees (/settings/employees)

Darbuotojų sąrašas: vardas su avataru, email, telefonas, rolė, statusas (Active / Inactive plius atskiras Online indikatorius), paskutinis login, edit, delete. Modalinis langas leidžia priskirti rolę ir keisti duomenis.

Customer Plans (/settings/plans)

Klientų premium lygių konfigūracija. Kiekvienas planas — atskira kortelė su spalvotu antraštės: Name, color picker, Cashback %, minimali užsakymo suma.

Kortelės viduje checkboxai mokėjimo būdams (COD, Crypto, Wallet) ir grynųjų surinkimo būdams (Cash, Zelle, CashApp, Venmo). Toliau — palaikymo valandos, pristatymo valandos, pristatymo lango start/end. Bonusinių prekių picker su paieška pagal slug, bonuso aprašymas, aprašymas vitrinai.

Atskiri toggle: rodyti planą tik po pirmojo užsakymo, leisti užsakymus 24/7 apeinant parduotuvės valandas, leisti užsakymus apeinant ZIP apribojimus. Tai išlaikymo įrankis: klientui su premium planu galima atverti kitiems uždraustus langus.

Piniginės

Wallet List (/wallet)

Paieška pagal email, lentelė: email, balansas, sukūrimo data, view mygtukas. Viršuje — Money Transfer mygtukas, atidarantis MoneyTransferModal pervedimui tarp piniginių. Ir Download mygtukas — visų balansų CSV eksportas.

Wallet Details (/wallet/details/:userId)

Vartotojo kortelė su balansu ir Add Balance mygtuku. Po ja — visų transakcijų lentelė: email, suma (color-coded, plius žaliai, minus raudonai), kam pervesta, užsakymo ID, priežastis, komentaras, data.

Wallet Logs (/wallet/logs)

Globalus visų piniginių žurnalas. Paieška pagal email, telefoną, priežastį. Lentelė: kas pervedė, kam, suma, priežastis (Credit / Debit / Refund / Bonus / Order Payment / Cashback), sukūrimo data, view (perėjimas į detalų vartotojo puslapį). Tai vienas iš pagrindinių anti-fraud įrankių: įtartinai priskaityti pinigai matyti iš karto.

Analitika

Conversion Analytics (/analytics/conversion)

Piltuvėlis: Sessions → Product Views → Cart Adds → Checkout → Orders, su perėjimo procentu kiekviename žingsnyje. Po piltuvėliu — Recharts LineChart su trim serijomis: Sessions (tamsiai žalia), Orders (raudona), Cart Adds (geltona, dashed). Tai pirmas puslapis, į kurį marketingo specialistas užeina ryte.

Activity Log (/activity-log)

Kliento tracking su keturiais tabais.

All Events — filtras pagal įvykio tipą (page_view, product_view, cart_add, cart_remove, checkout_start, checkout_success, api_error, js_error ir taip toliau), pagal user ID, pagal session ID. Lentelė: laikas, įvykio badge (color-coded), vartotojas, URL, session (clickable, veda į User Journey), IP. Kiekviena eilutė expandable: rodo raw JSON payload įvykio.

Errors — sugrupuotos klaidos: message, type, source, pasikartojimų skaičius, first/last seen. Tai pirmas diagnostikos taškas, kai svetainėje kažkas nuėjo ne taip.

Search Analytics — Top Searches ir Searches with No Results. Matosi, ko vartotojai ieško ir kur svetainė juos nuvylė.

User Journey — session ID įvedimas paleidžia visos sesijos kelio krovimą: numeruoti žingsniai, badges, laiko žymos, URL, payload. Watch Replay mygtukas atidaro rrweb-player per dynamic import ir leidžia tikrą įrašą click-by-click.

Audit Trail (/audit-trail)

Tik Platform Admin. Tai kitas kontrolės lygis — ne klientas, o vidiniai vartotojai.

Summary Cards: Product Changes Today, Product Changes (7d), Wallet Ops Today, Top Modifier (7d) — kuris iš administratorių dažniausiai ką nors taisė per savaitę.

Product Changes parodyta kaip sugrupuotos kortelės: vieno vartotojo per dvi sekundes atlikti pakeitimai sutraukiami į vieną bloką. Kiekviena kortelė rodo action badge (Created / Updated / Deleted / Variant Added / Updated / Deleted), timestamp, performed by ir produkto pavadinimą. Smart change display prioritetinius laukus stato į priekį: name, price, sale price, cost, inventory, active, featured, category, brand. Likę pakeitimai slepiasi po expandable „+N more". Formatavimo kontekstas — kainos rodomos kaip $, booleans kaip Yes/No, kategorijų ir brendų ID išverčiami į žmogui suprantamus pavadinimus, ilgi tekstai apkarpomi. Variantų pakeitimai — atskiri indented sub-items.

Wallet Operations — lentelė: laikas, administratoriaus vardas, kliento vardas, type badge (credit / bonus / refund / debit), suma, balansas prieš ir po, priežastis. Tai galutinis įrankis prieš vidaus sukčiavimą: savininkas mato kiekvieną administratoriaus priskaitytą centą.

Issues Monitor (/analytics/issues)

Incidentų kortelės: Checkout Failures (su priežasčių topu) ir JS Errors (su pranešimų topu). Laikotarpio išankstiniai nustatymai: Today, Yesterday, 7d, 30d. Tai trumpa rytinė santrauka product manageriui: kur šiandien skauda.

Registration Funnel (/registration-funnel)

OTP pagrindu sukurtas registracijos piltuvėlis. Etapai: sent (kodas išsiųstas), registered (sukurtas vartotojas), verified (kodas patvirtintas), abandoned. Prie jų — konversijos tarp etapų ir timing (kiek praeina tarp žingsnių). Matosi, kuriame etape klientai pasimeta.

Login Funnel (/login-funnel)

Tas pats, bet prisijungimui: kiek vartotojų pasiekia sėkmingą prisijungimą ir kur nutrūksta.

Checkout Funnel (/checkout-funnel)

Checkout piltuvėlis: nuo pradžios iki sėkmingo užsakymo, su nukritimų ir priežasčių paryškinimu.

Vitrinos turinys

Homepage Manager (/homepage)

Prieinamas nuo Store Admin rolės. Featured prekių valdymas: iki 8 slotų pagrindiniame puslapyje. Prekės paieška, pasirinkimas pagal kategoriją, išdėstymas pagal slotus. Be atskiros CMS, be programuotojų — tai kasdienis marketingo specialisto darbas.

Help (/help)

Pagalbos skyrius bet kuriai rolei: kaip naudotis skyriais, tipiniai scenarijai, atsakymai į dažnus klausimus.

Driver Layout

Kai prisijungia vairuotojas, jis mato visiškai kitą sąsają — mobilią, vienai rankai, su dideliais elementais.

Driver Dashboard (/driver-dashboard)

Welcome header su vardu ir šios dienos data. Pagrindinis elementas — Online/Offline toggle: didelis žalias pulsuojantis mygtukas, paspaudus prašo geolokacijos ir perveda vairuotoją į pamainą. Po juo — alert banner su pending užsakymais, shift status, active orders, earnings widgetai. Apačioje — nuorodos į My Orders.

My Orders (/my-orders) ir My Orders Detail (/my-orders/:id)

Priskirtų užsakymų sąrašas. Bakstelėjus į užsakymą — detalus puslapis su maršrutu, kliento kontaktu, sudėtimi, mokėjimo būdu ir statuso perėjimo mygtukais: Pickup, On the way, Delivered.

Dispatcher Layout

Dispečeris taip pat mato mobilią sąsają, bet kitai užduočiai.

Dispatcher Console (/dispatcher)

Pagrindinis dispečerio ekranas. DispatcherStats rodo pamainos overview metrikas. PendingOrdersList — užsakymai, laukiantys priskyrimo, su statuso filtru. DriversList — visi prieinami vairuotojai su online indikatoriumi ir aktyvių užsakymų darbe skaičiumi. AssignOrderModal — priskirti užsakymą konkrečiam vairuotojui. Atskiras DispatcherCustomers blokas suteikia greitą prieigą prie informacijos apie klientą. Auto-refresh keliasi per React Query invalidation: duomenys atsinaujina patys, be F5.

Dispatch Map (/dispatcher/map)

Geografinis dispatch view. Žemėlapis rodo vairuotojus ir užsakymus geografiškai, kad dispečeris matytų, ką priskirti užsakymui, remiantis pozicija, o ne tik vardu sąraše.

Dispatcher Invoices (/dispatcher/invoices)

Tas pats sąskaitų modulis, kaip ir pagrindiniame administravimo skydelyje, bet paleistas dispatcher-layout — mobilus, patogus darbui iš telefono.

Telegram mini-apps

Be pagrindinio web administravimo skydelio ir vitrinos, platformoje yra trys atskiros Telegram mini-app: parduotuvė klientams, dispečerinė ir vairuotojo. Tai savarankiškos SPA aplikacijos, paremtos Vite + React, kurios paleidžiamos Telegram viduje per WebApp API: vartotojas nieko neinstaliuoja ir neregistruojasi atskirai — mini-aplikacija atsidaro tiesiai iš chat su botu ir iškart atpažįsta žmogų pagal Telegram.WebApp.initData. initData parašas tikrinamas serveryje per HMAC, ir pirmojo apsilankymo metu sistemoje sukuriamas minimalus profilis (telefonas formatu tg_{telegram_id}, vardas iš Telegram). Toliau klientas, dispečeris ir vairuotojas turi tris visiškai skirtingus patyrimus vienoje backend kodo bazėje.

Sales mini-app — parduotuvė Telegram

Anoniminis katalogas, atidaromas per trumpą domeną per botą. Prieš įėjimą — KYC-gate su kliento sutikimu ir profilio patvirtinimu. Po gate rodomas pilnas katalogas: horizontalus kategorijų sąrašas, Featured sekcija su karuselinėmis prekių kortelėmis, gridas su kainomis, krepšelio ikona viršuje.

Krepšelis gyvena localStorage — jokios serverio sinchronizacijos, kad būtų galima surinkti užsakymą be autorizacijos. Tik užsakymo formavimo metu per Telegram atsiranda susiejimas su kliento profiliu: tas pats checkout, kaip ir vitrinoje, su visais scenarijais (Express, Scheduled, Cash, Wallet), bet tankiame mobiliame layout, pritaikytame vienai rankai.

Atskiras srautas šioje mini-aplikacijoje — Affiliate Program: klientas gali tapti partneriu, gauti asmeninį promo kodą ir share nuorodą, kuria dalijasi su draugais tiesiogiai Telegram. Iš ten pranešimai apie naują užsakymą, jo patvirtinimą, pristatymo statusus ateina klientui į chat su botu — be push pranešimų ir be email.

Dispatcher mini-app — dispečerinė kišenėje

Paleidžiama iš chat su dispečerio botu. Autorizacija — per Telegram, susiejimas su dispatcher role atliekamas automatiškai pagal telegram_id, kuris iš anksto sutapatintas administravimo skydelyje. Po įėjimo atsidaro dispatch konsolė: KPI juosta viršuje (Pending, Ready, Assigned, Delivery, Drivers, Done), keturi tabai — Orders, Drivers, Customers, Map.

Orders tabe dispečeris mato aktyvius užsakymus sąrašu: numeris, suma, pristatymo tipas (EXPRESS / scheduled time slot), data, kliento vardas, adresas ir atstumas nuo sandėlio. Bakstelėjus — detali užsakymo kortelė su galimybe priskirti vairuotoją iš laisvų sąrašo. Pagal numatytuosius nustatymus sąrašas filtruojamas pagal Area — dispečeris gali apriboti save savo atsakomybės zona.

Drivers tabe — visų vairuotojų sąrašas su online/offline indikatoriumi, aktyviu transportu, pristatymų skaičiumi. Laisvi paryškinti žaliai, užimti — pilkai. Galima paspausti ant vairuotojo ir pamatyti jo paskutinius pristatymus.

Customers tabas — greita prieiga prie klientų: paieška pagal vardą ar telefoną, Add Customer mygtukas profilio rankiniam kūrimui užsakant skambučiu, kiekvienam įrašui — viso laiko užsakymų suma ir kontaktas.

Ir, galiausiai, Map — geografinė vizualizacija: pristatymo zonos (Majamio rajonas ir jo priemiesčiai) žemėlapis su vairuotojų ir užsakymų taškų žymekliais. Centravimas ir zoom — virš Leaflet, plytelės — per OpenStreetMap. Tai galbūt dažniausias aktyvaus dispečerio tabas: jis mato, kuris iš vairuotojų arčiau naujo užsakymo, ir už porą bakstelėjimų priskiria.

Visi duomenys atsinaujina per WebSocket kanalą: naujas užsakymas — ateina realiu laiku, vairuotojo ar užsakymo statuso pasikeitimas — taip pat. Push pranešimai per Pushover dubliuoja kritinius įvykius (naujas užsakymas → priority=2, maksimaliu garsumu), kad dispečeris išgirstų juos net kai telefonas kišenėje.

Driver mini-app — vairuotojas Telegram

Paleidžiama iš chat su vairuotojo botu. Vairuotojo Telegram paskyra susieta su profile sistemoje per preassigned mapping — vairuotojas neįveda jokių slaptažodžių. Po įėjimo atsidaro dashboard.

Pagrindiniame ekrane — vairuotojo kortelė su vardu ir esamu pamainos statusu (Offline / Online), automobilio pasirinkimo iš priskirtų sąrašo mygtukas, pagrindinis žalias Go Online mygtukas. Paspaudus prašoma geolokacijos, ir vairuotojas patenka į active režimą: jo koordinatės pradedamos perduoti į serverį kas N sekundžių, ir jo avataras tampa matomas žemėlapyje dispečeriui.

Orders tabas — konkrečiam vairuotojui priskirtų užsakymų sąrašas. Kiekvienam — statusas (Assigned, Picked Up, On the way, Delivered), perėjimo mygtukai ir integruotos navigacijos nuorodos: „atidaryti Google Maps" arba „paskambinti klientui". Užbaigus užsakymą — modalinis langas su grynųjų sumos patvirtinimu (jei COD) ir nuotrauka proof-of-delivery.

Earnings tabas — vairuotojo uždarbis: šiandien, savaitė, mėnuo. Rodomas bazinis tarifas, arbatpinigiai atskirai ir bendras pristatymų skaičius. Tai uždaro klasikinį gig-ekonominių vairuotojų skausmą: „kiek aš uždirbau iki šio momento ir ar verta dirbti dar valandą".

Po gaubtu visos trys mini-aplikacijos dalijasi su web vitrina bendru API (NestJS), bendromis kliento ir užsakymo entity, bendra pranešimų eile (Redis pub/sub), bendru WebSocket įvykių formatu. Skiriasi tik UI ir endpoints rinkinys, prieinamas kiekvienai rolei. Tai leidžia Sales mini-app sukurtam užsakymui pasirodyti dispatcher žemėlapyje per sekundes, o po priskyrimo — Driver mini-app vairuotojui per kitas sekundes. Viskas vienoje Telegram ekosistemoje, be perėjimų tarp aplikacijų.

Login

Login (/login)

Įėjimo į administravimo skydelį taškas. Apsaugotas GuestGuard: jau autorizuotas vartotojas nukreipiamas į savo pradinį puslapį, priklausomai nuo rolės.

Dizaino paternai ir vieninga sąsajos kalba

Kad 50 puslapių su skirtingu funkcionalumu nevirstų zoologijos sodu, administravimo skydelyje išlaikoma bendra kalba:

• Spalva. Tamsiai žalia #0e3814 — pagrindinė headers, mygtukams, sidebar. Tamsios panelės su balta tekstu šios spalvos pagrindu naudojamos summary blokuose ir chart sekcijose, kad vizualiai atskirtų „totals" nuo darbinių lentelių.
• StatCard. Universalus komponentas KPI. Naudojamas Dashboard, Sales Report, EOD, Campaigns, Activity Log ir kituose — visur su tuo pačiu layout: ikona, skaičius, parašas, opcionali rodyklė su pokyčio procentu.
• DataTable. Reusable komponentas su dark variantu. Visi sąrašai — užsakymai, prekės, baneriai, piniginės, atsiliepimai — sukurti per jį, todėl paginacija, hover efektas, stulpelių išlygiavimas visur elgiasi vienodai.
• Status badges. Semantinė spalvų schema: žalia active ir delivered, geltona pending, raudona cancelled, mėlyna confirmed. Tai iškart suprantama, nereikia žiūrėti į legendą.
• Modal pattern. Visur tas pats fiksuotas overlay su uždarymu paspaudus backdrop. Jokio netikėto „kita modalinis langas veikia kitaip".
• Toggle switches statusams (visible / hidden, active / inactive) — kompaktiškesni nei mygtukai ir iš karto suteikia atsaką.
• Pagination per Previous / Next, be skaidymo į smulkias dalis.
• Loading state — Loader2 iš lucide-react su vienoda animacija.
• Ikonos — išskirtinai lucide-react, be miksų su kitais rinkiniais. Tai svarbu tiek vizualiniam vientisumui, tiek bundle size.

Iš viso to gaunamas pojūtis, kad 50 puslapių yra vienas produktas, o ne penki skirtingi, suklijuoti skotčia.

Ką tai reiškia verslui

Didžioji dalis išorinių e-commerce admin skydelių apima pirmus du-tris lygius: katalogą, užsakymus, vartotojus. Čia bandyta nueiti pastebimai giliau: dienos finansinis sutikrinimas, grynųjų iš vairuotojo vokelyje kontrolė, audit trail katalogo ir piniginių redagavimams, atskira piltuvėlių analitika registracijai, prisijungimui ir checkout, vartotojų sesijų įrašymas su replay administravimo skydelio viduje, multi-role su mobiliais layout vairuotojui ir dispečeriui.

Iš operacijų požiūrio tai reiškia, kad savininkas ir komanda gali vesti verslą savarankiškai, nesikreipdami į programuotoją dėl tipinių užduočių. Iš produkto požiūrio — kad sistemoje yra integruoti įrankiai savidiagnostikai: kur pasimeta pinigai, kur krenta konversija, kuris iš administratorių ką nors keičia naktimis, kurie SKU neneša maržos.

Susiję skyriai

• Last-mile Delivery Platform — verslo apžvalga
• Last-mile Delivery Platform — techninė architektūra
• Visi case study