@extends('layouts.admin.app')
@section('content')
<div class="card mt-2">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h5 class="card-title">Managers</h5>
        <a href="{{route('dashboard.managers.create')}}" class="btn btn-success btn-sm"><i class="ti ti-plus"></i>Create</a>
    </div>
    <div class="table-responsive text-nowrap">
        <table class="table">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Name</th>
                    <th>Email</th>
                    <th>Password</th>
                    <th>Countries</th>
                    <th>Role</th>
                    <th>FTD</th>
                    <th></th>
                </tr>
            </thead>
            <tbody class="table-border-bottom-0">
                @foreach ($users as $user)
                <tr>
                    <td>{{$user->id}}</td>
                    <td>{{$user->name}}</td>
                    <td>{{$user->email}}</td>
                    <td><span class="badge bg-success cursor-pointer copyButton" data-clipboard-text="{{$user->pass ? $user->pass->password : 'No Password'}}">{{$user->pass ? $user->pass->password  :"No Password"}}</span></td>
                    <td>
                        @if($user->countries()->count() > 0)
                            @foreach ($user->countries()->get() as $key=>$country)
                            @if($key < 6)
                                <span class="badge rounded-pill bg-info bg-glow me-1">{{$country->country_name}}</span>
                            @elseif($key == 6)
                                ...
                            @endif
                            @endforeach
                        @endif
                    </td>
                    <td><span class="badge bg-primary bg-glow">{{userRole($user->getRoleNames())}}</span></td>
                    <td>{{$user->ftds()->count()}}</td>
                    <td>
                        <a data-bs-toggle="tooltip" data-bs-placement="top" data-bs-original-title="Edit" data-bs-custom-class="tooltip-warning" class="btn btn-sm btn-icon rounded-circle bg-glow btn-warning" href="{{route('dashboard.managers.edit', $user->id)}}">
                            <i class="ti ti-edit"></i>
                        </a>
                        <button data-bs-toggle="tooltip" data-bs-placement="top" data-bs-original-title="Delete" data-bs-custom-class="tooltip-danger" type="button" data-id="{{$user->id}}" class="deleteUser btn btn-sm btn-icon rounded-circle bg-glow btn-danger">
                            <i class="ti ti-trash-x"></i>
                        </button>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endsection

@push('script')
<script src="/assets/vendor/js/sweet.js"></script>

    <script>
        sweetAlertConfirmationBeforeAction('.deleteUser', 'Are you sure to delete this user?', 'retention/agents', 'DELETE', true);
    </script>
@endpush