README

Livewire 日期选择器是一个独立的 livewire 组件，它提供了一个日历、日期选择器和日期范围选择器。

这还不是一个稳定的版本。

安装

通过 Composer

$ composer require flat-duck/livewire-datepicker

使用方法

此包使用 tailwindcss。

您需要将 ./vendor/flat-duck/livewire-datepicker/resources/**/*.blade.php 添加到 tailwind.config.json 的 purge 列表中

要使用此功能，创建一个新的 livewire 组件并扩展 DatePickerComponent 类

use FlatDuck\LivewireDatepicker\Http\Livewire\DatePickerComponent;

class TestCalendar extends DatePickerComponent
{
    // Pick any of the 3 options.
    public string $type = self::TYPE_RANGE_PICKER;
    public string $type = self::TYPE_DATEPICKER;
    public string $type = self::TYPE_DISPLAY_ONLY;
}

然后根据需要添加可用数据

public function getAvailabilityData(): Collection
{
    return collect([
        new DatePickerDayData(Carbon::yesterday(), classes: 'bg-red-500 text-white'),
        new DatePickerDayData(Carbon::tomorrow(), classes: 'bg-yellow-500 text-white'),
        new DatePickerDayData(Carbon::today(), classes: 'bg-green-500 text-white'),
        new DatePickerDayData(date: Carbon::now()->setDay(31), disabled: true, cannotPickOver: true),
        new DatePickerDayData(date: Carbon::now()->setDay(26), disabled: true, cannotPickOver: true),
    ]);
}

最后，向其他组件（如有必要）发出事件（示例）

    /**
     * This method is called whenever the date range or a new date is set.
     */
    public function onDatesSet(): void
    {
        $this->emit('rangeSet', ['from' => $this->startRange->format('Y-m-d'), 'till' => $this->endRange->format('Y-m-d')]);
    }

    /**
     * This method is called whenever the date range or a new date is unset.
     */
    public function onDatesUnSet(): void
    {
        $this->emit('rangeUnset');
    }

将提供更多文档，但您始终可以查看组件以了解可用的选项。

变更日志

请参阅变更日志获取有关最近更改的更多信息。

测试

$ composer test

贡献

请参阅contributing.md以获取详细信息及待办事项清单。

安全

如果您发现任何与安全相关的问题，请通过电子邮件flat-duck@gmail.com联系，而不是使用问题跟踪器。

许可

MIT。有关更多信息，请参阅许可文件。