itm/sispace
itm/sispace
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: replace custom empty states with Filament empty-state components and improve code formatting in modals

Browse Source
This commit is contained in:
Yoga Pangestu 2026-03-30 08:46:05 +07:00
parent d09ef22945
commit 2d57ab4f0a
3 changed files with 32 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
resources/views/filament/resources/learning/class-sessions/assignments-modal.blade.php
View File

@ -1,12 +1,14 @@
<div class="space-y-4 py-2"> <div class="space-y-4 py-2">
@forelse($assignments as $assignment) @forelse($assignments as $assignment)
<div class="flex items-center justify-between p-3 rounded-lg border border-gray-100 dark:border-white/5 bg-gray-50/50 dark:bg-white/5 hover:bg-white dark:hover:bg-white/10 transition-colors shadow-sm"> <div
class="flex items-center justify-between p-3 rounded-lg border border-gray-100 dark:border-white/5 bg-gray-50/50 dark:bg-white/5 hover:bg-white dark:hover:bg-white/10 transition-colors shadow-sm">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<div class="p-2 rounded-lg bg-primary-100 dark:bg-primary-900/20 text-primary-600 dark:text-primary-400"> <div class="p-2 rounded-lg bg-primary-100 dark:bg-primary-900/20 text-primary-600 dark:text-primary-400">
<x-heroicon-o-pencil-square class="w-5 h-5" /> <x-heroicon-o-pencil-square class="w-5 h-5" />
</div> </div>
<div class="flex flex-col"> <div class="flex flex-col">
<span class="font-bold text-gray-900 dark:text-white leading-tight uppercase font-mono text-[11px] mb-0.5 tracking-tight text-primary-600/60 dark:text-primary-400/50 block"> <span
class="font-bold text-gray-900 dark:text-white leading-tight uppercase font-mono text-[11px] mb-0.5 tracking-tight text-primary-600/60 dark:text-primary-400/50 block">
{{ $assignment->type_label }} {{ $assignment->type_label }}
</span> </span>
<span class="font-bold text-gray-900 dark:text-white leading-tight">{{ $assignment->title }}</span> <span class="font-bold text-gray-900 dark:text-white leading-tight">{{ $assignment->title }}</span>
@ -19,18 +21,17 @@
</div> </div>
</div> </div>
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<a href="{{ \App\Filament\Resources\Learning\Assignments\AssignmentResource::getUrl('submit', ['record' => $assignment->id]) }}" <a href="{{ \App\Filament\Resources\Learning\Assignments\AssignmentResource::getUrl('submit', ['record' => $assignment->id]) }}"
wire:navigate wire:navigate
class="p-1.5 rounded-full hover:bg-gray-200 dark:hover:bg-white/10 text-gray-500 transition-colors" class="p-1.5 rounded-full hover:bg-gray-200 dark:hover:bg-white/10 text-gray-500 transition-colors"
title="Lihat Detail"> title="Lihat Detail">
<x-heroicon-o-chevron-right class="w-5 h-5" /> <x-heroicon-o-chevron-right class="w-5 h-5" />
</a> </a>
</div> </div>
</div> </div>
@empty @empty
<div class="flex flex-col items-center justify-center py-8 text-center bg-gray-50 dark:bg-white/5 rounded-xl border border-dashed border-gray-200 dark:border-white/10"> <x-filament::empty-state icon="heroicon-o-clipboard-document" heading="Tidak ada data yang ditemukan"
<x-heroicon-o-pencil-square class="w-12 h-12 text-gray-300 dark:text-gray-600" /> description="Belum ada tugas untuk sesi ini." iconColor="gray">
<p class="mt-2 text-sm font-medium text-gray-500 dark:text-gray-400">Belum ada tugas untuk sesi ini.</p> </x-filament::empty-state>
</div>
@endforelse @endforelse
</div> </div>

21
resources/views/filament/resources/learning/class-sessions/attendance-modal.blade.php
View File

