LouisMazin/Boulangerie_Website
LouisMazin/Boulangerie_Website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

clean

Browse Source
This commit is contained in:
Louis Mazin 2026-09-15 20:54:19 +02:00
parent 1c2ed65db8
commit ba33de6564
2 changed files with 55 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/pages/WeeklySummaryPage.css
View File

@ -224,7 +224,6 @@
.multi-user-schedule .attendance-bar-group {
position: absolute;
left: 5px;
display: flex;
gap: 3px;
overflow: visible;

87
frontend/src/pages/WeeklySummaryPage.jsx
View File

@ -150,6 +150,28 @@ const WeeklySummaryPage = ({ userId }) => {
}).filter(Boolean);
};
const getAttendanceColumns = (dayAttendances) => {
const columns = new Map();
dayAttendances.forEach((attendance) => {
const start = getMinutes(getTimeValue(attendance, 'start_time'));
const end = getMinutes(getTimeValue(attendance, 'end_time'));
const username = attendance.username;
if (start === null || end === null || end <= start || !username) return;
const currentColumn = columns.get(username);
columns.set(username, {
username,
color: getUserColor(username),
start: currentColumn ? Math.min(currentColumn.start, start) : start,
end: currentColumn ? Math.max(currentColumn.end, end) : end,
});
});
return [...columns.values()];
};
const navigateWeek = (direction) => {
const newWeek = new Date(currentWeek);
newWeek.setDate(currentWeek.getDate() + (direction * 7));
@ -259,42 +281,43 @@ const WeeklySummaryPage = ({ userId }) => {
{weekDays.map((day) => (
<div className="schedule-day-column" key={formatDateKey(day)}>
{hours.map((hour) => <span className="schedule-hour-line" key={hour} />)}
{getAttendanceSegments(getAttendancesForDay(day)).map(({ start, end, users }) => {
{isAdmin ? getAttendanceColumns(getAttendancesForDay(day)).map(({ start, end, username, color }, columnIndex) => {
const startTime = formatSegmentTime(start);
const endTime = formatSegmentTime(end);
return (
<div
className="attendance-bar-group"
style={{
...getAttendanceStyle(start, end, startHour, endHour, hourHeight),
left: `${5 + (columnIndex * 9)}px`,
width: '6px',
}}
title={`${username} : ${startTime} - ${endTime}`}
aria-label={`${username} : ${startTime} - ${endTime}`}
key={`${formatDateKey(day)}-${username}`}
>
<span
className="attendance-user-bar"
style={{ backgroundColor: color }}
title={`${username} : ${startTime} - ${endTime}`}
aria-label={`${username} : ${startTime} - ${endTime}`}
/>
</div>
);
}) : getAttendanceSegments(getAttendancesForDay(day)).map(({ start, end, users }) => {
const startTime = formatSegmentTime(start);
const endTime = formatSegmentTime(end);
const segmentLabel = users.map(({ username }) => username).join(', ');
return (
isAdmin ? (
<div
className="attendance-bar-group"
style={{
...getAttendanceStyle(start, end, startHour, endHour, hourHeight),
width: `${(users.length * 6) + ((users.length - 1) * 3)}px`,
}}
title={`${startTime} - ${endTime}${segmentLabel ? ` : ${segmentLabel}` : ''}`}
aria-label={`${startTime} - ${endTime}${segmentLabel ? ` : ${segmentLabel}` : ''}`}
key={`${formatDateKey(day)}-${start}-${end}`}
>
{users.map(({ username, color }) => (
<span
className="attendance-user-bar"
style={{ backgroundColor: color }}
title={`${username} : ${startTime} - ${endTime}`}
aria-label={`${username} : ${startTime} - ${endTime}`}
key={username}
/>
))}
</div>
) : (
<div
className="attendance-block"
style={getAttendanceStyle(start, end, startHour, endHour, hourHeight)}
key={`${formatDateKey(day)}-${start}-${end}`}
>
<strong>{startTime} - {endTime}</strong>
<span />
</div>
)
<div
className="attendance-block"
style={getAttendanceStyle(start, end, startHour, endHour, hourHeight)}
title={segmentLabel}
key={`${formatDateKey(day)}-${start}-${end}`}
>
<strong>{startTime} - {endTime}</strong>
<span>{segmentLabel}</span>
</div>
);
})}
</div>