README

一个辅助库，包括用于生成标签、选择字段、文本字段、链接和表格的HTML的方法。

安装

使用Composer

将以下内容添加到您的composer.json中，然后运行composer install

{
    "require": {
        "indatus/widgets": "dev-master"
    }
}

在app/config/app.php中注册服务提供者

    [...]
    'providers' => array(
        [...]
        'Illuminate\View\ViewServiceProvider',
        'Illuminate\Workbench\WorkbenchServiceProvider',
        'Indatus\Widgets\WidgetsServiceProvider'
    ),
    [...]

小部件画廊

表格

可以从多维数组创建表格。键将作为在表格标题中显示的标题。可以通过options参数传递额外的选项，以应用于表格元素。

控制器传递给视图的数据。

    $data = [
        ['name' => 'Alex', 'occupation' => 'Engineer'],
        ['name' => 'Judy', 'occupation' => 'Analyst'],
        ['name' => 'Pam', 'occupation' => 'Coach']
    ];
    
    $options = ['class' => 'table'];

在blade模板内部使用表格生成器。

    {{ Indatus\Widgets\Table::generate($data, $options) }}

生成的HTML。

    <table class="table">
        <thead>
        <tr>
                        <td>Name</td>
                        <td>Occupation</td>
                </tr>
        </thead>
        <tbody>
                <tr>
                        <td>Alex</td>
                        <td>Engineer</td>
                    </tr>
                <tr>
                        <td>Judy</td>
                        <td>Analyst</td>
                    </tr>
                <tr>
                        <td>Pam</td>
                        <td>Coach</td>
                    </tr>
            </tbody>
    </table>

选择

控制器传递给视图的数据。

    $select = [
        'Red' => 1,
        'Orange' => 2,
        'Yellow' => 3,
        'Green' => 4,
        'Blue' => 5,
        'Indigio' => 6,
        'Violet' => 7
    ];
    
    $selected = 5; // Used to set what option will be selected.

在blade模板内部使用选择生成器。

{{ Indatus\Widgets\Select::generate($select, $selected) }}

生成的HTML

    <select>
            <option value="1">Red</option>
            <option value="2">Orange</option>
            <option value="3">Yellow</option>
            <option value="4">Green</option>
            <option value="5" selected="">Blue</option>
            <option value="6">Indigio</option>
            <option value="7">Violet</option>
    </select>

标签和输入

在blade模板内部使用标签和输入生成器。

    {{ Indatus\Widgets\Label::generate('Email', 'email', ['class' => 'loud']) }}
    {{ Indatus\Widgets\TextField::generate('email', null, ['class' => 'email']) }}
    {{ Indatus\Widgets\TextField::generate('name', 'Steve') }}

生成的HTML

    <label for="email" class="loud">Email</label>
    <input type="text" name="email" id="email" class="email">
    <input type="text" name="name" id="name" value="Steve">

链接

在blade模板内部使用链接生成器。

    {{ Indatus\Widgets\Link::generate('Google', 'http://google.com/', ['class' => 'outbound']) }}

生成的HTML

    <a href="http://google.com/" class="outbound">Google</a>

资源

要发布此包的资源，请运行针对此包的artisan publish命令。

    php artisan asset:publish indatus/widgets 

然后，要在模板中包含资源，请在以下内容中使用

    {{ Indatus\Widgets\Asset::scripts() }}
    {{ Indatus\Widgets\Asset::styles() }}

生成的HTML

    <script src="http://application-hostname.com/packages/indatus/widgets/widgets.js"></script>
    <link rel="stylesheet" href="http://application-hostname.com/packages/indatus/widgets/widgets.css">