mirror of
https://github.com/pelican-dev/panel.git
synced 2025-05-28 08:04:45 +02:00
Update health page with tailwind classes (#893)
* update health page with tailwind classes * Move php from Blade to Page --------- Co-authored-by: RMartinOscar <40749467+RMartinOscar@users.noreply.github.com>
This commit is contained in:
Boy132
GitHub
parent
a7a7c5ba4d
commit
9cfd87090f
@ -8,6 +8,7 @@ use Filament\Notifications\Notification;
|
||||
use Filament\Pages\Page;
|
||||
use Illuminate\Support\Facades\Artisan;
|
||||
use Spatie\Health\Commands\RunHealthChecksCommand;
|
||||
use Spatie\Health\Enums\Status;
|
||||
use Spatie\Health\ResultStores\ResultStore;
|
||||
|
||||
class Health extends Page
|
||||
@ -122,4 +123,37 @@ class Health extends Page
|
||||
|
||||
return $results->containsFailingCheck() ? 'tabler-heart-exclamation' : 'tabler-heart-check';
|
||||
}
|
||||
|
||||
public function backgroundColor(string $str): string
|
||||
{
|
||||
return match ($str) {
|
||||
Status::ok()->value => 'bg-success-100 dark:bg-success-200',
|
||||
Status::warning()->value => 'bg-warning-100 dark:bg-warning-200',
|
||||
Status::skipped()->value => 'bg-info-100 dark:bg-info-200',
|
||||
Status::failed()->value, Status::crashed()->value => 'bg-danger-100 dark:bg-danger-200',
|
||||
default => 'bg-gray-100 dark:bg-gray-200'
|
||||
};
|
||||
}
|
||||
|
||||
public function iconColor(string $str): string
|
||||
{
|
||||
return match ($str) {
|
||||
Status::ok()->value => 'text-success-500 dark:text-success-600',
|
||||
Status::warning()->value => 'text-warning-500 dark:text-warning-600',
|
||||
Status::skipped()->value => 'text-info-500 dark:text-info-600',
|
||||
Status::failed()->value, Status::crashed()->value => 'text-danger-500 dark:text-danger-600',
|
||||
default => 'text-gray-500 dark:text-gray-600'
|
||||
};
|
||||
}
|
||||
|
||||
public function icon(string $str): string
|
||||
{
|
||||
return match ($str) {
|
||||
Status::ok()->value => 'tabler-circle-check',
|
||||
Status::warning()->value => 'tabler-exclamation-circle',
|
||||
Status::skipped()->value => 'tabler-circle-chevron-right',
|
||||
Status::failed()->value, Status::crashed()->value => 'tabler-circle-x',
|
||||
default => 'tabler-help-circle'
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,70 +1,30 @@
|
||||
@php
|
||||
if(! function_exists('backgroundColor')) {
|
||||
function backgroundColor($status) {
|
||||
return match ($status) {
|
||||
Spatie\Health\Enums\Status::ok()->value => 'background-color: rgb(209 250 229);', // bg-emerald-100
|
||||
Spatie\Health\Enums\Status::warning()->value => 'background-color: rgb(254 249 195);', // bg-yellow-100
|
||||
Spatie\Health\Enums\Status::skipped()->value => 'background-color: rgb(219 234 254);', // bg-blue-100
|
||||
Spatie\Health\Enums\Status::failed()->value, Spatie\Health\Enums\Status::crashed()->value => 'background-color: rgb(254 226 226);', // bg-red-100
|
||||
default => 'background-color: rgb(243 244 246);' // bg-gray-100
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
if(! function_exists('iconColor')) {
|
||||
function iconColor($status)
|
||||
{
|
||||
return match ($status) {
|
||||
Spatie\Health\Enums\Status::ok()->value => 'color: rgb(16 185 129);', // text-emerald-500
|
||||
Spatie\Health\Enums\Status::warning()->value => 'color: rgb(234 179 8);', // text-yellow-500
|
||||
Spatie\Health\Enums\Status::skipped()->value => 'color: rgb(59 130 246);', // text-blue-500
|
||||
Spatie\Health\Enums\Status::failed()->value, Spatie\Health\Enums\Status::crashed()->value => 'color: rgb(239 68 68);', // text-red-500
|
||||
default => 'color: rgb(107 114 128);' // text-gray-500
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
if(! function_exists('icon')) {
|
||||
function icon($status)
|
||||
{
|
||||
return match ($status) {
|
||||
Spatie\Health\Enums\Status::ok()->value => 'tabler-circle-check',
|
||||
Spatie\Health\Enums\Status::warning()->value => 'tabler-exclamation-circle',
|
||||
Spatie\Health\Enums\Status::skipped()->value => 'tabler-circle-chevron-right',
|
||||
Spatie\Health\Enums\Status::failed()->value, Spatie\Health\Enums\Status::crashed()->value => 'tabler-circle-x',
|
||||
default => 'tabler-help-circle'
|
||||
};
|
||||
}
|
||||
}
|
||||
@endphp
|
||||
|
||||
<x-filament-panels::page>
|
||||
@if (count($checkResults?->storedCheckResults ?? []))
|
||||
<x-filament::grid default="1" sm="2" class="gap-6 mb-5">
|
||||
@foreach ($checkResults->storedCheckResults as $result)
|
||||
<div class="flex items-start px-4 space-x-2 overflow-hidden py-5 text-opacity-0 transition transform bg-white shadow-md shadow-gray-200 dark:shadow-black/25 dark:shadow-md dark:bg-gray-800 rounded-xl sm:p-6 md:space-x-3 md:min-h-[130px] dark:border-t dark:border-gray-700">
|
||||
<div class="flex justify-center items-center rounded-full p-2" style="margin-right: 0.5rem; {{ backgroundColor($result->status) }}">
|
||||
<x-filament::icon icon="{{ icon($result->status) }}" class="h-6 w-6" style="{{ iconColor($result->status) }}" />
|
||||
</div>
|
||||
<div>
|
||||
<dd class="-mt-1 font-bold md:mt-1 md:text-xl" style="color: light-dark(rgb(17 24 39), rgb(255 255 255));">
|
||||
{{ $result->label }}
|
||||
</dd>
|
||||
<dt class="mt-0 text-sm font-medium md:mt-1" style="color: light-dark(rgb(75 85 99), rgb(209 213 219));">
|
||||
@if (!empty($result->notificationMessage))
|
||||
{{ $result->notificationMessage }}
|
||||
@else
|
||||
{{ $result->shortSummary }}
|
||||
@endif
|
||||
</dt>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</x-filament::grid>
|
||||
<x-filament::grid default="1" sm="2" class="gap-6 mb-5">
|
||||
@foreach ($checkResults->storedCheckResults as $result)
|
||||
<div class="flex items-start px-4 py-5 space-x-2 md:space-x-3 overflow-hidden shadow-lg rounded-xl bg-white dark:bg-gray-900 ring-1 ring-gray-950/5 dark:ring-white/10 sm:p-6">
|
||||
<div class="flex justify-center items-center rounded-full p-2 mr-2 {{ $this->backgroundColor($result->status) }}">
|
||||
<x-filament::icon icon="{{ $this->icon($result->status) }}" class="h-6 w-6 {{ $this->iconColor($result->status) }}" />
|
||||
</div>
|
||||
<div>
|
||||
<dd class="-mt-1 font-bold md:mt-1 md:text-xl text-gray-900 dark:text-white">
|
||||
{{ $result->label }}
|
||||
</dd>
|
||||
<dt class="mt-0 text-sm font-medium md:mt-1 text-gray-600 dark:text-gray-300">
|
||||
@if (!empty($result->notificationMessage))
|
||||
{{ $result->notificationMessage }}
|
||||
@else
|
||||
{{ $result->shortSummary }}
|
||||
@endif
|
||||
</dt>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</x-filament::grid>
|
||||
@endif
|
||||
|
||||
@if ($lastRanAt)
|
||||
<div class="text-md text-center font-medium" style="{{ $lastRanAt->diffInMinutes() > 5 ? 'color: rgb(239 68 68);' : 'color: light-dark(rgb(156 163 175), rgb(229 231 235));' }}">
|
||||
<div class="text-md text-center font-medium {{ $lastRanAt->diffInMinutes() > 5 ? 'text-red-500 dark:text-red-400' : 'text-gray-400 dark:text-gray-200' }}">
|
||||
Check results from {{ $lastRanAt->diffForHumans() }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user