全日历营业时间

Question

我正在尝试使用营业时间选项，但我无法反映更改。

我想显示多个营业时间。这是代码：

$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    defaultDate: '2014-11-12',
    editable: true,
    eventLimit: true, // allow "more" link when too many events
    businessHours:
        [
            {
                start: '10:00', // a start time (10am in this example)
                end: '12:00', // an end time (12pm in this example)
                dow: [1, 2, 3, 4]
                // days of week. an array of zero-based day of week integers (0=Sunday)
                // (Monday-Thursday in this example)
            },
            {
                start: '12:00', // a start time (12pm in this example)
                end: '18:00', // an end time (6pm in this example)
                dow: [1, 2, 3, 4]
                // days of week. an array of zero-based day of week integers (0=Sunday)
                // (Monday-Thursday in this example)
            }]
});  

Answer 1

像这样

businessHours:
    {
                            
            start: '11:00',
            end:   '12:00',
            dow: [ 1, 2, 3, 4, 5]
    },

为了不同的班次使用不同的时间->使用后台事件

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

有关更多信息，请参阅此链接， https://fullcalendar.io/docs/eventConstraint/

根据您使用日历的方式，有几种不同的方法可以解决这个问题。希望约束的灵活性将帮助您完成所需的工作。

很高兴这个功能终于出现了！

Answer 2

我必须显示固定的上午 8 点到晚上 8 点的 FullCaledar 时间段，所以我做了一些研发，并应用了以下选项，它似乎工作正常！！！干杯。

jq('#calendar').fullCalendar({
        header: {
          left: 'prev,next',
          center: 'title',
          right: 'today,month,agendaWeek,resourceDay'
        },
        defaultView: 'resourceDay',
        allDaySlot: false,
        axisFormat: 'h:mm A',
        timeFormat: 'h:mm T',
        minTime: '08:00:00',
        maxTime: '20:00:00',

使用， minTime: '08:00:00', maxTime: '20:00:00'

谢谢！！！

Answer 3

另一方面，您可以定义工作时间和工作日。

businessHours: [{
                        daysOfWeek: [1, 2, 3, 6, 7],
                        startTime: '08:00',
                        endTime: '23:00'
                    },
                    {
                        daysOfWeek: [4],
                        startTime: '08:00',
                        endTime: '16:00'
                    },
                    {
                        daysOfWeek: [5],
                        startTime: '15:00',
                        endTime: '23:00'
                    }
                ]

希望有帮助。

Answer 4

在版本 4 中：

businessHours: {
  // days of week. an array of zero-based day of week integers (0=Sunday)
  daysOfWeek: [ 1, 2, 3, 4 ], // Monday - Thursday

  startTime: '10:00', // a start time (10am in this example)
  endTime: '18:00', // an end time (6pm in this example)
}

您还可以将营业时间声明分成多个部分，以对象数组的形式进行额外控制：

businessHours: [ // specify an array instead
  {
    daysOfWeek: [ 1, 2, 3 ], // Monday, Tuesday, Wednesday
    startTime: '08:00', // 8am
    endTime: '18:00' // 6pm
  },
  {
    daysOfWeek: [ 4, 5 ], // Thursday, Friday
    startTime: '10:00', // 10am
    endTime: '16:00' // 4pm
  }
]

在版本 3 中：

businessHours: {
  // days of week. an array of zero-based day of week integers (0=Sunday)
  dow: [ 1, 2, 3, 4 ], // Monday - Thursday

  start: '10:00', // a start time (10am in this example)
  end: '18:00', // an end time (6pm in this example)
}

您还可以将您的营业时间声明分成多个部分以进行额外控制（在 v2.9.1 中添加）：

businessHours: [ // specify an array instead
  {
    dow: [ 1, 2, 3 ], // Monday, Tuesday, Wednesday
    start: '08:00', // 8am
    end: '18:00' // 6pm
  },
  {
    dow: [ 4, 5 ], // Thursday, Friday
    start: '10:00', // 10am
    end: '16:00' // 4pm
  }
]