@extends('layouts.webshop')

@section('main-content')

<div class="order-form container py-5">

    <h2 style="color: #000000" class="text-center">Autóim</h2>

    <div class="text-center mt-3">
        Rögzítsd milyen autóid vannak, és értesítést küldünk ha az adott márkához alkatrész érkezik!
    </div>

    <form action="@if(!$edit_id) {{route('customer.my_car.store')}} @else {{route('customer.my_car.update', [$edit_id])}} @endif" method="POST">
    @csrf
    @method('PATCH')
    
    <div class="container">
        <div class="row">
            <div class="col-12 col-md-4 pt-4">
                <div class="font-weight-bold">Autó márkája:</div>
                <select id="car_make" name="car_make" class="w-100">
                    @foreach ( $car_makes as $item )
                        <option value="{{ $item->slug }}" selected>
                            {{ $item->name }}
                        </option>
                    @endforeach            
                </select>
                @if(isset($manufacturer_id)) <input type="hidden" name="manufacturer_id" value="{{$manufacturer_id}}"> @endif
            </div>
            <div class="col-12 col-md-4 pt-4">                
                <div class="font-weight-bold">Autó típusa:</div>
                <select id="car_model" name="car_model" class="w-100">
                    @if ( $make )
                        @foreach ( $make->car_models()->orderBy('ordinal_number', 'DESC')->get()->unique('short_name') as  $car_model)
                            <option value="{{ $car_model->slug }}" selected>
                                {{ $car_model->short_name }}
                            </option>
                        @endforeach
                    @endif
                </select>
                @if(isset($car_model_id)) <input type="hidden" name="car_model_id" value="{{$car_model_id}}"> @endif
            </div>
            <div class="col-12 col-md-4 pt-4">                
                <div class="font-weight-bold">Motor típusa:</div>
                <select id="variant" name="variant_id" class="w-100">
                    @if ( $make )
                        @foreach ( $variants as $item )
                            <option value="{{ $item->id }}" @if( $item->id == $variant_id ) selected @endif>
                                {{ $item->name }}
                            </option>
                        @endforeach    
                    @endif
                </select>
            </div>
        </div>
    </div>

    @if(!$edit_id)
    <div class="d-flex justify-content-center">
        <button type="submit" class="btn btn-primary my-5" style="width: 300px;">Mentés</button>
    </div>
    @else
    <div class="row">
        <div class="col-12 col-md-6">
            <div class="d-flex justify-content-center">
                <a href="{{route('customer.my_car')}}" class="btn btn-dark mt-5 mb-0 mb-md-5" style="width: 300px;">Mégsem</a>
            </div>
        </div>
        <div class="col-12 col-md-6">
            <div class="d-flex justify-content-center">
                <button type="submit" class="btn btn-primary mb-5 mt-5" style="width: 300px;">Módosít</button>
            </div>
        </div>
    </div>
    @endif

    </form>

    @if($my_cars)
        @foreach ($my_cars as $item)
            @include('webshop.customer.list_card', ['item' => $item])
        @endforeach
    @endif
</div>



@push('scripts')
<script>
$(document).ready(function() {
    @if(!$edit_id)
    $('#car_make').change(function(){
        location = '{{ route('customer.my_car', [':manufacturer']) }}'
            .replace(':manufacturer', $('#car_make').val());
    });

    $('#car_model').change(function() {
        location = '{{ route('customer.my_car', [':manufacturer', ':model']) }}'
            .replace(':manufacturer', $('#car_make').val())
            .replace(':model', $('#car_model').val().toLowerCase());
    });
    @else
    $('#car_make').change(function(){
        location = '{{ route('customer.my_car.edit', [$edit_id, ':manufacturer']) }}'
            .replace(':manufacturer', $('#car_make').val());
    });

    $('#car_model').change(function() {
        location = '{{ route('customer.my_car.edit', [$edit_id, ':manufacturer', ':model']) }}'
            .replace(':manufacturer', $('#car_make').val())
            .replace(':model', $('#car_model').val().toLowerCase());
    });
    @endif
});
</script>
@endpush

@endsection