device list now uses bootstrap

This commit is contained in:
Thomas Nahuel Rusiecki 2024-11-27 23:58:23 -03:00
parent 2a6396b185
commit 138848de5f

View file

@ -4,18 +4,18 @@
{% block content %} {% block content %}
<div class="row"> <div class="row mb-4">
<div class="col"> <div class="col">
<h3>{{ subtitle }}</h3> <h3>{{ subtitle }}</h3>
</div> </div>
<div class="col text-center"> <div class="col d-flex justify-content-end align-items-center">
{% if lot %} {% if lot %}
<a href="{% url 'lot:documents' object.id %}" type="button" class="btn btn-green-admin"> <a href="{% url 'lot:documents' object.id %}" type="button" class="btn btn-green-admin me-2">
<i class="bi bi-folder2"></i> <i class="bi bi-folder2"></i>
{% trans 'Documents' %} {% trans 'Documents' %}
</a> </a>
{% endif %} {% endif %}
<a href="{# url 'dashboard:exports' object.id #}" type="button" class="btn btn-green-admin"> <a href="{# url 'dashboard:exports' object.id #}" type="button" class="btn btn-green-admin me-2">
<i class="bi bi-reply"></i> <i class="bi bi-reply"></i>
{% trans 'Exports' %} {% trans 'Exports' %}
</a> </a>
@ -28,59 +28,78 @@
</div> </div>
</div> </div>
<div class="dataTable-container"> <div class="dataTable-container mt-4">
<form method="post"> <form method="post">
{% csrf_token %} {% csrf_token %}
<table class="table"> <table class="table table-hover table-bordered">
<thead> <thead class="table-light">
<tr> <tr>
<th scope="col" data-sortable=""> <th scope="col" class="text-center">
{%trans "select"%} <input type="checkbox" id="select-all" />
</th> </th>
<th scope="col" data-sortable=""> <th scope="col" class="text-center">
{%trans "shortid" %} {% trans "Short ID" %}
</th> </th>
<th scope="col" data-sortable=""> <th scope="col" class="text-center">
{%trans "type" %} {% trans "Type" %}
</th> </th>
<th scope="col" data-sortable=""> <th scope="col" class="text-center">
{%trans "manufacturer" %} {% trans "Manufacturer" %}
</th> </th>
<th scope="col" data-sortable=""> <th scope="col" class="text-center">
{%trans "model" %} {% trans "Model" %}
</th> </th>
</tr> </tr>
</thead> </thead>
{% for dev in devices %} <tbody>
<tbody> {% for dev in devices %}
<tr> <tr>
<td> <td class="text-center">
<input type="checkbox" name="devices" value="{{ dev.id }}" /> <input type="checkbox" name="devices" value="{{ dev.id }}" />
</td> </td>
<td> <td class="text-center">
<a href="{% url 'device:details' dev.id %}"> <a href="{% url 'device:details' dev.id %}">
{{ dev.shortid }} {{ dev.shortid }}
</a> </a>
</td> </td>
<td> <td class="text-center">
{{ dev.type }} {{ dev.type }}
</td> </td>
<td> <td class="text-center">
{{ dev.manufacturer }} {{ dev.manufacturer }}
</td> </td>
<td> <td class="text-center">
{{ dev.model }} {{ dev.model }}
</td> </td>
</tr> </tr>
</tbody> {% endfor %}
{% endfor %} </tbody>
</table> </table>
<button class="btn btn-green-admin" type="submit" value="{% url 'lot:del_devices' %}" name="url">{% trans 'Remove' %}</button> <button class="btn btn-green-admin" type="submit" name="url" value="{% url 'lot:add_devices' %}">{% trans 'Add'%}</button> <div class="d-flex justify-content-start mt-5">
<button id="remove-button" class="btn btn-danger me-2" type="submit" value="{% url 'lot:del_devices' %}" name="url" disabled>
<i class="bi bi-trash"></i> {% trans 'Remove' %}
</button>
<button class="btn btn-success" type="submit" name="url" value="{% url 'lot:add_devices' %}">
{% trans 'Add' %}
</button>
</div>
</form> </form>
</div> </div>
<div class="row mt-3"> <div class="row mt-3">
<div class="col"> <div class="col">
{% render_pagination page total_pages limit %} {% render_pagination page total_pages limit %}
</div> </div>
</div> </div>
<script>
// Placeholder check-all js
document.getElementById('select-all').onclick = function() {
var checkboxes = document.querySelectorAll('input[type="checkbox"]');
for (var checkbox of checkboxes) {
checkbox.checked = this.checked;
}
}
</script>
{% endblock %} {% endblock %}