Developer
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>{{ (isset($page_title) ? __($page_title) : __("Public")) }}</title>
<link
href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Source+Serif+4:opsz,wght@8..60,300;8..60,400;8..60,500;8..60,600;8..60,700;8..60,900&display=swap"
rel="stylesheet">
@include('partials.header-asset')
@stack('css')
</head>
<body>
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Start body overlay
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
<div id="body-overlay" class="body-overlay"></div>
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
End body overlay
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Start Payment-preview
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
<section class="checkout-section">
<div class="row justify-content-center">
<div class="col-xl-5 col-lg-6 col-md-8">
<div class="checkout-wrapper">
<div class="checkout-top-area">
<div class="profile-area">
<img src="{{ auth()->user()->userImage ?? asset('public/frontend/images/user/user-1.png') }}"
alt="client">
</div>
<div class="logo-area">
<img src="{{ get_logo($basic_settings) }}"
alt="logo">
</div>
</div>
<form class="checkout-form" action="{{ setRoute('order.checkout.submit',$order->identifier) }}" method="POST">
@csrf
<div class="account-info-wrapper">
<div class="checkout-user">
<h5 class="title">{{ auth()->user()->fullname }}</h5>
<span>{{ auth()->user()->email }}</span>
</div>
<div class="checkout-amount">
<p>{{ get_amount(@$order->data->total_payable,@$order->data->currency) }}</p>
</div>
</div>
<div class="switch-wrapper">
<h4 class="title">{{ __("Pay with") }}</h4>
</div>
<input type="hidden" name="type" id="paymentType">
<div class="radio-wrapper">
@forelse($card_payments ?? [] as $item)
<div class="radio-item">
<div class="radio-item-wrapper">
<input type="radio" name="card_payment" value="{{ $item->id }}" data-type="card">
<label for="card-{{ $item->id }}">
<div class="content">
<h6 class="title">{{ decrypt($item->name) ?? '' }}</h6>
<p>{{ __("Card") }}: ****{{ substr(decrypt($item->card_number), -4) }}</p>
</div>
</label>
</div>
</div>
@empty
<div class="alert alert-primary text-center">
{{ __("You don't have any card. Please create a card.") }}
</div>
@endforelse
<div class="radio-item">
<div class="radio-item-wrapper">
<input type="radio" name="card_payment" value="{{ $user_wallet->id }}" data-type="wallet">
<label for="wallet-type">
<div class="content">
<h6 class="title">{{ __("From") }} {{ $user_wallet->currency->code }}</h6>
<h6 class="title">{{ __("Wallet") }} ({{ get_amount($user_wallet->balance, $user_wallet->currency->code) }})</h6>
</div>
</label>
</div>
</div>
<input type="hidden" name="identifier" value="{{ @$order->identifier }}">
</div>
<div class="btn-area">
<button type="submit" class="btn--base w-100">{{ __("Continue to Review Order") }}<i
class="las la-angle-right ms-1"></i></button>
</div>
<a href="{{ @$order->data->cancel_url }}"
class="home-btn">{{ __("Cancel and return to Home") }}</a>
</form>
</div>
</div>
</div>
</div>
</section>
<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
End Payment-preview
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
@include('partials.footer-asset')
<script>
$(document).ready(function() {
function updatePaymentType() {
const selectedOption = $("input[name='card_payment']:checked");
const paymentTypeInput = $("#paymentType");
if (selectedOption.length > 0) {
paymentTypeInput.val(selectedOption.data("type"));
}
}
$("input[name='card_payment']").change(updatePaymentType);
updatePaymentType();
});
</script>
</body>
</html>
Developer
To ensure a smooth integration process and optimal performance, follow these best practices: