A R R R Associates
118 lines
6.4 KiB
HTML
118 lines
6.4 KiB
HTML
{% extends "ui/templates/base/layout.html" %}
|
|
{% block content %}
|
|
<div class="space-y-6">
|
|
<div class="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
|
|
<div>
|
|
<h2 class="text-2xl font-semibold text-slate-900">Clients</h2>
|
|
<p class="text-sm text-slate-500">Association-aware list view.</p>
|
|
</div>
|
|
|
|
<div class="flex flex-wrap gap-3">
|
|
<a href="/client-groups" class="inline-flex rounded-xl border border-slate-300 px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Client Groups</a>
|
|
{% if can_export %}
|
|
<a href="/clients/export?q={{ q|urlencode }}&status={{ status|urlencode }}&client_type={{ client_type|urlencode }}{% if partner_id %}&partner_id={{ partner_id }}{% endif %}&include_archived={{ include_archived }}&sort_by={{ sort_by|urlencode }}&sort_order={{ sort_order|urlencode }}"
|
|
class="inline-flex rounded-xl border border-slate-300 px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">
|
|
Export CSV
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if can_import %}
|
|
<a href="/clients/import"
|
|
class="inline-flex rounded-xl border border-slate-300 px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">
|
|
Import Clients
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if can_create %}
|
|
<a href="/clients/new"
|
|
class="inline-flex rounded-xl bg-brand-600 px-4 py-2 text-sm font-medium text-white hover:bg-brand-700">
|
|
Add Client
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
{% include "modules/clients/templates/clients/partials/table.html" %}
|
|
|
|
{% if meta and not compact_client_view %}
|
|
<div class="flex flex-col gap-4 rounded-2xl border border-slate-200 bg-white px-4 py-4 shadow-soft sm:flex-row sm:items-center sm:justify-between">
|
|
<div class="text-sm text-slate-600">
|
|
{% if meta.total > 0 %}
|
|
Showing <span class="font-semibold text-slate-900">{{ ((meta.page - 1) * meta.per_page) + 1 }}</span>
|
|
to <span class="font-semibold text-slate-900">{% if meta.page * meta.per_page > meta.total %}{{ meta.total }}{% else %}{{ meta.page * meta.per_page }}{% endif %}</span>
|
|
of <span class="font-semibold text-slate-900">{{ meta.total }}</span> clients
|
|
{% else %}
|
|
No clients found
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="flex flex-col gap-3 sm:flex-row sm:items-center">
|
|
<form method="get" action="/clients" class="flex items-center gap-2">
|
|
<input type="hidden" name="q" value="{{ q }}">
|
|
<input type="hidden" name="status" value="{{ status }}">
|
|
<input type="hidden" name="client_type" value="{{ client_type }}">
|
|
{% if client_group_id %}<input type="hidden" name="client_group_id" value="{{ client_group_id }}">{% endif %}
|
|
{% if partner_id %}<input type="hidden" name="partner_id" value="{{ partner_id }}">{% endif %}
|
|
<input type="hidden" name="include_archived" value="{{ 'true' if include_archived else 'false' }}">
|
|
<input type="hidden" name="sort_by" value="{{ sort_by }}">
|
|
<input type="hidden" name="sort_order" value="{{ sort_order }}">
|
|
<input type="hidden" name="page" value="1">
|
|
<label for="clients-per-page" class="text-sm text-slate-600">Rows</label>
|
|
<select id="clients-per-page" name="per_page" onchange="this.form.submit()"
|
|
class="rounded-lg border border-slate-300 bg-white px-2 py-1.5 text-sm text-slate-700 focus:border-brand-500 focus:outline-none focus:ring-2 focus:ring-brand-100">
|
|
{% for size in [10, 25, 50, 100] %}
|
|
<option value="{{ size }}" {% if meta.per_page == size %}selected{% endif %}>{{ size }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</form>
|
|
|
|
{% if meta.pages > 1 %}
|
|
<nav class="flex items-center gap-1" aria-label="Client list pagination">
|
|
{% set query = namespace(value='q=' ~ (q|urlencode) ~ '&status=' ~ (status|urlencode) ~ '&client_type=' ~ (client_type|urlencode) ~ '&include_archived=' ~ ('true' if include_archived else 'false') ~ '&per_page=' ~ meta.per_page ~ '&sort_by=' ~ (sort_by|urlencode) ~ '&sort_order=' ~ (sort_order|urlencode)) %}
|
|
{% if client_group_id %}{% set query.value = query.value ~ '&client_group_id=' ~ client_group_id %}{% endif %}
|
|
{% if partner_id %}{% set query.value = query.value ~ '&partner_id=' ~ partner_id %}{% endif %}
|
|
{% set common_query = query.value %}
|
|
|
|
{% if meta.page > 1 %}
|
|
<a href="/clients?{{ common_query }}&page={{ meta.page - 1 }}"
|
|
class="rounded-lg border border-slate-300 px-3 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Previous</a>
|
|
{% else %}
|
|
<span class="cursor-not-allowed rounded-lg border border-slate-200 px-3 py-2 text-sm font-medium text-slate-400">Previous</span>
|
|
{% endif %}
|
|
|
|
{% set start_page = meta.page - 2 if meta.page - 2 > 1 else 1 %}
|
|
{% set end_page = meta.page + 2 if meta.page + 2 < meta.pages else meta.pages %}
|
|
|
|
{% if start_page > 1 %}
|
|
<a href="/clients?{{ common_query }}&page=1" class="rounded-lg px-3 py-2 text-sm font-medium text-slate-700 hover:bg-slate-100">1</a>
|
|
{% if start_page > 2 %}<span class="px-1 text-slate-400">…</span>{% endif %}
|
|
{% endif %}
|
|
|
|
{% for page_number in range(start_page, end_page + 1) %}
|
|
{% if page_number == meta.page %}
|
|
<span aria-current="page" class="rounded-lg bg-brand-600 px-3 py-2 text-sm font-semibold text-white">{{ page_number }}</span>
|
|
{% else %}
|
|
<a href="/clients?{{ common_query }}&page={{ page_number }}"
|
|
class="rounded-lg px-3 py-2 text-sm font-medium text-slate-700 hover:bg-slate-100">{{ page_number }}</a>
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
{% if end_page < meta.pages %}
|
|
{% if end_page < meta.pages - 1 %}<span class="px-1 text-slate-400">…</span>{% endif %}
|
|
<a href="/clients?{{ common_query }}&page={{ meta.pages }}" class="rounded-lg px-3 py-2 text-sm font-medium text-slate-700 hover:bg-slate-100">{{ meta.pages }}</a>
|
|
{% endif %}
|
|
|
|
{% if meta.page < meta.pages %}
|
|
<a href="/clients?{{ common_query }}&page={{ meta.page + 1 }}"
|
|
class="rounded-lg border border-slate-300 px-3 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Next</a>
|
|
{% else %}
|
|
<span class="cursor-not-allowed rounded-lg border border-slate-200 px-3 py-2 text-sm font-medium text-slate-400">Next</span>
|
|
{% endif %}
|
|
</nav>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %}
|