使用 Laravel 在 FullCalendar 中重复发生的事件

Posted

技术标签:

【中文标题】使用 Laravel 在 FullCalendar 中重复发生的事件【英文标题】:Recurring events in FullCalendar with Laravel 【发布时间】:2015-12-20 14:08:06 【问题描述】:

我正在为我的页面开发一个完整的日历模块。我可以在没有重复功能的情况下在日历上显示事件。但是,当我更改我的表格以包含重复出现的功能时,我无法显示表格中的事件。 这是我的表结构。

在提交表单时调用控制器中的更新函数,我注意到它正在表中更新。这是我的表单。

这是我的控制器更新功能。

public function update($id)

    //$type=Input::get('type');
    $event_id= Input::get('eventid');
    $title= Input::get('title');
    $start_day=Input::get('start');
    $end_day=Input::get('end');
    $allday=Input::get('allday');
    $repeat=Input::get('repeat');
    $frequency=Input::get('frequency');
    $start_time=Input::get('start_time');
    $end_time=Input::get('end_time');   
    $dow=Input::get('dow');
    $month=Input::get('month');
    $weekly_json=json_encode($dow);
    $monthly_json=json_encode($month);          
    $newstrt=substr($start_day,0,10);
    $newend=substr($end_day,0,10);
    $start= date("Y-m-d H:i:s",$newstrt);
    $end= date("Y-m-d H:i:s" , $newend);
    $roles = DB::table('events')
                ->where('event_id','=',$event_id)
                ->update(array('title' => $title,'daily'=>$allday,'repeat'=>$repeat,'frequency'=>$frequency,'start'=>$start,'end'=>$end,'time'=>$time,'dow'=>$weekly_json,'monthly_json'=>$monthly_json));

    if (Request::ajax())
     

    return Response::json(array('id'=>$event_id,'title'=>$title,'newstrt'=>$start,'newend'=>$end,'start_time'=>$start_time,'end_time'=>$end_time));
                   
    else 
    
        return  Redirect::route('calendar.index');
    

但我无法在完整日历上显示这些详细信息。我正在关注此链接以在完整日历上实现重复事件。 Recurring Events in FullCalendar.

这是我用于从表中获取详细信息的索引函数。

public function index()

    $event = DB::table('events')

    ->leftJoin('people','people.people_id','=','events.people_id')  
    ->where('events.flag', '=', 1)          
    ->get(array('events.event_id','events.title','events.start','events.end','events.start_time','events.end_time','events.repeat','events.frequency','events.dow'));   
    $id=array(array());
    $temp = array(array());
    $i=0;
    foreach ($event as $events)
        
            $j=0;
            $id[$i]["event_id"]=$events->event_id;
            $id[$i]["title"]=$events->title;
            $temp[$j]['start']=$events->start;
            $temp[$j]['end'] = $events->end;
            $temp[$j]['start_time']=$events->start_time;
            $temp[$j]['end_time'] = $events->end_time;
            $start_json=json_encode($temp);
            $id[$i]['range'] = $start_json;
            $id[$i]["frequency"]=$events->frequency;
            $id[$i]["repeat"]=$events->repeat;
            $id[$i]["dow"]=$events->dow;

            $i++;           
        


    return Response::json($id);

这是我的日历事件渲染函数和事件结构。

