2024-10-16 18:19:14 +02:00
<!DOCTYPE html>
< html lang = "fr" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
2024-10-18 19:07:09 +02:00
< title > Dashboard RH< / title >
2024-10-16 18:19:14 +02:00
< link rel = "stylesheet" href = "https://www.w3schools.com/w3css/4/w3.css" >
< link rel = "stylesheet" href = "../../css/VACATAIRE/vacataire.css" >
2024-10-18 19:07:09 +02:00
< link rel = "icon" href = "../../media/img/logoIcon.ico" type = "image/x-icon" / >
2024-10-16 18:19:14 +02:00
< style >
.header {
background-color: #0f431f;
color: white;
padding: 10px 0;
text-align: center;
}
.section-header {
background-color: #f8f8f8;
padding: 10px;
border-left: 5px solid #0f431f;
margin-bottom: 20px;
}
.footer {
text-align: center;
padding: 10px 0;
margin-top: 20px;
background-color: #0f431f;
color: white;
}
.btn {
padding: 10px 15px;
background-color: #0f431f;
color: white;
text-decoration: none;
border-radius: 5px;
display: inline-block;
}
.btn:hover {
background-color: #0b3116;
}
.summary, .upcoming-sessions, .important-documents, .feedback, .events {
margin-bottom: 20px;
padding: 15px;
border: 1px solid #ccc;
}
< / style >
< / head >
< body >
2024-10-18 19:07:09 +02:00
< div class = "header w3-bar w3-card-4 w3-dark-blue" >
<!-- Logo pour retourner à l'accueil -->
< div class = "logo-container w3-bar-item" >
2024-10-18 19:45:09 +02:00
< img src = "../../media/img/logoWhite.png" alt = "Logo Accueil" class = "w3-image" style = "width:150px; height:40px;" >
2024-10-16 18:19:14 +02:00
< / div >
2024-10-18 19:45:09 +02:00
2024-10-18 19:07:09 +02:00
<!-- Bouton burger pour petit écran -->
< a href = "javascript:void(0)" class = "w3-bar-item w3-button w3-hide-large w3-right w3-padding-16" onclick = "toggleMenu()" > ☰< / a >
2024-10-18 19:45:09 +02:00
2024-10-18 19:07:09 +02:00
<!-- Catégories dans le header -->
2024-10-18 19:45:09 +02:00
< div id = "menu" class = "categories w3-hide-small w3-hide-medium w3-bar-item" >
2024-10-18 19:07:09 +02:00
< a href = "./rh.html" class = "w3-bar-item w3-button" > Accueil< / a >
< a href = "./gestion_personnel.html" class = "w3-bar-item w3-button" > Gestion du personnel< / a >
< a href = "./gestion-heures.html" class = "w3-bar-item w3-button" > Heures< / a >
< a href = "./candidature.html" class = "w3-bar-item w3-button" > Candidatures< / a >
< a href = "./mes-informations.html" class = "w3-bar-item w3-button" > Mes informations et documents< / a >
< / div >
<!-- Section utilisateur avec déconnexion -->
2024-10-18 19:45:09 +02:00
< div class = "user-section w3-right w3-hide-small w3-hide-medium" >
2024-10-18 19:07:09 +02:00
< div class = "user-name" >
2024-10-18 19:45:09 +02:00
Alice BERGER
2024-10-18 19:07:09 +02:00
< / div >
< div class = "logout-container w3-bar-item" >
< a href = "./notifications.html" title = "Notifications" >
2024-10-18 19:45:09 +02:00
< img src = "../../media/img/notifs.png" alt = "Logo notification" style = "width:24px; height:24px;" >
< / a >
< a href = "./settings.html" title = "Paramètres" >
< img src = "../../media/img/settings.png" alt = "Logo paramètres" style = "width:24px; height:24px;" >
< / a >
< a href = "../../index.html" title = "Se déconnecter" >
< img src = "../../media/img/LogOutWhite.png" alt = "Logo Déconnexion" style = "width:24px; height:24px;" >
< / a >
< / div >
< / div >
<!-- Menu mobile caché au départ -->
< div id = "mobileMenu" class = "w3-bar-block w3-hide w3-hide-large w3-dark-blue" >
< a href = "./rh.html" class = "w3-bar-item w3-button" > Accueil< / a >
< a href = "./gestion_personnel.html" class = "w3-bar-item w3-button" > Gestion du personnel< / a >
< a href = "./gestion-heures.html" class = "w3-bar-item w3-button" > Heures< / a >
< a href = "./candidature.html" class = "w3-bar-item w3-button" > Candidatures< / a >
< a href = "./mes-informations.html" class = "w3-bar-item w3-button" > Mes informations et documents< / a >
<!-- Section utilisateur pour mobile -->
< div class = "w3-bar-item w3-border-top w3-margin-top" >
< div class = "user-name" > Alice BERGER< / div >
< a href = "./notifications.html" title = "Notifications" >
< img src = "../../media/img/notifs.png" alt = "Logo notification" style = "width:24px; height:24px;" >
2024-10-18 19:07:09 +02:00
< / a >
< a href = "./settings.html" title = "Paramètres" >
2024-10-18 19:45:09 +02:00
< img src = "../../media/img/settings.png" alt = "Logo paramètres" style = "width:24px; height:24px;" >
2024-10-18 19:07:09 +02:00
< / a >
2024-10-16 18:19:14 +02:00
< a href = "../../index.html" title = "Se déconnecter" >
2024-10-18 19:45:09 +02:00
< img src = "../../media/img/LogOutWhite.png" alt = "Logo Déconnexion" style = "width:24px; height:24px;" >
2024-10-16 18:19:14 +02:00
< / a >
< / div >
< / div >
< / div >
< div class = "dashboard-container" >
<!-- Alertes et Notifications -->
< div class = "section-header" id = "notifications-section" >
< h2 > Alertes et Notifications< / h2 >
< / div >
< div id = "notifications-container" >
<!-- Notifications -->
< div class = "alert" >
< span class = "close" onclick = "this.parentElement.style.display='none';" > × < / span >
< p > < strong > Validation de Candidature :< / strong > Une nouvelle candidature a été soumise pour l'offre de vacation n°383. Veuillez la consulter et valider dans les plus brefs délais dans (la candidature expire dans 26 jours) : < a href = "./candidature.html" > Candidatures< / a > .< / p >
< / div >
< div class = "success" >
< span class = "close" onclick = "this.parentElement.style.display='none';" > × < / span >
< p > < strong > Demande de paiement :< / strong > Le service financier a procédé au paiement de Jean DUPONT. Vous pouvez consulter les détails : < a href = "gestion_personnel.html" > Gestion du personnel< / a > .< / p >
< / div >
< / div >
<!-- Résumé des Heures -->
< div class = "section-header" >
< h2 > Résumé des Heures< / h2 >
< / div >
< div class = "summary" >
< p > < strong > Heures Travaillées :< / strong > 120 heures< / p >
< p > < strong > Heures à Payer :< / strong > 30 heures< / p >
2024-10-18 19:07:09 +02:00
< p > < a href = "./gestion-heures.html" class = "btn" > Voir Détails< / a > < / p >
2024-10-16 18:19:14 +02:00
< / div >
<!-- Événements à Venir -->
< div class = "section-header" >
< h2 > Événements à Venir< / h2 >
< / div >
< div class = "events" >
< ul >
< li > Réunion des RH : 30 Octobre 2024< / li >
< li > Formation sur l'Utilisation des Outils Numériques : 5 Novembre 2024< / li >
< / ul >
< / div >
<!-- Script pour gérer l'affichage des notifications -->
< script >
const notificationsContainer = document.getElementById('notifications-container');
const notificationsSection = document.getElementById('notifications-section');
// Vérifiez si le conteneur des notifications est vide
if (notificationsContainer.childElementCount === 0) {
notificationsSection.style.display = 'none'; // Masquer la section si aucune notification
}
< / script >
< / 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 >
2024-10-18 19:07:09 +02:00
< script >
function toggleMenu() {
2024-10-18 19:45:09 +02:00
var x = document.getElementById("mobileMenu");
if (x.className.indexOf("w3-show") == -1) {
x.className += " w3-show";
2024-10-18 19:07:09 +02:00
} else {
2024-10-18 19:45:09 +02:00
x.className = x.className.replace(" w3-show", "");
2024-10-18 19:07:09 +02:00
}
}
< / script >
2024-10-16 18:19:14 +02:00
< / body >
< / html >
