184 lines
11 KiB
HTML
184 lines
11 KiB
HTML
{% load django_ledger %}
|
|
{% load i18n %}
|
|
{% if not create_invoice %}
|
|
{% if style == 'dashboard' %}
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<p class="text-muted text-end">
|
|
<span class="me-2">{% icon "bi:cash-stack" 16 %}</span>
|
|
{% trans 'Invoice' %}
|
|
</p>
|
|
<h3 class="card-title">{{ invoice.customer.customer_name }}</h3>
|
|
<p class="text-muted">{{ invoice.customer.address_1 }}</p>
|
|
{% if not invoice.is_past_due %}
|
|
<p class="h5 text-info">{% trans 'Due in' %}: {{ invoice.date_due | timeuntil }}</p>
|
|
{% else %}
|
|
<p class="text-danger fw-bold h5">{% trans "Past Due" %}: {{ invoice.date_due | timesince }} {% trans "ago" %}</p>
|
|
{% endif %}
|
|
{% if invoice.accrue %}
|
|
<p>
|
|
{% trans "Accrue" %}: <span class="text-success">{% icon 'ant-design:check-circle-filled' 24 %}</span>
|
|
</p>
|
|
{% else %}
|
|
<p>
|
|
{% trans "Accrue" %}: <span class="text-danger">{% icon 'maki:roadblock-11' 24 %}</span>
|
|
</p>
|
|
{% endif %}
|
|
<p class="h5 text-success">{% trans "Owed to You" %}: {% currency_symbol %}{{ invoice.get_amount_open | currency_format }}</p>
|
|
<p>{% trans "Amount Paid" %}: {% currency_symbol %}{{ invoice.amount_paid | currency_format }}</p>
|
|
<p>{% trans "Progressed" %}: {{ invoice.get_progress | percentage }}</p>
|
|
<div class="progress my-3">
|
|
<div class="progress-bar bg-success"
|
|
role="progressbar"
|
|
style="width: {{ invoice.get_progress_percent }}%"
|
|
aria-valuenow="{{ invoice.get_progress_percent }}"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100">{{ invoice.get_progress | percentage }}</div>
|
|
</div>
|
|
{% modal_action invoice 'get' entity_slug %}
|
|
</div>
|
|
<div class="card-footer d-flex justify-content-between">
|
|
<a href="#" class="btn btn-link text-primary">{% trans 'View' %}</a>
|
|
<a href="#" class="btn btn-link text-warning">{% trans 'Update' %}</a>
|
|
{% if not invoice.is_paid %}
|
|
<a onclick="djLedger.toggleModal('{{ invoice.get_html_id }}')"
|
|
class="btn btn-link text-info">{% trans 'Mark as Paid' %}</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% elif style == 'invoice-detail' %}
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h2 class="card-title h3">
|
|
<span class="me-2">{% icon 'uil:bill' 36 %}</span>
|
|
{% trans 'Invoice Info' %}
|
|
</h2>
|
|
</div>
|
|
<div class="card-body text-center">
|
|
{% if invoice.is_draft %}
|
|
<h3 class="h3 text-warning fw-bold">{% trans 'This invoice is' %} {{ invoice.get_invoice_status_display }}</h3>
|
|
<p class="h3">
|
|
{% trans 'Amount Due' %}: <span class="fw-bold">{% currency_symbol %}{{ invoice.amount_due | currency_format }}</span>
|
|
</p>
|
|
<p class="h3">
|
|
{% trans 'Due Date' %}: <span class="fw-bold">{{ invoice.date_due | timeuntil }}</span>
|
|
</p>
|
|
<p class="h3">
|
|
{% trans 'Is Accrued' %}:
|
|
{% if invoice.accrue %}
|
|
<span class="text-success">{% icon 'ant-design:check-circle-filled' 24 %}</span>
|
|
{% else %}
|
|
<span class="text-danger">{% icon 'maki:roadblock-11' 24 %}</span>
|
|
{% endif %}
|
|
</p>
|
|
{% elif invoice.is_review %}
|
|
<h3 class="h3 text-warning fw-bold">{% trans 'This invoice is' %} {{ invoice.get_invoice_status_display }}</h3>
|
|
<p class="h3">
|
|
{% trans 'Amount Due' %}: <span class="fw-bold">{% currency_symbol %}{{ invoice.amount_due | currency_format }}</span>
|
|
</p>
|
|
<p class="h3">
|
|
{% trans 'Due Date' %}: <span class="fw-bold">{{ invoice.date_due | timeuntil }}</span>
|
|
</p>
|
|
<p class="h3">
|
|
{% trans 'Is Accrued' %}:
|
|
{% if invoice.accrue %}
|
|
<span class="text-success">{% icon 'ant-design:check-circle-filled' 24 %}</span>
|
|
{% else %}
|
|
<span class="text-danger">{% icon 'maki:roadblock-11' 24 %}</span>
|
|
{% endif %}
|
|
</p>
|
|
{% if invoice.xref %}
|
|
<p class="h5 fst-italic">{% trans 'External Ref' %}: {{ invoice.xref }}</p>
|
|
{% endif %}
|
|
{% elif invoice.is_approved %}
|
|
<h3 class="h3 text-info fw-bold">{% trans 'This invoice is' %} {{ invoice.get_invoice_status_display }}</h3>
|
|
<p class="h3">
|
|
{% trans 'Amount Due' %}: <span class="fw-bold">{% currency_symbol %}{{ invoice.amount_due | currency_format }}</span>
|
|
</p>
|
|
<p class="h3">
|
|
{% trans 'Due Date' %}: <span class="fw-bold">{{ invoice.date_due | timeuntil }}</span>
|
|
</p>
|
|
<p class="h3">
|
|
{% trans 'Is Accrued' %}:
|
|
{% if invoice.accrue %}
|
|
<span class="text-success">{% icon 'ant-design:check-circle-filled' 24 %}</span>
|
|
{% else %}
|
|
<span class="text-danger">{% icon 'maki:roadblock-11' 24 %}</span>
|
|
{% endif %}
|
|
</p>
|
|
<p class="h3 fw-bold">{% trans 'Amount Paid' %}: {% currency_symbol %}{{ invoice.amount_paid | currency_format }}</p>
|
|
<p class="h5">{% trans 'Progressed' %}: {{ invoice.get_progress | percentage }}</p>
|
|
<div class="progress my-3">
|
|
<div class="progress-bar bg-success"
|
|
role="progressbar"
|
|
style="width: {{ invoice.get_progress_percent }}%"
|
|
aria-valuenow="{{ invoice.get_progress_percent }}"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100">{{ invoice.get_progress | percentage }}</div>
|
|
</div>
|
|
{% elif invoice.is_paid %}
|
|
<h3 class="h3 text-success fw-bold">{% trans 'This invoice is' %} {{ invoice.get_invoice_status_display }}</h3>
|
|
<p class="h3">
|
|
{% trans 'Amount Paid' %}: <span class="fw-bold">{% currency_symbol %}{{ invoice.amount_paid | currency_format }}</span>
|
|
</p>
|
|
<p class="h3">
|
|
{% trans 'Paid Date' %}: <span class="fw-bold">{{ invoice.date_paid | date }}</span>
|
|
</p>
|
|
{% else %}
|
|
<p class="h3">
|
|
{% trans "Invoice Amount" %}: <span class="fw-bold">{% currency_symbol %}{{ invoice.amount_due | currency_format }}</span>
|
|
</p>
|
|
<p class="h3 text-danger">{{ invoice.get_invoice_status_display | upper }}</p>
|
|
{% endif %}
|
|
</div>
|
|
<div class="card-footer d-flex justify-content-between">
|
|
{# MARK DRAFT #}
|
|
{% if invoice.can_draft %}
|
|
<a onclick="djLedger.toggleModal('{{ invoice.get_mark_as_draft_html_id }}')"
|
|
class="btn btn-link text-info">{% trans 'Mark as Draft' %}</a>
|
|
{% modal_action_v2 invoice invoice.get_mark_as_draft_url invoice.get_mark_as_draft_message invoice.get_mark_as_draft_html_id %}
|
|
{% endif %}
|
|
{# MARK REVIEW #}
|
|
{% if invoice.can_review %}
|
|
<a onclick="djLedger.toggleModal('{{ invoice.get_mark_as_review_html_id }}')"
|
|
class="btn btn-link text-info">{% trans 'Mark as Review' %}</a>
|
|
{% modal_action_v2 invoice invoice.get_mark_as_review_url invoice.get_mark_as_review_message invoice.get_mark_as_review_html_id %}
|
|
{% endif %}
|
|
{# MARK APPROVED #}
|
|
{% if invoice.can_approve %}
|
|
<a onclick="djLedger.toggleModal('{{ invoice.get_mark_as_approved_html_id }}')"
|
|
class="btn btn-link text-success">{% trans 'Approve' %}</a>
|
|
{% modal_action_v2 invoice invoice.get_mark_as_approved_url invoice.get_mark_as_approved_message invoice.get_mark_as_approved_html_id %}
|
|
{% endif %}
|
|
{# MARK PAID #}
|
|
{% if invoice.can_pay %}
|
|
<a onclick="djLedger.toggleModal('{{ invoice.get_mark_as_paid_html_id }}')"
|
|
class="btn btn-link text-success">{% trans 'Mark as Paid' %}</a>
|
|
{% modal_action_v2 invoice invoice.get_mark_as_paid_url invoice.get_mark_as_paid_message invoice.get_mark_as_paid_html_id %}
|
|
{% endif %}
|
|
{# MARK VOID #}
|
|
{% if invoice.can_void %}
|
|
<a onclick="djLedger.toggleModal('{{ invoice.get_mark_as_void_html_id }}')"
|
|
class="btn btn-link text-danger">{% trans 'Void' %}</a>
|
|
{% modal_action_v2 invoice invoice.get_mark_as_void_url invoice.get_mark_as_void_message invoice.get_mark_as_void_html_id %}
|
|
{% endif %}
|
|
{# MARK CANCELED #}
|
|
{% if invoice.can_cancel %}
|
|
<a onclick="djLedger.toggleModal('{{ invoice.get_mark_as_canceled_html_id }}')"
|
|
class="btn btn-link text-danger fw-bold">{% trans 'Cancel' %}</a>
|
|
{% modal_action_v2 invoice invoice.get_mark_as_canceled_url invoice.get_mark_as_canceled_message invoice.get_mark_as_canceled_html_id %}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% else %}
|
|
<div class="card text-center">
|
|
<div class="card-body">
|
|
<a href="#">
|
|
<span class="text-muted">{% icon "ic:baseline-add-circle-outline" 48 %}</span>
|
|
</a>
|
|
<h2 class="h3 text-muted">{% trans 'New Invoice' %}</h2>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|