README

实现了 bootstrap-year-calendar 插件用于 Yii2 的 Widget

安装

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

运行以下命令之一

composer require --prefer-dist "tecnocen/yii2-bootstrap-year-calendar:*"

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

"tecnocen/yii2-bootstrap-year-calendar": "*"

require

用法

日历

这是一个基本的 Widget，将插件封装到 yii\bootstrap\Widget 实现。

use tecnocen\yearcalendar\widgets\Calendar;

echo Calendar::widget([
    // 'language' => 'es',
    'options' => [
        // HTML attributes for the container.
        // the `tag` option is specially handled as the HTML tag name
    ],
    'clientOptions' => [
        // JS Options to be passed to the `calendar()` plugin.
        // see http://bootstrap-year-calendar.com/#Documentation/Options
    ],
    'clientEvents' => [
        // JS Events for the `calendar()` plugin.
        // see http://bootstrap-year-calendar.com/#Documentation/Events
    ]
]);

ActiveCalendar

ActiveCalendar Widget 使用 [dataProvider] (https://yiiframework.cn/doc-2.0/yii-data-dataproviderinterface.html) 来加载传递给日历插件的 dataSource 属性。

dataProvider 返回的模型必须实现 tecnocen\yearcalendar\data\DataItem 接口。

DataItem 接口。

namespace api\models;

use tecnocen\yearcalendar\data\DataItem;
use tecnocen\yearcalendar\data\JsExpressionHelper;
use yii\db\ActiveRecord;

class Conference extends ActiveRecord implements DataItem
{
    public function getName()
    {
        return $this->name;
    }

    public function getStartDate()
    {
        return JsExpressionHelper::parse($this->start_date);
    }

    public function getEndDate()
    {
        return JsExpressionHelper::parse($this->end_date);
    }

    // rest of the active record code.
}

JsExpressionHelper

DataItem::getStartDate() 和 DataItem::getEndDate() 方法必须返回一个包含只有年、月和日的 JavaScript Date 对象的 yii\web\JsExpression 实例。建议创建 JS 对象如下

new Date(year, month, day);

JsExpressionHelper 通过提供一个静态方法 JsExpressionHelper::parse() 简化了这个任务，该方法可以用以下方式使用。

// $dateTime is an object of the class DateTime
// see https://php.ac.cn/manual/en/class.datetime.php
JsExpressionHelper::parse($dateTime);

// $timestamp is an integer which will be used as
// unix time tamp
JsExpressionHelper::parse($timestamp);

// $date is an string here it can accept a second
// parameter $format which by default is 'Y-m-d'
// see https://php.ac.cn/manual/es/datetime.createfromformat.php
JsExpressionHelper::parse($date, $format);

所有这些都将返回日历 JS 插件期望的对象。

Widget

一旦我们有了模型，我们就可以创建数据提供者并将其传递给 ActiveCalendar Widget。

use api\models\Conference;
use tecnocen\yearcalendar\widgets\ActiveCalendar;
use yii\data\ActiveDataProvider;

echo ActiveCalendar::widget([
    // 'language' => 'es',
    'dataProvider' => new ActiveDataProvider([
        'query' => Conference::find()->andWhere(['active' => 1])
    ]),
    'options' => [
        // HTML attributes for the container.
        // the `tag` option is specially handled as the HTML tag name
    ],
    'clientOptions' => [
        // JS Options to be passed to the `calendar()` plugin.
        // The `dataSource` property will be overwritten by the dataProvider.
        // see http://bootstrap-year-calendar.com/#Documentation/Options
    ],
    'clientEvents' => [
        // JS Events for the `calendar()` plugin.
        // see http://bootstrap-year-calendar.com/#Documentation/Events
    ]
])

语言

bootstrap-year-calendar 插件提供了以下语言支持 (https://github.com/Paul-DS/bootstrap-year-calendar/tree/master/js/languages)，Calendar 和 ActiveCalendar 支持使用 $language 类属性自动翻译，该属性将自动加载所需的 JS 文件并自定义插件调用。

echo Calendar::widget([
    'options' => ['id' => 'es-calendar'],
    'language' => 'es',
]);

将在视图中添加 JS 文件 bootstrap-year-calendar.es.js 并运行

jQuery('#es-calendar').calendar({"language":"es"});

在浏览器上。

类文档

待办事项

许可

BSD 许可证 (BSD)。请参阅 许可文件 获取更多信息。