@extends('layouts.dashlayoutsingle')

@section('content')

	<div class="container">

            <hr class="my-3 bg-transparent border-0">
        
             <div class="row mt-5">

                <div class="col-md-8">

                    <h3 class="fs-6 fw-bold mb-3">

				@if($promote->exclusive_coin > 0 && $promote->highlight_coin > 0 && $promote->newlabel_coin > 0)

					Cart (4 item)

				@elseif($promote->exclusive_coin > 0 && $promote->highlight_coin > 0 )

					Cart (3 item)

				@elseif($promote->exclusive_coin > 0 && $promote->newlabel_coin > 0 )

					Cart (3 item)

				@elseif($promote->highlight_coin > 0 && $promote->newlabel_coin > 0 )

					Cart (3 item)

				@elseif($promote->exclusive_coin > 0 || $promote->highlight_coin > 0 || $promote->newlabel_coin > 0)

					Cart (2 item)

				@else

					Cart (1 item)

				@endif

					</h3>                    

                    <div class="card bg-light border mb-3">

                        <div class="card-body p-2">

                            <div class="ad-detail-summary d-flex align-items-start">

						
								@if(!empty(profileImgSingle($profile->insert_key)))

									<div class="ad-img me-2">

										<img width="46" class="rounded-2" height="46" src="{{ profileImgSingle($profile->insert_key) }}" alt="{{ $profile->name }}">

									</div>

								@endif

                           

                                <div class="ad-detail w-100 del-icon">

                                    <span class="icon-bin position-absolute"></span>

                                    <p class="text-sm fw-bold">{{ $profile->name }}</p>

                                    <div class="pt-3 pb-3 ad-detail-time d-flex justify-content-between align-items-center">

                                        <div class="plan-in-sum">

                                           {{optionByKey('btn_vip')}} {{$promote->product_name}} {{optionByKey('comman_day')}} 

                                            <div class="mt-1 plan-time-box small fw-bold">

                                               
							@php
								$scheduleTime = explode('-',$promote->schedule_time);	
								$startFormatted = Carbon\Carbon::createFromFormat('H:i', trim($scheduleTime[0]))->format('h A');
								$endFormatted = Carbon\Carbon::createFromFormat('H:i', trim($scheduleTime[1]))->format('h A');
								$convertedTimeRange = strtolower($startFormatted) . ' - ' . strtolower($endFormatted);
								$timeslot = getTimesType($profile->payStatus['product_id'],$profile->payStatus['schedule_time']);
								$timeTypeClass = strtolower(timesTypeArray($timeslot->times_type));
							@endphp	
						
								 <span class="icon-{{$timeTypeClass}} me-1 fw-bold fs-6"></span>
								 {{getProData($profile->payStatus['product_id'])->days_name ?? ''}}
										{{$convertedTimeRange}}
										
                                            </div>

                                        </div>

                                        <div class="rate float-end d-flex flex-column align-items-end"> 

                                            <strong>{{ $currency_symbol }} {{ $promote->amount }}</strong> 

                                            <small>({{$promote->sapient_coin}} {{optionByKey('coins_name')}})</small> 

                                        </div>

                                    </div>

									@if($promote->exclusive_coin > 0)

                                    <div class="pt-3 pb-3 ad-detail-time d-flex justify-content-between align-items-center ps-3">

                                        <div class="plan-in-sum">

											+ {{optionByKey('btn_exclusive')}}

                                        </div>

                                        <div class="rate float-end d-flex flex-column align-items-end"> 

                                            <strong>{{ $currency_symbol }} {{ $promote->exclusive_amount }}</strong> 

                                            <small>({{$promote->exclusive_coin}} {{optionByKey('coins_name')}})</small> 

                                        </div>

                                    </div>

									@endif

									@if($promote->highlight_coin > 0)

                                    <div class="pt-3 pb-3 ad-detail-time d-flex justify-content-between align-items-center ps-3">

                                        <div class="plan-in-sum">

                                           + {{optionByKey('btn_highlight')}}  

                                        </div>

                                        <div class="rate float-end d-flex flex-column align-items-end"> 

                                            <strong>{{ $currency_symbol }} {{ $promote->highlight_amount }}</strong> <small>({{$promote->highlight_coin}} {{optionByKey('coins_name')}})</small> 

                                        </div>

                                    </div>

									@endif

									@if($promote->newlabel_coin > 0)

                                    <div class="pt-3 pb-3 ad-detail-time d-flex justify-content-between align-items-start ps-3">

                                        <div class="plan-in-sum">

                                           + {{optionByKey('btn_newlabel')}}  

                                        </div>

                                        <div class="rate float-end d-flex flex-column align-items-end"> 

                                            <strong>{{ $currency_symbol }} {{ $promote->newlabel_amount }}</strong> 

                                            <small>({{$promote->newlabel_coin}} {{optionByKey('coins_name')}})</small> 

                                        </div>

                                    </div>

									@endif

                                </div>                                

                            </div>

                            <div class="edit-prom small fw-bold d-inline">

                               <a href="{{ url('c/post-promote/'.$profile->insert_key) }}/"> <span class="icon-pencil"></span> <u>{{optionByKey('change_promotion')}}</u> </a>

                            </div> 

										
                        </div>
                    </div>


	
							
            <h3 class="fs-5 fw-bold mb-3">{{optionByKey('how_do_pay')}}</h3>
                   
			<div class="type-of-payment">

				@if(Auth::check())

					@if($availableCoin >= $usableCoin)

                        <div class="card mb-3 active">                        

                            <div class="card-body">

							 <h5 class="card-title fs-6 fw-bold d-flex align-items-center  mb-3">

								<div class="coins-icon-big me-2"></div>

								<span class="icon-coins-iconsvg fs-4 me-3"></span>

								{{optionByKey('coins_name')}}

							  </h5> 					

                              <div class="av-lb-coin ms-4 mt-3">

                                <ul class="flex-wrap list-unstyled d-flex small fw-bold mb-0">

                                    <li class="disabled mb-1 me-3 av-con-pg font-monospace" aria-disabled="true">

                                        {{ optionByKey('available_coins') }} <span class="text-dark badge bg-secondary">{{ $availableCoin }}</span>

                                    </li>

                                    <li class="disabled me-3 mb-1 font-monospace" aria-disabled="true">

                                        {{ optionByKey('usable_coins') }} <span class="text-dark badge bg-secondary">{{$usableCoin}}</span>

                                    </li>

                                    <li class="disabled me-3 mb-1 font-monospace" aria-disabled="true">

                                        {{ optionByKey('remaining_coins') }} <span class="text-dark badge bg-secondary">{{$remainingCoin}}</span>

                                    </li>

                                </ul>

                              </div>							

							  

                              <div class="border-1 alert alert-warning p-2 mb-0 ms-4"> 

									<p class="m-0 d-flex align-items-center"><span class="icon-warning me-2"></span> {{ optionByKey('credit_packto_pay') }}</p>

									<a class="fw-bold small d-inline-flex align-items-center" href="{{ url('c/account/coins') }}/">{{ optionByKey('buy_more_coin') }}<span class="ms-1  icon-icon-arrow_forward_ios"></span></a> 

                              </div>

                            </div>                            

                        </div>

						@else

						<div class="card mb-3">                        

                            <div class="card-body">

							 <h5 class="card-title fs-6 fw-bold d-flex align-items-center  mb-3">

								<div class="coins-icon-big me-2"></div>

								<span class="icon-coins-iconsvg fs-4 me-3"></span>

								{{optionByKey('coins_name')}}

							  </h5> 					

                              <div class="av-lb-coin ms-4 mt-3">

                                <ul class="flex-wrap list-unstyled d-flex small fw-bold mb-0">

                                    <li class="disabled mb-1 me-3 av-con-pg font-monospace" aria-disabled="true">

                                        {{ optionByKey('available_coins') }} <span class="text-dark badge bg-secondary">{{ $availableCoin }}</span>

                                    </li>

                                    <li class="disabled me-3 mb-1 font-monospace" aria-disabled="true">

                                        {{ optionByKey('usable_coins') }} <span class="text-dark badge bg-secondary">{{$usableCoin}}</span>

                                    </li>

                                    <li class="disabled me-3 mb-1 font-monospace" aria-disabled="true">

                                        {{ optionByKey('remaining_coins') }} <span class="text-dark badge bg-secondary">0</span>

                                    </li>

                                </ul>

                              </div>							

							  

                              <div class="border-1 alert alert-warning p-2 mb-0 ms-4"> 

									<p class="m-0 d-flex align-items-center"><span class="icon-warning me-2"></span> {{ optionByKey('credit_packto_pay') }}</p>

									<a class="fw-bold small d-inline-flex align-items-center" href="{{ url('c/account/coins') }}">{{ optionByKey('buy_more_coin') }}<span class="ms-1  icon-icon-arrow_forward_ios"></span></a> 

                              </div>

							  

                            </div>                            

                        </div>

						

						<div class="card active">                        

							<div class="card-body">

								<h5 class="card-title fs-6 fw-bold d-flex align-items-center mb-0">

									<div class="coins-icon-big me-1"></div>

									<span class="visa-icon-cus"></span>

								</h5>                             

							</div>                            

						</div>

					

						@endif

					@endif	

					

						

						

                    </div>



                    <div class="mt-4 d-flex position-relative shop-carterr">
                        <div class="me-3 d-inline-block">
                            <label for="PayCheckBox" class="switch switch-left-right" id="eCheckedBox">
                                <input id="PayCheckBox" type="checkbox" name="terms" class="switch-input form-control optionCheck">
                                <span data-on="{{optionByKey('yes_btn')}}" data-off="{{optionByKey('no_btn')}}" class="switch-label"></span>
                                <span class="switch-handle"></span>
                            </label>
                        </div>

                        <div class="txt_privacy pe-md-3">

							{!! optionByKey('terms_shopping_cart') !!}

                        </div>						
                        <div class="text-strong danger error-message" id="errorMessage" style="display:none;">

							{{ optionByKey('terms_error_msg')}}

                        </div>
                    </div>

					

			

                    <div class="row">

                    <div class="col-md-12 mt-5">

                        {!! optionByKey('comman_informations') !!}

                    </div>

                    <div class="col-md-12 mt-5">

                        {!! optionByKey('billing_address') !!}

                    </div>

                    </div>

                </div>

                <div class="col-md-4">

                    <div class="payment-summary-wrapper p-3">

                        <div class="payment-summary position-relative mb-3">

                            <h2 class="payment-sec-title mb-0">{{optionByKey('shopping_heading')}}</h2>

                            <div class="payment-order-code small">

                                <strong>{{optionByKey('shopping_order')}} : </strong> {{ $promote->promote_order_id }}

                            </div>

                            <div class="cart-qy">

							@if($promote->exclusive_coin > 0 && $promote->highlight_coin > 0 && $promote->newlabel_coin > 0)

								(4)

							@elseif($promote->exclusive_coin > 0 && $promote->highlight_coin > 0 )

								(3) 

							@elseif($promote->exclusive_coin > 0 && $promote->newlabel_coin > 0 )

								(3)

							@elseif($promote->highlight_coin > 0 && $promote->newlabel_coin > 0 )

								(3)

							@elseif($promote->exclusive_coin > 0 || $promote->highlight_coin > 0 || $promote->newlabel_coin > 0)

								(2)

							@else

								(1)

							@endif

	

				</div>

                        </div>

                        <div class="sub-total border px-3 p-2 mb-3 rounded-2">

                            {{ optionByKey('subtotal_price') }} <span class="float-end">{{ $currency_symbol }} {{ number_format($promote->amount+$promote->exclusive_amount+$promote->highlight_amount+$promote->newlabel_amount,2) }}</span>

                        </div>

                   

                        <div class="summary-total mb-3 d-flex justify-content-between">

                            <div class="total-label">

							@if($promote->exclusive_coin > 0 && $promote->highlight_coin > 0 && $promote->newlabel_coin > 0)

								{{optionByKey('total_price')}} :

                                <small class="d-block">4 {{ optionByKey('product_menu') }}</small>

							@elseif($promote->exclusive_coin > 0 && $promote->highlight_coin > 0 )

								{{optionByKey('total_price')}} :

                                <small class="d-block">3 {{ optionByKey('product_menu') }}</small>

							@elseif($promote->exclusive_coin > 0 && $promote->newlabel_coin > 0 )

								{{optionByKey('total_price')}} :

                                <small class="d-block">3 {{ optionByKey('product_menu') }}</small>

							@elseif($promote->highlight_coin > 0 && $promote->newlabel_coin > 0 )

								{{optionByKey('total_price')}} :

                                <small class="d-block">3 {{ optionByKey('product_menu') }}</small>

							@elseif($promote->exclusive_coin > 0 || $promote->highlight_coin > 0 || $promote->newlabel_coin > 0)

								{{optionByKey('total_price')}} :

                                <small class="d-block">2 {{ optionByKey('product_menu') }}</small>

							@else

								{{optionByKey('total_price')}} :

                                <small class="d-block">1 {{ optionByKey('product_menu') }}</small>

							@endif

                               

                            </div>

                            <div class="total-label text-end">

                                   {{ $currency_symbol }} {{ number_format($promote->amount+$promote->exclusive_amount+$promote->highlight_amount+$promote->newlabel_amount,2) }}

                                <small class="d-block">

								{{ $promote->sapient_coin+$promote->exclusive_coin+$promote->highlight_coin+$promote->newlabel_coin }} {{optionByKey('coin_heading')}}

								

								

								</small>

                            </div>

                        </div>

                        

						

