Javascript 在完整日历日视图中显示超过1天
我试图使用完整日历组件在日程日视图中显示3天,或者最终使用垂直资源视图 我尝试使用示例自定义视图,但没有成功 是否可以在日视图中显示3天,一天比一天低 我正在使用这个构造器,但我不希望日子彼此相邻,而是在彼此下面Javascript 在完整日历日视图中显示超过1天,javascript,jquery,fullcalendar,fullcalendar-scheduler,Javascript,Jquery,Fullcalendar,Fullcalendar Scheduler,我试图使用完整日历组件在日程日视图中显示3天,或者最终使用垂直资源视图 我尝试使用示例自定义视图,但没有成功 是否可以在日视图中显示3天,一天比一天低 我正在使用这个构造器,但我不希望日子彼此相邻,而是在彼此下面 $(“#日历”).fullCalendar({ defaultView:'agendaDay', 默认日期:“2017-12-07”, 是的, 是的, eventLimit:true,//当事件太多时允许“更多”链接 标题:{ 左:“上一个,下一个今天”, 中心:'标题', 右图:“
$(“#日历”).fullCalendar({
defaultView:'agendaDay',
默认日期:“2017-12-07”,
是的,
是的,
eventLimit:true,//当事件太多时允许“更多”链接
标题:{
左:“上一个,下一个今天”,
中心:'标题',
右图:“agendaDay,agendaTwoDay,agendaWeek,month”
},
观点:{
工作日:{
键入:“议程”,
持续时间:{天:3},
//默认情况下,超过一天的视图不会执行此行为
//因此,我们需要显式地启用它
//groupByResource:对
////先将此行取消注释为“按天分组”,并在下面添加资源
groupByDate:true
}
}
您不能在日程样式视图中显示彼此下方的日期,不可以。它的整个布局方案是水平方向的。您可以轻松地以正常日程样式并排显示这些日期
调度器插件提供的垂直资源视图基本上与议程视图相同,但每天都被划分为每个指定资源的子列
如果你想让天数一个接一个地显示,你唯一的选择就是“列表”样式的视图。这会垂直显示,但你会失去时间网格
此代码将以3天的时间跨度实现这两种类型的视图,因此您可以看到差异:
views: {
agendaThreeDay: {
type: 'agenda',
duration: {
days: 3
},
buttonText: '3 day agenda'
},
listThreeDay: {
type: 'list',
duration: {
days: 3
},
buttonText: '3 day list'
}
},
下面是一个工作演示:
如果这两个都不能满足您的需要,那么您唯一的其他选择就是创建一个完全自定义的视图类型(请参阅本文档页面的后半部分:)这是一个复杂且耗时的任务,所以在着手进行这样的事情之前,你应该考虑一下内置的视图类型是否真的是令人满意的——它们确实把必要的信息传达给用户,这是日历的主要目的,即使它不是完全符合你所想象的布局。在日程视图中显示多天(天)只需添加-和+您想要的小时数…例如,前一天为24小时,后一天为24小时。类似如下:
views: {
firstView: {
type: 'agendaDay',
minTime: '-12:00:00',
maxTime: '36:00:00',
slotDuration: '00:30:00',
},
}
并将其添加到标题:
header: {
left: 'prev,next',
center: 'title',
right: '.....,timeGridFourDay'
},
我设法在议程样式视图中显示了彼此下方的日期:)您所要做的就是这样的YourView:{键入:“agendaDay”,minTime:'-24:00:00',maxTime:'36:00:00',slotDuration:'00:30:00',}通过这种方式,您可以在视图中看到不止一天。我认为您可以根据需要添加任意多的天数+/-。@VladN这非常有趣,可能对其他人有用。您应该将其作为一个答案来写。
header: {
left: 'prev,next',
center: 'title',
right: '.....,timeGridFourDay'
},