Filters Inline
This example enables Filters.
XLSX
Csv
ID
Dish
Calories
Category
Chef
Price
Diet
In Stock
Created At
|
ID
|
Dish
|
Calories
|
Category
|
Chef
|
Price
|
Diet
|
In Stock
|
Created At
|
---|---|---|---|---|---|---|---|---|---|
|
|
|
|
|
|
|
|
|
|
|
1
|
Arkansas Possum Pie
|
419 kcal
|
Garnish
|
|
R$ 243,39
|
🍽️ All diets
|
Out of Stock
|
06/07/2024
|
|
2
|
Albacore Tuna Melt
|
530 kcal
|
Pie
|
Vitor
|
R$ 63,11
|
🍽️ All diets
|
In Stock
|
03/07/2024
|
|
3
|
борщ
|
835 kcal
|
Soup
|
Dan
|
R$ 100,19
|
🍽️ All diets
|
In Stock
|
26/06/2024
|
|
4
|
Bacalhau com natas
|
560 kcal
|
Garnish
|
Dan
|
R$ 238,11
|
🍽️ All diets
|
In Stock
|
02/06/2024
|
|
5
|
Baba Ghanoush
|
750 kcal
|
Pasta
|
Vitor
|
R$ 143,09
|
🌱 Suitable for Vegans
|
Out of Stock
|
30/05/2024
|
|
6
|
Bacon Cheeseburger
|
579 kcal
|
Fish
|
|
R$ 257,39
|
🍽️ All diets
|
In Stock
|
13/06/2024
|
|
7
|
Baked potato
|
747 kcal
|
Garnish
|
|
R$ 171,89
|
🌱 Suitable for Vegans
|
Out of Stock
|
05/07/2024
|
|
8
|
Baklava
|
120 kcal
|
Dessert
|
|
R$ 143,46
|
🥜 Suitable for Celiacs
|
Out of Stock
|
14/07/2024
|
|
9
|
Bangers and mash
|
138 kcal
|
Dessert
|
Luan
|
R$ 253,72
|
🌱 Suitable for Vegans
|
Out of Stock
|
26/05/2024
|
|
10
|
Black Pudding
|
660 kcal
|
Pasta
|
Dan
|
R$ 248,73
|
🥜 Suitable for Celiacs
|
Out of Stock
|
10/07/2024
|
Disclaimer: Table data is randomly generated for
illustrative purposes only. The information here is not a reflection of the actual market and does
not constitute business, financial, or medical advice.
<?php namespace App\Livewire\Examples\FiltersInlineTable; use App\Enums\Diet;use App\Models\Category;use App\Models\Dish;use Illuminate\Database\Eloquent\Builder;use Illuminate\Support\Carbon;use Illuminate\Support\Number;use PowerComponents\LivewirePowerGrid\Column;use PowerComponents\LivewirePowerGrid\Exportable;use PowerComponents\LivewirePowerGrid\Facades\Filter;use PowerComponents\LivewirePowerGrid\Footer;use PowerComponents\LivewirePowerGrid\Header;use PowerComponents\LivewirePowerGrid\PowerGrid;use PowerComponents\LivewirePowerGrid\PowerGridComponent;use PowerComponents\LivewirePowerGrid\PowerGridFields;use PowerComponents\LivewirePowerGrid\Traits\WithExport; class FiltersInlineTable extends PowerGridComponent{ use WithExport; public int $categoryId = 0; protected function queryString() { return $this->powerGridQueryString(); } public function setUp(): array { $this->showCheckBox('id'); return [ Exportable::make('export') ->striped() ->columnWidth([ 2 => 30, ]) ->type(Exportable::TYPE_XLS, Exportable::TYPE_CSV), Header::make() ->showToggleColumns() ->withoutLoading() ->showSearchInput(), Footer::make() ->showPerPage() ->showRecordCount(), ]; } public function datasource(): Builder { return Dish::query() ->when( $this->categoryId, fn ($builder) => $builder->whereHas( 'category', fn ($builder) => $builder->where('category_id', $this->categoryId) ) ->with(['category', 'kitchen']) ); } public function relationSearch(): array { return [ 'category' => [ 'name', ], 'chef' => [ 'name', ], ]; } public function fields(): PowerGridFields { return PowerGrid::fields() ->add('id') ->add('name') ->add('storage_room') ->add('calories_formatted', fn ($dish) => $dish->calories . ' kcal') ->add('chef_name', fn ($dish) => e($dish->chef?->name)) ->add('category_id', fn ($dish) => intval($dish->category_id)) ->add('category_name', fn ($dish) => e($dish->category->name)) ->add('price') ->add('price_in_eur', fn ($dish) => Number::currency($dish->price, in: 'EUR', locale: 'pt_PT')) ->add('diet', fn ($dish) => Diet::from($dish->diet)->labels()) ->add('price_BRL', fn ($dish) => Number::currency($dish->price, in: 'BRL', locale: 'pt-BR')) ->add('in_stock') ->add('in_stock_label', fn ($entry) => $entry->in_stock ? 'In Stock' : 'Out of Stock') ->add('produced_at_formatted', fn ($dish) => Carbon::parse($dish->produced_at)) ->add('created_at_formatted', fn ($dish) => Carbon::parse($dish->created_at)->timezone('America/Sao_Paulo')->format('d/m/Y')); } public function columns(): array { return [ Column::make('ID', 'id') ->searchable() ->sortable(), Column::make('Dish', 'name') ->searchable() ->sortable(), Column::add() ->title('Calories') ->field('calories_formatted', 'calories') ->sortable(), Column::make('Category', 'category_name', 'category_id'), Column::make('Chef', 'chef_name') ->searchable(), Column::add() ->title('Price') ->field('price_BRL', 'price'), Column::make('Diet', 'diet', 'dishes.diet'), Column::make('In Stock', 'in_stock_label', 'in_stock'), Column::make('Created At', 'created_at_formatted', 'created_at') ->sortable(), ]; } public function filters(): array { return [ Filter::inputText('name')->placeholder('Dish Name'), Filter::boolean('in_stock', 'in_stock') ->label('In Stock', 'Out of Stock'), Filter::boolean('calories') ->label('🔥 Caloric', '🪶 Light') ->builder(function (Builder $query, string $value) { $q = match ($value) { default => ['operator' => '>=', 'calories' => 0], 'true' => ['operator' => '>=', 'calories' => 300], 'false' => ['operator' => '<', 'calories' => 300], }; return $query->where('calories', $q['operator'], $q['calories']); }), Filter::enumSelect('diet', 'dishes.diet') ->dataSource(Diet::cases()) ->optionLabel('dishes.diet'), Filter::select('category_name', 'category_id') ->dataSource(Category::all()) ->optionLabel('name') ->optionValue('id'), Filter::number('price_BRL', 'price') ->thousands('.') ->decimal(',') ->placeholder('lowest', 'highest'), Filter::datetimepicker('created_at_formatted', 'created_at') ->params([ 'timezone' => 'America/Sao_Paulo', ]), ]; }}
Code highlighting provided by Torchlight.dev
Here you can find all relevant packages installed on this demo.
Name
|
Version
|
Description
|
---|---|---|
laravel/framework
|
v11
|
The Laravel Framework.
|
livewire/livewire
|
v3.5.4
|
A front-end framework for Laravel.
|
openspout/openspout
|
v4.24.3
|
PHP Library to read and write spreadsheet files (CSV, XLSX and ODS), in a fast and scalable way
|
power-components/livewire-powergrid
|
5.x-dev
|
PowerGrid generates Advanced Datatables using Laravel Livewire.
|