Merge branch 'master' of https://scodoc.org/git/lehmann/ScoDoc-Front into lehmann-master
This commit is contained in:
commit
562888eff6
@ -2,19 +2,6 @@
|
|||||||
/*******************/
|
/*******************/
|
||||||
/* Styles généraux */
|
/* Styles généraux */
|
||||||
/*******************/
|
/*******************/
|
||||||
:root{
|
|
||||||
--couleurPrincipale: rgb(240,250,255);
|
|
||||||
--couleurFondTitresUE: rgb(206,255,235);
|
|
||||||
--couleurFondTitresRes: rgb(125, 170, 255);
|
|
||||||
--couleurFondTitresSAE: rgb(255, 190, 69);
|
|
||||||
--couleurSecondaire: #fec;
|
|
||||||
--couleurIntense: #c09;
|
|
||||||
--couleurSurlignage: rgba(232, 255, 132, 0.47);
|
|
||||||
}
|
|
||||||
body{
|
|
||||||
font-family: arial;
|
|
||||||
background: #f0f0f0;
|
|
||||||
}
|
|
||||||
.wait{
|
.wait{
|
||||||
width: 60px;
|
width: 60px;
|
||||||
height: 6px;
|
height: 6px;
|
||||||
@ -26,6 +13,13 @@ body{
|
|||||||
100%{transform: translateY(40px) rotate(1turn);}
|
100%{transform: translateY(40px) rotate(1turn);}
|
||||||
}
|
}
|
||||||
main{
|
main{
|
||||||
|
--couleurPrincipale: rgb(240,250,255);
|
||||||
|
--couleurFondTitresUE: rgb(206,255,235);
|
||||||
|
--couleurFondTitresRes: rgb(125, 170, 255);
|
||||||
|
--couleurFondTitresSAE: rgb(255, 190, 69);
|
||||||
|
--couleurSecondaire: #fec;
|
||||||
|
--couleurIntense: #c09;
|
||||||
|
--couleurSurlignage: rgba(232, 255, 132, 0.47);
|
||||||
max-width: 1000px;
|
max-width: 1000px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
display: none;
|
display: none;
|
||||||
@ -82,9 +76,7 @@ section>div:nth-child(1){
|
|||||||
.hide_coef .synthese em,
|
.hide_coef .synthese em,
|
||||||
.hide_coef .eval>em,
|
.hide_coef .eval>em,
|
||||||
.hide_date_inscr .dateInscription,
|
.hide_date_inscr .dateInscription,
|
||||||
.hide_ects .ects
|
.hide_ects .ects{
|
||||||
|
|
||||||
{
|
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -167,9 +159,6 @@ section>div:nth-child(1){
|
|||||||
margin: 4px 0 2px 0;
|
margin: 4px 0 2px 0;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
}
|
}
|
||||||
.sae .module, .sae .module h3 {
|
|
||||||
background: #d3ffff;
|
|
||||||
}
|
|
||||||
h3{
|
h3{
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -180,6 +169,9 @@ h3{
|
|||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
background: var(--couleurSecondaire);
|
background: var(--couleurSecondaire);
|
||||||
}
|
}
|
||||||
|
.sae .module, .sae h3{
|
||||||
|
background: var(--couleurFondTitresSAE);
|
||||||
|
}
|
||||||
|
|
||||||
.moyenne{
|
.moyenne{
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
@ -1,242 +0,0 @@
|
|||||||
/* Il manque :
|
|
||||||
- rangs
|
|
||||||
- Synthèse : moyenne UE
|
|
||||||
- Synthèse : min, max, moy classe
|
|
||||||
- Synthèse : absences
|
|
||||||
- Eval : absences
|
|
||||||
|
|
||||||
Moi :
|
|
||||||
"show_codemodules" :true,
|
|
||||||
"show_minmax": true,
|
|
||||||
"show_minmax_eval": true,
|
|
||||||
"show_minmax_mod": false,
|
|
||||||
"show_mod_rangs": false,
|
|
||||||
"show_moypromo": true,
|
|
||||||
"show_rangs": true,
|
|
||||||
"show_ue_cap_current": true,
|
|
||||||
"show_ue_cap_details": true,
|
|
||||||
"show_ue_rangs": true,
|
|
||||||
"show_uevalid": true,
|
|
||||||
*/
|
|
||||||
/*****************************/
|
|
||||||
/* Gestionnaire d'événements */
|
|
||||||
/*****************************/
|
|
||||||
document.querySelectorAll(".CTA_Liste").forEach(e => {
|
|
||||||
e.addEventListener("click", listeOnOff)
|
|
||||||
})
|
|
||||||
|
|
||||||
function listeOnOff() {
|
|
||||||
this.parentElement.parentElement.classList.toggle("listeOff")
|
|
||||||
}
|
|
||||||
/*****************************/
|
|
||||||
/* Recupération et affichage */
|
|
||||||
/*****************************/
|
|
||||||
|
|
||||||
fetch(dataSrc)
|
|
||||||
.then(r => { return r.json() })
|
|
||||||
.then(json => showData(json))
|
|
||||||
|
|
||||||
function showData(data) {
|
|
||||||
showInformations(data);
|
|
||||||
showSemestre(data);
|
|
||||||
showSynthese(data);
|
|
||||||
showEvaluations(data);
|
|
||||||
|
|
||||||
setOptions(data.options);
|
|
||||||
|
|
||||||
document.body.classList.add("ready");
|
|
||||||
}
|
|
||||||
|
|
||||||
/********************************/
|
|
||||||
/* Informations sur l'étudiant */
|
|
||||||
/********************************/
|
|
||||||
function showInformations(data) {
|
|
||||||
document.querySelector(".studentPic").src = data.etudiant.photo_url || "default_Student.svg";
|
|
||||||
|
|
||||||
let output = `
|
|
||||||
<div class=info_etudiant>
|
|
||||||
<div class=civilite>
|
|
||||||
${civilite(data.etudiant.civilite)}
|
|
||||||
${data.etudiant.nom}
|
|
||||||
${data.etudiant.prenom}`;
|
|
||||||
|
|
||||||
if (data.etudiant.date_naissance) {
|
|
||||||
output += `né${(data.etudiant.civilite == "F") ? "e" : ""} le ${ISOToDate(data.etudiant.date_naissance)}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
output += `
|
|
||||||
</div>
|
|
||||||
<div class=numerosEtudiant>
|
|
||||||
Numéro étudiant : ${data.etudiant.code_nip}
|
|
||||||
Code INE : ${data.etudiant.code_ine}
|
|
||||||
</div>
|
|
||||||
<div>${data.formation.titre}</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
document.querySelector(".infoEtudiant").innerHTML = output;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*******************************/
|
|
||||||
/* Information sur le semestre */
|
|
||||||
/*******************************/
|
|
||||||
function showSemestre(data) {
|
|
||||||
document.querySelector("h2").innerHTML += data.semestre.numero;
|
|
||||||
document.querySelector(".dateInscription").innerHTML += ISOToDate(data.semestre.inscription);
|
|
||||||
let output = `
|
|
||||||
<div>
|
|
||||||
<div class=enteteSemestre>Moyenne</div><div class=enteteSemestre>${data.semestre.notes.value}</div>
|
|
||||||
<div class=rang>Rang :</div><div class=rang>${data.semestre.rang.value} / ${data.semestre.rang.total}</div>
|
|
||||||
<div>Max. promo. :</div><div>${data.semestre.notes.max}</div>
|
|
||||||
<div>Moy. promo. :</div><div>${data.semestre.notes.moy}</div>
|
|
||||||
<div>Min. promo. :</div><div>${data.semestre.notes.min}</div>
|
|
||||||
</div>
|
|
||||||
${data.semestre.groupes.map(groupe => {
|
|
||||||
return `
|
|
||||||
<div>
|
|
||||||
<div class=enteteSemestre>Groupe</div><div class=enteteSemestre>${groupe.nom}</div>
|
|
||||||
<div class=rang>Rang :</div><div class=rang>${groupe.rang.value} / ${groupe.rang.total}</div>
|
|
||||||
<div>Max. groupe :</div><div>${groupe.notes.max}</div>
|
|
||||||
<div>Moy. groupe :</div><div>${groupe.notes.min}</div>
|
|
||||||
<div>Min. groupe :</div><div>${groupe.notes.min}</div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
}).join("")
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
document.querySelector(".infoSemestre").innerHTML = output;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*******************************/
|
|
||||||
/* Synthèse */
|
|
||||||
/*******************************/
|
|
||||||
function showSynthese(data) {
|
|
||||||
let output = ``;
|
|
||||||
Object.entries(data.ues).forEach(([ue, dataUE]) => {
|
|
||||||
output += `
|
|
||||||
<div class=ue>
|
|
||||||
<h3>
|
|
||||||
${(dataUE.competence) ? dataUE.competence + " - " : ""}${ue}
|
|
||||||
</h3>
|
|
||||||
<div>
|
|
||||||
<div class=moyenne>Moyenne : ${dataUE.moyenne?.value || "-"}</div>
|
|
||||||
<div class=info>
|
|
||||||
Bonus : ${dataUE.bonus || 0} -
|
|
||||||
Malus : ${dataUE.malus || 0}
|
|
||||||
<span class=ects> -
|
|
||||||
ECTS : ${dataUE.ECTS.acquis} / ${dataUE.ECTS.total}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class=absences>
|
|
||||||
<div>Abs N.J.</div><div>${dataUE.absences?.injustifie || 0}</div>
|
|
||||||
<div>Total</div><div>${dataUE.absences?.total || 0}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
${synthese(dataUE.ressources)}
|
|
||||||
${synthese(dataUE.saes)}
|
|
||||||
`;
|
|
||||||
});
|
|
||||||
document.querySelector(".synthese").innerHTML = output;
|
|
||||||
|
|
||||||
function synthese(modules) {
|
|
||||||
let output = "";
|
|
||||||
Object.entries(modules).forEach(([module, dataModule]) => {
|
|
||||||
let titre = data.ressources[module]?.titre || data.saes[module]?.titre;
|
|
||||||
let url = data.ressources[module]?.url || data.saes[module]?.url;
|
|
||||||
output += `
|
|
||||||
<div class=syntheseModule>
|
|
||||||
<div><a href="${url}">${module} - ${titre}</a></div>
|
|
||||||
<div>
|
|
||||||
${dataModule.moyenne}
|
|
||||||
<em>Coef. ${dataModule.coef}</em>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
})
|
|
||||||
return output;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/*******************************/
|
|
||||||
/* Evaluations */
|
|
||||||
/*******************************/
|
|
||||||
function showEvaluations(data) {
|
|
||||||
document.querySelector(".evaluations").innerHTML = module(data.ressources);
|
|
||||||
document.querySelector(".sae").innerHTML += module(data.saes);
|
|
||||||
|
|
||||||
function module(module) {
|
|
||||||
let output = "";
|
|
||||||
Object.entries(module).forEach(([numero, content]) => {
|
|
||||||
output += `
|
|
||||||
<div>
|
|
||||||
<div class=module>
|
|
||||||
<h3><a href="${content.url}">${numero} - ${content.titre}</a></h3>
|
|
||||||
|
|
||||||
<div class=absences>
|
|
||||||
<div>Abs inj.</div><div>${content.absences?.injustifie || 0}</div>
|
|
||||||
<div>Total</div><div>${content.absences?.total || 0}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
${evaluation(content.evaluations)}
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
})
|
|
||||||
return output;
|
|
||||||
}
|
|
||||||
|
|
||||||
function evaluation(evaluations) {
|
|
||||||
let output = "";
|
|
||||||
evaluations.forEach(eval => {
|
|
||||||
output += `
|
|
||||||
<div class=eval>
|
|
||||||
<div><a href="${eval.url}">${eval.description}</a></div>
|
|
||||||
<div>
|
|
||||||
${eval.note.value}
|
|
||||||
<em>Coef. ${eval.coef}</em>
|
|
||||||
</div>
|
|
||||||
<div class=complement>
|
|
||||||
<div>Coef</div><div>${eval.coef}</div>
|
|
||||||
<div>Max. promo.</div><div>${eval.note.max}</div>
|
|
||||||
<div>Moy. promo.</div><div>${eval.note.moy}</div>
|
|
||||||
<div>Min. promo.</div><div>${eval.note.min}</div>
|
|
||||||
${Object.entries(eval.poids).map(([UE, poids]) => {
|
|
||||||
return `
|
|
||||||
<div>Poids ${UE}</div>
|
|
||||||
<div>${poids}</div>
|
|
||||||
`;
|
|
||||||
}).join("")}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`;
|
|
||||||
})
|
|
||||||
return output;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/********************/
|
|
||||||
/* Options */
|
|
||||||
/********************/
|
|
||||||
function setOptions(options) {
|
|
||||||
Object.entries(options).forEach(([option, value]) => {
|
|
||||||
if (value === false) {
|
|
||||||
document.body.classList.add(option.replace("show", "hide"))
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/********************/
|
|
||||||
/* Fonctions d'aide */
|
|
||||||
/********************/
|
|
||||||
function civilite(txt) {
|
|
||||||
switch (txt) {
|
|
||||||
case "M": return "M.";
|
|
||||||
case "F": return "Mme";
|
|
||||||
default: return "";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function ISOToDate(ISO) {
|
|
||||||
return ISO.split("-").reverse().join("/");
|
|
||||||
}
|
|
||||||
329
app/static/js/releve-but.js
Normal file
329
app/static/js/releve-but.js
Normal file
@ -0,0 +1,329 @@
|
|||||||
|
class releveBUT extends HTMLElement {
|
||||||
|
constructor(){
|
||||||
|
super();
|
||||||
|
this.shadow = this.attachShadow({mode: 'open'});
|
||||||
|
|
||||||
|
/* Config par defaut */
|
||||||
|
this.config = {
|
||||||
|
showURL: true
|
||||||
|
};
|
||||||
|
|
||||||
|
/* Template du module */
|
||||||
|
this.shadow.innerHTML = this.template();
|
||||||
|
|
||||||
|
/* Style du module */
|
||||||
|
const styles = document.createElement('link');
|
||||||
|
styles.setAttribute('rel', 'stylesheet');
|
||||||
|
styles.setAttribute('href', '/ScoDoc/static/css/releve-but.css');
|
||||||
|
this.shadow.appendChild(styles);
|
||||||
|
|
||||||
|
this.shadow.querySelectorAll(".CTA_Liste").forEach(e => {
|
||||||
|
e.addEventListener("click", this.listeOnOff)
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
listeOnOff() {
|
||||||
|
this.parentElement.parentElement.classList.toggle("listeOff")
|
||||||
|
}
|
||||||
|
|
||||||
|
set setConfig(config){
|
||||||
|
this.config.showURL = config.showURL ?? this.config.showURL;
|
||||||
|
}
|
||||||
|
|
||||||
|
set showData(data) {
|
||||||
|
this.showInformations(data);
|
||||||
|
this.showSemestre(data);
|
||||||
|
this.showSynthese(data);
|
||||||
|
this.showEvaluations(data);
|
||||||
|
|
||||||
|
this.setOptions(data.options);
|
||||||
|
|
||||||
|
this.shadow.children[0].classList.add("ready");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
template(){
|
||||||
|
return `
|
||||||
|
<div>
|
||||||
|
<div class="wait"></div>
|
||||||
|
<main class="releve">
|
||||||
|
<!--------------------------->
|
||||||
|
<!-- Info. étudiant -->
|
||||||
|
<!--------------------------->
|
||||||
|
<section class=etudiant>
|
||||||
|
<img class=studentPic src="" alt="Photo de l'étudiant" width=100 height=120>
|
||||||
|
<div class=infoEtudiant></div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!--------------------------->
|
||||||
|
<!-- Semestre -->
|
||||||
|
<!--------------------------->
|
||||||
|
<section>
|
||||||
|
<h2>Semestre </h2>
|
||||||
|
<div class=dateInscription>Inscrit le </div>
|
||||||
|
<em>Les moyennes servent à situer l'étudiant dans la promotion et ne correspondent pas à des validations de
|
||||||
|
compétences ou d'UE.</em>
|
||||||
|
<div class=infoSemestre></div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!--------------------------->
|
||||||
|
<!-- Synthèse -->
|
||||||
|
<!--------------------------->
|
||||||
|
<section>
|
||||||
|
<div>
|
||||||
|
<div>
|
||||||
|
<h2>Synthèse</h2>
|
||||||
|
<em>La moyenne des ressources dans une UE dépend des poids donnés aux évaluations.</em>
|
||||||
|
</div>
|
||||||
|
<div class=CTA_Liste>
|
||||||
|
Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none"
|
||||||
|
stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M18 15l-6-6-6 6" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class=synthese></div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!--------------------------->
|
||||||
|
<!-- Evaluations -->
|
||||||
|
<!--------------------------->
|
||||||
|
<section>
|
||||||
|
<div>
|
||||||
|
<h2>Ressources</h2>
|
||||||
|
<div class=CTA_Liste>
|
||||||
|
Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none"
|
||||||
|
stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M18 15l-6-6-6 6" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class=evaluations></div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<div>
|
||||||
|
<h2>SAÉ</h2>
|
||||||
|
<div class=CTA_Liste>
|
||||||
|
Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none"
|
||||||
|
stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<path d="M18 15l-6-6-6 6" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class=sae></div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>`;
|
||||||
|
}
|
||||||
|
|
||||||
|
/********************************/
|
||||||
|
/* Informations sur l'étudiant */
|
||||||
|
/********************************/
|
||||||
|
showInformations(data) {
|
||||||
|
this.shadow.querySelector(".studentPic").src = data.etudiant.photo_url || "default_Student.svg";
|
||||||
|
|
||||||
|
let output = `
|
||||||
|
<div class=info_etudiant>
|
||||||
|
<div class=civilite>
|
||||||
|
${this.civilite(data.etudiant.civilite)}
|
||||||
|
${data.etudiant.nom}
|
||||||
|
${data.etudiant.prenom}`;
|
||||||
|
|
||||||
|
if (data.etudiant.date_naissance) {
|
||||||
|
output += ` né${(data.etudiant.civilite == "F") ? "e" : ""} le ${this.ISOToDate(data.etudiant.date_naissance)}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
output += `
|
||||||
|
</div>
|
||||||
|
<div class=numerosEtudiant>
|
||||||
|
Numéro étudiant : ${data.etudiant.code_nip} -
|
||||||
|
Code INE : ${data.etudiant.code_ine}
|
||||||
|
</div>
|
||||||
|
<div>${data.formation.titre}</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
|
this.shadow.querySelector(".infoEtudiant").innerHTML = output;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*******************************/
|
||||||
|
/* Information sur le semestre */
|
||||||
|
/*******************************/
|
||||||
|
showSemestre(data) {
|
||||||
|
this.shadow.querySelector("h2").innerHTML += data.semestre.numero;
|
||||||
|
this.shadow.querySelector(".dateInscription").innerHTML += this.ISOToDate(data.semestre.inscription);
|
||||||
|
let output = `
|
||||||
|
<div>
|
||||||
|
<div class=enteteSemestre>Moyenne</div><div class=enteteSemestre>${data.semestre.notes.value}</div>
|
||||||
|
<div class=rang>Rang :</div><div class=rang>${data.semestre.rang.value} / ${data.semestre.rang.total}</div>
|
||||||
|
<div>Max. promo. :</div><div>${data.semestre.notes.max}</div>
|
||||||
|
<div>Moy. promo. :</div><div>${data.semestre.notes.moy}</div>
|
||||||
|
<div>Min. promo. :</div><div>${data.semestre.notes.min}</div>
|
||||||
|
</div>
|
||||||
|
${data.semestre.groupes.map(groupe => {
|
||||||
|
return `
|
||||||
|
<div>
|
||||||
|
<div class=enteteSemestre>Groupe</div><div class=enteteSemestre>${groupe.nom}</div>
|
||||||
|
<div class=rang>Rang :</div><div class=rang>${groupe.rang.value} / ${groupe.rang.total}</div>
|
||||||
|
<div>Max. groupe :</div><div>${groupe.notes.max}</div>
|
||||||
|
<div>Moy. groupe :</div><div>${groupe.notes.min}</div>
|
||||||
|
<div>Min. groupe :</div><div>${groupe.notes.min}</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}).join("")
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
this.shadow.querySelector(".infoSemestre").innerHTML = output;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*******************************/
|
||||||
|
/* Synthèse */
|
||||||
|
/*******************************/
|
||||||
|
showSynthese(data) {
|
||||||
|
let output = ``;
|
||||||
|
Object.entries(data.ues).forEach(([ue, dataUE]) => {
|
||||||
|
output += `
|
||||||
|
<div class=ue>
|
||||||
|
<h3>
|
||||||
|
${(dataUE.competence) ? dataUE.competence + " - " : ""}${ue}
|
||||||
|
</h3>
|
||||||
|
<div>
|
||||||
|
<div class=moyenne>Moyenne : ${dataUE.moyenne?.value || "-"}</div>
|
||||||
|
<div class=info>
|
||||||
|
Bonus : ${dataUE.bonus || 0} -
|
||||||
|
Malus : ${dataUE.malus || 0}
|
||||||
|
<span class=ects> -
|
||||||
|
ECTS : ${dataUE.ECTS.acquis} / ${dataUE.ECTS.total}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class=absences>
|
||||||
|
<div>Abs N.J.</div><div>${dataUE.absences?.injustifie || 0}</div>
|
||||||
|
<div>Total</div><div>${dataUE.absences?.total || 0}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
${this.synthese(data, dataUE.ressources)}
|
||||||
|
${this.synthese(data, dataUE.saes)}
|
||||||
|
`;
|
||||||
|
});
|
||||||
|
this.shadow.querySelector(".synthese").innerHTML = output;
|
||||||
|
}
|
||||||
|
synthese(data, modules) {
|
||||||
|
let output = "";
|
||||||
|
Object.entries(modules).forEach(([module, dataModule]) => {
|
||||||
|
let titre = data.ressources[module]?.titre || data.saes[module]?.titre;
|
||||||
|
let url = data.ressources[module]?.url || data.saes[module]?.url;
|
||||||
|
output += `
|
||||||
|
<div class=syntheseModule>
|
||||||
|
<div>${this.URL(url, `${module} - ${titre}`)}</div>
|
||||||
|
<div>
|
||||||
|
${dataModule.moyenne}
|
||||||
|
<em>Coef. ${dataModule.coef}</em>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
})
|
||||||
|
return output;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*******************************/
|
||||||
|
/* Evaluations */
|
||||||
|
/*******************************/
|
||||||
|
showEvaluations(data) {
|
||||||
|
this.shadow.querySelector(".evaluations").innerHTML = this.module(data.ressources);
|
||||||
|
this.shadow.querySelector(".sae").innerHTML += this.module(data.saes);
|
||||||
|
}
|
||||||
|
module(module) {
|
||||||
|
let output = "";
|
||||||
|
Object.entries(module).forEach(([numero, content]) => {
|
||||||
|
output += `
|
||||||
|
<div>
|
||||||
|
<div class=module>
|
||||||
|
<h3>${this.URL(content.url, `${numero} - ${content.titre}`)}</h3>
|
||||||
|
<div>
|
||||||
|
<div class=moyenne>Moyenne indicative : ${content.moyenne.value}</div>
|
||||||
|
<div class=info>
|
||||||
|
Classe : ${content.moyenne.moy} -
|
||||||
|
Max : ${content.moyenne.max} -
|
||||||
|
Min : ${content.moyenne.min}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class=absences>
|
||||||
|
<div>Abs inj.</div><div>${content.absences?.injustifie || 0}</div>
|
||||||
|
<div>Total</div><div>${content.absences?.total || 0}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
${this.evaluation(content.evaluations)}
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
})
|
||||||
|
return output;
|
||||||
|
}
|
||||||
|
|
||||||
|
evaluation(evaluations) {
|
||||||
|
let output = "";
|
||||||
|
evaluations.forEach((evaluation) => {
|
||||||
|
output += `
|
||||||
|
<div class=eval>
|
||||||
|
<div>${this.URL(evaluation.url, evaluation.description)}</div>
|
||||||
|
<div>
|
||||||
|
${evaluation.note.value}
|
||||||
|
<em>Coef. ${evaluation.coef}</em>
|
||||||
|
</div>
|
||||||
|
<div class=complement>
|
||||||
|
<div>Coef</div><div>${evaluation.coef}</div>
|
||||||
|
<div>Max. promo.</div><div>${evaluation.note.max}</div>
|
||||||
|
<div>Moy. promo.</div><div>${evaluation.note.moy}</div>
|
||||||
|
<div>Min. promo.</div><div>${evaluation.note.min}</div>
|
||||||
|
${Object.entries(evaluation.poids).map(([UE, poids]) => {
|
||||||
|
return `
|
||||||
|
<div>Poids ${UE}</div>
|
||||||
|
<div>${poids}</div>
|
||||||
|
`;
|
||||||
|
}).join("")}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
})
|
||||||
|
return output;
|
||||||
|
}
|
||||||
|
|
||||||
|
/********************/
|
||||||
|
/* Options */
|
||||||
|
/********************/
|
||||||
|
setOptions(options) {
|
||||||
|
Object.entries(options).forEach(([option, value]) => {
|
||||||
|
if (value === false) {
|
||||||
|
document.body.classList.add(option.replace("show", "hide"))
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/********************/
|
||||||
|
/* Fonctions d'aide */
|
||||||
|
/********************/
|
||||||
|
URL(href, content){
|
||||||
|
if(this.config.showURL){
|
||||||
|
return `<a href=${href}>${content}</a>`;
|
||||||
|
} else {
|
||||||
|
return content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
civilite(txt) {
|
||||||
|
switch (txt) {
|
||||||
|
case "M": return "M.";
|
||||||
|
case "F": return "Mme";
|
||||||
|
default: return "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ISOToDate(ISO) {
|
||||||
|
return ISO.split("-").reverse().join("/");
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
customElements.define('releve-but', releveBUT);
|
||||||
@ -2,87 +2,32 @@
|
|||||||
|
|
||||||
{% block styles %}
|
{% block styles %}
|
||||||
{{super()}}
|
{{super()}}
|
||||||
<link rel="stylesheet" href="/ScoDoc/static/css/bulletin-but.css">
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block app_content %}
|
{% block app_content %}
|
||||||
|
|
||||||
<div class="wait"></div>
|
<releve-but></releve-but>
|
||||||
<main class="releve">
|
|
||||||
<!--------------------------->
|
|
||||||
<!-- Info. étudiant -->
|
|
||||||
<!--------------------------->
|
|
||||||
<section class=etudiant>
|
|
||||||
<img class=studentPic src="" alt="Photo de l'étudiant" width=100 height=120>
|
|
||||||
<div class=infoEtudiant></div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!--------------------------->
|
|
||||||
<!-- Semestre -->
|
|
||||||
<!--------------------------->
|
|
||||||
<section>
|
|
||||||
<h2>Semestre </h2>
|
|
||||||
<div class=dateInscription>Inscrit le </div>
|
|
||||||
<em>Les moyennes servent à situer l'étudiant dans la promotion et ne correspondent pas à des validations de
|
|
||||||
compétences ou d'UE.</em>
|
|
||||||
<div class=infoSemestre></div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!--------------------------->
|
|
||||||
<!-- Synthèse -->
|
|
||||||
<!--------------------------->
|
|
||||||
<section>
|
|
||||||
<div>
|
|
||||||
<div>
|
|
||||||
<h2>Synthèse</h2>
|
|
||||||
<em>La moyenne des ressources dans une UE dépend des poids donnés aux évaluations.</em>
|
|
||||||
</div>
|
|
||||||
<div class=CTA_Liste>
|
|
||||||
Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none"
|
|
||||||
stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<path d="M18 15l-6-6-6 6" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class=synthese></div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!--------------------------->
|
|
||||||
<!-- Evaluations -->
|
|
||||||
<!--------------------------->
|
|
||||||
<section>
|
|
||||||
<div>
|
|
||||||
<h2>Ressources</h2>
|
|
||||||
<div class=CTA_Liste>
|
|
||||||
Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none"
|
|
||||||
stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<path d="M18 15l-6-6-6 6" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class=evaluations></div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<div>
|
|
||||||
<h2>SAÉ</h2>
|
|
||||||
<div class=CTA_Liste>
|
|
||||||
Liste <svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 24 24" fill="none"
|
|
||||||
stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<path d="M18 15l-6-6-6 6" />
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class=sae></div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block scripts %}
|
{% block scripts %}
|
||||||
{{ super() }}
|
{{ super() }}
|
||||||
|
|
||||||
|
<script src="/ScoDoc/static/js/releve-but.js"></script>
|
||||||
<script>
|
<script>
|
||||||
let dataSrc = "{{bul_url|safe}}";
|
let dataSrc = "{{bul_url|safe}}";
|
||||||
|
fetch(dataSrc)
|
||||||
|
.then(r => { return r.json() })
|
||||||
|
.then(json => {
|
||||||
|
let releve = document.querySelector("releve-but");
|
||||||
|
releve.showData = json;
|
||||||
|
// Syle custome à ajouter
|
||||||
|
releve.shadowRoot.innerHTML += `
|
||||||
|
<style>
|
||||||
|
.module>div, .dateInscription{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
</style>`;
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
<script src="/ScoDoc/static/js/bulletin-but.js"></script>
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
Loading…
Reference in New Issue
Block a user