W3 CSS
This commit is contained in:
parent
38cfd17697
commit
78664f1bac
134
MaquetteWEB/css/CHEF/chef_departement2.css
Normal file
134
MaquetteWEB/css/CHEF/chef_departement2.css
Normal file
@ -0,0 +1,134 @@
|
||||
.status-correct {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.status-incorrect {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
.status-pending {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.popup {
|
||||
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);
|
||||
}
|
||||
|
||||
.overlay {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.btn-validate {
|
||||
background-color: #5e3a19; /* couleur par défaut */
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-validate.validé {
|
||||
background-color: #5e3a19; /* vert pour validé */
|
||||
}
|
||||
|
||||
.btn-validate.correction-demandée {
|
||||
background-color: #5e3a19; /* orange pour correction demandée */
|
||||
}
|
||||
|
||||
.btn-validate.refusé {
|
||||
background-color: #5e3a19; /* rouge pour refusé */
|
||||
}
|
||||
|
||||
.sortable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
margin-left: 5px;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.up {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.schedule-selection {
|
||||
margin: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.schedule-container {
|
||||
margin: 0 auto;
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.schedule-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.schedule-table th, .schedule-table td {
|
||||
border: 1px solid #ccc;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.time-slot {
|
||||
background-color: #f4f4f4;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.no-class {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
.class {
|
||||
background-color: #dff0d8;
|
||||
}
|
||||
|
||||
/* Dropdown menu */
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
text-align:left;
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
min-width: 200px;
|
||||
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.dropdown-content a {
|
||||
color: black;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown-content a:hover {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
.dropdown:hover .dropdown-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown:hover .dropbtn {
|
||||
background-color: #4a2e13;
|
||||
}
|
||||
@ -7,143 +7,7 @@
|
||||
<title>Dashboard Chef de département</title>
|
||||
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
||||
<link rel="stylesheet" href="../../css/CHEF/chef_departement.css">
|
||||
<style>
|
||||
.status-correct {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.status-incorrect {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
.status-pending {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.popup {
|
||||
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);
|
||||
}
|
||||
|
||||
.overlay {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.btn-validate {
|
||||
background-color: #5e3a19; /* couleur par défaut */
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-validate.validé {
|
||||
background-color: #5e3a19; /* vert pour validé */
|
||||
}
|
||||
|
||||
.btn-validate.correction-demandée {
|
||||
background-color: #5e3a19; /* orange pour correction demandée */
|
||||
}
|
||||
|
||||
.btn-validate.refusé {
|
||||
background-color: #5e3a19; /* rouge pour refusé */
|
||||
}
|
||||
|
||||
.sortable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
margin-left: 5px;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.up {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.schedule-selection {
|
||||
margin: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.schedule-container {
|
||||
margin: 0 auto;
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.schedule-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.schedule-table th, .schedule-table td {
|
||||
border: 1px solid #ccc;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.time-slot {
|
||||
background-color: #f4f4f4;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.no-class {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
.class {
|
||||
background-color: #dff0d8;
|
||||
}
|
||||
|
||||
/* Dropdown menu */
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
text-align:left;
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
min-width: 200px;
|
||||
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.dropdown-content a {
|
||||
color: black;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown-content a:hover {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
.dropdown:hover .dropdown-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown:hover .dropbtn {
|
||||
background-color: #4a2e13;
|
||||
}
|
||||
|
||||
</style>
|
||||
<link rel="stylesheet" href="../../css/CHEF/chef_departement2.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@ -161,7 +25,6 @@
|
||||
<div class="dropdown-content">
|
||||
<a href="./gestion-heures-professeur.html">Professeur</a>
|
||||
<a href="./gestion-heures-formation.html">Formation</a>
|
||||
<a href="./gestion-edt.html">EDT</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -201,21 +64,6 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sélection du professeur ou de la classe -->
|
||||
<div class="schedule-selection">
|
||||
<label for="schedule-type">Choisir un emploi du temps :</label>
|
||||
<select id="schedule-type" onchange="updateSchedule()">
|
||||
<option value="professeur1">Professeur Denis MONNERAT</option>
|
||||
<option value="professeur2">Professeur Maxime MENAULT</option>
|
||||
<option value="classe1">Classe BUT1 Groupe 1</option>
|
||||
<option value="classe2">Classe BUT1 Groupe 2</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div id="schedule-container">
|
||||
<!-- L'emploi du temps sera injecté ici -->
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Suivi des Heures d'enseignement -->
|
||||
<div class="section-header">
|
||||
|
||||
@ -224,7 +224,6 @@ label {
|
||||
<div class="dropdown-content">
|
||||
<a href="./gestion-heures-professeur.html">Professeur</a>
|
||||
<a href="./gestion-heures-formation.html">Formation</a>
|
||||
<a href="./gestion-edt.html">EDT</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -75,7 +75,6 @@
|
||||
<div class="dropdown-content">
|
||||
<a href="./gestion-heures-professeur.html">Professeur</a>
|
||||
<a href="./gestion-heures-formation.html">Formation</a>
|
||||
<a href="./gestion-edt.html">EDT</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -106,7 +106,6 @@
|
||||
<div class="dropdown-content">
|
||||
<a href="./gestion-heures-professeur.html">Professeur</a>
|
||||
<a href="./gestion-heures-formation.html">Formation</a>
|
||||
<a href="./gestion-edt.html">EDT</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -191,6 +190,7 @@
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Professeur</th>
|
||||
<th>Nombre d'heures prévus</th>
|
||||
<th>Nombre d'heures</th>
|
||||
<th>Statut</th>
|
||||
<th>Actions</th>
|
||||
@ -199,6 +199,7 @@
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Denis MONNERAT</td>
|
||||
<td>110h</td>
|
||||
<td>120h</td>
|
||||
<td>Permanents</td>
|
||||
<td>
|
||||
@ -221,6 +222,7 @@
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Maxime MENAULT</td>
|
||||
<td>100h</td>
|
||||
<td>90h</td>
|
||||
<td>Vacataire</td>
|
||||
<td>
|
||||
|
||||
@ -318,7 +318,6 @@
|
||||
<div class="dropdown-content">
|
||||
<a href="./gestion-heures-professeur.html">Professeur</a>
|
||||
<a href="./gestion-heures-formation.html">Formation</a>
|
||||
<a href="./gestion-edt.html">EDT</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -92,7 +92,6 @@
|
||||
<div class="dropdown-content">
|
||||
<a href="./gestion-heures-professeur.html">Professeur</a>
|
||||
<a href="./gestion-heures-formation.html">Formation</a>
|
||||
<a href="./gestion-edt.html">EDT</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -9,69 +9,61 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="header">
|
||||
<div class="header w3-bar w3-card-4 w3-dark-blue">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil">
|
||||
<div class="logo-container w3-bar-item">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil" class="w3-image" style="width:200px; height:50px;">
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 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>
|
||||
|
||||
<!-- Catégories dans le header -->
|
||||
<div class="categories">
|
||||
<a href="./finance.html">Accueil</a>
|
||||
<a href="./paiements_en_attente.html">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html">Historique des transactions</a>
|
||||
<a href="./mes_informations.html">Mes informations et documents</a>
|
||||
<div id="menu" class="categories w3-hide-small w3-bar-item">
|
||||
<a href="./finance.html" class="w3-bar-item w3-button">Accueil</a>
|
||||
<a href="./paiements_en_attente.html" class="w3-bar-item w3-button">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html" class="w3-bar-item w3-button">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html" class="w3-bar-item w3-button">Historique des transactions</a>
|
||||
<a href="./mes_informations.html" class="w3-bar-item w3-button">Mes informations et documents</a>
|
||||
</div>
|
||||
|
||||
<!-- Section utilisateur avec déconnexion -->
|
||||
<div class="user-section">
|
||||
<div class="user-name">
|
||||
<div class="user-section w3-bar-item w3-right">
|
||||
<div class="user-name w3-padding-16">
|
||||
Jean DUPONT
|
||||
</div>
|
||||
<div class="logout-container">
|
||||
<div class="logout-container w3-bar-item">
|
||||
<a href="../../index.html" title="Se déconnecter">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion" style="width:25px; height:25px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dashboard-container">
|
||||
<div class="dashboard-container w3-content">
|
||||
<!-- Alertes et Notifications -->
|
||||
<div class="section-header" id="notifications-section">
|
||||
<div class="section-header w3-container w3-light-gray w3-border-left" style="border-left: 5px solid #20195e;">
|
||||
<h2>Alertes et Notifications</h2>
|
||||
</div>
|
||||
<div id="notifications-container">
|
||||
<div id="notifications-container" class="w3-container">
|
||||
<!-- Notifications -->
|
||||
<div class="alert">
|
||||
<span class="close" onclick="this.parentElement.style.display='none';">×</span>
|
||||
<div class="w3-panel w3-red w3-display-container alert">
|
||||
<span class="w3-button w3-red w3-large w3-display-topright" onclick="this.parentElement.style.display='none'">×</span>
|
||||
<p><strong>Paiements en attente :</strong> Vous avez des paiements qui n'ont pas encore été traités. Merci de vérifier dans : <a href="paiements_en_attente.html">Paiements en attente</a>.</p>
|
||||
</div>
|
||||
<div class="success">
|
||||
<span class="close" onclick="this.parentElement.style.display='none';">×</span>
|
||||
<div class="w3-panel w3-green w3-display-container success">
|
||||
<span class="w3-button w3-green w3-large w3-display-topright" onclick="this.parentElement.style.display='none'">×</span>
|
||||
<p><strong>Rapport validé :</strong> Votre dernier rapport financier a été validé. Vous pouvez le consulter dans : <a href="rapports_financiers.html">Rapports Financiers</a>.</p>
|
||||
</div>
|
||||
</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>
|
||||
|
||||
<!-- Paiements en attente -->
|
||||
<div class="section-header">
|
||||
<div class="section-header w3-container w3-light-gray w3-border-left" style="border-left: 5px solid #20195e;">
|
||||
<h2>Paiements en Attente</h2>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="table-container">
|
||||
<table>
|
||||
<div class="card w3-card-4 w3-white">
|
||||
<div class="table-container w3-responsive">
|
||||
<table class="w3-table-all">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID Transaction</th>
|
||||
@ -99,24 +91,20 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="button-container" style="text-align: center; margin-top: 20px;">
|
||||
<a href="./paiements_en_attente.html">
|
||||
<button class="button see-more" style="padding: 10px 20px; background-color: #20195e; color: white; border: none; border-radius: 4px; cursor: pointer;">
|
||||
Voir plus
|
||||
</button>
|
||||
<div class="button-container w3-center w3-margin-top">
|
||||
<a href="./paiements_en_attente.html" class="w3-button w3-blue">
|
||||
Voir plus
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Rapports Financiers -->
|
||||
<div class="section-header">
|
||||
<div class="section-header w3-container w3-light-gray w3-border-left" style="border-left: 5px solid #20195e;">
|
||||
<h2>Rapports Financiers</h2>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="table-container">
|
||||
<table>
|
||||
<div class="card w3-card-4 w3-white">
|
||||
<div class="table-container w3-responsive">
|
||||
<table class="w3-table-all">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Rapport</th>
|
||||
@ -130,33 +118,31 @@
|
||||
<td>Rapport d'Octobre 2024</td>
|
||||
<td>01/10/2024</td>
|
||||
<td>Validé</td>
|
||||
<td><a href="rapports_financiers.html#octobre2024" class="btn">Voir Rapport</a></td>
|
||||
<td><a href="rapports_financiers.html#octobre2024" class="w3-button w3-blue">Voir Rapport</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Rapport de Novembre 2024</td>
|
||||
<td>01/11/2024</td>
|
||||
<td>En cours</td>
|
||||
<td><a href="#" class="btn">Préparer Rapport</a></td>
|
||||
<td><a href="#" class="w3-button w3-blue">Préparer Rapport</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="button-container" style="text-align: center; margin-top: 20px;">
|
||||
<a href="./rapports_financiers.html">
|
||||
<button class="button see-more" style="padding: 10px 20px; background-color: #20195e; color: white; border: none; border-radius: 4px; cursor: pointer;">
|
||||
Voir plus
|
||||
</button>
|
||||
<div class="button-container w3-center w3-margin-top">
|
||||
<a href="./rapports_financiers.html" class="w3-button w3-blue">
|
||||
Voir plus
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Historique des paiements du personnel -->
|
||||
<div class="section-header">
|
||||
<div class="section-header w3-container w3-light-gray w3-border-left" style="border-left: 5px solid #20195e;">
|
||||
<h2>Historique des Paiements du Personnel</h2>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="table-container">
|
||||
<table>
|
||||
<div class="card w3-card-4 w3-white">
|
||||
<div class="table-container w3-responsive">
|
||||
<table class="w3-table-all">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Période</th>
|
||||
@ -172,34 +158,44 @@
|
||||
<td>Denis MONNERAT (permanent)</td>
|
||||
<td>1800,00</td>
|
||||
<td>01/10/2024</td>
|
||||
<td><a href="https://ensap.gouv.fr" target="_blank" class="btn">Voir Bulletin</a></td>
|
||||
<td><a href="https://ensap.gouv.fr" target="_blank" class="w3-button w3-blue">Voir Bulletin</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Août 2024</td>
|
||||
<td>Maxime MENAULT (vacataire)</td>
|
||||
<td>870,00</td>
|
||||
<td>01/09/2024</td>
|
||||
<td><a href="https://ensap.gouv.fr" target="_blank" class="btn">Voir Bulletin</a></td>
|
||||
<td><a href="https://ensap.gouv.fr" target="_blank" class="w3-button w3-blue">Voir Bulletin</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="button-container" style="text-align: center; margin-top: 20px;">
|
||||
<a href="./historique_paiements.html">
|
||||
<button class="button see-more" style="padding: 10px 20px; background-color: #20195e; color: white; border: none; border-radius: 4px; cursor: pointer;">
|
||||
Voir plus
|
||||
</button>
|
||||
<div class="button-container w3-center w3-margin-top">
|
||||
<a href="./historique_paiements.html" class="w3-button w3-blue">
|
||||
Voir plus
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<div class="footer w3-center w3-dark-blue w3-padding-16">
|
||||
<p>© 2024 IUT de Fontainebleau. Tous droits réservés |
|
||||
<a href="../mentions_legales.html">Mentions légales</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function toggleMenu() {
|
||||
var menu = document.getElementById('menu');
|
||||
var nom = document.getElementById('user-section');
|
||||
if (menu.classList.contains('w3-hide-small')) {
|
||||
menu.classList.remove('w3-hide-small');
|
||||
menu.classList.remove('user-section');
|
||||
} else {
|
||||
menu.classList.add('w3-hide-small');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Historique des Transactions</title>
|
||||
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
||||
<link rel="stylesheet" href="../../css/FINANCE/style.css">
|
||||
<link rel="stylesheet" href="../../css/FINANCE/finance.css">
|
||||
<style>
|
||||
.dashboard-container {
|
||||
margin-top: 20px;
|
||||
@ -17,104 +17,72 @@
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
th, td {
|
||||
border: 1px solid #ddd;
|
||||
padding: 10px;
|
||||
text-align: left;
|
||||
}
|
||||
th {
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
.button {
|
||||
padding: 10px 15px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.block { background-color: #f44336; }
|
||||
.cancel { background-color: #ff9800; }
|
||||
.unblock { background-color: #4caf50; }
|
||||
.send { background-color: #2196F3; }
|
||||
.status-en-attente { background-color: #ffeb3b; color: black; }
|
||||
.status-bloque { background-color: #f44336; color: white; }
|
||||
.status-annule { background-color: #ff9800; color: white; }
|
||||
.status-debloque { background-color: #4caf50; color: white; }
|
||||
.status-envoye { background-color: #2196F3; color: white; }
|
||||
.filter-section {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.filter-input {
|
||||
padding: 10px;
|
||||
width: 300px;
|
||||
margin-right: 10px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
.filter-button {
|
||||
padding: 10px 15px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
.footer {
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
background-color: #20195e;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
margin-right: 5px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.filter-all { background-color: #888; }
|
||||
.filter-waiting { background-color: #ffeb3b; color: black; }
|
||||
.filter-blocked { background-color: #f44336; }
|
||||
.filter-canceled { background-color: #ff9800; }
|
||||
.filter-paid { background-color: #2196F3; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<body class="w3-light-grey">
|
||||
|
||||
<div class="header">
|
||||
<div class="logo-container">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil">
|
||||
<div class="header w3-bar w3-card-4 w3-dark-blue">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container w3-bar-item">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil" class="w3-image" style="width:200px; height:50px;">
|
||||
</div>
|
||||
<div class="categories">
|
||||
<a href="./finance.html">Accueil</a>
|
||||
<a href="./paiements_en_attente.html">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html">Historique des transactions</a>
|
||||
<a href="./mes_informations.html">Mes informations et documents</a>
|
||||
|
||||
<!-- 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>
|
||||
|
||||
<!-- Catégories dans le header -->
|
||||
<div id="menu" class="categories w3-hide-small w3-bar-item">
|
||||
<a href="./finance.html" class="w3-bar-item w3-button">Accueil</a>
|
||||
<a href="./paiements_en_attente.html" class="w3-bar-item w3-button">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html" class="w3-bar-item w3-button">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html" class="w3-bar-item w3-button">Historique des transactions</a>
|
||||
<a href="./mes_informations.html" class="w3-bar-item w3-button">Mes informations et documents</a>
|
||||
</div>
|
||||
<div class="user-section">
|
||||
<div class="user-name">Jean DUPONT</div>
|
||||
<div class="logout-container">
|
||||
|
||||
<!-- Section utilisateur avec déconnexion -->
|
||||
<div class="user-section w3-bar-item w3-right">
|
||||
<div class="user-name w3-padding-16">
|
||||
Jean DUPONT
|
||||
</div>
|
||||
<div class="logout-container w3-bar-item">
|
||||
<a href="../../index.html" title="Se déconnecter">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion" style="width:25px; height:25px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dashboard-container">
|
||||
<div class="card">
|
||||
<div class="dashboard-container w3-container">
|
||||
<div class="card w3-card">
|
||||
<h2>Historique des Transactions</h2>
|
||||
|
||||
<!-- Section de filtre -->
|
||||
<div class="filter-section">
|
||||
<input type="text" id="nameFilter" class="filter-input" placeholder="Rechercher par nom..." oninput="filterTable()">
|
||||
<button class="filter-button filter-all" onclick="filterByStatus('')">Tous</button>
|
||||
<button class="filter-button filter-waiting" onclick="filterByStatus('En attente')">En attente</button>
|
||||
<button class="filter-button filter-blocked" onclick="filterByStatus('Bloqué')">Bloqué</button>
|
||||
<button class="filter-button filter-canceled" onclick="filterByStatus('Annulé')">Annulé</button>
|
||||
<button class="filter-button filter-paid" onclick="filterByStatus('Salaire payer')">Payé</button>
|
||||
<div class="filter-section w3-margin-bottom">
|
||||
<input type="text" id="nameFilter" class="filter-input w3-input w3-border" placeholder="Rechercher par nom..." oninput="filterTable()"><br>
|
||||
<button class="w3-button w3-grey" onclick="filterByStatus('')">Tous</button>
|
||||
<button class="w3-button w3-yellow" onclick="filterByStatus('En attente')">En attente</button>
|
||||
<button class="w3-button w3-red" onclick="filterByStatus('Bloqué')">Bloqué</button>
|
||||
<button class="w3-button w3-orange" onclick="filterByStatus('Annulé')">Annulé</button>
|
||||
<button class="w3-button w3-blue" onclick="filterByStatus('Salaire payer')">Payé</button>
|
||||
</div>
|
||||
|
||||
<!-- Tableau des transactions -->
|
||||
<table>
|
||||
<table class="w3-table w3-bordered w3-striped w3-white">
|
||||
<thead>
|
||||
<tr>
|
||||
<tr class="w3-light-grey">
|
||||
<th>ID Paiement</th>
|
||||
<th>Nom du Bénéficiaire</th>
|
||||
<th>Montant (€)</th>
|
||||
@ -126,37 +94,37 @@
|
||||
<td>002</td>
|
||||
<td>Maxime Menault</td>
|
||||
<td>1200,00</td>
|
||||
<td class="status-bloque">Bloqué</td>
|
||||
<td class="w3-red">Bloqué</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>003</td>
|
||||
<td>Denis Monnerat</td>
|
||||
<td>1800,00</td>
|
||||
<td class="status-envoye">Salaire payer</td>
|
||||
<td class="w3-blue">Salaire payer</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>004</td>
|
||||
<td>Sophie Bernard</td>
|
||||
<td>1350,00</td>
|
||||
<td class="status-annule">Annulé</td>
|
||||
<td class="w3-orange">Annulé</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>005</td>
|
||||
<td>Lucas Leroy</td>
|
||||
<td>2000,00</td>
|
||||
<td class="status-bloque">Bloqué</td>
|
||||
<td class="w3-red">Bloqué</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>006</td>
|
||||
<td>Julie Robert</td>
|
||||
<td>1600,00</td>
|
||||
<td class="status-envoye">Salaire payer</td>
|
||||
<td class="w3-blue">Salaire payer</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>007</td>
|
||||
<td>Emilie Caron</td>
|
||||
<td>1750,00</td>
|
||||
<td class="status-envoye">Salaire payer</td>
|
||||
<td class="w3-blue">Salaire payer</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@ -165,7 +133,7 @@
|
||||
|
||||
<div class="footer">
|
||||
<p>© 2024 IUT de Fontainebleau. Tous droits réservés |
|
||||
<a href="../mentions_legales.html">Mentions légales</a>
|
||||
<a href="../mentions_legales.html" class="w3-text-white">Mentions légales</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@ -196,6 +164,17 @@
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function toggleMenu() {
|
||||
var menu = document.getElementById('menu');
|
||||
var nom = document.getElementById('user-section');
|
||||
if (menu.classList.contains('w3-hide-small')) {
|
||||
menu.classList.remove('w3-hide-small');
|
||||
menu.classList.remove('user-section');
|
||||
} else {
|
||||
menu.classList.add('w3-hide-small');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
@ -304,29 +304,32 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="header">
|
||||
<div class="header w3-bar w3-card-4 w3-dark-blue">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil">
|
||||
<div class="logo-container w3-bar-item">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil" class="w3-image" style="width:200px; height:50px;">
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 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>
|
||||
|
||||
<!-- Catégories dans le header -->
|
||||
<div class="categories">
|
||||
<a href="./finance.html">Accueil</a>
|
||||
<a href="./paiements_en_attente.html">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html">Historique des transactions</a>
|
||||
<a href="./mes_informations.html">Mes informations et documents</a>
|
||||
<div id="menu" class="categories w3-hide-small w3-bar-item">
|
||||
<a href="./finance.html" class="w3-bar-item w3-button">Accueil</a>
|
||||
<a href="./paiements_en_attente.html" class="w3-bar-item w3-button">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html" class="w3-bar-item w3-button">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html" class="w3-bar-item w3-button">Historique des transactions</a>
|
||||
<a href="./mes_informations.html" class="w3-bar-item w3-button">Mes informations et documents</a>
|
||||
</div>
|
||||
|
||||
<!-- Section utilisateur avec déconnexion -->
|
||||
<div class="user-section">
|
||||
<div class="user-name">
|
||||
<div class="user-section w3-bar-item w3-right">
|
||||
<div class="user-name w3-padding-16">
|
||||
Jean DUPONT
|
||||
</div>
|
||||
<div class="logout-container">
|
||||
<div class="logout-container w3-bar-item">
|
||||
<a href="../../index.html" title="Se déconnecter">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion" style="width:25px; height:25px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -570,6 +573,17 @@
|
||||
document.getElementById('popup').style.display = 'none';
|
||||
}
|
||||
|
||||
function toggleMenu() {
|
||||
var menu = document.getElementById('menu');
|
||||
var nom = document.getElementById('user-section');
|
||||
if (menu.classList.contains('w3-hide-small')) {
|
||||
menu.classList.remove('w3-hide-small');
|
||||
menu.classList.remove('user-section');
|
||||
} else {
|
||||
menu.classList.add('w3-hide-small');
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
@ -5,45 +5,10 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Paiements en Attente</title>
|
||||
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
||||
<link rel="stylesheet" href="../../css/FINANCE/style.css">
|
||||
<link rel="stylesheet" href="../../css/FINANCE/finance.css">
|
||||
|
||||
<style>
|
||||
|
||||
.dashboard-container {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.card {
|
||||
background-color: white;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
th, td {
|
||||
border: 1px solid #ddd;
|
||||
padding: 10px;
|
||||
text-align: left;
|
||||
}
|
||||
th {
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
.button {
|
||||
padding: 10px 15px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.block { background-color: #f44336; } /* Red */
|
||||
.cancel { background-color: #ff9800; } /* Orange */
|
||||
.unblock { background-color: #4caf50; } /* Green */
|
||||
.send { background-color: #2196F3; } /* Blue */
|
||||
/* Ajout des styles restants qui ne sont pas pris en charge par W3.CSS */
|
||||
.popup {
|
||||
display: none;
|
||||
position: fixed;
|
||||
@ -101,45 +66,47 @@
|
||||
background-color: #2196F3; /* Bleu pour "Envoyé" */
|
||||
color: white;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<body class="w3-light-grey">
|
||||
|
||||
<div class="header">
|
||||
<div class="header w3-bar w3-card-4 w3-dark-blue">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil">
|
||||
<div class="logo-container w3-bar-item">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil" class="w3-image" style="width:200px; height:50px;">
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 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>
|
||||
|
||||
<!-- Catégories dans le header -->
|
||||
<div class="categories">
|
||||
<a href="./finance.html">Accueil</a>
|
||||
<a href="./paiements_en_attente.html">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html">Historique des transactions</a>
|
||||
<a href="./mes_informations.html">Mes informations et documents</a>
|
||||
<div id="menu" class="categories w3-hide-small w3-bar-item">
|
||||
<a href="./finance.html" class="w3-bar-item w3-button">Accueil</a>
|
||||
<a href="./paiements_en_attente.html" class="w3-bar-item w3-button">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html" class="w3-bar-item w3-button">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html" class="w3-bar-item w3-button">Historique des transactions</a>
|
||||
<a href="./mes_informations.html" class="w3-bar-item w3-button">Mes informations et documents</a>
|
||||
</div>
|
||||
|
||||
<!-- Section utilisateur avec déconnexion -->
|
||||
<div class="user-section">
|
||||
<div class="user-name">
|
||||
<div class="user-section w3-bar-item w3-right">
|
||||
<div class="user-name w3-padding-16">
|
||||
Jean DUPONT
|
||||
</div>
|
||||
<div class="logout-container">
|
||||
<div class="logout-container w3-bar-item">
|
||||
<a href="../../index.html" title="Se déconnecter">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion" style="width:25px; height:25px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dashboard-container">
|
||||
<div class="card">
|
||||
<div class="w3-container dashboard-container w3-margin-top">
|
||||
<div class="w3-card w3-white w3-padding">
|
||||
<h2>Liste des paiements en attente de traitement</h2>
|
||||
<table>
|
||||
<table class="w3-table w3-bordered w3-striped w3-white w3-hoverable">
|
||||
<thead>
|
||||
<tr>
|
||||
<tr class="w3-light-grey">
|
||||
<th>ID Paiement</th>
|
||||
<th>Nom du Bénéficiaire</th>
|
||||
<th>Montant (€)</th>
|
||||
@ -154,10 +121,10 @@
|
||||
<td>1200,00</td>
|
||||
<td id="status-2">En attente</td>
|
||||
<td>
|
||||
<button class="button block" onclick="openPopup('bloquer', 2)">Bloquer</button>
|
||||
<button class="button cancel" onclick="openPopup('annuler', 2)">Annuler</button>
|
||||
<button class="button unblock" onclick="openPopup('débloquer', 2)">Débloquer</button>
|
||||
<button class="button send" onclick="openPopup('envoyer', 2)">Payer</button>
|
||||
<button class="w3-button w3-red" onclick="openPopup('bloquer', 2)">Bloquer</button>
|
||||
<button class="w3-button w3-orange" onclick="openPopup('annuler', 2)">Annuler</button>
|
||||
<button class="w3-button w3-green" onclick="openPopup('débloquer', 2)">Débloquer</button>
|
||||
<button class="w3-button w3-blue" onclick="openPopup('envoyer', 2)">Payer</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
@ -166,10 +133,10 @@
|
||||
<td>1800,00</td>
|
||||
<td id="status-3">En attente</td>
|
||||
<td>
|
||||
<button class="button block" onclick="openPopup('bloquer', 3)">Bloquer</button>
|
||||
<button class="button cancel" onclick="openPopup('annuler', 3)">Annuler</button>
|
||||
<button class="button unblock" onclick="openPopup('débloquer', 3)">Débloquer</button>
|
||||
<button class="button send" onclick="openPopup('envoyer', 3)">Payer</button>
|
||||
<button class="w3-button w3-red" onclick="openPopup('bloquer', 3)">Bloquer</button>
|
||||
<button class="w3-button w3-orange" onclick="openPopup('annuler', 3)">Annuler</button>
|
||||
<button class="w3-button w3-green" onclick="openPopup('débloquer', 3)">Débloquer</button>
|
||||
<button class="w3-button w3-blue" onclick="openPopup('envoyer', 3)">Payer</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
@ -178,68 +145,31 @@
|
||||
<td>1350,00</td>
|
||||
<td id="status-4">En attente</td>
|
||||
<td>
|
||||
<button class="button block" onclick="openPopup('bloquer', 4)">Bloquer</button>
|
||||
<button class="button cancel" onclick="openPopup('annuler', 4)">Annuler</button>
|
||||
<button class="button unblock" onclick="openPopup('débloquer', 4)">Débloquer</button>
|
||||
<button class="button send" onclick="openPopup('envoyer', 4)">Payer</button>
|
||||
<button class="w3-button w3-red" onclick="openPopup('bloquer', 4)">Bloquer</button>
|
||||
<button class="w3-button w3-orange" onclick="openPopup('annuler', 4)">Annuler</button>
|
||||
<button class="w3-button w3-green" onclick="openPopup('débloquer', 4)">Débloquer</button>
|
||||
<button class="w3-button w3-blue" onclick="openPopup('envoyer', 4)">Payer</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>005</td>
|
||||
<td>Lucas Leroy (permanent)</td>
|
||||
<td>2000,00</td>
|
||||
<td id="status-5">En attente</td>
|
||||
<td>
|
||||
<button class="button block" onclick="openPopup('bloquer', 5)">Bloquer</button>
|
||||
<button class="button cancel" onclick="openPopup('annuler', 5)">Annuler</button>
|
||||
<button class="button unblock" onclick="openPopup('débloquer', 5)">Débloquer</button>
|
||||
<button class="button send" onclick="openPopup('envoyer', 5)">Payer</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>006</td>
|
||||
<td>Julie Robert (permanent)</td>
|
||||
<td>1600,00</td>
|
||||
<td id="status-6">En attente</td>
|
||||
<td>
|
||||
<button class="button block" onclick="openPopup('bloquer', 6)">Bloquer</button>
|
||||
<button class="button cancel" onclick="openPopup('annuler', 6)">Annuler</button>
|
||||
<button class="button unblock" onclick="openPopup('débloquer', 6)">Débloquer</button>
|
||||
<button class="button send" onclick="openPopup('envoyer', 6)">Payer</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>007</td>
|
||||
<td>Emilie Caron (permanent)</td>
|
||||
<td>1750,00</td>
|
||||
<td id="status-7">En attente</td>
|
||||
<td>
|
||||
<button class="button block" onclick="openPopup('bloquer', 7)">Bloquer</button>
|
||||
<button class="button cancel" onclick="openPopup('annuler', 7)">Annuler</button>
|
||||
<button class="button unblock" onclick="openPopup('débloquer', 7)">Débloquer</button>
|
||||
<button class="button send" onclick="openPopup('envoyer', 7)">Payer</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Ajouter plus de lignes ici -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<div class="w3-center w3-padding-16 w3-text-white" style="background-color: #20195e;">
|
||||
<p>© 2024 IUT de Fontainebleau. Tous droits réservés |
|
||||
<a href="../mentions_legales.html">Mentions légales</a>
|
||||
<a href="../mentions_legales.html" class="w3-text-white">Mentions légales</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Pop-up pour les actions -->
|
||||
<div id="popup" class="popup">
|
||||
<div class="popup-content">
|
||||
<h3 id="popupTitle">Action</h3>
|
||||
<div id="popup" class="popup w3-display-container">
|
||||
<div class="popup-content w3-center">
|
||||
<h3 id="popupTitle" class="w3-text-dark-grey">Action</h3>
|
||||
<p id="popupMessage"></p>
|
||||
<button class="close" onclick="closePopup()">Fermer</button>
|
||||
<button class="confirm" onclick="confirmAction()">Confirmer</button>
|
||||
<button class="close w3-button w3-red w3-round">Fermer</button>
|
||||
<button class="confirm w3-button w3-green w3-round">Confirmer</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -267,37 +197,49 @@
|
||||
}
|
||||
|
||||
function confirmAction() {
|
||||
const statusElement = document.getElementById(`status-${currentPaymentId}`);
|
||||
const statusElement = document.getElementById(`status-${currentPaymentId}`);
|
||||
|
||||
// Réinitialise toutes les classes de statut avant d'ajouter la nouvelle
|
||||
statusElement.classList.remove('status-en-attente', 'status-bloque', 'status-annule', 'status-debloque', 'status-envoye');
|
||||
// Réinitialise toutes les classes de statut avant d'ajouter la nouvelle
|
||||
statusElement.classList.remove('status-en-attente', 'status-bloque', 'status-annule', 'status-debloque', 'status-envoye');
|
||||
|
||||
switch(currentAction) {
|
||||
case 'bloquer':
|
||||
statusElement.textContent = 'Bloqué';
|
||||
statusElement.classList.add('status-bloque');
|
||||
break;
|
||||
case 'annuler':
|
||||
statusElement.textContent = 'Annulé';
|
||||
statusElement.classList.add('status-annule');
|
||||
break;
|
||||
case 'débloquer':
|
||||
statusElement.textContent = 'Débloqué';
|
||||
statusElement.classList.add('status-debloque');
|
||||
break;
|
||||
case 'envoyer':
|
||||
statusElement.textContent = 'Salaire payer';
|
||||
statusElement.classList.add('status-envoye');
|
||||
break;
|
||||
default:
|
||||
statusElement.textContent = 'En attente';
|
||||
statusElement.classList.add('status-en-attente');
|
||||
}
|
||||
switch(currentAction) {
|
||||
case 'bloquer':
|
||||
statusElement.textContent = 'Bloqué';
|
||||
statusElement.classList.add('status-bloque');
|
||||
break;
|
||||
case 'annuler':
|
||||
statusElement.textContent = 'Annulé';
|
||||
statusElement.classList.add('status-annule');
|
||||
break;
|
||||
case 'débloquer':
|
||||
statusElement.textContent = 'Débloqué';
|
||||
statusElement.classList.add('status-debloque');
|
||||
break;
|
||||
case 'envoyer':
|
||||
statusElement.textContent = 'Envoyé';
|
||||
statusElement.classList.add('status-envoye');
|
||||
break;
|
||||
}
|
||||
|
||||
closePopup();
|
||||
}
|
||||
closePopup();
|
||||
}
|
||||
|
||||
// Fermer le popup avec le bouton "Fermer"
|
||||
document.querySelector('.close').addEventListener('click', closePopup);
|
||||
|
||||
// Confirmer l'action
|
||||
document.querySelector('.confirm').addEventListener('click', confirmAction);
|
||||
|
||||
function toggleMenu() {
|
||||
var menu = document.getElementById('menu');
|
||||
var nom = document.getElementById('user-section');
|
||||
if (menu.classList.contains('w3-hide-small')) {
|
||||
menu.classList.remove('w3-hide-small');
|
||||
menu.classList.remove('user-section');
|
||||
} else {
|
||||
menu.classList.add('w3-hide-small');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -68,78 +68,88 @@
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<body class="w3-light-grey">
|
||||
|
||||
<div class="header">
|
||||
<div class="logo-container">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil">
|
||||
<div class="header w3-bar w3-card-4 w3-dark-blue">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container w3-bar-item">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil" class="w3-image" style="width:200px; height:50px;">
|
||||
</div>
|
||||
<div class="categories">
|
||||
<a href="./finance.html">Accueil</a>
|
||||
<a href="./paiements_en_attente.html">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html">Historique des transactions</a>
|
||||
<a href="./mes_informations.html">Mes informations et documents</a>
|
||||
|
||||
<!-- 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>
|
||||
|
||||
<!-- Catégories dans le header -->
|
||||
<div id="menu" class="categories w3-hide-small w3-bar-item">
|
||||
<a href="./finance.html" class="w3-bar-item w3-button">Accueil</a>
|
||||
<a href="./paiements_en_attente.html" class="w3-bar-item w3-button">Paiements en attente</a>
|
||||
<a href="./rapports_financiers.html" class="w3-bar-item w3-button">Rapports Financiers</a>
|
||||
<a href="./historique_paiements.html" class="w3-bar-item w3-button">Historique des transactions</a>
|
||||
<a href="./mes_informations.html" class="w3-bar-item w3-button">Mes informations et documents</a>
|
||||
</div>
|
||||
<div class="user-section">
|
||||
<div class="user-name">Jean DUPONT</div>
|
||||
<div class="logout-container">
|
||||
|
||||
<!-- Section utilisateur avec déconnexion -->
|
||||
<div class="user-section w3-bar-item w3-right">
|
||||
<div class="user-name w3-padding-16">
|
||||
Jean DUPONT
|
||||
</div>
|
||||
<div class="logout-container w3-bar-item">
|
||||
<a href="../../index.html" title="Se déconnecter">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion" style="width:25px; height:25px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dashboard-container">
|
||||
<div class="dashboard-container w3-container">
|
||||
<div class="section-header">
|
||||
<h2>Historique des rapports financiers</h2>
|
||||
</div>
|
||||
|
||||
<!-- Index des rapports financiers -->
|
||||
<div class="index-container">
|
||||
<div class="report-item">
|
||||
<div class="index-container w3-card">
|
||||
<div class="report-item w3-card-4">
|
||||
<span>Rapport financier : BUT Informatique - Octobre 2024</span>
|
||||
<a href="chemin/vers/rapport_but_informatique_sem1_2024.pdf" download>Télécharger</a>
|
||||
<a href="chemin/vers/rapport_but_informatique_sem1_2024.pdf" download class="w3-button w3-blue">Télécharger</a>
|
||||
</div>
|
||||
<div class="report-item">
|
||||
<div class="report-item w3-card-4">
|
||||
<span>Rapport financier : BUT GEA - Octobre 2024</span>
|
||||
<a href="chemin/vers/rapport_but_gea_sem1_2024.pdf" download>Télécharger</a>
|
||||
<a href="chemin/vers/rapport_but_gea_sem1_2024.pdf" download class="w3-button w3-blue">Télécharger</a>
|
||||
</div>
|
||||
<div class="report-item">
|
||||
<div class="report-item w3-card-4">
|
||||
<span>Rapport financier : BUT Informatique - Septembre 2024</span>
|
||||
<a href="chemin/vers/rapport_but_informatique_sem2_2024.pdf" download>Télécharger</a>
|
||||
<a href="chemin/vers/rapport_but_informatique_sem2_2024.pdf" download class="w3-button w3-blue">Télécharger</a>
|
||||
</div>
|
||||
<div class="report-item">
|
||||
<div class="report-item w3-card-4">
|
||||
<span>Rapport financier : BUT GEA - Septembre 2024</span>
|
||||
<a href="chemin/vers/rapport_but_gea_sem2_2024.pdf" download>Télécharger</a>
|
||||
<a href="chemin/vers/rapport_but_gea_sem2_2024.pdf" download class="w3-button w3-blue">Télécharger</a>
|
||||
</div>
|
||||
<!-- Ajoutez d'autres rapports ici -->
|
||||
</div>
|
||||
|
||||
<!-- Section pour générer un faux rapport -->
|
||||
<div class="generate-report-section">
|
||||
<div class="generate-report-section w3-card">
|
||||
<h3>Générer un rapport financier</h3>
|
||||
<form id="generateReportForm">
|
||||
<label for="formationSelect">Sélectionnez une formation:</label>
|
||||
<select id="formationSelect" name="formation">
|
||||
<select id="formationSelect" name="formation" class="w3-select">
|
||||
<option value="informatique">BUT Informatique</option>
|
||||
<option value="gea">BUT GEA</option>
|
||||
</select><br>
|
||||
<label for="semesterSelect">Sélectionnez un semestre:</label>
|
||||
<select id="semesterSelect" name="semester">
|
||||
<select id="semesterSelect" name="semester" class="w3-select">
|
||||
<option value="semestre1">Octobre 2024</option>
|
||||
<option value="semestre2">Septembre 2024</option>
|
||||
</select><br><br>
|
||||
<button type="submit">Générer le Rapport</button>
|
||||
<button type="submit" class="w3-button w3-blue">Générer le Rapport</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<div class="footer w3-padding">
|
||||
<p>© 2024 IUT de Fontainebleau. Tous droits réservés |
|
||||
<a href="../mentions_legales.html" style="color: white;">Mentions légales</a>
|
||||
<a href="../mentions_legales.html" class="w3-text-white">Mentions légales</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@ -151,6 +161,17 @@
|
||||
alert(`Génération d'un rapport financier pour la formation BUT ${formation} - ${semester}`);
|
||||
// Ici, vous pouvez ajouter votre logique pour générer le rapport
|
||||
});
|
||||
|
||||
function toggleMenu() {
|
||||
var menu = document.getElementById('menu');
|
||||
var nom = document.getElementById('user-section');
|
||||
if (menu.classList.contains('w3-hide-small')) {
|
||||
menu.classList.remove('w3-hide-small');
|
||||
menu.classList.remove('user-section');
|
||||
} else {
|
||||
menu.classList.add('w3-hide-small');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
@ -65,125 +65,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Emploi du Temps avec navigation de semaines -->
|
||||
<div class="section-header">
|
||||
<h2>Mon Emploi du Temps</h2>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<!-- Navigation entre semaines -->
|
||||
<div class="week-navigation">
|
||||
<button>« Semaine précédente</button>
|
||||
<p><strong>Semaine du 18 au 24 Novembre 2024</strong></p>
|
||||
<button>Semaine suivante »</button>
|
||||
</div>
|
||||
|
||||
<div class="schedule-container">
|
||||
<table class="schedule-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Heures</th>
|
||||
<th>Lundi</th>
|
||||
<th>Mardi</th>
|
||||
<th>Mercredi</th>
|
||||
<th>Jeudi</th>
|
||||
<th>Vendredi</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="time-slot">08:00 - 08:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">08:30 - 09:00</td>
|
||||
<td class="class">TP - SCR<br><span>Salle 224 - BUT1 Groupe 3</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">09:00 - 09:30</td>
|
||||
<td class="class">TP - Mathématiques<br><span>Salle 101 - BUT2 Groupe 1</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TD - SCR<br><span>Salle 305 - BUT1 Groupe 2</span></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">09:30 - 10:00</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 202 - BUT1 Groupe 2</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 202 - BUT1 Groupe 2</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">10:00 - 10:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 202 - BUT1 Groupe 2</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - SCR<br><span>Salle 305 - BUT1 Groupe 2</span></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">10:30 - 11:00</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 202 - BUT1 Groupe 4</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">11:00 - 11:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">13:00 - 13:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 225 - BUT1 Groupe 1</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">13:30 - 14:00</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 225 - BUT1 Groupe 2</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">14:00 - 14:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 225 - BUT1 Groupe 3</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">14:30 - 15:00</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 225 - BUT1 Groupe 4</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Suivi des Paiements -->
|
||||
<div class="section-header">
|
||||
<h2>Suivi des Paiements</h2>
|
||||
|
||||
@ -6,187 +6,140 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="../../css/RH/style.css">
|
||||
<link rel="stylesheet" href="../../css/RH/rh.css">
|
||||
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
||||
<title>Gestion des Candidatures</title>
|
||||
<style>
|
||||
/* Ajout de styles pour la barre de recherche et le tri */
|
||||
.search-container {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.sort-container {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.sort-button {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
max-height: 80vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.comment-container {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
/* Styles pour la pop-up d'ajout d'offre de vacation */
|
||||
.vacation-modal {
|
||||
display: none; /* Masquer par défaut */
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
background-color: rgb(0,0,0);
|
||||
background-color: rgba(0,0,0,0.4);
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.vacation-modal-content {
|
||||
background-color: #fefefe;
|
||||
margin: 5% auto;
|
||||
padding: 20px;
|
||||
border: 1px solid #888;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.validationDossier{
|
||||
margin-top: 25px;
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.refusDossier{
|
||||
background-color: rgb(128, 0, 0);
|
||||
}
|
||||
|
||||
.commentairee{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="header">
|
||||
<div class="logo-container">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil">
|
||||
<body class="w3-light-grey">
|
||||
|
||||
<div class="header w3-bar w3-card-4 w3-dark-blue">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container w3-bar-item">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil" class="w3-image" style="width:200px; height:50px;">
|
||||
</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>
|
||||
<!-- 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>
|
||||
|
||||
<div class="user-section">
|
||||
<div class="user-name">Alice BERGER</div>
|
||||
<div class="logout-container">
|
||||
<!-- Catégories dans le header -->
|
||||
<div id="menu" class="categories w3-hide-small w3-bar-item">
|
||||
<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 -->
|
||||
<div class="user-section w3-bar-item w3-right">
|
||||
<div class="user-name w3-padding-16">
|
||||
Alice BERGER
|
||||
</div>
|
||||
<div class="logout-container w3-bar-item">
|
||||
<a href="../../index.html" title="Se déconnecter">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion" style="width:25px; height:25px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<main>
|
||||
<section>
|
||||
<h2>Candidatures en Attente de Validation</h2>
|
||||
|
||||
<!-- Barre de recherche -->
|
||||
<div class="search-container">
|
||||
<input type="text" id="search-input" placeholder="Rechercher par nom" oninput="filterTable()">
|
||||
<div class="w3-container">
|
||||
<div class="w3-row">
|
||||
<div class="w3-col s10">
|
||||
<h2>Candidatures en Attente de Validation</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Conteneur de tri -->
|
||||
<div class="sort-container">
|
||||
<button class="sort-button" onclick="sortTable(0)">Trier par Nom</button>
|
||||
<button class="sort-button" onclick="sortTable(1)">Trier par Prénom</button>
|
||||
<button class="sort-button" onclick="sortTable(2)">Trier par Formation</button>
|
||||
<button class="sort-button" onclick="openVacationModal()">Ajouter une Offre de Vacation</button>
|
||||
</div>
|
||||
<!-- Barre de recherche -->
|
||||
<div class="w3-margin-bottom">
|
||||
<input type="text" id="search-input" placeholder="Rechercher par nom" oninput="filterTable()" class="w3-input w3-border">
|
||||
</div>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Nom</th>
|
||||
<th>Prénom</th>
|
||||
<th>Formation Demandée</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="candidatures-table">
|
||||
<tr>
|
||||
<td>Mike</td>
|
||||
<td>Michel</td>
|
||||
<td>Informatique - BUT1</td>
|
||||
<td>
|
||||
<button onclick="consulterDossier('Mike', 'Michel')">Consulter Dossier</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>John</td>
|
||||
<td>Williams</td>
|
||||
<td>Mathématiques - BUT GEA</td>
|
||||
<td>
|
||||
<button onclick="consulterDossier('John', 'Williams')">Consulter Dossier</button>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Ajoutez d'autres lignes ici -->
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
</main>
|
||||
<!-- Conteneur de tri -->
|
||||
<div class="w3-margin-bottom">
|
||||
<button class="w3-button w3-green" onclick="sortTable(0)">Trier par Nom</button>
|
||||
<button class="w3-button w3-green" onclick="sortTable(1)">Trier par Prénom</button>
|
||||
<button class="w3-button w3-green" onclick="sortTable(2)">Trier par Formation</button>
|
||||
<button class="w3-button w3-green" onclick="openVacationModal()">Ajouter une Offre de Vacation</button>
|
||||
</div>
|
||||
|
||||
<table class="w3-table w3-bordered w3-white">
|
||||
<thead>
|
||||
<tr class="w3-green">
|
||||
<th>Nom</th>
|
||||
<th>Prénom</th>
|
||||
<th>Formation</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="candidatures-table">
|
||||
<tr>
|
||||
<td>Mike</td>
|
||||
<td>Michel</td>
|
||||
<td>Informatique - BUT1</td>
|
||||
<td>
|
||||
<button class="w3-button w3-green" onclick="consulterDossier('Mike', 'Michel')">Consulter Dossier</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>John</td>
|
||||
<td>Williams</td>
|
||||
<td>Mathématiques - BUT GEA</td>
|
||||
<td>
|
||||
<button class="w3-button w3-green" onclick="consulterDossier('John', 'Williams')">Consulter Dossier</button>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Ajoutez d'autres lignes ici -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Modal pour consulter le dossier de candidature -->
|
||||
<div id="dossierModal" class="modal">
|
||||
<div class="modal-content">
|
||||
<span class="close" onclick="closeDossierModal()">×</span>
|
||||
<h2>Dossier de Candidature : <span id="dossier-nom"></span> <span id="dossier-prenom"></span></h2>
|
||||
<h3>Pièces Justificatives :</h3>
|
||||
<ul id="pieces-list"></ul>
|
||||
<div class="comment-container">
|
||||
<h3>Commentaire :</h3>
|
||||
<textarea class="commentairee" rows="4" placeholder="Ajouter un commentaire sur ce dossier..."></textarea><br>
|
||||
<button onclick="ajouterCommentaire()">Ajouter Commentaire</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="validationDossier" onclick="validerDossier()">Valider Dossier</button>
|
||||
<button class="refusDossier" onclick="refuserDossier()">Refuser Dossier</button>
|
||||
<div id="dossierModal" class="w3-modal">
|
||||
<div class="w3-modal-content">
|
||||
<span class="w3-button w3-display-topright" onclick="closeDossierModal()">×</span>
|
||||
<div class="w3-container">
|
||||
<h2>Dossier de Candidature : <span id="dossier-nom"></span> <span id="dossier-prenom"></span></h2>
|
||||
<h3>Pièces Justificatives :</h3>
|
||||
<ul id="pieces-list"></ul>
|
||||
<div class="comment-container">
|
||||
<h3>Commentaire :</h3>
|
||||
<textarea class="w3-input w3-border" id="commentaire" rows="4" placeholder="Ajouter un commentaire sur ce dossier..."></textarea><br>
|
||||
<button class="w3-button w3-lime" style="margin-bottom: 10px;" onclick="ajouterCommentaire()">Ajouter Commentaire</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="w3-button w3-green" onclick="validerDossier()">Valider Dossier</button>
|
||||
<button class="w3-button w3-red" onclick="refuserDossier()">Refuser Dossier</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal pour ajouter une offre de vacation -->
|
||||
<div id="vacationModal" class="vacation-modal">
|
||||
<div class="vacation-modal-content">
|
||||
<span class="close" onclick="closeVacationModal()">×</span>
|
||||
<h2>Ajouter une Offre de Vacation</h2>
|
||||
<form id="vacation-form">
|
||||
<label for="diplome">Diplôme requis :</label><br>
|
||||
<input type="text" id="diplome" name="diplome" required><br><br>
|
||||
|
||||
<label for="description">Description :</label><br>
|
||||
<textarea id="description" name="description" rows="4" required></textarea><br><br>
|
||||
|
||||
|
||||
<label for="duree">Durée (en jours) :</label><br>
|
||||
<input type="number" id="duree" name="duree" min="1" required><br><br>
|
||||
|
||||
<button type="submit">Soumettre l'Offre</button>
|
||||
</form>
|
||||
<div id="vacationModal" class="w3-modal">
|
||||
<div class="w3-modal-content">
|
||||
<span class="w3-button w3-display-topright" onclick="closeVacationModal()">×</span>
|
||||
<div class="w3-container">
|
||||
<h2>Ajouter une Offre de Vacation</h2>
|
||||
<form id="vacation-form">
|
||||
<label for="diplome">Diplôme requis :</label>
|
||||
<input type="text" id="diplome" name="diplome" required class="w3-input w3-border">
|
||||
|
||||
<label for="description">Description :</label>
|
||||
<textarea id="description" name="description" rows="4" required class="w3-input w3-border"></textarea>
|
||||
|
||||
<label for="duree">Durée (en jours) :</label>
|
||||
<input type="number" id="duree" name="duree" min="1" required class="w3-input w3-border">
|
||||
|
||||
<button type="submit" class="w3-button w3-green">Soumettre l'Offre</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="footer">
|
||||
<div class="w3-container w3-center w3-padding-16 w3-text-white" style="background-color: #0f431f;">
|
||||
<p>© 2024 IUT de Fontainebleau. Tous droits réservés |
|
||||
<a href="../mentions_legales.html">Mentions légales</a>
|
||||
<a href="../mentions_legales.html" class="w3-text-white">Mentions légales</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@ -230,32 +183,29 @@
|
||||
<li><a href="">CV - ${prenom} ${nom}.pdf</a></li>
|
||||
<li><a href="">Diplôme - Licence Informatique.pdf</a></li>
|
||||
<li><a href="">Lettre de motivation.pdf</a></li>
|
||||
<li><a href="">Justificatif d'expérience.pdf</a></li>
|
||||
`; // Remplacer par les vraies données
|
||||
<li><a href="">Justificatif de domicile.pdf</a></li>
|
||||
`;
|
||||
document.getElementById("dossierModal").style.display = "block";
|
||||
}
|
||||
|
||||
function closeDossierModal() {
|
||||
document.getElementById("dossierModal").style.display = "none";
|
||||
document.getElementById("commentaire").value = ""; // Réinitialiser le champ de commentaire
|
||||
}
|
||||
|
||||
function ajouterCommentaire() {
|
||||
const commentaire = document.getElementById("commentaire").value;
|
||||
alert(`Commentaire ajouté : ${commentaire}`);
|
||||
// Logic to handle the comment addition can be implemented here
|
||||
document.getElementById("commentaire").value = ""; // Réinitialiser le champ
|
||||
}
|
||||
|
||||
function validerDossier() {
|
||||
alert("Dossier validé !");
|
||||
closeDossierModal();
|
||||
// Logic to handle the validation of the dossier can be implemented here
|
||||
}
|
||||
|
||||
function refuserDossier() {
|
||||
alert("Dossier refusé !");
|
||||
closeDossierModal();
|
||||
// Logic to handle the refusal of the dossier can be implemented here
|
||||
}
|
||||
|
||||
function openVacationModal() {
|
||||
@ -264,16 +214,25 @@
|
||||
|
||||
function closeVacationModal() {
|
||||
document.getElementById("vacationModal").style.display = "none";
|
||||
document.getElementById("vacation-form").reset(); // Réinitialiser le formulaire
|
||||
}
|
||||
|
||||
// Gestion de la soumission du formulaire d'offre de vacation
|
||||
document.getElementById("vacation-form").addEventListener("submit", function(event) {
|
||||
event.preventDefault(); // Empêcher le rechargement de la page
|
||||
alert("Offre de vacation soumise !");
|
||||
closeVacationModal(); // Fermer la pop-up après soumission
|
||||
// Ici, vous pouvez ajouter le code pour traiter l'envoi du formulaire, comme envoyer les données à un serveur.
|
||||
});
|
||||
document.getElementById("vacation-form").onsubmit = function (event) {
|
||||
event.preventDefault(); // Empêche le rechargement de la page
|
||||
alert("Offre de vacation ajoutée !");
|
||||
closeVacationModal();
|
||||
};
|
||||
|
||||
function toggleMenu() {
|
||||
var menu = document.getElementById('menu');
|
||||
var nom = document.getElementById('user-section');
|
||||
if (menu.classList.contains('w3-hide-small')) {
|
||||
menu.classList.remove('w3-hide-small');
|
||||
menu.classList.remove('user-section');
|
||||
} else {
|
||||
menu.classList.add('w3-hide-small');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
|
||||
@ -93,24 +93,32 @@
|
||||
|
||||
<body>
|
||||
|
||||
<div class="header">
|
||||
<div class="logo-container">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil">
|
||||
<div class="header w3-bar w3-card-4 w3-dark-blue">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container w3-bar-item">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil" class="w3-image" style="width:200px; height:50px;">
|
||||
</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>
|
||||
<!-- 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>
|
||||
|
||||
<div class="user-section">
|
||||
<div class="user-name">Alice BERGER</div>
|
||||
<div class="logout-container">
|
||||
<!-- Catégories dans le header -->
|
||||
<div id="menu" class="categories w3-hide-small w3-bar-item">
|
||||
<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 -->
|
||||
<div class="user-section w3-bar-item w3-right">
|
||||
<div class="user-name w3-padding-16">
|
||||
Alice BERGER
|
||||
</div>
|
||||
<div class="logout-container w3-bar-item">
|
||||
<a href="../../index.html" title="Se déconnecter">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion" style="width:25px; height:25px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -6,112 +6,60 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="../../css/RH/style.css">
|
||||
<link rel="stylesheet" href="../../css/RH/rh.css">
|
||||
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> <!-- Include W3.CSS -->
|
||||
<title>Gestion du Personnel</title>
|
||||
<style>
|
||||
/* Ajout de styles pour la barre de recherche et le tri */
|
||||
.search-container {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.sort-container {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.sort-button {
|
||||
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 {
|
||||
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{
|
||||
background-color: rgb(128, 0, 0);
|
||||
}
|
||||
|
||||
.voirDetailBouton{
|
||||
background-color: rgb(255, 140, 0);
|
||||
}
|
||||
|
||||
.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>
|
||||
|
||||
<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 class="header w3-bar w3-card-4 w3-dark-blue">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container w3-bar-item">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil" class="w3-image" style="width:200px; height:50px;">
|
||||
</div>
|
||||
|
||||
<main>
|
||||
<!-- 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>
|
||||
|
||||
<!-- Catégories dans le header -->
|
||||
<div id="menu" class="categories w3-hide-small w3-bar-item">
|
||||
<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 -->
|
||||
<div class="user-section w3-bar-item w3-right">
|
||||
<div class="user-name w3-padding-16">
|
||||
Alice BERGER
|
||||
</div>
|
||||
<div class="logout-container w3-bar-item">
|
||||
<a href="../../index.html" title="Se déconnecter">
|
||||
<img src="../../media/img/LogOutWhite.png" alt="Logo Déconnexion" style="width:25px; height:25px;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<main class="w3-container">
|
||||
<section>
|
||||
<h2>Gestion du personnel</h2>
|
||||
<!-- Barre de recherche -->
|
||||
<div class="search-container">
|
||||
<input type="text" id="search-input" placeholder="Rechercher par nom" oninput="filterTable()">
|
||||
<div class="w3-margin-bottom">
|
||||
<input type="text" id="search-input" placeholder="Rechercher par nom" oninput="filterTable()" class="w3-input w3-border">
|
||||
</div>
|
||||
|
||||
<!-- Conteneur de tri -->
|
||||
<div class="sort-container">
|
||||
<button class="sort-button" onclick="sortTable(0)">Trier par Nom</button>
|
||||
<button class="sort-button" onclick="sortTable(1)">Trier par Prénom</button>
|
||||
<button class="sort-button" onclick="sortTable(2)">Trier par Statut</button>
|
||||
<button class="sort-button" onclick="sortTable(3)">Trier par Dernière Intervention</button>
|
||||
<div class="w3-margin-bottom">
|
||||
<button class="w3-button w3-green" onclick="sortTable(0)">Trier par Nom</button>
|
||||
<button class="w3-button w3-green" onclick="sortTable(1)">Trier par Prénom</button>
|
||||
<button class="w3-button w3-green" onclick="sortTable(2)">Trier par Statut</button>
|
||||
<button class="w3-button w3-green" onclick="sortTable(3)">Trier par Dernière Intervention</button>
|
||||
</div>
|
||||
|
||||
<table>
|
||||
<table class="w3-table w3-bordered w3-white">
|
||||
<thead>
|
||||
<tr>
|
||||
<tr class="w3-green">
|
||||
<th>Nom</th>
|
||||
<th>Prénom</th>
|
||||
<th>Statut</th>
|
||||
@ -128,9 +76,9 @@
|
||||
<td>En attente</td>
|
||||
<td>01/10/2024</td>
|
||||
<td>
|
||||
<button class="modifierBouton" onclick="openModal2('Dupont', 'Jean', 'Professeur Vacataire', '01/10/2024')">Modifier</button>
|
||||
<button class="supprimerBouton" onclick="supprimerPersonnel('Dupont', 'Jean')">Supprimer</button>
|
||||
<button class="voirDetailBouton" onclick="voirDetails('Dupont', 'Jean', 'Professeur Vacataire', '01/10/2024')">Voir Détails</button>
|
||||
<button class="w3-button w3-green" onclick="openModal2('Dupont', 'Jean', 'Professeur Vacataire', '01/10/2024')">Modifier</button>
|
||||
<button class="w3-button w3-red" onclick="supprimerPersonnel('Dupont', 'Jean')">Supprimer</button>
|
||||
<button class="w3-button w3-orange" onclick="voirDetails('Dupont', 'Jean', 'Professeur Vacataire', '01/10/2024')">Voir Détails</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
@ -140,42 +88,41 @@
|
||||
<td>En attente</td>
|
||||
<td>15/09/2024</td>
|
||||
<td>
|
||||
<button class="modifierBouton" onclick="openModal2('Martin', 'Sophie', 'Professeur Vacataire', '15/09/2024')">Modifier</button>
|
||||
<button class="supprimerBouton" onclick="supprimerPersonnel('Martin', 'Sophie')">Supprimer</button>
|
||||
<button class="voirDetailBouton" onclick="voirDetails('Martin', 'Sophie', 'Professeur Vacataire', '15/09/2024')">Voir Détails</button>
|
||||
<button class="w3-button w3-green" onclick="openModal2('Martin', 'Sophie', 'Professeur Vacataire', '15/09/2024')">Modifier</button>
|
||||
<button class="w3-button w3-red" onclick="supprimerPersonnel('Martin', 'Sophie')">Supprimer</button>
|
||||
<button class="w3-button w3-orange" onclick="voirDetails('Martin', 'Sophie', 'Professeur Vacataire', '15/09/2024')">Voir Détails</button>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Ajoutez d'autres lignes ici -->
|
||||
</tbody>
|
||||
</table>
|
||||
<button onclick="ajouterPersonnel()">Ajouter un Personnel</button>
|
||||
<button class="w3-button w3-green" style="margin-bottom: 10px;" onclick="ajouterPersonnel()">Ajouter un Personnel</button>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- Modal pour modifier le personnel -->
|
||||
<div id="myModal" class="modal">
|
||||
<div class="modal-content">
|
||||
<span class="close" onclick="closeModal()">×</span>
|
||||
<h2>Modifier le Personnel</h2>
|
||||
<form id="edit-form">
|
||||
<div id="myModal" class="modal w3-modal">
|
||||
<div class="w3-modal-content w3-card-4">
|
||||
<span class="w3-button w3-display-topright" onclick="closeModal()">×</span>
|
||||
<h2 class="w3-green">Modifier le Personnel</h2>
|
||||
<form id="edit-form" class="w3-container">
|
||||
<label for="nom">Nom:</label>
|
||||
<input type="text" id="nom" required><br>
|
||||
<input type="text" id="nom" required class="w3-input w3-border"><br>
|
||||
<label for="prenom">Prénom:</label>
|
||||
<input type="text" id="prenom" required><br>
|
||||
<input type="text" id="prenom" required class="w3-input w3-border"><br>
|
||||
<label for="statut">Statut:</label>
|
||||
<input type="text" id="statut" required><br>
|
||||
<input type="text" id="statut" required class="w3-input w3-border"><br>
|
||||
<label for="intervention">Dernière Intervention:</label>
|
||||
<input type="date" id="intervention" required><br>
|
||||
<button type="submit">Enregistrer</button>
|
||||
<input type="date" id="intervention" required class="w3-input w3-border"><br>
|
||||
<button type="submit" class="w3-button w3-green">Enregistrer</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal pour voir les détails du personnel -->
|
||||
<div id="detailModal" class="modal">
|
||||
<div class="modal-content">
|
||||
<span class="close" onclick="closeDetailModal()">×</span>
|
||||
<h2>Détails de Personnel</h2>
|
||||
<div id="detailModal" class="modal w3-modal">
|
||||
<div class="w3-modal-content w3-card-4">
|
||||
<span class="w3-button w3-display-topright" onclick="closeDetailModal()">×</span>
|
||||
<h2 class="w3-green">Détails de Personnel</h2>
|
||||
<p id="detail-info"></p>
|
||||
<p id="coordonnees"></p>
|
||||
<h3>Heures à Payer</h3>
|
||||
@ -186,17 +133,16 @@
|
||||
<ul id="documents-list"></ul>
|
||||
<h3>Statut</h3>
|
||||
<p id="statut-detail"></p>
|
||||
<button onclick="lancerProcedurePaiement()">Lancer la Procédure de Paiement</button>
|
||||
|
||||
<button class="w3-button w3-green" onclick="lancerProcedurePaiement()">Lancer la Procédure de Paiement</button>
|
||||
</div>
|
||||
</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>
|
||||
<div class="w3-container w3-center w3-padding-16 w3-text-white" style="background-color: #0f431f;">
|
||||
<p>© 2024 IUT de Fontainebleau. Tous droits réservés |
|
||||
<a href="../mentions_legales.html" class="w3-text-white">Mentions légales</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let sortOrder = [true, true, true, true]; // Array to keep track of sort order for each column
|
||||
@ -211,118 +157,84 @@
|
||||
const aText = a.cells[columnIndex].textContent.trim();
|
||||
const bText = b.cells[columnIndex].textContent.trim();
|
||||
|
||||
if (columnIndex === 3) { // Date column
|
||||
if (columnIndex === 3) { // Date column (Dernière Intervention)
|
||||
return direction * (new Date(aText) - new Date(bText));
|
||||
} else {
|
||||
return direction * aText.localeCompare(bText);
|
||||
}
|
||||
return direction * aText.localeCompare(bText);
|
||||
});
|
||||
|
||||
// Reattach sorted rows to the table
|
||||
rows.forEach(row => table.appendChild(row));
|
||||
rows.forEach(row => table.appendChild(row)); // Re-append sorted rows
|
||||
}
|
||||
|
||||
function filterTable() {
|
||||
const input = document.getElementById("search-input").value.toLowerCase();
|
||||
const input = document.getElementById("search-input");
|
||||
const filter = input.value.toLowerCase();
|
||||
const table = document.getElementById("personnel-table");
|
||||
const rows = Array.from(table.rows);
|
||||
const rows = table.getElementsByTagName("tr");
|
||||
|
||||
rows.forEach(row => {
|
||||
const cells = Array.from(row.cells);
|
||||
const match = cells[0].textContent.toLowerCase().includes(input) ||
|
||||
cells[1].textContent.toLowerCase().includes(input);
|
||||
row.style.display = match ? "" : "none";
|
||||
});
|
||||
}
|
||||
for (let i = 0; i < rows.length; i++) {
|
||||
const cells = rows[i].getElementsByTagName("td");
|
||||
let rowVisible = false;
|
||||
|
||||
function openModal(nom, prenom, statut, intervention) {
|
||||
// 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";
|
||||
}
|
||||
|
||||
function supprimerPersonnel(nom, prenom) {
|
||||
if (confirm(`Êtes-vous sûr de vouloir supprimer ${prenom} ${nom} ?`)) {
|
||||
const row = event.target.closest("tr");
|
||||
row.parentNode.removeChild(row);
|
||||
for (let j = 0; j < cells.length; j++) {
|
||||
if (cells[j].textContent.toLowerCase().includes(filter)) {
|
||||
rowVisible = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
rows[i].style.display = rowVisible ? "" : "none"; // Show or hide row
|
||||
}
|
||||
}
|
||||
|
||||
function openModificationModal(nom, prenom, statut, intervention) {
|
||||
function openModal2(nom, prenom, statut, intervention) {
|
||||
// Populate the modal with the data
|
||||
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";
|
||||
document.getElementById("myModal").style.display = "block"; // Show modal
|
||||
}
|
||||
|
||||
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=\"./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").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 closeModal() {
|
||||
document.getElementById("myModal").style.display = "none"; // Hide modal
|
||||
}
|
||||
|
||||
function closeDetailModal() {
|
||||
document.getElementById("detailModal").style.display = "none";
|
||||
}
|
||||
|
||||
function openModal2(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";
|
||||
document.getElementById("detailModal").style.display = "none"; // Hide detail modal
|
||||
}
|
||||
|
||||
function ajouterPersonnel() {
|
||||
// Logic to add personnel goes here
|
||||
alert("Fonctionnalité à venir !");
|
||||
// Logic to add personnel
|
||||
alert("Ajouter personnel n'est pas encore implémentée.");
|
||||
}
|
||||
|
||||
function supprimerPersonnel(nom, prenom) {
|
||||
// Logic to delete personnel
|
||||
alert(`Suppression de ${prenom} ${nom} n'est pas encore implémentée.`);
|
||||
}
|
||||
|
||||
function voirDetails(nom, prenom, statut, intervention) {
|
||||
// Populate the detail modal with personnel details
|
||||
const detailInfo = `Nom: ${nom}, Prénom: ${prenom}, Statut: ${statut}, Dernière Intervention: ${intervention}`;
|
||||
document.getElementById("detail-info").textContent = detailInfo;
|
||||
document.getElementById("heures-a-payer").textContent = "Heures à payer : 10h"; // Example data
|
||||
document.getElementById("statut-detail").textContent = "Statut: En attente"; // Example data
|
||||
document.getElementById("detailModal").style.display = "block"; // Show detail modal
|
||||
}
|
||||
|
||||
function lancerProcedurePaiement() {
|
||||
alert("Lancement de la procédure de paiement...");
|
||||
// Logic to launch payment process goes here
|
||||
alert("Procédure de paiement lancée."); // Example action
|
||||
}
|
||||
|
||||
function modifierHeures() {
|
||||
alert("Modification des heures...");
|
||||
// Logic to modify hours goes here
|
||||
function toggleMenu() {
|
||||
var menu = document.getElementById('menu');
|
||||
var nom = document.getElementById('user-section');
|
||||
if (menu.classList.contains('w3-hide-small')) {
|
||||
menu.classList.remove('w3-hide-small');
|
||||
menu.classList.remove('user-section');
|
||||
} else {
|
||||
menu.classList.add('w3-hide-small');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
@ -21,6 +21,7 @@
|
||||
<a href="./vacataire.html">Accueil</a>
|
||||
<a href="./mes-heures.html">Heures</a>
|
||||
<a href="./paiements.html">Paiements</a>
|
||||
<a href="./mon-contrat.html">Contrat</a>
|
||||
<a href="./mes-informations.html">Mes informations et documents</a>
|
||||
</div>
|
||||
|
||||
|
||||
@ -284,6 +284,7 @@
|
||||
<a href="./vacataire.html">Accueil</a>
|
||||
<a href="./mes-heures.html">Heures</a>
|
||||
<a href="./paiements.html">Paiements</a>
|
||||
<a href="./mon-contrat.html">Contrat</a>
|
||||
<a href="./mes-informations.html">Mes informations et documents</a>
|
||||
</div>
|
||||
|
||||
|
||||
67
MaquetteWEB/html/VACATAIRE/mon-contrat.html
Normal file
67
MaquetteWEB/html/VACATAIRE/mon-contrat.html
Normal file
@ -0,0 +1,67 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Mon Contrat - Enseignant Vacataire</title>
|
||||
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
||||
<link rel="stylesheet" href="../../css/VACATAIRE/vacataire.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="header">
|
||||
<!-- Logo pour retourner à l'accueil -->
|
||||
<div class="logo-container">
|
||||
<img src="../../media/img/logoWhite.png" alt="Logo Accueil">
|
||||
</div>
|
||||
|
||||
<!-- Catégories dans le header -->
|
||||
<div class="categories">
|
||||
<a href="./vacataire.html">Accueil</a>
|
||||
<a href="./mes-heures.html">Heures</a>
|
||||
<a href="./paiements.html">Paiements</a>
|
||||
<a href="./mon-contrat.html">Contrat</a>
|
||||
<a href="./mes-informations.html">Mes informations et documents</a>
|
||||
</div>
|
||||
|
||||
<!-- Section utilisateur avec déconnexion -->
|
||||
<div class="user-section">
|
||||
<div class="user-name">
|
||||
Maxime MENAULT
|
||||
</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="dashboard-container">
|
||||
<!-- Détails du contrat -->
|
||||
<div class="section-header">
|
||||
<h2>Détails du Contrat</h2>
|
||||
</div>
|
||||
<div class="card">
|
||||
<p><strong>Numéro de contrat :</strong> LBF83-2024-00123</p>
|
||||
<p><strong>Date de début :</strong> 1er Octobre 2024</p>
|
||||
<p><strong>Type de contrat :</strong> Vacation</p>
|
||||
<p class="w3-text-green"><strong>Statut :</strong> Actif</p>
|
||||
<p><strong>Département :</strong> Informatique</p>
|
||||
<p><strong>Salaire horaire :</strong> 43,50 €</p>
|
||||
|
||||
<div class="action-buttons">
|
||||
<a href="../../media/docs/contrat.pdf" class="btn" target="_blank">Télécharger le contrat (PDF)</a>
|
||||
<a href="mailto:rh@example.com?subject=Demande de modification de contrat" class="btn">Contacter les RH pour modification</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<p>© 2024 IUT de Fontainebleau. Tous droits réservés |
|
||||
<a href="html/mentions_legales.html">Mentions légales</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -21,6 +21,7 @@
|
||||
<a href="./vacataire.html">Accueil</a>
|
||||
<a href="./mes-heures.html">Heures</a>
|
||||
<a href="./paiements.html">Paiements</a>
|
||||
<a href="./mon-contrat.html">Contrat</a>
|
||||
<a href="./mes-informations.html">Mes informations et documents</a>
|
||||
</div>
|
||||
|
||||
|
||||
@ -20,6 +20,7 @@
|
||||
<a href="./vacataire.html">Accueil</a>
|
||||
<a href="./mes-heures.html">Heures</a>
|
||||
<a href="./paiements.html">Paiements</a>
|
||||
<a href="./contrat.html">Contrat</a>
|
||||
<a href="./mes-informations.html">Mes informations et documents</a>
|
||||
</div>
|
||||
|
||||
@ -65,125 +66,6 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- Emploi du Temps avec navigation de semaines -->
|
||||
<div class="section-header">
|
||||
<h2>Mon Emploi du Temps</h2>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<!-- Navigation entre semaines -->
|
||||
<div class="week-navigation">
|
||||
<button>« Semaine précédente</button>
|
||||
<p><strong>Semaine du 18 au 24 Novembre 2024</strong></p>
|
||||
<button>Semaine suivante »</button>
|
||||
</div>
|
||||
|
||||
<div class="schedule-container">
|
||||
<table class="schedule-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Heures</th>
|
||||
<th>Lundi</th>
|
||||
<th>Mardi</th>
|
||||
<th>Mercredi</th>
|
||||
<th>Jeudi</th>
|
||||
<th>Vendredi</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="time-slot">08:00 - 08:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">08:30 - 09:00</td>
|
||||
<td class="class">TP - SCR<br><span>Salle 224 - BUT1 Groupe 3</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">09:00 - 09:30</td>
|
||||
<td class="class">TP - Mathématiques<br><span>Salle 101 - BUT2 Groupe 1</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TD - SCR<br><span>Salle 305 - BUT1 Groupe 2</span></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">09:30 - 10:00</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 202 - BUT1 Groupe 2</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 202 - BUT1 Groupe 2</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">10:00 - 10:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 202 - BUT1 Groupe 2</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - SCR<br><span>Salle 305 - BUT1 Groupe 2</span></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">10:30 - 11:00</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 202 - BUT1 Groupe 4</span></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">11:00 - 11:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">13:00 - 13:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 225 - BUT1 Groupe 1</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">13:30 - 14:00</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 225 - BUT1 Groupe 2</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">14:00 - 14:30</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 225 - BUT1 Groupe 3</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="time-slot">14:30 - 15:00</td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="no-class"></td>
|
||||
<td class="class">TP - DEV<br><span>Salle 225 - BUT1 Groupe 4</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Suivi des Paiements -->
|
||||
<div class="section-header">
|
||||
<h2>Suivi des Paiements</h2>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user