canaille-globuzma/canaille/templates/macro/table.html
2023-08-31 22:44:06 +02:00

113 lines
4.2 KiB
HTML

{% macro search(form, target) %}
<form id="search" action="{{ url_for(request.url_rule.endpoint, **request.view_args) }}" method="POST" class="ui form">
{{ form.hidden_tag() if form.hidden_tag }}
<input type="hidden" name="page" value="{{ form.page.data }}">
<div class="ui fluid action input icon">
<input
type="search"
placeholder="{{ _("Search") }}"
name="{{ form.query.name }}"
value="{{ form.query.data }}"
hx-post="{{ url_for(request.url_rule.endpoint, **request.view_args) }}"
hx-trigger="keyup changed delay:500ms, search"
hx-target="{{ target }}"
hx-swap="outerHTML"
hx-indicator=".search-button"
/>
<button
type="submit"
class="ui icon button search-button"
title="{{ _("Search") }}"
hx-post="{{ url_for(request.url_rule.endpoint, **request.view_args) }}"
hx-target="{{ target }}"
hx-swap="outerHTML"
hx-indicator=".search-button"
>
<i class="search icon"></i>
</button>
</div>
</form>
{% endmacro %}
{% macro button(form, id, page) %}
{% if page is none %}
<span class="icon disabled ui button" style="border-radius: 0">
{{ caller() }}
</span>
{% else %}
<button
type="submit"
class="icon ui button"
hx-post="{{ url_for(request.url_rule.endpoint, **request.view_args) }}"
hx-target="closest table"
hx-swap="outerHTML"
name="page"
value="{{ page }}"
>
{{ caller() }}
</button>
{% endif %}
{% endmacro %}
{% macro pagination(form) %}
<div class="ui right floated buttons pagination">
<form id="{{ form.__class__.__name__|lower }}" action="{{ url_for(request.url_rule.endpoint, **request.view_args) }}" method="POST">
{{ form.hidden_tag() if form.hidden_tag }}
<input type="hidden" name="query" value="{{ form.query.data }}">
<span class="icon disabled ui button" style="border-radius: 0">
{% trans %}Page{% endtrans %}
</span>
{% if form.page.data > 1 %}
{% call button(form, "previous", form.page.data - 1) %}
<i class="left chevron icon"></i>
{% endcall %}
{% else %}
{% call button(form, "previous", none) %}
<i class="left chevron icon"></i>
{% endcall %}
{% endif %}
{% if form.page.data > 1 %}
{% call button(form, "first", 1) %}
1
{% endcall %}
{% endif %}
{% if form.page.data > 2 %}
{% call button(form, "ellipsis-previous", none) %}
{% endcall %}
{% endif %}
<span class="ui button active">
{{ form.page.data }}
</span>
{% if form.page.data < form.page_max - 1 %}
{% call button(form, "ellipsis-next", none) %}
{% endcall %}
{% endif %}
{% if form.page.data < form.page_max %}
{% call button(form, "last", form.page_max) %}
{{ form.page_max }}
{% endcall %}
{% endif %}
{% if form.page.data < form.page_max %}
{% call button(form, "next", form.page.data + 1) %}
<i class="right chevron icon"></i>
{% endcall %}
{% else %}
{% call button(form, "next", none) %}
<i class="right chevron icon"></i>
{% endcall %}
{% endif %}
</form>
</div>
<div class="ui left floated">
<span class="disabled ui button">
{% trans nb_items=form.nb_items %}
{{ nb_items }} item
{% pluralize %}
{{ nb_items }} items
{% endtrans %}
</span>
</div>
{% endmacro %}