FullCalendar:在Allday活动中显示多天活动

Question

我正在使用FullCalendar版本3.6.2，其中一些事件。

$('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay,listWeek'
            },
            editable: true,
            eventLimit: true, // allow "more" link when too many events
            navLinks: true,
            nextDayThreshold: '00:00:00', // 9am
            events: [
               {
                    title: 'Tesst tesst',
                    allDay: false,
                    start: '2017-11-12T08:00:00',
        end: '2017-11-13T15:00:00'
                },
                {
        title: 'Birthday Party',
        start: '2017-11-19T10:00:00',
        end: '2017-11-21T06:00:00'
    },
                {
                    title: 'All Day Event',
                    allDay:true,
                    start: TOMORROW,
                    end: TOMORROW
                },
                {
                    title: 'Long Event',
                        start: '2017-11-07T10:00:00',
        end: '2017-11-10T06:00:00'
                },
                {
                    title: 'Conference',
                        start: '2017-11-26T10:00:00',
        end: '2017-11-28T04:00:00'
                },
                {
                    title: 'Meeting',
                    allDay: true,
                    start: TODAY + 'T10:30:00',
                    end: TODAY + 'T12:30:00'
                },
            ]
        });

我的plunk：demo

我想在gardendaweek/askenday的全天活动中进行长时间的活动。

。

有什么方法？

非常感谢！

Answer 1

也有类似的问题，请尝试以下操作：

eventDataTransform在这里是关键，这允许您在将数据渲染到日历之前对其进行操纵。

在我的示例中，因为在我们日历上创建事件的其他人经常创建多日事件，然后在agendaDay视图中占用大部分屏幕，所以我选择将这些事件重新分类为全天事件，将它们重新定位到顶部视图。

我选择将任何事件重新分类> = 5小时作为全天活动。捕获eventData.end == null也很重要！

需要进一步确定需要将结束日期重新定义到第二天早上午夜的事件。这很有用，例如，由于多日活动在最后一天的1500小时完成，这也将作为全天活动移至顶部。没有这项修正案，最后一天将被切断。这里还有一些有关此信息的信息：FullCalendar-整天跨越一天的活动太短

 $('#calendar').fullCalendar({
          header: {
                left: 'prev,next today',
                center: '',
                right: 'month,agendaWeek,agendaDay'
            },
          defaultView: 'month',
          editable: false,
          aspectRatio: 0.77,
        eventDataTransform: function (eventData) {
                var dur = eventData.end - eventData.start; //total event duration
                if(dur >= 18000000 || eventData.end == null){ // 5 hours
                        eventData.allDay = true;

                        //eventData.end needs ammending to 00:00:00 of the next morning
                        if (dur > 86400000) {

                        var m = moment(eventData.end);
                        var roundDown = m.startOf('day');
                        var day2 = moment(roundDown).add(1, 'days')
                        eventData.end = day2.toString();
                        }
                }
            return(eventData);  
        },
    });