133 lines
8.2 KiB
PHP
133 lines
8.2 KiB
PHP
<x-app-layout>
|
|
<x-slot name="header">
|
|
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
|
|
{{ __('Kelola User') }}
|
|
</h2>
|
|
</x-slot>
|
|
|
|
<div class="py-12">
|
|
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
|
<div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
|
|
<div class="p-6">
|
|
<div class="flex justify-between items-center mb-6">
|
|
<h1 class="text-2xl font-bold text-gray-800">Daftar Pengguna</h1>
|
|
<!-- Tombol Tambah User -->
|
|
<div class="relative inline-block text-left">
|
|
<button id="dropdownUserButton" type="button"
|
|
class="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-slate-600 text-sm font-medium text-white hover:bg-slate-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-slate-500">
|
|
Tambah User
|
|
<svg class="-mr-1 ml-2 h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
|
|
<path fill-rule="evenodd"
|
|
d="M5.23 7.21a.75.75 0 011.06.02L10 10.94l3.71-3.71a.75.75 0 111.06 1.06l-4.24 4.25a.75.75 0 01-1.06 0L5.21 8.27a.75.75 0 01.02-1.06z"
|
|
clip-rule="evenodd" />
|
|
</svg>
|
|
</button>
|
|
|
|
<!-- Dropdown menu -->
|
|
<div id="dropdownUserMenu"
|
|
class="hidden absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none z-10">
|
|
<div class="py-1" role="menu" aria-orientation="vertical">
|
|
<a href="{{ route('users.create') }}"
|
|
class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100"
|
|
role="menuitem">Tambah Admin</a>
|
|
<a href="{{ route('gurus.create') }}"
|
|
class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100"
|
|
role="menuitem">Tambah Guru</a>
|
|
<a href="{{ route('santris.create') }}"
|
|
class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100"
|
|
role="menuitem">Tambah Santri</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Script toggle dropdown -->
|
|
<script>
|
|
document.getElementById('dropdownUserButton').addEventListener('click', function () {
|
|
const menu = document.getElementById('dropdownUserMenu');
|
|
menu.classList.toggle('hidden');
|
|
});
|
|
</script>
|
|
</div>
|
|
|
|
@if(session('success'))
|
|
<div class="alert-success mb-4">
|
|
{{ session('success') }}
|
|
</div>
|
|
@endif
|
|
|
|
@if(session('error'))
|
|
<div class="alert-danger mb-4">
|
|
{{ session('error') }}
|
|
</div>
|
|
@endif
|
|
|
|
<div class="overflow-x-auto">
|
|
<table class="table-auto w-full">
|
|
<thead class="bg-gray-50">
|
|
<tr>
|
|
<th
|
|
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
No</th>
|
|
<th
|
|
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
Nama</th>
|
|
<th
|
|
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
Username</th>
|
|
<th
|
|
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
Role</th>
|
|
<th
|
|
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
Aksi</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="bg-white divide-y divide-gray-200">
|
|
@forelse($users as $index => $user)
|
|
<tr class="hover:bg-gray-50">
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ $index + 1 }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ $user->name }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ $user->username }}
|
|
</td>
|
|
<td class="px-6 py-4 whitespace-nowrap">
|
|
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full
|
|
@if($user->role === 'admin') bg-red-100 text-red-800
|
|
@elseif($user->role === 'guru') bg-blue-100 text-blue-800
|
|
@else bg-green-100 text-green-800 @endif">
|
|
{{ ucfirst($user->role) }}
|
|
</span>
|
|
</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
|
|
<div class="flex space-x-2">
|
|
<a href="{{ route('users.edit', $user) }}"
|
|
class="btn-accent p-2 rounded-md hover:bg-accent-light">
|
|
<i class="fas fa-edit"></i>
|
|
</a>
|
|
@if($user->id !== auth()->id())
|
|
<form action="{{ route('users.destroy', $user) }}" method="POST"
|
|
class="inline"
|
|
onsubmit="return confirm('Yakin ingin menghapus user ini?')">
|
|
@csrf
|
|
@method('DELETE')
|
|
<button type="submit"
|
|
class="btn-danger p-2 rounded-md hover:bg-red-700">
|
|
<i class="fas fa-trash"></i>
|
|
</button>
|
|
</form>
|
|
@endif
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
@empty
|
|
<tr>
|
|
<td colspan="5" class="px-6 py-4 text-center text-gray-500">Tidak ada data user</td>
|
|
</tr>
|
|
@endforelse
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</x-app-layout> |