Fullcalendar 如何在完整日历插件中显示每月重复的事件
有了这段代码，我可以显示每日和每周事件，但我无法显示每月事件。我在我的一个laravel项目中使用了完整的日历插件。通过使用dow参数，我可以显示每日事件，范围显示事件表单开始日期Fullcalendar 如何在完整日历插件中显示每月重复的事件,fullcalendar,Fullcalendar,有了这段代码，我可以显示每日和每周事件，但我无法显示每月事件。我在我的一个laravel项目中使用了完整的日历插件。通过使用dow参数，我可以显示每日事件，范围显示事件表单开始日期 $('#calendar').fullCalendar({ defaultDate: moment(), editable: false, eventLimit: true, // allow "more" link when too many events
$('#calendar').fullCalendar({
defaultDate: moment(),
editable: false,
eventLimit: true, // allow "more" link when too many events
events:function(start, end, timezone, callback){
$.ajax({url: baseUrl +"/calenderevents",
type:'post',
success: function(data)
{
var events = [];
var range = [];
$.each(data, function(index, element) {
events.push({
title : element.title,
start : element.start,
end : element.end,
id : element.id,
dow : element.dow,
ranges : range
});
range.push({
start: moment(element.ranges)
});
});
callback(events);
}
});
},
dayClick: function() {
$('#event-message').text("Add Activity");
$('#calender-error').html('');
if($("#user_role_id").data("user-role") == 1){
return false;
}
$("#delete-event").hide();
$('.dimensions').attr('readonly', 'readonly');
$('#clear-form').click();
$('.calender-event').attr({
'id':'calender_event_form',
'action':baseUrl+'/assisted',
});
$.fancybox({
content: $('#add_calender_event'),
padding : 10,
fitToView:false,
autoSize: false,
width:485,
height:600,
openEffect : 'elastic',
closeEffect : 'elastic',
});
},
eventRender: function (event, element) {
// element.addClass('href', 'javascript:void(0);');
element.addClass('event');
element.attr('id', event.id);
if("ranges" in event)
{
return (event.ranges.filter(function(range){ // test event against all the ranges
return (event.start.isAfter(range.start));
}).length)>0;
}
}
});
var-date=新日期（）；
var d=date.getDate（）；
var m=date.getMonth（）；
var y=date.getFullYear（）；
var defaultEvents=[
{id:'${periodicTask.id}'，标题：'${periodicTask.task}'，
开始：“10:00”，//开始时间（本例中为上午10点）
end:'14:00'，//结束时间（本例中为下午6点）
范围：[{//重复事件仅在下列范围之一内时显示。
开始：时刻（新日期（'${periodicTask.startDate}'））.startOf（'year'），//接下来的两周
结束：时刻（新日期（'${periodicTask.endDate}'））。添加（7，'d'），
}]
，键入：'${periodicTask.description}'，位置：'${periodicTask.location.name}'，结束日期：新日期（'${periodicTask.endDate}'），区域：'${periodicTask.area.name}'，频率：'${periodicTask.frequency}'，起始日期：新日期（'${periodicTask.startDate}'），重复：0，颜色：“{Math.random（）.toString（16）.切片（2，8），道：[${periodicTask.day}，
{id:'${periodicTask.id}'，标题：'${periodicTask.task}'，开始：新日期（y，m，${periodicTask.startDay}'，结束：新日期（y，m，${periodicTask.endDay}'，24，0，0，0），类型：'${periodicTask.description}'，区域：'${periodicTask.area name}'，开始日期：'${periodicTask.startDate}'，频率：'${periodicTask.frequency}'，位置：''${periodicTask.location.name}'，重复：1，结束日期：新日期（'${periodicTask.endDate}'），颜色：“#”+Math.random（）.toString（16）.slice（2,8）}，
];
//表示每月重复标志的任何值
var REPEAT_每月=1；
//表示年度重复标志的任何值
var REPEAT_年=2；
函数Unix_时间戳（t）
{
var dt=新日期（t*1000）；
var hr=dt.getHours（）；
var m=“0”+dt.getMinutes（）；
var s=“0”+dt.getSeconds（）；
返回dt；
}
$（“#日历”）.fullCalendar({
标题：{
左：“上一个，下一个”，
中心：'标题'，
右图：“月，基本周，基本日”
},
displayEventTime:false，
eventLimit：对，
是的，
eventMouseover：函数（数据、事件、视图）{
//$（'#'+data.id）.工具提示（'show'）
工具提示=“+”标题“+”：-“+data.title+”“+”说明“+”：-“+data.type+”“+”位置“+”：-“+data.location+”“+”频率“+”：-“+data.Frequency+”“+”区域“+”：-“+data.Area+”；
如果（data.frequency==‘每周’）{
var weekday=[“周日”、“周一”、“周二”、“周三”、“周四”、“周五”、“周六”]；
工具提示+=''+'Day'+'：-'+工作日[data.dow]+''；
}否则{
工具提示+=''+'开始日期'+'：-'+data.startDate+'结束日期'+'：-'+data.endDate+''；
}
$（“正文”）.append（工具提示）；
$（此）.mouseover（函数（e）{
$（this.css（'z-index'，10000）；
$（'.tooltip'）.fadeIn（'500'）；
$（'.tooltip'）.fadeTo（'10'，1.9）；
}).mousemove（函数（e）{
$（'.tooltip'）.css（'top'，e.pageY+10）；
$（'.tooltip'）.css（'left'，e.pageX+20）；
});
},
eventDrop:函数（事件、增量、恢复函数）{
游泳({
标题：“你确定吗？”，
键入：“警告”，
showCancelButton:true，
confirmButtonColor:#DD6B55“，
confirmButtonText：“是的，重新安排它！”
},
功能（isConfirm）{
如果（我确认）
{
window.location=“${pageContext.request.contextPath}/task/periodic task schedule update/”+event.id+“/”+event.start.format（）+“/”+新日期（event.start.getDay（）；
}
否则{
回复函数（）
}
});
},
eventMouseout：函数（数据、事件、视图）{
$（this.css（'z-index'，8）；
$（'.tooltip'）.remove（）；
},
事件：函数（开始、结束、时区、回调）{
/*$.ajax({
类型：“POST”，
url:“${pageContext.request.contextPath}/task/calendar定期任务视图”，
数据类型：“json”，
数据：{
开始：event.start，
结束：event.end
},
成功：功能（doc）{
var事件=[]；
$（doc）.find（'event'）.each（function（）{
事件。推({
开始：$（'#开始'）.val（''），
结束：$（'#结束'）.val（''）
});
});
回调（事件）；
}
}); */
var current_month=新日期（$（'#calendar'）.fullCalendar（'getDate'）.format（））.getMonth（）+1；
var current_fullYear=新日期（$（“#日历”）.fullCalendar（'getDate'）.format（））.getFullYear（）；
var事件=[]；
$.each（默认事件、函数（键、事件）{
if（Date.parse（new Date（event.endDate））>=Date.parse（new Date（$（“#calendar”）.fullCalendar（$（'getDate'）.format（）））{
如果（event.repeat==0）{
变量对象={
开始：“14:00”，
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
var defaultEvents = [
<c:forEach var='periodicTask' items='${periodicTaskTemplates}'>
<c:choose>
<c:when test='${fn:containsIgnoreCase(periodicTask.frequency, "Weekly")}'>
{ id: '${periodicTask.id}', title: '${periodicTask.task}',
start: '10:00', // a start time (10am in this example)
end: '14:00', // an end time (6pm in this example)
ranges: [{ //repeating events are only displayed if they are within one of the following ranges.
start: moment(new Date('${periodicTask.startDate}')).startOf('year'), //next two weeks
end: moment(new Date('${periodicTask.endDate}')).add(7,'d'),
}]
,type:'${periodicTask.description}',location:'${periodicTask.location.name}',endDate:new Date('${periodicTask.endDate}'),area: '${periodicTask.area.name}',frequency:'${periodicTask.frequency}', startDate: new Date('${periodicTask.startDate}'),repeat: 0,color: "#"+ Math.random().toString(16).slice(2, 8) ,dow: [${periodicTask.day}]},
</c:when>
<c:otherwise>
{ id: '${periodicTask.id}', title: '${periodicTask.task}',start: new Date(y, m, '${periodicTask.startDay}'), end: new Date(y, m, '${periodicTask.endDay}', 24, 0, 0, 0) ,type:'${periodicTask.description}',area: '${periodicTask.area.name}',startDate: new Date('${periodicTask.startDate}'),frequency:'${periodicTask.frequency}',location:'${periodicTask.location.name}', repeat: 1,endDate:new Date('${periodicTask.endDate}'), color: "#"+ Math.random().toString(16).slice(2, 8) },
</c:otherwise>
</c:choose>
</c:forEach>
];
// Any value represanting monthly repeat flag
var REPEAT_MONTHLY = 1;
// Any value represanting yearly repeat flag
var REPEAT_YEARLY = 2;
function Unix_timestamp(t)
{
var dt = new Date(t*1000);
var hr = dt.getHours();
var m = "0" + dt.getMinutes();
var s = "0" + dt.getSeconds();
return dt;
}
$('#calendar').fullCalendar({
header: {
left: 'prev,next',
center: 'title',
right: 'month,basicWeek,basicDay'
},
displayEventTime: false,
eventLimit: true,
editable: true,
eventMouseover: function (data, event, view) {
// $('#'+data.id).tooltip('show')
tooltip = '<div class="tooltip tooltip-top" style="display:none;position:absolute;border:1px solid #333;background-color:#161616;border-radius:5px;padding:10px; color:#fff;font-size:12px Arial;;height:auto;position:absolute;z-index:10001;line-height: 150%;">' + 'title ' + ':- ' + data.title + '</br>' + 'description ' + ':- ' + data.type + '</br>' + 'location ' + ':- ' + data.location + '</br>' + 'Frequency ' + ':- ' + data.frequency + '</br>' + 'Area ' + ':- ' + data.area+'';
if(data.frequency =='Weekly'){
var weekday = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
tooltip += '</br>'+'Day' + ':- ' + weekday[data.dow] + '</br></div>';
}else{
tooltip += '</br>'+'Start Date ' + ':- ' + data.startDate + '</br>End Date ' + ':- ' + data.endDate + '</br></div>';
}
$("body").append(tooltip);
$(this).mouseover(function (e) {
$(this).css('z-index', 10000);
$('.tooltip ').fadeIn('500');
$('.tooltip ').fadeTo('10', 1.9);
}).mousemove(function (e) {
$('.tooltip ').css('top', e.pageY + 10);
$('.tooltip ').css('left', e.pageX + 20);
});
},
eventDrop: function(event, delta, revertFunc) {
swal({
title: "Are you sure?",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes, Re-Shedule it!"
},
function (isConfirm) {
if (isConfirm)
{
window.location = "${pageContext.request.contextPath}/task/periodic-task-shedule-update/"+event.id+"/"+event.start.format()+"/"+new Date(event.start).getDay() ;
}
else{
revertFunc()
}
});
},
eventMouseout: function (data, event, view) {
$(this).css('z-index', 8);
$('.tooltip ').remove();
},
events: function(start, end, timezone, callback) {
/* $.ajax({
type: "POST",
url: "${pageContext.request.contextPath}/task/calendar-periodic-task-view",
dataType: 'json',
data: {
start: event.start,
end: event.end
},
success: function(doc) {
var events = [];
$(doc).find('event').each(function() {
events.push({
start: $('#start').val(''),
end: $('#end').val('')
});
});
callback(events);
}
}); */
var current_month = new Date($('#calendar').fullCalendar('getDate').format()).getMonth()+1;
var current_fullYear = new Date($('#calendar').fullCalendar('getDate').format()).getFullYear();
var events = [];
$.each(defaultEvents, function(key, event) {
if (Date.parse(new Date(event.endDate)) >= Date.parse(new Date($('#calendar').fullCalendar('getDate').format()))) {
if(event.repeat ===0 ){
var objevent={
start: "14:00",
color:event.color,
id:event.id,
location:event.location,
repeat:event.repeat,
title:event.title,
dow:event.dow,
area:event.area,
frequency:event.frequency,
type:event.type,
endDate:event.endDate,
startDate: event.startDate
}
events.push(objevent);
}else if(event.repeat === 1 && ( current_month > (new Date(event.start).getMonth()+1)) || current_fullYear > new Date(event.start).getFullYear() ){
var new_start_date = new Date(current_fullYear+'-'+current_month+'-'+new Date(event.start).getDate());
var new_end_date = new Date(current_fullYear+'-'+current_month+'-'+new Date(event.end).getDate());
var objevent={
color:event.color,
start:new_start_date,
id:event.id,
location:event.location,
repeat:event.repeat,
area:event.area,
frequency:event.frequency,
end:new_end_date,
title:event.title,
type:event.type,
endDate:event.endDate,
startDate: event.startDate
}
events.push(objevent);
}
events.push(objevent);
}
});
callback(events);
},
});
var matchingDaysBetween = function (start, end, test) {
var days = [];
for (var day = moment(start); day.isBefore(end); day.add(30, 'd')) {
if (test(day)) {
days.push(moment(day));
// push a copy of day
}
}
return days;
}