@extends('Partners.Layouts.Page')

@section('styles')
    <link rel="stylesheet" href="{{asset('css/bootstrap-datepicker.min.css') }}">
    <link rel="stylesheet" href="{{asset('css/contract.css')}}" />

    <style>
        #booking_wrapper{
            display: none;
        }

        .button-icon i{
            margin-left: 4px;
        }

        tr{
            cursor: pointer;
        }
    </style>
@endsection

@section('content')

    <!-- Booking Window -->
    <div class="modal fade" id="booking-window" tabindex="-1" aria-labelledby="booking-window-Label" aria-hidden="true">
        <div class="modal-dialog"></div>
    </div>

    <div class="breadcrumb-header justify-content-between">
        <div class="my-auto">
            <div class="d-flex">
                <h4 class="content-title mb-0 my-auto"><a href="{{partner_route()}}">الرئيسية /</a></h4>
                <h4 class="content-title mb-0 my-auto"><a href="{{partner_route('contracts.index')}}">العقود /</a></h4>
                <span class="text-muted mt-1 tx-13 ms-2 mb-0">{{$page_title}}</span>
            </div>
        </div>

        <div class="d-flex my-xl-auto right-content">
            <a href="{{partner_route('contracts.index')}}" class="btn btn-danger mb-1 me-1"><i class="mdi mdi-arrow-right"></i> العودة للعقود </a>
        </div>
    </div>

    @include('Messages')

    @if($is_allowed)
        <div class="progress-outer mt-4 mb-4">
            <div class="progress-bar--ribbon">
                <span class="icon"><i class="si si-docs"></i></span>
                <span class="step-header">بيانات العقار</span>
            </div>
            <div class="progress-bar--ribbon">
                <span class="icon"><i class="si si-calendar"></i></span>
                <span class="step-header">تواريخ الحجز</span>
            </div>
            <div class="progress-bar--ribbon">
                <span class="icon"><i class="fa fa-user"></i></span>
                <span class="step-header">بيانات المستأجر</span>
            </div>
            <div class="progress-bar--ribbon">
                <span class="icon"><i class="fa fa-users"></i></span>
                <span class="step-header">بيانات المرافق</span>
            </div>
            <div class="progress-bar--ribbon">
                <span class="icon"><i class="mdi mdi-ticket"></i></span>
                <span class="step-header">بيانات الحجز</span>
            </div>

            <div class="progress-bar--ribbon cars-tab">
                <span class="icon"><i class="fa fa-car"></i></span>
                <span class="step-header">السيارات</span>
            </div>
        </div>
    @endif

    <div class="row row-sm">
        <div class="col-lg-12">
            <div class="card">
                <div class="card-body p-0">
                    <div class="form-container">

                        @if($is_allowed)
                        <ul id="section-tabs">
                            <li class="current active"><span>1.</span> بيانات العقد </li>
                            <li><span>2.</span> تأكيد الجوال وتفعيل العقد</li>
                            <li id="payment-tab"><span>3.</span>الدفع</li>
                        </ul>
                        @endif

                        <div class="preloader-wrapper">
                            <img src="{{asset('images/preloader.svg')}}" alt="loading ..." />
                        </div>

                        <div class="form-body p-4">

                            @if($is_allowed)
                                <form id="contract-form" style="padding: 0;margin-bottom: 0" method="post" action="{{partner_route('contracts.store')}}" enctype="multipart/form-data">
                                    @csrf

                                    <div id="main-form" class="form-box">
                                        <div class="step active" data-step="1">
                                            <h3 class="form-title"><span class="form-ribbon">1. اختيار العقار</span></h3>

{{--                                            <div class="row mt-3">--}}
{{--                                                <div class="col-md-6 col-xs-12">--}}
{{--                                                    <div class="form-group">--}}
{{--                                                        <label for="province_id" class="form-label">اختر المنطقة</label>--}}

{{--                                                        <select class="nice-select mt-2 w-100 @error('province_id') has-error @enderror" id="province_id" name="province_id" required>--}}
{{--                                                            <option></option>--}}

