@extends('content')

@section('filters')

<x-index.filters-component filtersRoute="{{ route('office.vehicles') }}">

    <div class="grid grid-cols-12 gap-4">

        <div class="col-span-12 md:col-span-6 2xl:col-span-2">
            <x-forms.input-component
                inputType="text"
                inputName="t1-car_brand|like|%%"
                inputValue="{{ request('t1-car_brand|like|%%') }}"
                inputLabel="{{ __('filters.car_brand') }}"
                inputClass="input_sm input_filters"
            />
        </div>

        <div class="col-span-12 md:col-span-6 2xl:col-span-2">
            <x-forms.input-component
                inputType="text"
                inputName="t1-car_model|like|%%"
                inputValue="{{ request('t1-car_model|like|%%') }}"
                inputLabel="{{ __('filters.car_model') }}"
                inputClass="input_sm input_filters"
            />
        </div>

        <div class="col-span-12 md:col-span-6 2xl:col-span-2">
            <x-forms.input-component
                inputType="text"
                inputName="t1-plate_number|like|%%"
                inputValue="{{ request('t1-plate_number|like|%%') }}"
                inputLabel="{{ __('filters.plate_number') }}"
                inputClass="input_sm input_filters"
            />
        </div>

        <div class="col-span-12 md:col-span-6 2xl:col-span-2">
            <x-forms.input-component
                inputType="text"
                inputName="t1-vin|like|%%"
                inputValue="{{ request('t1-vin|like|%%') }}"
                inputLabel="{{ __('filters.vin') }}"
                inputClass="input_sm input_filters"
            />
        </div>

        <div class="col-span-12 md:col-span-6 2xl:col-span-2">
            <x-forms.select-alpine-component
                whichData="clients"
                defaultValue="{{ request('t1-client_id|=') }}"
                inputName="t1-client_id|="
                searchInput="true"
                selectAlpineClass="select_alpine_filters"
                label="clients"
            />
        </div>

    </div>

</x-index.filters-component>

@endsection


@section('page-title')
    <div>{{ __('clients.vehicles.vehicles') }}</div>
    <div>
        @cansee('office.vehicles.insert')
        <a href="{{ route('office.vehicles.insert.create') }}" class="btn_md btn_gray">{{ __('main.add') }}</a>
        @endcansee
    </div>
@endsection



@section('page-content')
    <x-wrapper-component>
    <x-filters.filter-badges/>

    <table class="min-w-full warsztat-table">
        <thead>
        <tr>
            <th>#</th>
            <th>@sortable('clients.vehicles.table.car_brand', 't1.car_brand')</th>
            <th>@sortable('clients.vehicles.table.car_model', 't1.car_model')</th>
            <th>@sortable('clients.vehicles.table.plate_number', 't1.plate_number')</th>
            <th>@sortable('clients.vehicles.table.vin', 't1.vin')</th>
            <th>@sortable('clients.vehicles.table.year', 't1.year')</th>
            <th>@sortable('clients.vehicles.table.volume_ccm', 't1.volume_ccm')</th>
            <th>@sortable('clients.vehicles.table.power_kw', 't1.power_kw')</th>
            <th>@sortable('clients.vehicles.table.power_km', 't1.power_km')</th>
            <th>@sortable('clients.vehicles.table.kilometers', 't1.kilometers')</th>
            <th>@sortable('clients.vehicles.table.engine_code', 't1.engine_code')</th>
            <th>@sortable('clients.vehicles.table.paint_code', 't1.paint_code')</th>
            <th>@sortable('vehicle.list.client', 't1.client_id')</th>
            <th></th>
        </tr>
        </thead>
        <tbody>
        @foreach($vehicles as $index => $vehicle)
            <tr>
                <td class="text-center">{{ ($vehicles->currentPage() - 1) * $vehicles->perPage() + $loop->iteration }}.</td>
                <td class="">{{ $vehicle->car_brand }}</td>
                <td class="">{{ $vehicle->car_model }}</td>
                <td class="">{{ $vehicle->plate_number }}</td>
                <td class="text-center">{{ $vehicle->vin }}</td>
                <td class="text-right">{{ $vehicle->year }}</td>
                <td class="text-right">{{ $vehicle->volume_ccm }}</td>
                <td class="text-right">{{ $vehicle->power_kw }}</td>
                <td class="text-right">{{ $vehicle->power_km }}</td>
                <td class="text-right">{{ $vehicle->kilometers }}</td>
                <td class="text-center">{{ $vehicle->engine_code }}</td>
                <td class="text-center">{{ $vehicle->paint_code }}</td>
                <td class="">{{ $vehicle->client }}</td>
                <td>
                    @cansee('office.vehicles.update')
                    <a href="{{ route('office.vehicles.update.edit', ['vehicle' => $vehicle->id]) }}" class="btn_md btn_green">{{ __('main.edit') }}</a>
                    @endcansee
                    @cansee('office.vehicles.delete')
                    <a class="btn_md btn_red delete_confirm_button" data-id_key="{{ $vehicle->id }}" data-display_text="{{ $vehicle->plate_number }}">{{ __('main.delete') }}</a>
                    @endcansee
                </td>
            </tr>
        @endforeach
        </tbody>
    </table>
    </div>

        {{ $vehicles->links() }}
    </x-wrapper-component>
@endsection








@push('modal')

    @cansee('office.vehicles.delete')

    <x-modal.modal-delete-confirm-component modalRoute="{{ route('office.vehicles.delete') }}" />

    @endcansee

@endpush