Invoice Generator

User opens /invoice-generator. Invoice number is auto-generated and invoice date defaults to today in Jakarta timezone (UTC+7). Due date defaults to +3 days via Flatpickr.

User selects Invoice Type: Dealer (searchable combobox fetches dealer list from database) or Customer (free-text input). Switching type cascades downstream — resets bill-to and recalculates item rates between reseller and retail pricing.

User builds item rows via preset catalog combobox (pricing changes based on invoice type) or custom manual rows. Each row calculates amount live (qty x rate). Subtotal updates in real-time. Valid item rows unlock the Shipping and Discount panels.

User configures shipping: Manual (free-text Ship To address) or Automatic via Biteship API. Automatic supports Area-Based delivery (Country to Province to City to District to Subdistrict, with postal code auto-fill on subdistrict selection) or Point-Based delivery (Leaflet.js map with draggable marker, synced to lat/lng text inputs).

Area or point selection triggers POST /api/shipping-quote to the Biteship API. Courier buttons render with logos. Selecting a courier filters its available services. Selecting a service auto-fills the shipping cost input.

User applies discount — Flat (direct IDR amount) or Percentage (with optional maximum IDR cap) — and an optional additional fee with label. Grand total = subtotal minus discount plus shipping plus additional fee, updated live.

User edits invoice footer: Notes section (header plus up to 3 paragraphs) and Closing section (header plus 1 paragraph). Each field has a character counter with 85% warning and 100% block. A live scaled preview reflects changes as the user types. Revert-to-default buttons restore company defaults per section.

User clicks Generate Invoice. Client-side validation runs, hidden fields are prepared, and the form POSTs to /invoice-generator/preview?nobar=1 inside a hidden iframe. The preview page renders a styled A4 invoice, saves it to log_invoice, and broadcasts an invoiceReady postMessage with the generated log_id back to the parent window.

Parent window captures log_id and enables the Download PDF button. Clicking it navigates to /invoice-log/preview?log_id=X&autodownload=1, which re-renders the invoice and triggers the browser print dialog for save-as-PDF.

User opens the standalone demo at /demos/brill-invoicing-lite. No login or database connection required.

Invoice type is locked to Customer Invoice. Bill To is free-text only. Up to 3 manual item rows can be added.

Shipping uses a CSV-backed PHP address endpoint limited to Banten province (Province to Regency to District to Subdistrict). Subdistrict selection auto-applies a fixed IDR 10,000 shipping cost. Instant delivery option is present but disabled, with a Bootstrap tooltip explaining the demo limitation.

Flat discount only. Footer editor is fully locked with lorem ipsum preview. All limited fields show an orange hint explaining the demo constraint. PDF download is intentionally disabled.

Jakarta timezone: custom jakartaDate() factory using manual UTC+7 offset calculation prevents client-timezone discrepancies for invoice and due dates.

Indonesian currency parsing: multi-pass heuristic handles periods as thousands separators and commas as decimal separators — opposite of most Western systems.

Combobox overflow escape: dropdown menus are detached from DOM on open, appended to document.body, and positioned via getBoundingClientRect(). A ResizeObserver and scroll listener keep the floating menu aligned while open.

Shipping re-query deduplication: an item-change signature (hash of item names and quantities) is stored and compared before each Biteship API call. A new quote is only requested when the signature changes, preventing redundant calls on blur events.

Invoice preview iframe height: after load, JavaScript reads contentDocument.body.scrollHeight and sets the iframe height explicitly, with a 960px minimum guard to prevent flash of undersized iframe.

PDF generation without a server-side library: the invoice is rendered as a styled A4 HTML page (1240x1754px) with @media print rules and triggered via window.print(), allowing the browser to save as PDF with exact layout fidelity.

Footer preview scaling: JavaScript measures the available container width, computes a scale ratio, and applies CSS transform: scale() to the preview canvas. The outer wrapper is sized in CSS units so layout flow is preserved.

Disabled Instant Delivery tooltip: the option uses a .is-disabled CSS class instead of the HTML disabled attribute so hover events still fire for Bootstrap tooltip initialization. The click handler checks for the class and blocks the action.

Lite combobox rebuilt from scratch: a plain object state map (addrCb) manages four address dropdowns with ~500 lines of vanilla JS, fully independent of the main app combobox system.