@extends('backend.layouts.master')

@section('title')
    List of Admins
@endsection

@push('styles')
<!-- Add custom styles or Bootstrap icons if needed -->
@endpush

@section('admin-content')
    <!-- partial -->
    <div class="main-panel">
        <div class="content-wrapper">
            <div class="row">

                <div class="col-lg-12 grid-margin stretch-card">
                    <div class="card">
                        <div class="card-body">
                            <h4 class="card-title">Admin's List</h4>
                            <p class="card-description">
                                @include('backend.layouts.partials.message')
                            </p>

                            

                            <div class="table-responsive">
                                <table class="table table-bordered table-striped">
                                    <thead class="">
                                        <tr>
                                            <th>#</th>
                                            <th>Name</th>
                                            <th>Email</th>
                                            <th>Role</th>
                                            <th class="text-center">Actions</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    @forelse($datas as $item)
                                        <tr id="table-data{{ $item->id }}">
                                            <td>{{ $loop->index + 1 }}</td>
                                            <td>{{ $item->name }}</td>
                                            <td>{{ $item->email }}</td>
                                            <td>
                                                @foreach ($item->roles as $role)
                                                    <span class="badge bg-success">{{ $role->name }}</span>
                                                @endforeach
                                            </td>
                                            <td class="text-center">
                                                <a href="{{ route($pageHeader['edit_route'],$item->id) }}" class="btn btn-sm btn-primary me-1" style="background-color: #007bff; border-color: #007bff;">
                                                    <i class="fa fa-edit"></i>
                                                </a>
                                                <a href="javascript:void(0)" onclick="dataDelete({{ $item->id }}, '{{ $pageHeader['base_url'] }}')" class="btn btn-sm btn-danger" style="background-color: #dc3545; border-color: #dc3545;">
                                                    <i class="fa fa-trash"></i> 
                                                </a>
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="5" class="text-center text-muted">No records found. <a href="{{ route($pageHeader['create_route']) }}" class="badge btn-info">Create</a></td>
                                        </tr>
                                    @endforelse
                                    </tbody>
                                </table>

                                <div class="d-flex justify-content-end">
                                    {!! $datas->links() !!}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        @include('backend.layouts.partials.footer')
    </div>
    
@endsection

@push('scripts')

@endpush