Warehouse Management System

Comprehensive Demo Guide · Modules, Flowchart & Walkthrough

1Access the System

Admin Portal
http://localhost:5100
Public Storefront
http://localhost:5200

Open the admin portal first — you will be redirected to the sign-in page automatically. Keep the storefront in a separate browser tab so you can switch between the operator view and the customer view during the walkthrough.

2Demo Credentials

All four demo accounts share the same password:Warehouse@2026!
Super Admin
Warehouse@2026!

Full access. Use this for the main walkthrough — it can see every module, manage users, and trigger every action.

Warehouse Manager
Warehouse@2026!

Day-to-day operations. Useful for showing role-based access — same modules as the super admin but without user and role management.

Picker
Warehouse@2026!

Floor staff. Only sees pick lists and the scan workflow — useful for showing the lean operator view the warehouse team will actually use.

Viewer
Warehouse@2026!

Read-only. Useful for showing stakeholders the dashboards and reports without risking accidental edits.

These are demo-only credentials. They must be rotated and replaced with real accounts before the system is handed over to the client. Do not share this page publicly.

3System Modules

The system is organised into logical modules that mirror how a warehouse team actually works. Each card below links a business function to the menu group you will find in the sidebar. The highlighted cards are the ones every demo should cover at least briefly.

📊

Dashboard

Landing page for managers. Revenue, order volume, fulfilment rate, low-stock alerts, 30-day sales trend.
KPI tiles Charts Alerts
🏷️

Catalog

Product master data. Each product carries English and Chinese names, category, brand, SKU, barcode, cost, price, weight, dimensions.
Products Categories Brands Bulk import
🏭

Warehouses & Bins

Physical locations. Each warehouse holds many bins (shelves), and stock is tracked at the bin level so pickers always know which shelf to visit.
Multi-warehouse Bin QR codes Location map
📦

Inventory

Live stock quantities per product per bin. Covers adjustments, inter-warehouse transfers, cycle counts, and low-stock alerts.
Stock levels Adjustments Transfers Cycle counts Reservations
📊

Purchasing

Inbound side of the warehouse. Manage suppliers, raise purchase orders, record goods receipts when shipments arrive.
Suppliers Purchase orders Goods receipts
🛒

Sales

Outbound order management. Customer records, sales orders created manually or received from storefront or marketplaces.
Customers Sales orders Quotations
📱

Fulfilment

The pick-pack-ship workflow. Pickers scan items, packers confirm cartons, shipments generate couriers labels and tracking.
Pick lists Packing Shipments Couriers Returns
🌐

Sales Channels

Where orders come from. The built-in storefront is always active; the three marketplace connectors (Shopee, Lazada, TikTok Shop) activate when the client provides merchant credentials.
Storefront Shopee Lazada TikTok Shop
💳

Payments & Finance

Payment records linked to sales orders. Online payment via the integrated provider, cash-on-delivery, bank transfer, and manual “mark as paid” for corrections.
Online payment COD Refunds Invoice PDFs
📈

Reports & Analytics

Sales, inventory, and top-product reports with charts and spreadsheet exports. Column headers in Chinese for the client's accountant.
Sales Inventory Top products Spreadsheet export
🔔

Notifications

Real-time in-app alerts for low stock, failed payments, expired reservations, new orders, and background sync failures.
Bell dropdown Low stock Order events
📜

Audit Logs

Append-only record of every sign-in, create, edit, and delete. Stores actor, timestamp, and the diff of what changed.
Who What When Before/after diff
👥

Users & Roles

Staff account management. Create users, assign built-in or custom roles, reset passwords, deactivate staff who have left.
Users Roles Permissions Password reset
💵

Currencies & Exchange

Multi-currency support for the client's cross-border business. Peso, US dollar, Chinese yuan, with editable exchange rates.
PHP USD CNY Rate history

4Operational Flowchart

How the modules connect in real operations. Read the chart top-to-bottom: goods arrive through the inbound flow, land in the stock hub, and leave through the outbound flow. The dotted gold arrows represent support activities that feed stock without being part of a specific order. The red dashed arrow shows returned items flowing back into stock.

