Сбой полного календаря при переключении просмотров - PullRequest
Новая
       9

Сбой полного календаря при переключении просмотров

0 голосов
/ 16 января 2019

Я использую Fullcalendar.js в моем приложении rails (через гем fullcalendar https://github.com/mkhairi/fullcalendar).

Версия fullcalendar.js, которую я имею, 3.8.2 (я нахожу это в инспекторе в chrome, набрав Fullcalendar в консоли, и я получаю это)

Fullcalendar {версия: "3.8.2", internalApiVersion: 12, applyAll: ƒ, debounce: ƒ, isInt: ƒ,…}

Когда я выполняю следующие шаги, Fullcalendar аварийно завершает работу и не отображает представление:

1 - начальный вид - недельный (повестки дня)

2 - изменение вида дня, например, выбор дня на следующей неделе (d = сегодня + 1 неделя) 

$('#calendar').fullCalendar('gotoDate',d);

3 - изменение представления на дневное (повестки дня) 

$('#calendar').fullCalendar('changeView','agendaDay');

4 - изменение вида на недельный вид 

$('#calendar').fullCalendar('changeView','agendaWeek');

Выдает следующую ошибку и не загружает просмотр недели: 

fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
 body=1:11974 Uncaught TypeError: Cannot read property 'minTime' of 
null
at ResourceTimeGrid.TimeGrid.computeTimeTop (fullcalendar.self- 

4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:11974)
at ResourceTimeGrid.TimeGrid.computeDateTop (fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:11968)
at ResourceTimeGrid.TimeGrid.computeSegVerticals (fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:12007)
at ResourceTimeGrid.TimeGrid.updateSegVerticals (fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:11995)
at TimeGridFillRenderer.attachSegEls (fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:14104)
at TimeGridFillRenderer.FillRenderer.renderSegs (fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:6435)
at TimeGridEventRenderer.EventRenderer.renderBgSegs 
(fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:4321)
at TimeGridEventRenderer.EventRenderer.renderBgRanges 
(fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:4297)
at TimeGridEventRenderer.EventRenderer.render (fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:4273)
at ResourceTimeGrid.DateComponent.executeEventRender 
(fullcalendar.self- 
4ac7cb5378baf9f7c517f032032aaab305cd3b2213aacbab690c4efdc0047f46.js? 
body=1:8848)

Вот фрагмент кода, который я использую: 

$('#calendar').each(function(){
var calendar = $(this);
calendar.fullCalendar({
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
  },
  selectable: true,
  selectHelper: true,
  editable: true,
  eventLimit: true,
  defaultView: 'agendaWeek',
  locale: 'fr',
  slotDuration: '00:15:00',
  nowIndicator:true,
  defaultDate:"2019-01-14",
  displayEventTime: false,
  hiddenDays:[0],
  minTime:'06:00',
  maxTime:'23:00',
  columnHeaderFormat:"ddd D",
  views : 
  {
    month:
    {
      groupByResource:true,
    },
    agenda:
    {
      groupByDateAndResource:true,
    },
    day:
    {
      groupByDateAndResource:true,
    },
  },
  dayClick: function(date, jsEvent, view) {
    alert("dayClick");
  },
  viewRender: function(view, element) {
    console.log(view.options);
  }
  //...other callbacks, not necessary to paste them
});

Большое спасибо!

1 Ответ

0 голосов
/ 16 января 2019

Нашли это! (по крайней мере, обходной путь)

Когда я делаю: 

$('#calendar').fullCalendar('gotoDate',d);
$('#calendar').fullCalendar('changeView','agendaDay');

Я на самом деле переключаю представление перед тем, как все события извлекаются, что, похоже, является известной проблемой с fullcalendar

Вот ссылка:

переключение видов перед разрешением события, ошибка JS # 3689 https://github.com/fullcalendar/fullcalendar/issues/3689

Это означает, что исправление состоит в том, чтобы дождаться получения всех событий, прежде чем изменять представление, например, с помощью: 

  $('#calendar').fullCalendar('gotoDate',d);
  $( document ).ajaxComplete(function() {
    $('#calendar').fullCalendar('changeView','agendaDay');
  });

У меня отлично работает.

Спасибо!

...