196 lines
13 KiB
PHP
196 lines
13 KiB
PHP
<x-app-layout>
|
|
<x-slot name="header">
|
|
<div class="flex items-center justify-between">
|
|
<h2 class="font-semibold text-xl text-gray-800 dark:text-white leading-tight">
|
|
{{ __('Lista użytkowników') }}
|
|
</h2>
|
|
|
|
@hasanyrole('admin|kierownik')
|
|
<div class="flex items-center gap-3">
|
|
<a href="{{ route('users.deleted') }}"
|
|
class="inline-flex items-center px-4 py-2 bg-gray-200 dark:bg-gray-700 hover:bg-gray-300 dark:hover:bg-gray-600 text-gray-800 dark:text-white text-sm font-medium rounded-md shadow-sm transition ease-in-out duration-150 gap-2">
|
|
<span>{{ __('Użytkownicy usunięci') }}</span>
|
|
</a>
|
|
|
|
<a href="{{ route('users.create') }}"
|
|
class="inline-flex items-center px-4 py-2 bg-indigo-600 hover:bg-indigo-500 text-white text-sm font-medium rounded-md shadow-sm transition ease-in-out duration-150 gap-2">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4" />
|
|
</svg>
|
|
<span>{{ __('Dodaj użytkownika') }}</span>
|
|
</a>
|
|
</div>
|
|
@endhasanyrole
|
|
</div>
|
|
</x-slot>
|
|
|
|
<style>
|
|
.custom-table-row:hover {
|
|
background-color: rgba(0, 0, 0, 0.03) !important;
|
|
}
|
|
.dark .custom-table-row:hover {
|
|
background-color: rgba(255, 255, 255, 0.05) !important;
|
|
}
|
|
.role-badge {
|
|
display: inline-block !important;
|
|
padding: 6px 20px !important;
|
|
min-width: 120px !important;
|
|
text-align: center !important;
|
|
border-radius: 6px !important;
|
|
}
|
|
</style>
|
|
|
|
<div class="py-12">
|
|
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
|
|
<div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg border border-gray-200 dark:border-gray-700/50">
|
|
<div class="p-6 text-gray-900 dark:text-white">
|
|
|
|
{{-- Formularz Wyszukiwania --}}
|
|
<div class="mb-6 flex items-center justify-between gap-4">
|
|
<form method="GET" action="{{ route('users.index') }}" class="flex items-center gap-2 w-full max-w-xs">
|
|
{{-- Zachowanie bieżącego sortowania podczas wyszukiwania --}}
|
|
@if(request('sort'))
|
|
<input type="hidden" name="sort" value="{{ request('sort') }}">
|
|
@endif
|
|
@if(request('direction'))
|
|
<input type="hidden" name="direction" value="{{ request('direction') }}">
|
|
@endif
|
|
|
|
<div class="w-full">
|
|
<x-text-input
|
|
type="text"
|
|
name="search"
|
|
:value="request('search')"
|
|
placeholder="Szukaj po imieniu, nazwisku lub e-mailu..."
|
|
class="block w-full px-3 py-2 text-sm"
|
|
/>
|
|
</div>
|
|
|
|
<x-primary-button type="submit">
|
|
Szukaj
|
|
</x-primary-button>
|
|
|
|
@if(request('search'))
|
|
<a href="{{ route('users.index', request()->only(['sort', 'direction'])) }}"
|
|
class="inline-flex items-center px-4 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-md font-semibold text-xs text-gray-700 dark:text-gray-300 uppercase tracking-widest shadow-sm hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition ease-in-out duration-150 whitespace-nowrap">
|
|
Wyczyść
|
|
</a>
|
|
@endif
|
|
</form>
|
|
</div>
|
|
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full border-collapse" style="table-layout: fixed;">
|
|
<thead>
|
|
<tr class="border-b border-gray-200 dark:border-gray-700 text-xs font-semibold uppercase tracking-wider text-gray-500 dark:text-gray-300">
|
|
|
|
@php
|
|
$currentSort = request('sort');
|
|
$currentDir = request('direction', 'asc');
|
|
|
|
$nextDirName = ($currentSort === 'name' && $currentDir === 'asc') ? 'desc' : 'asc';
|
|
$nextDirEmail = ($currentSort === 'email' && $currentDir === 'asc') ? 'desc' : 'asc';
|
|
@endphp
|
|
|
|
{{-- Imię i nazwisko --}}
|
|
<th scope="col" class="py-3.5 px-4" style="text-align: center !important; width: 25%;">
|
|
<a href="{{ route('users.index', array_merge(request()->query(), ['sort' => 'name', 'direction' => $nextDirName])) }}"
|
|
class="inline-flex items-center gap-1 hover:text-gray-700 dark:hover:text-white transition">
|
|
<span>Imię i nazwisko</span>
|
|
@if($currentSort === 'name')
|
|
<svg class="w-4 h-4 text-indigo-600 dark:text-indigo-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="{{ $currentDir === 'asc' ? 'M19 9l-7 7-7-7' : 'M5 15l7-7 7 7' }}" />
|
|
</svg>
|
|
@endif
|
|
</a>
|
|
</th>
|
|
|
|
{{-- Adres e-mail --}}
|
|
<th scope="col" class="py-3.5 px-4" style="text-align: center !important; width: 35%;">
|
|
<a href="{{ route('users.index', array_merge(request()->query(), ['sort' => 'email', 'direction' => $nextDirEmail])) }}"
|
|
class="inline-flex items-center gap-1 hover:text-gray-700 dark:hover:text-white transition">
|
|
<span>Adres e-mail</span>
|
|
@if($currentSort === 'email')
|
|
<svg class="w-4 h-4 text-indigo-600 dark:text-indigo-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="{{ $currentDir === 'asc' ? 'M19 9l-7 7-7-7' : 'M5 15l7-7 7 7' }}" />
|
|
</svg>
|
|
@endif
|
|
</a>
|
|
</th>
|
|
|
|
<th scope="col" class="py-3.5 px-4" style="text-align: center !important; width: 25%;">Rola</th>
|
|
<th scope="col" class="py-3.5 px-4" style="text-align: center !important; width: 15%;">Akcje</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody class="divide-y divide-gray-200 dark:divide-gray-700/60 text-sm">
|
|
@forelse($users as $user)
|
|
<tr class="custom-table-row transition-colors duration-150">
|
|
|
|
<td class="py-4 px-4 font-medium text-gray-900 dark:text-white align-middle" style="text-align: center !important;">
|
|
<a href="{{ route('users.show', $user) }}" class="text-indigo-600 dark:text-indigo-400 hover:text-indigo-900 dark:hover:text-indigo-300 transition font-medium">
|
|
{{ $user->name }} {{ $user->surname }}
|
|
</a>
|
|
</td>
|
|
|
|
<td class="py-4 px-4 text-gray-600 dark:text-gray-300 align-middle" style="text-align: center !important;">
|
|
{{ $user->email }}
|
|
</td>
|
|
|
|
<td class="py-4 px-4 text-gray-600 dark:text-gray-300 align-middle" style="text-align: center !important;">
|
|
<div style="display: flex; justify-content: center; align-items: center; gap: 8px;">
|
|
@forelse($user->roles as $role)
|
|
<span class="role-badge text-xs font-semibold uppercase tracking-wider bg-gray-100 dark:bg-gray-700 text-gray-800 dark:text-gray-100 border border-gray-300 dark:border-gray-600 shadow-sm">
|
|
{{ $role->name }}
|
|
</span>
|
|
@empty
|
|
<span class="text-gray-400 dark:text-gray-500 text-xs">brak</span>
|
|
@endforelse
|
|
</div>
|
|
</td>
|
|
|
|
<td class="py-4 px-4 align-middle" style="text-align: center !important;">
|
|
<div class="flex items-center justify-center gap-3">
|
|
<a href="{{ route('users.edit', $user) }}" class="text-indigo-600 dark:text-indigo-400 hover:text-indigo-900 dark:hover:text-indigo-300 font-medium text-sm transition">
|
|
Edytuj
|
|
</a>
|
|
|
|
@if(auth()->id() !== $user->id)
|
|
<form method="POST" action="{{ route('users.destroy', $user) }}" onsubmit="return confirm('Czy na pewno chcesz usunąć tego użytkownika?');">
|
|
@csrf
|
|
@method('DELETE')
|
|
<button type="submit" class="text-red-600 dark:text-red-400 hover:text-red-900 dark:hover:text-red-300 font-medium text-sm transition">
|
|
Usuń
|
|
</button>
|
|
</form>
|
|
@endif
|
|
</div>
|
|
</td>
|
|
|
|
</tr>
|
|
@empty
|
|
<tr>
|
|
<td colspan="4" class="py-8 text-gray-500 dark:text-gray-400" style="text-align: center !important;">
|
|
@if(request('search'))
|
|
Brak wyników spełniających kryteria wyszukiwania: "<strong>{{ request('search') }}</strong>".
|
|
@else
|
|
Brak użytkowników do wyświetlenia.
|
|
@endif
|
|
</td>
|
|
</tr>
|
|
@endforelse
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
@if($users->hasPages())
|
|
<div class="mt-6 pt-4 border-t border-gray-200 dark:border-gray-700">
|
|
{{ $users->links() }}
|
|
</div>
|
|
@endif
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</x-app-layout> |