Skip to content
全部文档

筛选器布局

将筛选器放入网格列

要更改筛选器可占用的列数,可以使用 filtersFormColumns() 方法:

php
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ])
        ->filtersFormColumns(3);
}
网格列中的筛选器表格网格列中的筛选器表格

控制筛选器下拉框宽度

要自定义下拉框宽度,可以使用 filtersFormWidth() 方法并指定宽度——ExtraSmallSmallMediumLargeExtraLargeTwoExtraLargeThreeExtraLargeFourExtraLargeFiveExtraLargeSixExtraLargeSevenExtraLarge。默认宽度为 ExtraSmall

php
use Filament\Support\Enums\Width;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ])
        ->filtersFormWidth(Width::FourExtraLarge);
}

控制筛选器下拉框最大高度

若要为筛选器下拉内容设置最大高度以便滚动,可以使用 filtersFormMaxHeight() 方法,并传入 CSS length

php
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ])
        ->filtersFormMaxHeight('400px');
}

在模态框中显示筛选器

若要在模态框而非下拉框中渲染筛选器,可以使用:

php
use Filament\Tables\Enums\FiltersLayout;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ], layout: FiltersLayout::Modal);
}
模态框中的筛选器表格模态框中的筛选器表格

在表格内容上方显示筛选器

若要在表格内容上方而非下拉框中渲染筛选器,可以使用:

php
use Filament\Tables\Enums\FiltersLayout;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ], layout: FiltersLayout::AboveContent);
}
内容上方的筛选器表格内容上方的筛选器表格

允许表格内容上方的筛选器折叠

若要允许表格内容上方的筛选器可折叠,可以使用:

php
use Filament\Tables\Enums\FiltersLayout;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ], layout: FiltersLayout::AboveContentCollapsible);
}
内容上方可折叠筛选器的表格内容上方可折叠筛选器的表格

在表格内容下方显示筛选器

若要在表格内容下方而非下拉框中渲染筛选器,可以使用:

php
use Filament\Tables\Enums\FiltersLayout;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ], layout: FiltersLayout::BelowContent);
}
内容下方的筛选器表格内容下方的筛选器表格

在表格内容左侧或右侧显示筛选器

若要在表格内容左侧(之前)或右侧(之后)而非下拉框中渲染筛选器,可以使用:

php
use Filament\Tables\Enums\FiltersLayout;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ], layout: FiltersLayout::BeforeContent); // or `FiltersLayout::AfterContent`
}
内容之前的筛选器表格内容之前的筛选器表格
内容之后的筛选器表格内容之后的筛选器表格

允许左侧或右侧筛选器可折叠

若要在表格内容左侧或右侧显示时允许筛选器可折叠,可以使用:

php
use Filament\Tables\Enums\FiltersLayout;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ], layout: FiltersLayout::BeforeContentCollapsible); // or `FiltersLayout::AfterContentCollapsible`
}

隐藏筛选器指示器

若要隐藏表格上方的活动筛选器指示器,可以使用 hiddenFilterIndicators()

php
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ])
        ->hiddenFilterIndicators();
}

自定义筛选器表单 Schema

你可以一次性自定义整个筛选器表单的 form schema,以将筛选器重新排列为所需布局,并使用表单可用的任意布局组件。为此,使用 filterFormSchema() 方法,传入一个闭包,接收可插入的已定义 $filters 数组:

php
use Filament\Schemas\Components\Section;
use Filament\Tables\Filters\Filter;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            Filter::make('is_featured'),
            Filter::make('published_at'),
            Filter::make('author'),
        ])
        ->filtersFormColumns(2)
        ->filtersFormSchema(fn (array $filters): array => [
            Section::make('Visibility')
                ->description('These filters affect the visibility of the records in the table.')
                ->schema([
                    $filters['is_featured'],
                    $filters['published_at'],
                ])
                    ->columns(2)
                ->columnSpanFull(),
            $filters['author'],
        ]);
}

在本例中,我们将两个筛选器放在了 section 组件内,并用 columns() 方法指定该区块为两列。我们还使用 columnSpanFull() 方法指定该区块应跨越筛选器表单的全宽(表单本身也是 2 列宽)。我们通过筛选器名称作为 $filters 数组的键,将每个筛选器插入到表单 schema 中。

带自定义筛选器表单 schema 的表格带自定义筛选器表单 schema 的表格

默认情况下,重置操作出现在筛选器表单的页眉。你可以使用 filtersResetActionPosition() 方法将其移到页脚,放在应用操作旁边:

php
use Filament\Tables\Enums\FiltersResetActionPosition;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->filters([
            // ...
        ])
        ->filtersResetActionPosition(FiltersResetActionPosition::Footer);
}