Example AR Invoice
Last updated: October 7, 2025
Sample Data
{ "Header": { "AR_Invoice_Reason_Key": null, "AR_Invoice_Status_Key": 960, "AR_Invoice_Type_Credit_Memo": false, "Address": "TBM Billing: Batesville Mexico\r\nLa Nona # 106 Parq Ind Qro\r\n", "Amount": 131.16, "Balance": 131.16, "Bill_And_Hold": false, "Bill_Code": "TBM Bill To", "Billing_Address_No": 1312149, "Booked": true, "Building_Code": "Production", "Building_Key": 1976, "Chargeback": "No", "City": "Queretaro", "Complete": false, "Consolidated_Link": 0, "Contact_Email": "", "Contact_Fax": "", "Contact_Name": "", "Country": "Mexico", "Created_By": 57505, "Created_Date": "2010-01-06T14:44:17Z", "Credit_Memo": 2, "Credit_Memo_On_Void": false, "Currency_Amount": 1680, "Currency_Balance": 1680, "Currency_Code": "MXN", "Customer_AR_Invoice_Reason_Key": null, "Customer_Code": "TBM", "Customer_No": 139287, "Customer_PO_No": "888222", "Customer_Reason": null, "Customer_Return_Added_By": "", "Customer_Return_No": "", "Customer_Return_Reference_No": "", "Delete_Permission": true, "Dist_Lines": 1, "Due_Date": "2010-02-05T05:00:00Z", "Escrow": "No", "Escrow_Type_Flag": false, "Exchange_Rate": 12.80880022, "Expected_Pay_Date": "2010-01-06T05:00:00Z", "Fax": "", "Government_Issued_No": "", "Invoice_Date": "2010-01-06T05:00:00Z", "Invoice_Delivery": "Mail", "Invoice_No": "0000054", "Invoice_Note": "", "Invoice_Type_Key": 446, "Manual_Invoice": 0, "Multi_Entity_GL_Journal_Key": null, "Multi_Entity_GL_Journal_Status": "Booked", "Multi_Entity_GL_Journal_Status_Key": 3, "Name": "TBM Billing: Batesville Mexico", "Note": "", "On_Account": "No", "Order_Nos_Keys": "888222|696915", "Originating_PCN": 0, "Paid": 0, "Payments": 0, "Period": 201001, "Period_Display": "01-2010", "Period_Key": 27245, "Period_Status": 0, "Phone": "", "Printed_By": null, "Printed_Date": null, "Printed_Status_Key": 961, "Printed_Status_Name": "Printed", "Reason": null, "Reference_Key": 2592230, "Reference_No": "00068", "Retroactive_Discount_Applied": 0, "Retroactive_Discount_Available": 0, "Self_Billing_Invoice": false, "Ship_Address": "TBM Ship To: Batesville Mexico\r\nLa Nona # 106 Parq Ind Qro\r\n", "Ship_City": "Queretaro", "Ship_Code": "TBM Ship To", "Ship_Country": "Mexico", "Ship_Fax": "", "Ship_Name": "TBM Ship To: Batesville Mexico", "Ship_Phone": "", "Ship_State": "Querétaro", "Ship_Zip": "76220", "Shipping_Address_No": 1312030, "State": "Querétaro", "Status": "Not Printed", "Taxable_Date": "2010-01-06T05:00:00Z", "Terms": "Net 30", "Terms_Key": 5052, "Tool_Order_Key": 0, "Tool_Order_No": null, "Update_Permission": true, "Updated_By": 57505, "Updated_Date": "2010-01-06T14:44:17Z", "VAT_Currency_Code": null, "VAT_Exchange_Rate": null, "Void": 0, "Voucher_No": "", "Workflow_Doc_Key": 0, "Zip": "76220" }, "Lines": [ { "Account_No": "4000-000", "Accounting_Job_Key": null, "Accounting_Job_No": null, "Active": true, "Amount": 131.16, "Compound_Tax": "", "Consolidated_Link": 0, "Credit_Memo": 2, "Currency_Amount": 1680, "Currency_Code": "MXN", "Customer_Inventory_Customer_Reference_Nos": "", "Customer_Inventory_Usage_Nos": "", "Customer_No": 139287, "Description": "77111-SWA-STAY, JOINT DR- - 77111-SWA Stay Door Joint - STAY, JOINT DR - 480.000 @ 3.50", "Expense_Project_Code": null, "Expense_Project_Key": null, "Group_With": null, "Item_Tax_Code": null, "Item_Tax_Key": null, "Line_Item_No": 19068564, "Part_Key": 1010520, "Price_Element_Key": null, "Quantity": 480, "Quantity_Decimal_Places": 2, "Reference_Key": 7411472, "Reference_Key_Header": 2592230, "Reference_No": "", "Ship_To_Address": 1312030, "Tax": false, "Tax_Code": "", "Tax_Code_No": "", "Tax_Rate": null, "Taxable_Amount": 0, "Unit_Price": 3.5, "Unit_Price_Decimal_Places": 1, "Voucher_Description": "" } ] }
CSS
<meta name="viewport" con body { font-family: 'Helvetica Neue', 'Helvetica', Arial, sans-serif; margin: 0; padding: 10px; color: #333; background-color: #f4f4f9; } .invoice-container { max-width: 800px; margin: auto; background: #fff; padding: 30px; box-shadow: 0 0 7px rgba(0, 0, 0, 0.1); border-radius: 8px; } .header, .footer { display: flex; justify-content: space-between; align-items: center; padding-bottom: 10px; border-bottom: 2px solid #eee; } .header h1 { color: #4454db; margin: 0; font-size: 28px; } .company-info { text-align: right; font-size: 14px; } .company-info p { margin: 2px 0; } .addresses { display: flex; justify-content: space-between; margin-top: 30px; } .bill-to, .ship-to { width: 48%; border: 1px solid #ddd; padding: 7px; border-radius: 6px; } .addresses h3 { margin-top: 0; margin-bottom: 10px; color: #004d99; font-size: 16px; } .addresses p { margin: 2px 0; font-size: 14px; white-space: pre-line; } .invoice-details { display: flex; justify-content: space-between; margin-top: 30px; padding-bottom: 10px; border-bottom: 2px solid #eee; } .invoice-details-left, .invoice-details-right { width: 48%; } .invoice-details p { margin: 5px 0; font-size: 14px; } .invoice-details .label { font-weight: bold; color: #555; display: inline-block; width: 110px; } .items-table { width: 100%; border-collapse: collapse; margin-top: 30px; } .items-table th, .items-table td { text-align: left; padding: 12px; border-bottom: 1px solid #ddd; } .items-table th { background-color: #f9f9f9; font-weight: bold; color: #555; text-transform: uppercase; font-size: 12px; } .items-table td { font-size: 14px; } .items-table tr:last-child td { border-bottom: none; } .totals { margin-top: 30px; text-align: right; } .total-row { display: flex; justify-content: flex-end; margin-top: 10px; font-size: 16px; } .total-label { font-weight: bold; width: 150px; text-align: left; } .total-amount { width: 100px; text-align: right; } .footer { margin-top: 50px; text-align: center; color: #888; font-size: 12px; }
HTML
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" />tent="width=device-width, initial-scale=1.0" /> <title>Customer Invoice</title> </head> <body> <div class="invoice-container"> <div class="header"> <h1>INVOICE</h1> <div class="company-info"> <p><strong>DataMagik</strong></p> <p>123 Main Street</p> <p>Anytown, USA 12345</p> <p>Phone: (555) 123-4567</p> </div> </div> <div class="addresses"> <div class="bill-to"> <h3>BILL TO</h3> <p> <strong>{{.Header.Bill_Code}}</strong> </p> <p>{{.Header.Address}}</p> <p>{{.Header.City}}, {{.Header.State}} {{.Header.Zip}}</p> <p>{{.Header.Country}}</p> </div> <div class="ship-to"> <h3>SHIP TO</h3> <p><strong>{{.Header.Ship_Name}}</strong></p> <p>{{.Header.Ship_Address}}</p> <p>{{.Header.Ship_City}}, {{.Header.Ship_State}} {{.Header.Ship_Zip}}</p> <p>{{.Header.Ship_Country}}</p> </div> </div> <div class="invoice-details"> <div class="invoice-details-left"> <p><span class="label">Invoice No:</span> {{.Header.Invoice_No}}</p> {{code128 .Header.Invoice_No 200 20}} <p> <span class="label">Customer PO:</span> {{.Header.Customer_PO_No}} </p> {{code128 .Header.Customer_PO_No 200 20}} <p><span class="label">Reference No:</span> {{.Header.Reference_No}}</p> <p><span class="label">Terms:</span>{{.Header.Terms}}</p> </div> <div class="invoice-details-right"> <p><span class="label">Invoice Date:</span>{{dateFormat .Header.Invoice_Date "01/02/2006"}}</p> <p><span class="label">Due Date:</span>{{dateFormat .Header.Due_Date "01/02/2006"}}</p> <p><span class="label">Currency:</span>{{.Header.Currency_Code}}</p> </div> </div> <table class="items-table"> <thead> <tr> <th>Item Description</th> <th>Quantity</th> <th>Unit Price</th> <th>Amount</th> </tr> </thead> <tbody> {{range .Lines}} <tr> <td>{{.Description}}</td> <td>{{.Quantity}}</td> <td>{{ printf "%.2f" .Unit_Price}}</span> </td> <td>{{printf "%.2f" .Currency_Amount}}</td> </tr> {{end}} </tbody> </table> <div class="totals"> <div class="total-row"> <span class="total-label">Subtotal:</span> <span class="total-amount"> {{ printf "%.2f" .Header.Currency_Amount }} {{.Header.Currency_Code}} </span> </div> <div class="total-row"> <span class="total-label">Total:</span> <span class="total-amount">{{ printf "%.2f" .Header.Currency_Amount }} {{.Header.Currency_Code}}</span> </div> <div class="total-row"> <span class="total-label">Balance Due:</span> <span class="total-amount">{{ printf "%.2f" .Header.Currency_Amount }} {{.Header.Currency_Code}}</span> </div> </div> <div class="footer"> <p>Thank you for your business!</p> </div> </div> </body> </html>