如何根据日历模式创建活动? [英] How can I create an event based on pattern for calendar?
本文介绍了如何根据日历模式创建活动?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试为某人创建一个转移日历,我知道模式开始的那一天,我知道开启和关闭日期的模式。但我遇到麻烦将其转化为代码。
I am trying to create a "shift" calendar for someone and I know what day the pattern starts on and I know the pattern for days on and off. But am having troubles translating it into code.
他们工作4天,下班3天,工作4,下班3天,工作4天,休息2天,重复。我需要创建一些逻辑来基于此创建日历事件。
They work 4 days, off of work 3 days, work 4, off of work 3 days, work for 4, off 2 days, repeat. I need to create some logic to create an event for a calendar based on this.
这就是我所拥有的:
$(document).ready(function() {
var on = [4, 4, 4];
var off = [3, 3, 2];
var startPattern = "2017-03-04";
var days = $('#calendar').fullCalendar('getDate').daysInMonth();
var events = [];
for (var i = $('#calendar').fullCalendar('getDate').day(); i < days; i++) {
var event = {
title: "work",
start: ''
}
events.push(event);
}
$('#calendar').fullCalendar({
// put your options and callbacks here
events: events
});
});
推荐答案
Plunker: https://plnkr.co/edit/xIfaWB?p=preview
$(document).ready(function() {
// define the schedule;
// duration is days;
// title is what is shown on the calendar
// color is how to color event
var schedule = [{
duration: 4,
title: 'work',
color: 'red'
}, {
duration: 3,
title: 'off',
color: 'blue'
}, {
duration: 4,
title: 'work',
color: 'red'
}, {
duration: 3,
title: 'off',
color: 'blue'
}, {
duration: 4,
title: 'work',
color: 'red'
}, {
duration: 2,
title: 'off',
color: 'blue'
}, ];
// define the range of events to generate
var startDay = moment("2017-03-04");
var endDay = moment("2017-05-04");
// generate the events
var events = [];
// we loop from the start until we have passed the end day
// the way the code is defined, it will always complete a schedule segment
for (var s = 0, day = startDay; day.isBefore(endDay);) {
// loop for each day of a schedule segment
for (var i = 0; i < schedule[s].duration; i++) {
// add the event with the current properties
events.push({
title: schedule[s].title,
color: schedule[s].color,
// we have to clone because the add() call below mutates the date
start: day.clone(),
allday: true
});
// go to the next day
day = day.add(1, 'day');
}
// go to the next schedule segment
s = (s + 1) % schedule.length;
}
// render the calendar
$('#calendar').fullCalendar({
events: events
});
});
这篇关于如何根据日历模式创建活动?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文