Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
File Manager
/
Design
/
Dev tableau
:
tmp0016.php
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
<?php /* function getWorkingDays($startDate, $endDate, $holidays = []) { $start = strtotime($startDate); $end = strtotime($endDate); $workingDays = []; // Définir le locale en français setlocale(LC_TIME, 'fr_FR.UTF-8'); // Générer toutes les dates entre startDate et endDate for ($currentDate = $start; $currentDate <= $end; $currentDate = strtotime("+1 day", $currentDate)) { $dayOfWeek = date("N", $currentDate); // Numéro du jour de la semaine (1 = lundi, 7 = dimanche) // Vérifier si ce jour est un week-end ou un jour férié if ($dayOfWeek < 6 && !in_array(date("Y-m-d", $currentDate), $holidays)) { $day = date("d", $currentDate); // Numéro du jour du mois $dayOfWeekName = strftime("%A", $currentDate); // Nom complet du jour en français $dayOfWeekInitial = strtoupper($dayOfWeekName[0]); // Initial du jour en français (première lettre) $weekNumber = date("W", $currentDate); // Numéro de la semaine // Ajouter un tableau avec ces trois informations dans $workingDays $workingDays[] = [ 'day' => $day, 'day_of_week_initial' => $dayOfWeekInitial, 'week_number' => $weekNumber ]; } } return $workingDays; } */ function getWorkingDays($startDate, $endDate, $holidays = []) { $start = strtotime($startDate); $end = strtotime($endDate); $workingDays = []; setlocale(LC_TIME, 'fr_FR.UTF-8'); for ($currentDate = $start; $currentDate <= $end; $currentDate = strtotime("+1 day", $currentDate)) { $dayOfWeek = date("N", $currentDate); if ($dayOfWeek < 6 && !in_array(date("Y-m-d", $currentDate), $holidays)) { $workingDays[] = [ 'day' => date("d", $currentDate), 'day_of_week_initial' => strtoupper(strftime("%A", $currentDate)[0]), 'week_number' => date("W", $currentDate), 'full_date' => date("Y-m-d", $currentDate) // Ajout de la date complète ]; } } return $workingDays; } // Liste des jours fériés et fêtes religieuses à exclure (exemple pour la France, à compléter avec d'autres fêtes) $holidays = [ "2025-01-01", // Jour de l'An "2025-04-14", // Lundi de Pâques "2025-05-01", // Fête du Travail "2025-05-08", // Victoire 1945 "2025-07-14", // Bastille "2025-08-15", // Assomption "2025-11-01", // Toussaint "2025-12-25", // Noël "2026-01-01", // Jour de l'An "2026-04-06", // Lundi de Pâques // Ajouter d'autres jours fériés ici... ]; // Définir la période de début et de fin $startDate = "2025-01-10"; $endDate = "2026-02-14"; // Appeler la fonction pour obtenir les jours ouvrés entre les deux dates $workingDays = getWorkingDays($startDate, $endDate, $holidays); ?> <!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Tableau Sticky - 3 Lignes Fixes</title> <style> .table-wrapper { width: 100%; max-height: 400px; overflow: auto; border: 1px solid #ccc; position: relative; } table { border-collapse: collapse; width: max-content; table-layout: fixed; } th, td { padding: 10px; text-align: center; height: 40px; border: 1px solid #ccc; white-space: nowrap; min-width: 120px; position: relative; background-color: white; box-sizing: border-box; } /* ✅ Fixation des cellules d'en-tête */ th { background-color: #f2f2f2; position: sticky; top: 0; z-index: 100; /* Hauteur élevée pour éviter les chevauchements */ } /* ✅ Colonnes sticky */ th:first-child, td:first-child { position: sticky; left: 0; z-index: 101; /* Priorité plus haute */ background-color: white; } th:nth-child(2), td:nth-child(2) { position: sticky; left: 120px; z-index: 100; background-color: white; } th:nth-child(3), td:nth-child(3) { position: sticky; left: 240px; z-index: 99; background-color: white; } /* ✅ Bordures droites persistantes */ th:first-child::after, td:first-child::after, th:nth-child(2)::after, td:nth-child(2)::after, th:nth-child(3)::after, td:nth-child(3)::after { content: ""; position: absolute; right: 0; top: 0; width: 2px; height: 100%; background-color: #ccc; z-index: 102; } /* ✅ Alternance des couleurs */ tbody tr:nth-child(odd) { background-color: #f9f9f9; } /* ✅ Largeur fixe des autres colonnes */ th:nth-child(n+4), td:nth-child(n+4) { /*min-width: 150px;*/ min-width: 40px; max-width: 40px; width: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* ✅ Deuxième ligne d'en-tête sticky */ .second-header th { background-color: #f2f2f2; position: sticky; top: 40px; z-index: 99; } /* ✅ Troisième ligne d'en-tête sticky */ .third-header th { background-color: #f2f2f2; position: sticky; top: 80px; z-index: 98; } /* ✅ Correction du positionnement des 3 premières colonnes de la deuxième et troisième ligne */ .second-header th:first-child, .third-header th:first-child { left: 0; z-index: 101; background-color: white; } .second-header th:nth-child(2), .third-header th:nth-child(2) { left: 120px; z-index: 100; background-color: white; } .second-header th:nth-child(3), .third-header th:nth-child(3) { left: 240px; z-index: 99; background-color: white; } /* ✅ Réajustement des z-index pour garantir l'ordre correct */ thead tr:first-child th:first-child, thead tr:first-child th:nth-child(2), thead tr:first-child th:nth-child(3) { z-index: 105; background-color: #ddd; } .second-header th:first-child, .second-header th:nth-child(2), .second-header th:nth-child(3) { z-index: 104; } .third-header th:first-child, .third-header th:nth-child(2), .third-header th:nth-child(3) { z-index: 103; } /* ✅ Bordures inférieures fixes sans chevauchement */ thead tr:first-child th, .second-header th, .third-header th { box-shadow: inset 0 -2px #aaa; background-clip: padding-box; padding-bottom: 2px; /* Réduction du chevauchement */ margin-bottom: -2px; /* Évite que les bordures ne recouvrent les autres cellules */ z-index: 100; /* Priorité élevée */ } /* Ajout d'un petit espace entre les lignes sticky pour éviter le chevauchement */ .second-header th { top: calc(40px + 2px); /* Décale légèrement les lignes sticky vers le bas */ margin-top: 2px; /* Donne un petit espace entre les lignes */ } .third-header th { top: calc(80px + 2px); /* Décale la troisième ligne un peu plus bas */ margin-top: 2px; /* Donne un petit espace entre les lignes */ } /* ✅ Couleurs de fond pour les semaines paires et impaires */ .even-week { background-color: #ffcc99 !important; /* Orange */ } .odd-week { background-color: #e6b3ff !important; /* Violet */ } /* ✅ Quatrième ligne d'en-tête sticky */ .fourth-header th { background-color: #f2f2f2; position: sticky; top: 120px; z-index: 97; } /* ✅ Correction du positionnement des 3 premières colonnes de la quatrième ligne */ .fourth-header th:first-child { left: 0; z-index: 101; background-color: white; } .fourth-header th:nth-child(2) { left: 120px; z-index: 100; background-color: white; } .fourth-header th:nth-child(3) { left: 240px; z-index: 99; background-color: white; } /* ✅ Ajustement des z-index pour garantir un affichage correct */ .fourth-header th:first-child, .fourth-header th:nth-child(2), .fourth-header th:nth-child(3) { z-index: 102; } /* ✅ Ajout d'un espace entre les lignes sticky pour éviter le chevauchement */ .fourth-header th { top: calc(120px + 2px); /* Décalage pour éviter le chevauchement */ margin-top: 2px; } /* ✅ Bordure inférieure pour séparer visuellement la ligne */ .fourth-header th { box-shadow: inset 0 -2px #aaa; background-clip: padding-box; padding-bottom: 2px; margin-bottom: -2px; z-index: 97; } .even-week { background-color: #ffcc99 !important; /* Orange */ } .odd-week { background-color: #e6b3ff !important; /* Violet */ } .month-even { background-color: #99ccff !important; /* Bleu clair */ } .month-odd { background-color: #ff9999 !important; /* Rouge clair */ } </style> </head> <body> <div class="table-wrapper"> <table> <thead> <tr> <th></th> <th>plouf</th> <th>cretin</th> <?php foreach ($workingDays as $dateData): ?> <th> <?php echo $dateData['day']; ?> <br> </th> <?php endforeach; ?> </tr> <tr class="second-header"> <th></th> <th>Valeur 1</th> <th>Valeur 2</th> <?php $currentWeek = null; $weekClass = ""; foreach ($workingDays as $dateData): if ($currentWeek !== $dateData['week_number']) { $currentWeek = $dateData['week_number']; // Alterne les couleurs selon que le numéro de semaine est pair ou impair $weekClass = ($currentWeek % 2 === 0) ? 'even-week' : 'odd-week'; } ?> <th class="<?= $weekClass; ?>"><?php echo $dateData['day_of_week_initial']; ?></th> <?php endforeach; ?> </tr> <!-- ✅ Troisième ligne d'en-tête sticky avec fusion des cellules et couleurs de fond --> <tr class="third-header"> <th></th> <th>Info 1</th> <th>Info 2</th> <?php $currentWeek = null; $colspan = 0; foreach ($workingDays as $index => $dateData): if ($currentWeek !== $dateData['week_number']) { if ($currentWeek !== null) { $weekClass = $currentWeek % 2 === 0 ? 'even-week' : 'odd-week'; echo '<th class="' . $weekClass . '" colspan="' . $colspan . '">' . $currentWeek . '</th>'; } $currentWeek = $dateData['week_number']; $colspan = 1; } else { $colspan++; } endforeach; if ($currentWeek !== null) { $weekClass = $currentWeek % 2 === 0 ? 'even-week' : 'odd-week'; echo '<th class="' . $weekClass . '" colspan="' . $colspan . '">' . $currentWeek . '</th>'; } ?> </tr> <!-- ✅ Quatrième ligne d'en-tête sticky --> <tr class="fourth-header"> <th></th> <th>Label 1</th> <th>Label 2</th> <?php $currentMonthYear = null; $colspan = 0; $monthClass = ""; $colorIndex = 0; $colors = ['month-even', 'month-odd']; // Classes CSS pour alterner les couleurs foreach ($workingDays as $index => $dateData): $monthYear = ucfirst(strftime("%B %Y", strtotime($dateData['full_date']))); if ($currentMonthYear !== $monthYear) { if ($currentMonthYear !== null) { // Appliquer la couleur de fond en alternance echo '<th class="' . $monthClass . '" colspan="' . $colspan . '">' . $currentMonthYear . '</th>'; } // Mise à jour des variables pour le nouveau mois $currentMonthYear = $monthYear; $colspan = 1; $monthClass = $colors[$colorIndex % 2]; // Alterne les couleurs $colorIndex++; } else { $colspan++; } endforeach; // Affichage de la dernière cellule fusionnée if ($currentMonthYear !== null) { echo '<th class="' . $monthClass . '" colspan="' . $colspan . '">' . $currentMonthYear . '</th>'; } ?> </tr> </thead> <tbody> <?php for ($i = 1; $i <= 50; $i++): ?> <tr> <td>Row <?php echo $i; ?></td> <td>Data <?php echo $i . "-2"; ?></td> <td>cretin <?php echo $i; ?></td> <?php foreach ($workingDays as $dateData): ?> <!-- <td>Data <?php echo $i . "-" . $dateData['week_number']; ?></td> --> <td>1</td> <?php endforeach; ?> </tr> <?php endfor; ?> </tbody> </table> </div> </body> </html>