Calculate Totals in the footer for a table component

How can calculate the total balance of the customers and show it in the footer .Note this table component is not being used in filament admin panel but rather a laravel project with livewire Also how can I add the view and edit actions onto this table component
No description
85 Replies
codeartisan
codeartisan5mo ago
No description
Hussain4real
Hussain4real5mo ago
Use Filament summarizer
codeartisan
codeartisan5mo ago
let me share my code
Hussain4real
Hussain4real5mo ago
and for the View and Edit, you just need to include them in the actions column Okay
codeartisan
codeartisan5mo ago
When I try to include the Actions I get an error
Hussain4real
Hussain4real5mo ago
your'e probably not importing the right action which column do you want total for? the code is not showing complete paste it instead of file upload use the tripple backtick to format
codeartisan
codeartisan5mo ago
php
php
codeartisan
codeartisan5mo ago
Is that better I want the view , delete ,show but I pass in my custom routes Also I want create Action and pass in my custom route name For the column I want to sum the balance
Hussain4real
Hussain4real5mo ago
use Filament\Tables\Columns\Summarizers\Sum;

TextColumn::make('balance')
->summarize([
Sum::make()
])
use Filament\Tables\Columns\Summarizers\Sum;

TextColumn::make('balance')
->summarize([
Sum::make()
])
for the actions, i can see your'e importing the wrong action use Filament\Tables\Actions\Action; then chain the ->url() to the action which will contain the custom route
codeartisan
codeartisan5mo ago
Class "App\Livewire\Tables\Actions\ViewAction" not found I get this error
codeartisan
codeartisan5mo ago
php
php
I dont know if am importing everything in the right way but thats what i have
Hussain4real
Hussain4real5mo ago
dont use ViewAction use normal Action since you will be using custom route something like this:
use Filament\Tables\Actions\Action;

Action::make('view')
->url(fn ($record) => route('customers.show', $record)),
use Filament\Tables\Actions\Action;

Action::make('view')
->url(fn ($record) => route('customers.show', $record)),
make sure you Implements HasActions trait and add: use InteractsWithActions;
codeartisan
codeartisan5mo ago
Now the header actions are not appearing But the rest are appearing
codeartisan
codeartisan5mo ago
No description
Hussain4real
Hussain4real5mo ago
did you add any headerAction?
codeartisan
codeartisan5mo ago
Yeah I added create
->headerActions([
Action::make('create')
->label('Add Customer')
->color('primary')
->url(route('customers.create')),
])
->headerActions([
Action::make('create')
->label('Add Customer')
->color('primary')
->url(route('customers.create')),
])
Hussain4real
Hussain4real5mo ago
check if you imported the right action
codeartisan
codeartisan5mo ago
am using use Filament\Tables\Actions\Action; probably i need to implement some trait
Hussain4real
Hussain4real5mo ago
this is from the docs:
use Filament\Actions\Action;

public function deleteAction(): Action
{
return Action::make('delete')
->requiresConfirmation()
->action(fn () => $this->post->delete());
}
use Filament\Actions\Action;

public function deleteAction(): Action
{
return Action::make('delete')
->requiresConfirmation()
->action(fn () => $this->post->delete());
}
then in ur view:
<div>
{{ $this->deleteAction }}
<x-filament-actions::modals />

{{ $this->table }}
</div>
<div>
{{ $this->deleteAction }}
<x-filament-actions::modals />

{{ $this->table }}
</div>
change yours to createAction(): Action
codeartisan
codeartisan5mo ago
let me try that
Hussain4real
Hussain4real5mo ago
Okay
codeartisan
codeartisan5mo ago
I see it but its color is not visible
public function createAction(): Action
{
return Action::make('create')
->label('Add Customer')
->color('primary')
->url(route('customers.create'));
}
public function createAction(): Action
{
return Action::make('create')
->label('Add Customer')
->color('primary')
->url(route('customers.create'));
}
it shows but its gray in color
Hussain4real
Hussain4real5mo ago
do you have a custom theme?
codeartisan
codeartisan5mo ago
no its just a tailwindcss template probably i add css classes
Hussain4real
Hussain4real5mo ago
if you add css it won't work, it will be stripped out. you need to create custom theme
codeartisan
codeartisan5mo ago
How do I do that then
codeartisan
codeartisan5mo ago
But am not using a their panel am just using a normal liveware and tailwindcss template
Hussain4real
Hussain4real5mo ago
did you install Filament Table package?
codeartisan
codeartisan5mo ago
Yeah I installed it
Hussain4real
Hussain4real5mo ago
then you need to create a custom theme also you need to tell Your AppServiceprovider the colors you will be using because currently Your Application is unaware of the primary color
codeartisan
codeartisan5mo ago
the problem am not so sure on how to do that
Hussain4real
Hussain4real5mo ago
in your AppServiceProvider in the boot method put this:
use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;

FilamentColor::register([
'danger' => Color::Red,
'gray' => Color::Gray,
'info' => Color::Blue,
'primary' => Color::Indigo,
'success' => Color::Green,
'warning' => Color::Amber,
]);
use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;

FilamentColor::register([
'danger' => Color::Red,
'gray' => Color::Gray,
'info' => Color::Blue,
'primary' => Color::Indigo,
'success' => Color::Green,
'warning' => Color::Amber,
]);
codeartisan
codeartisan5mo ago
ok am trying it
<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;

