FallenBirdyForm/app/aviary/templates/aviary/aviary_all.html

69 lines
No EOL
2.3 KiB
HTML

{% extends "base.html" %}
{% load static %}
{% block header %}
<!-- Datatable CSS -->
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.4/css/dataTables.bootstrap5.min.css" />
<link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.2.9/css/responsive.bootstrap5.min.css">
<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<!-- Datatable jQuery -->
<script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.11.3/js/dataTables.bootstrap5.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.2.9/js/dataTables.responsive.min.js"></script>
<script src="https://cdn.datatables.net/responsive/2.2.9/js/responsive.bootstrap5.min.js"></script>
<script>
$(document).ready(function () {
let table = $('#t__aviary_all').DataTable({
language: {
url: 'https://cdn.datatables.net/plug-ins/1.11.3/i18n/de_de.json',
},
paging: false,
info: false,
responsive: true,
columnDefs: [
{ responsivePriority: 1, targets: 0 },
]
});
table.on( 'responsive-display', function ( e, datatable, row, showHide, update ) {
table.rows().every( function () {
if (showHide && row.index() !== this.index() && this.child.isShown()) {
$('td', this.node()).eq(0).click();
}
});
});
})
</script>
{% endblock header %}
{% block content %}
<h3>Übersicht aller Volieren</h3>
<p>
Die Übersicht aller Volieren.
</p>
<table class="table table-striped table-hover display responsive nowrap" width="100%" id="t__aviary_all">
<thead>
<tr>
<th>Bezeichnung</th>
<th>Zustand</th>
<th>letzte Visite</th>
<th>Bemerkung</th>
</tr>
</thead>
<tbody>
{% for aviary in aviaries %}
<tr>
<td>
<a href="{% url 'aviary_single' aviary.id %}">{{ aviary.description }}</a>
</td>
<td>{{ aviary.condition }}</td>
<td>{{ aviary.last_ward_round }}</td>
<td>{{ aviary.comment|default_if_none:"" }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% endblock content %}