F
Filament16mo ago
Yuut4

filament-progress-column

GitHub
GitHub - ryangjchandler/filament-progress-column: Add a progress ba...
Add a progress bar column to your Filament tables. - GitHub - ryangjchandler/filament-progress-column: Add a progress bar column to your Filament tables.
15 Replies
Yuut4
Yuut4OP16mo ago
my code
public static function table(Table $table): Table
{
return $table
->columns([
Tables\Columns\TextColumn::make('name'),
Tables\Columns\TextColumn::make('Ofertas por usufruir')
->default(function ($record) {
return $record->offers->where('enjoyed', '!=', 1)->count();
})
->color(
fn ($record) => $record->offers->count() > 0 ? 'danger' : 'success'
),
ProgressColumn::make('progress')
->poll('5s')
->label(__('Progresso'))
->view('vendor.filament-progress-column.column')
->color('primary')
->progress(function ($record) {
$countedOffers = $record->offers->count();
$allOffers = $record->offers;
$enjoyed = 0;
foreach ($allOffers as $offer) {
if ($offer->enjoyed == 1) {
$enjoyed++;
}
}
/**
* format decimal cases
*/

return number_format(($enjoyed / $countedOffers) * 100, 2);
})
])
public static function table(Table $table): Table
{
return $table
->columns([
Tables\Columns\TextColumn::make('name'),
Tables\Columns\TextColumn::make('Ofertas por usufruir')
->default(function ($record) {
return $record->offers->where('enjoyed', '!=', 1)->count();
})
->color(
fn ($record) => $record->offers->count() > 0 ? 'danger' : 'success'
),
ProgressColumn::make('progress')
->poll('5s')
->label(__('Progresso'))
->view('vendor.filament-progress-column.column')
->color('primary')
->progress(function ($record) {
$countedOffers = $record->offers->count();
$allOffers = $record->offers;
$enjoyed = 0;
foreach ($allOffers as $offer) {
if ($offer->enjoyed == 1) {
$enjoyed++;
}
}
/**
* format decimal cases
*/

return number_format(($enjoyed / $countedOffers) * 100, 2);
})
])
LeandroFerreira
LeandroFerreira16mo ago
are you using admin panel? try to remove ->view
Yuut4
Yuut4OP16mo ago
Yes, and I already tried to remove it but apparently it doesn't work, I don't know what I'm doing wrong
Yuut4
Yuut4OP16mo ago
this is the default view
@php
$evaluatedColor = $getColor();
$color = match ($evaluatedColor) {
'primary' => 'bg-primary-600',
'secondary' => 'bg-secondary-600',
'danger' => 'bg-danger-600',
'success' => 'bg-success-600',
'warning' => 'bg-warning-600',
default => $evaluatedColor,
};

$progress = $getProgress();
$poll = $getPoll();
@endphp

<div class="filament-tables-progress-column" @if ($poll) wire:poll.{{ $poll }} @endif>
<div class="flex items-center space-x- 4px-4">
<div class="bg-gray-700 rounded-full h-2.5 dark:bg-gray-600 w-full">
<div @class(['h-2.5 rounded-full', $color]) style="width: {{ $progress }}%"></div>
</div>
<span class="text-sm text-gray-700 dark:text-gray-200">{{ $progress }}%</span>
</div>
</div>
@php
$evaluatedColor = $getColor();
$color = match ($evaluatedColor) {
'primary' => 'bg-primary-600',
'secondary' => 'bg-secondary-600',
'danger' => 'bg-danger-600',
'success' => 'bg-success-600',
'warning' => 'bg-warning-600',
default => $evaluatedColor,
};

$progress = $getProgress();
$poll = $getPoll();
@endphp

<div class="filament-tables-progress-column" @if ($poll) wire:poll.{{ $poll }} @endif>
<div class="flex items-center space-x- 4px-4">
<div class="bg-gray-700 rounded-full h-2.5 dark:bg-gray-600 w-full">
<div @class(['h-2.5 rounded-full', $color]) style="width: {{ $progress }}%"></div>
</div>
<span class="text-sm text-gray-700 dark:text-gray-200">{{ $progress }}%</span>
</div>
</div>
I'm not finding the stress at all ;_;
toeknee
toeknee16mo ago
Have you rebuilt your assets?
Yuut4
Yuut4OP16mo ago
rebuilt my assets never done that?
toeknee
toeknee16mo ago
Actually he logins a progress.css. Can you check that file is rendered?
Yuut4
Yuut4OP16mo ago
Where can I check that, if you can tell me? because until now I haven't touched the native css of the filament because it is in accordance with the intended
LeandroFerreira
LeandroFerreira16mo ago
run php artisan vendor:publish --tag="filament-progress-column-views"
Yuut4
Yuut4OP16mo ago
done
LeandroFerreira
LeandroFerreira16mo ago
add w-full
<div
class="filament-tables-progress-column w-full"
...
<div
class="filament-tables-progress-column w-full"
...
Yuut4
Yuut4OP16mo ago
php

@php
$evaluatedColor = $getColor();
$color = match ($evaluatedColor) {
'primary' => 'bg-primary-600',
'secondary' => 'bg-secondary-600',
'danger' => 'bg-danger-600',
'success' => 'bg-success-600',
'warning' => 'bg-warning-600',
default => $evaluatedColor
};

$progress = $getProgress();
$poll = $getPoll();
@endphp

<div
class="filament-tables-progress-column"
@if($poll)
wire:poll.{{ $poll }}
@endif
>
<div class="flex items-center space-x-4 px-4">
<div class="bg-gray-200 rounded-full h-2.5 dark:bg-gray-600 w-full">
<div @class([
'h-2.5 rounded-full',
$color,
]) style="width: {{ $progress }}%"></div>
</div>

<span class="text-sm text-gray-700 dark:text-gray-200">{{ $progress }}%</span>
</div>
</div>
php

@php
$evaluatedColor = $getColor();
$color = match ($evaluatedColor) {
'primary' => 'bg-primary-600',
'secondary' => 'bg-secondary-600',
'danger' => 'bg-danger-600',
'success' => 'bg-success-600',
'warning' => 'bg-warning-600',
default => $evaluatedColor
};

$progress = $getProgress();
$poll = $getPoll();
@endphp

<div
class="filament-tables-progress-column"
@if($poll)
wire:poll.{{ $poll }}
@endif
>
<div class="flex items-center space-x-4 px-4">
<div class="bg-gray-200 rounded-full h-2.5 dark:bg-gray-600 w-full">
<div @class([
'h-2.5 rounded-full',
$color,
]) style="width: {{ $progress }}%"></div>
</div>

<span class="text-sm text-gray-700 dark:text-gray-200">{{ $progress }}%</span>
</div>
</div>
like this ?
<div
class="filament-tables-progress-column w-full"
@if($poll)
wire:poll.{{ $poll }}
@endif
>
<div
class="filament-tables-progress-column w-full"
@if($poll)
wire:poll.{{ $poll }}
@endif
>
LeandroFerreira
LeandroFerreira16mo ago
yes
Yuut4
Yuut4OP16mo ago
thanks. I wasn't going to notice that detail so soon, my God.
Yuut4
Yuut4OP16mo ago
you are amazing thank you so much for your help, and for sharing knowledge.
Want results from more Discord servers?
Add your server