<style type="text/css">
{% include 'css_document' %}
</style>
<h1 id="doc_title" class="left_aligned">
{{ account.company.name }}
</h1>
<div id="company_info" class="right_aligned">
<p>
{% include 'company' for account.company %}
</p>
</div>
<div class="clear"></div>
{{ # DETAILS }}
<div class="document_details">
{{ # LEFT DETAILS }}
<div class="left_aligned">
<table class="formContent">
<tr>
<td class="bigger">{{ 'Invoice ID' | make_label }}</td>
<td style="padding-right:10px;" class="bigger">
{{ invoice.id }}
</td>
</tr>
<tr>
<td style="vertical-align:top;">{{ 'Client' | make_label }}</td>
<td>
{% include 'client' for invoice.client %}
</td>
</tr>
{% if invoice.project_count > 0 %}
<tr>
<td>{{ invoice.project_count | pluralize: 'Project' | make_label }}</td>
<td>
{% for p in invoice.projects %}
{{ p.name }}
<br/>
{% endfor %}
</td>
</tr>
{% endif %}
<tr>
{{ # INVOICE DATE }}
<td>{{ 'Invoice Date' | make_label }}</td>
<td style="padding-right:10px;">
{{ invoice.invoice_date | format_date }}
<span class="info noprint">
({{ invoice.invoice_date | format_date_in_english }})
</span>
</td>
</tr>
<tr>
{{ # INVOICE DUE DATE }}
<td>{{ 'Due Date' | make_label }}</td>
<td style="padding-right:10px;">
{{ invoice.due_date | format_date }}
<span class="info noprint">
({{ invoice.due_date | format_date_in_english }})
</span>
</td>
</tr>
</table>
</div>
{{ # RIGHT DETAILS }}
{% capture total_due_string %}Total Due On<br/> {{ invoice.due_date | format_date }}{% endcapture %}
<div class="right_aligned">
<span class="bigger">{{ total_due_string | make_label }}</span><br/>
<div id="total_amount">{{ invoice.total_due | format_money }}</div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
{{ # NOTES }}
{% if invoice.notes != blank %}
<h2>Notes</h2>
<div class="content_pad">
{{ invoice.notes | format_text }}
</div>
{% endif %}
{{ # INVOICE ITEMS TABLE }}
<table class="list" cellpadding="0" cellspacing="0">
<colgroup>
<col />
<col style="width:100px;" />
<col style="width:100px;" />
<col style="width:100px;" />
<col style="width:130px;" />
</colgroup>
<tr>
<th class="first">Item Description</th>
<th class="numeric">Quantity</th>
<th class="numeric">Price Per</th>
<th class="numeric">Flat Fee</th>
<th class="numeric last">Total Cost</th>
</tr>
{% if invoice.line_items == null %}
<tbody id="no_items_body">
<tr>
<td colspan="6" class="first last info">
No items have been created for this invoice yet.
</td>
</tr>
</tbody>
{% else %}
<tbody id="item_list_body">
{{ # INVOICE ITEM LOOP }}
{{ # First, display items that don't belong to any project }}
{% for item in invoice.items_ad_hoc %}
{% include 'invoice_row' for item %}
{% endfor %}
{{ # Now, display items grouped by project that belong to one }}
{% for project in invoice.items_by_project %}
<tr class="summary project">
<td colspan="5" class="first last">
{{ project[0] }}
</td>
</tr>
{% for item in project[1] %}
{% include 'invoice_row' for item %}
{% endfor %}
{% endfor %}
</tbody>
{% endif %}
{{ # ITEM FOOTER }}
<tbody id="item_list_footer">
{{ # ITEM TOTAL }}
{% if invoice.sales_tax != null %}
<tr class="summary first">
<td class="first numeric" colspan="4"><b>Item Total</b></td>
<td class="numeric money_gain last">{{ invoice.item_cost | format_money }}</td>
</tr>
{{ # SALES TAX }}
<tr class="summary">
<td class="first numeric" colspan="4">
<b>Tax</b> - {{ invoice.sales_tax }}%
</td>
<td class="numeric money_gain last">{{ invoice.tax_cost | format_money }}</td>
</tr>
{% endif %}
{% if invoice.sales_tax_2 != null %}
{{ # SALES TAX 2 }}
<tr class="summary">
<td class="first numeric" colspan="4">
<b>Tax 2</b> - {{ invoice.sales_tax_2 }}%
</td>
<td class="numeric money_gain last">{{ invoice.tax_cost_2 | format_money }}</td>
</tr>
{% endif %}
{{ # LATE FEE }}
{% if invoice.late_cost > 0 %}
<tr class="summary">
<td class="first numeric" colspan="4">
<b>Late Fee</b> - {{ invoice.late_percentage }}% every {{ invoice.late_period_in_days }} days past due
</td>
<td class="numeric money_gain last">{{ invoice.late_cost | format_money }}</td>
</tr>
{% endif %}
{% if invoice.payments %}
{{ # INVOICE TOTAL }}
<tr class="summary">
<td class="first numeric" colspan="4">Invoice Total</td>
<td class="numeric money_gain last">{{ invoice.final_cost | format_money }}</td>
</tr>
{% for payment in invoice.payments %}
{{ # PAYMENTS }}
<tr class="summary">
<td class="first numeric" colspan="4">
Payment: {{ payment.id }} - {{ payment.created_on | format_date }}
</td>
<td class="numeric money_loss last">
{{ payment.amount | format_money }}
</td>
</tr>
{% endfor %}
{% endif %}
{{ # FINAL TOTAL }}
<tr class="footer">
{% if invoice.has_been_paid %}
<td class="first numeric last" colspan="5">
<span class="money_gain">Paid in full</span>
</td>
{% else %}
<td class="first numeric" colspan="4">Total Due</td>
<td class="numeric last">
<span class="money_gain">{{ invoice.total_due | format_money }}</span>
</td>
{% endif %}
</tr>
</tbody>
</table>
