haikal/templates/ledger/bills/bill_list.html
2025-01-26 15:11:15 +00:00

157 lines
8.1 KiB
HTML

{% extends 'base.html' %}
{% load i18n %}
{% block title %}
{% trans 'Bills' %}
{% endblock %}
{% block bills %}
<a class="nav-link active fw-bold">
{% trans 'Bills'|capfirst %}
<span class="visually-hidden">(current)</span>
</a>
{% endblock %}
{% block content %}
<div class="d-flex flex-column min-vh-100">
<div class="d-flex flex-column flex-sm-grow-1 ms-sm-14 p-4">
<main class="d-grid gap-4 p-1">
<!-- Search Bar -->
<div class="row g-4">
<div class="col-12">
<div class="row-fluid p-2">
<form method="get">
<div class="input-group input-group-sm">
<button class="btn btn-sm btn-secondary rounded-start" type="submit">{% trans 'search' %}</button>
<input type="text" name="q" class="form-control form-control-sm rounded-end" value="{{ request.GET.q }}" placeholder="{% trans 'Search bills...' %}" />
{% if request.GET.q %}
<a href="{% url request.resolver_match.view_name %}" class="btn btn-sm btn-outline-danger ms-1 rounded"><i class="bi bi-x-lg"></i></a>
{% endif %}
</div>
</form>
</div>
</div>
</div>
<!-- Customer Table -->
<div id="accountsTable">
<div class="table-responsive">
<table class="table table-sm fs-9 mb-0">
<thead>
<tr class="bg-body-highlight">
<th class="border-top border-translucent ps-3">
{% trans 'Bill Number' %}
</th>
<th class="border-top border-translucent">
{% trans 'Bill Status' %}
</th>
<th class="border-top border-translucent text-end pe-3">
{% trans 'Vendor' %}
</th>
<th class="border-top border-translucent text-end align-middle pe-0 ps-4" scope="col"></th>
</tr>
</thead>
<tbody class="list">
{% for bill in bills %}
<div class="modal fade" id="deleteModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="deleteModalLabel">
{% trans 'Delete Bill' %}
<span data-feather="alert-circle"></span>
</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body text-center">
<p class="mb-0 text-danger fw-bold">
{% trans 'Are you sure you want to delete this Bill?' %}
</p>
<div class="d-grid gap-2">
<button type="button" class="btn btn-phoenix-secondary btn-sm" data-bs-dismiss="modal">{% trans 'No' %}</button>
<a type="button" class="btn btn-phoenix-danger btn-sm" href="{% url 'account_delete' bill.uuid %}">{% trans 'Yes' %}</a>
</div>
</div>
</div>
</div>
</div>
<tr>
<td class="align-middle ps-3">{{ bill.bill_number }}</td>
<td class="align-middle">
{% if bill.is_draft %}
<span class="badge badge-phoenix badge-phoenix-warning">
{% elif bill.is_review %}
<span class="badge badge-phoenix badge-phoenix-info">
{% elif bill.is_approved %}
<span class="badge badge-phoenix badge-phoenix-success">
{% elif bill.is_paid %}
<span class="badge badge-phoenix badge-phoenix-success">
{% endif %}
{{ bill.bill_status }}
</span>
</td>
<td class="align-middle text-end py-3 pe-3">
{{bill.vendor.vendor_name}}
</td>
<td>
<div class="btn-reveal-trigger position-static">
<button class="btn btn-sm dropdown-toggle dropdown-caret-none transition-none btn-reveal fs-10" type="button" data-bs-toggle="dropdown" data-boundary="window" aria-haspopup="true" aria-expanded="false" data-bs-reference="parent"><span class="fas fa-ellipsis-h fs-10"></span></button>
<div class="dropdown-menu dropdown-menu-end py-2">
<a href="{% url 'bill_detail' bill.pk %}" class="dropdown-item text-success-dark">{% trans 'View' %}</a>
<div class="dropdown-divider"></div><button class="dropdown-item text-danger" data-bs-toggle="modal" data-bs-target="#deleteModal">{% trans 'Delete' %}</button>
</div>
</div>
</td>
</tr>
{% empty %}
<tr>
<td colspan="5" class="text-center text-muted">
{% trans 'No bill found.' %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<div class="d-flex justify-content-between mt-3">
<span class="d-none d-sm-inline-block" data-list-info="data-list-info">{{ page_obj.start_index }} {{ _('to') }} {{ page_obj.end_index }}<span class="text-body-tertiary">{{ _('Items of') }}</span>{{ page_obj.paginator.count }}</span>
<div class="d-flex">
<nav aria-label="Page navigation">
<ul class="pagination mb-0">
{% if page_obj.has_previous %}
<li class="page-item py-0">
<a class="page-link" href="?page={{ page_obj.previous_page_number }}" aria-label="Previous"><span aria-hidden="true"><span class="fas fa-chevron-left"></span></span></a>
</li>
{% else %}
<li class="page-item disabled">
<a class="page-link" href="#" aria-label="Previous"><span aria-hidden="true"><span class="fas fa-chevron-left"></span></span></a>
</li>
{% endif %}
{% for num in page_obj.paginator.page_range %}
{% if page_obj.number == num %}
<li class="page-item active">
<a class="page-link" href="?page={{ num }}">{{ num }}</a>
</li>
{% else %}
<li class="page-item">
<a class="page-link" href="?page={{ num }}">{{ num }}</a>
</li>
{% endif %}
{% endfor %}
{% if page_obj.has_next %}
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.next_page_number }}" aria-label="Next"><span aria-hidden="true"><span class="fas fa-chevron-right"></span></span></a>
</li>
{% else %}
<li class="page-item disabled">
<a class="page-link" href="#" aria-label="Next"><span aria-hidden="true"><span class="fas fa-chevron-right"></span></span></a>
</li>
{% endif %}
</ul>
</nav>
</div>
</div>
</div>
</main>
</div>
</div>
{% endblock %}