@extends('shop::layouts.master')

@section('page_title')
    {{ __('shop::app.search.page-title') }}
@endsection

@push('css')
    <link rel="stylesheet" href="@version('vendor/webkul/ui/assets/css/lite-checkout.css')">
@endpush

@section('content-wrapper')
    <div class="checkout-process">
        <div class="col-main">
            <div class="step-content information">

                <form id="my-checkout-form" method="POST" role="form" action="{{ route('shop.checkout.save-order') }}">
                    @csrf
                    <div class="checkout-container row">
                        <div class="col-md-6">
                            <div class="row">
                                <div class="form-container col-md-12">
                                    <h3>{{ __('shop::app.checkout.onepage.information') }}</h3>
                                    @foreach ($checkoutTrees as $checkoutTree)
                                        @if (!$checkoutTree['children'])
                                        @php $hidden = core()->getConfigData($checkoutTree['fields'][0]['key']) == null ? $checkoutTree['fields'][0]['default_value'] : core()->getConfigData($checkoutTree['fields'][0]['key']) @endphp
                                            @if (!$hidden )
                                                <div class="control-group">
                                                    <label for="{{ $checkoutTree['input-name'] }}">
                                                        {{ $checkoutTree['name'] }}
                                                    </label>
                                                    <input type="text"
                                                        {{ core()->getConfigData($checkoutTree['fields'][1]['key']) ? 'required' : '' }}
                                                        {{ core()->getConfigData($checkoutTree['fields'][2]['key']) ? 'disabled' : '' }}
                                                        class="control" id="{{ $checkoutTree['input-name'] }}"
                                                        name="{{ $checkoutTree['input-name'] }}" value=""
                                                        data-vv-as="{{ $checkoutTree['input-name'] }}" />
                                                    @error($checkoutTree['input-name'])
                                                        <span class="control-error">
                                                            {{ $message }}
                                                        </span>
                                                    @enderror
                                                </div>
                                            @endif
                                        @else
                                            {{-- country&city&district section --}}
                                            @foreach ($checkoutTree['children'] as $tree)
                                                @if (!core()->getConfigData($tree['fields'][0]['key']))
                                                    <div class="control-group">
                                                        <label for="{{ $tree['input-name'] }}">
                                                            {{ __($tree['name']) }}
                                                        </label>
                                                        <input type="text"
                                                            {{ core()->getConfigData($tree['fields'][1]['key']) ? 'required' : '' }}
                                                            {{ core()->getConfigData($tree['fields'][2]['key']) ? 'disabled' : '' }}
                                                            class="control" id="{{ $tree['input-name'] }}"
                                                            name="{{ $tree['input-name'] }}" value=""
                                                            data-vv-as="{{ $tree['input-name'] }}" />
                                                        @error($tree['input-name'])
                                                            <span class="control-error">
                                                                {{ $message }}
                                                            </span>
                                                        @enderror
                                                    </div>
                                                @endif
                                            @endforeach
                                        @endif
                                    @endforeach
                                </div>
                            </div>
                            @foreach ($shippingAndPaymentArray as $checkoutTree)
                                @if ($checkoutTree['key'] == 'checkout_page.payments' && $checkoutTree['fields'][0]['value'])
                                    <div class="row">
                                        <div class="form-container col-md-12">
                                            <h3> {{ __('admin::app.layouts.payment-methods') }}</h3>
                                            @foreach ($payments as $payment)
                                                <div class="checkout-method-group">
                                                    <div class="line-one">
                                                        <label class="radio-container">
                                                            <input v-validate="'required'" type="radio"
                                                                id="{{ $payment['method'] }}" name="payment[method]"
                                                                value="{{ $payment['method'] }}"
                                                                data-vv-as="&quot;{{ __('shop::app.checkout.onepage.payment-method') }}&quot;">
                                                            <span class="checkmark"></span>
                                                        </label>
                                                        <span class="payment-method method-label">
                                                            <b>{{ __($payment['method_title']) }}</b>
                                                        </span>
                                                    </div>
                                                </div>
                                            @endforeach
                                        </div>
                                    </div>
                                @endif
                                @if ($checkoutTree['key'] == 'checkout_page.shipping' && $checkoutTree['fields'][0]['value'] && !$isShipping)
                                    <div class="row">
                                        <div class="form-container col-md-12">
                                            <h3> {{ __('admin::app.layouts.shipping-methods') }}</h3>
                                            @foreach ($shippings as $rateGroup)
                                                {!! view_render_event('bagisto.shop.checkout.shipping-method.before', ['rateGroup' => $rateGroup]) !!}

                                                <span class="carrier-title" id="carrier-title"
                                                    style="font-size:18px; font-weight: bold;">
                                                    {{ $rateGroup['carrier_title'] }}
                                                </span>

                                                @foreach ($rateGroup['rates'] as $rate)
                                                    <div class="checkout-method-group mb-20">
                                                        <div class="line-one">
                                                            <label class="radio-container" class="shipping_method">
                                                                <input v-validate="'required'" type="radio"
                                                                    id="{{ $rate->method }}" name="shipping_method"
                                                                    data-vv-as="&quot;{{ __('shop::app.checkout.onepage.shipping-method') }}&quot;"
                                                                    value="{{ $rate->method }}" >
                                                                <span class="checkmark"></span>
                                                            </label>
                                                            {{-- <label class="radio-view" for="{{ $rate->method }}"></label> --}}
                                                            <b
                                                                class="ship-rate method-label">{{ core()->currency($rate->base_price) }}</b>
                                                        </div>
                                                    </div>
                                                @endforeach
                                            @endforeach
                                        </div>
                                    </div>
                                @endif
                            @endforeach

                        </div>
                        <div class="col-md-6">
                            <div class="order-summary">
                                <h3>{{ __('shop::app.checkout.total.order-summary') }}</h3>
                                <table class="table summary-table">
                                    <tbody>
                                        <tr data-total="sub-total">
                                            <td>{{ __('shop::app.checkout.total.sub-total') }}</td>
                                            <td>{{ core()->currency($cart->base_sub_total) }}</td>
                                        </tr>
                                        <tr data-total="shipping-fees">
                                            <td>{{ __('shop::app.checkout.total.shipping-fees') }}</td>
                                            <td>{{ core()->currency(core()->getConfigData('sales.carriers.flatrate.branch_' . core()->getCurrentBranch())) }}
                                            </td>
                                        </tr>
                                        <tr data-total="grand-total">
                                            <td>{{ __('shop::app.checkout.total.grand-total') }}</td>
                                            <td>{{ core()->currency($cart->base_grand_total + core()->getConfigData('sales.carriers.flatrate.branch_' . core()->getCurrentBranch())) }}
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="button-group">
                            <button class="btn btn-lg btn-primary">
                                {{ __('shop::app.checkout.onepage.confirm-order') }}
                            </button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        $(document).ready(function() {
            // Listen for changes in the shipping method selection
            console.log($('input[name="shipping_method"]').length);
            setTimeout(() => {
                $('input[name="shipping_method"]').on('change', function() {
                    var shippingMethod = $(this).val();
                    var shippingFees = 0; // Initialize shipping fees to 0

                    // Loop through the shipping rates to find the selected shipping method and get its base price
                    $('.checkout-method-group').each(function() {
                        var method = $(this).find('input[name="shipping_method"]').val();
                        if (method === shippingMethod) {
                            shippingFees = parseFloat($(this).find('.ship-rate').text());
                            return false; // Break out of the loop once the selected method is found
                        }
                    });

                    // Update the shipping fees in the summary table
                    var subTotal = parseFloat($('tr[data-total="sub-total"] td:last').text()
                        .replace(/[^0-9.-]+/g, ""));
                    $('tr[data-total="shipping-fees"] td:last').text('{{ core()->currency(0) }}');

                    // Update the grand total in the summary table
                    var grandTotal = subTotal + shippingFees;
                    $('tr[data-total="grand-total"] td:last').text(grandTotal);
                });
            }, 1000);
        });
    </script>
@endpush