@extends('frontend.layouts.app')

@section('title', 'Payment Details - ' . app_name())

@section('content')


    <!-- Cart Page Start -->
    <div class="cart_area cart-area-padding pt--35">
        <div class="container">
            <div class="page-section-title">
                <h1>PAYMENT DETAILS</h1>
            </div>
        </div>
    </div>


    <main id="content" class="page-section checkout-area-padding space-db--20">
        <div class="container">
            <div class="row">
                <div class="col-12">



                    <!-- Checkout Form s-->
                    <div class="checkout-page">
                        <div class="row row-40">

                            <div class="col-lg-8 mb--20">

                                @include('includes.partials.messages')

                                {{--@if(session()->get('flash_danger'))
                                    <div class="alert alert-danger" role="alert">
                                        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                            <span aria-hidden="true">&times;</span>
                                        </button>
                                        <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
                                        @if(is_array(json_decode(session()->get('flash_danger'), true)))
                                            {!! implode('', session()->get('flash_danger')->all(':message<br/>')) !!}
                                        @else
                                            {!! session()->get('flash_danger') !!}
                                        @endif
                                    </div>
                                @endif--}}

                                                <table class="table table-hover">
                                                    @if($data['order']->order_status != 3)
                                                        <tr>
                                                            <th class="red-text">Order Status:</th>
                                                            <td class="red-text">{{ \App\Models\Order::$statuses[$data['order']->order_status] }}</td>
                                                        </tr>
                                                    @endif
                                                    <tr>
                                                        <th width="30%">Sub Total:</th>
                                                        <td>${{ number_format($data['order']->sub_total,2) }}</td>
                                                    </tr>
                                                    <tr>
                                                        <th>Shipping Charges:</th>
                                                        <td>${{ number_format($data['order']->shipping_fee,2). ' ('. $data['order']->shipping_service .')' }}</td>
                                                    </tr>
                                                    <tr>
                                                        <th>Discount:</th>
                                                        <td>${{ number_format($data['order']->discount,2) }}</td>
                                                    </tr>
                                                    @if(session()->get('ses_total_engraving_charges') > 0)
                                                    <tr>
                                                        <th>Custom Marking Charges:</th>
                                                        <td>${{ number_format(session()->get('ses_total_engraving_charges'), 2) }}</td>
                                                    </tr>
                                                    @endif
                                                    <tr>
                                                        <th class="red-text">Grand Total:</th>
                                                        <td class="red-text">${{ number_format($data['order']->grand_total,2) }}</td>
                                                    </tr>
                                                </table>



                                    @if($data['order']->order_status == 3)

                                <hr class="hr-blue">
                                    @php $css_frm_payment = ''; @endphp
                                    @if($data['customer'] && $data['customer']->group->bank_payment == 'Y')
                                    @php $css_frm_payment = 'd-none'; @endphp
                                    <div class="payment-method-selection mt-1" id="div-payment-credit-card" onclick="set_payment_option('credit-card');">
                                        <table class="table table-borderless">
                                            <tr>
                                                <td width="70%">
                                                    <strong>Pay Using Credit / Debit Card</strong>
                                                </td>
                                                <td rowspan="2" class="text-right">
                                                    <img src="vsi/image/pay_with_credit_cards.png" class="pt-4" alt="Pay with Credit Cards">
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>Visa, AMEX, MasterCard, Discover</td>
                                            </tr>
                                        </table>
                                    </div>



                                        <div class="payment-method-selection mt-1" id="div-payment-bank-transfer" onclick="set_payment_option('bank-transfer');">
                                            <table class="table table-borderless">
                                                <tr>
                                                    <td width="70%">
                                                        <strong>Pay By Bank Transfer</strong>
                                                    </td>
                                                    <td rowspan="2" class="text-right">
                                                        <img src="vsi/image/pay_with_bank_transfer.png" class="pt-4" alt="Pay with Bank Transfer">
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>{!! \App\Models\Settings::getSettingValue(8) !!}</td>
                                                </tr>
                                            </table>
                                        </div>

                                        {!! Form::open(array('method' => 'POST', 'id' => 'frm_bank_transfer', 'route' => array('frontend.save-order-bank-transfer', $data['order']->id))) !!}
                                            {!! Form::hidden('order_id', $data['order']->id) !!}
                                            <div class="pt-3 d-none" id="div-btn-payment">
                                                <button type="submit" id="btn_proceed_to_payment" class="btn btn-large btn-success w-100">Proceed to Payment</button>
                                            </div>
                                        {!! Form::close() !!}

                                        <hr id="hr_payment_container" class="hr-blue {{ $css_frm_payment }}">

                                    @endif


                                            <div id="frm_payment_container" class="{{ $css_frm_payment }}">

                                                {!! Form::open(array('method' => 'POST', 'id' => 'frm_payment')) !!}

                                                    {!! Form::hidden('order_id', $data['order']->id) !!}
                                                    <h4 class="d-none">Credit Card Details</h4>

                                                    <div class="mb-4 d-none"></div>



                                                    <div class="accordion" id="accordion_payment">
                                                        <div class="card">
                                                            <div class="card-header" id="acc_billing_address">
                                                                <h2 class="mb-0">
                                                                    <a href="javascript:;" class="checkout-headers" data-toggle="collapse" data-target="#acc_body_billing_address" aria-expanded="true" aria-controls="collapseOne">
                                                                        <i class="fa fa-money-bill-alt" aria-hidden="true"></i> BILLING ADDRESS
                                                                    </a>
                                                                </h2>
                                                            </div>

                                                            <div id="acc_body_billing_address" aria-labelledby="acc_billing_address" data-parent="#accordion_payment">
                                                                <div class="card-body">


                                                                    <div class="row">


                                                                        <div class="col-md-12 col-12 mb--20 funkyradio">
                                                                            <div class="funkyradio-primary">
                                                                                {!! Form::checkbox('same_billing_info', true, $data['v_billing_details']['same_billing_info'], ['id' => 'same_billing_info']) !!}
                                                                                <label for="same_billing_info"><strong>Click here if your billing and shipping details are same.</strong></label>
                                                                            </div>
                                                                        </div>

                                                                        <div class="col-md-12 col-12 mb--20">
                                                                            {!! Form::label('email', 'Email Address: *') !!}
                                                                            {!! Form::text('email', $data['v_billing_details']['email'], ['required' => 'required', 'type' => 'email', 'class' => 'form-control', 'placeholder' => 'Enter email address ...', 'id' => 'bl_email']) !!}
                                                                        </div>

                                                                        <div class="col-md-6 col-12 mb--20">
                                                                            {!! Form::label('first_name', 'First Name: *') !!}
                                                                            {!! Form::text('first_name', $data['v_billing_details']['first_name'],['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Enter first name ...', 'id' => 'bl_first_name']) !!}
                                                                        </div>

                                                                        <div class="col-md-6 col-12 mb--20">
                                                                            {!! Form::label('last_name', 'Last Name: *') !!}
                                                                            {!! Form::text('last_name', $data['v_billing_details']['last_name'],['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Enter last name ...', 'id' => 'bl_last_name']) !!}
                                                                        </div>
                                                                        <div class="col-12 mb--20">
                                                                            {!! Form::label('company', 'Company:') !!}
                                                                            {!! Form::text('company', $data['v_billing_details']['company'],['class'=>'form-control', 'placeholder'=>'Enter company name ...', 'id' => 'bl_company', 'maxlength' => 50]) !!}
                                                                        </div>

                                                                        <div class="col-12 mb--20">
                                                                            <label for="address1">Address: *</label>
                                                                            {!! Form::text('address1', $data['v_billing_details']['address1'],['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Enter address line 1...', 'id' => 'bl_address1']) !!}

                                                                            <div class="pt--10">{!! Form::text('address2', $data['v_billing_details']['address2'],['class'=>'form-control', 'placeholder'=>'Enter address line 2 ...', 'id' => 'bl_address2']) !!}</div>
                                                                        </div>

                                                                        <div class="col-12 col-12 mb--20">
                                                                            {!! Form::label('country', 'Country: *') !!}
                                                                            {!! Form::select('country', $data['countries'], $data['v_billing_details']['country'],['required' => 'required', 'class'=>'form-control', 'onchange="get_states(this.value);"', 'placeholder'=>'Select country ...', 'id' => 'bl_country']) !!}
                                                                        </div>

                                                                        <div class="col-md-6 col-12 mb--20">
                                                                            {!! Form::label('state', 'State: *') !!}
                                                                            <div id="div_state">

                                                                                @php
                                                                                    $show_text_field = true;
                                                                                    if(isset($data['address']))
                                                                                    {
                                                                                        if(is_numeric($data['address']->state))
                                                                                            $show_text_field = false;
                                                                                    }
                                                                                @endphp

                                                                                @if($show_text_field)
                                                                                    {!! Form::text('state', $data['v_billing_details']['state'], ['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Enter state ...']) !!}
                                                                                @else
                                                                                    {!! Form::select('state', $data['states'], $data['v_billing_details']['state'],['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Enter state ...']) !!}
                                                                                @endif

                                                                            </div>
                                                                        </div>

                                                                        <div class="col-md-6 col-12 mb--20">
                                                                            {!! Form::label('city', 'City: *') !!}
                                                                            {!! Form::text('city', $data['v_billing_details']['city'],['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Enter city ...', 'id' => 'bl_city']) !!}
                                                                        </div>

                                                                        <div class="col-md-6 col-12 mb--20">
                                                                            {!! Form::label('zip', 'Zip / Post Code: *') !!}
                                                                            {!! Form::text('zip', $data['v_billing_details']['zip'],['required' => 'required', 'maxlength' => '9', 'class'=>'form-control', 'placeholder'=>'Enter zip / post code ...', 'id' => 'bl_zip']) !!}
                                                                        </div>

                                                                        <div class="col-md-6 col-12 mb--20">
                                                                            {!! Form::label('phone', 'Phone: *') !!}
                                                                            {!! Form::text('phone', $data['v_billing_details']['phone'],['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Enter phone ...', 'id' => 'bl_phone']) !!}
                                                                        </div>

                                                                        <div class="col-md-6 col-12 mb--20">
                                                                            <button type="button" id="btn-billing-continue" class="btn btn-primary">Continue</button>
                                                                        </div>



                                                                    </div>


                                                                    </div>



                                                                </div>
                                                            </div>






                                                        <div class="card">
                                                            <div class="card-header" id="acc_card_details">
                                                                <h2 class="mb-0">
                                                                    <a href="javascript:;" class="checkout-headers" data-toggle="collapse" data-target="#acc_body_card_details" aria-expanded="true" aria-controls="collapseTwo">
                                                                        <i class="fa fa-credit-card" aria-hidden="true"></i> CARD DETAILS
                                                                    </a>
                                                                </h2>
                                                            </div>

                                                            <div id="acc_body_card_details" class="collapse" aria-labelledby="acc_card_details" data-parent="#accordion_payment">
                                                                <div class="card-body">
                                                                    <div class="row">


                                                                        <div class="col-md-12 col-12 mb--20">


                                                                            {!! Form::label('cc_number', 'Card Number:') !!}
                                                                            <div class="input-group">
                                                                                {!! Form::text('cc_number', null, ['required' => 'required', 'class' => 'form-control', 'placeholder' => 'Card Number ...', 'id' => 'cc_number']) !!}
                                                                                <div class="input-group-append">
                                                                                    <div class="input-group-text"><i class="fas fa-credit-card" id="fa_cc"></i></div>
                                                                                </div>
                                                                            </div>
                                                                            {!! Form::hidden('cc_type', null, ['id' => 'cc_type']) !!}


                                                                        </div>


                                                                        <div class="col-md-4 col-12 mb--20">
                                                                            {!! Form::label('cc_month', 'Expiry Month:') !!}
                                                                            {!! Form::select('cc_month', $data['months'], null, ['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Please Select ...']) !!}
                                                                        </div>

                                                                        <div class="col-md-4 col-12 mb--20">
                                                                            {!! Form::label('cc_year', 'Expiry Year:') !!}
                                                                            {!! Form::select('cc_year', $data['years'], null, ['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Please Select ...']) !!}
                                                                        </div>

                                                                        <div class="col-md-4 col-12 mb--20">
                                                                            {!! Form::label('cc_cvv', 'CVC:') !!}
                                                                            {!! Form::text('cc_cvv', null,['required' => 'required', 'class'=>'form-control', 'placeholder'=>'Enter CVC ...', 'maxlength' => 4]) !!}
                                                                        </div>




                                                                        <div class="col-md-12 col-12 mb--20">
                                                                            <div class="term-block">
                                                                                {!! Form::checkbox('terms', true, $data['v_billing_details']['terms'], ['id' => 'terms']) !!}
                                                                                <label for="terms">I've read and accept the <a class="text-red" target="_blank" href="/pages/terms-and-conditions">terms & conditions</a>.</label>
                                                                            </div>
                                                                            <button type="submit" class="btn btn-success btn-large w-100 btn-place-order" id="btn_place_order"  @if(session()->get('move_to') != 'acc_payment_form') disabled="disabled" @endif>PLACE ORDER</button>
                                                                        </div>

                                                                        <div class="col-md-12 col-12 mb--20 text-center">
                                                                            <hr>
                                                                            <img src="vsi/image/authorize_net.webp" alt="Secure Payments by Authorize.net" vspace="25" class="img-fluid">
                                                                        </div>







                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>





                                                    </div>




                                                {!! Form::close() !!}

                                            </div>


                                    @else

                                        <div class="alert alert-warning" role="alert">
                                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                            <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
                                            You can only pay for oders which are pending for payment.
                                        </div>


                                    @endif






                            </div>

                            <div class="col-md-4">
                                <h5>SHIPPING ADDRESS</h5>
                                <div class="table-responsive pt-3">
                                    <table class="table table-hover">
                                        <tbody>
                                        @if($data['order']->customer_id > 0)
                                            <tr>
                                                <td width="70%">{{ \App\Models\Customer::getCustomerName($data['order']->customer_id) }}</td>
                                            </tr>
                                        @endif
                                        <tr>
                                            <td width="70%">{{ $data['order']->email ?? 'N/A' }}</td>
                                        </tr>
                                        <tr>
                                            <td>{{ $data['order']->first_name . ' ' . $data['order']->last_name }}</td>
                                        </tr>
                                        @if($data['order']->company)
                                        <tr>
                                            <td>{{ $data['order']->company ?? 'N/A' }}</td>
                                        </tr>
                                        @endif
                                        <tr>
                                            <td>
                                                {{ $data['order']->address1 }},

                                                @if($data['order']->address2)
                                                    {{ $data['order']->address2 ?? 'N/A' }},
                                                @endif

                                                {{ $data['order']->city }}, {{ $data['order']->zip_code }}, @if(is_numeric($data['order']->state))
                                                    {{ \App\Models\State::get_state_name($data['order']->state) }},
                                                @else
                                                    {{ $data['order']->state }},
                                                @endif
                                                {{ \App\Models\Country::get_country_name($data['order']->country) }}

                                            </td>
                                        </tr>
                                        <tr>
                                            <td>{{ $data['order']->phone ?? 'N/A' }}</td>
                                        </tr>
                                        @if($data['order']->notes)
                                        <tr>
                                            <td>{{ $data['order']->notes ?? 'N/A' }}</td>
                                        </tr>
                                        @endif
                                        <tr>
                                            <td class="text-center"><a class="btn btn-sm btn-info" href="{{ route('frontend.checkout') }}">Change Address</a></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>


                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>

@push('after-scripts')
<script src="vsi/js/cleave.min.js"></script>
@if($data['v_billing_details']['terms'])
<script>
    activate_card_details();
    @if(is_numeric($data['v_billing_details']['state']))
        get_states({{ $data['v_billing_details']['country'] }}, {{ $data['v_billing_details']['state'] }});
    @endif
</script>
@endif
<textarea id="s_shipping_address" class="d-none">{!! json_encode($data['v_shipping_details']) !!}</textarea>
@endpush
@push('head-area')
    <script>
        gtag('event', 'conversion', {
            'send_to': 'AW-845595683/DBh2CKKbiu4BEKOIm5MD',
            'transaction_id': ''
        });
    </script>
@endpush
@endsection