Как разрешить выбор только первого дня фонового события в fullcalendar? - PullRequest
Новая
       13

Как разрешить выбор только первого дня фонового события в fullcalendar?

2 голосов
/ 21 января 2020

Я пытаюсь построить календарь для квартиры с Fullcalendar, показывающий занятые даты через фоновое событие, чтобы весь день в месяце был цветным. Вопрос с первого дня занятого периода. Поскольку регистрация - 15:00, пользователь должен иметь возможность выбрать его, так как проверка будет в 10:00. Поскольку я отмечаю selectOverlap: false, чтобы клиент не выбирал другие забронированные периоды, я не знаю, как разрешить выбор только первого дня фонового события. Есть идеи?

Вот мой код 

$(function() {

$('#calendar').fullCalendar({
  themeSystem: 'jquery-ui',
  plugins: ['interaction', 'dayGrid', 'timeGrid' ],
  locale: 'it',
  selectable: true,
  selectOverlap: false,
  eventStartEditable: true,
  longPressDelay: 10,
  aspectRatio: 1,

  header: {
    left: 'prev',
    center: 'title',
    right: 'next'
  },
  defaultDate: '2020-04-01', //new Date().toISOString().slice(0,10),
      events: [
        {"start":"2020-01-01","end":"2020-03-31","rendering":"background", "title": "CLOSED", "className": "event-full"},
        {"start":"2020-05-31","end":"2020-06-07","rendering":"background", "title": "FULL",   "className": "event-full"},
        {"start":"2020-06-27","end":"2020-07-11","rendering":"background", "title": "FULL",   "className": "event-full"},
        {"start":"2020-07-13","end":"2020-07-21","rendering":"background", "title": "FULL",   "className": "event-full"},
        {"start":"2020-07-25","end":"2020-08-08","rendering":"background", "title": "FULL",   "className": "event-full"},
        {"start":"2020-08-09","end":"2020-08-28","rendering":"background", "title": "FULL",   "className": "event-full"},
        {"start":"2020-11-01","end":"2021-03-31","rendering":"background", "title": "CLOSED", "className": "event-full"}
        ],

select: function(startDate, endDate) {

    if (endDate.diff(startDate, 'days') < 4) {
        alert('Minimum night is 4');
    } else {
        document.getElementById('checkIn').value = startDate.format();
        document.getElementById('checkOut').value = endDate.add(-1,'day').format();
    }
},

eventRender: function (event, element) {
            if (event.rendering == 'background') {
                element.append(event.title);
            }
} //eventRender
});
});
...