如何解决我想在完整日历上显示每月活动
我有一个小问题，我被卡住了。我正在使用完整日历 v4.4.0。在我的网络应用程序中，客户可以创建一个频率为（一次、每周和每月）的事件。我已经成功地在完整日历上显示了每周发生一次的事件。但我一直在展示每月的活动。
还有一件事，事件数据来自数据库，所以我不想推送每月或每周在数据库中发生的相同事件。我只想要一个实例。为了每周的目的，我成功了。
让我和你分享我的代码
$model = Event::find()->all(); // getting events from database
foreach ($model as $mod)//looping
{
$day=array(); // for weekly purpose making day array for repeatabel
if ($mod->event_frequency==2) // checking if the event is weekly
{
$start=date('N',strtotime($mod->start_time)); // getting start day
$end=date('N',strtotime($mod->end_time)); // getting end day
if($start==$end)
{
$day[]=$start;
}
else
{
$day[]=$start;
$day[]=$end;
}
$data[]=[
'id' =>$mod->id,'title'=>$mod->event_name,'start' => $mod->start_time,'end' => $mod->end_time,'backgroundColor' => $mod->event_tag_color,'textColor' => '#FFF','daysOfWeek' => $day // for repeatable events showing
];
}
else if($mod->event_frequency==3) // for monthly
{
$start=date('N',strtotime($mod->start_time));
$end=date('N',strtotime($mod->end_time));
if($start==$end)
{
$day[]=$start;
}
else
{
$day[]=$start;
$day[]=$end;
}
$data[]=[
'id' =>$mod->id,// stuck here for days
'rrule'=> [
'freq'=> 'MONTHLY','interval'=> '5','dtstart'=> $start,'until' => '2022-12-31',],];
}
else
{
$data[]=[
'id' =>$mod->id,];
}
请帮忙
感谢捆绑
编辑：
我添加了 rrule.min.js 并尝试通过 json 发送 rrule，但它没有显示在日历上。也添加了其余的参数。
完整的 json 正在填充事件
[
{
"id": 4,"title": "Testing Event 1","start": "2021-02-24 09:00:00","end": "2021-02-24 18:00:00","backgroundColor": "#F9072C","textColor": "#FFF"
},{
"id": 5,"title": "Testing Event 2","start": "2021-02-26 09:00:00","end": "2021-02-26 18:00:00","backgroundColor": "#6453E9",{
"id": 6,"title": "Testing Event 3","start": "2021-02-25 09:00:00","end": "2021-02-25 18:00:00","backgroundColor": "#53E984",{
"id": 7,"title": "Testing Event 4","start": "2021-02-27 10:00:00","end": "2021-02-27 21:00:00","backgroundColor": "#E9CB53","textColor": "#FFF","rrule": {
"freq": "MONTHLY","interval": "1","dtstart": "2021-02-27 10:00:00","until": "2022-12-31"
}
},{
"id": 10,"title": "Testing Event","start": "2021-03-12 09:00:00","end": "2021-03-12 18:00:00","backgroundColor": "#FF000F",{
"id": 11,"title": "testing one","start": "2021-03-09 04:45:00","end": "2021-03-10 04:45:00","daysOfWeek": [
"2","3"
]
},{
"id": 12,"title": "Testing with Monthly","start": "2021-03-23 09:00:00","end": "2021-03-23 17:00:00","backgroundColor": "#025B0E","dtstart": "2021-03-23 09:00:00","until": "2022-12-31"
}
}
]
calendar.js 如下
document.addEventListener('DOMContentLoaded',function() {
var url ='./';
$('body').on('click','.datetimepicker',function() {
$(this).not('.hasDateTimePicker').datetimepicker({
controlType: 'select',changeMonth: true,changeYear: true,dateFormat: "dd-mm-yy",timeFormat: 'HH:mm:ss',yearRange: "1900:+10",showOn:'focus',firstDay: 1
}).focus();
});
$(".colorpicker").colorpicker();
var calendarEl = document.getElementById('calendar-event');
var calendar = new FullCalendar.Calendar(calendarEl,{
plugins: ['interaction','dayGrid','timeGrid','list','rrule'],header: {
left: 'prev,next today',center: 'title',right: 'dayGridMonth,timeGridWeek,timeGridDay,listMonth'
},navLinks: true,// can click day/week names to navigate views
businessHours: true,// display business hours
editable: true,//uncomment to have a default date
//defaultDate: '2020-04-07',events: url+'calender/load',// this is where the events are populating
eventDrop: function(arg) {
var start = arg.event.start.toDateString()+' '+arg.event.start.getHours()+':'+arg.event.start.getMinutes()+':'+arg.event.start.getSeconds();
if (arg.event.end == null) {
end = start;
} else {
var end = arg.event.end.toDateString()+' '+arg.event.end.getHours()+':'+arg.event.end.getMinutes()+':'+arg.event.end.getSeconds();
}
$.ajax({
url:url+"calender/update",type:"POST",data:{id:arg.event.id,start:start,end:end},});
},eventResize: function(arg) {
var start = arg.event.start.toDateString()+' '+arg.event.start.getHours()+':'+arg.event.start.getMinutes()+':'+arg.event.start.getSeconds();
var end = arg.event.end.toDateString()+' '+arg.event.end.getHours()+':'+arg.event.end.getMinutes()+':'+arg.event.end.getSeconds();
$.ajax({
url:url+"calender/update",eventClick: function(arg) {
var id = arg.event.id;
$('#editEventId').val(id);
$('#deleteEvent').attr('data-id',id);
$.ajax({
url:url+"calender/get-event",dataType: 'json',data:{id:id},success: function(data) {
// debugger;
$('#name').val(data.title);
$('#start').val(data.start);
$('#end').val(data.end);
$('#color').val(data.color);
$('#comments').val(data.comments);
$('#venue').val(data.venue);
$('#frequency').val(data.frequency);
$('#event_id').val(data.id);
// $('#editTextColor').val(data.textColor);
// $('#editeventmodal').modal();
}
});
$('body').on('click','#deleteEvent',function() {
if(confirm("Are you sure you want to remove it?")) {
$.ajax({
url:url+"api/delete.php",data:{id:arg.event.id},});
//close model
$('#editeventmodal').modal('hide');
//refresh calendar
calendar.refetchEvents();
}
});
calendar.refetchEvents();
}
});
calendar.render();
$(".ajax_form").on("submit",function(evt) {
evt.preventDefault();
var $form = $(this);
$.ajax({
type: $form.prop('method'),url: $form.prop('action'),data: $form.serialize(),dataType: "json",traditional: true,success: function (response) {
//alert(response.status);
if (response.status==="ok"){
calendar.refetchEvents();
$(".ajax_form").trigger("reset");
}
else
{
}
},error: function (response) {
debugger;
alert(response.d);
}
});
});
$(".edit-event-calender").on("click",function(evt) {
$data=$('form').serialize();
$url=$(this).data('url');
$.ajax({
type: "POST",url: $url,data: $data,success: function (response) {
//alert(response.status);
if (response.status==="ok"){
calendar.refetchEvents();
$(".ajax_form").trigger("reset");
}
else
{
}
},error: function (response) {
debugger;
alert(response.d);
}
});
});
$(".delete-event-calender").on("click",error: function (response) {
debugger;
alert(response.d);
}
});
});
});
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
