@extends('site.pages.build')
@section('content')
    <section class="section">

        <div class="card col-6 m-auto">
            <div class="card-header">
                <h4 class="card-title text-center">    <img style="    width: 15%;" src="/site/assets/images/Group_542.svg" alt=""></h4>
            </div>
            <div class="card-content">
                <div class="card-body">
                    @if(!isset($form))
                        <form class="form form-vertical" method="post" action="{{ route('site.has-homes.store') }}">@csrf
                    @endif
                        <div class="form-body">
                            <div class="row px-3">
                                <div class="col-12">
                                    <h4>Evimi Açabilirim - Başvuru Formu</h4>
                                    <hr>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="text" class="form-control" placeholder="Ad Soyad" name="name" @if(isset($form)) value="{{ $form->name }}" disabled @endif required id="first-name-icon">
                                            <div class="form-control-icon">
                                                <i class="bi bi-person"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">

                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="text" class="form-control" placeholder="Telefon Numarası" name="telephone" @if(isset($form)) value="{{ $form->telephone }}" disabled @endif required id="email-id-icon">
                                            <div class="form-control-icon">
                                                <i class="bi bi-telephone"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <select type="text" class="form-control" name="city_id" @if(isset($form)) disabled @endif id="email-id-icon">
                                                @foreach(\App\Models\City::all() as $city)
                                                    <option @if(isset($form) && $form->city_id == $city->id) selected @endif value="{{ $city->il_id }}">{{ $city->il_adi }}</option>
                                                @endforeach
                                            </select>
                                            <div class="form-control-icon">
                                                <i class="bi bi-geo-alt"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            @if(isset($form))
                                                <select class="form-control" disabled>
                                                    <option value="0">{{ \App\Models\Town::where('ilce_id',$form->town_id)->first()->ilce_adi }}</option>
                                                </select>
                                            @else
                                                <select class="form-control" name="town_id">
                                                    <option value="0">İlçe</option>
                                                </select>
                                            @endif
                                            <div class="form-control-icon">
                                                <i class="bi bi-geo-alt"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            @if(isset($form))
                                                <select class="form-control" disabled>
                                                    <option value="0">{{ \App\Models\District::where('mahalle_id',$form->district_id)->first()->mahalle_adi }}</option>
                                                </select>
                                            @else
                                                <select class="form-control" name="district_id">
                                                    <option value="0">Mahalle</option>
                                                </select>
                                            @endif
                                            <div class="form-control-icon">
                                                <i class="bi bi-geo-alt"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            @if(isset($form))
                                                <select class="form-control" disabled>
                                                    <option value="0">{{ \App\Models\Street::where('sokak_id',$form->street_id)->first()->sokak_adi }}</option>
                                                </select>
                                            @else
                                                <select class="form-control" name="street_id">
                                                    <option value="0">Sokak</option>
                                                </select>
                                            @endif
                                            <div class="form-control-icon">
                                                <i class="bi bi-geo-alt"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="text" class="form-control" placeholder="Bina No" name="apartment_no" @if(isset($form)) value="{{ $form->apartment_no }}" disabled @endif required id="email-id-icon" />
                                            <div class="form-control-icon">
                                                <i class="bi bi-geo-alt"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="text" class="form-control" placeholder="Kat" name="floor" @if(isset($form)) value="{{ $form->floor }}" disabled @endif required id="email-id-icon" />
                                            <div class="form-control-icon">
                                                <i class="bi bi-geo-alt"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="text" class="form-control" placeholder="Daire" name="apartment" @if(isset($form)) value="{{ $form->apartment }}" disabled @endif required id="email-id-icon" />
                                            <div class="form-control-icon">
                                                <i class="bi bi-geo-alt"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-12 my-3">
                                    <hr>
                                </div>
                                <div class="col-12">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="number" min="1" class="form-control" placeholder="Ağırlayabileceğim Kişi Sayısı" name="person_count" @if(isset($form)) value="{{ $form->apartment }}" disabled @endif required id="email-id-icon">

                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="date" min="{{ now()->format('Y-m-d') }}" class="form-control" placeholder="Başlangıç Tarihi" name="start_date" @if(isset($form)) value="{{ $form->start_date }}" disabled @endif id="first-name-icon">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="date" min="{{ now()->format('Y-m-d') }}" class="form-control" placeholder="Bitiş Tarihi" name="end_date" @if(isset($form)) value="{{ $form->end_date }}" disabled @endif id="first-name-icon">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-12">

                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                           <textarea style="min-height: 20vh;    resize: none;" type="text" class="form-control" placeholder="Ulaşım Yöntemleri:" name="car_types" @if(isset($form)) disabled @endif id="email-id-icon">@if(isset($form)) {{ $form->car_types }} @endif</textarea>

                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">
                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="number" min="1" class="form-control" placeholder="Oda Sayısı" name="room_count" @if(isset($form)) value="{{ $form->room_count }}" disabled @endif required id="first-name-icon">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-6">

                                    <div class="form-group has-icon-right">
                                        <div class="position-relative">
                                            <input type="number" min="0" name="meter" required class="form-control" placeholder="Metrekare" id="email-id-icon">
                                        </div>
                                    </div>
                                </div>
                                @if(!isset($form))
                                <div class="col-12 d-flex justify-content-end mt-3">
                                    <button type="submit" class="btn btn-secondary me-1 mb-1 px-5" style="border-radius: 15px;">Başvur</button>
                                </div>
                                @endif
                            </div>
                        </div>
                    @if(!isset($form))
                        </form>
                    @endif
                </div>
            </div>
        </div>

    </section>
