Mon commit initial

static/js/gestion_produit.js

@@ -0,0 +1,231 @@
+const $ = (id) => document.getElementById(id);
+
+document.addEventListener('DOMContentLoaded', function () {
+  const voirBtns = document.querySelectorAll('.voir-demande');
+  const modal = new bootstrap.Modal($('enregistrerDetailDemande'));
+
+  voirBtns.forEach(btn => {
+    btn.addEventListener('click', function () {
+      const produitId = this.dataset.id;
+
+      fetch(`/gestion-produit/detailDemande/${produitId}/`)
+        .then(response => response.json())
+        .then(data => {
+          $('detailNom').value = data.detailNom;
+          $('detailCategorie').value = data.detailCategorie;
+          $('detailmotif').textContent = data.detailmotif;
+          $('detailDateDemande').value = data.detailDeMiseADispo;
+          $('detailARendre').checked = data.detailARendre ? true : false;
+
+        //   Sauvegarde de l’ID pour les boutons d’action
+          if(data.chef_departement){
+            $('confirmerBtn').dataset.id = produitId;
+            $('refuserBtn').dataset.id = produitId;
+          }
+
+          modal.show();
+        });
+    });
+  });
+
+  function updateStatut(demandeId, action) {
+    fetch('/gestion-produit/update-demande', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/x-www-form-urlencoded',
+      },
+      body: `id=${demandeId}&action=${action}&emetteur=chef`
+    })
+    .then(response => response.json())
+    .then(data => {
+      if (data.success) {
+        alert(`Demande ${action} avec succès !`);
+        location.reload(); // recharge la page pour voir le nouveau statut
+      } else {
+        alert(data.message);
+      }
+    })
+    .catch(error => console.error('Erreur :', error));
+  }
+
+  try{
+    $('confirmerBtn').addEventListener('click', function () {
+      updateStatut(this.dataset.id, '1'); // '1' pour confirmer
+    });
+
+    $('refuserBtn').addEventListener('click', function () {
+      updateStatut(this.dataset.id, '0'); // '0' pour refuser
+    });
+  }catch{
+    
+  }
+  
+
+  const tabulator = new Tabulator("#listeDemandeTable", {
+    columns: [
+      { title: "Nom Produit", field: "produit", sorter: "string" },
+      // { title: "Catégorie", field: "categorie", sorter: "string" },
+      { title: "Motif", field: "motifs", sorter: "string" },
+      { title: "Date de mise à disposition souhaitée", field: "dateDeMiseADispoSouhaite", sorter: "date" },
+      { title: "À Rendre", field: "a_rendre", sorter: "boolean", formatter: "tickCross" },
+      { title: "Validé par le supérieur", field: "valider_par_chef", sorter: "boolean", formatter: "tickCross", formatterParams: {
+            allowEmpty: true
+        } 
+      },
+      { title: "Valider par la logistique", field: "valider_par_logisticien", sorter: "boolean", formatter: "tickCross", formatterParams: {
+            allowEmpty: true
+      }},
+      { title: "Motif de refus", field: "motifs_refus"},
+    ],
+    ajaxURL: `${$("listeDemandeTable").dataset.url}`,
+  })
+
+  // ----------------------------------------------------------- FILTRE
+  $('searchInput').addEventListener('keyup', function() {
+    const filter = this.value.toLowerCase();
+    const cards = document.querySelectorAll('.card');
+    cards.forEach(card => {
+        const title = card.querySelector('.card-title').textContent.toLowerCase();
+        if (title.includes(filter)) {
+            card.style.display = '';
+        } else {
+            card.style.display = 'none';
+        }
+      });
+  })
+
+  // Enregistrement de commande
+  const listeCommanderButton = document.querySelectorAll(".listeCommanderButton");
+  const modalCommander = new bootstrap.Modal($("commanderModal"));
+
+  listeCommanderButton.forEach(commanderButton => {
+    commanderButton.addEventListener("click", function (e) {
+      const idProduit = this.dataset.id;
+      const champs_produit = $("id_produit");
+      const champs_fournisseur = $("id_fournisseur");
+      champs_produit.value = idProduit;
+      // champs_produit.disabled = true;
+
+      fetch(`/gestion-produit/recuperer-fournisseur-categorie/${idProduit}`)
+      .then(response => response.json())
+      .then(data => {
+        champs_fournisseur.innerHTML = "";
+        data.forEach(fournisseur => {
+          const option = document.createElement("option");
+          option.value = fournisseur.id;
+          option.text = fournisseur.nom_fournisseur;
+          champs_fournisseur.appendChild(option);
+        });
+      })
+
+      modalCommander.show();
+    })
+  });
+
+  const listeDemandeButton = document.querySelectorAll(".listeDemandeButton");
+  const demanderModal = new bootstrap.Modal($("demanderModal"));
+
+  listeDemandeButton.forEach(demanderButton => {
+    demanderButton.addEventListener("click", function() {
+      const produitCommanderId = this.dataset.id;
+      const champs_produit = document.querySelector("#demanderModal #id_produit");
+      // champs_produit.disabled = true;
+
+      champs_produit.value = produitCommanderId;
+
+      demanderModal.show();
+    })
+  });
+
+  $("filterCategorie").addEventListener("change", function(){
+    const card = document.querySelectorAll(".card");
+    const filtre = this.value;
+    if(filtre === ""){
+      card.forEach(carte => {
+        carte.style.display = "";
+      });
+    }else{
+      card.forEach(carte => {
+        categorie = carte.querySelector(".categorie-produit").textContent.toLowerCase();
+        if(parseInt(categorie) === parseInt(filtre)){
+          carte.style.display = "";
+        }else{
+          carte.style.display = 'none'
+        }
+      });
+    }
+  })
+
+  $("enregistrement-produit-form").addEventListener("submit", function (e) {
+    e.preventDefault();
+    const form = this;
+    const url = this.dataset.url;
+    // const csrf = 
+    fetch(
+      url,
+      {
+        method: "POST",
+        headers: {
+          "X-Requested-With": "XMLHttpRequest"
+        },
+        body: new FormData(form)
+      }
+    )
+    .then(response => response.json())
+    .then(data => {
+      const messageZone = $("messageZone");
+      if(data.success){
+        messageZone.innerHTML = `
+          <div class="alert alert-success">
+            ${data.message}
+          </div>
+        `;
+        form.reset();
+      }
+    })
+  })
+
+  $('enregistrerProduit').addEventListener("hidden.bs.modal", function () {
+    location.reload()
+  })
+});
+
+
+// --------------------------------- Tableau categorie
+const url_liste_categorie = $("listecategorie").dataset.url;
+const tableau_categorie = new Tabulator("#listecategorie", {
+  columns: [
+    {title: "Nom de la catégorie", field: "categorie"}
+  ],
+  ajaxURL: url_liste_categorie
+})
+
+$("enregistrer-categorie").addEventListener("submit", function (e) {
+  e.preventDefault();
+  const form = this;
+  const url = this.dataset.url;
+
+  fetch(url, {
+    method: "POST",
+    headers:{
+      "X-Requested-With": "XMLHttpResponse"
+    },
+    body: new FormData(form)
+  })
+  .then(response => response.json())
+  .then(data => {
+    if(data.success){
+      const messageBox = $("message-creation-categorie");
+      messageBox.innerHTML = `
+        <div class="alert alert-success">
+          Categorie crée avec succès
+        </div>
+      `;
+      tableau_categorie.setData(url_liste_categorie);
+    }
+  })
+})
+
+$("enregistrerCategorie").addEventListener("hidden.bs.modal", function () {
+  location.reload();
+})