Badge column

概述

徽章列(BadgeColumn)用于渲染彩色徽章：

use Filament\Tables\Columns\BadgeColumn;

BadgeColumn::make('status')
    ->enum([
        'draft' => 'Draft',
        'reviewing' => 'Reviewing',
        'published' => 'Published',
    ])

自定义颜色

徽章可以有颜色。颜色值可以是 danger、gray、info、primary、success 或 warning：

use Filament\Tables\Columns\BadgeColumn;

BadgeColumn::make('status')
    ->colors([
        'primary',
        'gray' => 'draft',
        'warning' => 'reviewing',
        'success' => 'published',
        'danger' => 'rejected',
    ])

你可以使用回调函数激活颜色，该回调接收单单元格的 $state 作为参数：

use Filament\Tables\Columns\BadgeColumn;

BadgeColumn::make('status')
    ->colors([
        'primary',
        'gray' => static fn ($state): bool => $state === 'draft',
        'warning' => static fn ($state): bool => $state === 'reviewing',
        'success' => static fn ($state): bool => $state === 'published',
        'danger' => static fn ($state): bool => $state === 'rejected',
    ])

或者根据 $record / $state 动态计算颜色：

use Filament\Tables\Columns\BadgeColumn;

BadgeColumn::make('status')
    ->color(static function ($state): string {
        if ($state === 'published') {
            return 'success';
        }
        
        return 'gray';
    })

添加图标：

徽章也可以有图标：

use Filament\Tables\Columns\BadgeColumn;

BadgeColumn::make('status')
    ->icons([
        'heroicon-m-x-mark',
        'heroicon-m-document' => 'draft',
        'heroicon-m-arrow-path' => 'reviewing',
        'heroicon-m-truck' => 'published',
    ])

此外，你可以使用闭包条件性地显示图标：

use Filament\Tables\Columns\BadgeColumn;

BadgeColumn::make('status')
    ->icons([
        'heroicon-m-x-mark',
        'heroicon-m-document' => static fn ($state): bool => $state === 'draft',
        'heroicon-m-arrow-path' => static fn ($state): bool => $state === 'reviewing',
        'heroicon-m-truck' => static fn ($state): bool => $state === 'published',
    ])

或者根据 $record/$state 计算图标：

use Filament\Tables\Columns\BadgeColumn;

BadgeColumn::make('status')
    ->icon(static function ($state): string {
        if ($state === 'published') {
            return 'heroicon-m-truck';
        }
        
        return 'heroicon-m-x-mark';
    })

使用 iconPosition() 你可以设置图标位置：

use Filament\Tables\Columns\BadgeColumn;

BadgeColumn::make('status')
    ->icons([
        'heroicon-m-x-mark',
        'heroicon-m-document' => 'draft',
        'heroicon-m-arrow-path' => 'reviewing',
        'heroicon-m-truck' => 'published',
    ])
    ->iconPosition('after') // `before` or `after`

格式化文本

文本列中的所有格式化选项，都可用于徽章列中。