Default Invoice Template - 6(Document)
Header
<div style="margin:30px; padding-top: 50px">
<table align="left" border="0" style="width: 100%;">
<tbody>
<tr>
<td style="width: 373px;" valign="top">
<h2>
<span style="font-size:24px;">
<strong>INVOICE</strong>
</span>
</h2>
<pre><span style="font-size:16px;">#{{ invoice.number }}</span></pre>
<br/>
<br/>
<strong>Invoice date:</strong><br/>
{{ invoice.date|date("jS F Y") }}<br/>
<table border="0" cellpadding="1" cellspacing="1" style="width: 100%;">
<tbody>
<tr>
<td style="width: 50%;">
<strong>Customer name:</strong><br/>
{{ invoice.clientContact.name }}
</td>
<td style="width: 50%;">
<strong>Customer number:</strong><br/>
{{ invoice.clientContact.number }}</td>
</tr>
</tbody>
</table>
<br/>
<strong>Customer address:</strong><br/>
{{ invoice.clientContact.PostalAddress.addressText|raw }}<br/>
<table border="0" cellpadding="1" cellspacing="1" style="width: 100%;">
<tbody>
<tr>
<td style="width: 50%;">
<strong>Animal name:</strong><br/>
{{ invoice.animal.name }}
</td>
<td style="width: 50%;">
<strong>Animal DOB:</strong><br/>
{{ invoice.animal.dateOfBirth|date("jS F Y") }}
</td>
</tr>
</tbody>
</table>
</td>
<td style="width: 369px;" valign="bottom">
<div style="text-align: right;"><img src="{{ templatesettings.logoLocation }}"/></div>
<p><br/>
<br/>
<strong>From:</strong><br/>
{{ business.name }}<br/>
{{ business.postalAddress.addressText|raw }}<br/>
</p>
<table border="0" cellpadding="1" cellspacing="1" style="width: 100%;">
<tbody>
<tr>
<td style="width: 33%;">
<strong>Phone:</strong><br/>
{{ business.phoneNumber }}</td>
<td style="width: 33%;">
<strong>Fax:</strong><br/>
{{ business.faxNumber }}</td>
<td style="width: 33%;">
<strong>Email:</strong><br/>
{{ business.businessEmail }}</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>Body
<div style="margin: 30px;">
<table style="width: 968px;">
<thead>
<tr style="background-color: #00BFA5;">
<td style="text-align: left; float: left; width: 205px; height: 40px; color:#000000; padding-left: 10px">
<span style="font-size:14px;">
<b>Description</b>
</span>
</td>
<td style="text-align: left; float: left; width: 130px;color:#000000;">
<span style="font-size:14px;">
<b>Staff Member</b>
</span>
</td>
<td style="text-align: left; float: left; width: 65px;color:#000000;">
<span style="font-size:14px;">
<b>Qty</b>
</span>
</td>
{% if invoice.hasDiscounts %}
<td style="text-align: left; float: left; width: 80px;color:#000000;">
<span style="font-size:14px;">
<b>Price</b>
</span>
</td>
<td style="text-align: left; float: left; width: 80px;color:#000000;">
<span style="font-size:14px;">
<b>Discount</b>
</span>
</td>
<td style="text-align: left; float: left; width: 80px;color:#000000;">
<span style="font-size:14px;">
<b>Discount (%)</b>
</span>
</td>
{% endif %}
<td style="text-align: right; float: left; width: 100px; color: rgb(0, 0, 0); padding-right: 10px;">
<span style="font-size:14px;">
<b>Total</b>
</span>
</td>
</tr>
</thead>
<tbody>
{% for invoiceline in invoice.lineItems %}
{% if invoiceline.isHeaderLine and not invoiceline.hasHeaderLine %}
<tr>
<td>{{ invoiceline.product.name }}</td>
<td>{{ invoiceline.salesPerson.name }}</td>
<td>{{ invoiceline.quantity }}</td>
{% if invoice.hasDiscounts %}
<td>{{ invoiceline.totalBeforeDiscount(true)|moneyformat }}</td>
{% if invoiceline.totalDiscount(true) > 0 %}
<td>{{ invoiceline.totalDiscount(true)|moneyformat }}</td>
<td>{{ invoiceline.totalDiscountPercent|round(2) }}%</td>
{% else %}
<td></td>
<td></td>
{% endif %}
{% endif %}
<td style=" text-align: right; width: 223px;">{{ invoiceline.total(true)|moneyformat }}</td>
</tr>
{% if invoiceline.printContained %}
{% for subinvoiceline in invoiceline.nestedLines %}
<tr>
<td style="font-style: italic; color:#555;"> {{ subinvoiceline.product.name }}</td>
<td style="font-style: italic; color:#555;">{{ subinvoiceline.salesPerson.name }}</td>
<td style="font-style: italic; color:#555;">{{ subinvoiceline.quantity }}</td>
{% if invoiceline.printContainedPrices %}
{% if invoice.hasDiscounts %}
<td style="font-style: italic; color:#555;">{{ subinvoiceline.totalBeforeDiscount(true)|moneyformat }}</td>
{% if subinvoiceline.totalDiscount(true) > 0 %}
<td style="font-style: italic; color:#555;">{{ subinvoiceline.totalDiscount(true)|moneyformat }}</td>
<td style="font-style: italic; color:#555;">{{ subinvoiceline.totalDiscountPercent|round(2) }}%</td>
{% else %}
<td style="font-style: italic; color:#555;"></td>
<td style="font-style: italic; color:#555;"></td>
{% endif %}
{% endif %}
{% endif %}
<td style="text-align:right;font-style: italic; color:#555;">
{% if invoiceline.printContainedPrices %}
{{ subinvoiceline.total(true)|moneyformat }}
{% endif %}
</td>
</tr>
{% if subinvoiceline.isHeaderline %}
{% if subinvoiceline.printContained %}
{% for subsubinvoiceline in subinvoiceline.nestedLines %}
<tr>
<td style="font-style: italic; color:#555;"> {{ subsubinvoiceline.product.name }}</td>
<td style="font-style: italic; color:#555;">{{ subsubinvoiceline.salesPerson.name }}</td>
<td style="font-style: italic; color:#555;">{{ subsubinvoiceline.quantity }}</td>
{% if subinvoiceline.printContainedPrices %}
{% if invoice.hasDiscounts %}
<td style="font-style: italic; color:#555;">{{ subsubinvoiceline.totalBeforeDiscount(true)|moneyformat }}</td>
{% if subsubinvoiceline.totalDiscount(true) > 0 %}
<td style="font-style: italic; color:#555;">{{ subsubinvoiceline.totalDiscount(true)|moneyformat }}</td>
<td style="font-style: italic; color:#555;">{{ subsubinvoiceline.totalDiscountPercent|round(2) }}%</td>
{% else %}
<td style="font-style: italic; color:#555;"></td>
<td style="font-style: italic; color:#555;"></td>
{% endif %}
{% endif %}
{% endif %}
<td style="text-align:right;font-style: italic; color:#555;">
{% if subinvoiceline.printContainedPrices %}
{{ subsubinvoiceline.total(true)|moneyformat }}
{% endif %}
</td>
</tr>
{% if subsubinvoiceline.isHeaderline %}
{% if subsubinvoiceline.printContained %}
{% for subsubsubinvoiceline in subsubinvoiceline.nestedLines %}
<tr>
<td style="font-style: italic; color:#555;"> {{ subsubsubinvoiceline.product.name }}</td>
<td style="font-style: italic; color:#555;">{{ subsubsubinvoiceline.salesPerson.name }}</td>
<td style="font-style: italic; color:#555;">{{ subsubsubinvoiceline.quantity }}</td>
{% if subsubinvoiceline.printContainedPrices %}
{% if invoice.hasDiscounts %}
<td style="font-style: italic; color:#555;">{{ subsubsubinvoiceline.totalBeforeDiscount(true)|moneyformat }}</td>
{% if subsubsubinvoiceline.totalDiscount(true) > 0 %}
<td style="font-style: italic; color:#555;">{{ subsubsubinvoiceline.totalDiscount(true)|moneyformat }}</td>
<td style="font-style: italic; color:#555;">{{ subsubsubinvoiceline.totalDiscountPercent|round(2) }}%</td>
{% else %}
<td style="font-style: italic; color:#555;"></td>
<td style="font-style: italic; color:#555;"></td>
{% endif %}
{% endif %}
{% endif %}
<td style="text-align:right;font-style: italic; color:#555;">
{% if subsubinvoiceline.printContainedPrices %}
{{ subsubsubinvoiceline.total(true)|moneyformat }}
{% endif %}
</td>
</tr>
{% endfor %}
{% endif %}
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% endfor %}
{% endif %}
{% elseif not invoiceline.hasHeaderLine %}
<tr>
<td>{{ invoiceline.product.name }}</td>
<td>{{ invoiceline.salesPerson.name }}</td>
<td>{{ invoiceline.quantity }}</td>
{% if invoice.hasDiscounts %}
<td>{{ invoiceline.totalBeforeDiscount(true)|moneyformat }}</td>
{% if invoiceline.totalDiscount(true) > 0 %}
<td>{{ invoiceline.totalDiscount(true)|moneyformat }}</td>
<td>{{ invoiceline.totalDiscountPercent|round(2) }}%</td>
{% else %}
<td></td>
<td></td>
{% endif %}
{% endif %}
<td style="text-align:right;">{{ invoiceline.total(true)|moneyformat }}</td>
</tr>
{% endif %}
{% endfor %}
</tbody>
</table>
<div><br/>
</div>
<table cellpadding="5" cellspacing="5" style="margin-left: auto; width: 200px; background-color: #F5F5F5;">
<tbody>
<tr>
<td style="width: 105px; padding: 30px 5px 5px 15px;">Total:</td>
<td style="width: 68px; text-align: right; padding: 30px 15px 5px 5px;">
<strong>{{ invoice.total|moneyformat }}</strong>
</td>
</tr>
<tr>
<td style="width: 105px; padding-left: 15px;">Subtotal:</td>
<td style="width: 68px; text-align: right; padding-right: 15px;">
<strong>{{ invoice.subTotal|moneyformat }}</strong>
</td>
</tr>
{% if invoice.includesTax %}
<tr>
<td style="width: 105px; padding-left: 15px;">Including tax:</td>
<td style="width: 68px; text-align: right; padding-right: 15px;">
<strong>{{ invoice.total|moneyformat }}</strong>
</td>
</tr>
{% endif %}
{% if invoice.hasDiscounts %}
<tr>
<td style="width: 105px; padding-left: 15px;">Discount:</td>
<td style="width: 68px; text-align: right; padding-right: 15px;">
<strong>{{ invoice.totalDiscountAmountIncTax|moneyformat }}</strong>
</td>
</tr>
{% endif %}
{% if invoice.paymentMethods %}
<tr>
<td style="width: 105px; padding-left: 15px;">Payment method:</td>
<td style="width: 68px; text-align: right; padding-right: 15px;">
<strong>{{ invoice.paymentMethods }}</strong>
</td>
</tr>
{% endif %}
<tr>
<td style="width: 105px; padding-left: 15px;">Amount paid:</td>
<td style="width: 68px; text-align: right; padding-right: 15px;">
<strong>{{ invoice.paid|moneyformat }}</strong>
</td>
</tr>
<tr>
{% set balance = invoice.total - invoice.paid %}
<td style="width: 105px; padding-left: 15px; padding-bottom: 30px;">Balance:</td>
<td style="width: 68px; text-align: right; padding-right: 15px; padding-bottom: 30px;">
<strong>{{ balance|moneyformat }}</strong>
</td>
</tr>
</tbody>
</table>
</div>