@if(Auth::check())

	@if($availableCoin >= $usableCoin)

		<form class="slect-payment-form" name="orderconfirm" method="post" action="{{ url('c/orderconfirm') }}"> 

			@csrf

			<input name="order_id" type="hidden" value="{{ $promote->id }}">

			<input name="profile_id" type="hidden" value="{{ $promote->profile_id }}">

			<input type="hidden" name="paymentpage" value="shoping-cart-front">    

			<button type="button" class="btn btn-primary btn-block w-100 fs-6 fw-bold" id="PayValidButton">{!! optionByKey('buy_button') !!}</button>

		</form>

	@else

		<form class="cc" name="paybal" method="post" action="{{ url('c/paymentsingleadscardpay') }}">

			@csrf

			<input name="promote_order_id" type="hidden" value="{{ $promote->promote_order_id }}"> 

			<input name="promote_id" type="hidden" value="{{ $promote->id }}">

			<input name="profile_email" type="hidden" value="{{ $profile->email }}">

			<button type="button" class="btn btn-primary btn-block w-100 fs-6 fw-bold" id="PayValidButton" >{!! optionByKey('buy_button') !!}</button>

		</form>	

	@endif

			

@else

	<form class="cc" name="paybal" method="post" action="{{ url('c/paymentsingleadscardpay') }}">

		@csrf

		<input name="promote_order_id" type="hidden" value="{{ $promote->promote_order_id }}"> 

		<input name="promote_id" type="hidden" value="{{ $promote->id }}">

		<input name="profile_email" type="hidden" value="{{ $profile->email }}">

		<button type="button" class="btn btn-primary btn-block w-100 fs-6 fw-bold" id="PayValidButton">{!! optionByKey('buy_button') !!}</button>

	</form>		

