@extends('layouts.app')
@section('head')
    <link href="{{ asset('module/booking/css/checkout.css?_ver='.config('app.version')) }}" rel="stylesheet">
@endsection
@section('content')
    <div class="bravo-booking-page padding-content" >
        <div class="container">
            <div id="bravo-checkout-page" >
                <div class="row">
                    <div class="col-md-12">
                        <h3 class="form-title">{{__('Booking Submission')}}</h3>
                         <div class="booking-form">
                             <form method="post" action="{{route('check.out')}}">
                                 @csrf
                           {{--  @include ($service->checkout_form_file ?? 'Booking::frontend/booking/checkout-form')--}}
                                <div class="form-checkout" id="form-checkout" >
                                <input type="hidden" name="from" value="@php echo $_GET['from']; @endphp">
                                <input type="hidden" name="to" value="@php echo $_GET['to']; @endphp">
                                <input type="hidden" name="price" value="@php echo $_GET['price']; @endphp">
                                <input type="hidden" name="price_child" value="@php echo $_GET['price_child']; @endphp">
                                <input type="hidden" name="sale_price" value="@php echo $_GET['sale_price']; @endphp">
                                <input type="hidden" name="flight_slug" value="@php echo $_GET['slug']; @endphp">
                                <div class="form-section">
                                    <div class="row">
                                        <div style="padding:0" class="col-md-6 border-right">
                                        <div class="form-select-guests">
                                            <div class="form-group">
                                                
                                                <div class="form-content dropdown-toggle" data-toggle="dropdown">
                                                    <div class="wrapper-more">
                                                        <label> Guests <span class="required">*</span></label>
                                                         <div class="render">
                                                            <span class="adults">
                                                                <span class="one ">1 Adult</span> <span class=" d-none  multi"
                                                                                           data-html=":count Adults">1 Adults</span></span>
                                                            -
                                                            <span class="children">
                                                                <span class="one " data-html=":count Child">0 Child</span>
                                                                <span class="multi  d-none " data-html=":count Children">0 Children</span>
                                                            </span>
                                                            
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="dropdown-menu select-guests-dropdown">
                                                    <div class="dropdown-item-row">
                                                        <div class="label">Adults</div>
                                                        <div class="val">
                                                            <span class="btn-minus" data-input="adults"><i class="icon ion-md-remove"></i></span>
                                                            <span class="count-display"><input type="number" name="adults" value="1" min="1"></span>
                                                            <span class="btn-add" data-input="adults"><i class="icon ion-ios-add"></i></span>
                                                        </div>
                                                    </div>
                                                    <div class="dropdown-item-row">
                                                        <div class="label">{{__("child_no")}}</div>
                                                        <div class="val">
                                                            <span class="btn-minus" data-input="children"><i class="icon ion-md-remove"></i></span>
                                                            <span class="count-display"><input type="number" name="children" value="0"
                                                                                               min="0"></span>
                                                            <span class="btn-add" data-input="children"><i class="icon ion-ios-add"></i></span>
                                                        </div>
                                                    </div>
                                                    
                                                </div>
                                            </div>
                                        </div>
                            
                                    </div>
                                    <div style="padding:0" class="col-md-6 border-right"><label >{{__("Date")}} <span class="required">*</span></label>
                                                <input type="date" placeholder="{{__("Date")}}" class="form-control" value="" name="date"></div>
                                        
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label >{{__("First Name")}} <span class="required">*</span></label>
                                                <input type="text" placeholder="{{__("First Name")}}" class="form-control" value="{{$user->first_name ?? ''}}" name="first_name">
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                <label >{{__("Last Name")}} <span class="required">*</span></label>
                                                <input type="text" placeholder="{{__("Last Name")}}" class="form-control" value="{{$user->last_name ?? ''}}" name="last_name">
                                            </div>
                                        </div>
                                        <div class="col-md-6 field-email">
                                            <div class="form-group">
                                                <label >{{__("Email")}} <span class="required">*</span></label>
                                                <input type="email" placeholder="{{__("email@domain.com")}}" class="form-control" value="{{$user->email ?? ''}}" name="email">
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                    <label >كود الدولة<span class="required">*</span></label>
                                                    <input type="text" placeholder="{{__("Your Phone")}}" class="form-control" value="{{$user->phone ?? ''}}" name="code_phone">
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="form-group">
                                                    <label >رقم الهاتف<span class="required">*</span></label>
                                                    <input type="text" placeholder="{{__("Your Phone")}}" class="form-control" value="{{$user->phone ?? ''}}" name="phone">
                                            </div>
                                        </div>
                                        
                                        <div class="col-md-6 field-address-line-1">
                                            <div class="form-group">
                                                <label >{{__("Address line 1")}} </label>
                                                <input type="text" placeholder="{{__("Address line 1")}}" class="form-control" value="{{$user->address ?? ''}}" name="address_line_1">
                                            </div>
                                        </div>
                                        <div class="col-md-6 field-address-line-2">
                                            <div class="form-group">
                                                <label >{{__("Address line 2")}} </label>
                                                <input type="text" placeholder="{{__("Address line 2")}}" class="form-control" value="{{$user->address2 ?? ''}}" name="address_line_2">
                                            </div>
                                        </div>
                                        <div class="col-md-6 field-city">
                                            <div class="form-group">
                                                <label >{{__("City")}} </label>
                                                <input type="text" class="form-control" value="{{$user->city ?? ''}}" name="city" placeholder="{{__("Your City")}}">
                                            </div>
                                        </div>
                                        <div class="col-md-6 field-state">
                                            <div class="form-group">
                                                <label >{{__("State/Province/Region")}} </label>
                                                <input type="text" class="form-control" value="{{$user->state ?? ''}}" name="state" placeholder="{{__("State/Province/Region")}}">
                                            </div>
                                        </div>
                                        <div class="col-md-6 field-zip-code">
                                            <div class="form-group">
                                                <label >{{__("ZIP code/Postal code")}} </label>
                                                <input type="text" class="form-control" value="{{$user->zip_code ?? ''}}" name="zip_code" placeholder="{{__("ZIP code/Postal code")}}">
                                            </div>
                                        </div>
                                        <div class="col-md-6 field-country">
                                            <div class="form-group">
                                                <label >{{__("Country")}} <span class="required">*</span> </label>
                                                <select name="country" class="form-control">
                                                    <option value="">{{__('-- Select --')}}</option>
                                                    @foreach(get_country_lists() as $id=>$name)
                                                        <option @if(($user->country ?? '') == $id) selected @endif value="{{$id}}">{{$name}}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <label >{{__("Special Requirements")}} </label>
                                            <textarea name="customer_notes" cols="30" rows="6" class="form-control" placeholder="{{__('Special Requirements')}}"></textarea>
                                        </div>
                                    </div>
    </div>
                            </form>
                                
                                {{--@include ('Booking::frontend/booking/checkout-deposit')
                                @include ($service->checkout_form_payment_file ?? 'Booking::frontend/booking/checkout-payment')--}}
                            
                                @php
                                $term_conditions = setting_item('booking_term_conditions');
                                @endphp
                            
                                <div class="form-group">
                                    <label class="term-conditions-checkbox">
                                        <input type="checkbox" name="term_conditions"> {{__('I have read and accept the')}}  <a target="_blank" href="{{get_page_url($term_conditions)}}">{{__('terms and conditions')}}</a>
                                    </label>
                                </div>
                                <div class="html_before_actions"></div>
                            
                                <p class="alert-text mt10" v-show=" message.content" v-html="message.content" :class="{'danger':!message.type,'success':message.type}"></p>
                            
                                <div class="form-actions">
                                    <button class="btn btn-danger" @click="doCheckout">{{__('Submit')}}
                                        <i class="fa fa-spin fa-spinner" v-show="onSubmit"></i>
                                    </button>
                                </div>
                            </div>
                         </div>
                    </div>
                   {{-- <div class="col-md-4">
                        <div class="booking-detail booking-form">
                            @include ($service->checkout_booking_detail_file ?? '')
                        </div>
                    </div>--}}
                </div>
            </div>
        </div>
    </div>
@endsection
@section('footer')
    <script src="{{ asset('module/booking/js/checkout.js') }}"></script>
  {{--  <script type="text/javascript">
        jQuery(function () {
            $.ajax({
                'url': bookingCore.url + '{{$is_api ? '/api' : ''}}/booking/{{$booking->code}}/check-status',
                'cache': false,
                'type': 'GET',
                success: function (data) {
                    if (data.redirect !== undefined && data.redirect) {
                        window.location.href = data.redirect
                    }
                }
            });
        })

        $('.deposit_amount').on('change', function(){
            var credit_input = $(this).val();
            var convert_to_money = credit_input * {{ setting_item('wallet_credit_exchange_rate',1)}};
            var pay_now_need_pay = parseInt({{@$booking->deposit}}) - convert_to_money;
            if(pay_now_need_pay < 0){
                pay_now_need_pay = 0;
            }
            $('.convert_pay_now').html(bravo_format_money(pay_now_need_pay));
            $('.convert_deposit_amount').html(bravo_format_money(convert_to_money));
        });
    </script>--}}
@endsection