var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    var repeatingEvents = [
                url: '/v1/calendar/',
                type: 'GET',
        ranges: [ //repeating events are only displayed if they are within one of the following ranges.
            start: moment().startOf('week'), //next two weeks
            end: moment().endOf('week').add(7,'d'),
        ,
            start: moment('2015-02-01','YYYY-MM-DD'), //all of february
            end: moment('2015-02-01','YYYY-MM-DD').endOf('month'),
        ],
    ];

    console.log(repeatingEvents);

    var getEvents = function( start, end )
        return repeatingEvents;
    

    var calendar=$('#calendar');
    $.ajax(
                url: '/v1/calendar/',
                type: 'GET',
                dataType:'json',


                success:function events(response)

                

                    console.log(response);




    calendar.fullCalendar(
        header: 
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        ,

        eventRender: function(event, element, view)
                console.log(event.start.format());
                return (event.range.filter(function(range)
                    return (event.start.isBefore(range.end) &&
                            event.end.isAfter(range.start));
                ).length)>0;
            ,
            events: function( start, end, timezone, callback )
                var events = getEvents(start,end); //this should be a JSON request

                callback(events);
            ,
        editable: true,
        droppable: true, // this allows things to be dropped onto the calendar

        drop: function() 
            // is the "remove after drop" checkbox checked?
            if ($('#drop-remove').is(':checked')) 
                // if so, remove the element from the "Draggable Events" list
                $(this).remove();
            
        ,



        eventSources: [

            

                url: '/v1/calendar/',
                type: 'GET',
                dataType:'json',



            ,
           calendar.fullCalendar( 'addEventSource', response )
        ],

        selectable: true,
        selectHelper: true,
        select: function(start, end, allDay) 

我在控制台上收到这样的 JSON 响应。

dow: "[0,1,2]↵"
event_id: 1
frequency: "weekly"
range: "["start":"2015-09-11","end":"2015-09-12","start_time":"11:00:00","end_time":"15:00:00"]"
repeat: 1
title: "Youth festival"

我在控制台上没有收到任何错误......但事件也没有显示...... 我哪里做错了?有帮助吗?

【问题讨论】:

不应该是dow: "[0,1,2]↵"dow: [0,1,2] @jazzRo: 是的...我已经更改了它..但我猜这不是问题的原因.. 您能否让重复性事件正常工作? 【参考方案1】:

看到这段代码,我也面临 之后我使用了这个想法,它的工作原理

在控制器中

    $vendor_holiday = Vendor::all();
    return view('vendorpanel/holidays/index', compact('vendor_holiday'));

<script>
var calendar = $('#calendar').fullCalendar(
editable: false,
header: 
  left: 'prev,next today',
    center: 'title',
    right: 'month'
,
events:  [
    @foreach($vendor_holiday as $vendor_holiday)
    
        title : "",
        start : ' $vendor_holiday->start ',
    ,
    @endforeach
],
selectable: true,
selectHelper: true,
select: function (start, end, allDay) 
  $.ajaxSetup(
            headers: 
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            
        );
        var start = moment(start).format('YYYY-MM-DD');
        var end = moment(end).format('YYYY-MM-DD');
        var vendor_id = $("#vendor_id").val();
        var tdate = new Date();
var dd = tdate.getDate(); //yields day
var MM = tdate.getMonth(); //yields month
var yyyy = tdate.getFullYear(); //yields year
var currentDate=  yyyy+ "-" +0+( MM+1) + "-" + dd;
         if(start <= currentDate)
             alert("Mark Holiday at least 1 day before");
             return false;
         
         if (confirm("Are you sure you want to Add a Holiday?")) 
        $.ajax(
            url: "/vendor/holidays",
            type: "POST",
            data:  vendor_id: vendor_id, start: start, end: end ,
            success: function (d) 
                calendar.fullCalendar('refetchEvents');
                alert(d);
                location.reload();
            ,
        )
    
,
eventClick: function (calEvent, jsEvent, view, event) 
  $.ajaxSetup(
            headers: 
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            
        );
    if (confirm("Are you sure you want to remove it?")) 
        var start = calEvent.start.format();
        var vendor_id = $("#vendor_id").val();
        $.ajax(
            url: '/vendor/holidays/'+vendor_id,
            type: "DELETE",
            data:  _method: 'delete', start: start ,
            success: function (d) 
                $('#calendar').fullCalendar('removeEvents', calEvent._id);
                alert(d);
            ,
            error: function (data) 
                alert(data);
            
        );
    
,
);
</script>

【讨论】:

【参考方案2】:

Laravel - 重复事件发生生成器和组织器。

Calendarful 是一个简单且易于扩展的 php 解决方案,它允许生成重复事件的发生,从而无需在数据库或其他存储方法中存储数百甚至数千个事件。

这个包附带了默认的接口实现,可以开箱即用,但如果需要,提供您自己的实现非常简单。

它符合 PSR-2。

安装

这个包可以通过 Composer 安装:

https://github.com/Vij4yk/calendarful

$ composer require plummer/calendarful

需要 PHP >= 5.3.0

试试这个包。

【讨论】:

以上是关于使用 Laravel 在 FullCalendar 中重复发生的事件的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 laravel 在 jquery fullcalendar 中存储拖动的事件

FullCalendar 客户端事件发送到 Laravel 控制器

jquery 无法识别 fullcalendar

未找到类'MaddHatter LaravelFullcalendar ServiceProvider'

FullCalendar v4 动态设置日历的高度

无法访问嵌套事件对象的属性 - Fullcalendar jquery插件