Ajouts des dernières modifs

2024-10-17 15:45:20 +02:00
parent cad70b9d8e
commit 6e3f952f55
6 changed files with 769 additions and 23 deletions
--- a/MaquetteWEB/html/RH/gestion_personnel.html
+++ b/MaquetteWEB/html/RH/gestion_personnel.html
@@ -21,9 +21,27 @@
            margin-right: 5px;
        }

+        .modal {
+            display: none; /* Caché par défaut */
+            position: fixed; /* Positionnement fixe pour rester visible lors du défilement */
+            z-index: 1000; /* Assurez-vous que le modal est au-dessus d'autres éléments */
+            left: 0;
+            top: 0;
+            width: 100%; /* Pleine largeur */
+            height: 100%; /* Pleine hauteur */
+            background-color: rgba(0, 0, 0, 0.5); /* Fond semi-transparent */
+        }
+
+        /* Contenu du modal */
        .modal-content {
-            max-height: 80vh;
-            overflow-y: auto;
+            background-color: white;
+            margin: 10% auto; /* Centrer verticalement */
+            padding: 20px;
+            border-radius: 8px;
+            width: 80%; /* Largeur du modal */
+            max-width: 600px; /* Largeur maximale */
+            box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3); /* Ombre pour un effet flottant */
+            font-family: Arial, sans-serif;
        }

        .supprimerBouton{
@@ -37,6 +55,17 @@
        .modifierBouton{
            background-color: #28A745;
        }
+
+        ul li a {
+            text-decoration: none; /* Supprime le soulignement des liens */
+            color: #007BFF; /* Couleur de lien bleue */
+            font-weight: bold; /* Met le lien en gras */
+        }
+
+        ul li a:hover {
+            color: #0056b3; /* Couleur plus foncée au survol */
+            text-decoration: underline; /* Ajoute le soulignement au survol */
+        }
    </style>
 </head>

@@ -49,6 +78,7 @@
        <div class="categories">
            <a href="./rh.html">Accueil</a>
            <a href="./gestion_personnel.html">Gestion du personnel</a>
+            <a href="./gestion-heures.html">Heures</a>
            <a href="./candidature.html">Candidatures</a>
            <a href="./mes-informations.html">Mes informations et documents</a>
        </div>
@@ -85,6 +115,7 @@
                        <th>Nom</th>
                        <th>Prénom</th>
                        <th>Statut</th>
+                        <th>Statut du paiement</th>
                        <th>Dernière Intervention</th>
                        <th>Actions</th>
                    </tr>
@@ -94,6 +125,7 @@
                        <td>Dupont</td>
                        <td>Jean</td>
                        <td>Professeur Vacataire</td>
+                        <td>En attente</td>
                        <td>01/10/2024</td>
                        <td>
                            <button class="modifierBouton" onclick="openModal('Dupont', 'Jean', 'Professeur Vacataire', '01/10/2024')">Modifier</button>
@@ -105,6 +137,7 @@
                        <td>Martin</td>
                        <td>Sophie</td>
                        <td>Professeur Vacataire</td>
+                        <td>En attente</td>
                        <td>15/09/2024</td>
                        <td>
                            <button class="modifierBouton" onclick="openModal('Martin', 'Sophie', 'Professeur Vacataire', '15/09/2024')">Modifier</button>
@@ -144,6 +177,7 @@
            <span class="close" onclick="closeDetailModal()">&times;</span>
            <h2>Détails de Personnel</h2>
            <p id="detail-info"></p>
+            <p id="coordonnees"></p>
            <h3>Heures à Payer</h3>
            <p id="heures-a-payer"></p>
            <h3>Demandes de Corrections d'Heures</h3>
@@ -152,12 +186,7 @@
            <ul id="documents-list"></ul>
            <h3>Statut</h3>
            <p id="statut-detail"></p>
-            <h3>Historique des Heures</h3>
-            <ul id="historique-list"></ul>
-            <h3>Coordonnées</h3>
-            <p id="coordonnees"></p>
            <button onclick="lancerProcedurePaiement()">Lancer la Procédure de Paiement</button>
-            <button onclick="modifierHeures()">Modifier les Heures</button>
           
        </div>
    </div>
@@ -207,13 +236,20 @@
        }

        function openModal(nom, prenom, statut, intervention) {
-            document.getElementById("nom").value = nom;
-            document.getElementById("prenom").value = prenom;
-            document.getElementById("statut").value = statut;
-            document.getElementById("intervention").value = intervention;
-            document.getElementById("myModal").style.display = "block";
+            // Mettre à jour le contenu du paragraphe "detail-info" avec des sauts de ligne
+            const detailInfo = `
+                <strong>Nom:</strong> ${nom}<br>
+                <strong>Prénom:</strong> ${prenom}<br>
+                <strong>Statut:</strong> ${statut}<br>
+                <strong>Dernière Intervention:</strong> ${intervention}
+            `;
+            document.getElementById("detail-info").innerHTML = detailInfo;
+            
+            // Afficher le modal
+            document.getElementById("detailModal").style.display = "block";
        }

