From 6e3f952f551bb5277a3a8b5a874a65b4206b41d7 Mon Sep 17 00:00:00 2001
From: stiti <moncef.stiti@icloud.com>
Date: Thu, 17 Oct 2024 15:45:20 +0200
Subject: [PATCH] =?UTF-8?q?Ajouts=20des=20derni=C3=A8res=20modifs?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
MaquetteWEB/html/PROF/mes-heures.html | 12 +-
MaquetteWEB/html/RH/candidature.html | 1 +
MaquetteWEB/html/RH/gestion-heures.html | 686 +++++++++++++++++++++
MaquetteWEB/html/RH/gestion_personnel.html | 91 ++-
MaquetteWEB/html/RH/mes-informations.html | 1 +
MaquetteWEB/html/RH/rh.html | 1 +
6 files changed, 769 insertions(+), 23 deletions(-)
create mode 100644 MaquetteWEB/html/RH/gestion-heures.html
diff --git a/MaquetteWEB/html/PROF/mes-heures.html b/MaquetteWEB/html/PROF/mes-heures.html
index 434f5b6..08586c5 100644
--- a/MaquetteWEB/html/PROF/mes-heures.html
+++ b/MaquetteWEB/html/PROF/mes-heures.html
@@ -86,15 +86,11 @@
<!-- Popup pour pièces justificatives -->
<div id="justificatifForm" class="justificatif-form popup">
- <h3>Téléchargez vos pièces justificatives</h3>
- <p>Veuillez télécharger le document suivant :</p>
- <ul>
- <li>Contrat de travail actuel</li>
- </ul>
- <input type="file" id="justificatif" name="justificatif" required>
- <button id="submitJustificatif" onclick="submitJustificatif()">Soumettre</button>
- <button onclick="closeJustificatifPopup()">Annuler</button>
+ <h3>Confirmation de soumission</h3>
+ <p>Votre demande a bien été prise en compte !</p>
+ <button onclick="closeJustificatifPopup()">Fermer</button>
</div>
+
<div class="section-header">
<h2>Prochaines heures</h2>
diff --git a/MaquetteWEB/html/RH/candidature.html b/MaquetteWEB/html/RH/candidature.html
index 80a3e49..01d9fcb 100644
--- a/MaquetteWEB/html/RH/candidature.html
+++ b/MaquetteWEB/html/RH/candidature.html
@@ -79,6 +79,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>
diff --git a/MaquetteWEB/html/RH/gestion-heures.html b/MaquetteWEB/html/RH/gestion-heures.html
new file mode 100644
index 0000000..3311e04
--- /dev/null
+++ b/MaquetteWEB/html/RH/gestion-heures.html
@@ -0,0 +1,686 @@
+<!DOCTYPE html>
+<html lang="fr">
+
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Pilotage Budgétaire</title>
+ <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
+ <link rel="stylesheet" href="../../css/RH/style.css">
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+ <style>
+ .chart-container {
+ position: relative;
+ margin: 20px 0;
+ width: 100%;
+ max-width: 1200px;
+ }
+
+ .sortable {
+ cursor: pointer;
+ }
+
+ .arrow {
+ margin-left: 5px;
+ font-size: 0.8em;
+ }
+
+ .up {
+ display: none;
+ }
+
+ .status-correct {
+ color: green;
+ }
+
+ .status-incorrect {
+ color: orange;
+ }
+
+ .status-pending {
+ color: red;
+ }
+
+ .popup2 {
+ display: none;
+ position: fixed;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ border: 2px solid #ccc;
+ background-color: #fff;
+ padding: 20px;
+ z-index: 10;
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
+ }
+
+ .modal {
+ display: none; /* Hidden by default */
+ position: fixed; /* Stay in place */
+ z-index: 1; /* Sit on top */
+ left: 0;
+ top: 0;
+ width: 100%; /* Full width */
+ height: 100%; /* Full height */
+ overflow: auto; /* Enable scroll if needed */
+ background-color: rgb(0, 0, 0); /* Fallback color */
+ background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
+ }
+
+ .modal-content {
+ background-color: #fefefe;
+ margin: 15% auto; /* 15% from the top and centered */
+ padding: 20px;
+ border: 1px solid #888;
+ width: 80%; /* Could be more or less, depending on screen size */
+ }
+
+ .close {
+ color: #aaa;
+ float: right;
+ font-size: 28px;
+ font-weight: bold;
+ }
+
+ .close:hover,
+ .close:focus {
+ color: black;
+ text-decoration: none;
+ cursor: pointer;
+ }
+ </style>
+</head>
+
+<body>
+
+ <div class="header">
+ <div class="logo-container">
+ <img src="../../media/img/logoWhite.png" alt="Logo Accueil">
+ </div>
+
+ <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>
+
+ <div class="user-section">
+ <div class="user-name">Alice BERGER</div>
+ <div class="logout-container">
+ <a href="../../index.html" title="Se déconnecter">
+ <img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion">
+ </a>
+ </div>
+ </div>
+ </div>
+
+
+
+
+ <div class="container">
+
+ <input type="text" id="searchBar" class="search-bar" placeholder="Rechercher un professeur..." onkeyup="searchProfessor()">
+
+ <div class="info-card">
+ <div class="section-header">
+ <h2>Suivi des demandes de modification d'heures</h2>
+ </div>
+ <div class="card">
+ <table class="w3-table-all" id="teaching-hours-table">
+ <thead>
+ <tr>
+ <th class="sortable" onclick="sortTable(0)">Nom de l'enseignant <span class="arrow">▲</span><span class="arrow up">▼</span></th>
+ <th class="sortable" onclick="sortTable(1)">Période <span class="arrow">▲</span><span class="arrow up">▼</span></th>
+ <th class="sortable" onclick="sortTable(2)">Contrat <span class="arrow">▲</span><span class="arrow up">▼</span></th>
+ <th class="sortable" onclick="sortTable(3)">Type d'heure <span class="arrow">▲</span><span class="arrow up">▼</span></th>
+ <th class="sortable" onclick="sortTable(4)">Heures déclarées <span class="arrow">▲</span><span class="arrow up">▼</span></th>
+ <th class="sortable" onclick="sortTable(5)">Heures validées <span class="arrow">▲</span><span class="arrow up">▼</span></th>
+ <th class="sortable" onclick="sortTable(6)">Statut <span class="arrow">▲</span><span class="arrow up">▼</span></th>
+ <th>Action</th>
+ </tr>
+ </thead>
+ <tbody id="teaching-hours">
+ <tr>
+ <td>Denis MONNERAT</td>
+ <td>Novembre 2024</td>
+ <td>CDI</td>
+ <td>CM</td>
+ <td>25</td>
+ <td>23</td>
+ <td class="status-incorrect">Correction demandée</td>
+ <td><button class="w3-button w3-brown" onclick="openPopup(this)">Modifier</button></td>
+ </tr>
+ <tr>
+ <td>Maxime MENAULT</td>
+ <td>Décembre 2024</td>
+ <td>Vacation</td>
+ <td>TD</td>
+ <td>20</td>
+ <td>20</td>
+ <td class="status-correct">Validé par le chef de département</td>
+ <td><button class="w3-button w3-brown" onclick="openPopup(this)">Modifier</button></td>
+ </tr>
+ <tr>
+ <td>Fréderic GERVAIS</td>
+ <td>Décembre 2024</td>
+ <td>CDI</td>
+ <td>TP</td>
+ <td>15</td>
+ <td>15</td>
+ <td class="status-correct">Validé par le chef de département</td>
+ <td><button class="w3-button w3-brown" onclick="openPopup(this)">Modifier</button></td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+
+ <h2>Heures des Professeurs</h2>
+ <table class="info-table" id="professorTable">
+ <thead>
+ <tr>
+ <th>Professeur</th>
+ <th>Nombre d'heures</th>
+ <th>Statut</th>
+ <th>Actions</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Denis MONNERAT</td>
+ <td>120h</td>
+ <td>Permanents</td>
+ <td>
+ <button class="action-btn" onclick="toggleDetails(this, 'denis-details')">Voir</button>
+ <button class="action-btn" onclick="openModal('Denis MONNERAT')">Modifier</button>
+ </td>
+ </tr>
+ <tr class="details" id="denis-details">
+ <td colspan="4">
+ <strong>Historique des heures :</strong>
+ <ul>
+ <li>BUT1 Groupe 1 : 30h</li>
+ <li>BUT2 Groupe 2 : 40h</li>
+ <li>BUT3 Groupe 1 : 50h</li>
+ </ul>
+ <div class="chart-container">
+ <canvas id="denisChart"></canvas>
+ </div>
+ </td>
+ </tr>
+ <tr>
+ <td>Maxime MENAULT</td>
+ <td>90h</td>
+ <td>Vacataire</td>
+ <td>
+ <button class="action-btn" onclick="toggleDetails(this, 'menault-details')">Voir</button>
+ <button class="action-btn" onclick="openModal('Maxime MENAULT')">Modifier</button>
+ </td>
+ </tr>
+ <tr class="details" id="menault-details">
+ <td colspan="4">
+ <strong>Historique des heures :</strong>
+ <ul>
+ <li>BUT1 Groupe 1 : 45h</li>
+ <li>BUT2 Groupe 3 : 45h</li>
+ </ul>
+ <div class="chart-container">
+ <canvas id="menaultChart"></canvas>
+ </div>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+
+
+ <div id="myModal" class="modal">
+ <div class="modal-content">
+ <span class="close" onclick="closeModal()">×</span>
+ <h2>Ajouter des heures</h2>
+ <p id="professorName"></p>
+
+ <label for="hours">Type de cours :</label>
+ <input type="text" id="hours" placeholder="Ex: CM"><br><br>
+
+ <label for="startTime">Heure de début :</label>
+ <input type="time" id="startTime"><br><br>
+
+ <label for="endTime">Heure de fin :</label>
+ <input type="time" id="endTime"><br><br>
+
+ <label for="subject">Choisissez une formation :</label>
+ <select id="subject" name="subject">
+ <option value="but1fi">BUT1 Informatique FI</option>
+ <option value="but2fi">BUT2 Informatique FI</option>
+ <option value="but2fa">BUT2 Informatique FA</option>
+ </select>
+ <br><br>
+
+ <label for="matiere">Choisissez une matière :</label>
+ <select id="matiere" name="matiere">
+ <option value="SCR">SCR</option>
+ <option value="Mathématiques">Mathématiques</option>
+ <option value="DEV">DEV</option>
+ <option value="EGOD">EGOD</option>
+ <option value="EC">EC</option>
+ <option value="BD">BD</option>
+ <option value="Anglais">Anglais</option>
+ </select>
+ <br><br>
+
+ <button class="action-btn" onclick="addHours()">Ajouter</button>
+ </div>
+ </div>
+
+ <div id="vacationModal" class="modal">
+ <div class="modal-content">
+ <span class="close" onclick="closeVacationModal()">×</span>
+ <h2 id="modal-title">Ajouter une Offre de Vacation</h2>
+
+ <label for="offerName">Nom de l'Offre :</label>
+ <input type="text" id="offerName" placeholder="Ex: Cours de Maths"><br><br>
+
+ <label for="offerDescription">Description :</label>
+ <textarea id="offerDescription" placeholder="Décrivez l'offre ici..." rows="3"></textarea><br><br>
+
+ <label for="offerDate">Date :</label>
+ <input type="date" id="offerDate"><br><br>
+
+ <label for="offerHours">Heures :</label>
+ <input type="number" id="offerHours" placeholder="Ex: 3" min="1"><br><br>
+
+ <label>Type :</label><br>
+ <input type="checkbox" id="cm" name="offerType" value="CM">
+ <label for="cm">CM</label><br>
+
+ <input type="checkbox" id="td" name="offerType" value="TD">
+ <label for="td">TD</label><br>
+
+ <input type="checkbox" id="tp" name="offerType" value="TP">
+ <label for="tp">TP</label><br>
+
+ <input type="checkbox" id="suivi" name="offerType" value="Suivi">
+ <label for="suivi">Suivi</label><br><br>
+
+ <button class="action-btn" onclick="addVacationOffer()">Ajouter</button>
+ <button class="action-btn" id="update-btn" onclick="updateVacationOffer()" style="display:none;">Modifier</button>
+ </div>
+ </div>
+
+
+
+
+ <div id="confirmModal" class="modal">
+ <div class="modal-content">
+ <span class="close" onclick="closeConfirmModal()">×</span>
+ <h2>Confirmation</h2>
+ <p>La demande de modification d'heures a été envoyée au service RH avec succès.</p>
+ </div>
+ </div>
+
+ <!-- Pop-up pour modifier les heures -->
+ <!-- Pop-up pour modifier les heures -->
+<div class="popup2" id="popup-form">
+ <h3>Modifier les heures</h3>
+ <form id="form-popup">
+ <label for="validated-hours">Heures validées :</label>
+ <input type="number" id="validated-hours" class="w3-input" min="0" max="100" value="0">
+ <br>
+ <label for="status">Statut :</label>
+ <select id="status" class="w3-select" onchange="updateButtonColor()">
+ <option value="Validé" class="status-correct">Validé</option>
+ <option value="Correction demandée" class="status-incorrect">Correction demandée</option>
+ <option value="Refusé" class="status-pending">Refusé</option>
+ </select>
+ <br><br>
+
+ <!-- Ajout du champ commentaire -->
+ <label for="comment">Commentaire :</label>
+ <textarea id="comment" class="w3-input" rows="4" placeholder="Ajouter un commentaire..."></textarea>
+ <br><br>
+
+ <button type="button" class="w3-button w3-green btn-validate" onclick="validateHours()">Valider</button>
+ <button type="button" class="w3-button w3-red" onclick="closePopup()">Annuler</button>
+ </form>
+</div>
+
+
+
+ <div class="footer">
+ <p>© 2024 IUT de Fontainebleau. Tous droits réservés |
+ <a href="../mentions_legales.html">Mentions légales</a>
+ </p>
+ </div>
+
+ <script>
+ // Données pour le graphique principal
+ const categories = ['Vacataires', 'Permanents', 'Chercheurs'];
+ const heuresParCategorie = [90, 120, 80]; // Exemple de données
+
+ // Fonction pour initialiser le graphique principal
+ function initMainChart() {
+ const ctx = document.getElementById('mainChart').getContext('2d');
+ new Chart(ctx, {
+ type: 'bar',
+ data: {
+ labels: categories,
+ datasets: [{
+ label: 'Heures des Professeurs par Catégorie',
+ data: heuresParCategorie,
+ backgroundColor: [
+ 'rgba(255, 99, 132, 0.2)',
+ 'rgba(54, 162, 235, 0.2)',
+ 'rgba(255, 206, 86, 0.2)'
+ ],
+ borderColor: [
+ 'rgba(255, 99, 132, 1)',
+ 'rgba(54, 162, 235, 1)',
+ 'rgba(255, 206, 86, 1)'
+ ],
+ borderWidth: 1
+ }]
+ },
+ options: {
+ scales: {
+ y: {
+ beginAtZero: true
+ }
+ }
+ }
+ });
+ }
+
+ // Fonction pour initialiser le graphique d'un professeur
+ function initProfessorChart(professor, heures) {
+ const ctx = document.getElementById(professor + 'Chart').getContext('2d');
+ new Chart(ctx, {
+ type: 'pie',
+ data: {
+ labels: ['BUT1', 'BUT2', 'BUT3'], // Exemple de matières
+ datasets: [{
+ label: 'Répartition des heures',
+ data: heures,
+ backgroundColor: [
+ 'rgba(255, 99, 132, 0.2)',
+ 'rgba(54, 162, 235, 0.2)',
+ 'rgba(255, 206, 86, 0.2)'
+ ],
+ borderColor: [
+ 'rgba(255, 99, 132, 1)',
+ 'rgba(54, 162, 235, 1)',
+ 'rgba(255, 206, 86, 1)'
+ ],
+ borderWidth: 1
+ }]
+ },
+ options: {
+ responsive: true,
+ plugins: {
+ legend: {
+ position: 'top',
+ },
+ title: {
+ display: true,
+ text: 'Heures de ' + professor
+ }
+ }
+ }
+ });
+ }
+
+ function openModal(professor) {
+ document.getElementById('professorName').textContent = "Ajouter des heures pour " + professor;
+ document.getElementById('myModal').style.display = 'block';
+ }
+
+ function closeModal() {
+ document.getElementById('myModal').style.display = 'none';
+ }
+
+ function addHours() {
+ const hours = document.getElementById('hours').value;
+ const formation = document.getElementById('subject').value;
+ const matiere = document.getElementById('matiere').value;
+
+ if (hours && formation && matiere) {
+ closeModal();
+ openConfirmModal();
+ } else {
+ alert("Veuillez remplir toutes les informations.");
+ }
+ }
+
+ function openConfirmModal() {
+ document.getElementById('confirmModal').style.display = 'block';
+ }
+
+ function closeConfirmModal() {
+ document.getElementById('confirmModal').style.display = 'none';
+ }
+
+ // Fonction de recherche des professeurs
+ function searchProfessor() {
+ const input = document.getElementById("searchBar").value.toLowerCase();
+ const table = document.getElementById("professorTable");
+ const rows = table.getElementsByTagName("tr");
+
+ for (let i = 1; i < rows.length; i++) {
+ const cells = rows[i].getElementsByTagName("td");
+ if (cells.length > 0) {
+ const professorName = cells[0].innerText.toLowerCase();
+ if (professorName.includes(input)) {
+ rows[i].style.display = "";
+ } else {
+ rows[i].style.display = "none";
+ }
+ }
+ }
+ }
+
+ // Toggle details and change button text
+ function toggleDetails(button, detailId) {
+ const detailsRow = document.getElementById(detailId);
+ if (detailsRow.style.display === "none" || detailsRow.style.display === "") {
+ detailsRow.style.display = "table-row";
+ button.textContent = "Fermer"; // Change the button text to "Fermer"
+
+ // Initialiser le graphique du professeur
+ if (button.parentElement.parentElement.cells[0].innerText === "Denis MONNERAT") {
+ initProfessorChart('denis', [10, 40, 70]); // Exemples d'heures
+ } else if (button.parentElement.parentElement.cells[0].innerText === "Maxime MENAULT") {
+ initProfessorChart('menault', [45, 45, 0]); // Exemples d'heures
+ }
+ } else {
+ detailsRow.style.display = "none";
+ button.textContent = "Voir"; // Change the button text back to "Voir"
+ }
+ }
+
+ // Initialiser le graphique principal au chargement de la page
+ window.onload = initMainChart;
+ </script>
+
+<script>
+ let currentRow; // Garde une trace de la ligne à modifier
+ let lastSortedColumnIndex = -1;
+ let lastSortDirection = 'asc';
+
+ // Fonction pour ouvrir la pop-up
+ function openPopup(button) {
+ currentRow = button.parentElement.parentElement;
+ document.getElementById("validated-hours").value = currentRow.cells[4].textContent;
+ document.getElementById("status").value = currentRow.cells[6].textContent; // Correction ici pour le statut
+ updateButtonColor(); // Mettre à jour la couleur du bouton
+ document.getElementById("popup-form").style.display = 'block';
+ document.getElementById("overlay").style.display = 'block';
+ }
+
+ // Fonction pour fermer la pop-up
+ function closePopup() {
+ document.getElementById("popup-form").style.display = 'none';
+ document.getElementById("overlay").style.display = 'none';
+ }
+
+ // Fonction pour changer la couleur du bouton en fonction du statut
+ function updateButtonColor() {
+ const status = document.getElementById("status").value;
+ const button = document.querySelector('.btn-validate');
+
+ button.classList.remove('validé', 'correction-demandée', 'refusé'); // Retirer toutes les classes
+
+ if (status === "Validé") {
+ button.classList.add('validé');
+ button.style.backgroundColor = 'green'; // Vert
+ } else if (status === "Correction demandée") {
+ button.classList.add('correction-demandée');
+ button.style.backgroundColor = 'orange'; // Orange
+ } else {
+ button.classList.add('refusé');
+ button.style.backgroundColor = 'red'; // Rouge
+ }
+ }
+
+ // Fonction pour valider et mettre à jour les heures et le statut
+ function validateHours() {
+ let validatedHours = document.getElementById("validated-hours").value;
+ let status = document.getElementById("status").value;
+
+ // Mettre à jour les valeurs dans le tableau
+ currentRow.cells[4].textContent = validatedHours;
+ currentRow.cells[6].textContent = status; // Correction ici pour le statut
+
+ // Appliquer les couleurs du statut
+ if (status === "Validé") {
+ currentRow.cells[6].className = "status-correct";
+ } else if (status === "Correction demandée") {
+ currentRow.cells[6].className = "status-incorrect";
+ } else {
+ currentRow.cells[6].className = "status-pending";
+ }
+
+ // Afficher un message de confirmation
+ alert("Heures validées et statut mis à jour!");
+
+ // Fermer la pop-up
+ closePopup();
+ }
+
+ // Fonction pour trier le tableau
+ function sortTable(columnIndex) {
+ const table = document.getElementById("teaching-hours-table");
+ const tbody = table.getElementsByTagName("tbody")[0];
+ const rows = Array.from(tbody.getElementsByTagName("tr"));
+
+ // Déterminer la direction du tri
+ let direction = 'asc';
+ if (lastSortedColumnIndex === columnIndex) {
+ direction = lastSortDirection === 'asc' ? 'desc' : 'asc';
+ }
+ lastSortedColumnIndex = columnIndex;
+ lastSortDirection = direction;
+
+ // Tri des lignes
+ rows.sort((a, b) => {
+ const aText = a.cells[columnIndex].textContent.trim();
+ const bText = b.cells[columnIndex].textContent.trim();
+
+ if (direction === 'asc') {
+ return aText > bText ? 1 : -1;
+ } else {
+ return aText < bText ? 1 : -1;
+ }
+ });
+
+ // Ajout des lignes triées au tableau
+ rows.forEach(row => tbody.appendChild(row));
+
+ // Mettre à jour les flèches
+ updateSortArrows(columnIndex, direction);
+ }
+
+ // Fonction pour mettre à jour les flèches de tri
+ function updateSortArrows(columnIndex, direction) {
+ const headers = document.querySelectorAll("th.sortable");
+ headers.forEach((header, index) => {
+ const arrows = header.querySelectorAll('.arrow');
+ arrows[0].style.display = (index === columnIndex && direction === 'asc') ? 'inline' : 'none'; // Flèche vers le haut
+ arrows[1].style.display = (index === columnIndex && direction === 'desc') ? 'inline' : 'none'; // Flèche vers le bas
+ });
+ }
+
+ let currentVacationRow = null;
+
+// Ouvrir la modal pour ajouter une nouvelle offre de vacation
+function openVacationModal() {
+ document.getElementById('vacationModal').style.display = 'block';
+ document.getElementById('modal-title').textContent = "Ajouter une Offre de Vacation";
+ document.getElementById('offerName').value = '';
+ document.getElementById('offerDate').value = '';
+ document.getElementById('offerType').value = '';
+ document.getElementById('update-btn').style.display = 'none';
+}
+
+// Fermer la modal
+function closeVacationModal() {
+ document.getElementById('vacationModal').style.display = 'none';
+}
+
+// Ajouter une nouvelle offre de vacation
+function addVacationOffer() {
+ const offerName = document.getElementById('offerName').value;
+ const offerDescription = document.getElementById('offerDescription').value;
+ const offerDate = document.getElementById('offerDate').value;
+ const offerHours = document.getElementById('offerHours').value;
+
+ const offerTypes = [];
+ if (document.getElementById('cm').checked) offerTypes.push('CM');
+ if (document.getElementById('td').checked) offerTypes.push('TD');
+ if (document.getElementById('tp').checked) offerTypes.push('TP');
+ if (document.getElementById('suivi').checked) offerTypes.push('Suivi');
+
+ // Here you would add the logic to store or process the vacation offer.
+ console.log('Offer Name:', offerName);
+ console.log('Description:', offerDescription);
+ console.log('Date:', offerDate);
+ console.log('Hours:', offerHours);
+ console.log('Types:', offerTypes.join(', '));
+
+ // Close the modal after adding
+ closeVacationModal();
+}
+
+// Éditer une offre de vacation
+function editVacationOffer(button) {
+ currentVacationRow = button.parentElement.parentElement;
+ document.getElementById('offerName').value = currentVacationRow.cells[0].textContent;
+ document.getElementById('offerDate').value = currentVacationRow.cells[1].textContent;
+ document.getElementById('offerType').value = currentVacationRow.cells[2].textContent;
+
+ document.getElementById('modal-title').textContent = "Modifier l'Offre de Vacation";
+ document.getElementById('update-btn').style.display = 'block';
+ document.getElementById('vacationModal').style.display = 'block';
+}
+
+// Mettre à jour une offre de vacation
+function updateVacationOffer() {
+ if (currentVacationRow) {
+ currentVacationRow.cells[0].textContent = document.getElementById('offerName').value;
+ currentVacationRow.cells[1].textContent = document.getElementById('offerDate').value;
+ currentVacationRow.cells[2].textContent = document.getElementById('offerType').value;
+ closeVacationModal();
+ }
+}
+
+// Supprimer une offre de vacation
+function deleteVacationOffer(button) {
+ const row = button.parentElement.parentElement;
+ row.parentElement.removeChild(row);
+}
+
+</script>
+</body>
+
+</html>
diff --git a/MaquetteWEB/html/RH/gestion_personnel.html b/MaquetteWEB/html/RH/gestion_personnel.html
index c63a3c8..3da40b8 100644
--- 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()">×</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";
}
diff --git a/MaquetteWEB/html/RH/mes-informations.html b/MaquetteWEB/html/RH/mes-informations.html
index 6beb171..571f234 100644
--- a/MaquetteWEB/html/RH/mes-informations.html
+++ b/MaquetteWEB/html/RH/mes-informations.html
@@ -259,6 +259,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>
diff --git a/MaquetteWEB/html/RH/rh.html b/MaquetteWEB/html/RH/rh.html
index f468967..54194c0 100644
--- a/MaquetteWEB/html/RH/rh.html
+++ b/MaquetteWEB/html/RH/rh.html
@@ -54,6 +54,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>