scouser03/multi-column

Laravel Nova 字段。

1.0.2 2022-06-20 15:41 UTC

This package is auto-updated.

Last update: 2024-09-20 20:43:28 UTC


README

注意:请,此包是克隆 https://github.com/fourstacks/nova-repeatable-fields 因为此包可能已弃用。

此包包含一个 Laravel Nova 字段,允许创建可重复的 '子' 字段集合。Nova 用户可以自由创建、重新排序和删除由您定义的多个子字段的多行数据。数据以 JSON 格式保存到数据库中。

安装

您可以通过 composer 将此包安装到使用 Nova 的 Laravel 应用程序中

composer require scouser03/multi-column

用法

namespace App\Nova;

use Scouser03\MultiColumn\MultiColumn;

// ...

class Post extends Resource
{
    // ...

    public function fields(Request $request)
    {
        return [
            // ...

            MultiColumn::make('attributes'),

            // ...
        ];
    }
}

为了使用此包,您还应确保您的 Nova 资源所代表的 Eloquent 模型将您希望用作多列字段的属性转换为数组

namespace App;

// ...

class Post extends Model
{
    protected $casts = [
        'attributes' => 'array'
    ]
}

底层数据库字段应为 stringtext 类型字段。

配置

此包附带各种选项,您可以使用这些选项在 MultiColumn 中定义子字段

addField

参数:array

您创建的每个 MultiColumn 字段至少应包含一个通过 addField 添加的子字段。addField 方法接受一个子字段配置选项数组

MultiColumn::make('attributes')
    ->addField([
        // configuation options
    ])

配置选项包括

label
[
    'label' => 'field label',
    //...
]

所有子字段至少必须定义一个 'label'。这是一个可读的字符串,将在 Nova UI 中显示。

name
[
    'name' => 'field_name',
    //...
]

默认情况下,子字段的 name(用于在数据库中保存数据)将自动生成,使用子字段 label 的蛇形版本。或者,您可以自由覆盖此约定并定义一个要使用的自定义名称。

type
[
    'type' => 'text',
    //...
]

默认情况下,子字段的输入类型将是一个标准文本字段。如果您希望,您可以定义不同的字段类型。当前支持的子字段类型为:'text'、'number'、'select'、'textarea'。

placeholder
[
    'placeholder' => 'Placheholder',
    //...
]

默认情况下,输入 placeholder 将与子字段 label 相同。但是,您可以使用此选项定义一个自定义占位符,它将显示出来。

width

[
    'width' => 'w-1/2',
    //...
]

如果您选择按行显示您的子字段(而不是堆叠 - 见下面的 displayStackedForm 选项),您可以使用 Tailwind 的分数宽度类 定义您的字段宽度。除非您想这样做,否则您不需要为所有字段定义宽度。如果没有为任何子字段输入宽度,则所有子字段将具有相同的宽度。

请注意,您可以混合和匹配宽度。例如,您可能希望将前两个字段设置为 50% 宽度,使用 w-1/2,然后使用 w-full 将最后一个字段设置为全宽度。

如果您以堆叠布局显示子字段,则宽度选项将不起作用。

options
[
    'options' => [
        'first' => 'First',
        'second' => 'Second',
    ],
    //...
]

如果您正在定义的子字段的 type 是 'select',您将需要为选择字段定义一个选项数组。这些是用键/值对数组定义的。

attributes
[
    'attributes' => [
        'min' => 1,
        'max' => '20',
        'style' => 'color: red'
    ],
    //...
]

通过 attributes 键,您可以自由地通过关联数组定义您希望添加到输入中的任何自定义属性。这些属性将通过 v-bind 添加。例如,您可能希望向数字字段添加最小或最大步数,或者向文本字段添加样式属性。

addButtonText

MultiColumn::make('attributes')
    ->addButtonText('Add new dog');

您可以根据需要配置用于在 Nova UI 中添加一组新子字段的按钮文本。默认情况下,此按钮标签为 '添加行',但您可以使用 addButtonText 选项来覆盖此标签。

summaryLabel

MultiColumn::make('attributes')
    ->summaryLabel('Dogs');

displayStackedForm

MultiColumn::make('attributes')
    ->displayStackedForm();

initialRows

MultiColumn::make('attributes')
    ->initialRows(4);

设置初始化时预添加的行数。对于已有行的表单,它将追加到设置的数量。

maximumRows

MultiColumn::make('attributes')
    ->maximumRows(4);

设置行数的最大上限。达到此限制后,您将无法添加新行。

heading

MultiColumn::make('attributes')
    ->heading('attributes');

变更日志

有关最近变更的更多信息,请参阅 变更日志

许可协议

MIT 许可协议(MIT)。有关更多信息,请参阅 许可文件