Наложение в полнокадровом представлении сетки времени не работает. события добавляются в те же временные интервалы

Question

Я создаю события, но не могу генерировать ошибки при наложении. Я попробовал eventOverlap: false не сработало.

Это изображение показывает, как мои события перекрываются: selectOveralap: false, что делает весь календарь недоступным для выбора. Буду признателен за любую помощь.

Как ограничить выбор, если диапазон между двумя запланированными событиями не достаточно для нового события, я пробовал некоторые решения из переполнения стека, но не работал ни календарь:

$calendar = $('#appointments').fullCalendar({
            minTime: "8:00:00",
            maxTime: "18:00:00",
            allDaySlot: false,
            slotDuration: '00:30:00',
            snapDuration: '00:15:00',
            slotLabelInterval: '01:00:00',
            height: 'auto',
            timezone: 'local',
            aspectRatio: 0.5,
            header: {
                left: '',
                center: '',
                right: 'today prev,next'
            },
            columnFormat: { month: 'ddd, MMM', week: 'ddd, MMM DD', day: 'dddd, MMMM DD' },
            defaultView: 'agendaWeek',
            //editable: true,
            selectable: true,
            selectConstraint: 'avaliable_hours',
            eventConstraint: 'avaliable_hours',
            //eventOverlap: false,
            //slotEventOverlap: false,
            unselectAuto: true,
            // eventLimit: true,
            // navLinks: true,
            eventStartEditable: false,
            eventDurationEditable: false,
            defaultEventMinutes: currentMins,
            dayClick:function(date, allDay,jsEvent, view) {

              },
            select: function(start, end, allDay, jsEvent) {
                 //somecode
                  if (currentEvent) {
                    console.log(currentEvent);
                    console.log(currentEvent._id);
                    $('#appointments').fullCalendar( 'removeEvents', currentEvent._id);
                  }
                  currentEvent = $("#appointments").fullCalendar('renderEvent',
                  {
                      id: 'new_event',
                      start: start,
                      end: endTime,
                      allDay: false
                  },
                  true // make the event "stick"
                  )[0];
                  if (name!=null && start!=null){
                  $('#submit').attr('disabled',false);}

              }
            }
            else {
              $('#appointments').fullCalendar('unselect');
            }
          },

              events: [

              ],

              eventRender: function(event){
                  console.log(event);
                  var current_time = new Date('<%= @current_time %>');
                  if (event.id == 'avaliable_hours') {
                    // The avaliable_hours end time will rendered in local timezon but in UTC time, so manually add offset to the event.end
                    return (event.ranges.filter(function(range){
                      return (event.start.isBefore(range.end) &&
                        event.end.isAfter(range.start));
                    }).length)>0;
                  }
                  else if (event.id == 'selected') {
                      return !event.end.isBefore(current_time);
                  }
                  else if (event.id == 'new_event') {
                  }
              },


    });


function isAnOverlapEvent(events, eventToCheck) {
    // Properties
    const resourceID = eventToCheck.resourceId;
    // Moment.js objects
    const startMoment = eventToCheck.start;
    const endMoment = eventToCheck.end;

    try {
        if (moment.isMoment(startMoment) && moment.isMoment(endMoment)) {
            // Filter Events by a specific resource
            const eventsByResource = events.filter(event => event.resourceId === resourceID);
            for (let i = 0; i < eventsByResource.length; i++) {
                const eventA = eventsByResource[i];
                if (moment.isMoment(eventA.start) && moment.isMoment(eventA.end)) {
                    // start-time in between any of the events
                    if (moment(startMoment).isAfter(eventA.start) && moment(startMoment).isBefore(eventA.end)) {
                        console.log("start-time in between any of the events")
                        return true;
                    }
                    //end-time in between any of the events
                    if (moment(endMoment).isAfter(eventA.start) && moment(endMoment).isBefore(eventA.end)) {
                        console.log("end-time in between any of the events")
                        return true;
                    }
                    //any of the events in between/on the start-time and end-time
                    if (moment(startMoment).isSameOrBefore(eventA.start) && moment(endMoment).isSameOrAfter(eventA.end)) {
                        console.log("any of the events in between/on the start-time and end-time")
                        return true;
                    }
                } else {
                    const error = 'Error, Any event on array of events is not valid. start or end are not Moment objects';
                    console.error(error);
                    throw new Error(error);
                }
            }
            return false;
        } else {
            const error = 'Error, start or end are not Moment objects';
            console.error(error);
            throw new Error(error);
        }
    } catch (error) {
        console.error(error);
        throw error;
    }
}