1
0
mirror of https://github.com/tabler/tabler.git synced 2025-12-22 01:44:25 +04:00
Files
tabler/shared/includes/ui/fullcalendar.html

87 lines
2.5 KiB
HTML

{% removeemptylines %}
{% assign id = include.id | default: 'default' -%}
<div id="calendar-{{ id }}"></div>
{% capture script %}
<script>
document.addEventListener('DOMContentLoaded', function () {
var calendarEl = document.getElementById('calendar-{{ id }}');
var currentYear = new Date().getFullYear();
var currentMonth = new Date().getMonth();
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth',
{% if include.sample-events %}
events: [
{
title: "Offsite Retreat",
start: new Date(currentYear, currentMonth, 2, 9, 0),
end: new Date(currentYear, currentMonth, 4, 17, 0),
color: 'var(--tblr-red)',
backgroundColor: 'var(--tblr-red-lt)',
borderColor: 'var(--tblr-red-200)',
},
{
title: "Monthly Planning",
start: new Date(currentYear, currentMonth, 1, 10, 0),
end: new Date(currentYear, currentMonth, 1, 11, 30),
},
{
title: "Marketing Strategy Call",
start: new Date(currentYear, currentMonth, 4, 14, 0),
end: new Date(currentYear, currentMonth, 4, 15, 0)
},
{
title: "Design Sprint",
start: new Date(currentYear, currentMonth, 7, 9, 0),
end: new Date(currentYear, currentMonth, 7, 12, 0)
},
{
title: "Dev Team Check-in",
start: new Date(currentYear, currentMonth, 10, 11, 0),
end: new Date(currentYear, currentMonth, 10, 11, 30)
},
{
title: "Customer Feedback Review",
start: new Date(currentYear, currentMonth, 13, 13, 0),
end: new Date(currentYear, currentMonth, 13, 14, 0)
},
{
title: "Mid-Month Review",
start: new Date(currentYear, currentMonth, 15, 10, 30),
end: new Date(currentYear, currentMonth, 15, 11, 30)
},
{
title: "Webinar: Product Update",
start: new Date(currentYear, currentMonth, 18, 16, 0),
end: new Date(currentYear, currentMonth, 18, 17, 0)
},
{
title: "Sales Training",
start: new Date(currentYear, currentMonth, 21, 9, 30),
end: new Date(currentYear, currentMonth, 21, 11, 0)
},
{
title: "Company All-Hands",
start: new Date(currentYear, currentMonth, 25, 15, 0),
end: new Date(currentYear, currentMonth, 25, 16, 0)
},
{
title: "End-of-Month Wrap-up",
start: new Date(currentYear, currentMonth, 31, 10, 0),
end: new Date(currentYear, currentMonth, 31, 11, 0)
}
],
{% endif %}
});
calendar.render();
});
</script>
{% endcapture %}
{% capture_script %}
{{ script }}
{% endcapture_script %}
{% endremoveemptylines %}