fullcalendar - 我可以防止有冲突时间的事件吗？

Question

如何防止发生冲突时间的事件？有没有要设置的变量？

Answer 1

不，没有要设置的变量，但您可以使用诸如clientEvents 之类的东西来检索 fullcalendar 在内存中的事件。您可以在eventDrop中使用下面的函数。在下面的例子中，它使用一个函数来过滤事件是否有重叠。

function checkOverlap(event) {  

    var start = new Date(event.start);
    var end = new Date(event.end);

    var overlap = $('#calendar').fullCalendar('clientEvents', function(ev) {
        if( ev == event)
            return false;
        var estart = new Date(ev.start);
        var eend = new Date(ev.end);

        return (Math.round(estart)/1000 < Math.round(end)/1000 && Math.round(eend) > Math.round(start));
    });

    if (overlap.length){  
            //either move this event to available timeslot or remove it
       }                  
  }

Answer 2

您可以在 celendar 配置中添加 eventOverlap : false， http ://fullcalendar.io/docs/event_ui/eventOverlap/

Answer 3

正确的重叠检查。

        eventDrop: function(event, dayDelta, minuteDelta, allDay, revertFunc, jsEvent, ui, view) {
            /// deny overlap of event
            var start = new Date(event.start);
            var end = new Date(event.end);

            var overlap = $('#calendar').fullCalendar('clientEvents', function(ev) {
                if( ev == event) {
                    return false;
                }
                var estart = new Date(ev.start);
                var eend = new Date(ev.end);

                return (
                    ( Math.round(start) > Math.round(estart) && Math.round(start) < Math.round(eend) )
                    ||
                    ( Math.round(end) > Math.round(estart) && Math.round(end) < Math.round(eend) )
                    ||
                    ( Math.round(start) < Math.round(estart) && Math.round(end) > Math.round(eend) )
                );
            });
            if (overlap.length){
                revertFunc();
                return false;
            }
        }

Answer 4

在事件对象中添加自定义属性，overlap:false 例如您的事件对象将是

                 `{
                    title:'Event',
                    start: '2017-01-04T16:30:00',
                    end: '2017-01-04T16:40:00',
                    overlap:false
                  }`

现在覆盖 selectOverlap 函数，

selectOverlap: function(event) {
    if(event.ranges && event.ranges.length >0) {
      return (event.ranges.filter(function(range){
          return (event.start.isBefore(range.end) &&
                  event.end.isAfter(range.start));
      }).length)>0;
    }
    else {
      return !!event && event.overlap;
    }
  },

它不会让另一个事件覆盖已经放置的事件。

Answer 5

这可以解决问题。它还处理调整重叠事件的大小

var calendar = new Calendar(calendarEl, {
      selectOverlap: false,
      eventOverlap: false
  }
});