在我的情况下,我经常让用户不是单击并拖动来创建长事件(日视图),只需单击一个时间段(30分钟),然后单击下一个(30分钟)。
所以不是13:00 - 14:00的事件,而是13:00-13:30和第二个13:30-14:00。
为了防止这种情况,我想将两个事件合并为一个,以便它们显示为13:00 - 14:00。
如何正确地做到这一点?
答案 0 :(得分:8)
这就是我最终解决的问题:
// user choses event
select: function (start, end, jsEvent, view)
{
var diffmin = (new Date(end).getTime()/1000 - new Date(start).getTime()/1000)/60;
var title = diffmin+' min';
var eventData;
// some users click 1 slot, then the following, so we have 2 events each 30 min instead of 60 min
// merge both events into one
var eventmerge = false;
$.each(allevents, function( index, eventitem )
{
if(eventitem!==null && typeof eventitem != 'undefined')
{
// if start time of new event (2nd slot) is end time of existing event (1st slot)
if( moment(start).format('YYYY-MM-DD HH:mm') == moment(eventitem.end).format('YYYY-MM-DD HH:mm') )
{
eventmerge = true;
// existing event gets end data of new merging event
eventitem.end = end;
}
// if end time of new event (1st slot) is start time of existing event (2nd slot)
else if( moment(end).format('YYYY-MM-DD HH:mm') == moment(eventitem.start).format('YYYY-MM-DD HH:mm') )
{
eventmerge = true;
// existing event gets start data of new merging event
eventitem.start = start;
}
if(eventmerge)
{
// recalculate
var diffmin = (new Date(eventitem.end).getTime()/1000 - new Date(eventitem.start).getTime()/1000)/60;
eventitem.title = diffmin+' min';
// copy to eventData
eventData = eventitem;
// find event object in calendar
var eventsarr = $('#calendar').fullCalendar('clientEvents');
$.each(eventsarr, function(key, eventobj) {
if(eventobj._id == eventitem.id) {
console.log('merging events');
eventobj.start = eventitem.start;
eventobj.end = eventitem.end;
eventobj.title = eventitem.title;
$('#calendar').fullCalendar('updateEvent', eventobj);
}
});
// break each loop
return false;
}
}
});
if(!eventmerge)
{
// console.log('adding event id: '+eventcount);
eventData = {
id: eventcount, // identifier
title: title,
start: start,
end: end,
color: '#00AA00',
editable: true,
eventDurationEditable: true,
};
// register event in array
allevents[eventcount] = eventData;
eventcount++;
$('#calendar').fullCalendar('renderEvent', eventData, true);
}
// console.log(start, end);
setTimePrice(eventData);
$('#calendar').fullCalendar('unselect');
},
<强>结果:强>
示例结果: