@section('title', __('Visa types'))
<x-layout bodyClass="g-sidenav-show  bg-gray-200 ">

    <x-navbars.sidebar activePage="visa-types.index"></x-navbars.sidebar>
    <main class="main-content position-relative max-height-vh-100 h-100 border-radius-lg {{$locale == 'ar'?'overflow-x-hidden':''}}">
        <!-- Navbar -->
        <x-navbars.navs.auth titlePage="User Management"></x-navbars.navs.auth>
        <!-- End Navbar -->
        @include('pages.layout.flash_messages')
        <div class="container-fluid py-4">
            <div class="row">
                <div class="col-12">
                    <div class="card my-4">
                        @include('components.breadCrumb.list',['path' => route('visa-types.create'),'section' => __('Visa types'), 'excel_path'=>route('visa-types.download-excel'), 'pdf_path'=>route('visa-types.download-pdf'),'permssion' => 'visa_types.manage'])
                        {!! Form::open(['route'=>['visa-types.index'], 'method'=>'get']) !!}

                        <div class="row p-2">
                            <div class="col-md-4">
                                <div class="input-group input-group-outline {{ request('search') ? 'is-valid is-filled' :'' }}">
                                    <label class="form-label">{{ __('Search ..') }}</label>
                                    <input type="search" name="search" class="form-control" value="{{ request('search') }}">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="input-group  input-group-outline">
                                    {!! Form::submit(__('Search ..'), ['class' => 'btn btn-primary']) !!}
                                </div>
                            </div>
                        </div>


                        {!! Form::close() !!}
                        <div class="card-body px-0 pb-2">
                            <div class="table-responsive p-0">
                                <table class="table align-items-center mb-0">
                                    <thead>
                                        <tr>
                                            <th class="text-uppercase text-secondary text-md font-weight-bolder opacity-7">
                                                {{__("ID")}}
                                            </th>
                                            <th class="text-uppercase text-secondary text-md font-weight-bolder opacity-7 ps-2">
                                               {{__("NAME")}} </th>
                                            <th class="text-uppercase text-secondary text-md font-weight-bolder opacity-7 ps-2">
                                                {{__("CREATION DATE")}}
                                            </th>
                                            <th class="text-center text-uppercase text-secondary text-md font-weight-bolder opacity-7">
                                                {{__("Action")}}
                                            </th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @forelse ($types as $type)
                                        <tr>
                                            <td>
                                                <div class="d-flex px-2 py-1">
                                                    <div class="d-flex flex-column justify-content-center">
                                                        <p class="mb-0 text-sm">{{$type->id}}</p>
                                                    </div>
                                                </div>
                                            </td>
                                            <td>
                                                <div class="d-flex flex-column justify-content-center">
                                                    <h6 class="mb-0 text-sm">{{$type->name}}</h6>

                                                </div>
                                            </td>
                                            <td>
                                                {{$type->created_at->format('Y-m-d')}}
                                            </td>
                                            <td class="align-middle">
                                                <a rel="tooltip" class="btn btn-success btn-link btn-sm" href="{{route('visa-types.edit',['visa_type' => $type->id])}}" data-original-title="" title="">
                                                    {{ __('Edit') }}
                                                    <i class="fa fa-edit"></i>
                                                </a>
                                                <form class="delete-form d-inline " action="{{ route('visa-types.destroy', ['visa_type' => $type->id]) }}" method="POST">
                                                    @csrf
                                                    @method('DELETE')
                                                    <button type="button" class="delete-button btn btn-danger btn-link btn-sm" data-original-title="" title="">
                                                        {{ __('Delete') }}
                                                        <i class="fa fa-close"></i>
                                                    </button>
                                                </form>
                                            </td>
                                        </tr>
                                        @empty
                                        <div class=" ">
                                            <div class=" d-flex justify-content-center text-center ">
                                                {{__("No entry found")}}
                                            </div>
                                        </div>
                                        @endforelse


                                    </tbody>

                                </table>
                            </div>
                            <div class="d-flex">
                                <div class="mx-auto">
                                    {{ $types->appends(Request::only(['search']))->links("pagination::bootstrap-4") }}
                                </div>
                            </div>
                        </div>

                    </div>

                </div>
            </div>
            <x-footers.auth></x-footers.auth>
        </div>
    </main>
    <x-plugins></x-plugins>

</x-layout>