change background color
Hi
I would like change the background color of each line of my table.
That's my code :
App\Enums\DemandeStatutEnums.php :
DemandeResource.php :
The problem is that its dosen't works when i use this color :
...
public static function getColorStatut(int $chiffre_statut = null) {
$classes = [
self::CREE => 'bg-red-100 dark:bg-red-800', // Rouge
self::A_TRAITER => 'bg-green-100 dark:bg-green-800', // Vert
self::VALIDE => 'bg-blue-100 dark:bg-blue-800', // Bleu
self::REJECTED => 'bg-yellow-100 dark:bg-yellow-800', // Or
self::PENDING => 'bg-purple-100 dark:bg-purple-800', // Violet
self::EN_COURS => 'bg-orange-100 dark:bg-orange-800', // Orange
self::PROGRAMME => 'bg-darkgreen-100 dark:bg-darkgreen-800', // Vert foncé
self::QUALIFIE => 'bg-yellow-200 dark:bg-yellow-700', // Jaune
self::RECEPTIONNE => 'bg-cyan-100 dark:bg-cyan-800', // Cyan
self::ARBITRE_ANNULE => 'bg-brown-100 dark:bg-brown-800', // Marron
self::LIQUIDE => 'bg-indigo-100 dark:bg-indigo-800', // Indigo
self::REPORTE => 'bg-gray-100 dark:bg-gray-800', // Gris
];
if ($chiffre_statut == null) return 'bg-black-100 dark:bg-black-600';
return $classes[$chiffre_statut] ?? 'bg-black-100 dark:bg-black-600';
}
...
...
public static function getColorStatut(int $chiffre_statut = null) {
$classes = [
self::CREE => 'bg-red-100 dark:bg-red-800', // Rouge
self::A_TRAITER => 'bg-green-100 dark:bg-green-800', // Vert
self::VALIDE => 'bg-blue-100 dark:bg-blue-800', // Bleu
self::REJECTED => 'bg-yellow-100 dark:bg-yellow-800', // Or
self::PENDING => 'bg-purple-100 dark:bg-purple-800', // Violet
self::EN_COURS => 'bg-orange-100 dark:bg-orange-800', // Orange
self::PROGRAMME => 'bg-darkgreen-100 dark:bg-darkgreen-800', // Vert foncé
self::QUALIFIE => 'bg-yellow-200 dark:bg-yellow-700', // Jaune
self::RECEPTIONNE => 'bg-cyan-100 dark:bg-cyan-800', // Cyan
self::ARBITRE_ANNULE => 'bg-brown-100 dark:bg-brown-800', // Marron
self::LIQUIDE => 'bg-indigo-100 dark:bg-indigo-800', // Indigo
self::REPORTE => 'bg-gray-100 dark:bg-gray-800', // Gris
];
if ($chiffre_statut == null) return 'bg-black-100 dark:bg-black-600';
return $classes[$chiffre_statut] ?? 'bg-black-100 dark:bg-black-600';
}
...
public static function table(Table $table): Table
{
return $table
->modifyQueryUsing(fn (Builder $query) => $query->where('retard', 1))
->recordClasses(function (Demande $record) {
return DemandeStatutEnum::getColorStatut($record->statut);
})
->columns([
...
public static function table(Table $table): Table
{
return $table
->modifyQueryUsing(fn (Builder $query) => $query->where('retard', 1))
->recordClasses(function (Demande $record) {
return DemandeStatutEnum::getColorStatut($record->statut);
})
->columns([
...
'bg-brown-100 dark:bg-brown-800'
or 'bg-darkgreen-100 dark:bg-darkgreen-800'
I use npm run build before look if it's works but i have the same result 😢1 Reply
and when i clone my project, at first I have to put this :
in my recordClasses(), run 'npm build' and after it's works
that normal ?
->recordClasses(function (Demande $record) {
$classes = [
"1" => 'bg-red-100 dark:bg-red-800', // Rouge
"2" => 'bg-green-100 dark:bg-green-800', // Vert
"3" => 'bg-blue-100 dark:bg-blue-800', // Bleu
"4" => 'bg-yellow-100 dark:bg-yellow-800', // Or
"5" => 'bg-purple-100 dark:bg-purple-800', // Violet
"6" => 'bg-orange-100 dark:bg-orange-800', // Orange
"7" => 'bg-darkgreen-100 dark:bg-darkgreen-800', // Vert foncé
"8" => 'bg-yellow-200 dark:bg-yellow-700', // Jaune
"9" => 'bg-cyan-100 dark:bg-cyan-800', // Cyan
"10" => 'bg-brown-100 dark:bg-brown-800', // Marron
"11" => 'bg-indigo-100 dark:bg-indigo-800', // Indigo
"12" => 'bg-gray-100 dark:bg-gray-800', // Gris
"13" => 'bg-black dark:bg-black', // noir
];
->recordClasses(function (Demande $record) {
$classes = [
"1" => 'bg-red-100 dark:bg-red-800', // Rouge
"2" => 'bg-green-100 dark:bg-green-800', // Vert
"3" => 'bg-blue-100 dark:bg-blue-800', // Bleu
"4" => 'bg-yellow-100 dark:bg-yellow-800', // Or
"5" => 'bg-purple-100 dark:bg-purple-800', // Violet
"6" => 'bg-orange-100 dark:bg-orange-800', // Orange
"7" => 'bg-darkgreen-100 dark:bg-darkgreen-800', // Vert foncé
"8" => 'bg-yellow-200 dark:bg-yellow-700', // Jaune
"9" => 'bg-cyan-100 dark:bg-cyan-800', // Cyan
"10" => 'bg-brown-100 dark:bg-brown-800', // Marron
"11" => 'bg-indigo-100 dark:bg-indigo-800', // Indigo
"12" => 'bg-gray-100 dark:bg-gray-800', // Gris
"13" => 'bg-black dark:bg-black', // noir
];