class AppServiceProvider extends ServiceProvider
{
/**
* Register any application services.
*/
public function register(): void
{
//
}

/**
* Bootstrap any application services.
*/
public function boot(): void
{
//
FilamentColor::register([
'danger' => Color::Red,
'gray' => Color::Gray,
'info' => Color::Blue,
'primary' => Color::Indigo,
'success' => Color::Green,
'warning' => Color::Amber,
]);
}
}
<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;

class AppServiceProvider extends ServiceProvider
{
/**
* Register any application services.
*/
public function register(): void
{
//
}

/**
* Bootstrap any application services.
*/
public function boot(): void
{
//
FilamentColor::register([
'danger' => Color::Red,
'gray' => Color::Gray,
'info' => Color::Blue,
'primary' => Color::Indigo,
'success' => Color::Green,
'warning' => Color::Amber,
]);
}
}
thats what i have dont But seems no change I have re-started the application
Hussain4real
Hussain4real5mo ago
recompile your assets
codeartisan
codeartisan5mo ago
npm run dev?
Hussain4real
Hussain4real5mo ago
yes
codeartisan
codeartisan5mo ago
There was change *no change
Hussain4real
Hussain4real5mo ago
Hmm create a custom theme and style it from there
codeartisan
codeartisan5mo ago
i have created now
Hussain4real
Hussain4real5mo ago
style the action button there
codeartisan
codeartisan5mo ago
example please
Hussain4real
Hussain4real5mo ago
in your new theme.css style the button action there, you will need to look for the class name in your inspect console i think the name is .fi-btn style that class like this:
.fi-btn{
@apply bg-purple-600;
}
.fi-btn{
@apply bg-purple-600;
}
codeartisan
codeartisan5mo ago
Sorry to take you back but it seems the create custom theme didnot work as expected
No description
Hussain4real
Hussain4real5mo ago
i guess because you don't have a panel just try styling the action like how you will style a button you could wrap a div around it then style that div and see
codeartisan
codeartisan5mo ago
okay then
Hussain4real
Hussain4real5mo ago
we could get on a call if possible
codeartisan
codeartisan5mo ago
Yeah its okay I set up google meets?
codeartisan
codeartisan5mo ago
Meet
Real-time meetings by Google. Using your browser, share your video, desktop, and presentations with teammates and customers.
Hussain4real
Hussain4real5mo ago
not now in an hour, 45 minutes time
codeartisan
codeartisan5mo ago
ok no worries Hey @Hussain4real are you available now
Hussain4real
Hussain4real5mo ago
no have a meeting in 15 minutes
codeartisan
codeartisan5mo ago
okay please
Hussain4real
Hussain4real5mo ago
I mean i have a meeting to attend now will let you know once i'm through
codeartisan
codeartisan5mo ago
okay then hey @Hussain4real
Hussain4real
Hussain4real5mo ago
Sorry mate, still in the meeting
codeartisan
codeartisan5mo ago
ok no worries
Hussain4real
Hussain4real5mo ago
Will be through 15 minutes probably
codeartisan
codeartisan5mo ago
ok no problem
Hussain4real
Hussain4real5mo ago
I'm ready if you are
codeartisan
codeartisan5mo ago
am around
codeartisan
codeartisan5mo ago
Meet
Real-time meetings by Google. Using your browser, share your video, desktop, and presentations with teammates and customers.
Hussain4real
Hussain4real5mo ago
i'm waiting to be let in i can't hear you
codeartisan
codeartisan5mo ago
thank you so much
Hussain4real
Hussain4real5mo ago
my pleasure mate
codeartisan
codeartisan5mo ago
When your free please let me know for some reason export has only cancel button
codeartisan
codeartisan5mo ago
No description
codeartisan
codeartisan5mo ago
@Hussain4real are you available sir
Hussain4real
Hussain4real5mo ago
Okay, will let you know
codeartisan
codeartisan5mo ago
let me wait then helo
Hussain4real
Hussain4real5mo ago
Hi Had a busy day
codeartisan
codeartisan4mo ago
a good morning we can do today hello @Hussain4real
Hussain4real
Hussain4real4mo ago
Hi If you're free
codeartisan
codeartisan4mo ago
am available right now let me share google meet
codeartisan
codeartisan4mo ago
Meet
Real-time meetings by Google. Using your browser, share your video, desktop, and presentations with teammates and customers.
codeartisan
codeartisan4mo ago
Thank you so much it has worked
Hussain4real
Hussain4real4mo ago
my pleasure mate!
codeartisan
codeartisan4mo ago
a good morning I just have one more issue which is to change the filter positions on the table
use Filament\Tables\Filters\Layout;

protected function getTableFiltersLayout(): ?string
{
return Layout::AboveContent;
}
use Filament\Tables\Filters\Layout;

protected function getTableFiltersLayout(): ?string
{
return Layout::AboveContent;
}
does not seem to work with livewire
Hussain4real
Hussain4real4mo ago
you probably need to include the trait Morning
codeartisan
codeartisan4mo ago
I cannot find the trait name
Hussain4real
Hussain4real4mo ago
import this
use Filament\Tables\Concerns\HasFilters;

add this trait
use HasFilters;
import this
use Filament\Tables\Concerns\HasFilters;

add this trait
use HasFilters;
codeartisan
codeartisan4mo ago
->filters([..], FiltersLayout::AboveContent)
->filters([..], FiltersLayout::AboveContent)
->filters([..], FiltersLayout::AboveContent)
That works ok thank you so much for the help
Hussain4real
Hussain4real4mo ago
my pleasure
Want results from more Discord servers?
Add your server
More Posts