Fullcalendar v3.6.2 startParam和endParam

时间:2018-03-26 09:25:12

标签: jquery json laravel-5 fullcalendar fullcalendar-3

如何在fullcaledar中使用startParam和endParam?我不太了解jQuery和Javascript。该视图位于路径中:example.com/agenda,然后我认为我必须在脚本中按以下方式放置 startParam endParam

    startParam: 'agenda.start',
    limitParam : 'agenda.limit',

这个想法是通过限制两个参数来避免事件的缓慢加载(大约10秒),以便仅加载当时在页面上看到的内容。我理解得好吗?这不起作用,我的意思是它继续缓慢加载,其余的工作完美。我该怎么办?感谢。

这是完整的文件 my-fullcalendar.js 我从json文件中收集数据:

var currentLangCode = $("#lang_js").data('value');

$('#calendar').fullCalendar({

    locale:currentLangCode,
    eventColor: '#58C1AB',
    eventTextColor: '#fff',
    startParam: 'agenda.start',
    limitParam : 'agenda.limit',

    eventClick:  function(event, jsEvent, view) {  // when some one click on any event

        if(currentLangCode == 'en'){
            startdate = moment(event.start).format('ddd, MMM D');
            enddate = moment(event.end).format('ddd, MMM D YYYY');
        }else{
            startdate = moment(event.start).format('dddd, D MMMM YYYY');
            enddate = moment(event.end).format('dddd, D MMMM YYYY');
        }

        starttime = moment.utc((event.start), "H:mm");
        endtime = moment.utc((event.end), "H:mm");

        var s_time = starttime.format("H:mm");
        var e_time = endtime.format("H:mm");

        if(s_time == '0:00'){
            var mytime = '';
        }else{
            var mytime = '<img src="images/web/icons/clock.svg" class="icono" width="18"> ' + s_time + ' - ' + e_time;
        }

        if(enddate == startdate){
            var mydate = '<img src="images/web/icons/date.svg" class="icono" width="18"> ' + startdate;
        }else if(event.end == null){
            var mydate = '<img src="images/web/icons/date.svg" class="icono" width="18"> ' + startdate;
        }else{
            var mydate = '<img src="images/web/icons/date.svg" class="icono" width="18"> ' + startdate + ' - ' + enddate;
        }

        if((event.imagen)){
            var myimage = '<img src="'+(event.imagen)+'" width="100%"/>';
        }else{
            var myimage = '';
        }
        var myplace = '<img src="images/web/icons/map-marker.svg" class="icono" width="18"/> ' +(event.lugar);

        $('#modalTitle').html(event.title);
        $('#modalPlace').html(myplace);
        $('#modalDate').html(mydate);
        $('#modalTime').html(mytime);
        $('#modalImage').html(myimage);

        $('#calendarModal').modal();
    },

    header: {
        left: 'prev,next today myCustomButton',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },

    editable: false,
    eventLimit: true,
    events:{
        url:'agenda/evento'
    },


});

这是控制器。我正在使用Laravel 5.4:

class EventoController extends Controller
{
public function index()
{
        return view('web.agenda.index', compact('calendar'));
}

public function api(Request $request)
{

    $events = Evento::where('active', '1')->orderBy('start_date')->get();

    $lang = Session::get('lang');
    if($lang == 'en') $lang_id = '2';
    elseif($lang == 'pt') $lang_id = '3';
    else $lang_id = '1';

    $data = [];
    foreach($events as $event){

        foreach($event->langs as $event_lang){
            if($event_lang->lang_id == $lang_id and $event_lang->evento_id == $event->id){

                // title and place
                $title[]=$event_lang->text;
                $place[]=$event_lang->place;

                $id[] = $event->id;

                // start
                if($event->start_time){
                    $start[] = $event->start_date.'T'.$event->start_time;
                } else{
                    $start[] = $event->start_date;
                }

                // end
                if($event->end_time){
                    $end[] = $event->start_date.'T'.$event->end_time;
                }elseif($event->end_date){
                    $end[] = $event->end_date;
                }else{
                    $end[] ='';
                }

                // image
                if(count($event->images)){
                    $imagen = Image::select('path')->where('imageable_type', 'App\Models\Evento')->where('imageable_id', $event->id)->first();
                    $image[] = $imagen->path;
                }else{
                    $image[] = '';
                }
            }
        }

    }

    $count = count($id);

    for($i=0; $i<$count; $i++){
        $data[$i] = array(
            "title"=>$title[$i],
            "lugar"=>$place[$i],
            "start"=>$start[$i],
            "end"=>$end[$i],
            "imagen"=>$image[$i],
        );
    }

    return response()->json($data);

}

}

1 个答案:

答案 0 :(得分:1)

我已经解决了感谢ADyson的回答:

在控制器中,我添加了:

    $from= $request->start;
    $to= $request->end;

    $events = Evento::where('active', '1')->whereBetween('start_date', [$from, $to])->get();