{{--                                                            @foreach($provinces as $province)--}}
{{--                                                                <option value="{{$province->id}}">{{$province?->name_ar}}</option>--}}
{{--                                                            @endforeach--}}
{{--                                                        </select>--}}

{{--                                                        <div class="text-danger @error('province_id') active @enderror">--}}
{{--                                                            @error('province_id')--}}
{{--                                                            {{ $message }}--}}
{{--                                                            @enderror--}}
{{--                                                        </div>--}}
{{--                                                    </div>--}}
{{--                                                </div>--}}
{{--                                            </div>--}}

{{--                                            <div class="row">--}}
{{--                                                <div class="col-md-6 col-xs-12">--}}
{{--                                                    <div class="form-group">--}}
{{--                                                        <label for="city_id" class="form-label">اختر المدينة</label>--}}

{{--                                                        <select class="nice-select mt-2 w-100 @error('city_id') has-error @enderror" id="city_id" name="city_id" required>--}}
{{--                                                            <option></option>--}}
{{--                                                        </select>--}}

{{--                                                        <div class="text-danger @error('city_id') active @enderror">--}}
{{--                                                            @error('city_id')--}}
{{--                                                            {{ $message }}--}}
{{--                                                            @enderror--}}
{{--                                                        </div>--}}
{{--                                                    </div>--}}
{{--                                                </div>--}}
{{--                                            </div>--}}

                                            <div class="row">
                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="unit_id" class="form-label">اختر العقار</label>

                                                        <select class="select2 mt-2 w-100 @error('unit_id') has-error @enderror" id="unit_id" name="unit_id" required>
                                                            <option></option>

                                                            @foreach($units as $unit)
                                                                <option value="{{$unit->id}}">{{$unit?->name_ar.' - '.$unit?->city?->name_ar}}</option>
                                                            @endforeach
                                                        </select>

                                                        <div class="text-danger @error('unit_id') active @enderror">
                                                            @error('unit_id')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row" id="booking_wrapper">
                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="booking_id" class="form-label">رقم الحجز</label>

                                                        <input class="form-control disabled" readonly type="text" name="booking_id" id="booking_id" />

                                                        <button class="btn btn-danger button-icon mt-3" type="button" id="booking-window-btn" data-bs-toggle="modal" data-bs-target="#booking-window"><i class="si si-plus"></i> قم باختيار حجز</button>