@endif

							

		

                    </div>

                </div>

            </div>

        </div>



<div class="modal fade" id="modalYes" tabindex="-1" aria-labelledby="autoRenewalModalLabel" aria-hidden="true">
	<div role="document" class="modal-dialog modal-dialog-centered">
		<div class="modal-content">
			<div class="modal-header">	  
				<div id="autoRenewalModalLabel" class="modal-title">{{optionByKey('activate_auto_renewal')}}</div> 
				<button type="button" data-bs-dismiss="modal" aria-label="Close" class="close"><span aria-hidden="true">×</span></button>
			</div> 
			<div class="modal-body">
				<p>{{optionByKey('every_time_permotion')}} <strong>{{$promotext}} {{ $profile->payStatus['product_name'] }} {{optionByKey('comman_day')}} </strong> {{optionByKey('in_time_slot')}} <strong>{{$profile->payStatus['schedule_time'] }}</strong> {{optionByKey('auto_renewal')}}, <strong> {{$usableCoin}} {{optionByKey('coins_name')}}</strong> {!! optionByKey('auto_renew_do_agree')!!}</p>
			</div> 
			<div class="modal-footer">
				<button type="button" data-bs-dismiss="modal" class="btn btn-outline-primary btn-block me-2">{{optionByKey('auto_renew_cancel_btn')}}</button>
		
				<button class="btn btn-primary btn-block auto-renew-btn" data-ad-id="{{ $profile->insert_key }}" data-promotead-id="{{$profile->payStatus['promote_order_id']}}">
					{{optionByKey('auto_renew_ok_btn')}}
				</button>
			</div>
		</div>
    </div>	
