Полная версия календаря 4 selectMirror не работает - PullRequest
Новая
       18

Полная версия календаря 4 selectMirror не работает

1 голос
/ 03 мая 2019

Есть ли какая-то конкретная причина, по которой selectMirror НЕ будет работать в полном календаре?Ничего не выделяется!Нет ошибок при загрузке моих скриптов в мою консоль.

У меня есть много сценариев в моих функциях eventRender, eventDrop, eventResize и select.Все они работают нормально.Если мне нужно будет включить их, я сделаю это.Я просто не уверен, может ли это вызвать конфликт, основанный на том, как был разработан selectMirror. 

<link href="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/core/main.css" rel="stylesheet" />
<link href="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/daygrid/main.css" rel="stylesheet" />
<link href="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/timegrid/main.css" rel="stylesheet" />
<script src="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/core/main.js" type="text/javascript"></script>
<script src="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/interaction/main.js" type="text/javascript"></script>
<script src="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/daygrid/main.js" type="text/javascript"></script>
<script src="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/timegrid/main.js" type="text/javascript"></script>

<script src="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/resource-common/main.js" type="text/javascript"></script>
<script src="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/resource-daygrid/main.js" type="text/javascript"></script>
<script src="added-assets/plugins/fullcalendar-scheduler-4.1.0/packages/resource-timegrid/main.js" type="text/javascript"></script>


<script>
document.addEventListener('DOMContentLoaded', function() {
 var calendar_full = document.getElementById('calendar_full');
    var calendar = new FullCalendar.Calendar(calendar_full, {
        selectMirror: true,
        selectable: true,
        editable: true,
        plugins: ['interaction', 'resourceDayGrid', 'resourceTimeGrid'],
        header: {
            right: 'prevYear,prev,next,nextYear,today',
            left: 'title',
            center: 'resourceTimeGridDay,resourceTimeGridWeek,resourceDayGridMonth'
        },
        defaultView: 'resourceTimeGridWeek',
        slotDuration: "<?php echo $location->data()->calendar_slot_duration; ?>",
        snapDuration: "<?php echo $location->data()->calendar_snap_duration; ?>",
        nowIndicator: true,
        minTime: "<?php echo $location->data()->calendar_start; ?>",
        maxTime: "<?php echo $location->data()->calendar_end; ?>",
        hiddenDays: $.parseJSON('[' + "<?php echo $location->data()->calendar_hide_days_of_week; ?>" + ']'),
        groupByResource: true,
        eventLimit: true,
        schedulerLicenseKey: 'CC-Attribution-NonCommercial-NoDerivatives',
        events: {
            url: 'ajax_get_json.php?what=location_appointments'
        },
        resources: {
            url: "ajax_get_json.php?what=schedule_providers_at_location"
        },
        resourceRender: function(renderInfo) {

            var default_provider = "<?php echo $default_provider; ?>";

            if (default_provider) {

                //change color of resource to match selected contact assigned to provider
                if (renderInfo.resource.id == default_provider) {
                    renderInfo.el.style.backgroundColor = 'rgb(233,237,239)';
                }

            }

        },
        dateClick: function(info) {
            if (info.view.type === "resourceDayGridMonth") {
                calendar.gotoDate(info.date);
                calendar.changeView('resourceTimeGridWeek');
            }
        },
        loading: function(bool) {
            if (bool) {
                $('.loader').show();
                $('#show_cancelled_appts').hide();
                $('#show_rescheduled_appts').hide();
            } else {
                $('.loader').hide();
                $('#show_cancelled_appts').show();
                $('#show_rescheduled_appts').show();
            }
        },
        datesRender: function(info) {


            if (info.view.type === "resourceDayGridMonth") {
                var date = calendar.getDate();
                var b = date.toISOString();

                calendar_mini.gotoDate(b);

            }
        }
    });
    calendar.render();

Все, что в моем скрипте работает отлично, когда я перешел с версии 3, но selectMirror.Я не знаю, где selectMirror вступает в игру: у меня есть правильные плагины / CSS?

Какой-нибудь совет, как решить эту проблему?

1 Ответ

1 голос
/ 04 мая 2019

Я понял это.Не уверен, поможет ли это кому-нибудь еще в будущем, но я узнал, что eventRender используется вместе с selectMirror.У меня в коде EventRender была строка кода, которая мешала отображению зеркала.После того, как я отредактировал свой код, зеркало отображается правильно.

...