dubacq/ScoDoc
1
0
Fork 0
forked from ScoDoc/ScoDoc
Code Pull Requests Activity

Merge pull request 'Edition partition - fin pour tests' (#460) from lehmann/ScoDoc-Front:master into master

Browse Source 
Reviewed-on: https://scodoc.org/git/ScoDoc/ScoDoc/pulls/460
This commit is contained in:
Emmanuel Viennet 2022-07-26 09:03:21 +02:00
commit b61338be8f
1 changed files with 94 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

120
app/templates/scolar/partition_editor.html
View File

@ -86,19 +86,15 @@
<div class=etudiants></div> <div class=etudiants></div>
</div> </div>
${(() => { ${(() => {
let output = ""; let output = "";
Object.entries(partition.groups).forEach(([idGroupe, titreGroupe]) => { Object.entries(partition.groups).forEach(([idGroupe, titreGroupe]) => {
/***************/ /***************/
outputMasques += `<div data-idgroupe="${idGroupe}"><span class="editing move">||</span><span>${titreGroupe.name}</span><span class="editing modif">✏️</span><span class="editing suppr">❌</span></div>`; outputMasques += `<div data-idgroupe="${idGroupe}"><span class="editing move">||</span><span>${titreGroupe.name}</span><span class="editing modif">✏️</span><span class="editing suppr">❌</span></div>`;
/***************/ /***************/
output += ` output += templateGroupe_zoneGroupes(idGroupe, titreGroupe.name);
<div class=groupe data-idgroupe="${idGroupe}"> })
<div>${titreGroupe.name}</div> return output;
<div class=etudiants></div> })()}
</div>`;
})
return output;
})()}
</div>`; </div>`;
outputMasques += ` outputMasques += `
<div class="editing ajoutGroupe">+</div> <div class="editing ajoutGroupe">+</div>
@ -121,36 +117,42 @@
let output = "<div class=grpPartitions>"; let output = "<div class=grpPartitions>";
Object.entries(partitions).forEach(([idPartition, dataPartition]) => { Object.entries(partitions).forEach(([idPartition, dataPartition]) => {
output += ` output += `
<div class=partition data-idpartition="${idPartition}"> <div class=partition data-idpartition="${idPartition}">
<div>${dataPartition.partition_name}</div> <div>${dataPartition.partition_name}</div>
${(() => { ${(() => {
let output = ""; let output = "";
let affected = false; let affected = false;
Object.entries(dataPartition.groups).forEach(([idGroupe, titreGroupe]) => { Object.entries(dataPartition.groups).forEach(([idGroupe, titreGroupe]) => {
output += ` output += `
<label><input type=radio name="${idPartition}-${etudiant.etudid}" 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) { if (etudiant.partitions[idPartition] == idGroupe) {
affected = true; affected = true;
document.querySelector(`#zoneGroupes [data-idgroupe="${idGroupe}"]>.etudiants`).innerHTML += templateEtudiantGroupes(etudiant); document.querySelector(`#zoneGroupes [data-idgroupe="${idGroupe}"]>.etudiants`).innerHTML += templateEtudiant_zoneGroupes(etudiant);
} }
}) })
if (!affected) { if (!affected) {
document.querySelector(`#zoneGroupes [data-idpartition="${idPartition}"]>[data-idgroupe="aucun"]>.etudiants`).innerHTML += templateEtudiantGroupes(etudiant); document.querySelector(`#zoneGroupes [data-idpartition="${idPartition}"]>[data-idgroupe="aucun"]>.etudiants`).innerHTML += templateEtudiant_zoneGroupes(etudiant);
} }
return `<label title="Aucun groupe"><input type=radio name="${idPartition}-${etudiant.etudid}" value="aucun" ${(!affected) ? "checked" : ""}><span class=aucun>❌</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>`; </div>`;
}) })
return output + "</div>"; return output + "</div>";
})()} })()}
</div>`; </div>`;
}) })
document.querySelector("#zoneChoix>.etudiants").innerHTML = output; document.querySelector("#zoneChoix>.etudiants").innerHTML = output;
} }
function templateEtudiantGroupes(etudiant) { function templateGroupe_zoneGroupes(idGroupe, name) {
return `<div class=groupe data-idgroupe="${idGroupe}">
<div>${name}</div>
<div class=etudiants></div>
</div>`;
}
function templateEtudiant_zoneGroupes(etudiant) {
return `<div data-etudid="${etudiant.etudid}" data-nom="${etudiant.nom_disp}" data-prenom="${etudiant.prenom}">${etudiant.nom_disp} ${etudiant.prenom}</div>` return `<div data-etudid="${etudiant.etudid}" data-nom="${etudiant.nom_disp}" data-prenom="${etudiant.prenom}">${etudiant.nom_disp} ${etudiant.prenom}</div>`
} }
@ -274,7 +276,7 @@
} }
let results = document.querySelector(`#zoneGroupes [data-idPartition="${idPartition}"] [data-idgroupe="${idGroupe}"]>.etudiants`); let results = document.querySelector(`#zoneGroupes [data-idPartition="${idPartition}"] [data-idgroupe="${idGroupe}"]>.etudiants`);
results.innerHTML += templateEtudiantGroupes(etudiant); results.innerHTML += templateEtudiant_zoneGroupes(etudiant);
/* Tri */ /* Tri */
let results2 = [...results.children]; let results2 = [...results.children];
@ -308,18 +310,20 @@
} }
/*******************/ /****************************/
/* Ajout partition */ /* Ajout partition / groupe */
/*******************/ /****************************/
function addPartition() { function addPartition() {
let date = new Date; let date = new Date;
if (this.classList.contains("ajoutPartition")) { if (this.classList.contains("ajoutPartition")) {
// Partition
var name = "Nouvelle " + date.getSeconds(); var name = "Nouvelle " + date.getSeconds();
let params = (new URL(document.location)).searchParams; let params = (new URL(document.location)).searchParams;
let formsemestre_id = params.get('formsemestre_id'); let formsemestre_id = params.get('formsemestre_id');
var url = "/ScoDoc/api/formsemestre/" + formsemestre_id + "/partition/create"; var url = "/ScoDoc/api/formsemestre/" + formsemestre_id + "/partition/create";
var payload = { partition_name: name }; var payload = { partition_name: name };
} else { } else {
// Groupe
var name = "Nouveau " + date.getSeconds(); var name = "Nouveau " + date.getSeconds();
var url = `/ScoDoc/api/partition/${this.parentElement.dataset.idpartition}/group/create`; var url = `/ScoDoc/api/partition/${this.parentElement.dataset.idpartition}/group/create`;
var payload = { group_name: name }; var payload = { group_name: name };
@ -355,8 +359,72 @@
} }
if (this.classList.contains("ajoutPartition")) { if (this.classList.contains("ajoutPartition")) {
div.dataset.idpartition = r.id; div.dataset.idpartition = r.id;
// Ajout dans la zone masques
let div = document.createElement("div");
div.dataset.idpartition = r.id;
div.innerHTML = `
<div data-idpartition="${r.id}" data-idgroupe=aucun>Non affectés - ${name}</div>
<div class="editing ajoutGroupe">+</div>`;
div.querySelector("div").addEventListener("click", filtre);
div.querySelector(".ajoutGroupe").addEventListener("click", addPartition);
document.querySelector("#zoneChoix .masques>div").appendChild(div);
// Ajout de la zone pour chaque étudiant
let outputGroupes = "";
document.querySelectorAll(`#zoneChoix .grpPartitions`).forEach(e => {
let etudid = e.previousElementSibling.dataset.etudid;
// Préparation pour la section suivante
let etudiant = {
etudid: etudid,
nom_disp: e.previousElementSibling.dataset.nom,
prenom:e.previousElementSibling.dataset.prenom
}
outputGroupes += templateEtudiant_zoneGroupes(etudiant);
////////////////////////
let div = document.createElement("div");
div.className = "partition";
div.dataset.idpartition = r.id;
div.innerHTML = `
<div>${name}</div>
<label title="Aucun groupe">
<input type="radio" name="${r.id}-${etudid}" value="aucun" checked>
<span class="aucun">❌</span>
</label>
`;
div.querySelector("input").addEventListener("input", assignment);
e.appendChild(div);
});
// Ajout de la zone groupes
document.querySelector("#zoneGroupes>.groupes").innerHTML += `
<div class=partition data-idpartition="${r.id}">
<h3>${name}</h3>
<div class=groupe data-idgroupe=aucun>
<div>Non affecté(s)</div>
<div class=etudiants>${outputGroupes}</div>
</div>
</div>`;
} else { } else {
div.dataset.idgroupe = r.id; div.dataset.idgroupe = r.id;
// Ajout du bouton pour chaque étudiant
let idpartition = this.parentElement.dataset.idpartition;
document.querySelectorAll(`#zoneChoix .etudiants [data-idpartition="${idpartition}"]`).forEach(e => {
let etudid = e.parentElement.parentElement.dataset.etudid;
let label = document.createElement("label");
label.innerHTML = `<input type=radio name="${idPartition}-${etudiant.etudid}" value="${r.id}"><span>${name}</span>`;
label.querySelector("input").addEventListener("input", assignment);
e.appendChild(label);
})
// Ajout du groupe dans la zone Groupes
document.querySelector(`#zoneGroupes .partition[data-idpartition="${idpartition}"]`).innerHTML += templateGroupe_zoneGroupes(r.id, name);
} }
}) })