README

Nova Inline Select

此软件包允许您在 Laravel Nova 中创建内联选择字段。这是为了从索引或详细视图快速更改资源而构建的。在表单中，它将只显示一个正常的下拉选择框。

要求

• php: >=8.1
• laravel/nova: ^4.0

安装

通过 Composer 在 Laravel Nova 项目中安装此软件包

composer require marshmallow/nova-inline-select

用法

use Marshmallow\NovaInlineSelect\NovaInlineSelect;

return NovaInlineSelect::make(__('Assignee'), 'assignee_id')->options([
    1 => 'Stef van Esch',
    2 => 'Lars Kort',
]);

头像/图标

use Marshmallow\NovaInlineSelect\NovaInlineSelect;

return NovaInlineSelect::make(__('Assignee'), 'assignee_id')
    ->options([
        1 => 'Stef van Esch',
        2 => 'Lars Kort',
    ])
    ->avatarImages([
        1 => 'https://marshmallow.dev/stef.png',
        2 => 'https://marshmallow.dev/lars.png',
    ]);

带有头像 HTML

如果您希望使用某种 HTML 作为头像，例如 SVG 图标，您可以使用 avatarHtml() 方法。

use Marshmallow\NovaInlineSelect\NovaInlineSelect;

return NovaInlineSelect::make(__('Priority'), 'priority')
    ->options([
        'urgent' => 'Urgent',
        // ...
    ])
    ->avatarHtml([
        'urgent' => '<svg class="mm-h-5 mm-w-5 mm-flex-shrink-0">...</svg>',
        // ...
    ]);

无头像图片

您可以根据选项未提供头像图片来自定义我们渲染的图片类型。您可以使用 noAvatarImage() 方法为此。

use Marshmallow\NovaInlineSelect\NovaInlineSelect;

return NovaInlineSelect::make(__('Priority'), 'priority')
    ->options([
        'urgent' => 'Urgent',
        // ...
    ])
    ->avatarHtml([
        'urgent' => '<svg class="mm-h-5 mm-w-5 mm-flex-shrink-0">...</svg>',
        // ...
    ])
    ->noAvatarImage('<svg class="mm-h-5 mm-w-5 mm-flex-shrink-0">...</svg>');

箭头

默认情况下，下拉框中显示箭头来指示可以选择。您可以使用以下方法更改此行为。

return NovaInlineSelect::make(__('Priority'), 'priority')
    ->showArrows()
    ->hideArrows()
    ->showArrowsOnIndex()
    ->hideArrowsOnIndex()
    ->showArrowsOnDetail()
    ->hideArrowsOnDetail();

标签

默认情况下，标签显示在选择按钮中。有时您可能想隐藏它。在此页面的预览图像中，我们已经隐藏了优先级字段的标签，但保留了分配者字段的标签。您可以使用以下方法完成此操作。

return NovaInlineSelect::make(__('Priority'), 'priority')
    ->showLabel()
    ->hideLabel()
    ->showLabelOnIndex()
    ->hideLabelOnIndex()
    ->showLabelOnDetail()
    ->hideLabelOnDetail();

样式

您可以在索引和详细视图中设置选择按钮的最大宽度。在此页面上方的预览图像中，我们已将优先级字段做得非常小，以便它不会占用索引视图中的太多空间。

return NovaInlineSelect::make(__('Priority'), 'priority')
    ->maxWidthOnIndex('180px')
    ->maxWidthOnDetail('inherit');

未选择选项

默认情况下，当未选择任何选项时，按钮将显示文本 未选择选项。您可以使用以下方法更改此文本。

return NovaInlineSelect::make(__('Priority'), 'priority')
    ->noOptionSelected('No prio set');

验证注意事项

如果模型上的字段是 required（这很可能是），则需要额外步骤来确保内联选择更新保持持久，并且不会引发错误。需要在任何 required 字段的 updateRules() 方法中添加验证规则 sometimes。

Text::make('Email')
    ->rules('required', 'email')
    ->updateRules('sometimes'),

致谢

• Stef van Esch
• 所有贡献者

许可协议

此项目是开源软件，受MIT 许可协议许可。