hipszkij / nova-tabs
Laravel Nova - 标签页.
v2.2.6
2023-11-30 16:01 UTC
Requires
- php: ^7.4|^8
- ext-json: *
- laravel/nova: ^4.12
- nova-kit/nova-packages-tool: ^1.3
Requires (Dev)
- friendsofphp/php-cs-fixer: ^2
- orchestra/testbench: ^6
- roave/security-advisories: dev-latest
README
需求
php: ^7.4 | ^8
laravel/nova: ^4
对于Laravel Nova版本3,请使用nova-tabs v1。
安装
您可以通过composer将此包安装到使用Nova的Laravel应用中
composer require eminiarts/nova-tabs
使用
标签面板
您可以将资源的字段分组到标签页中。
// in app/Nova/Resource.php use Eminiarts\Tabs\Traits\HasTabs; use Eminiarts\Tabs\Tabs; use Eminiarts\Tabs\Tab; class User extends Resource { use HasTabs; public function fields(Request $request) { return [ Tabs::make('Some Title', [ Tab::make('Balance', [ Number::make('Balance', 'balance'), Number::make('Total', 'total'), ]), Tab::make('Other Info', [ Number::make('Paid To Date', 'paid_to_date') ]), ]), ]; } }
每个
关系标签页
这些有些过时,因为搜索和创建按钮现在显示在实际内容显示的下方面板中,而不是标签面板中。
// in app/Nova/Resource.php use Eminiarts\Tabs\Tabs; use Laravel\Nova\Fields\HasMany; use Eminiarts\Tabs\Traits\HasTabs; class User extends Resource { use HasTabs; public function fields(Request $request) { return [ Tabs::make('Relations', [ HasMany::make('Invoices'), HasMany::make('Notes'), HasMany::make('Contacts') ]), ]; } }
在标签页中合并字段和关系
use Eminiarts\Tabs\Tabs; use Laravel\Nova\Fields\HasMany; use Eminiarts\Tabs\Traits\HasTabs; use Laravel\Nova\Fields\ID; use Laravel\Nova\Fields\Text; class User extends Resource { use HasTabs; public function fields(Request $request) { return [ Tabs::make(__('Client Custom Details'), [ new Panel(__('Details'), [ ID::make('Id', 'id')->rules('required')->hideFromIndex(), Text::make('Name', 'name'), ]), HasMany::make('Invoices') ]), ]; } }
标签页中的操作
如果您的模型使用Laravel\Nova\Actions\Actionable
特性,您可以像这样将操作放入标签页中
// in app/Nova/Resource.php use Eminiarts\Tabs\Tabs; use Eminiarts\Tabs\Tab; use Eminiarts\Tabs\Traits\HasTabs; use Eminiarts\Tabs\Traits\HasActionsInTabs; // Add this Trait use Laravel\Nova\Actions\ActionResource; // Import the Resource class Client extends Resource { use HasTabs; use HasActionsInTabs; // Use this Trait public function fields(Request $request) { return [ Tabs::make('Client Custom Details', [ Tab::make('Address', [ ID::make('Id', 'id'), Text::make('Name', 'name')->hideFromDetail(), ]), Tab::make('Invoices', [ HasMany::make('Invoices'), ]), Tab::make('Actions', [ $this->actionfield(), // Add Actions whererver you like. ]), ]), ]; } }
编辑视图上的标签页
从Nova 4开始,标签页始终在编辑视图中显示。
标签对象
从v1.4.0版开始,可以使用Tab
类代替数组来表示您的标签。
自定义
显示超过5个项目
默认情况下,任何HasMany
、BelongsToMany
和MorphMany
字段在索引中显示5个项目。您可以使用Nova的内置静态属性$perPageViaRelationship
在相应的资源中显示更多(或更少)。
标签更改全局事件
Nova Tabs在标签加载和用户点击标签时发出事件,使用Nova Event Bus。开发人员可以监听名为nova-tabs-changed
的事件,该事件有两个参数作为负载:标签面板名称和标签名称本身。
订阅此事件的组件示例
export default { mounted () { Nova.$on('nova-tabs-changed', (panel, tab) => { if (panel === 'Client Details' && tab === 'address') { this.$nextTick(() => this.map.updateSize()) } }) } }
升级到2.0.0
- 破坏性变更
- 移除了selectFirstTab,第一个标签总是显示在第一位。
- 即使您有其他面板,标签也总是首先显示并具有工具栏。
- TabsOnEdit已消失,非关系标签将始终在编辑时显示。
- 我没有使用dusk,所以也没有检查它的测试,它们可能已经损坏。
- 添加了Eminiarts\Tabs Traits\HasTabs以覆盖Laravel\Nova\ResolveFields中的Nova 4默认面板方法。
- 将Eminiarts\Tabs\ActionsInTabs移动到Eminiarts\Tabs Traits\HasActionsInTabs。
- 添加了position方法到Tab以修复关系标签显示在最后的问题。
致谢
横幅是用https://banners.beyondco.de/创建的