WIP: jury BUT: formulaire avec style (merci @sebL)

app/but/jury_but.py

@@ -266,6 +266,8 @@ class DecisionsProposeesAnnee(DecisionsProposees):
         explanation: {self.explanation}
         """
 
+    def annee_scolaire_sr(self)
+
     def comp_formsemestres(
         self, formsemestre: FormSemestre
     ) -> tuple[FormSemestre, FormSemestre]:

app/static/css/jury_but.css

@@ -0,0 +1,68 @@
+/* Saisie décision de jury BUT */
+
+.jury_but {
+    font-family: Verdana, Geneva, Tahoma, sans-serif;
+}
+
+.but_annee {
+    display: inline-grid;
+    grid-template-columns: repeat(4, auto);
+    gap: 4px;
+}
+
+.but_annee_caption {
+    grid-column: 4 / 5;
+}
+
+.but_annee_caption,
+.but_niveau_titre {
+    background: #09c !important;
+    color: #FFF;
+    padding: 8px !important;
+}
+
+.but_annee>* {
+    display: flex;
+    align-items: center;
+    padding: 0px 16px;
+    background: #FFF;
+    border: 1px solid #aaa;
+    border-radius: 8px;
+}
+
+.but_annee>div.titre {
+    background: rgb(242, 242, 238);
+    border: none;
+    border-radius: 0px;
+    border-bottom: 1px solid gray;
+}
+
+.but_niveau_ue>div:nth-child(1),
+.but_note {
+    border-right: 1px solid #aaa;
+    padding: 8px;
+}
+
+.but_annee select {
+    padding: 8px 8px;
+    border: none;
+}
+
+.but_niveau_rcue,
+.but_niveau_rcue>* {
+    border-color: #09c;
+    font-weight: bold;
+}
+
+div.but_section_annee {
+    margin-bottom: 10px;
+}
+
+div.but_settings {
+    margin-top: 16px;
+}
+
+span.but_explanation {
+    color: blueviolet;
+    font-style: italic;
+}

app/static/js/jury_but.js

@@ -0,0 +1,6 @@
+
+
+// active les menus des codes "manuels" (année, RCUEs)
+function enable_manual_codes(elt) {
+    $(".jury_but select.manual").prop("disabled", !elt.checked);
+}

app/views/notes.py

@@ -2234,10 +2234,13 @@ def formsemestre_validation_but(formsemestre_id: int, etudid: int):
     # XXX TODO  Page expérimentale pour les devs
     H = [
         html_sco_header.sco_header(
-            page_title="Validation BUT", formsemestre_id=formsemestre_id, etudid=etudid
+            page_title="Validation BUT",
+            formsemestre_id=formsemestre_id,
+            etudid=etudid,
+            cssstyles=("css/jury_but.css",),
+            javascripts=("js/jury_but.js",),
         ),
         f"""
-        <h2>Jury BUT</h2>
         <div class="jury_but">
         """,
     ]
@@ -2248,21 +2251,30 @@ def formsemestre_validation_but(formsemestre_id: int, etudid: int):
 
     H.append(
         f"""
-    <div class="titre_parcours">Parcours: {deca.parcour.libelle or "non spécifié"}
-    en BUT{deca.annee_but}
+    <form method="POST">
+    <div class="titre_parcours"><h2>Jury BUT{deca.annee_but} - Parcours {deca.parcour.libelle or "non spécifié"}
+    - {deca.formsemestre_impair.annee_scolaire_str()}</h2>
     </div>
-    <p>Année: <em>{deca.explanation}</em><br>{
-        _gen_but_select("code_annee", deca.codes, deca.code_valide)
-    }</p>
-    <h2>Niveaux de compétences</h2>
+    <div class="but_section_annee">
+        <div>
+        <b>Décision de jury pour l'année :</b> {
+            _gen_but_select("code_annee", deca.codes, deca.code_valide, disabled=True, klass="manual")
+        }</div>
+        <span class="but_explanation">{deca.explanation}</span>
+    </div>
+    <b>Niveaux de compétences et unités d'enseignement :</b>
     <div class="but_annee">
