Workflow
Auto Refresh
PLEASE WAIT: This page refreshes every 10 seconds.

This example demonstrates how to automatically reload the table at regular time interval.

The PowerGrid Table is displayed within the TableRefresher component's View

Learn more about the Auto-Refresh feature in our documentation.

Last Update: 22/10/2024 08:40:25 UTC
Index
ID
Name
Balance
Last Seen
1
29
Luan
R$ 241,86
43 minutes ago
2
57
Daniel
R$ 166,51
1 hour from now
3
93
Claudio
R$ 219,01
30 minutes from now
4
104
Vitor
R$ 44,28
58 minutes ago
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\AutoRefreshTable;
 
use Illuminate\Support\Carbon;
use Illuminate\Support\Collection;
use Illuminate\Support\Number;
use PowerComponents\LivewirePowerGrid\Column;
use PowerComponents\LivewirePowerGrid\Facades\PowerGrid;
use PowerComponents\LivewirePowerGrid\PowerGridComponent;
use PowerComponents\LivewirePowerGrid\PowerGridFields;
 
final class AutoRefreshTable extends PowerGridComponent
{
public string $tableName = 'auto-refresh-table';
 
public function setUp(): array
{
return [
PowerGrid::header()
->withoutLoading()
->includeViewOnTop('components.header.last-update'),
 
PowerGrid::footer()
->showPerPage()
->showRecordCount(),
];
}
 
public function datasource(): Collection
{
return collect([
[
'id' => 29,
'name' => 'Luan',
'balance' => 241.86,
'last_seen' => $this->_fakeLastSeen(),
],
[
'id' => 57,
'name' => 'Daniel',
'balance' => 166.51,
'last_seen' => $this->_fakeLastSeen(),
],
[
'id' => 93,
'name' => 'Claudio',
'balance' => 219.01,
'last_seen' => $this->_fakeLastSeen(),
],
[
'id' => 104,
'name' => 'Vitor',
'balance' => 44.28,
'last_seen' => $this->_fakeLastSeen(),
],
]);
}
 
public function fields(): PowerGridFields
{
return PowerGrid::fields()
->add('id')
->add('name')
->add('last_seen')
->add('balance', fn ($item) => Number::currency($item->balance, in: 'BRL', locale: 'pt-BR'));
}
 
public function columns(): array
{
return [
Column::make('Index', 'id')->index(),
 
Column::make('ID', 'id'),
 
Column::add()
->title('Name')
->field('name')
->searchable()
->sortable(),
 
Column::add()
->title('Balance')
->field('balance')
->sortable(),
 
Column::add()
->title('Last Seen')
->field('last_seen'),
];
}
 
// 😎 Populate the table with fake data
public function _fakeLastSeen(): string
{
return Carbon::parse(fake()->dateTimeBetween('-1 hour', '+2 hours'))->diffForHumans();
}
}
Code highlighting provided by Torchlight.dev