@endsection
@push('js')
    <script>
        $('select[name="city_id"]').on('change',function (){
            $.ajax({
                url: "{{ route('getTownsFromCity') }}",
                type: "post",
                data: {'_token':'{{ csrf_token() }}','city_id':$('select[name="city_id"]').val()} ,
                success: function (response) {
                    $('select[name="town_id"]').empty().append('<option value="0">İlçe</option>');
                    $('select[name="district_id"]').empty().append('<option value="0">Mahalle</option>');
                    $('select[name="street_id"]').empty().append('<option value="0">Sokak</option>');
                    $.each(response.towns,function (index,item){
                        $('select[name="town_id"]').append('<option value="'+item.ilce_id+'">'+item.ilce_adi+'</option>');
                    })
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    console.log(textStatus, errorThrown);
                }
            });
        })

        $('select[name="town_id"]').on('change',function (){
            $.ajax({
                url: "{{ route('getDistrictsFromTown') }}",
                type: "post",
                data: {'_token':'{{ csrf_token() }}','town_id':$('select[name="town_id"]').val()} ,
                success: function (response) {
                    $('select[name="district_id"]').empty().append('<option value="0">Mahalle</option>');
                    $('select[name="street_id"]').empty().append('<option value="0">Sokak</option>');
                    $.each(response.districts,function (index,item){
                        $('select[name="district_id"]').append('<option value="'+item.mahalle_id+'">'+item.mahalle_adi+'</option>');
                    })
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    console.log(textStatus, errorThrown);
                }
            });
        })

        $('select[name="district_id"]').on('change',function (){
            $.ajax({
                url: "{{ route('getStreetsFromDistrict') }}",
                type: "post",
                data: {'_token':'{{ csrf_token() }}','district_id':$('select[name="district_id"]').val()} ,
                success: function (response) {
                    $('select[name="street_id"]').empty().append('<option value="0">Sokak</option>');
                    $.each(response.streets,function (index,item){
                        $('select[name="street_id"]').append('<option value="'+item.sokak_id+'">'+item.sokak_adi+'</option>');
                    })
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    console.log(textStatus, errorThrown);
                }
            });
        })
    </script>
@endpush
