feat: Create dedicated Invoice and Label pages

Invoice Page (/orders/:id/invoice):
- A4-ready layout (210mm x 297mm)
- Store header, invoice number, QR code
- Billing/shipping address sections
- Styled items table with alternating rows
- Totals summary with conditional display
- Thank you footer
- Back to Order and Print buttons

Label Page (/orders/:id/label):
- 4x6 inch thermal label layout
- Ship To address with phone
- Items list (physical products only)
- Shipping method
- QR code for scanning
- Back to Order and Print buttons

Order Detail:
- Removed print-mode logic
- Removed print-only layouts
- Invoice/Label buttons now link to dedicated pages
- Label button still hidden for virtual-only orders
This commit is contained in:
Dwindi Ramadhana
2026-01-06 20:57:57 +07:00
parent 40aee67c46
commit 1cef11a1d2
4 changed files with 369 additions and 187 deletions

View File

@@ -13,6 +13,8 @@ import OrdersIndex from '@/routes/Orders';
import OrderNew from '@/routes/Orders/New';
import OrderEdit from '@/routes/Orders/Edit';
import OrderDetail from '@/routes/Orders/Detail';
import OrderInvoice from '@/routes/Orders/Invoice';
import OrderLabel from '@/routes/Orders/Label';
import ProductsIndex from '@/routes/Products';
import ProductNew from '@/routes/Products/New';
import ProductEdit from '@/routes/Products/Edit';
@@ -551,6 +553,8 @@ function AppRoutes() {
<Route path="/orders/new" element={<OrderNew />} />
<Route path="/orders/:id" element={<OrderDetail />} />
<Route path="/orders/:id/edit" element={<OrderEdit />} />
<Route path="/orders/:id/invoice" element={<OrderInvoice />} />
<Route path="/orders/:id/label" element={<OrderLabel />} />
{/* Coupons (under Marketing) */}
<Route path="/coupons" element={<CouponsIndex />} />