{{-- @extends('layouts.mastersupervisor') --}}
@extends('layouts.master')

@section('title', 'Express54')

@section('content')


    <div class="p-5 admin_bg" style="min-height: calc(100vh - 110px);">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="card shadow-sm p-2 mb-5 bg-white rounded">
                        <div class="card-body hometabel">

                            <a href="{{ url('supervisor/dashboard') }}" class="btn btn-md btn-danger rounded-pill px-3"><i
                                    class="fa-solid fa-arrow-left"></i>
                                @lang('messages.back')</a>

                            <h3 class="mb-5 custom-heading p-2">@lang('messages.user_list')</h3>
                            <table class="table" id="userlist">
                                <thead class="table_color">
                                    <tr>
                                        <th>@lang('messages.name')</th>
                                        <th>@lang('messages.last_name')</th>
                                        <th>@lang('messages.role')</th>
                                        <th>@lang('messages.email')</th>
                                        <th>@lang('messages.country')</th>
                                        <th>@lang('messages.embassies')</th>
                                        <th>@lang('messages.action')</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse ($user as $user)
                                        <tr>
                                            <td>{{ $user->fname }}</td>
                                            <td>{{ $user->lname }}</td>
                                            <td>{{ $user->role }}</td>
                                            <td>{{ $user->email }}</td>
                                            <td>{{ App\Models\Country::where('id', $user->country)->pluck('title')->first() }}

                                            <td>
                                                @if ($user->embassies == 'No embassy')
                                                    No Embassy
                                                @elseif ($user->embassies)
                                                    {{ App\Models\Embassy::where('id', $user->embassies)->pluck('name')->first() }}
                                                @else
                                                    No Embassy Associated
                                                @endif
                                            </td>

                                            <td><a href="{{ route('editEmployee', ['id' => $user->id]) }}"
                                                    class="btn btn-sm" title="Edit"><i
                                                        class="fa-solid fa-pen iconcolor"></i></a>

                                                <a href="{{ route('deleteEmployee', ['id' => $user->id]) }}"
                                                    class="btn btn-sm text-danger" title="Delete"
                                                    onclick="return confirm('Are you sure you want to delete this item?')"><i
                                                        class="fa-solid fa-trash"></i></a>
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="7">@lang('messages.nodatafound')</td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                            <script>
                                $(document).ready(function() {
                                    // Destroy and Initialize Expedited Table
                                    if ($.fn.DataTable.isDataTable('#userlist')) {
                                        $('#userlist').DataTable().destroy();
                                    }
                                    $('#userlist').DataTable();
                                });
                            </script>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection