Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

kyos's avatar
Level 6

Filter php values into array with Vue and FullCalendar

Hi guy I am using fullcalendar.js

And everything works perfect I extract some php queries into javascript. But the problem is I want my "events" array into "fullCalendar" events array.

Here is my code:

module.exports = {
    template: require('./scheduled.template.html'),
    ready: function() {
        this.fetchScheduledWorksheets();
    },
    data: function() {
        return {
           events: EasyManagement.scheduleWorksheets
        }
    },
    methods: {
        fetchScheduledWorksheets: function() {
            $('#calendar').fullCalendar({
                events: [
                    {
                        title: 'adadad',
                        start: '2015-12-03'
                    },
                ],
                eventClick: function(event) {
                    alert(event);
                }
            });
        }
    }
}

I use: $data variable with a "pre" tag to see my converted php array and it gives this:

    {
  "events": [
    {
      "id": 1,
      "equipment_id": 1,
      "user_id": 2,
      "name": "Marcação importante",
      "body": "Levar contração anual",
      "scheduled_date": "2015-12-17",
      "periodicity": "Anual",
      "status": "scheduled",
      "number": 201500100002,
      "created_at": "2015-12-03 15:40:48",
      "updated_at": "2015-12-03 15:40:48"
    },
    {
      "id": 6,
      "equipment_id": 1,
      "user_id": 2,
      "name": "Mais uma agendada",
      "body": "adadadadadad",
      "scheduled_date": "2015-12-17",
      "periodicity": "mensal",
      "status": "scheduled",
      "number": 201500100006,
      "created_at": "2015-12-03 17:10:52",
      "updated_at": "2015-12-03 17:10:52"
    }
  ]
}

How can I implemente that array into "full calendar" events.

0 likes
1 reply
kyos's avatar
Level 6

Ok I found the solution Ive created a dedicated criteria.

<?php 

namespace App\Repositories\Criteria\Worksheets;

use App\Repositories\Criteria\Criteria;
use App\Repositories\Contracts\CriteriaInterface;
use App\Repositories\Contracts\RepositoryInterface;
use App\Repositories\Contracts\RepositoryInterface as Repository;

class Scheduled extends Criteria {

    /**
     * @param $model
     * @param RepositoryInterface $repository
     * @return mixed
     */
    public function apply($model, Repository $repository)
    {
        $query = $model->whereUserId(auth()->user()->id)
                 ->where('status', '=', 'scheduled')
                 ->select('name as title', 'scheduled_date as start');
        return $query;
    }
}

Please or to participate in this conversation.