README

安装

安装此扩展的首选方式是通过 composer。

安装，可以执行以下命令：

$ php composer.phar require edofre/laravel-fullcalendar

或者将以下内容添加到您的 composer.json 文件的 require 部分：

"edofre/laravel-fullcalendar": "V1.2.4"

注意

此包安装正确需要 fxp/composer-asset 插件。此插件允许您通过 composer 下载 bower 包。

您可以使用以下命令安装它：

composer global require "fxp/composer-asset-plugin:^1.4.0”

这将添加 fxp composer-asset-plugin 并使您的 composer 能够找到并下载所需的 bower-asset/fullcalendar 包。您可以在以下页面找到更多信息：https://packagist.org.cn/packages/fxp/composer-asset-plugin。

配置

将 ServiceProvider 添加到您的 config/app.php 配置文件中

'providers' => [
        ...
        Edofre\Fullcalendar\FullcalendarServiceProvider::class,
    ],

并添加 facade

'aliases' => [
        ...
        'Fullcalendar' => Edofre\Fullcalendar\Facades\Fullcalendar::class,
    ],

发布资产和配置文件

php artisan vendor:publish --tag=config
php artisan vendor:publish --tag=fullcalendar

手动加载脚本文件

通过在 config/.env 文件中将 include_scripts 选项设置为 false，脚本在生成日历时将不会包含。如果您想手动包含脚本，可以在 header/footer 等 position 调用以下静态函数。

    \Edofre\Fullcalendar\Fullcalendar::renderScriptFiles();

示例

以下是一个控制器操作示例，用于配置日历

    public function index()
    {
        // Generate a new fullcalendar instance
        $calendar = new \Edofre\Fullcalendar\Fullcalendar();

        // You can manually add the objects as an array
        $events = $this->getEvents();
        $calendar->setEvents($events);
        // Or you can add a route and return the events using an ajax requests that returns the events as json
        $calendar->setEvents(route('fullcalendar-ajax-events'));

        // Set options
        $calendar->setOptions([
            'locale'      => 'nl',
            'weekNumbers' => true,
            'selectable'  => true,
            'defaultView' => 'agendaWeek',
            // Add the callbacks
            'eventClick' => new \Edofre\Fullcalendar\JsExpression("
                function(event, jsEvent, view) {
                    console.log(event);
                }
            "),
            'viewRender' => new \Edofre\Fullcalendar\JsExpression("
                function( view, element ) {
                    console.log(\"View \"+view.name+\" rendered\");
                }
            "),
        ]);

        // Check out the documentation for all the options and callbacks.
        // https://fullcalendar.io/docs/

        return view('fullcalendar.index', [
            'calendar' => $calendar,
        ]);
    }

    /**
     * @param Request $request
     * @return string
     */
    public function ajaxEvents(Request $request)
    {
        // start and end dates will be sent automatically by fullcalendar, they can be obtained using:
        // $request->get('start') & $request->get('end')
        $events = $this->getEvents();
        return json_encode($events);
    }

    /**
     * @return array
     */
    private function getEvents()
    {
        $events = [];
        $events[] = new \Edofre\Fullcalendar\Event([
            'id'     => 0,
            'title'  => 'Rest',
            'allDay' => true,
            'start'  => Carbon::create(2016, 11, 20),
            'end'    => Carbon::create(2016, 11, 20),
        ]);

        $events[] = new \Edofre\Fullcalendar\Event([
            'id'    => 1,
            'title' => 'Appointment #' . rand(1, 999),
            'start' => Carbon::create(2016, 11, 15, 13),
            'end'   => Carbon::create(2016, 11, 15, 13)->addHour(2),
        ]);

        $events[] = new \Edofre\Fullcalendar\Event([
            'id'               => 2,
            'title'            => 'Appointment #' . rand(1, 999),
            'editable'         => true,
            'startEditable'    => true,
            'durationEditable' => true,
            'start'            => Carbon::create(2016, 11, 16, 10),
            'end'              => Carbon::create(2016, 11, 16, 13),
        ]);

        $events[] = new \Edofre\Fullcalendar\Event([
            'id'               => 3,
            'title'            => 'Appointment #' . rand(1, 999),
            'editable'         => true,
            'startEditable'    => true,
            'durationEditable' => true,
            'start'            => Carbon::create(2016, 11, 14, 9),
            'end'              => Carbon::create(2016, 11, 14, 10),
            'backgroundColor'  => 'black',
            'borderColor'      => 'red',
            'textColor'        => 'green',
        ]);
        return $events;
    }

然后您可以通过生成 HTML 和脚本来渲染日历

    {!! $calendar->generate() !!}

测试

通过执行以下命令运行测试：

composer test