@extends('web.layouts.layout')

@section('content')

    <main>
        <!-- ---------- payment-choose ----------- -->
        <section class="payment-choose">
            <div class="container">
                <div class="content">
                    <div class="section-title mb-5">
                        <h6> {{ $title ?? "" }} </h6>
                        <h2> {{ $title ?? "" }} </h2>
                    </div>
                    <form action="{{ route('web.checkout.handlePayment') }}" method="post">
                        @csrf
                        <div class="payment boxes-check">
                            <div class="row">
                                @if($paymentMethods->isNotEmpty())
                                    @foreach($paymentMethods as $paymentMethod)
                                        @continue(!in_array($paymentMethod->type, ['paytabs', 'wallet', 'bank_transfer']))
                                        <div class="col-lg-6">
                                            <div class="form-check mb-4">
                                                <input class="form-check-input"
                                                       type="radio"
                                                       value="{{ $paymentMethod->id }}"
                                                       id="payment{{ $paymentMethod->id }}"
                                                       name="payment_method_id"
                                                @if(old('payment_method_id'))
                                                    @checked(old('payment_method_id') == $paymentMethod->id)
                                                    @else
                                                    @checked($loop->first)
                                                    @endif/>
                                                <label class="form-check-label w-100 px-5 text-start py-4"
                                                       for="payment{{ $paymentMethod->id }}">
                                                    <div class="row justify-content-between align-items-center">
                                                        <div class="col-lg-6">
                                                            <div class="icon">
                                                                <img
                                                                    src="{{getImage($paymentMethod->image)}}"
                                                                    alt="">
                                                            </div>
                                                            <div
                                                                class="text"> {{ $paymentMethod->currentDescription->title ?? "" }}</div>
                                                        </div>
                                                    </div>
                                                </label>
                                            </div>
                                        </div>
                                    @endforeach
                                @endif
                            </div>
                        </div>
                        <div class="method-form payment-methods payment-method-8">
                            <div class="form form-box">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6> {{ __('orders::orders.beneficiary_name') }} </h6>
                                            <input
                                                type="text"
                                                class="form-control {{ $errors->has('beneficiary_name') ? 'is-invalid' : '' }}"
                                                name="beneficiary_name" value="{{ old('beneficiary_name') }}"
                                                placeholder="{{__('orders::orders.beneficiary_name')}}"/>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6> {{ __('orders::orders.bank_account_number') }} </h6>
                                            <input
                                                type="number" min="0"
                                                class="form-control {{ $errors->has('bank_account_number') ? 'is-invalid' : '' }}"
                                                name="bank_account_number" value="{{ old('bank_account_number') }}"
                                                placeholder="{{__('orders::orders.bank_account_number')}}"/>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6> {{ __('orders::orders.country_id') }} </h6>
                                            <select name="country_id"
                                                    class="form-control form-select {{ $errors->has('country_id') ? 'is-invalid' : '' }}">
                                                <option
                                                    value="">{{ __('general.choose').' '.__("members.country_id") }}</option>
                                                @foreach($countries as $country)
                                                    <option
                                                        @selected(old('country_id') == $country->id) value="{{ $country->id }}">
                                                        {{ $country->title ?? "" }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6> {{ __('orders::orders.account_code') }} </h6>
                                            <input
                                                type="text"
                                                class="form-control {{ $errors->has('account_code') ? 'is-invalid' : '' }}"
                                                name="account_code" value="{{ old('account_code') }}"
                                                placeholder="{{__('orders::orders.account_code')}}"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="method-form payment-methods payment-method-17">
                            <div class="form form-box">
                                <div class="row">
                                    <div class="checkout-balance">
                                        <small> {{ __('orders::orders.current_wallet_balance') }} : </small>
                                        <strong> {{ auth()->user()->user_balance_by_country['amount_currency'] ?? "" }} </strong>
                                    </div>
                                    @if($orderSummaryResult['insufficientBalance'] ?? false)
                                        <div class="balance-alert">
                                            <p class="alert alert-danger">
                                                {{ __('orders::orders.ensure_sufficient_balance') }}. {{ __('orders::orders.to_charge_wallet') }}
                                                <a href="{{ route('web.users.profile', ['tab' => 'balance']) }}" target="_blank" class="text-decoration-underline">
                                                    {{ __('general.click_here') }}
                                                </a>
                                            </p>
                                        </div>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="btns mt-5 text-center">
                            <button type="submit" class="bttn me-2 custom-submit-btn">
                                <i class="fal fa-save me-2"></i> {{ __('general.save_data') }} </button>
                        </div>
                    </form>
                </div>
            </div>
        </section>
    </main>

@endsection

@push('stack_scripts')
    <script>
        $(document).ready(function () {
            $('.boxes-check input[name="payment_method_id"]').on('change', function () {
                $('.payment-methods').hide();
                $('.payment-method-' + $(this).val()).show();
            });
            $('.boxes-check input[name="payment_method_id"]:checked').trigger("change");
        });
    </script>
@endpush