@extends('adminlte::page')

@section('title', 'Users')

@section('content_header')
    <h1><i class="fas fa-users"></i> Registered Users</h1>
@stop

@section('content')
    <div class="card">
        <div class="card-header">
            <h3 class="card-title">List of All Registered Users</h3>
            <div class="card-tools">
                <span class="badge badge-info">Total: {{ $users->total() }} users</span>
            </div>
        </div>
        <div class="card-body">
            @if($users->count() > 0)
                <div class="table-responsive">
                    <table class="table table-bordered table-striped">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>Name</th>
                                <th>Email</th>
                                <th>Email Verified</th>
                                <th>Registered Date</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($users as $user)
                                <tr>
                                    <td>{{ ($users->currentPage() - 1) * $users->perPage() + $loop->iteration }}</td>
                                    <td>
                                        <span class="badge badge-primary">{{ $user->name }}</span>
                                    </td>
                                    <td>{{ $user->email }}</td>
                                    <td>
                                        @if($user->email_verified_at)
                                            <span class="badge badge-success"><i class="fas fa-check"></i> Verified</span>
                                        @else
                                            <span class="badge badge-danger"><i class="fas fa-times"></i> Not Verified</span>
                                        @endif
                                    </td>
                                    <td>{{ $user->created_at->diffForHumans() }}</td>
                                    <!-- <td>
                                        <a href="{{ route('users.show', $user->id) }}" class="btn btn-sm btn-info">
                                            <i class="fas fa-eye"></i> View
                                        </a>
                                    </td> -->
                                    <td>
                                        <a href="{{ route('users.show', Crypt::encryptString($user->id)) }}" class="btn btn-sm btn-info">
                                        <i class="fas fa-eye"></i> View
                                        </a>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                {{-- Pagination --}}
                <div class="mt-3 d-flex justify-content-center">
                    <nav aria-label="Page navigation">
                        <ul class="pagination pagination-sm">
                            {{-- Previous --}}
                            @if ($users->onFirstPage())
                                <li class="page-item disabled">
                                    <span class="page-link" style="font-size: 0.75rem; padding: 0.25rem 0.35rem; line-height: 1;">&laquo;</span>
                                </li>
                            @else
                                <li class="page-item">
                                    <a class="page-link" href="{{ route('users.index', ['page' => $users->currentPage() - 1]) }}" style="font-size: 0.75rem; padding: 0.25rem 0.35rem; line-height: 1;">&laquo;</a>
                                </li>
                            @endif

                            {{-- Page Numbers --}}
                            @foreach ($users->getUrlRange(1, $users->lastPage()) as $page => $url)
                                @if ($page == $users->currentPage())
                                    <li class="page-item active">
                                        <span class="page-link" style="font-size: 0.75rem; padding: 0.25rem 0.35rem; line-height: 1;">{{ $page }}</span>
                                    </li>
                                @else
                                    <li class="page-item">
                                        <a class="page-link" href="{{ route('users.index', ['page' => $page]) }}" style="font-size: 0.75rem; padding: 0.25rem 0.35rem; line-height: 1;">{{ $page }}</a>
                                    </li>
                                @endif
                            @endforeach

                            {{-- Next --}}
                            @if ($users->hasMorePages())
                                <li class="page-item">
                                    <a class="page-link" href="{{ route('users.index', ['page' => $users->currentPage() + 1]) }}" style="font-size: 0.75rem; padding: 0.25rem 0.35rem; line-height: 1;">&raquo;</a>
                                </li>
                            @else
                                <li class="page-item disabled">
                                    <span class="page-link" style="font-size: 0.75rem; padding: 0.25rem 0.35rem; line-height: 1;">&raquo;</span>
                                </li>
                            @endif
                        </ul>
                    </nav>
                </div>
            @else
                <div class="text-center py-5">
                    <i class="fas fa-user-slash fa-3x text-muted mb-3"></i>
                    <p class="text-muted">No registered users yet</p>
                </div>
            @endif
        </div>
    </div>

    {{-- <!-- Footer -->
    <footer>
        <p>Developed By: <strong>Shahril Mohd Isa</strong> | Year: <strong>{{ date('Y') }}</strong></p>
    </footer> --}}
@stop

@section('css')
    <style>
        footer {
            margin-top: 20px;
            border-top: 1px solid #e0e0e0;
            padding: 20px 0;
            text-align: center;
            color: #999;
            font-size: 0.9rem;
        }

        footer p {
            margin: 0;
        }

        /* Pagination styling */
        .pagination {
            margin-top: 20px !important;
            gap: 5px !important;
        }

        .pagination .page-link {
            padding: 0.3rem 0.5rem !important;
            font-size: 0.8rem !important;
            line-height: 1.2 !important;
            min-width: auto !important;
            height: auto !important;
        }

        .pagination .page-item.active .page-link {
            background-color: #007bff !important;
            border-color: #007bff !important;
        }

        .page-link {
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
        }
    </style>
@stop