122 lines
4.1 KiB
Plaintext
122 lines
4.1 KiB
Plaintext
|
<table id="assiduiteTable">
|
||
|
<thead>
|
||
|
<tr>
|
||
|
<th>
|
||
|
<div>
|
||
|
<span>Début</span>
|
||
|
<a class="icon order" onclick="order('date_debut', assiduiteCallBack, this)"></a>
|
||
|
</div>
|
||
|
</th>
|
||
|
<th>
|
||
|
<div>
|
||
|
<span>Fin</span>
|
||
|
<a class="icon order" onclick="order('date_fin', assiduiteCallBack, this)"></a>
|
||
|
</div>
|
||
|
</th>
|
||
|
<th>
|
||
|
<div>
|
||
|
<span>État</span>
|
||
|
<a class="icon order" onclick="order('etat', assiduiteCallBack, this)"></a>
|
||
|
</div>
|
||
|
</th>
|
||
|
<th>
|
||
|
<div>
|
||
|
<span>Module</span>
|
||
|
<a class="icon order" onclick="order('moduleimpl_id', assiduiteCallBack, this)"></a>
|
||
|
</div>
|
||
|
</th>
|
||
|
<th>
|
||
|
<div>
|
||
|
<span>Justifiée</span>
|
||
|
<a class="icon order" onclick="order('est_just', assiduiteCallBack, this)"></a>
|
||
|
</div>
|
||
|
</th>
|
||
|
</tr>
|
||
|
</thead>
|
||
|
<tbody id="tableBodyAssiduites">
|
||
|
</tbody>
|
||
|
</table>
|
||
|
<div id="paginationContainerAssiduites" class="pagination-container">
|
||
|
</div>
|
||
|
|
||
|
<script>
|
||
|
const paginationContainerAssiduites = document.getElementById("paginationContainerAssiduites");
|
||
|
let currentPageAssiduites = 1;
|
||
|
let orderAssiduites = true;
|
||
|
let filterAssiduites = {
|
||
|
columns: [
|
||
|
"entry_date", "date_debut", "date_fin", "etat", "moduleimpl_id", "est_just"
|
||
|
],
|
||
|
filters: {}
|
||
|
}
|
||
|
const tableBodyAssiduites = document.getElementById("tableBodyAssiduites");
|
||
|
|
||
|
function assiduiteCallBack(assi) {
|
||
|
assi = filterArray(assi, filterAssiduites.filters)
|
||
|
renderTableAssiduites(currentPageAssiduites, assi);
|
||
|
renderPaginationButtons(assi);
|
||
|
}
|
||
|
|
||
|
const moduleimpls = {}
|
||
|
|
||
|
function getModuleImpl(id) {
|
||
|
if (id == null || id == undefined) {
|
||
|
moduleimpls[id] = "Pas de module"
|
||
|
}
|
||
|
if (id in moduleimpls) {
|
||
|
return moduleimpls[id];
|
||
|
}
|
||
|
const url_api = getUrl() + `/api/moduleimpl/${id}`;
|
||
|
sync_get(url_api, (data) => {
|
||
|
moduleimpls[id] = `${data.module.code} ${data.module.abbrev}`;
|
||
|
}, (data) => { moduleimpls[id] = "Pas de module" });
|
||
|
|
||
|
return moduleimpls[id];
|
||
|
|
||
|
}
|
||
|
|
||
|
function renderTableAssiduites(page, assiduités) {
|
||
|
|
||
|
generateTableHead(filterAssiduites.columns, true)
|
||
|
|
||
|
tableBodyAssiduites.innerHTML = "";
|
||
|
const start = (page - 1) * itemsPerPage;
|
||
|
const end = start + itemsPerPage;
|
||
|
|
||
|
assiduités.slice(start, end).forEach((assiduite) => {
|
||
|
const row = document.createElement("tr");
|
||
|
row.setAttribute('type', "assiduite");
|
||
|
row.setAttribute('obj_id', assiduite.assiduite_id);
|
||
|
|
||
|
const etat = assiduite.etat.toLowerCase();
|
||
|
row.classList.add(`l-${etat}`);
|
||
|
filterAssiduites.columns.forEach((k) => {
|
||
|
const td = document.createElement('td');
|
||
|
if (k.indexOf('date') != -1) {
|
||
|
td.textContent = moment.tz(assiduite[k], TIMEZONE).format(`DD/MM/Y HH:mm`)
|
||
|
} else if (k.indexOf("module") != -1) {
|
||
|
td.textContent = getModuleImpl(assiduite.moduleimpl_id);
|
||
|
} else if (k.indexOf('est_just') != -1) {
|
||
|
td.textContent = assiduite[k] ? "Oui" : "Non"
|
||
|
} else {
|
||
|
td.textContent = assiduite[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);
|
||
|
});
|
||
|
|
||
|
tableBodyAssiduites.appendChild(row);
|
||
|
});
|
||
|
updateActivePaginationButton();
|
||
|
}
|
||
|
|
||
|
</script>
|