POS UI/UX Overhaul, Dynamic Surcharges, and Enhanced Product Discovery

[kithomeken]

PR Description

Note

Live Demo: I have deployed a version of QPOS featuring these updates at https://qpos.okestri.com/ for the team to explore the changes in a live environment.

Note: Active development is ongoing on this environment. The live preview may reflect newer features and UI changes beyond what is captured in this specific PR.

Executive Summary

This PR represents a significant evolution of the QPOS platform. It consolidates four major development phases into a single, cohesive update designed to modernize the retail experience, improve procurement accuracy, and provide enterprise-grade financial transparency.

Key highlights include a completely redesigned POS interface, a dynamic payment surcharge engine, and enhanced product discovery through unified search and brand integration.

1. POS & Financial Infrastructure

Dynamic Surcharge Engine: Implemented a system to apply payment-method-specific fees (Fixed or Percentage) at checkout.

Immutable Audit Trail: Orders now capture a "snapshot" of surcharge_amount, type, and value at the point of sale, ensuring that historical reports remain accurate regardless of future setting changes.

Payment Method Management: Full CRUD suite for Payment Methods including activation/deactivation, default setting logic, and contextual icons.

Reference Tracking: Introduced a robust migration and logic for unique Order Reference Number generation.

Precision Formatting: Standardized locale-aware number formatting (toLocaleString) across the entire platform, ensuring two-decimal precision for all financial totals.

2. UI/UX Modernization

POS Redesign: Overhauled the terminal layout to meet modern UX standards. This includes high-contrast circular buttons for quantity adjustment and a streamlined subtotal card.

Receipt/Invoice Enhancement: Refactored the printed and web receipts to include clearer details, and surcharge breakdowns for customer transparency.

Branding & Navigation: Integrated a dynamic Navbar that reflects the site_name from configuration and optimized margins across all views for a cleaner, "app-like" feel.

Form Overhaul: Redesigned the Product and Purchase creation forms to improve data entry flow and user efficiency.

3. Search & Product Intelligence

Unified Search Engine: Re-engineered the POS cart search to be case-insensitive and to query Product Name, SKU, and Brand Name simultaneously via a single field.

Brand Integration: Brands are now integrated into the Product Resource, visible in DataTables, and searchable within the POS.

Stable Resource Loading: Expanded API resources to include SKU, Currency, and Brand details, ensuring the frontend always has the context it needs without extra queries.

4. Procurement & Inventory (Purchase Flow)

Component Stability: Resolved critical JSX rendering issues in the CreatePurchase component and optimized search list interactions.

Deep-Data Tables: Upgraded Purchase DataTables to include Sub-Totals, Discounts, Shipping, and Taxes for immediate procurement insight.

Accountability: Established User-Purchase relationships to track which team member initiated specific procurement actions.

This pull request documentation was generated with the assistance of AI to ensure all technical changes were accurately categorized and summarized.

[s1kopath]

Can you share login credentials of https://qpos.okestri.com for the team to explore the changes in a live environment?
@kithomeken