Add empty state on table #17

Merged
loub merged 1 commits from add-empty-state into main 2026-01-30 18:41:42 +01:00
5 changed files with 102 additions and 79 deletions

View File

@ -11,6 +11,7 @@ common:
search: Search
reset: Reset
show: Show
no_result: No results
close: Close
confirmation: Confirmation
are_you_sure: Are you sure?

View File

@ -11,6 +11,7 @@ common:
search: Filtrer
reset: Réini.
show: Voir
no_result: Aucun résultat
close: Fermer
confirmation: Confirmation
are_you_sure: Êtes-vous sûr ?

View File

@ -25,7 +25,7 @@ use crate::{
#[derive(Template, WebTemplate)]
#[template(path = "users/index.html")]
struct UsersIndexTemplate {
user_with_books_number: Vec<UserWithBookNumber>,
users_with_books_number: Vec<UserWithBookNumber>,
query: IndexQuery,
}
@ -84,7 +84,7 @@ pub async fn index(
}
Ok(UsersIndexTemplate {
user_with_books_number: result,
users_with_books_number: result,
query,
})
}

View File

@ -90,62 +90,73 @@
{% endcall %}
{% call cards::card() %}
<table class="table table-hover">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">{{ t!("book.attributes.title") }}</th>
<th scope="col">{{ t!("book.attributes.authors") }}</th>
<th scope="col">{{ t!("book.attributes.owner") }}</th>
<th scope="col">{{ t!("book.attributes.current_holder") }}</th>
<th scope="col">{{ t!("common.actions") }}</th>
</tr>
</thead>
<tbody>
{% for book_user in books_with_user %}
<tr class="align-middle">
<th scope="row">{{ book_user.book.id }}</th>
<td>{{ book_user.book.title }}</td>
<td>{{ book_user.book.authors }}</td>
<td>{{ book_user.owner.name }}</td>
<td>
{% match book_user.current_holder %}
{% when Some with (current_holder) %}
{{ current_holder.name }}
{% when None %}
-
{% endmatch %}
</td>
<td>
{{ dropdown::crud_dropdown_button(book_user.book, t!("common.actions"), "books") }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% if books_with_user.is_empty() %}
<div class="d-flex flex-column align-items-center justify-content-center">
<h2>{{ t!("common.no_result") }}</h2>
{% if total_page > 1 %}
<div class="d-flex justify-content-center mt-1">
<nav aria-label="Page navigation">
<ul class="pagination">
<li class="page-item {% if current_page <= 1 %}disabled{% endif %}">
<a class="page-link" href="/?{{ base_query }}page={% if current_page > 1 %}{{ current_page - 1 }}{% else %}1{% endif %}">{{ t!("common.prev") }}</a>
</li>
{% for page in 1..(total_page + 1) %}
{% if page >= current_page - 1 && page <= current_page + 1 %}
<li class="page-item {% if page == current_page %}active{% endif %}">
<a class="page-link" href="/?{{ base_query }}page={{ page }}">{{ page }}</a>
</li>
{% endif %}
{% endfor %}
<li class="page-item {% if current_page == total_page %}disabled{% endif %}">
<a class="page-link" href="/?{{ base_query }}page={{ current_page + 1 }}">{{ t!("common.next") }}</a>
</li>
</ul>
</nav>
<a class="btn btn-success text-white text-nowrap mt-3" href="/books/new">
{{ t!("book.new.button_short") }}
</a>
</div>
{% else %}
<table class="table table-hover">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">{{ t!("book.attributes.title") }}</th>
<th scope="col">{{ t!("book.attributes.authors") }}</th>
<th scope="col">{{ t!("book.attributes.owner") }}</th>
<th scope="col">{{ t!("book.attributes.current_holder") }}</th>
<th scope="col">{{ t!("common.actions") }}</th>
</tr>
</thead>
<tbody>
{% for book_user in books_with_user %}
<tr class="align-middle">
<th scope="row">{{ book_user.book.id }}</th>
<td>{{ book_user.book.title }}</td>
<td>{{ book_user.book.authors }}</td>
<td>{{ book_user.owner.name }}</td>
<td>
{% match book_user.current_holder %}
{% when Some with (current_holder) %}
{{ current_holder.name }}
{% when None %}
-
{% endmatch %}
</td>
<td>
{{ dropdown::crud_dropdown_button(book_user.book, t!("common.actions"), "books") }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% if total_page > 1 %}
<div class="d-flex justify-content-center mt-1">
<nav aria-label="Page navigation">
<ul class="pagination">
<li class="page-item {% if current_page <= 1 %}disabled{% endif %}">
<a class="page-link" href="/?{{ base_query }}page={% if current_page > 1 %}{{ current_page - 1 }}{% else %}1{% endif %}">{{ t!("common.prev") }}</a>
</li>
{% for page in 1..(total_page + 1) %}
{% if page >= current_page - 1 && page <= current_page + 1 %}
<li class="page-item {% if page == current_page %}active{% endif %}">
<a class="page-link" href="/?{{ base_query }}page={{ page }}">{{ page }}</a>
</li>
{% endif %}
{% endfor %}
<li class="page-item {% if current_page == total_page %}disabled{% endif %}">
<a class="page-link" href="/?{{ base_query }}page={{ current_page + 1 }}">{{ t!("common.next") }}</a>
</li>
</ul>
</nav>
</div>
{% endif %}
{% endif %}
{% endcall %}
{% endblock %}

View File

@ -34,29 +34,39 @@
{% endcall %}
{% call cards::card() %}
<table class="table table-hover">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">{{ t!("user.attributes.name") }}</th>
<th scope="col">{{ t!("user.attributes.owner_books") }}</th>
<th scope="col">{{ t!("user.attributes.borrowed_books") }}</th>
<th scope="col">{{ t!("common.actions") }}</th>
</tr>
</thead>
<tbody>
{% for user_information in user_with_books_number %}
<tr class="align-middle">
<th scope="row">{{ user_information.user.id }}</th>
<td>{{ user_information.user.name }}</td>
<td>{{ user_information.owner_book_number }}</td>
<td>{{ user_information.borrowed_book_number }}</td>
<td>
{{ dropdown::crud_dropdown_button(user_information.user, t!("common.actions"), "users", show = false) }}
</td>
{% if users_with_books_number.is_empty() %}
<div class="d-flex flex-column align-items-center justify-content-center">
<h2>{{ t!("common.no_result") }}</h2>
<a class="btn btn-success text-white text-nowrap mt-3" href="//new">
{{ t!("user.index.button") }}
</a>
</div>
{% else %}
<table class="table table-hover">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">{{ t!("user.attributes.name") }}</th>
<th scope="col">{{ t!("user.attributes.owner_books") }}</th>
<th scope="col">{{ t!("user.attributes.borrowed_books") }}</th>
<th scope="col">{{ t!("common.actions") }}</th>
</tr>
{% endfor %}
</tbody>
</table>
</thead>
<tbody>
{% for user_information in users_with_books_number %}
<tr class="align-middle">
<th scope="row">{{ user_information.user.id }}</th>
<td>{{ user_information.user.name }}</td>
<td>{{ user_information.owner_book_number }}</td>
<td>{{ user_information.borrowed_book_number }}</td>
<td>
{{ dropdown::crud_dropdown_button(user_information.user, t!("common.actions"), "users", show = false) }}
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endif %}
{% endcall %}
{% endblock %}