Merge pull request 'Relevé : décision jury + flèches' (#268) from lehmann/ScoDoc-Front:master into master

Reviewed-on: https://scodoc.org/git/ScoDoc/ScoDoc/pulls/268

app/static/css/releve-but.css

@@ -77,6 +77,17 @@ section>div:nth-child(1){
 	display: flex !important;
 }
 
+.listeOff .ue::before,
+.listeOff .module::before,
+.moduleOnOff .ue::before,
+.moduleOnOff .module::before{
+	transform: rotate(0);
+}
+.listeOff .moduleOnOff .ue::before,
+.listeOff .moduleOnOff .module::before{
+	transform: rotate(180deg) !important;
+}
+
 /***********************/
 /* Options d'affichage */
 /***********************/
@@ -118,11 +129,16 @@ section>div:nth-child(1){
 /************/
 /* Semestre */
 /************/
+.flex{
+	display: flex;
+	gap: 16px;
+}
 .infoSemestre{
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: 4px;
+	flex: none;
 }
 .infoSemestre>div{
     border: 1px solid var(--couleurIntense);
@@ -141,7 +157,12 @@ section>div:nth-child(1){
 .rang{
     text-decoration: underline var(--couleurIntense);
 }
-
+.decision{
+	margin: 5px 0;
+	font-weight: bold;
+    font-size: 20px;
+	text-decoration: underline var(--couleurIntense);
+}
 .enteteSemestre{
     color:  black;
     font-weight: bold;
@@ -174,8 +195,21 @@ section>div:nth-child(1){
     display: flex;
     gap: 16px;
     margin: 4px 0 2px 0;
-    overflow: auto;
+    overflow-x: auto;
+	overflow-y: hidden;
 	cursor: pointer;
+	position: relative;
+}
+.module::before, .ue::before {
+	content:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='26px' height='26px' fill='black'><path d='M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z' /></svg>");
+	width: 26px;
+	height: 26px;
+	position: absolute;
+	bottom: 0;
+	left: 50%;
+	margin-left: -13px;
+	transform: rotate(180deg);
+	transition: 0.2s;
 }
 h3{
     display: flex;

app/static/js/releve-but.js

@@ -75,10 +75,15 @@ class releveBUT extends HTMLElement {
 		<!--------------------------->
 		<section>
 			<h2>Semestre </h2>
-			<div class=dateInscription>Inscrit le </div>
+			<div class=flex>
-			<em>Les moyennes servent à situer l'étudiant dans la promotion et ne correspondent pas à des validations de
+				<div class=infoSemestre></div>
-				compétences ou d'UE.</em>
+				<div>
-			<div class=infoSemestre></div>
+					<div class=decision>Validé !</div>
+					<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>
+			</div>
+			
 		</section>
 
 		<!--------------------------->
@@ -91,8 +96,7 @@ class releveBUT extends HTMLElement {
 					<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"
+					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">
-						stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
 						<path d="M18 15l-6-6-6 6" />
 					</svg>
 				</div>
@@ -107,8 +111,7 @@ class releveBUT extends HTMLElement {
 			<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"
+					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">
-						stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
 						<path d="M18 15l-6-6-6 6" />
 					</svg>
 				</div>
@@ -120,8 +123,7 @@ class releveBUT extends HTMLElement {
 			<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"
+					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">
-						stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
 						<path d="M18 15l-6-6-6 6" />
 					</svg>
 				</div>
@@ -187,9 +189,9 @@ class releveBUT extends HTMLElement {
 				<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>
+			</div>`;
-			${data.semestre.groupes.map(groupe => {
+			/*${data.semestre.groupes.map(groupe => {
-			return `
+				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>
@@ -198,10 +200,10 @@ class releveBUT extends HTMLElement {
 							<div>Min. groupe :</div><div>${groupe.notes.min}</div>
 						</div>
 					`;
-		}).join("")
+				}).join("")
-			}
+			}*/
-		`;
 		this.shadow.querySelector(".infoSemestre").innerHTML = output;
+		this.shadow.querySelector(".decision").innerHTML = data.semestre.decision.code;
 	}
 
 	/*******************************/