End-to-End Order Lifecycle Inbound Flow · Purchasing Supplier Purchase Order Goods Receipt Stock Hub · Inventory Stock & Bin Locations Live quantities per warehouse Adjustments & Transfers Cycle Counts Outbound Flow · Sales & Fulfilment Admin Entry Storefront Marketplace Sales Order Pick List Packing Shipment Delivered Returns Finance & Insight Invoice PDF Payment Records Reports & Analytics Audit Log Notifications
Process step
Central hub
End state
Main flow
Supporting flow
Reverse flow (returns)

5Roles & Access Matrix

The four demo accounts map to four of the built-in roles. Additional roles (Admin, Warehouse Staff, Packer, Cashier) exist for larger teams and can be combined or extended. The table below shows what each demo role can do in the main modules. Use the matrix to decide which account to sign in with when showing a particular part of the system.

Module Super Admin Manager Picker Viewer
Dashboard Full Full Limited View
Catalog · Products, Categories, Brands Full Full View View
Inventory · Stock, Adjustments, Transfers Full Full View View
Purchasing · Suppliers, POs, Receipts Full Full View
Sales · Customers, Orders Full Full View assigned View
Pick / Pack / Ship Full Full Execute View
Channels · Storefront & Marketplaces Full Configure View
Payments & Invoices Full Full View
Reports & Analytics Full Full View
Audit Log Full View View
Users & Roles Full
Currencies & Exchange Rates Full Edit View
Deleting a role that still has users assigned is blocked. The built-in roles (Super Admin, Admin, Manager, Picker, Packer, Cashier, Viewer, Customer) cannot be deleted. Custom roles can be created and removed freely.

6End-to-End Walkthrough · 15 Steps

The happy-path story from catalog setup through pick, pack, ship, and reporting. Allow 25–30 minutes to walk a stakeholder through all fifteen steps. Each step has a suggested talking line you can use verbatim or adapt.

  1. Sign in as the super admin From the login screen, enter superadmin@warehouse.local and the shared password. Unknown users and locked accounts show the same error message, so attackers can’t probe the system for valid usernames. “Let me start by signing in as the warehouse administrator. Notice that failed logins are automatically locked out after ten attempts in a minute, so brute-force attacks are blocked without any manual intervention.”
  2. Dashboard overview Point at the KPI tiles: today’s orders, revenue this month, fulfilment rate, low-stock count. The thirty-day chart shows sales and order volume side-by-side. The bell in the top-right shows real-time notifications for low stock, failed payments, and expired reservations. “This is what the warehouse manager sees first thing every morning. Everything important is one glance away — revenue, order volume, low stock, and a rolling thirty-day trend so you can spot seasonality without opening a report.”
  3. Create a product with a Chinese name Go to Catalog → Products → New Product. Enter a name in English and a second name in Chinese. Set a category, brand, SKU, barcode, cost, and retail price. Save. The new product appears on the list instantly. “Every text field supports English and Chinese side-by-side, so product data reads naturally in either language. The SKU is the key that stock, sales, labels, and reports all hang off of.”
  4. Print a product label sheet Back on the product list, tick a few products, set copies-each to 24, and click Print Selected Labels. A ready-to-print document opens in a new tab — twenty-four labels per A4 sheet with QR codes, names, SKUs, and prices. “Labels are generated on demand, so staff can reprint them whenever stock comes in. The QR code on each label encodes the SKU, so pickers can scan it with a phone and instantly confirm they have the right item.”
  5. Add a supplier and create a purchase order Go to Purchasing → Suppliers → New Supplier. Add a supplier with contact details. Then go to Purchase Orders → New Order, pick the supplier, add line items, submit. “Purchase orders drive inbound inventory. Once submitted, the system tracks each order through to goods receipt — no paper trail, no spreadsheet reconciliation.”
  6. Receive the goods Open the purchase order you just created and click Record Goods Receipt. Confirm the quantities. The system moves the stock into the receiving bin of the default warehouse and writes an audit trail. “This is where the physical inventory count actually moves. Notice that stock is tracked per bin, not per warehouse — so staff always know exactly which shelf to look at.”
  7. See the stock update live Go to Inventory → Stock. The product you just received now shows positive quantity in the receiving bin. Filter by low-stock to watch the dashboard alert disappear. “The dashboard, the stock screen, and the low-stock alerts are all reading the same source — there is no sync delay or batch job in between.”
  8. Create a customer and a sales order Go to Sales → Customers → New Customer. Add a customer. Then Sales Orders → New Order, pick the customer, add line items, submit. “Sales orders can come in three ways: typed manually here, from the public storefront, or from one of the marketplace channels. All three feed the same pipeline, so the warehouse team only ever has one place to look.”
  9. Generate a pick list Open the order and click Generate Pick List. The system assigns each item to the nearest bin and produces a pick sheet the picker can take onto the warehouse floor. “The picker can print this sheet or open it on their phone. Each line has a scan button — when they scan the product label, the system checks it matches before letting them advance. Wrong items cannot slip through.”
  10. Sign in as the picker and scan items Sign out, sign back in as picker@warehouse.local, open the pick list, and use the built-in scan feature. The picker view is deliberately minimal — no clutter, just the next item to pick. “This is what the floor staff see on their phones. No dashboards, no inventory screens — just ‘grab the next item, scan it, confirm’. We keep the cognitive load low so new hires are productive on day one.”
  11. Pack and ship the order Sign back in as the manager. Go to Packing, select the packed order, create a shipment, choose a courier, print the waybill, and mark the order as shipped. “Once shipped, the tracking number flows automatically to the customer. They get a notification and can track their package from a link — no phone calls to the warehouse asking ‘where is my order’.”
  12. View the branded invoice From the sales order detail page, click Download Invoice. A polished, branded document opens with company details, line items, totals, tax breakdown, and Chinese text rendered in a proper font — not boxes or question marks. “Invoices are generated on the fly, with no templates to maintain. The Chinese characters render in a proper typeface, and the layout is ready to print on the client’s letterhead.”
  13. Open the reports page Go to Reports. Open the Sales, Inventory, and Top Products reports. Each has a chart and an export button. Click Export to Spreadsheet to download a ready-to-open file for accounting. “Exports are set up specifically for the client’s accountant — Chinese column headers, correct date format, correct decimal separator. The accountant can open these directly in their usual spreadsheet program without any cleanup.”
  14. Show the audit log Go to Audit Logs. Every sign-in, every create, every edit, and every delete is stamped with the actor, timestamp, and a diff of what changed. Filter by user, module, or action. “If anything ever goes missing — a product, a stock count, a customer — this is where you find out who touched it and when. The log is append-only, so staff cannot cover their tracks.”
  15. Sign out from the user menu Click the user chip in the top-right header. A dropdown shows who is signed in, a shortcut to user management, and a Sign out button. Click it to return to the login page. “And that is the tour. Sign-ins time out automatically, and staff can sign themselves out whenever they step away from a terminal — no shared sessions lingering at the end of a shift.”

