111 lines
3.8 KiB
Django/Jinja
111 lines
3.8 KiB
Django/Jinja
<table id="justificatifTable">
|
|
<thead>
|
|
<tr>
|
|
<th>
|
|
<div>
|
|
<span>Début</span>
|
|
<a class="icon order" onclick="order('date_debut', justificatifCallBack, this, false)"></a>
|
|
</div>
|
|
</th>
|
|
<th>
|
|
<div>
|
|
<span>Fin</span>
|
|
<a class="icon order" onclick="order('date_fin', justificatifCallBack, this, false)"></a>
|
|
</div>
|
|
</th>
|
|
<th>
|
|
<div>
|
|
<span>État</span>
|
|
<a class="icon order" onclick="order('etat', justificatifCallBack, this, false)"></a>
|
|
</div>
|
|
</th>
|
|
<th>
|
|
<div>
|
|
<span>Raison</span>
|
|
<a class="icon order" onclick="order('raison', justificatifCallBack, this, false)"></a>
|
|
</div>
|
|
</th>
|
|
<th>
|
|
<div>
|
|
<span>Fichier</span>
|
|
<a class="icon order" onclick="order('fichier', justificatifCallBack, this, false)"></a>
|
|
</div>
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="tableBodyJustificatifs">
|
|
</tbody>
|
|
</table>
|
|
<div id="paginationContainerJustificatifs" class="pagination-container">
|
|
</div>
|
|
|
|
<script>
|
|
const paginationContainerJustificatifs = document.getElementById("paginationContainerJustificatifs");
|
|
let currentPageJustificatifs = 1;
|
|
let orderJustificatifs = true;
|
|
let filterJustificatifs = {
|
|
columns: [
|
|
"entry_date", "date_debut", "date_fin", "etat", "raison", "fichier"
|
|
],
|
|
filters: {}
|
|
}
|
|
const tableBodyJustificatifs = document.getElementById("tableBodyJustificatifs");
|
|
|
|
function justificatifCallBack(justi) {
|
|
justi = filterArray(justi, filterJustificatifs.filters)
|
|
renderTableJustificatifs(currentPageJustificatifs, justi);
|
|
renderPaginationButtons(justi, false);
|
|
}
|
|
|
|
function renderTableJustificatifs(page, justificatifs) {
|
|
generateTableHead(filterJustificatifs.columns, false)
|
|
|
|
tableBodyJustificatifs.innerHTML = "";
|
|
const start = (page - 1) * itemsPerPage;
|
|
const end = start + itemsPerPage;
|
|
|
|
justificatifs.slice(start, end).forEach((justificatif) => {
|
|
const row = document.createElement("tr");
|
|
row.setAttribute('type', "justificatif");
|
|
row.setAttribute('obj_id', justificatif.justif_id);
|
|
|
|
const etat = justificatif.etat.toLowerCase();
|
|
|
|
if (etat == "valide") {
|
|
row.classList.add(`l-valid`);
|
|
|
|
} else {
|
|
row.classList.add(`l-invalid`);
|
|
|
|
}
|
|
|
|
filterJustificatifs.columns.forEach((k) => {
|
|
const td = document.createElement('td');
|
|
if (k.indexOf('date') != -1) {
|
|
td.textContent = moment.tz(justificatif[k], TIMEZONE).format(`DD/MM/Y HH:mm`)
|
|
} else if (k.indexOf('fichier') != -1) {
|
|
td.textContent = justificatif.fichier ? "Oui" : "Non";
|
|
}
|
|
else {
|
|
td.textContent = justificatif[k].capitalize()
|
|
}
|
|
|
|
row.appendChild(td)
|
|
})
|
|
|
|
row.addEventListener("contextmenu", (e) => {
|
|
e.preventDefault();
|
|
selectedRow = e.target.parentElement;
|
|
contextMenu.style.top = `${e.clientY}px`;
|
|
contextMenu.style.left = `${e.clientX}px`;
|
|
contextMenu.style.display = "block";
|
|
console.log(selectedRow);
|
|
});
|
|
|
|
tableBodyJustificatifs.appendChild(row);
|
|
});
|
|
updateActivePaginationButton(false);
|
|
}
|
|
|
|
|
|
</script> |