{{--                                                        <select class="nice-select mt-2 w-100 @error('booking_id') has-error @enderror" id="booking_id" name="booking_id">--}}
{{--                                                            <option></option>--}}
{{--                                                        </select>--}}

                                                        <div class="text-danger @error('booking_id') active @enderror">
                                                            @error('booking_id')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="step" data-step="2">
                                            <h3 class="form-title"><span class="form-ribbon">2. تاريخ الحجز</span></h3>

                                            <div id="available-error" style="display: none">
                                                <div class="alert alert-danger alert-dismissible fade show mb-1" role="alert">
                                                    <span class="alert-body alert-inner--text"></span>
                                                    <button type="button" class="close" data-bs-dismiss="alert" aria-label="Close">
                                                        <span aria-hidden="true">×</span>
                                                    </button>
                                                </div>
                                            </div>

                                            <div class="row">
                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="from">تاريخ الدخول</label>

                                                        <div class="form-control-container">

                                                            <input type="text" value="{{old('from') ?? $today}}" min="{{$today}}" class="form-control grey @error('from') has-error @enderror" id="from" name="from" required />

                                                            <i></i>

                                                            <div class="text-danger @error('from') active @enderror">
                                                                @error('from')
                                                                {{ $message }}
                                                                @enderror
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row">
                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="to">تاريخ المغادرة</label>

                                                        <div class="form-control-container">
                                                            <input type="text" value="{{old('to') ?? $tomorrow}}" min="{{$tomorrow}}" class="form-control grey @error('to') has-error @enderror" id="to" name="to" required />
                                                            <i></i>
                                                        </div>

                                                        <div class="text-danger @error('to') active @enderror">
                                                            @error('to')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="step" data-step="3">
                                            <h3 class="form-title"><span class="form-ribbon">3. بيانات المستأجر</span></h3>

                                            <div class="row">
                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <div class="form-inline">
                                                            <label for="tenant_name" class="form-label">اسم المستأجر</label>
                                                        </div>

                                                        <div class="radio-buttons small-wrapper mb-3">
                                                            <input id="mr" type="radio" name="tenant_title" value="mr" checked />
                                                            <label for="mr">السيد</label>
                                                            <input id="mrs" type="radio" name="tenant_title" value="mrs" />
                                                            <label for="mrs">السيدة</label>
                                                        </div>

                                                        <div class="form-control-container">
                                                            <input type="text" data-max-size="191" maxlength="191" class="form-control grey @error('tenant_name') has-error @enderror" id="tenant_name" value="{{old('tenant_name')}}" name="tenant_name" required />
                                                            <i></i>


                                                            <div class="text-danger @error('tenant_name') active @enderror">
                                                                @error('tenant_name')
                                                                {{ $message }}
                                                                @enderror
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="flex-end col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="tenant_name_code">رقم الهوية</label>

                                                        <div class="form-control-container">
                                                            <input type="text" maxlength="10" data-size="10" class="form-control grey @error('tenant_name_code') has-error @enderror" id="tenant_name_code" value="{{old('tenant_name_code')}}" name="tenant_name_code" required />
                                                            <i></i>

                                                            <div class="text-danger @error('tenant_name_code') active @enderror">
                                                                @error('tenant_name_code')
                                                                {{ $message }}
                                                                @enderror
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="tenant_nationality">جنسية المستأجر</label>
                                                        <div class="form-control-container">
                                                            <input type="text" data-max-size="191" maxlength="191" class="form-control grey @error('tenant_nationality') has-error @enderror" value="{{old('tenant_nationality')}}" id="tenant_nationality" name="tenant_nationality" required />
                                                            <i></i>
                                                        </div>

                                                        <div class="text-danger @error('tenant_nationality') active @enderror">
                                                            @error('tenant_nationality')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                        </div>

                                        <div class="step" data-step="4">
                                            <h3 class="form-title"><span class="form-ribbon">4. بيانات المرافق</span></h3>

                                            <div class="row">
                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">

                                                        <div class="form-inline">
                                                            <label for="with_tenant_title" class="form-label">بيانات المرافق</label>
                                                        </div>

                                                        <div class="radio-buttons large-wrapper mb-3">
                                                            <input id="wife" type="radio" name="with_tenant_title" value="wife" checked />
                                                            <label for="wife">زوج/ة</label>
                                                            <input id="mother" type="radio" name="with_tenant_title" value="mother" />
                                                            <label for="mother">والد/ة</label>
                                                            <input id="sister" type="radio" name="with_tenant_title" value="sister" />
                                                            <label for="sister">أخ/أخت</label>
                                                            <input id="daughter" type="radio" name="with_tenant_title" value="daughter" />
                                                            <label for="daughter">ابن/ة</label>
                                                            <input id="others" type="radio" name="with_tenant_title" value="others" />
                                                            <label for="others">أخرى</label>
                                                        </div>

                                                        <div class="form-control-container">
                                                            <input type="text" data-max-size="191" maxlength="191" class="form-control grey @error('with_tenant_name') has-error @enderror" value="{{old('with_tenant_name')}}" id="with_tenant_name" name="with_tenant_name" required />
                                                            <i></i>
                                                        </div>

                                                        <div class="text-danger @error('with_tenant_name') active @enderror">
                                                            @error('with_tenant_name')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="col-md-6 flex-end col-xs-12">
                                                    <div class="form-group">
                                                        <label for="with_tenant_name_code">رقم الهوية</label>

                                                        <div class="form-control-container">
                                                            <input type="text" maxlength="10" class="form-control grey @error('with_tenant_name_code') has-error @enderror" value="{{old('with_tenant_name_code')}}" id="with_tenant_name_code" name="with_tenant_name_code" required />
                                                            <i></i>
                                                        </div>

                                                        <div class="text-danger @error('with_tenant_name_code') active @enderror">
                                                            @error('with_tenant_name_code')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="with_tenant_nationality">جنسية المرافق</label>

                                                        <div class="form-control-container">
                                                            <input type="text" data-max-size="191" maxlength="191" class="form-control grey @error('with_tenant_nationality') has-error @enderror" value="{{old('with_tenant_nationality')}}" id="with_tenant_nationality" name="with_tenant_nationality" required />
                                                            <i></i>
                                                        </div>

                                                        <div class="text-danger @error('with_tenant_nationality') active @enderror">
                                                            @error('with_tenant_nationality')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="step" data-step="5">
                                            <h3 class="form-title"><span class="form-ribbon">5. بيانات الحجز</span></h3>

                                            <div class="row">
                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="rent_value">قيمة الإيجار</label>

                                                        <div class="form-control-container">
                                                            <input type="number" data-max-size="6" maxlength="6" class="form-control grey @error('rent_value') has-error @enderror" value="{{old('rent_value') ?? 500}}" id="rent_value" name="rent_value" required />
                                                            <i></i>
                                                        </div>

                                                        <div class="text-danger @error('rent_value') active @enderror">
                                                            @error('rent_value')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="col-md-6 col-xs-12">
                                                    <div class="form-group">
                                                        <label for="insurance_value">قيمة التأمين</label>

                                                        <div class="form-control-container">
                                                            <input type="number" data-max-size="6" maxlength="6" class="form-control grey @error('insurance_value') has-error @enderror" value="{{old('insurance_value') ?? 200}}" id="insurance_value" name="insurance_value" required />
                                                            <i></i>
                                                        </div>

                                                        <div class="text-danger @error('insurance_value') active @enderror">
                                                            @error('insurance_value')
                                                            {{ $message }}
                                                            @enderror
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-group d-flex buttons m-0">
                                            <button class="btn btn-danger me-1 prev"><i class="fa fa-angle-right"></i> <span class="text">السابق</span></button>
                                            <button class="btn btn-success" id="submit" type="submit"><i class="mdi mdi-check-circle"></i> <span class="text">تسجيل العقد</span></button>
                                            <button type="submit" class="btn btn-primary next"><span class="text"> التالي </span> <i class="fa fa-angle-left"></i></button>
                                        </div>
                                    </div>

                                </form>
                            @elseif(is_blocked())
                                <div class="alert alert-danger text-center">
                                    <div><i class="icon_close_alt2" style="font-size:50px;color:#dc3545!important"></i></div>

                                    @if(!is_null(block_note()))
                                        <h3>عفوا قد تم إيقاف خاصية اضافة عقود بسبب:</h3>
                                        <h4>{{partner_auth()->user()->blocked_note}}</h4>
                                    @else
                                        <h3>عفوا قد تم إيقاف خاصية اضافة عقود</h3>
                                    @endif
                                </div>
                            @else
                                <div class="d-flex align-items-center flex-column">
                                    <img style="width: 200px" src="{{asset('assets/back/img/svgicons/note_taking.svg')}}" alt="" class="wd-35p">
                                    <h3 class="mg-b-10 mg-t-15 tx-18 text-muted">لا يوجد حجوزات فعالة</h3>
                                    <h5 class="mg-b-10 mg-t-15 tx-18 text-muted">يجب ان يكون هناك حجوزات لإصدار عقود</h5>
                                    <a href="{{partner_route('contracts.index')}}" class="btn btn-danger">العودة للعقود <i class="fa fa-angle-left"></i></a>
                                </div>
                            @endif
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    <script src="{{asset('js/moment.min.js')}}"></script>
    <script src="{{ asset('js/bootstrap-datepicker.min.js') }}"></script>
    <script src="{{ asset('js/bootstrap-datepicker.ar.js') }}"></script>

    <script>

        const unit = $('#unit_id').val();
        loadContractData(unit)

        $('#unit_id').select2()

        // if($('#province_id').val() != '') {
        //     loadCities($('#province_id').val())
        // }

        $('#from').datepicker({
            autoclose: true,
            format:'yyyy-mm-dd',
            startDate: '0d',
            disableTouchKeyboard: true,
            orientation: "bottom",
            rtl: true
        });

        $('#to').datepicker({
            autoclose: true,
            format:'yyyy-mm-dd',
            startDate: '+1d',
            endDate: '+15d',
            disableTouchKeyboard: true,
            orientation: "bottom",
            rtl: true,
        });

        // $('#province_id').on('change', function (){
        //     loadCities($(this).val())
        // });

        {{--function loadCities(province){--}}
        {{--    let city_url = '{{partner_route('available-cities', ':id')}}';--}}

        {{--    city_url = city_url.replace(':id', province)--}}

        {{--    $('#city_id').select2({--}}
        {{--        placeholder: '',--}}
        {{--        allowClear: true,--}}
        {{--        ajax: {--}}
        {{--            url: city_url,--}}
        {{--            processResults: function (data) {--}}
        {{--                return {--}}
        {{--                    results: data.data--}}
        {{--                };--}}
        {{--            }--}}
        {{--        }--}}
        {{--    });--}}
        {{--}--}}

        {{--$('#city_id').on('change', function (){--}}
        {{--    let unit_url = '{{partner_route('available-units', ':id')}}';--}}

        {{--    unit_url = unit_url.replace(':id', $(this).val())--}}

        {{--    $('#unit_id').select2({--}}
        {{--        placeholder: '',--}}
        {{--        allowClear: true,--}}
        {{--        ajax: {--}}
        {{--            url: unit_url,--}}
        {{--            processResults: function (data) {--}}
        {{--                return {--}}
        {{--                    results: data.data--}}
        {{--                };--}}
        {{--            }--}}
        {{--        }--}}
        {{--    });--}}
        {{--})--}}

        const BookingWindow = $('#booking-window');

        $('#booking-window-btn').on('click', function (e){
            e.preventDefault();

            let booking_url = '{{partner_route('available-bookings', ':id')}}';
            booking_url = booking_url.replace($('#city_id').val());

            BookingWindow.find('.modal-dialog').html(getPreloader())

            $.get(booking_url).done(function (data){
                BookingWindow.find('.modal-dialog').html(data.data)
            })
        })

        $('body').on('click', '#booking-window tr', function (){
            $('#booking-window').modal('toggle');
            $('#booking_id').val($(this).attr('id'))
            loadBooking($(this).attr('id'))
        })

        $('#from').on('change', function (){
            const startDate = $(this).val()
            const newVal = moment(startDate).add(1, 'days').format('YYYY-MM-DD');
            const newMaxVal = moment(startDate).add(15, 'days').format('YYYY-MM-DD');

            $('#to').val(newVal);

            $('#to').datepicker("destroy");

            $('#to').datepicker({
                autoclose: true,
                format:'yyyy-mm-dd',
                startDate: newVal,
                endDate: newMaxVal,
                disableTouchKeyboard: true,
                orientation: "bottom",
                rtl: true,
            });
        })

        function submitNewContract(token) {
            document.getElementById('contract-form').submit();
        }

        // Handle Next & Prev
        $('.next').on('click', function (e){
            e.preventDefault();
            $(this).attr('disabled', true).addClass('button-loading');
            const steps = $('.step').length;

            console.log(steps)
            let activeStep = $('.step.active'),
                currentStep = activeStep.data('step');

            if (currentStep === 1)
                $('.prev').show()

            if (currentStep === (steps - 1)) {
                $(this).hide()
                $('#submit').show()
            }

            if(currentStep === 2){
                // goNext(currentStep);

                $.post('{{partner_route('contracts.check.availability')}}', {
                    from: $('#from').val(),
                    to: $('#to').val(),
                    unit: $('#unit_id').val(),
                    booking_id: $('#booking_id').val()
                }).done(function (data){
                    $('#available-error').hide().find('.alert-body').html('');
                    $('#from, #to').removeClass('has-error').addClass('valid')
                    goNext(currentStep)
                }).fail(function(xhr, status, error) {
                    $('#available-error').show().find('.alert-body').html(xhr.responseJSON);
                    console.log(xhr)
                    $('#from, #to').addClass('has-error')
                });

            }else {
                let requiredInput = activeStep.find('input[required]'),
                    selectMenus = activeStep.find('select[required]');

                let errorsCount = 0;

                requiredInput.each(function (){
                    if ($(this).val() === ''){
                        // errors.push($(this).val());
                        $(this).addClass('has-error').parents('.form-group').find('.text-danger').addClass('active').html('هذا الحقل مطلوب ، برجاء إدخال القيمة المطلوبة.')
                        errorsCount++;
                    }else {
                        const fieldSize = $(this).data('size');
                        const fieldMaxSize = $(this).data('max-size');

                        if ($(this).val().length === fieldSize || typeof (fieldSize) === "undefined")
                            $(this).removeClass('has-error').addClass('valid').parents('.form-group').find('.text-danger').removeClass('active').html('')
                        else{
                            $(this).addClass('has-error').parents('.form-group').find('.text-danger').addClass('active').html('يجب ان يكون عدد الحروف أو الارقام في تلك الخانة '+ fieldSize)
                            errorsCount++;
                        }
                    }
                })

                selectMenus.each(function (){
                    if ($(this).val() === ''){
                        $(this).addClass('has-error').parents('.form-group').find('.text-danger').addClass('active').html('هذا الحقل مطلوب ، برجاء اختيار فيمة لاستكمال بيانات العقد.')
                        errorsCount++;
                    }
                })

                if (errorsCount === 0)
                    goNext(currentStep)
            }

            $('html, body').animate({ scrollTop: $('.form-container').offset().top }, 'slow');

            $(this).attr('disabled', false).removeClass('button-loading');
        })

        $('.prev').on('click', function (e){
            e.preventDefault();

            $(this).attr('disabled', true)

            $('#submit').hide()
            $('.next').show()

            let currentStep = $('.step.active').data('step');

            $('body').find('.step.active').hide().removeClass('active').prev().fadeIn().addClass('active')

            if (currentStep === 2)
                $(this).hide()

            $('html, body').animate({ scrollTop: $('.form-container').offset().top }, 'slow');
            $(this).attr('disabled', false)
        })
        const modal = $();

        $(document).ready(function () {
            $('.preloader-wrapper').remove()
        });

        function goNext(currentStep){
            $('.progress-bar--ribbon').eq(currentStep-1).addClass('active')
            $('body').find('.step.active').hide().removeClass('active').next().fadeIn().addClass('active')
        }

        $('#unit_id').on('change', function (e) {
            e.preventDefault();

            const unit = $(this).val();
            loadContractData(unit);
        });

        function loadContractData(unit) {
            let url = '{{partner_route('contracts.unit.check')}}'

            let bookings_url = '{{partner_route('contracts.bookings.get')}}';

            $.post(bookings_url, {unit: unit}).done(function (data){
                $('#booking_id').html(data.bookings);
            });

            let i = 0;

            const disable_these = ['from', 'to', 'rent_value', 'insurance_value'];

            $.post(url, {unit: unit}).done(function (data){
                for(i=0;i<disable_these.length;i++) {
                    $('#'+disable_these[i]).attr('disabled', !data.is_association)
                }

                if (data.is_association) {
                    $('#booking_wrapper').hide();
                    $('#booking_id').attr('required', false)
                    $('#payment-tab').show()
                    $('.cars-tab').show()
                    $('.form-group.buttons').before(data.cars);
                }else {
                    $('#booking_wrapper').show();
                    $('#booking_id').attr('required', true)
                    $('#payment-tab').hide()
                    $('.cars-tab').hide()
                    $('body').find('#cars-tab').remove()
                }

            })
        }

        $('body').on('change', '#booking_id', function () {
            loadBooking($(this).val())
        });

        function loadBooking(booking){
            let url = "{{partner_route('bookings.show', ':id')}}";
            url = url.replace(':id', booking);

            $.get(url).done(function (data){
                $('#from').val(data.data.from)
                $('#to').val(data.data.to)

                $('#rent_value').val(data.data.rent)
                $('#insurance_value').val(data.data.insurance)
            })
        }

        $('form').on('submit', function (e){
            $('#submit-form').attr('disabled', true)
        });

    </script>
@endsection