@ -1,11 +1,11 @@
<div class="space-y-3"> <div class="space-y-3">
@if ($attendances->isEmpty()) @if ($attendances->isEmpty())
<div class="flex flex-col items-center justify-center py-8 text-center"> <x-filament::empty-state icon="heroicon-o-user-group" heading="Tidak ada data yang ditemukan"
<x-heroicon-o-user-group class="w-12 h-12 text-gray-400 mb-3" /> description="Belum ada mahasiswa yang melakukan presensi pada sesi ini." iconColor="gray">
<p class="text-sm text-gray-500 font-medium">Belum ada mahasiswa yang melakukan presensi pada sesi ini.</p> </x-filament::empty-state>
</div>
@else @else
<div class="fi-ta-content overflow-x-auto rounded-xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900"> <div
class="fi-ta-content overflow-x-auto rounded-xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900">
<table class="w-full text-sm text-left divider-y dark:divider-white/5"> <table class="w-full text-sm text-left divider-y dark:divider-white/5">
<thead class="bg-gray-50 dark:bg-white/5"> <thead class="bg-gray-50 dark:bg-white/5">
<tr> <tr>
@ -19,11 +19,14 @@
<td class="px-4 py-3 text-gray-950 dark:text-white font-medium"> <td class="px-4 py-3 text-gray-950 dark:text-white font-medium">
<div class="flex flex-col"> <div class="flex flex-col">
<span>{{ $attendance->student->full_name }}</span> <span>{{ $attendance->student->full_name }}</span>
<span class="text-[10px] text-gray-500 dark:text-gray-400 font-normal uppercase tabular-nums">NIM: {{ $attendance->student->student_number }}</span> <span
class="text-[10px] text-gray-500 dark:text-gray-400 font-normal uppercase tabular-nums">NIM:
{{ $attendance->student->student_number }}</span>
</div> </div>
</td> </td>
<td class="px-4 py-3 text-right"> <td class="px-4 py-3 text-right">
<span class="inline-flex items-center rounded-md bg-success-50 dark:bg-success-400/10 px-2 py-1 text-xs font-bold text-success-700 dark:text-success-400 ring-1 ring-inset ring-success-600/20 tabular-nums"> <span
class="inline-flex items-center rounded-md bg-success-50 dark:bg-success-400/10 px-2 py-1 text-xs font-bold text-success-700 dark:text-success-400 ring-1 ring-inset ring-success-600/20 tabular-nums">
{{ $attendance->attended_at->format('H:i') }} WIB {{ $attendance->attended_at->format('H:i') }} WIB
</span> </span>
</td> </td>
@ -34,7 +37,9 @@
</div> </div>
<div class="mt-4 flex items-center justify-between px-2"> <div class="mt-4 flex items-center justify-between px-2">
<p class="text-xs text-gray-500 font-medium"> <p class="text-xs text-gray-500 font-medium">
Total Kehadiran: <span class="text-primary-600 dark:text-primary-400 font-bold font-mono">{{ $attendances->count() }} Mahasiswa</span> Total Kehadiran: <span
class="text-primary-600 dark:text-primary-400 font-bold font-mono">{{ $attendances->count() }}
Mahasiswa</span>
</p> </p>
</div> </div>
@endif @endif

17
resources/views/filament/resources/learning/class-sessions/materials-modal.blade.php
View File

@ -1,6 +1,7 @@
<div class="space-y-4 py-2"> <div class="space-y-4 py-2">
@forelse($materials as $material) @forelse($materials as $material)
<div class="flex items-center justify-between p-3 rounded-lg border border-gray-100 dark:border-white/5 bg-gray-50/50 dark:bg-white/5 hover:bg-white dark:hover:bg-white/10 transition-colors shadow-sm"> <div
class="flex items-center justify-between p-3 rounded-lg border border-gray-100 dark:border-white/5 bg-gray-50/50 dark:bg-white/5 hover:bg-white dark:hover:bg-white/10 transition-colors shadow-sm">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<div class="p-2 rounded-lg bg-amber-100 dark:bg-amber-900/20 text-amber-600 dark:text-amber-400"> <div class="p-2 rounded-lg bg-amber-100 dark:bg-amber-900/20 text-amber-600 dark:text-amber-400">
<x-heroicon-o-document-text class="w-5 h-5" /> <x-heroicon-o-document-text class="w-5 h-5" />
@ -13,18 +14,16 @@
</div> </div>
</div> </div>
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<button type="button" <button type="button" wire:click="mountAction('viewMaterialDetail', { record: {{ $material->id }} })"
wire:click="mountAction('viewMaterialDetail', { record: {{ $material->id }} })" class="p-1.5 rounded-full hover:bg-gray-200 dark:hover:bg-white/10 text-gray-500 transition-colors"
class="p-1.5 rounded-full hover:bg-gray-200 dark:hover:bg-white/10 text-gray-500 transition-colors" title="Lihat Detail">
title="Lihat Detail">
<x-heroicon-o-chevron-right class="w-5 h-5" /> <x-heroicon-o-chevron-right class="w-5 h-5" />
</button> </button>
</div> </div>
</div> </div>
@empty @empty
<div class="flex flex-col items-center justify-center py-8 text-center bg-gray-50 dark:bg-white/5 rounded-xl border border-dashed border-gray-200 dark:border-white/10"> <x-filament::empty-state icon="heroicon-o-document-minus" heading="Tidak ada data yang ditemukan"
<x-heroicon-o-document-minus class="w-12 h-12 text-gray-300 dark:text-gray-600" /> description="Belum ada materi untuk sesi ini." iconColor="gray">
<p class="mt-2 text-sm font-medium text-gray-500 dark:text-gray-400">Belum ada materi untuk sesi ini.</p> </x-filament::empty-state>
</div>
@endforelse @endforelse
</div> </div>