Use Resource TimeGrid view; we can use it for free since we are a non-profit
This commit is contained in:
parent
134fdd5d08
commit
fc487ee0b8
@ -25,7 +25,7 @@
|
||||
"dependencies": {
|
||||
"@fullcalendar/core": "^5.10.0",
|
||||
"@fullcalendar/icalendar": "^5.10.1",
|
||||
"@fullcalendar/timegrid": "^5.6.0",
|
||||
"@fullcalendar/resource-timegrid": "^5.10.1",
|
||||
"core-js": "^3.19.1",
|
||||
"ical.js": "github:ekreative/ical.js#var-ical",
|
||||
"intl": "^1.2.5",
|
||||
|
29
src/index.ts
29
src/index.ts
@ -8,9 +8,8 @@ if (!window.Intl) {
|
||||
}
|
||||
|
||||
import { EventInput, Calendar, CalendarOptions } from '@fullcalendar/core';
|
||||
import dayGridPlugin from '@fullcalendar/daygrid';
|
||||
import timeGridPlugin from '@fullcalendar/timegrid';
|
||||
import iCalendarPlugin from '@fullcalendar/icalendar';
|
||||
import resourceTimeGridPlugin from '@fullcalendar/resource-timegrid';
|
||||
|
||||
import { unique_colors } from 'unique-colors';
|
||||
|
||||
@ -27,28 +26,30 @@ const calendars: { [key: string]: string } = {
|
||||
const colors: string[] = unique_colors(Object.keys(calendars).length);
|
||||
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const toolFilter: string | null = urlParams.get('tool');
|
||||
const toolFilter: string[] | undefined = urlParams.get('tool')?.split(';');
|
||||
|
||||
function eventDataTransform(eventData: EventInput): EventInput | false {
|
||||
function eventDataTransform(eventData: EventInput): EventInput {
|
||||
// clear the url to prevent clicking on the event
|
||||
delete eventData.url;
|
||||
|
||||
const match = eventData?.title?.match(/([^\/]*) \| ([^-]*) - (.*)/);
|
||||
if (match) {
|
||||
const [, member, shop, tool] = match;
|
||||
eventData.title = `${tool} - ${member}`;
|
||||
if (toolFilter === null || tool.includes(toolFilter)) {
|
||||
return eventData;
|
||||
eventData.title = `${member}`;
|
||||
eventData.resourceId = tool;
|
||||
if (!toolFilter) {
|
||||
calendar.addResource({ id: tool, title: tool }, false);
|
||||
}
|
||||
}
|
||||
return false;
|
||||
return eventData;
|
||||
}
|
||||
|
||||
const calendarOptions: CalendarOptions = {
|
||||
plugins: [timeGridPlugin, dayGridPlugin, iCalendarPlugin],
|
||||
schedulerLicenseKey: 'CC-Attribution-NonCommercial-NoDerivatives',
|
||||
plugins: [iCalendarPlugin, resourceTimeGridPlugin],
|
||||
allDaySlot: false,
|
||||
nowIndicator: true,
|
||||
initialView: 'timeGridWeek',
|
||||
initialView: 'resourceTimeGrid',
|
||||
height: 'auto',
|
||||
slotMinTime: '8:00',
|
||||
slotMaxTime: '22:00',
|
||||
@ -75,6 +76,14 @@ const calendarOptions: CalendarOptions = {
|
||||
minute: '2-digit',
|
||||
hour12: false,
|
||||
},
|
||||
resources: toolFilter
|
||||
? toolFilter.map((tool) => {
|
||||
return {
|
||||
id: tool,
|
||||
title: tool,
|
||||
};
|
||||
})
|
||||
: [],
|
||||
};
|
||||
|
||||
const calendarEl = document.getElementById('calendar');
|
||||
|
Loading…
Reference in New Issue
Block a user