7What to Skip in This Demo

Three features are fully built and ready to activate, but depend on external credentials the client has not yet provided on the demo environment. Avoid clicking into these during the walkthrough — they will show a “pending configuration” message that looks like an error.

8Presenter Tips

  • The system supports English and Chinese side-by-side in every text field — a quick way to impress the stakeholder is to type a product name in Chinese and show the QR label, the invoice, and the report all render it correctly.
  • The notification bell in the top-right refreshes every minute. If a low-stock or new-order event fires during the demo, the badge will light up — pause and point at it.
  • If you mistype the password more than ten times in a minute, the system locks login attempts for about sixty seconds. Don’t panic — wait a minute and try again, or refresh the page and slow down.
  • The dashboard chart covers the last thirty days. On a freshly reset demo environment the chart will start mostly empty; create a few sales orders during the walkthrough to liven it up.
  • Deleting a product or a customer is always reversible through the audit log — nothing is ever truly lost, so it is safe to click “delete” during the demo if a stakeholder asks.
  • Press Ctrl+F in your browser to find anything on a long list page; every list also has its own search box that looks across every column.
  • The user menu in the top-right is always one click away from signing out — use this to switch between the admin and picker views without closing the browser.
  • The flowchart in section 4 prints cleanly on landscape A4 — hand it out as a one-page visual reference if stakeholders prefer paper.

9Resetting the Demo Environment

If the demo data gets cluttered — too many test orders, accidentally-deleted products, wrong settings — ask the engineering team for a fresh demo reset. They can rebuild the entire demo environment quickly: the four accounts on this page, the default roles, the currency list, and the main warehouse all come back exactly as listed here. The passwords never change between resets, so the credentials on this page are always valid.

If you are running the demo on a laptop that has been powered off for a while, give the system about thirty seconds to warm up on the first page load. Subsequent clicks will be instant.