</div>




<div class="modal fade" id="modalNo" tabindex="-1" aria-labelledby="autoCancelRenewalModalLabel" aria-hidden="true">
    <div role="document" class="modal-dialog modal-dialog-centered">
		<div class="modal-content">
			<div class="modal-header">	  
				<div id="autoCancelRenewalModalLabel" class="modal-title">{{optionByKey('cancel_auto_renewal')}}</div> 
				<button type="button" data-bs-dismiss="modal" aria-label="Close" class="close"><span aria-hidden="true">×</span></button>
			</div> 
			<div class="modal-body">
				{!!optionByKey('auto_renewal_cancel_popup')!!}
			</div> 
			<div class="modal-footer">
				<button type="button" data-bs-dismiss="modal" class="btn btn-outline-primary btn-block me-2">{{optionByKey('auto_renew_cancel_btn')}}</button>
				
				<button class="btn btn-primary btn-block w-50 pl-2 auto-renew-cancel-btn" data-ad-id="{{ $profile->insert_key }}" data-promotead-id="{{$profile->payStatus['promote_order_id']}}">{{optionByKey('auto_renew_ok_btn')}}</button>
			</div>
		</div>
    </div>
</div>

<div class="payloader d-flex align-items-center justify-content-center text-center">
	<div class="spinner-border mb-4" style="width: 3rem; height: 3rem; display:none;" role="status">
		<span class="visually-hidden"></span>
	</div>		
