信息列表 - Entries
开始
概述
Entry 类位于 Filament\Infolists\Components
命名空间下。你可以将其放到 $infolist->schema()
方法内:
use Filament\Infolists\Infolist; public function infolist(Infolist $infolist): Infolist{ return $infolist ->schema([ // ... ]);}
如果你在面板构造器的资源中,infolist()
方法应该是静态的:
use Filament\Infolists\Infolist; public static function infolist(Infolist $infolist): Infolist{ return $infolist ->schema([ // ... ]);}
条目(Entry)可以使用静态 make()
方法创建,传入其唯一名称。你可以使用"点语法"访问 Entry 关联。
use Filament\Infolists\Components\TextEntry; TextEntry::make('title') TextEntry::make('author.name')
可用条目
你也可以创建自定义条目,按照你的需要来展示数据。
设置标签
默认情况下,Entry 的标签(展示在信息列表头部),是由 Entry 的名称生成。你可以使用 label()
方法对其自定义:
use Filament\Infolists\Components\TextEntry; TextEntry::make('title') ->label('Post title')
可选地,你可以通过 translateLabel()
方法使用 Laravel 本地化特性自动翻译标签。
use Filament\Infolists\Components\TextEntry; TextEntry::make('title') ->translateLabel() // Equivalent to `label(__('Title'))`
Entry URL
点击 Entry 时,你可以打开一个网址。
打开 URL
你可以使用 url()
方法,传入回调函数或者静态 URL,来打开 URL。回调接收 $record
作为参数,你可以用它来自定义 URL:
use Filament\Infolists\Components\TextEntry; TextEntry::make('title') ->url(fn (Post $record): string => route('posts.edit', ['post' => $record]))
你也可以选择在新选项卡中打开 URL:
use Filament\Infolists\Components\TextEntry; TextEntry::make('title') ->url(fn (Post $record): string => route('posts.edit', ['post' => $record])) ->openUrlInNewTab()
设置默认值
要为状态为 null
的字段设置默认值,你可以使用 default()
方法。该方法将会将默认状态视为真实状态,因此,像图片或者颜色这些 Entry 将会显示默认图片或者颜色。
use Filament\Infolists\Components\TextEntry; TextEntry::make('title') ->default('Untitled')
如果 Entry 为空添加占位符文本
有时,你想在 Entry 为空状态值式显示占位符文本,其使用青灰色文本。这与默认值不同,因为占位符永远是文本,且不会被当作真实状态。
use Filament\Infolists\Components\TextEntry; TextEntry::make('title') ->placeholder('Untitled')
在 Entry 下添加帮助文本
有时,你希望为消息列表用户提供额外信息。为此,你可以在 Entry 下面添加帮助文本。
helperText()
方法用于添加帮助文本:
use Filament\Infolists\Components\TextEntry; TextEntry::make('name') ->helperText('Your full name here, including any middle names.')
该方法接收普通文本字符串,或者 Illuminate\Support\HtmlString
或 Illuminate\Contracts\Support\Htmlable
的实例。它允许你在帮助文本中渲染 HTML,甚至 markdown:
use Filament\Infolists\Components\TextEntry;use Illuminate\Support\HtmlString; TextEntry::make('name') ->helperText(new HtmlString('Your <strong>full name</strong> here, including any middle names.')) TextEntry::make('name') ->helperText(str('Your **full name** here, including any middle names.')->inlineMarkdown()->toHtmlString()) TextEntry::make('name') ->helperText(view('name-helper-text'))
在标签旁添加 Hint 提示
除了在 Entry 下添加帮助文本,你也可以在 Entry 的标签旁边添加提示(hint)。这对于展示 Entry 的额外信息,比如链接到帮助页面,非常有用。
使用 hint()
方法添加提示:
use Filament\Infolists\Components\TextEntry; TextEntry::make('apiKey') ->label('API key') ->hint('Documentation? What documentation?!')
该方法接收普通文本字符串,或者 Illuminate\Support\HtmlString
或 Illuminate\Contracts\Support\Htmlable
的实例。它允许你渲染 HTML,甚至 markdown:
use Filament\Infolists\Components\TextEntry; TextEntry::make('apiKey') ->label('API key') ->hint(new HtmlString('<a href="/documentation">Documentation</a>')) TextEntry::make('apiKey') ->label('API key') ->hint(str('[Documentation](/documentation)')->inlineMarkdown()->toHtmlString()) TextEntry::make('apiKey') ->label('API key') ->hint(view('api-key-hint'))
修改提示的文本颜色
你也可以修改提示(Hint)的文本颜色。默认为灰色,不过你也可以改成 danger
、info
、primary
、success
及 warning
:
use Filament\Infolists\Components\TextEntry; TextEntry::make('apiKey') ->label('API key') ->hint(str('[Documentation](/documentation)')->inlineMarkdown()->toHtmlString()) ->hintColor('primary')
在提示旁边添加图标
提示同样可以在其旁边渲染图标:
use Filament\Infolists\Components\TextEntry; TextEntry::make('apiKey') ->label('API key') ->hint(str('[Documentation](/documentation)')->inlineMarkdown()->toHtmlString()) ->hintIcon('heroicon-m-question-mark-circle')
添加 tooltip 到提示图标
此外,使用 hintIcon()
的 tooltip
参数,你可以添加一个鼠标悬停在图标时显示的 tooltip:
use Filament\Infolists\Components\TextEntry; TextEntry::make('apiKey') ->label('API key') ->hint(str('[Documentation](/documentation)')->inlineMarkdown()->toHtmlString()) ->hintIcon('heroicon-m-question-mark-circle', tooltip: 'Read it!')
隐藏 Entry
你可以使用 hidden()
或 visible()
方法,条件性地隐藏 Entry:
use Filament\Infolists\Components\TextEntry; TextEntry::make('role') ->hidden(! auth()->user()->isAdmin())// orTextEntry::make('role') ->visible(auth()->user()->isAdmin())
计算状态
有时候,你需要计算 Entry 的状态,而不是直接从数据库中对它进行读取。
将回调函数传入到 state()
方法,你可以自定义该 Entry 返回的状态:
Infolists\Components\TextEntry::make('amount_including_vat') ->state(function (Model $record): float { return $record->amount * (1 + $record->vat_rate); })
Tooltip
你可以指定鼠标悬停时显示的 tooltip:
use Filament\Infolists\Components\TextEntry; TextEntry::make('title') ->tooltip('Shown at the top of the page')
该方法也接受一个可以访问当前信息列表记录的闭包:
use Filament\Infolists\Components\TextEntry;use Illuminate\Database\Eloquent\Model; TextEntry::make('title') ->tooltip(fn (Model $record): string => "By {$record->author->name}")
自定义属性
传递数组给 extraAttributes()
,可以自定义 Entry 的 HTML:
use Filament\Infolists\Components\TextEntry; TextEntry::make('slug') ->extraAttributes(['class' => 'bg-gray-200'])
这些属性合并到该 Entry 的外层 </div>
中。
你也可以将额外的 HTML 属性传递给该 Entry 的包装器,其包装了标签、Entry 和其他文本:
use Filament\Infolists\Components\TextEntry; TextEntry::make('slug') ->extraEntryWrapperAttributes(['class' => 'entry-locked'])
全局设置
如果想全局修改所有 Entry 的默认行为,可以在服务提供者 boot()
方法中调用静态的 configureUsing()
方法,其中传入一个闭包以修改 Entry 行为。比如,如果想让所有的 TextEntry
组件设置为 word(10)
,你可以这样:
use Filament\Infolists\Components\TextEntry; TextEntry::configureUsing(function (TextEntry $entry): void { $entry ->words(10);});
当然,你仍然可以在各个 Entry 中单独重写该行为:
use Filament\Infolists\Components\TextEntry; TextEntry::make('name') ->words(null)
Edit on GitHubStill need help? Join our Discord community or open a GitHub discussion