Default Statement Template - 3(Document)
Header
<div style="margin: 10px 30px; padding-top: 50px">
<div class="header" style=" border-bottom: thin dashed #e0e0e0;">
<table style="margin-bottom:1rem; width:100%">
<tbody>
<tr>
<td style="width:60%">
<table>
<tbody>
<tr>
<td style="font-size:1.8rem; font-weight:bold; padding:24px 8px">STATEMENT</td>
</tr>
</tbody>
</table>
<table style="width:100%">
<tbody>
<tr>
<td style="padding:0px 8px"><strong>Thank you for choosing {{ business.name }} </strong><br />
{{ business.physicaladdress.addresstext|raw }} {{ business.phonenumber }} • {{ business.emailaddress }}</td>
</tr>
<tr>
<td style="padding:8px 8px">Please find listed below your account statement for {{ debtorcontact.thisMonthName }}. Overdue amounts will attract an interest rate charge of {{ debtorcontact.chargeableInterestRate|round }}% per annum calculated daily and charged monthly.</td>
</tr>
</tbody>
</table>
</td>
<td style="text-align:right; width:30%"><span>Printed {{ datetime.TodaysDate }}</span><img alt="43" src="{{ templatesettings.logoLocation }}" style="width:30%" /></td>
</tr>
</tbody>
</table>
<table style="margin-bottom:1rem; margin-left:5px; width:100%">
<tbody>
<tr>
<td style="padding:0px 8px">{{ debtorcontact.name }}</td>
<td style="padding:0px 8px"></td>
</tr>
<tr>
<td style="padding:0px 8px">{{ debtorcontact.PhysicalAddressText(true)|raw}}</td>
<td style="vertical-align: bottom; text-align: right; padding:0px 8px">
Statement of account from {{ debtorcontact.startDate }} to {{ debtorcontact.endDate }}<br />
<strong>Current balance: </strong>{{ debtorcontact.thisMonthBalance|moneyformat }}</td>
</tr>
<tr>
<td style="padding:0px 8px"></td>
<td style="padding:0px 8px"></td>
</tr>
</tbody>
</table>
</div>
</div>Body
<style>
th {
font-size: 12px;
}
{% if isDetailed %}
.dark {
background-color: #f1f1f1;
}
.light {
background-color: #fFFFFF;
}
{% else %}
table.transactions tr:nth-child(even) {
background-color: #f1f1f1;
}
{% endif %}
.first-td {
padding-left: 12px;
}
.last-td {
padding-right: 12px;
}
tr.statementline td {
font-size: 12px;
padding-top: 10px;
padding-bottom: 10px;
}
td.subline {
color: #555555;
font-style: italic;
}
.detailed td {
padding: 4px 2px;
}
</style>
<div style="margin:0 20px;">
<table class="transactions">
<thead>
{% if not byAnimal %}
<tr style="background-color:#DDDDDD;">
<th class="first-td" style="text-align:left; width:110px; padding: 12px;">
Date
</th>
<th style="text-align:left; width:120px;">
Ref. No.
</th>
<th style="text-align:left; width:120px;">
Cust. Ref.
</th>
<th style="text-align:left; width:150px;">
Transaction Type
</th>
<th style="text-align:left; width:100px;">
{{ settings.referToAnimals }}
</th>
<th style="text-align:right; width:80px; ">
Charges
</th>
<th style="text-align:right; width:110px;">
Payments
</th>
<th class="last-td" style="text-align:right; width:100px;">
Balance
</th>
</tr>
{% endif %}
</thead>
<tbody>
<tr class="summary">
<td class="first-td" style="padding-top: 10px; padding-bottom: 10px;" colspan="3">
<div style="font-size: 13px; ">
{{ debtorcontact.startDate }}
</div>
</td>
<td style="padding-top: 10px; padding-bottom: 8px;" colspan="4">
<div style="font-size: 13px;">
Opening Balance
</div>
</td>
<td class="last-td" style="padding-top: 10px; padding-bottom: 8px;" align="right">
<div style="text-align:right; font-size: 13px;">
{{ statement.initialBalance|moneyformat }}
</div>
</td>
</tr>
{% for line in statement.lines %}
{% if byAnimal and line.animalHeader is not empty %}
<tr>
<td class="first-td" style="font-size: 13px; padding-top: 8px; padding-bottom: 8px;" colspan="8">
<span>
{% if line.animalHeader.animalName == 'Other Invoices' %}
<strong>Other Invoices:</strong>
{% elseif line.animalHeader.animalName == 'Payments' %}
<strong>Payments:</strong>
{% else %}
<strong>{{ settings.referToAnimals }}: </strong>{{ line.animalHeader.animalName }}
{% endif %}
</span>
<span>{{ line.animalHeader.animalLocation }}</span>
<span>{{ line.animalHeader.animalSyndicateMsg }}</span>
</td>
</tr>
<tr style="background-color:#FFFFFF;">
<th class="first-td" style="text-align:left; width:110px; padding: 12px;">
Date
</th>
<th style="text-align:left; width:120px;">
Ref. No.
</th>
<th style="text-align:left; width:120px;">
Cust. Ref.
</th>
<th style="text-align:left; width:150px;">
Transaction Type
</th>
<th style="text-align:left; width:100px;">
{{ settings.referToAnimals }}
</th>
<th style="text-align:right; width:80px; ">
Charges
</th>
<th style="text-align:right; width:110px;">
Payments
</th>
<th class="last-td" style="text-align:right; width:100px;">
Balance
</th>
</tr>
{% endif %}
{% set bg = cycle(['dark', 'light'], loop.index0) %}
{% if line.isInvoice and isDetailed %}
<tr class="summary statementline {{bg}}" >
<td style="padding:0px; margin:0px;" colspan="8">
<table style="width:100%; padding: 0px; margin:0px;">
<tr style="padding: 0px; margin:0px;">
<td class="first-td" style="border-left: 2px solid #555; width: 110px; padding-right:0px; ">
{# replace with |dateformat('/') to have the date seperated by slashes #}
{{ line.date|dateformat }}
</td>
<td style="width: 120px; text-align: left;">
{{ line.ownerNumber }}
</td>
<td style="width: 120px; ">
{{ line.invoice.customerReference }}
</td>
<td style="width: 150px;">
{{ line.transType }}
</td>
<td style="width: 100px;">
{% if not byAnimal %}
{{ line.owner.animal.name }}
{% endif %}
</td>
<td style="text-align:right; width: 80px;">
{% if line.type == 'invoice' %}
{{ line.amount|moneyformat }}
{% endif %}
</td>
<td style="text-align:right; width:110px;">
{% if line.type == 'payment' %}
{{ (-1 * line.amount)|moneyformat }}
{% endif %}
</td>
<td class="last-td" style="text-align:right; width: 100px;">
{% if not byAnimal %}
{{ (statement.initialBalance+line.balanceAt)|moneyformat }}
{% endif %}
</td>
</tr>
</table>
<table style="width:100%; padding: 0px; margin:0px;">
<tr class="detailed">
<td class="first-td"
style="width: 10%; text-align: center; border-left: 2px solid #555; font-weight:bold; color:#555; font-size: 12px; padding-top: 5px; padding-bottom: 5px;">
Quantity
</td>
<td style="width: 25%; font-weight:bold; color:#555; font-size: 12px; padding-top: 5px; padding-bottom: 5px;"
colspan="2">
Description
</td>
<td style="width: 10%; font-weight:bold; color:#555; font-size: 12px; padding-top: 5px; padding-bottom: 5px;">
{% if showDiscount %}
Discount
{% endif %}
</td>
<td style="width: 20%; font-weight:bold; color:#555; font-size: 12px; padding-top: 5px; padding-bottom: 5px;">
{% if showSalesPerson %}
Staff Member
{% endif %}
</td>
<td style="width: 20%; text-align:left; font-weight:bold; color:#555; font-size: 12px; padding-top: 5px; padding-bottom: 5px;"
colspan="2">
Department
</td>
<td class="last-td"
style="width: 15%; text-align:right; font-weight:bold; color:#555; font-size: 12px; padding-top: 5px; padding-bottom: 5px;">
Total
</td>
</tr>
{% for item in line.invoice.lineItems %}
{% if item.isHeaderLine and not item.hasHeaderLine %}
<tr class="detailed">
<td class="first-td"
style="border-left: 2px solid #555; color:#5E5E5E; font-size: 12px; text-align: center;">
{{ item.qty }}
</td>
<td colspan="2" style="color:#5E5E5E; font-size: 12px;" colspan="2">
{{ item.productName }}
</td>
<td style="color:#5E5E5E; font-size: 12px;">
{% if showDiscount %}
{{ item.invoice.hasDiscounts ? item.totalDiscount(item.invoice.includesTax)|moneyformat : '' }}
{% endif %}
</td>
<td style="color:#5E5E5E; font-size: 12px;">
{% if showSalesPerson %}
{{ item.salesPerson.name }}
{% endif %}
</td>
<td colspan="2" style="color:#5E5E5E; font-size: 12px;">
{{ item.ownershipSeparationName }}
</td>
<td class="last-td" style="text-align:right; color:#5E5E5E; font-size: 12px;">
{{ item.total(item.invoice.includesTax)|moneyformat }}
</td>
</tr>
{% if item.printContained %}
{% for subitem in item.nestedLines %}
{% if subitem.isHeaderLine %}
<tr class="detailed">
<td class="first-td subline"
style=" text-align: center; border-left: 2px solid #555; color:#5E5E5E; font-size: 11px;">
{{ subitem.qty }}
</td>
<td class="subline" style="color:#5E5E5E; font-size: 11px;"
colspan="2">
{{ subitem.productName }}
</td>
<td style="color:#5E5E5E; font-size: 11px;">
{% if showDiscount %}
{{ subitem.invoice.hasDiscounts ? subitem.totalDiscount(subitem.invoice.includesTax)|moneyformat : '' }}
{% endif %}
</td>
<td style="color:#5E5E5E; font-size: 11px;">
{% if showSalesPerson %}
{{ subitem.salesPerson.name }}
{% endif %}
</td>
<td colspan="2" style="color:#5E5E5E; font-size: 11px;">
{{ subitem.ownershipSeparationName }}
</td>
<td class="last-td"
style="text-align:right; color:#5E5E5E; font-size: 11px;">
{% if item.printContainedPrices %}
{{ subitem.total(subitem.invoice.includesTax)|moneyformat }}
{% endif %}
</td>
</tr>
{% if subitem.printContained %}
{% for subsubitem in subitem.nestedLines %}
{% if subsubitem.isHeaderLine %}
<tr class="detailed">
<td class="first-td subline"
style=" text-align: center; border-left: 2px solid #555; color:#5E5E5E; font-size: 9px;">
{{ subsubitem.qty }}
</td>
<td class="subline" style="color:#5E5E5E; font-size: 9px;"
colspan="2">
{{ subsubitem.productName }}
</td>
<td style="color:#5E5E5E; font-size: 9px;">
{% if showDiscount %}
{{ subsubitem.invoice.hasDiscounts ? subsubitem.totalDiscount(subsubitem.invoice.includesTax)|moneyformat : '' }}
{% endif %}
</td>
<td style="color:#5E5E5E; font-size: 9px;">
{% if showSalesPerson %}
{{ subsubitem.salesPerson.name }}
{% endif %}
</td>
<td colspan="2" style="color:#5E5E5E; font-size: 9px;">
{{ subsubitem.ownershipSeparationName }}
</td>
<td class="last-td"
style="text-align:right; color:#5E5E5E; font-size: 9px;">
{% if subitem.printContainedPrices %}
{{ subsubitem.total(subsubitem.invoice.includesTax)|moneyformat }}
{% endif %}
</td>
</tr>
{% if subsubitem.printContained %}
{% for subsubsubitem in subsubitem.nestedLines %}
<tr class="detailed">
<td class="first-td subline"
style="text-align: center; border-left: 2px solid #555; color:#5E5E5E; font-size: 8px;">
{{ subsubsubitem.qty }}
</td>
<td class="subline" style="color:#5E5E5E; font-size: 8px;" colspan="2">
{{ subsubsubitem.productName }}
</td>
<td style="color:#5E5E5E; font-size: 8px;">
{% if showDiscount %}
{{ subsubsubitem.invoice.hasDiscounts ? subsubsubitem.totalDiscount(subsubsubitem.invoice.includesTax)|moneyformat : '' }}
{% endif %}
</td>
<td style="color:#5E5E5E; font-size: 8px;">
{% if showSalesPerson %}
{{ subsubsubitem.salesPerson.name }}
{% endif %}
</td>
<td colspan="2" style="color:#5E5E5E; font-size: 8px;">
{{ subsubsubitem.ownershipSeparationName }}
</td>
<td class="last-td"
style="text-align:right; color:#5E5E5E; font-size: 8px;">
{% if subsubitem.printContainedPrices %}
{{ subsubsubitem.total(subsubsubitem.invoice.includesTax)|moneyformat }}
{% endif %}
</td>
</tr>
{% endfor %}
{% endif %}
{% else %}
<tr class="detailed">
<td class="first-td subline"
style="text-align: center; border-left: 2px solid #555; color:#5E5E5E; font-size: 9px;">
{{ subsubitem.qty }}
</td>
<td class="subline" style="color:#5E5E5E; font-size: 9px;" colspan="2">
{{ subsubitem.productName }}
</td>
<td style="color:#5E5E5E; font-size: 9px;">
{% if showDiscount %}
{{ subsubitem.invoice.hasDiscounts ? subsubitem.totalDiscount(subsubitem.invoice.includesTax)|moneyformat : '' }}
{% endif %}
</td>
<td style="color:#5E5E5E; font-size: 9px;">
{% if showSalesPerson %}
{{ subsubitem.salesPerson.name }}
{% endif %}
</td>
<td colspan="2" style="color:#5E5E5E; font-size: 9px;">
{{ subsubitem.ownershipSeparationName }}
</td>
<td class="last-td"
style="text-align:right; color:#5E5E5E; font-size: 9px;">
{% if subitem.printContainedPrices %}
{{ subsubitem.total(subsubitem.invoice.includesTax)|moneyformat }}
{% endif %}
</td>
</tr>
{% endif %}
{% endfor %}
{% endif %}
{% else %}
<tr class="detailed">
<td class="first-td subline"
style="text-align: center; border-left: 2px solid #555; color:#5E5E5E; font-size: 11px;">
{{ subitem.qty }}
</td>
<td class="subline" style="color:#5E5E5E; font-size: 11px;" colspan="2">
{{ subitem.productName }}
</td>
<td style="color:#5E5E5E; font-size: 11px;">
{% if showDiscount %}
{{ subitem.invoice.hasDiscounts ? subitem.totalDiscount(subitem.invoice.includesTax)|moneyformat : '' }}
{% endif %}
</td>
<td style="color:#5E5E5E; font-size: 11px;">
{% if showSalesPerson %}
{{ subitem.salesPerson.name }}
{% endif %}
</td>
<td colspan="2" style="color:#5E5E5E; font-size: 11px;">
{{ subitem.ownershipSeparationName }}
</td>
<td class="last-td"
style="text-align:right; color:#5E5E5E; font-size: 11px;">
{% if item.printContainedPrices %}
{{ subitem.total(subitem.invoice.includesTax)|moneyformat }}
{% endif %}
</td>
</tr>
{% endif %}
{% endfor %}
{% endif %}
{% elseif not item.hasHeaderLine %}
<tr class="detailed">
<td class="first-td"
style="border-left: 2px solid #555; color:#5E5E5E; font-size: 12px; text-align: center;">
{{ item.qty }}
</td>
<td style="color:#5E5E5E; font-size: 12px;" colspan="2">
{{ item.productName }}
</td>
<td style="color:#5E5E5E; font-size: 12px;">
{% if showDiscount %}
{{ item.invoice.hasDiscounts ? item.totalDiscount(item.invoice.includesTax)|moneyformat : '' }}
{% endif %}
</td>
<td style="color:#5E5E5E; font-size: 12px;">
{% if showSalesPerson %}
{{ item.salesPerson.name }}
{% endif %}
</td>
<td style="color:#5E5E5E; font-size: 12px; color:#5E5E5E;" colspan="2">
{{ item.ownershipSeparationName }}
</td>
<td class="last-td" style="text-align:right; color:#5E5E5E; font-size: 12px;">
{{ item.total(item.invoice.includesTax)|moneyformat }}
</td>
</tr>
{% endif %}
{% endfor %}
<tr class="detailed">
<td style="border-left: 2px solid #555; border-top: 1px dashed #555; color: #555; padding-top: 10px; padding-bottom: 10px; text-align: right;"
colspan="6">
<strong>Total excluding {{ financial.taxName }}:</strong>
{{ (line.invoice.total - line.invoice.gst)|moneyformat }}
</td>
<td style="text-align: right; border-top: 1px dashed #555; color: #555; padding-top: 10px; padding-bottom: 10px;"
colspan="1">
<strong>{{ financial.taxName }}:</strong> {{ line.invoice.gst|moneyformat }}
</td>
<td class="last-td"
style="text-align: right; border-top: 1px dashed #555; color: #555; padding-top: 10px; padding-bottom: 10px;"
colspan="1">
<strong>Total:</strong> {{ (line.invoice.total)|moneyformat }}
</td>
</tr>
{% if line.invoice.getComments %}
<tr class="detailed">
<td class="first-td" style="border-left: 2px solid #555; color:#555; padding-top: 10px; padding-bottom: 10px;" colspan="8">
<i>Comments: {{ line.invoice.getComments }}</i>
</td>
</tr>
{% endif %}
</table>
</td>
</tr>
{% else %}
<tr class="summary statementline {{bg}}">
<td class="first-td" style="font-size: 13px; width: 110px; padding-top: 5px;">
{# replace with |dateformat('/') to have the date seperated by slashes #}
{{ line.date|dateformat }}
</td>
<td style="font-size: 13px; padding-top: 5px; width: 120px; ">
{{ line.ownerNumber }}
</td>
<td style="font-size: 13px; padding-top: 5px; width: 120px; ">
{{ line.invoice.customerReference }}
</td>
<td style="font-size: 13px; padding-top: 5px; width: 140px; ">
{{ line.transType }}
</td>
<td style="font-size: 13px; padding-top: 5px; ">
{% if not byAnimal %}
{{ line.owner.animal.name }}
{% endif %}
</td>
<td style="text-align:right; font-size: 13px; padding-top: 5px; width: 80px; ">
{% if line.type == 'invoice' %}
{{ line.amount|moneyformat }}
{% endif %}
</td>
<td style="text-align:right; font-size: 13px; padding-top: 5px; width: 110px; ">
{% if line.type == 'payment' %}
{{ (-1 * line.amount)|moneyformat }}
{% endif %}
</td>
<td class="last-td" style="text-align:right; font-size: 13px; padding-top: 5px; width: 100px; ">
{% if not byAnimal %}
{{ (statement.initialBalance+line.balanceAt)|moneyformat }}
{% endif %}
</td>
</tr>
{% endif %}
{% if showAnimalSubtotal and line.animalDetails is not empty %}
{% if line.isInvoice %}
<tr style="border-top: 1px; border-style: solid; border-color: #555; background-color: #FFFFFF;">
<td class="first-td" colspan="5">
</td>
<td style="padding-top: 10px; padding-bottom: 4px;" colspan="2">
<strong>Subtotal Exc {{ taxName }} (<i>{{ line.animalDetails.animalName }}</i>):</strong>
</td>
<td class="last-td" style="text-align:right; padding-top: 4px; padding-bottom: 4px;">
{{ (line.animalDetails.animalBalance - line.animalDetails.animalBalanceGst)|moneyformat }}
</td>
</tr>
<tr style="background-color: #FFFFFF;">
<td class="first-td" colspan="5">
</td>
<td style="padding-top: 4px; padding-bottom: 4px;" colspan="2">
<strong>{{ taxName }}:</strong>
</td>
<td class="last-td" style="text-align:right; padding-top: 4px; padding-bottom: 4px;">
{{ line.animalDetails.animalBalanceGst|moneyformat }}
</td>
</tr>
{% endif %}
<tr style="background-color: #FFFFFF;"><!--last total-->
<td class="first-td" colspan="5">
</td>
<td style="padding-top: 4px; padding-bottom: 4px;" colspan="2">
<strong>Total <i>{{ line.animalDetails.animalName }}</i>:</strong>
</td>
<td class="last-td" style="text-align:right; padding-top: 4px; padding-bottom: 4px;">
{{ line.animalDetails.animalBalance|moneyformat }}
</td>
</tr>
{% endif %}
{% endfor %}
{% if not byAnimal %}
<tr class="summary statementline" style="background-color:#DDDDDD;">
<td class="first-td" style="font-size: 12px;" colspan="2">
<strong>Date: </strong>{{ debtorcontact.endDate }}
</td>
<td style="font-size: 12px; " colspan="2">
<strong>Total balance excluding {{ financial.taxName }}
: </strong>{{ (statement.finalBalance-statement.totalTax)|moneyformat }}
</td>
<td style="font-size: 12px;" colspan="2">
<strong>{{ financial.taxName }}: </strong>{{ statement.totalTax|moneyformat }}
</td>
<td class="last-td" style="text-align:right; font-size: 12px;" colspan="2">
<strong>Total Balance: </strong>{{ statement.finalBalance|moneyformat }}
</td>
</tr>
{% endif %}
</tbody>
</table>
</div>