README

Alert Flash Tailwind 小部件

安装

composer require yii-extension/alert-flash-tailwind

使用方法

这些小部件不会注册任何资源，您必须为 Tailwind Css 框架注册资源

在控制器或操作中

<?php

declare(strict_types=1);

namespace App\Action;

use Psr\Http\Message\ResponseInterface;
use Yiisoft\Session\Flash\Flash;

final class Action
{
    public function index(Flash $flash): ResponseInterface
    {
        $flash->add(
            'danger', // types: [danger, info, success, warning]
            [
                'body' => '<b>Holy smokes!</b> Something seriously bad happened.' // Its mandatory.
            ],
            true
        );
    }
}

在布局中

<?php

declare(strict_types=1);

use Yii\Extension\Tailwind\AlertFlash;
use Yiisoft\Session\Flash\Flash;

/** @var Flash $flash */
?>

<?= AlertFlash::widget([$flash])
    ->bodyClass('align-middle flex-grow inline-block mr-8')
    ->bodyTag('p')
    ->buttonLabel('&times;')
    ->buttonOnClick('closeAlert()')
    ->iconAttributes(['class' => 'fa-2x pr-2'])
    ->class('flex font-bold items-center px-4 py-3 text-sm text-white')
    ->layoutBody('{icon}{body}{button}')
    ->render();
?>

Html输出

<div id="w0-alert" class="bg-red-600 flex font-bold items-center px-4 py-3 text-sm text-white" role="alert">
    <div><i class="fa-2x pr-2 far fa-times-circle"></i></div>
    <p class="align-middle flex-grow inline-block mr-8"><b>Holy smokes!</b> Something seriously bad happened.</p>
    <button type="button" class="float-right px-4 py-3" onclick="closeAlert()">&times;</button>
</div>

注意：Tailwind 不提供任何用于关闭 AlertFlash 的 JavaScript 实现，因此您需要自行实现。

示例 JavaScript

function closeAlert() {
    document.getElementById('w0-alert').style.display = 'none';
}

单元测试

该包使用 PHPUnit 进行测试。要运行测试

./vendor/bin/phpunit

突变测试

该包的测试使用 Infection 突变框架进行检查。要运行它

./vendor/bin/infection

静态分析

代码使用 Psalm 进行静态分析。要运行静态分析

./vendor/bin/psalm

许可

Yii Packages 的 yii-extension/alert-flash-tailwind 是自由软件。

它根据 BSD 许可协议发布。有关更多信息，请参阅 LICENSE。

由 Yii Extension 维护。

yii-extension / alert-flash-tailwind

维护者

详细信息