+
        function closeModal() {
            document.getElementById("myModal").style.display = "none";
        }
@@ -225,18 +261,43 @@
            }
        }

+        function openModificationModal(nom, prenom, statut, intervention) {
+            document.getElementById("nom").value = nom;
+            document.getElementById("prenom").value = prenom;
+            document.getElementById("statut").value = statut;
+            document.getElementById("intervention").value = intervention;
+            document.getElementById("myModal").style.display = "block";
+        }
+
        function voirDetails(nom, prenom, statut, intervention) {
            // Remplir les détails du personnel ici
            document.getElementById("detail-info").textContent = `Nom: ${nom}, Prénom: ${prenom}, Statut: ${statut}, Dernière Intervention: ${intervention}`;
            document.getElementById("heures-a-payer").textContent = "10 heures"; // Remplacer par les vraies données
-            document.getElementById("corrections-list").innerHTML = "<li><a href=\"#\">Pas assez d'heures</a> : 19/10/2024</li>"; // Remplacer par les vraies données
+            document.getElementById("corrections-list").innerHTML = "<li><a href=\"./gestion-heures.html\">Pas assez d'heures</a> : 19/10/2024</li>"; // Remplacer par les vraies données
            document.getElementById("documents-list").innerHTML = "<li><a href=\"#\">Contrat de travail</a></li><li><a href=\"#\">CV</a></li><li><a href=\"#\">Diplôme</a></li><li><a href=\"#\">Justificatif d'expérience</a></li>"; // Remplacer par les vraies données
            document.getElementById("statut-detail").textContent = statut;
-            document.getElementById("historique-list").innerHTML = "<li>CM - SCR - 19/10/2024 - 12h30</li><li>TP - DEV - 19/10/2024 - 15h30</li>"; // Remplacer par les vraies données
-            document.getElementById("coordonnees").textContent = `${prenom}.${nom}@u-pec.fr`;
+            document.getElementById("coordonnees").textContent = `E-mail : ${prenom}.${nom}@u-pec.fr`;
            document.getElementById("detailModal").style.display = "block";
        }

+        function voirDetails(nom, prenom, statut, intervention) {
+            const detailInfo = `
+                <strong>Nom:</strong> ${nom}<br>
+                <strong>Prénom:</strong> ${prenom}<br>
+                <strong>Statut:</strong> ${statut}<br>
+                <strong>Dernière Intervention:</strong> ${intervention}
+            `;
+            document.getElementById("detail-info").innerHTML = detailInfo;
+
+            // Afficher le modal des détails
+            document.getElementById("detailModal").style.display = "block";
+            document.getElementById("heures-a-payer").textContent = "10 heures"; // Remplacer par les vraies données
+            document.getElementById("corrections-list").innerHTML = "<li><a href=\"./gestion-heures.html\">Pas assez d'heures</a> : 19/10/2024</li>"; // Remplacer par les vraies données
+            document.getElementById("documents-list").innerHTML = "<li><a href=\"#\">Contrat de travail</a></li><li><a href=\"#\">CV</a></li><li><a href=\"#\">Diplôme</a></li><li><a href=\"#\">Justificatif d'expérience</a></li>"; // Remplacer par les vraies données
+            document.getElementById("statut-detail").textContent = statut;
+            document.getElementById("coordonnees").innerHTML = `<strong>E-mail :</strong> : ${prenom}.${nom}@u-pec.fr`;
+        }
+
        function closeDetailModal() {
            document.getElementById("detailModal").style.display = "none";
        }