The Amvel Warehouse system supports QR code scanning via the device camera to auto-fill shipment forms and filter inventory records. Scanning is handled entirely in the browser using the jsQR library (v1.4.0), which continuously decodes frames from a liveDocumentation Index
Fetch the complete documentation index at: https://mintlify.com/phauline-racel/LIMO-YUSEN-WAREHOUSE/llms.txt
Use this file to discover all available pages before exploring further.
<video> element. No external scanning app or plugin is required — the camera opens inside the page in a modal overlay.
Where QR scanning is available
The QR scan button (identified by thebi-qr-code-scan Bootstrap Icon) appears in two locations:
- Inbound & Outbound form — Each of the HAWB and MAWB input fields has an inline scan button. Clicking it opens the scan modal. A successful scan attempts to populate all recognized form fields (client, destination, HAWB, MAWB, invoice, transaction type, plate number, date, and time).
- Inventory and Dashboard search bars — The search toolbar on the Inventory page contains a scan button alongside the
#inventorySearchInputfield. On the Dashboard (Activity Log view), the scan button targets the#activitySearchInputfield. A successful scan uses the detected value as a search term, filtering the displayed records immediately.
Expected QR payload format
The recommended QR payload is a JSON string. All fields are optional; only the keys that are present will be applied to the form.datemust be inYYYY-MM-DDformat.timemust be inHH:mm(24-hour) format.transactionTypemust match one of the select options exactly:AFF Import,AFF Export,OFF Import,OFF Export. Partial or case-insensitive matches are attempted as a fallback.
Alternative field aliases
ThenormalizeShipmentPayload() function accepts several alternative key names in addition to the canonical ones. This allows QR codes generated by other systems to be scanned without modification.
| Canonical field | Also accepted as |
|---|---|
client | Client, shipmentClient |
destination | Destination, shipTo |
hawb | HAWB, hawbNumber, shipmentId |
mawb | MAWB, mawbNumber |
invoice | invoiceNumber, markings, marking |
transactionType | transactionTypeName, transaction_type, transactionTypeLabel, transaction, type |
plateNo | plate, plateNumber, vehiclePlate, vehiclePlateNo |
Plain text QR codes
If the QR code content is a plain string rather than a JSON object, the system treats it as a direct search value. It is applied to whichever search input is present on the current page:- On the Inventory page → populates
#inventorySearchInputand refreshes the inventory table. - On the Dashboard / Activity page → populates
#activitySearchInputand refreshes the activity list. - On the Inbound & Outbound form (where neither search input exists) → the string cannot be applied to the page and the system shows an “Invalid QR Code” alert.
YPH-04800983) can be used to search inventory without needing a full JSON payload.
How form filling works
When a scan result is decoded,handleScannedPayload(text, modal, context) is called. The following steps occur in order:
Parse the scanned text
JSON.parse(text) is attempted. If it succeeds, the result is a structured payload object. If it fails (plain text or malformed JSON), the raw string is used instead.Check whether the current page has a search input
applyScannedPayloadToPage(payload) is called first. If #inventorySearchInput or #activitySearchInput is found in the DOM, the search value extracted from the payload is written to that input and the relevant data refresh function (refreshInventory or refreshActivity) is called. The modal closes and processing stops.Populate the shipment form (if no search input was found)
populateShipmentForm(payload, context) is called. normalizeShipmentPayload() maps the payload (including all aliases) to canonical field names. Each [data-field] element in the active form context is then updated.Pre-fill location and unit from stored records
findStoredShipmentByScanValue() searches warehouseShipments for an existing record whose hawb or mawb matches the scanned value. If found, the stored location is written to the location field and the stored unit is applied to the unit select — saving re-entry for repeat shipments.Default date and time to Philippine time
If
date or time were not present in the payload, they are defaulted to the current date and time in the Asia/Manila timezone using getPhilippineDateTime(). This ensures the form is always pre-filled with a valid timestamp even for minimal QR codes.Camera requirements
For QR scanning to function, the following conditions must be met:- The browser must support
navigator.mediaDevices.getUserMedia(all modern browsers support this). - The page must be served over HTTPS or from localhost. Camera access is blocked by browsers on plain HTTP origins.
- The system requests the environment (rear-facing) camera using
{ video: { facingMode: 'environment' } }. On desktop browsers with a single camera, the default camera is used. - The camera feed is rendered in the
<video id="cameraPreview">element inside the scan modal. jsQR reads pixel data from each video frame via an off-screen<canvas>.
If the browser shows a camera permission prompt, click Allow. If permission was previously denied, you must reset it in your browser’s site settings (usually accessible via the lock icon in the address bar) and reload the page.
Troubleshooting
Camera access denied — 'Unable to access camera'
Camera access denied — 'Unable to access camera'
The browser has blocked camera access for this site.Fix: Open your browser’s site settings (click the lock/info icon in the address bar → Site settings → Camera → Allow). On mobile devices, also check the operating system’s app-level camera permissions for your browser. After granting permission, reload the page and try scanning again.
Camera not supported on this device or browser
Camera not supported on this device or browser
The browser does not implement
navigator.mediaDevices.getUserMedia, or the page is being served over plain HTTP (not HTTPS or localhost).Fix: Use a modern browser (Chrome, Edge, Firefox, Safari) and ensure the page is accessed via HTTPS. If a camera is not available, use manual keyboard entry for all form fields.QR code is not being recognized
QR code is not being recognized
The scanner is running but the QR code is not triggering a result.Fix: Ensure there is adequate lighting on the code. Hold the device steady and position the QR code within the four-corner scan window shown on screen. Avoid glare on printed codes. jsQR requires the entire QR code to be visible within the camera frame. If the code is very small, move closer to it.
'Invalid QR Code' alert appears after scanning
'Invalid QR Code' alert appears after scanning
The decoded content could not be parsed as JSON and the current page has no search input to receive a plain-text value (i.e. you are on the Inbound & Outbound form, and the scanned string is not a recognizable HAWB or MAWB).Fix: Verify that the QR code was generated using the expected JSON payload format described above. Plain-text QR codes are only useful on the Inventory and Dashboard pages, not on the form itself.