</div>
	


@endsection



@push('scripts')



<style>

span#errorMessage {

    display: none;

}

</style>

<script>

// jQuery Script

$(document).ready(function() {
	
	$('#PayValidButton').click(function() {
		if ($('.optionCheck:checked').length > 0) {
			 $('#errorMessage').hide();
		 } else {
			$('#errorMessage').show(); 
			$('#eCheckedBox').css('border', '1px solid red');
		}	
	});

	$('#PayCheckBox').change(function() {
		if ($(this).is(':checked')) {
			$('#PayValidButton').attr('type', 'submit');
			$('#errorMessage').hide();
		} else {
			$('#PayValidButton').attr('type', 'button');
			$('#errorMessage').hide();
		}
	});		

});




document.getElementById("eCheckedBox").focus();
    document.getElementById("PayValidButton").addEventListener('click', function(event) {
        var checkBox = document.getElementById("PayCheckBox");
        var errorMessage = document.getElementById("errorMessage");
        if (!checkBox.checked) {
            errorMessage.style.display = 'inline';  
            event.preventDefault();
            errorMessage.scrollIntoView({
                behavior: 'smooth', 
                block: 'center'   
            });
        } else {
            errorMessage.style.display = 'none'; 
			$('.payloader').addClass('payment-loader');
			$('.spinner-border').css('display', 'block');
			$('body').addClass('overflow-hidden');
        }
});

const toggleSwitch = document.getElementById('special');
if (toggleSwitch) {
toggleSwitch.addEventListener('change', () => {
	if (toggleSwitch.checked) {
		const yesModal = new bootstrap.Modal(document.getElementById('modalYes'));
		yesModal.show();
	} else {
		const noModal = new bootstrap.Modal(document.getElementById('modalNo'));
		noModal.show();
	}
});
}


$(document).ready(function () {
    $('.auto-renew-btn').on('click', function () {
        let adInsertId = $(this).data('ad-id'); 
        let promoteADId = $(this).data('promotead-id');
        $.ajax({
            url: "{{ url('/c/adautorenewyes') }}", 
            type: "POST",
            data: {
                _token: "{{ csrf_token() }}", 
                private_key: adInsertId,
                promote_id: promoteADId,
            },
            success: function (response) {
                if(response.status === true) {
					$('#modalYes').modal('hide')
                }
            }
        });
    });
	
	$('.auto-renew-cancel-btn').on('click', function () {
         let adInsertId = $(this).data('ad-id');
         let promoteADId = $(this).data('promotead-id');
		$.ajax({
            url: "{{ url('/c/adautorenewcancel') }}", 
            type: "POST",
            data: {
                _token: "{{ csrf_token() }}",
                 private_key: adInsertId,
                 promote_id: promoteADId,
            },
            success: function (response) {
                if (response.status === true) {
					$('#modalNo').modal('hide')
                }
            }
        });
    });
});
</script>
@endpush