Affichage des livrables sur les details de l'activité

gestion_projet/static/gestion_projet/js/suivi-activites.js

@@ -15,6 +15,11 @@ const tableau_liste_activite = new Tabulator("#tableau-liste-activite", {
 })
 tableau_liste_activite.on("rowClick", function (row, rowData) {
     const data = rowData.getData();   
+    console.log('=== ACTIVITÉ SÉLECTIONNÉE ===');
+    console.log('ID:', data.id);
+    console.log('Budget prévu:', data.budget_prevu);
+    console.log('Budget dépensé:', data.budget_depense);
+    
     $("idDetailActivite").value = data.id;
     $("titreDetailActivite").value = data.titre;
     $("descriptionDetailActivite").value = data.description;
@@ -22,14 +27,79 @@ tableau_liste_activite.on("rowClick", function (row, rowData) {
     $("date_finDetailActivite").value = data.date_fin;
     $("statutDetailActivite").value = data.statut;
     $("budget_prevuDetailActivite").value = data.budget_prevu;
+    $("budget_depenseDetailActivite").value = data.budget_depense || 0;
+    
+    // Vérifier si l'activité est annulée
+    const isAnnulee = data.statut && data.statut.toLowerCase().includes('annul');
+    console.log('Activité annulée?', isAnnulee);
+    
+    // Masquer/Afficher les boutons d'action selon le statut
+    const btnAnnuler = $("btnAnnulerActivite");
+    const btnMiseAJour = $("btnMiseAJourDepense");
+    const btnAjouterLivrable = $("btnOuvrirAjouterLivrable");
+    
+    if (isAnnulee) {
+        // Activité annulée : masquer les boutons
+        if (btnAnnuler) btnAnnuler.style.display = "none";
+        if (btnMiseAJour) btnMiseAJour.style.display = "none";
+        if (btnAjouterLivrable) btnAjouterLivrable.style.display = "none";
+        console.log('✓ Boutons masqués - activité annulée');
+    } else {
+        // Activité active : afficher les boutons
+        if (btnAnnuler) btnAnnuler.style.display = "block";
+        if (btnMiseAJour) btnMiseAJour.style.display = "block";
+        if (btnAjouterLivrable) btnAjouterLivrable.style.display = "block";
+        console.log('✓ Boutons affichés - activité active');
+    }
+    
+    // Vérifier si les budgets sont différents
+    const budgetPrevu = parseFloat(data.budget_prevu) || 0;
+    const budgetDepense = parseFloat(data.budget_depense) || 0;
+    const isDifferent = budgetDepense !== budgetPrevu;
+    
+    console.log('Budget prévu:', budgetPrevu);
+    console.log('Budget dépensé:', budgetDepense);
+    console.log('Sont-ils différents?', isDifferent);
+    
+    // Masquer/Afficher le conteneur du motif
+    const motifContainer = $("motif_container");
+    if (motifContainer) {
+        if (isDifferent) {
+            motifContainer.style.display = "block";
+            $("motif_changement_budgetDetailActivite").value = data.motif_changement_budget || "";
+            console.log('✓ Motif AFFICHÉ - budgets différents');
+        } else {
+            motifContainer.style.display = "none";
+            $("motif_changement_budgetDetailActivite").value = "";
+            console.log('✓ Motif MASQUÉ - budgets identiques');
+        }
+    } else {
+        console.error('❌ Élément motif_container introuvable!');
+    }
+    
     $("besoin_ressources_materiellesDetailActivite").value = data.besoin_ressource_materielle;
     const modal = new bootstrap.Modal($("modalDetailActivite"));
     modal.show();
 
-    fetch(`liste-des-livrables/${data.id}/`)
+    const url_livrables = `/gestion-projet/activite/liste-des-livrables/${data.id}/`;
-        .then(response => response.json())
+    console.log('URL des livrables:', url_livrables);
+    
+    fetch(url_livrables)
+        .then(response => {
+            console.log('Réponse status:', response.status);
+            return response.json();
+        })
         .then(livrables => {
+            console.log('Livrables reçus:', livrables);
+            console.log('Nombre de livrables:', livrables.length);
             tableau_liste_livrable.setData(livrables);
+            $("nombreLivrables").textContent = livrables.length;
+            console.log('Tableau mis à jour avec', livrables.length, 'livrables');
+        })
+        .catch(error => {
+            console.error(' Erreur lors du chargement des livrables:', error);
+            tableau_liste_livrable.setData([]);
+            $("nombreLivrables").textContent = 0;
         })
 })
 
@@ -40,6 +110,7 @@ const tableau_liste_livrable = new Tabulator("#listeLivrables", {
     ],
     placeholder: "Aucun livrable trouvé",
 })
+console.log('✓ Tableau des livrables initialisé');
 
 $("btnMiseAJourDepense").addEventListener("click", function() {
     const modal = new bootstrap.Modal($("modalDepenseActivite"));
@@ -57,3 +128,4 @@ $("btnAnnulerActivite").addEventListener("click", function(event) {
     $("id_activite_annulation").value = $("idDetailActivite").value;
     bootstrap.Modal.getOrCreateInstance($("modalDetailActivite")).hide();
 })
+

gestion_projet/templates/gestion_projet/parts/modalDetailActivite.html

@@ -1,58 +1,111 @@
-<div class="modal fade" id="modalDetailActivite" tabindex="-1">
+<div class="modal fade" id="modalDetailActivite" tabindex="-1"
-    <div class="modal-dialog">
+    aria-labelledby="modalDetailActiviteLabel" aria-hidden="true">
+    <div class="modal-dialog modal-lg modal-dialog-centered">
         <div class="modal-content">
-            <div class="modal-header bg-orange-dark">
+             <div class="modal-header bg-orange-dark text-black">
-                <h5 class="modal-title">Détails de l'activité</h5>
+                <h5 class="modal-title" id="modalDetailActiviteLabel">
-                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
+                    <i class="bi bi-clipboard-check me-2"></i>
+                    Détails de l'activité
+                </h5>
+                <button type="button"class="btn-close btn-close-white" data-bs-dismiss="modal"
+                    aria-label="Fermer">
+                </button>
             </div>
-            <div class="modal-body">
+            <div class="modal-body" data-url-livrables="{% url 'gestion_projet:liste-livrables-activite' activite_id=0 %}">
+                <input type="hidden" id="idDetailActivite">
                 <div class="row g-3">
-                    <div class="">
+                    <div class="col-12">
-                        <input type="hidden" id="idDetailActivite">
+                        <label for="titreDetailActivite" class="form-label fw-bold">
-                        <div class="form-group mb-2">
+                            Titre :
-                            <label>Titre :</label>
+                        </label>
-                            <input type="text" class="form-control" id="titreDetailActivite">
+                        <input type="text"class="form-control" id="titreDetailActivite"readonly>
+                    </div>
+                    <div class="col-12">
+                        <label for="descriptionDetailActivite" class="form-label fw-bold">
+                            Description :
+                        </label>
+                        <textarea class="form-control"id="descriptionDetailActivite" rows="3" readonly></textarea>
+                    </div>
+                    <div class="col-md-6">
+                        <label for="date_debutDetailActivite"class="form-label fw-bold">
+                            Date de début :
+                        </label>
+                        <input type="date"class="form-control"id="date_debutDetailActivite"readonly>
+                    </div>
+                    <div class="col-md-6">
+                        <label for="date_finDetailActivite"class="form-label fw-bold">
+                            Date de fin :
+                        </label>
+                        <input type="date"class="form-control"id="date_finDetailActivite"readonly>
+                    </div>
+                    <div class="col-md-6">
+                        <label for="statutDetailActivite" class="form-label fw-bold">
+                            Statut :
+                        </label>
+                        <input type="text"class="form-control"id="statutDetailActivite"readonly>
+                    </div>
+                    <div class="col-md-6">
+                        <label for="budget_prevuDetailActivite"class="form-label fw-bold">
+                            Budget prévu :
+                        </label>
+                        <input type="number"class="form-control" id="budget_prevuDetailActivite"readonly>
+                    </div>
+                    <div class="col-md-6">
+                        <label for="budget_depenseDetailActivite"class="form-label fw-bold">
+                            Montant dépensé (GNF) :
+                        </label>
+                        <input type="number"class="form-control" id="budget_depenseDetailActivite"readonly>
+                    </div>
+                    <div class="col-12" id="motif_container">
+                        <label for="motif_changement_budgetDetailActivite"class="form-label fw-bold">
+                            Motif de différence :
+                        </label>
+                        <textarea class="form-control"id="motif_changement_budgetDetailActivite"rows="2"readonly></textarea>
+                    </div>
+                    <div class="col-12">
+                        <label for="besoin_ressources_materiellesDetailActivite"class="form-label fw-bold">
+                            Besoin de ressources matérielles :
+                        </label>
+                        <textarea class="form-control"id="besoin_ressources_materiellesDetailActivite"rows="3"readonly></textarea>
+                    </div>
+                   <div class="col-12 mt-4">
+
+                        <div class="d-flex justify-content-between align-items-center mb-3">
+                            <h5 class="mb-0 fw-bold">
+                                <i class="bi bi-box-seam me-2"></i>
+                                Liste des livrables
+                            </h5>
+                            <span class="badge bg-primary" id="nombreLivrables">
+                                0
+                            </span>
                         </div>
-                        <div class="form-group mb-2">
-                            <label>Description :</label>
-                            <textarea class="form-control" id="descriptionDetailActivite"></textarea>
-                        </div>
-                         <div class="form-group mb-2">
-                            <label>Date de début :</label>
-                            <input type="date" class="form-control" id="date_debutDetailActivite">
-                        </div>
-                         <div class="form-group mb-2">
-                            <label>Date de fin :</label>
-                            <input type="date" class="form-control" id="date_finDetailActivite">
-                        </div>
-                        <div class="form-group mb-2">
-                            <label>Statut:</label>
-                            <input type="text" class="form-control" id="statutDetailActivite">
-                        </div>
-                        <div class="form-group mb-2">
-                            <label>Budget prévu :</label>
-                            <input type="number" class="form-control" id="budget_prevuDetailActivite">
-                        </div>
-                        <div class="form-group mb-2">
-                            <label>Besoin de ressources matérielles:</label>
-                            <textarea class="form-control" id="besoin_ressources_materiellesDetailActivite"></textarea>
-                        </div>
-                        <p><strong>Liste des livrables :</strong></p>
                         <div id="listeLivrables"></div>
-                        <button class="btn btn-danger d-block mx-auto" id="btnAnnulerActivite">
+                    </div>
+
+                    <div class="col-12 mt-3 text-center">
+                        <button type="button"class="btn btn-danger"id="btnAnnulerActivite">
+                            <i class="bi bi-x-circle me-2"></i>
                             Annuler cette activité
                         </button>
                     </div>
                 </div>
             </div>
             <div class="modal-footer">
-                <button class="btn btn-success" id="btnMiseAJourDepense">
+                <button type="button"class="btn btn-success"id="btnMiseAJourDepense">
-                    <i class="bi bi-plus-circle"></i> Mise à jour du budget 
+                    <i class="bi bi-cash-stack me-2"></i>
+                    Mise à jour du budget
                 </button>
-                <button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalAjouterLivrable">
+                <button type="button"class="btn btn-primary"id="btnOuvrirAjouterLivrable"data-bs-toggle="modal"
-                    <i class="bi bi-plus-circle"></i> Ajouter un livrable 
+                        data-bs-target="#modalAjouterLivrable">
+                    <i class="bi bi-plus-circle me-2"></i>
+                    Ajouter un livrable
+                </button>
+                <button type="button" class="btn btn-secondary"data-bs-dismiss="modal">
+                    Fermer
                 </button>
             </div>
         </div>
     </div>
 </div>
+
+

gestion_projet/views.py

@@ -381,15 +381,32 @@ def liste_activites_projet(request):
 @login_required
 def liste_livrables_activite(request, activite_id):
     """Vue pour retourner la liste des livrables attendus d'une activité spécifique"""
-    livrables = LivrablesLivres.objects.filter(activite__id=activite_id)
+    try:
-    data = []
+        livrables = LivrablesLivres.objects.filter(activite__id=activite_id)
-    for livrable in livrables:
+        data = []
-        print(livrable.fichier.url)
+        
-        data.append({
+        for livrable in livrables:
-            "titre": livrable.nom,
+            lien = ""
-            "lien": livrable.fichier.url if livrable.fichier else "",
+            if livrable.fichier:
-        })
+                try:
-    return JsonResponse(data, safe=False)
+                    lien = livrable.fichier.url
+                except Exception as e:
+                    print(f"[DEBUG] Erreur accès URL fichier {livrable.nom}: {e}")
+                    lien = ""
+            
+            data.append({
+                "titre": livrable.nom,
+                "lien": lien,
+            })
+        
+        print(f"[DEBUG] ✓ Livrables activité {activite_id}: {len(data)} trouvés")
+        return JsonResponse(data, safe=False)
+        
+    except Exception as e:
+        print(f"[DEBUG]  Erreur liste_livrables_activite: {e}")
+        import traceback
+        traceback.print_exc()
+        return JsonResponse({"error": f"Erreur serveur: {str(e)}"}, status=500)
 
 @login_required
 def mises_a_jour_depense_activite(request):