fullcalendar, когда ресурсы рендеринга, строки за весь день не выстроены - PullRequest
Новая
       25

fullcalendar, когда ресурсы рендеринга, строки за весь день не выстроены

0 голосов
/ 25 июня 2019

Предыдущий пост, который привел к этой проблеме: Полный календарь с использованием ресурсов в качестве функции с меню выбора

Исходя из моего предыдущего поста, у меня возникла проблема с использованием fullcalendar 4. Когда я использую ресурсы в качестве функции, мои блоки на весь день не совпадают с временными интервалами моего планировщика. Вы можете видеть это на картинке.

Вот моя функция ресурсов: 

        resources: function(fetchInfo, successCallback, failureCallback) {
            // Filter resources by whether their id is in visibleResourceIds.
            var filteredResources = [];

            filteredResources = resourceData.filter(function(x) {
              return visibleResourceIds.indexOf(x.id) !== -1;
            });

            successCallback(filteredResources);

    },

Вот моя функция переключения ресурсов: 

    // menu button/dropdown will trigger this function. Feed it resourceId.
    function toggleResource(resourceId) {
        visibleResourceIds = [];

        //if select all...  see if undefined from loading on initial load = true
        if ((resourceId == '') || (resourceId === undefined)) {

            $.map( resourceData, function( value, index ) {
                 visibleResourceIds.push(value.id);
            });

        }

      var index = visibleResourceIds.indexOf(resourceId);
      if (index !== -1) {
        visibleResourceIds.splice(index, 1);
      } else {
        visibleResourceIds.push(resourceId);
      }

      calendar.refetchResources();

Другой связанный код (при изменении меню ресурсы выбранного элемента меню отображаются только в полном календаре): 

var resourceData = [];
var visibleResourceIds = [];

$.getJSON('ajax_get_json.php?what=schedule_providers_at_location',
    function(data) {
        $.each(data, function(index) {
            resourceData.push({
                id: data[index].value,
                title: data[index].text
            });

        });
    });


$('#toggle_providers_calendar').change(function() {
    toggleResource($('#toggle_providers_calendar').val());
});

Ресурсы очень хорошо показывают / скрывают, основываясь на выбранном ресурсе меню, но посмотрите на дневные блоки - они не выстраиваются в линию после того, как ресурсы по какой-то причине были перезагружены. Они исправляют себя, поскольку пользователь перемещается по планировщику, хотя!

enter image description here

ОБНОВЛЕНИЕ НИЖЕ

После осмотра выглядит, как при вызове refetchevents, класс .fc-week теряет следующий css: 

   style="border-right-width: 1px; margin-right: 20px;"

Вот полная фотография календаря при начальной загрузке:

enter image description here

После того, как я щелкну одну из навигационных стрелок, строки за весь день встречаются с остальным временем календаря, потому что этот стиль применяется к .fc-week.

enter image description here

У меня нет специальных css, примененных к календарю, и я не использую какие-либо темы, которые бы избавились от этого: по крайней мере, не то, что я вижу сейчас.

Вот HTML-код, в котором находится календарь: 

<div class="portlet-body">
    <div class='loader'></div>
    <div class="row">
        <div id="calendar_full" style="padding-left: 10px; padding-right: 15px;"></div>
    </div>
</div>

Чтобы это исправить, я могу добавить следующую строку после повторного получения ресурсов в моей функции toggleResources: 

$('#calendar_full .fc-week').css('border-right-width', '1px').css('margin-right', '20px');

Я буду продолжать выяснять, почему этот css исчезает после повторного добавления ресурсов. Интересно, может ли это быть глюк?

...