skyraptor/filament-navigation

在 Filament 中构建结构化导航菜单。

0.3.2 2022-06-24 20:57 UTC

README

Latest Version on Packagist GitHub Tests Action Status GitHub Code Style Action Status Total Downloads

这是 FilamentNavigation 的分支,扩展了翻译支持。

此 Filament 插件提供了一个 Navigation 资源,允许轻松构建结构化导航菜单。

安装

首先通过 Composer 安装此包

composer require skyraptor/filament-navigation

发布包的资产

php artisan vendor:publish --tag="filament-navigation-assets"

用法

NavigationResource 会自动与 Filament 注册,因此无需配置即可开始使用。

如果您想自定义导航组、排序或图标,可以使用相应的 NavigationResource::navigationGroup()NavigationResource::navigationSort()NavigationResource::navigationIcon() 方法。

数据结构

每个导航菜单都需要有一个 namehandlehandle 应该是唯一的,并用于检索菜单。

项目存储在一个名为 items 的 JSON 列表中。这是一个看起来像的递归数据结构

[
    {
        "label": "Home",
        "type": "external-link",
        "data": {
            "url": "/",
            "target": "_blank",
        },
        "children": [
            // ...
        ],
    }
]

递归结构使得渲染嵌套菜单/下拉菜单变得非常简单

<ul>
    @foreach($menu->items as $item)
        <li>
            {{ $item['label'] }}

            @if($item['children'])
                <ul>
                    {{-- Render the item's children here... --}}
                </ul>
            @endforeach
        </li>
    @endforeach
</ul>

检索导航对象

要检索导航对象,请将句柄提供给 RyanChandler\FilamentNavigation\Facades\FilamentNavigation::get() 方法。

use RyanChandler\FilamentNavigation\Facades\FilamentNavigation;

$menu = FilamentNavigation::get('main-menu');

自定义项目类型

默认情况下,此插件包含一个名为“外部链接”的单个“项目类型”。此项目类型期望提供一个 URL,并可选的“目标”(相同标签页或新标签页)。

可以扩展插件以使用自定义项目类型。自定义项目类型有一个名称和一个 Filament 字段对象的数组,这些对象将在“项目”模态中显示。

此 API 允许您将导航菜单与您应用程序的实体和模型深度集成。

use RyanChandler\FilamentNavigation\Facades\FilamentNavigation;

FilamentNavigation::addItemType('Post link', [
    Select::make('post_id')
        ->searchable()
        ->options(function () {
            return Post::pluck('title', 'id');
        })
]);

项目类型的所有自定义字段都可以在项目的 data 属性中找到。

Navigation 字段类型

此插件还提供了一个自定义 Filament 字段,可用于在其他表单和资源中搜索和选择导航菜单。

use RyanChandler\FilamentNavigation\Filament\Fields\NavigationSelect;

->schema([
    NavigationSelect::make('navigation_id'),
])

默认情况下,此字段将不可搜索,每个选项的值将是菜单的 id

要使字段可搜索,请调用 ->searchable() 方法。

->schema([
    NavigationSelect::make('navigation_id')
        ->searchable(),
])

如果您想更改每个选项的值,请调用 ->optionValue() 方法。

->schema([
    NavigationSelect::make('navigation_id')
        ->optionValue('handle'),
])

测试

composer test

更改日志

有关最近更改的更多信息,请参阅 CHANGELOG

贡献

有关详细信息,请参阅 CONTRIBUTING

安全漏洞

有关报告安全漏洞的详细信息,请参阅 我们的安全策略

鸣谢

许可证

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