README

为 Yii2 的日期范围选择器小部件

此小部件使用 Bootstrap Date Range Picker 小部件来渲染 DateRangePicker 输入控件。

安装

通过 composer 安装此 yii2-extension 是首选方式。

运行

php composer.phar require "hiqdev/yii2-daterangepicker"

或在您的 composer.json 的 require 部分中添加

"hiqdev/yii2-daterangepicker": "*"

。

使用方法

使用此小部件有两种方式：与 ActiveForm 实例一起使用，或者作为设置其 model 和 attribute 的小部件。可以通过 'clientOptions' 数组传递额外的 options。

与 ActiveForm 一起使用

<?php
use hipanel\widgets\DatePicker;
...
$this->pickerOptions = ArrayHelper::merge([
    'class' => DateRangePicker::class,
    'name' => '',
    'options' => [
        'tag' => false,
        'id' => "{$id}-period-btn",
    ],
    'clientEvents' => [
        'apply.daterangepicker' => new JsExpression(/** @lang JavaScript */"
            function (event, picker) {
                var form = $(picker.element[0]).closest('form');
                var span = form.find('#{$id}-period-btn span');

                span.text(picker.startDate.format('ll') + ' - ' + picker.endDate.format('ll'));

                form.find('input[name=from]').val(picker.startDate.format());
                form.find('input[name=till]').val(picker.endDate.format());
                form.trigger('change.updateChart');
            }
        "),
        'cancel.daterangepicker' => new JsExpression(/** @lang JavaScript */"
            function (event, picker) {
                var form = $(event.element[0]).closest('form');
                var span = form.find('#{$id}-period-btn span');

                span.text(span.data('prompt'));

                form.find('input[name=from]').val('');
                form.find('input[name=till]').val('');
                form.trigger('change.updateChart');
            }
        "),
    ],
    'clientOptions' => [
        'ranges' => [
            Yii::t('hipanel', 'Current Month') => new JsExpression('[moment().startOf("month"), new Date()]'),
            Yii::t('hipanel', 'Previous Month') => new JsExpression('[moment().subtract(1, "month").startOf("month"), moment().subtract(1, "month").endOf("month")]'),
            Yii::t('hipanel', 'Last 3 months') => new JsExpression('[moment().subtract(3, "month").startOf("month"), new Date()]'),
            Yii::t('hipanel', 'Last year') => new JsExpression('[moment().subtract(1, "year").startOf("year"), new Date()]'),
        ],
    ],
], $this->pickerOptions);
...
?>

作为小部件

<?php
use hipanel\widgets\DatePicker;
?>

<?= DateRangePicker::widget([
    'model' => $search->model,
    'attribute' => 'create_from',
    'attribute2' => 'create_till',
    'options' => [
        'class' => 'form-control',
    ],
    'dateFormat' => 'yyyy-MM-dd',
]) ?>

许可证

该项目根据 BSD-3-Clause 许可证 发布。了解更多 这里。

版权 © 2018, HiQDev (http://hiqdev.com/)

致谢

此软件包基于 omnilight/yii2-bootstrap-daterangepicker。