From baa17093834d9ebdc62ac3d6c3650598cd00c07c Mon Sep 17 00:00:00 2001
From: scayac <christophe.scaya@gmail.com>
Date: Sun, 22 Jun 2025 07:52:10 +0200
Subject: [PATCH] =?UTF-8?q?Ajout=20des=20boutons=20individuels=20de=20g?=
 =?UTF-8?q?=C3=A9n=C3=A9ration/r=C3=A9g=C3=A9nration=20des=20appr=C3=A9cia?=
 =?UTF-8?q?tions=20Affichage=20des=20mod=C3=A8les=20du=20plus=20r=C3=A9cen?=
 =?UTF-8?q?t=20au=20plus=20ancien?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .gitignore                                 |  3 +-
 main/templates/resultat_appreciations.html | 66 ++++++++++++++++++++--
 2 files changed, 64 insertions(+), 5 deletions(-)

diff --git a/.gitignore b/.gitignore
index 98ed7c0..d64fc27 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,4 +2,5 @@ venv
 db.sqlite3
 __pycache__
 migrations
-.env
\ No newline at end of file
+.env
+.vscode
\ No newline at end of file
diff --git a/main/templates/resultat_appreciations.html b/main/templates/resultat_appreciations.html
index 633c102..08b9a8f 100644
--- a/main/templates/resultat_appreciations.html
+++ b/main/templates/resultat_appreciations.html
@@ -94,7 +94,7 @@ body, .bg-light {
                                 <div>
                                     <label for="modele-select" class="form-label">Choisir un modèle</label>
                                     <select id="modele-select" class="form-select">
-                                        {% for modele in modeles %}
+                                        {% for modele in modeles|dictsortreversed:'id' %}
                                             <option value="{{ modele.code }}" {% if modele.code == 'gpt-4.1-mini' %}selected{% endif %}>{{ modele.nom }}</option>
                                         {% endfor %}
                                         {% if not modeles or not modeles|dictsort:'code'|length %}
@@ -116,21 +116,23 @@ body, .bg-light {
                             <table class="table table-bordered" id="appreciations-table">
                                 <thead>
                                     <tr>
-                                        <th>Élève</th>
+                                        <th style="width:1%; white-space:nowrap;">Élève</th>
                                         <th>Appréciation</th>
+                                        <th style="width:1%; white-space:nowrap; text-align:center;">Action</th>
                                     </tr>
                                 </thead>
                                 <tbody>
                                 {% if appreciations_json and appreciations_json|length > 0 %}
                                     {% for appreciation in appreciations_json %}
                                         <tr>
-                                            <td class="eleve">{{ appreciation.eleve }}</td>
+                                            <td class="eleve" style="width:1%; white-space:nowrap;">{{ appreciation.eleve }}</td>
                                             <td class="appreciation"></td>
+                                            <td style="width:1%; text-align:center;"><button class="btn btn-outline-primary btn-sm action-generate" type="button">Générer</button></td>
                                         </tr>
                                     {% endfor %}
                                 {% else %}
                                     <tr>
-                                        <td colspan="2"><div class="alert alert-warning mb-0">Aucune appréciation générée.</div></td>
+                                        <td colspan="3"><div class="alert alert-warning mb-0">Aucune appréciation générée.</div></td>
                                     </tr>
                                 {% endif %}
                                 </tbody>
@@ -139,6 +141,21 @@ body, .bg-light {
 let stopGeneration = false;
 let enCours = false;
 
+function updateActionButtons() {
+    const rows = document.querySelectorAll('#appreciations-table tbody tr');
+    rows.forEach(row => {
+        const appreciationCell = row.querySelector('.appreciation');
+        const btn = row.querySelector('.action-generate');
+        if (!btn) return;
+        if (appreciationCell.textContent.trim()) {
+            btn.textContent = 'Régénérer';
+        } else {
+            btn.textContent = 'Générer';
+        }
+        btn.disabled = enCours;
+    });
+}
+
 function getRowsSansAppreciation() {
     return Array.from(document.querySelectorAll('#appreciations-table tbody tr')).filter(row => !row.querySelector('.appreciation').textContent.trim());
 }
@@ -165,13 +182,16 @@ document.addEventListener('DOMContentLoaded', function() {
 
     function traiterLignes() {
         rows = getRowsSansAppreciation();
+        updateActionButtons();
         if (rows.length === 0 || stopGeneration) {
             enCours = false;
+            updateActionButtons();
             if (stopGeneration) setButtonState('continuer');
             else setButtonState('lancer');
             return;
         }
         enCours = true;
+        updateActionButtons();
         setButtonState('arreter');
         const row = rows[0];
         const eleve = row.querySelector('.eleve').textContent;
@@ -188,6 +208,7 @@ document.addEventListener('DOMContentLoaded', function() {
         .then(response => response.json())
         .then(data => {
             appreciationCell.textContent = data.appreciation;
+            updateActionButtons();
             if (typeof data.credit !== 'undefined') {
                 creditRestant.textContent = 'Crédits restants : ' + data.credit;
             }
@@ -203,6 +224,7 @@ document.addEventListener('DOMContentLoaded', function() {
         })
         .catch(() => {
             appreciationCell.textContent = 'Erreur lors de la génération';
+            updateActionButtons();
             traiterLignes();
         });
     }
@@ -225,7 +247,43 @@ document.addEventListener('DOMContentLoaded', function() {
         }
     });
 
+    // Action individuelle sur bouton Générer/Régénérer
+    document.querySelectorAll('.action-generate').forEach(btn => {
+        btn.addEventListener('click', function() {
+            if (enCours) return;
+            const row = btn.closest('tr');
+            const eleve = row.querySelector('.eleve').textContent;
+            const appreciationCell = row.querySelector('.appreciation');
+            appreciationCell.innerHTML = '<span class="spinner-border spinner-border-sm"></span> Génération...';
+            btn.disabled = true;
+            fetch("{% url 'generer_appreciation_ajax' %}", {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'X-CSRFToken': '{{ csrf_token }}'
+                },
+                body: JSON.stringify({eleve: eleve, modele: selectModele.value})
+            })
+            .then(response => response.json())
+            .then(data => {
+                appreciationCell.textContent = data.appreciation;
+                updateActionButtons();
+                if (typeof data.credit !== 'undefined') {
+                    creditRestant.textContent = 'Crédits restants : ' + data.credit;
+                }
+                if (data.credit === 0) {
+                    creditAlert.classList.remove('d-none');
+                }
+            })
+            .catch(() => {
+                appreciationCell.textContent = 'Erreur lors de la génération';
+                updateActionButtons();
+            });
+        });
+    });
+
     setButtonState('lancer');
+    updateActionButtons();
 });
 </script>
                             <script>