Début du projet

public/js/accueil.js

@@ -0,0 +1,114 @@
+/**
+ * Page d'accueil : statistiques + liste des animaux actifs.
+ */
+
+let utilisateurCourant = null;
+
+async function chargerStatistiques()
+{
+    const stats = await appelerApi("/api/statistiques");
+
+    if (!stats)
+    {
+        return;
+    }
+
+    document.getElementById("statPoules").textContent = stats.nombrePoulesActives;
+    document.getElementById("statCoqs").textContent = stats.nombreCoqsActifs;
+    document.getElementById("statTotal").textContent = stats.nombreTotalActifs;
+    document.getElementById("statPonte").textContent = stats.nombreEnPonte;
+    document.getElementById("statCouvage").textContent = stats.nombreEnCouvage;
+}
+
+async function chargerAnimaux()
+{
+    const animaux = await appelerApi("/api/animaux?actifs=oui");
+
+    if (!animaux)
+    {
+        return;
+    }
+
+    const liste = document.getElementById("listeAnimaux");
+    const messageVide = document.getElementById("messageVide");
+
+    if (animaux.length === 0)
+    {
+        liste.innerHTML = "";
+        messageVide.hidden = false;
+        return;
+    }
+
+    messageVide.hidden = true;
+    liste.innerHTML = animaux.map(htmlCarteAnimal).join("");
+}
+
+function ouvrirDialogueAjout()
+{
+    document.getElementById("titreDialogueAnimal").textContent = "Ajouter un animal";
+    document.getElementById("animalId").value = "";
+    document.getElementById("formAnimal").reset();
+    document.getElementById("erreurAnimal").hidden = true;
+    document.getElementById("dialogueAnimal").showModal();
+}
+
+document.getElementById("boutonNouvelAnimal").addEventListener("click", ouvrirDialogueAjout);
+
+document.getElementById("annulerAnimal").addEventListener("click", function ()
+{
+    document.getElementById("dialogueAnimal").close();
+});
+
+document.getElementById("formAnimal").addEventListener("submit", async function (event)
+{
+    event.preventDefault();
+
+    const erreurAnimal = document.getElementById("erreurAnimal");
+    erreurAnimal.hidden = true;
+
+    const formData = new FormData();
+    formData.append("type", document.getElementById("type").value);
+    formData.append("couleurBague", document.getElementById("couleurBague").value);
+    formData.append("numeroBague", document.getElementById("numeroBague").value);
+    formData.append("dateNaissance", document.getElementById("dateNaissance").value);
+    formData.append("etatSante", document.getElementById("etatSante").value);
+
+    const photo = document.getElementById("photo").files[0];
+    if (photo)
+    {
+        formData.append("photo", photo);
+    }
+
+    try
+    {
+        await appelerApi("/api/animaux", {
+            method: "POST",
+            body: formData
+        });
+
+        document.getElementById("dialogueAnimal").close();
+        await chargerAnimaux();
+        await chargerStatistiques();
+    }
+    catch (erreur)
+    {
+        erreurAnimal.textContent = erreur.message;
+        erreurAnimal.hidden = false;
+    }
+});
+
+async function demarrer()
+{
+    utilisateurCourant = await verifierSession();
+
+    if (!utilisateurCourant)
+    {
+        return;
+    }
+
+    brancherDeconnexion();
+    await chargerStatistiques();
+    await chargerAnimaux();
+}
+
+demarrer();