Merge pull request 'Améliorations partition éditor' (#456) from lehmann/ScoDoc-Front:master into master
Reviewed-on: https://scodoc.org/git/ScoDoc/ScoDoc/pulls/456
This commit is contained in:
commit
b4050f8e5d
@ -41,7 +41,7 @@ main h3 {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.filtres>div>div {
|
||||
.filtres>div>div>div {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
@ -49,7 +49,7 @@ main h3 {
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
.filtres>div>div>div {
|
||||
.filtres>div>div>div>div {
|
||||
background: #09c;
|
||||
color: #FFF;
|
||||
border-radius: 4px;
|
||||
@ -58,16 +58,16 @@ main h3 {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filtres>div>div>div:hover {
|
||||
.filtres>div>div>div>div:hover {
|
||||
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
.filtres>div>div>div:active {
|
||||
.filtres>div>div>div>div:active {
|
||||
box-shadow: 0 0 0 #000;
|
||||
transform: translateY(2px);
|
||||
}
|
||||
|
||||
.filtres>div>div>.unselect {
|
||||
.filtres .unselect {
|
||||
background: rgba(0, 153, 204, 0.5);
|
||||
}
|
||||
|
||||
@ -101,6 +101,13 @@ main h3 {
|
||||
|
||||
#zoneChoix label {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#zoneChoix span.aucun {
|
||||
font-size: 10px;
|
||||
background: #ddd;
|
||||
}
|
||||
|
||||
#zoneChoix .etudiants .partition>div,
|
||||
|
||||
@ -36,6 +36,10 @@
|
||||
let partitions = await fetchData("/ScoDoc/api/formsemestre/" + formsemestre_id + "/partitions");
|
||||
let etudiants = await fetchData("/ScoDoc/api/formsemestre/" + formsemestre_id + "/resultats");
|
||||
|
||||
etudiants.sort((a, b) => {
|
||||
return a.nom_short.localeCompare(b.nom_short)
|
||||
})
|
||||
|
||||
processDatas(partitions, etudiants);
|
||||
processEvents();
|
||||
|
||||
@ -56,13 +60,13 @@
|
||||
function processDatas(partitions, etudiants) {
|
||||
|
||||
/* Filtres et groupes */
|
||||
let outputPartitions = "";
|
||||
let outputPartitions = "<div>";
|
||||
let outputMasques = "";
|
||||
let outputGroupes = "";
|
||||
Object.entries(partitions).forEach(([idPartition, partition]) => {
|
||||
// Filtres
|
||||
outputPartitions += `<div data-idpartition="${idPartition}">${partition.partition_name}</div>`;
|
||||
outputMasques += `<span style="flex-basis: 100%"></span><div data-idpartition="${idPartition}" data-idgroupe=aucun>${partition.partition_name} N/A</div>`;
|
||||
outputMasques += `<div data-idpartition="${idPartition}"><div data-idpartition="${idPartition}" data-idgroupe=aucun>Non affectés - ${partition.partition_name}</div>`;
|
||||
|
||||
// Groupes
|
||||
outputGroupes += `
|
||||
@ -87,8 +91,9 @@
|
||||
return output;
|
||||
})()}
|
||||
</div>`;
|
||||
outputMasques += "</div>"
|
||||
})
|
||||
document.querySelector(".filtres>.partitions>div").innerHTML = outputPartitions;
|
||||
document.querySelector(".filtres>.partitions>div").innerHTML = outputPartitions + "</div>";
|
||||
document.querySelector(".filtres>.masques>div").innerHTML = outputMasques;
|
||||
document.querySelector("#zoneGroupes>.groupes").innerHTML = outputGroupes;
|
||||
|
||||
@ -110,7 +115,7 @@
|
||||
let affected = false;
|
||||
Object.entries(dataPartition.groups).forEach(([idGroupe, titreGroupe]) => {
|
||||
output += `
|
||||
<label><input type=radio name="${etudiant.etudid}-${idPartition}" value="${idGroupe}" ${(etudiant.partitions[idPartition] == idGroupe) ? "checked" : ""}><span>${titreGroupe.name}</span></label>`;
|
||||
<label><input type=radio name="${idPartition}-${etudiant.etudid}" value="${idGroupe}" ${(etudiant.partitions[idPartition] == idGroupe) ? "checked" : ""}><span>${titreGroupe.name}</span></label>`;
|
||||
|
||||
if (etudiant.partitions[idPartition] == idGroupe) {
|
||||
affected = true;
|
||||
@ -120,7 +125,7 @@
|
||||
if (!affected) {
|
||||
document.querySelector(`#zoneGroupes [data-idpartition="${idPartition}"]>[data-idgroupe="aucun"]>.etudiants`).innerHTML += templateEtudiantGroupes(etudiant);
|
||||
}
|
||||
return `<label><input type=radio name="${etudiant.etudid}-${idPartition}" value="aucun" ${(!affected) ? "checked" : ""}><span>N/A</span></label>` + output;
|
||||
return `<label title="Aucun groupe"><input type=radio name="${idPartition}-${etudiant.etudid}" value="aucun" ${(!affected) ? "checked" : ""}><span class=aucun>❌</span></label>` + output;
|
||||
})()}
|
||||
</div>`;
|
||||
})
|
||||
@ -137,7 +142,7 @@
|
||||
}
|
||||
|
||||
function processEvents() {
|
||||
document.querySelectorAll(".filtres>div>div>div").forEach(btn => {
|
||||
document.querySelectorAll(".filtres>div>div>div>div").forEach(btn => {
|
||||
btn.addEventListener("click", filtre);
|
||||
btn.addEventListener("mousedown", (event) => { event.preventDefault() }) // Eviter de sélectionner le texte si on clique plusieurs fois frénétiquement
|
||||
});
|
||||
@ -167,48 +172,42 @@
|
||||
})
|
||||
}
|
||||
|
||||
let groupesSelected = [];
|
||||
this.parentElement.querySelectorAll(":not(.unselect)").forEach(e => {
|
||||
groupesSelected.push(
|
||||
{
|
||||
idpartition: e.dataset.idpartition,
|
||||
idgroupe: e.dataset.idgroupe
|
||||
}
|
||||
);
|
||||
})
|
||||
|
||||
if (!this.dataset.idgroupe) {
|
||||
let groupesSelected = [];
|
||||
this.parentElement.querySelectorAll(":not(.unselect)").forEach(e => {
|
||||
groupesSelected.push(e.dataset.idpartition);
|
||||
})
|
||||
document.querySelectorAll(`
|
||||
.etudiants .partition[data-idpartition],
|
||||
#zoneGroupes [data-idpartition]
|
||||
`).forEach(e => {
|
||||
let found = false;
|
||||
for (let i = 0; i < groupesSelected.length; i++) {
|
||||
if (groupesSelected[i].idpartition == e.dataset.idpartition) {
|
||||
found = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (found) {
|
||||
if (groupesSelected.includes(e.dataset.idpartition)) {
|
||||
e.classList.remove("hide")
|
||||
} else {
|
||||
e.classList.add("hide")
|
||||
}
|
||||
})
|
||||
} else {
|
||||
document.querySelectorAll("#zoneChoix .etudiants>div").forEach(e => {
|
||||
let found = false;
|
||||
for (let i = 0; i < groupesSelected.length; i++) {
|
||||
let partition = "";
|
||||
if (groupesSelected[i].idpartition) {
|
||||
partition = `[data-idpartition="${groupesSelected[i].idpartition}"] `;
|
||||
}
|
||||
if (e.querySelector(`${partition}input[value="${groupesSelected[i].idgroupe}"]:checked`)) {
|
||||
found = true;
|
||||
break;
|
||||
}
|
||||
let groupesSelected = {};
|
||||
|
||||
this.parentElement.parentElement.querySelectorAll("[data-idgroupe]:not(.unselect)").forEach(e => {
|
||||
let idpartition = e.parentElement.dataset.idpartition;
|
||||
if(!groupesSelected[idpartition]){
|
||||
groupesSelected[idpartition] = [];
|
||||
}
|
||||
groupesSelected[idpartition].push(e.dataset.idgroupe)
|
||||
})
|
||||
document.querySelectorAll("#zoneChoix .etudiants>div").forEach(e => {
|
||||
let found = true;
|
||||
Object.entries(groupesSelected).forEach(([idpartition, tabGroupes])=>{
|
||||
if( !tabGroupes.includes(
|
||||
e.querySelector(`[data-idpartition="${idpartition}"] input:checked`).value
|
||||
)
|
||||
){
|
||||
found = false
|
||||
}
|
||||
})
|
||||
|
||||
if (found) {
|
||||
e.classList.remove("hide")
|
||||
} else {
|
||||
@ -247,10 +246,15 @@
|
||||
|
||||
/* Save */
|
||||
this.classList.add("saving");
|
||||
fetch(`/ScoDoc/api/group/${idGroupe}/set_etudiant/${etudid}`, { method: "POST" })
|
||||
if (idGroupe == "aucun") {
|
||||
var url = `/ScoDoc/api/partition/${idPartition}/remove_etudiant/${etudid}`;
|
||||
} else {
|
||||
var url = `/ScoDoc/api/group/${idGroupe}/set_etudiant/${etudid}`
|
||||
}
|
||||
fetch(url, { method: "POST" })
|
||||
.then(r => { return r.json() })
|
||||
.then(r => {
|
||||
if (r.group_id == idGroupe && r.etudid == etudid) {
|
||||
if (r.etudid == etudid) {
|
||||
this.classList.remove("saving");
|
||||
this.classList.add("saved");
|
||||
setTimeout(() => { this.classList.remove("saved") }, 800);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user