56 lines
No EOL
2.3 KiB
JavaScript
56 lines
No EOL
2.3 KiB
JavaScript
// Header rendering strategy interface and implementations
|
|
import { DateCalculator } from '../utils/DateCalculator';
|
|
/**
|
|
* Date-based header renderer (original functionality)
|
|
*/
|
|
export class DateHeaderRenderer {
|
|
render(calendarHeader, context) {
|
|
const { currentWeek, config } = context;
|
|
// FIRST: Always create all-day container as part of standard header structure
|
|
const allDayContainer = document.createElement('swp-allday-container');
|
|
calendarHeader.appendChild(allDayContainer);
|
|
// Initialize date calculator with config
|
|
DateCalculator.initialize(config);
|
|
this.dateCalculator = new DateCalculator();
|
|
const dates = DateCalculator.getWorkWeekDates(currentWeek);
|
|
const weekDays = config.getDateViewSettings().weekDays;
|
|
const daysToShow = dates.slice(0, weekDays);
|
|
daysToShow.forEach((date, index) => {
|
|
const header = document.createElement('swp-day-header');
|
|
if (DateCalculator.isToday(date)) {
|
|
header.dataset.today = 'true';
|
|
}
|
|
const dayName = DateCalculator.getDayName(date, 'short');
|
|
header.innerHTML = `
|
|
<swp-day-name>${dayName}</swp-day-name>
|
|
<swp-day-date>${date.getDate()}</swp-day-date>
|
|
`;
|
|
header.dataset.date = DateCalculator.formatISODate(date);
|
|
calendarHeader.appendChild(header);
|
|
});
|
|
}
|
|
}
|
|
/**
|
|
* Resource-based header renderer
|
|
*/
|
|
export class ResourceHeaderRenderer {
|
|
render(calendarHeader, context) {
|
|
const { resourceData } = context;
|
|
if (!resourceData) {
|
|
return;
|
|
}
|
|
resourceData.resources.forEach((resource) => {
|
|
const header = document.createElement('swp-resource-header');
|
|
header.setAttribute('data-resource', resource.name);
|
|
header.setAttribute('data-employee-id', resource.employeeId);
|
|
header.innerHTML = `
|
|
<swp-resource-avatar>
|
|
<img src="${resource.avatarUrl}" alt="${resource.displayName}" onerror="this.style.display='none'">
|
|
</swp-resource-avatar>
|
|
<swp-resource-name>${resource.displayName}</swp-resource-name>
|
|
`;
|
|
calendarHeader.appendChild(header);
|
|
});
|
|
}
|
|
}
|
|
//# sourceMappingURL=HeaderRenderer.js.map
|