Skip to main content

Customers in a Draggable Kanban Board

Premium
6 min read

It is common to manage Customers in bulk or have an overview of where the Customer is progressing. For that, we can create a board like this:

In this lesson, we will do the following:

  • Create a Custom Page
  • Add a "kanban" style board to it
  • Allow the user to move customers between Pipeline Stages

Creating Custom Page - Our Customer Board

We will create a Custom Page using the Filament command:

php artisan make:filament-page ManageCustomerStages

This should create two files:

  • app/Filament/Pages/ManageCustomerStages.php - the page class
  • resources/views/filament/pages/manage-customer-stages.blade.php - the page view

We will begin with...

The Full Lesson is Only for Premium Members

Want to access all of our courses? (30 h 01 min)

You also get:

55 courses
Premium tutorials
Access to repositories
Private Discord
Get Premium for $129/year or $29/month

Already a member? Login here

Comments & Discussion

RA
Richard A. Hoyle ✓ Link copied!

Hello Please help us with the command to create the two files you are talking about! After entering the php artisan make:filament-page ManageCustomerStages We get two Questions that I for one don’t know what to enter do I enter “customer” No! Looking at the path you are giving us it looks like maybe, app or is it filament; no that did not work either. ‘either the Filament code has been updated or something else is wrong’. By you not giving us this type of guidance it makes it hard for us to follow along; ‘Please’ at least with things like this give us the guidance so we don’t have to guess.

M
Modestas ✓ Link copied!

Hi, if there are no parameters - pick default ones. Otherwise we try to add them as needed. We understand that it might be confusing so we prepare as much as we can (yet, we do sometimes miss small things).

In any case - this is correct, if we did not assign any parameters - leave them empty and press enter

RA
Richard A. Hoyle ✓ Link copied!

Ok I did just push enter and well; that worked thanks for the Quick come back.

IC
Ikaro Campos Laborda ✓ Link copied!

I have made a few modifications to the blade, because, for me, when the customer has already been rejected or accepted, it makes no sense to move the status to another position, so:

<?php
 
namespace App\Filament\Pages;
 
use App\Models\Customer;
use App\Models\PipelineStage;
use Filament\Notifications\Notification;
use Filament\Pages\Page;
use Illuminate\Support\Collection;
use Livewire\Attributes\On;
 
class ManageCustomerStages extends Page
{
// ...
#[On('statusChangeEvent')]
public function changeRecordStatus($id, $pipeline_stage_id): void
{
$customer = Customer::find($id);
 
if(!in_array($customer->pipeline_stage_id, [4,5])) {
$customer->pipeline_stage_id = $pipeline_stage_id;
$customer->save();
 
$customer->pipelineStageLogs()->create([
'pipeline_stage_id' => $pipeline_stage_id,
'notes' => null,
'user_id' => auth()->id()
]);
 
// Inform the user that the status has been updated
$customerName = $customer->first_name . ' ' . $customer->last_name;
 
Notification::make()
->title($customerName . ' Pipeline Stage Updated')
->success()
->send();
}else {
Notification::make()
->title('Error: You cannot change the status of this customer')
->danger()
->send();
}
 
}

anyway, it's just a suggestion.

We'd Love Your Feedback

Tell us what you like or what we can improve

Feel free to share anything you like or dislike about this page or the platform in general.