Fullcalendar 中的可变营业时间

Question

我正在使用 FullCalendar，并将其用于营业时间不同的企业

周一、周二、周三、周五是 09:00 - 17:00。

周四是 09:00 - 19:00。

businessHours: {
    start: '09:00', // a start time (10am in this example)
    end: '17:00', // an end time (6pm in this example)
    dow: [ 1, 2, 3, 5]
        // days of week. an array of zero-based day of week integers (0=Sunday)
        // (Monday-Thursday in this example)
}

http://fullcalendar.io/docs/display/businessHours/

如何实现？

Answer 1

要对工作时间使用可变时间，您需要使用这样的后台事件：

events:
[
    {
        id:    'available_hours',
        start: '2015-1-13T8:00:00',
        end:   '2015-1-13T19:00:00',
        rendering: 'background'
    },
    {
        id:    'available_hours',
        start: '2015-1-14T8:00:00',
        end:   '2015-1-14T17:00:00',
        rendering: 'background'
    },
    {
        id:    'work',
        start: '2015-1-13T10:00:00',
        end:   '2015-1-13T16:00:00',
        constraint: 'available_hours'
    }
]

请注意，在上次活动中它已填写约束条件？这表示这只能放置在可用的时间段内。使用约束，您可以制定灵活的营业时间。

有关详细信息，请参阅此 link， http://fullcalendar.io/docs/event_ui/eventConstraint/

Answer 2

试试这个 - 为每个工作时间添加一个事件，如下所示：

{
  ...
  events: [
    // business hours 1
    {
        className: 'fc-nonbusiness',
        start: '09:00',
        end: '17:00',
        dow: [1, 2, 3, 4], // monday - thursday
        rendering: 'inverse-background'
    },
    // business hours 2
    {
        className: 'fc-nonbusiness',
        start: '10:00',
        end: '15:00',
        dow: [6], // saturday
        rendering: 'inverse-background'
    }],
 ...
}

注意： className 和 rendering 是实现此功能的重要选项。

祝你好运。

Fullcalendar 中的可变营业时间

Variable business hours in Fullcalendar

javascript

fullcalendar