@extends('client/layouts/contentNavbarLayout')

@section('title')
{{ __('client.drivers_list') }}
@endsection


@section('page-script')

@endsection

@section('content')
<style>
</style>

<div class="row py-3 mb-4">
    <div class="col-md">
        <h4 class="fw-bold">{{ __('client.drivers_list') }}</h4>
    </div>
    <div class="col-md text-md-end">
        <a class="btn btn-primary" href="{{ route('client.driver.create') }}">{{ __('client.add_new_driver') }}</a>
    </div>
</div>

<div class="col-12">
    @include('client.responses.messages')
    <div class="card">
        <h5 class="card-header">{{ __('client.drivers_list') }}</h5>
        <div class="table-responsive">
            <table class="table">
                <thead>
                    <tr class="text-center">
                        <th>{{ __('client.name') }}</th>
                        <th>{{ __('client.title') }}</th>
                        <th>{{ __('client.phone') }}</th>
                        <th>{{ __('client.email') }}</th>
                        <th>{{ __('client.address') }}</th>
                        <th>{{ __('client.sites') }}</th>
                        <th>{{ __('client.driver_license') }}</th>
                        <th><i class="bx bx-dots-vertical-rounded"></i></th>
                    </tr>
                </thead>
                <tbody class="table-border-bottom-0">
                    @if($users)
                      @foreach ($users as $user)
                        <tr class="text-center">
                            <td>{{ $user->fullName() }}</td>
                            <td>{{ $user->driver->title }}</td>
                            <td>{{ $user->phone }}</td>
                            <td>{{ $user->email }}</td>
                            <td>{{ $user->address }}</td>
                            <td>
                                @foreach ($user->driver->driverSites as $driverSite)
                                    <ul class="mx-0 text-primary">
                                        <li>{{ $driverSite->site->name }}</li>
                                    </ul>
                                @endforeach
                            </td>
                            <td>
                                @if ($user->driver?->driver_license_picture)
                                    <a class="btn btn-primary" href="{{ asset($user->driver?->driver_license_picture ) }}" target="_blank">{{ __('client.consult') }}</a>
                                @endif
                            </td>
                            <td>
                                <div class="dropdown">
                                    <button type="button" class="btn p-0 dropdown-toggle hide-arrow" data-bs-toggle="dropdown"><i class="bx bx-dots-vertical-rounded"></i></button>
                                    <div class="dropdown-menu">
                                        <a class="dropdown-item" href="{{ route('client.driver.edit', $user->id) }}"><i class="bx bx-edit-alt me-1"></i>{{ __('client.edit') }}</a>
                                        <button class="dropdown-item" onclick="deleteDriver('{{ route('client.driver.delete', $user->id) }}')"><i class="bx bx-trash me-1"></i>{{ __('client.delete') }}</button>
                                    </div>
                                </div>
                            </td>
                        </tr>
                      @endforeach
                    @endif
                </tbody>
            </table>
        </div>
        <div class="mt-4 d-flex flex-row-reverse px-4 pt-4">
            {{ $users }}
        </div>
    </div>
</div>

<button hidden type="button" data-bs-toggle="modal" id="delete-btn" data-bs-target="#delete-driver"></button>
<div class="modal fade" id="delete-driver" tabindex="-1" aria-modal="true" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="exampleModalLabel1">{{ __("client.validation_window") }}</h4>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <p class="h5">
                    {{ __("client.delete_driver_validation") }}
                </p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{{ __("client.close") }}</button>
                <form id="delete-driver-form" method="POST">
                    @csrf
                    <button type="submit" class="btn btn-danger">{{ __("client.delete") }}</button>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
    function deleteDriver(route) {
        $("#delete-driver-form").attr("action", route);
        $('#delete-btn').trigger('click');
    }
</script>
@endsection