PHP code example of gsferro / filament-odometer-easy
1. Go to this page and download the library: Download gsferro/filament-odometer-easy library. Choose the download type require.
2. Extract the ZIP file and open the index.php.
3. Add this code to the index.php.
<?php
require_once('vendor/autoload.php');
/* Start to develop here. Best regards https://php-download.com/ */
gsferro / filament-odometer-easy example snippets
use Gsferro\FilamentOdometerEasy\FilamentOdometerEasyPlugin;
public function panel(Panel $panel): Panel
{
return $panel
// ...
->plugin(FilamentOdometerEasyPlugin::make());
}
use Gsferro\FilamentOdometerEasy\Tables\Columns\OdometerColumn;
OdometerColumn::make('total_vendas')
->label('Total de vendas')
->sortable(),
use Gsferro\FilamentOdometerEasy\Infolists\Components\OdometerEntry;
OdometerEntry::make('total_vendas')
->label('Total de vendas'),
use Gsferro\FilamentOdometerEasy\Widgets\OdometerStat;
protected function getStats(): array
{
return [
OdometerStat::make('Total de vendas', Venda::count())
->description('Últimos 30 dias')
->descriptionIcon('heroicon-m-arrow-trending-up')
->color('success'),
];
}
use Gsferro\FilamentOdometerEasy\Navigation\OdometerNavigationBadge;
// no Resource (ou Page)
public static function getNavigationBadge(): ?string
{
return OdometerNavigationBadge::make(static::getModel()::count());
}
// ou em um NavigationItem customizado
NavigationItem::make('Vendas')
->badge(fn (): string => OdometerNavigationBadge::make(Venda::count())),
// app/Providers/Filament/AdminPanelProvider.php
public function panel(Panel $panel): Panel
{
return $panel
->id('admin')
->path('admin')
// 1. pré-requisito: sem sidebar recolhível não existe o estado a corrigir
->sidebarCollapsibleOnDesktop()
->plugin(
FilamentOdometerEasyPlugin::make()
// 2. mantém o badge visível quando ela recolhe
->badgeOnCollapsedSidebar()
);
}
use Gsferro\FilamentOdometerEasy\Facades\FilamentOdometerEasy;
// driver configurado (number-flow por padrão)
FilamentOdometerEasy::render(1500);
// forçando um driver pontualmente
FilamentOdometerEasy::renderNumberFlow(1500, format: ['style' => 'currency', 'currency' => 'BRL']);
FilamentOdometerEasy::renderOdometer(1500, format: '(.ddd),dd', class: 'h3');
FilamentOdometerEasyPlugin::make()
->locales('pt-BR') // number-flow: 1.000,00
->format(['style' => 'currency', 'currency' => 'BRL']) // padrão global
->delay(500) // ms antes da animação inicial (0 → valor)
->duration(1500) // velocidade da animação em ms (padrão ~900ms)
->badgeOnCollapsedSidebar(), // badge do menu visível com a sidebar recolhida
FilamentOdometerEasyPlugin::make()
->driver('odometer')
->theme('digital') // default, car, digital, minimal, plaza, slot-machine, train-station
->format('(.ddd),dd') // data-format padrão
->jquery(enabled: false), // quando a aplicação já carrega o jQuery
return [
// number-flow (padrão) | odometer
'driver' => 'number-flow',
// mantém o navigation badge visível com a sidebar recolhida no desktop
'badge-on-collapsed-sidebar' => false,
'number-flow' => [
'locales' => null, // ex.: 'pt-BR'; null usa o locale do navegador
'format' => null, // ex.: ['style' => 'currency', 'currency' => 'BRL']
'delay' => 500, // ms antes da animação inicial: exibe 0 e anima até o valor
'duration' => null, // velocidade da animação em ms; null usa o padrão (~900ms)
],
'odometer' => [
'theme' => 'default',
'format' => null, // ex.: '(.ddd),dd'; null usa o padrão (pt-BR: 1.000,00)
'jquery' => [
'enabled' => true,
'src' => 'https://code.jquery.com/jquery-4.0.0.min.js',
'integrity' => 'sha256-OaVG6prZf4v69dPg6PhVattBXkcOWQB62pdZ3ORyrao=',
],
],
];