@extends('layouts.app')

@section('title', 'User Management')

@section('content')
<section class="py-5 bg-light">
    <div class="container">
        {{-- Success Message --}}
        @if (session('success'))
            <div class="alert alert-success">
                {{ session('success') }}
            </div>
        @endif

        {{-- Error Messages --}}
        @if (session('error'))
            <div class="alert alert-danger">
                {{ session('error') }}
            </div>
        @endif

        <div class="d-flex justify-content-between align-items-center mb-4">
            <div>
                <h2 class="fw-bold mb-2 d-flex align-items-center gap-2">
                    <i class="bi bi-people text-primary"></i>
                    User Management
                </h2>
                <p class="text-muted mb-0">Manage system users and their roles</p>
            </div>
            <a href="{{ route('users.create') }}" class="btn btn-primary px-4">
                <i class="bi bi-person-plus"></i> Add New User
            </a>
        </div>

        <div class="card shadow-sm">
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="table table-hover mb-0">
                        <thead class="table-light">
                            <tr>
                                <th class="border-0 fw-semibold">ID</th>
                                <th class="border-0 fw-semibold">Name</th>
                                <th class="border-0 fw-semibold">Username</th>
                                <th class="border-0 fw-semibold">Role</th>
                                <th class="border-0 fw-semibold">Service Center</th>
                                <th class="border-0 fw-semibold">Created At</th>
                                <th class="border-0 fw-semibold">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($users as $user)
                                <tr>
                                    <td>{{ $user->id }}</td>
                                    <td>{{ $user->name }}</td>
                                    <td>{{ $user->username }}</td>
                                    <td>
                                        <span class="badge bg-primary">{{ $user->getRoleNames()->first() ?? 'No Role' }}</span>
                                    </td>
                                    <td>{{ $user->service_center }}</td>
                                    <td>{{ $user->created_at->format('d M Y') }}</td>
                                    <td>
                                        <div class="btn-group" role="group">
                                            <a href="{{ route('users.show', $user) }}" class="btn btn-outline-info btn-sm">
                                                <i class="bi bi-eye"></i>
                                            </a>
                                            <a href="{{ route('users.edit', $user) }}" class="btn btn-outline-warning btn-sm">
                                                <i class="bi bi-pencil"></i>
                                            </a>
                                            @if($user->id !== auth()->id())
                                                <form action="{{ route('users.reset-password', $user) }}" method="POST" class="d-inline">
                                                    @csrf
                                                    <button type="submit" class="btn btn-outline-secondary btn-sm"
                                                            onclick="return confirm('Are you sure you want to reset this user\'s password to default?')">
                                                        <i class="bi bi-key"></i>
                                                    </button>
                                                </form>
                                                <form action="{{ route('users.destroy', $user) }}" method="POST" class="d-inline">
                                                    @csrf
                                                    @method('DELETE')
                                                    <button type="submit" class="btn btn-outline-danger btn-sm"
                                                            onclick="return confirm('Are you sure you want to delete this user?')">
                                                        <i class="bi bi-trash"></i>
                                                    </button>
                                                </form>
                                            @endif
                                        </div>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="6" class="text-center py-4">
                                        <i class="bi bi-people text-muted" style="font-size: 2rem;"></i>
                                        <p class="text-muted mt-2 mb-0">No users found.</p>
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>

                @if($users->hasPages())
                    <div class="card-footer bg-light border-0 d-flex justify-content-center">
                        {{ $users->links('vendor.pagination.bootstrap-5') }}
                    </div>
                @endif
            </div>
        </div>
    </div>
</section>
@endsection