admin user management

This commit is contained in:
Doar Mihai
2026-02-21 14:27:38 +02:00
parent 8a7071cdd5
commit 2c74b38ffc
5 changed files with 627 additions and 19 deletions
+268
View File
@@ -0,0 +1,268 @@
@extends('layouts.app')
@section('content')
<div class="bg-gray-50 dark:bg-gray-900 min-h-screen">
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<!-- Header -->
<div class="mb-8">
<div class="flex items-center justify-between">
<div>
<h1 class="text-3xl font-bold text-gray-900 dark:text-white">Edit User</h1>
<p class="mt-2 text-sm text-gray-600 dark:text-gray-400">Update user information and roles</p>
</div>
<a
href="{{ route('admin.users.index') }}"
class="px-4 py-2 bg-gray-200 dark:bg-gray-700 hover:bg-gray-300 dark:hover:bg-gray-600 text-gray-700 dark:text-gray-300 rounded-md font-medium transition-colors"
>
Back to Users
</a>
</div>
</div>
<!-- Form -->
<form action="{{ route('admin.users.update', $user) }}" method="POST" class="space-y-6">
@csrf
@method('PUT')
<!-- User Avatar Display -->
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
<div class="flex items-center">
@if($user->avatar_url)
<img class="h-20 w-20 rounded-full object-cover" src="{{ $user->avatar_url }}" alt="{{ $user->name }}">
@else
<div class="h-20 w-20 rounded-full bg-gradient-to-br from-primary-500 to-accent-500 flex items-center justify-center text-white text-2xl font-semibold">
{{ strtoupper(substr($user->name, 0, 1)) }}
</div>
@endif
<div class="ml-6">
<h3 class="text-lg font-medium text-gray-900 dark:text-white">{{ $user->name }}</h3>
<p class="text-sm text-gray-500 dark:text-gray-400">Editing user profile</p>
</div>
</div>
</div>
<!-- Basic Information -->
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Basic Information</h3>
<div class="space-y-4">
<!-- Name -->
<div>
<label for="name" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
Name <span class="text-red-500">*</span>
</label>
<input
type="text"
name="name"
id="name"
value="{{ old('name', $user->name) }}"
required
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500 @error('name') border-red-500 @enderror"
>
@error('name')
<p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
<!-- Email -->
<div>
<label for="email" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
Email <span class="text-red-500">*</span>
</label>
<input
type="email"
name="email"
id="email"
value="{{ old('email', $user->email) }}"
required
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500 @error('email') border-red-500 @enderror"
>
@error('email')
<p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
<!-- Bio -->
<div>
<label for="bio" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
Bio
</label>
<textarea
name="bio"
id="bio"
rows="3"
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500 @error('bio') border-red-500 @enderror"
>{{ old('bio', $user->bio) }}</textarea>
@error('bio')
<p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
</div>
</div>
<!-- Social Links -->
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Social Links</h3>
<div class="space-y-4">
<!-- Website -->
<div>
<label for="website" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
Website
</label>
<input
type="url"
name="website"
id="website"
value="{{ old('website', $user->website) }}"
placeholder="https://example.com"
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500 @error('website') border-red-500 @enderror"
>
@error('website')
<p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
<!-- Twitter -->
<div>
<label for="twitter" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
Twitter
</label>
<input
type="text"
name="twitter"
id="twitter"
value="{{ old('twitter', $user->twitter) }}"
placeholder="@username"
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500 @error('twitter') border-red-500 @enderror"
>
@error('twitter')
<p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
<!-- GitHub -->
<div>
<label for="github" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
GitHub
</label>
<input
type="text"
name="github"
id="github"
value="{{ old('github', $user->github) }}"
placeholder="username"
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500 @error('github') border-red-500 @enderror"
>
@error('github')
<p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
<!-- LinkedIn -->
<div>
<label for="linkedin" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
LinkedIn
</label>
<input
type="text"
name="linkedin"
id="linkedin"
value="{{ old('linkedin', $user->linkedin) }}"
placeholder="username"
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500 @error('linkedin') border-red-500 @enderror"
>
@error('linkedin')
<p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
</div>
</div>
<!-- Password -->
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Change Password</h3>
<p class="text-sm text-gray-600 dark:text-gray-400 mb-4">Leave blank to keep current password</p>
<div class="space-y-4">
<!-- New Password -->
<div>
<label for="password" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
New Password
</label>
<input
type="password"
name="password"
id="password"
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500 @error('password') border-red-500 @enderror"
>
@error('password')
<p class="mt-1 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
<!-- Confirm Password -->
<div>
<label for="password_confirmation" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
Confirm New Password
</label>
<input
type="password"
name="password_confirmation"
id="password_confirmation"
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500"
>
</div>
</div>
</div>
<!-- Roles -->
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">
Roles <span class="text-red-500">*</span>
</h3>
<p class="text-sm text-gray-600 dark:text-gray-400 mb-4">Select at least one role for this user</p>
<div class="space-y-3">
@foreach($roles as $role)
<label class="flex items-start">
<input
type="checkbox"
name="roles[]"
value="{{ $role->id }}"
{{ in_array($role->id, old('roles', $user->roles->pluck('id')->toArray())) ? 'checked' : '' }}
class="mt-1 rounded border-gray-300 dark:border-gray-600 text-primary-600 focus:ring-primary-500"
>
<div class="ml-3">
<span class="block text-sm font-medium text-gray-900 dark:text-white">{{ $role->name }}</span>
@if($role->description)
<span class="block text-sm text-gray-500 dark:text-gray-400">{{ $role->description }}</span>
@endif
</div>
</label>
@endforeach
</div>
@error('roles')
<p class="mt-2 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
</div>
<!-- Actions -->
<div class="flex items-center justify-between">
<a
href="{{ route('admin.users.index') }}"
class="px-4 py-2 bg-gray-200 dark:bg-gray-700 hover:bg-gray-300 dark:hover:bg-gray-600 text-gray-700 dark:text-gray-300 rounded-md font-medium transition-colors"
>
Cancel
</a>
<button
type="submit"
class="px-6 py-2 bg-primary-600 hover:bg-primary-700 text-white rounded-md font-medium transition-colors"
>
Update User
</button>
</div>
</form>
</div>
</div>
@endsection
+184
View File
@@ -0,0 +1,184 @@
@extends('layouts.app')
@section('content')
<div class="bg-gray-50 dark:bg-gray-900 min-h-screen">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<!-- Header -->
<div class="mb-8">
<h1 class="text-3xl font-bold text-gray-900 dark:text-white">User Management</h1>
<p class="mt-2 text-sm text-gray-600 dark:text-gray-400">Manage all users and their roles</p>
</div>
<!-- Success/Error Messages -->
@if(session('success'))
<div class="mb-6 bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800 text-green-800 dark:text-green-200 px-4 py-3 rounded-lg">
{{ session('success') }}
</div>
@endif
@if(session('error'))
<div class="mb-6 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 text-red-800 dark:text-red-200 px-4 py-3 rounded-lg">
{{ session('error') }}
</div>
@endif
<!-- Filters -->
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-4 mb-6">
<form method="GET" action="{{ route('admin.users.index') }}" class="flex flex-col sm:flex-row gap-4">
<!-- Search -->
<div class="flex-1">
<input
type="text"
name="search"
value="{{ request('search') }}"
placeholder="Search by name or email..."
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500"
>
</div>
<!-- Role Filter -->
<div class="sm:w-48">
<select
name="role"
class="w-full rounded-md border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-700 text-gray-900 dark:text-white shadow-sm focus:border-primary-500 focus:ring-primary-500"
>
<option value="">All Roles</option>
@foreach($roles as $role)
<option value="{{ $role->slug }}" {{ request('role') === $role->slug ? 'selected' : '' }}>
{{ $role->name }}
</option>
@endforeach
</select>
</div>
<!-- Buttons -->
<div class="flex gap-2">
<button
type="submit"
class="px-4 py-2 bg-primary-600 hover:bg-primary-700 text-white rounded-md font-medium transition-colors"
>
Filter
</button>
@if(request('search') || request('role'))
<a
href="{{ route('admin.users.index') }}"
class="px-4 py-2 bg-gray-200 dark:bg-gray-700 hover:bg-gray-300 dark:hover:bg-gray-600 text-gray-700 dark:text-gray-300 rounded-md font-medium transition-colors"
>
Clear
</a>
@endif
</div>
</form>
</div>
<!-- Users Table -->
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden">
<div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
<thead class="bg-gray-50 dark:bg-gray-900">
<tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
User
</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
Roles
</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
Joined
</th>
<th scope="col" class="px-6 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
Actions
</th>
</tr>
</thead>
<tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
@forelse($users as $user)
<tr class="hover:bg-gray-50 dark:hover:bg-gray-700/50 transition-colors">
<td class="px-6 py-4 whitespace-nowrap">
<div class="flex items-center">
<div class="flex-shrink-0 h-10 w-10">
@if($user->avatar_url)
<img class="h-10 w-10 rounded-full object-cover" src="{{ $user->avatar_url }}" alt="{{ $user->name }}">
@else
<div class="h-10 w-10 rounded-full bg-gradient-to-br from-primary-500 to-accent-500 flex items-center justify-center text-white font-semibold">
{{ strtoupper(substr($user->name, 0, 1)) }}
</div>
@endif
</div>
<div class="ml-4">
<div class="text-sm font-medium text-gray-900 dark:text-white">
{{ $user->name }}
</div>
<div class="text-sm text-gray-500 dark:text-gray-400">
{{ $user->email }}
</div>
</div>
</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="flex flex-wrap gap-2">
@forelse($user->roles as $role)
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium
{{ $role->slug === 'admin' ? 'bg-red-100 dark:bg-red-900 text-red-800 dark:text-red-200' : '' }}
{{ $role->slug === 'moderator' ? 'bg-blue-100 dark:bg-blue-900 text-blue-800 dark:text-blue-200' : '' }}
{{ $role->slug === 'user' ? 'bg-gray-100 dark:bg-gray-700 text-gray-800 dark:text-gray-200' : '' }}
">
{{ $role->name }}
</span>
@empty
<span class="text-sm text-gray-500 dark:text-gray-400">No roles</span>
@endforelse
</div>
</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 dark:text-gray-400">
{{ $user->created_at->format('M d, Y') }}
</td>
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<div class="flex items-center justify-end gap-2">
<a
href="{{ route('admin.users.edit', $user) }}"
class="text-primary-600 dark:text-primary-400 hover:text-primary-900 dark:hover:text-primary-300"
>
Edit
</a>
@if($user->id !== auth()->id())
<form
action="{{ route('admin.users.destroy', $user) }}"
method="POST"
onsubmit="return confirm('Are you sure you want to delete this user? This action cannot be undone.');"
class="inline"
>
@csrf
@method('DELETE')
<button
type="submit"
class="text-red-600 dark:text-red-400 hover:text-red-900 dark:hover:text-red-300"
>
Delete
</button>
</form>
@endif
</div>
</td>
</tr>
@empty
<tr>
<td colspan="4" class="px-6 py-12 text-center text-sm text-gray-500 dark:text-gray-400">
No users found
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
<!-- Pagination -->
@if($users->hasPages())
<div class="px-6 py-4 border-t border-gray-200 dark:border-gray-700">
{{ $users->links() }}
</div>
@endif
</div>
</div>
</div>
@endsection
@@ -19,20 +19,6 @@
class="inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium {{ request()->routeIs('products.*') ? 'border-primary-500 text-gray-900 dark:text-white' : 'border-transparent text-gray-500 dark:text-gray-400 hover:border-gray-300 dark:hover:border-gray-600 hover:text-gray-700 dark:hover:text-gray-300' }}">
Products
</a>
@auth
@if(auth()->user()->hasRole('admin'))
<a href="{{ route('admin.dashboard') }}"
class="inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium {{ request()->routeIs('admin.*') ? 'border-primary-500 text-gray-900 dark:text-white' : 'border-transparent text-gray-500 dark:text-gray-400 hover:border-gray-300 dark:hover:border-gray-600 hover:text-gray-700 dark:hover:text-gray-300' }}">
Dashboard
</a>
@endif
@if(auth()->user()->hasAnyRole(['admin', 'moderator']))
<a href="{{ route('products.manage') }}"
class="inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium {{ request()->routeIs('products.manage') ? 'border-primary-500 text-gray-900 dark:text-white' : 'border-transparent text-gray-500 dark:text-gray-400 hover:border-gray-300 dark:hover:border-gray-600 hover:text-gray-700 dark:hover:text-gray-300' }}">
Manage
</a>
@endif
@endauth
</div>
<!-- Search Bar (Desktop) -->
@@ -123,6 +109,38 @@
<a href="{{ route('profile.edit') }}" class="block px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700">
Settings
</a>
@if(auth()->user()->hasRole('admin'))
<div class="border-t border-gray-100 dark:border-gray-700 my-1"></div>
<a href="{{ route('admin.dashboard') }}"
class="block px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"
>
<div class="flex items-center">
<svg class="mr-2 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
</svg>
Admin Dashboard
</div>
</a>
<a href="{{ route('admin.users.index') }}"
class="block px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"
>
<div class="flex items-center">
<svg class="mr-2 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"></path>
</svg>
Manage Users
</div>
</a>
@endif
@if(auth()->user()->hasAnyRole(['admin', 'moderator']))
<a href="{{ route('products.manage') }}"
class="block px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700"
>
Manage products
</a>
@endif
<form method="POST" action="{{ route('logout') }}">
@csrf
<button type="submit" class="block w-full text-left px-4 py-2 text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700">
@@ -170,8 +188,12 @@
@auth
@if(auth()->user()->hasRole('admin'))
<a href="{{ route('admin.dashboard') }}"
class="block pl-3 pr-4 py-2 border-l-4 text-base font-medium {{ request()->routeIs('admin.*') ? 'border-primary-500 text-primary-700 bg-primary-50' : 'border-transparent text-gray-500 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-700' }}">
Dashboard
class="block pl-3 pr-4 py-2 border-l-4 text-base font-medium {{ request()->routeIs('admin.dashboard') ? 'border-primary-500 text-primary-700 bg-primary-50 dark:bg-primary-900 dark:text-primary-200' : 'border-transparent text-gray-500 dark:text-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700 hover:border-gray-300 dark:hover:border-gray-600 hover:text-gray-700 dark:hover:text-gray-300' }}">
Admin Dashboard
</a>
<a href="{{ route('admin.users.index') }}"
class="block pl-3 pr-4 py-2 border-l-4 text-base font-medium {{ request()->routeIs('admin.users.*') ? 'border-primary-500 text-primary-700 bg-primary-50 dark:bg-primary-900 dark:text-primary-200' : 'border-transparent text-gray-500 dark:text-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700 hover:border-gray-300 dark:hover:border-gray-600 hover:text-gray-700 dark:hover:text-gray-300' }}">
Manage Users
</a>
@endif
@if(auth()->user()->hasAnyRole(['admin', 'moderator']))