si-klinik/sk-klinik.my.id/resources/views/livewire/admin/permission-manager.blade.php

99 lines
4.3 KiB
PHP

<div class="mx-auto">
<div class="flex justify-between items-center mb-8">
<div>
<flux:heading size="xl">Master Permission</flux:heading>
<flux:subheading>Daftar seluruh hak akses yang tersedia di dalam sistem.</flux:subheading>
</div>
<div class="flex gap-2">
<flux:button href="{{ route('admin.roles') }}" variant="ghost" icon="arrow-left" wire:navigate>Kembali ke Role</flux:button>
<flux:button wire:click="create" variant="primary" icon="plus">Tambah Permission</flux:button>
</div>
</div>
{{-- Filter & Pencarian --}}
<div class="flex gap-4 mb-4">
<div class="flex-1">
<flux:input wire:model.live.debounce.300ms="search" placeholder="Cari nama permission..." icon="magnifying-glass" />
</div>
</div>
{{-- Tabel Permissions --}}
<flux:table>
<flux:table.columns>
<flux:table.column>Nama Permission</flux:table.column>
<flux:table.column>Guard</flux:table.column>
<flux:table.column>Dibuat Pada</flux:table.column>
<flux:table.column align="end">Aksi</flux:table.column>
</flux:table.columns>
<flux:table.rows>
@forelse ($permissions as $permission)
<flux:table.row :key="$permission->id">
<flux:table.cell class="font-medium text-zinc-800 dark:text-white">
<code class="text-indigo-600 dark:text-indigo-400">{{ $permission->name }}</code>
</flux:table.cell>
<flux:table.cell>
<flux:badge size="sm">{{ $permission->guard_name }}</flux:badge>
</flux:table.cell>
<flux:table.cell>{{ $permission->created_at->translatedFormat('d F Y') }}</flux:table.cell>
<flux:table.cell align="end">
<div class="flex justify-end gap-2">
<flux:button wire:click="edit({{ $permission->id }})" variant="ghost" icon="pencil-square" size="sm" />
<flux:button type="button" x-on:click="confirmDelete({{ $permission->id }}, '{{ $permission->name }}')" variant="ghost" icon="trash" size="sm" class="text-red-500" />
</div>
</flux:table.cell>
</flux:table.row>
@empty
<flux:table.row>
<flux:table.cell colspan="4" class="py-10 text-zinc-400 text-center">
Data permission tidak ditemukan.
</flux:table.cell>
</flux:table.row>
@endforelse
</flux:table.rows>
</flux:table>
<div class="mt-4">
<flux:pagination :paginator="$permissions" />
</div>
{{-- Modal Input --}}
<flux:modal wire:model="isModalOpen" class="min-w-[450px]">
<form wire:submit.prevent="save" class="space-y-6">
<div>
<flux:heading size="lg">{{ $permissionId ? 'Ubah Permission' : 'Permission Baru' }}</flux:heading>
<flux:subheading>Gunakan format kebab-case (contoh: user-create, edit-post).</flux:subheading>
</div>
<flux:input wire:model="name" label="Nama Permission" placeholder="contoh: manage-users" autofocus />
<div class="flex justify-end space-x-2">
<flux:button x-on:click="$wire.isModalOpen = false" variant="ghost">Batal</flux:button>
<flux:button type="submit" variant="primary">Simpan</flux:button>
</div>
</form>
</flux:modal>
</div>
@script
<script>
window.confirmDelete = function(id, name) {
Swal.fire({
title: 'Hapus Permission?',
text: `Menghapus "${name}" dapat menyebabkan fitur terkait tidak bisa diakses!`,
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#ef4444',
cancelButtonColor: '#71717a',
confirmButtonText: 'Ya, Hapus!',
cancelButtonText: 'Batal',
reverseButtons: true
}).then((result) => {
if (result.isConfirmed) {
$wire.delete(id);
}
});
}
</script>
@endscript