+    <div class="titre"></div>
+    <div class="titre">S{1}</div>
+    <div class="titre">S{2}</div>
+    <div class="titre">RCUE</div>
     """
     )
 
     for niveau in deca.niveaux_competences:
         H.append(
             f"""<div class="but_niveau_titre">
-            <span title="{niveau.competence.titre_long}">{niveau.competence.titre}</span>
+            <div title="{niveau.competence.titre_long}">{niveau.competence.titre}</div>
             </div>"""
         )
         dec_rcue = deca.decisions_rcue_by_niveau[niveau.id]
@@ -2270,44 +2282,52 @@ def formsemestre_validation_but(formsemestre_id: int, etudid: int):
         ue = dec_rcue.rcue.ue_1
         H.append(
             f"""<div class="but_niveau_ue">
-            <span title="{ue.titre}">{ue.acronyme}</span>
-            <span class="but_note">{scu.fmt_note(dec_rcue.rcue.moy_ue_1)}</span>
-            <span class="but_code">{
+            <div title="{ue.titre}">{ue.acronyme}</div>
+            <div class="but_note">{scu.fmt_note(dec_rcue.rcue.moy_ue_1)}</div>
+            <div class="but_code">{
                 _gen_but_select("code_ue_"+str(ue.id), 
                     deca.decisions_ues[ue.id].codes, 
                     deca.decisions_ues[ue.id].code_valide
                 )
-            }</span>
+            }</div>
             </div>"""
         )
         # Semestre pair
         ue = dec_rcue.rcue.ue_2
         H.append(
             f"""<div class="but_niveau_ue">
-            <span title="{ue.titre}">{ue.acronyme}</span>
-            <span class="but_note">{scu.fmt_note(dec_rcue.rcue.moy_ue_2)}</span>
-            <span class="but_code">{
+            <div title="{ue.titre}">{ue.acronyme}</div>
+            <div class="but_note">{scu.fmt_note(dec_rcue.rcue.moy_ue_2)}</div>
+            <div class="but_code">{
                 _gen_but_select("code_ue_"+str(ue.id), 
                     deca.decisions_ues[ue.id].codes, 
                     deca.decisions_ues[ue.id].code_valide
                 )
-            }</span>
+            }</div>
             </div>"""
         )
         # RCUE
         H.append(
             f"""<div class="but_niveau_rcue">
-            <span class="but_note">{scu.fmt_note(dec_rcue.rcue.moy_rcue)}</span>
-            <span class="but_code">{
+            <div class="but_note">{scu.fmt_note(dec_rcue.rcue.moy_rcue)}</div>
+            <div class="but_code">{
                 _gen_but_select("code_rcue_"+str(niveau.id),
                     dec_rcue.codes,
-                    dec_rcue.code_valide
+                    dec_rcue.code_valide,
+                    disabled=True, klass="manual"
                 )
-            }</span>
+            }</div>
             </div>"""
         )
     H.append("</div>")  # but_annee
 
+    H.append(
+        """<div class="but_settings"><input type="checkbox" onchange="enable_manual_codes(this)">
+        <em>permettre la saisie manuelles des codes d'année et de niveaux</em>
+        </input></div>"""
+    )
+    H.append("</form>")  # but_annee
+
     # ---- Toutes les UEs, pour infos
     H.append(f"<ul>")
     for ue in formsemestre.query_ues():  # volontairement toutes les UE
@@ -2318,7 +2338,13 @@ def formsemestre_validation_but(formsemestre_id: int, etudid: int):
     return "\n".join(H) + html_sco_header.sco_footer()
 
 
-def _gen_but_select(name: str, codes: list[str], code_valide: str) -> str:
+def _gen_but_select(
+    name: str,
+    codes: list[str],
+    code_valide: str,
+    disabled: bool = False,
+    klass: str = "",
+) -> str:
     "Le menu html select avec les codes"
     h = "\n".join(
         [
@@ -2326,7 +2352,7 @@ def _gen_but_select(name: str, codes: list[str], code_valide: str) -> str:
             for code in codes
         ]
     )
-    return f"""<select name="{name}">{h}</select>"""
+    return f"""<select name="{name}" class="{klass}" {"disabled" if disabled else ""}>{h}</select>"""
 
 
 @bp.route("/formsemestre_validate_previous_ue", methods=["GET", "POST"])