121 lines
4.4 KiB
HTML
121 lines
4.4 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Users{% endblock %}
|
|
|
|
{% block users_active %}active{% endblock %}
|
|
|
|
{% block content %}
|
|
<!-- Button trigger modal -->
|
|
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#userModal">
|
|
Add User
|
|
</button>
|
|
|
|
<!-- Modal -->
|
|
<div class="modal fade" id="userModal" tabindex="-1" aria-labelledby="userModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<form method="post" action="/form_add_user">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="userModalLabel">Add User</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<label for="username" class="form-label">Username</label>
|
|
<input type="text" class="form-control" id="username" name="username" placeholder="Username">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="first_name" class="form-label">First Name</label>
|
|
<input type="text" class="form-control" id="first_name" name="first_name" placeholder="First Name">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="last_name" class="form-label">Last Name</label>
|
|
<input type="text" class="form-control" id="last_name" name="last_name" placeholder="Last Name">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="email" class="form-label">Email address</label>
|
|
<input type="email" class="form-control" id="email" name="email" placeholder="name@example.com">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="password" class="form-label">Password</label>
|
|
<input type="password" class="form-control" id="password" name="password">
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
|
<button type="submit" class="btn btn-primary">Add</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">#</th>
|
|
<th scope="col">Username</th>
|
|
<th scope="col">First</th>
|
|
<th scope="col">Last</th>
|
|
<th scope="col">Email</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for user in users %}
|
|
<tr style="vertical-align: middle;">
|
|
<th scope="row">{{ loop.index1 }}</th>
|
|
<td>{{ user.username }}</td>
|
|
<td>{{ user.first_name }}</td>
|
|
<td>{{ user.last_name }}</td>
|
|
<td>{{ user.email }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
|
|
{% if exists("pagination") %}
|
|
<ul class="pagination">
|
|
{% if existsIn(pagination, "previous") %}
|
|
<li class="page-item">
|
|
<a class="page-link" href="/users/{{ pagination.previous }}" aria-label="Previous">
|
|
<span aria-hidden="true">«</span>
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<li class="page-item disabled">
|
|
<a class="page-link" href="#" aria-label="Previous">
|
|
<span aria-hidden="true">«</span>
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
{% if existsIn(pagination, "left_ellipsis") %}
|
|
<li class="page-item"><a class="page-link" href="/users/1">1</a></li>
|
|
<li class="page-item disabled"><a class="page-link" href="#">...</a></li>
|
|
{% endif %}
|
|
{% for page in pagination.pages_left %}
|
|
<li class="page-item"><a class="page-link" href="/users/{{ page }}">{{ page }}</a></li>
|
|
{% endfor %}
|
|
<li class="page-item active" aria-current="page"><a class="page-link" href="/users/{{ pagination.current }}">{{ pagination.current }}</a></li>
|
|
{% for page in pagination.pages_right %}
|
|
<li class="page-item"><a class="page-link" href="/users/{{ page }}">{{ page }}</a></li>
|
|
{% endfor %}
|
|
{% if existsIn(pagination, "right_ellipsis") %}
|
|
<li class="page-item disabled"><a class="page-link" href="#">...</a></li>
|
|
<li class="page-item"><a class="page-link" href="/users/{{ pagination.total }}">{{ pagination.total }}</a></li>
|
|
{% endif %}
|
|
{% if existsIn(pagination, "next") %}
|
|
<li class="page-item">
|
|
<a class="page-link" href="/users/{{ pagination.next }}" aria-label="Next">
|
|
<span aria-hidden="true">»</span>
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<li class="page-item disabled">
|
|
<a class="page-link" href="#" aria-label="Next">
|
|
<span aria-hidden="true">»</span>
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
</ul>
|
|
{% endif %}
|
|
{% endblock %} |