93 lines
2.9 KiB
PHP
93 lines
2.9 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('title', '付款')
|
|
|
|
@section('content')
|
|
|
|
<style>
|
|
.success-icon {
|
|
font-size: 10rem;
|
|
color: #096dff
|
|
}
|
|
</style>
|
|
|
|
|
|
<div class="d-flex justify-content-center align-items-center h-screen" style="height: 60vh">
|
|
<div class="text-center">
|
|
<div id="pay">
|
|
@php
|
|
if ($balance->payment === 'alipay') {
|
|
$payment = '支付宝';
|
|
} elseif ($balance->payment === 'wechat') {
|
|
$payment = '微信';
|
|
} else {
|
|
$payment = '相应的软件';
|
|
}
|
|
@endphp
|
|
|
|
<h3>请使用 "{{ $payment }}" 扫描二维码。</h3>
|
|
|
|
|
|
<div class="mt-3">
|
|
{{ $qr_code }}
|
|
</div>
|
|
|
|
<h3 class="mt-2"> {{ $balance->amount }} 元</h3>
|
|
</div>
|
|
|
|
<div class="d-none" id="pay-success">
|
|
<div class="success-icon">
|
|
<i class="bi bi-check2-all"></i>
|
|
</div>
|
|
|
|
<h2>您已支付</h2>
|
|
@auth
|
|
<p>我们收到了您的支付，谢谢！</p>
|
|
@else
|
|
<p>您可以关闭此网页去通知 {{ $balance->user->name }} 了。</p>
|
|
@endauth
|
|
</div>
|
|
<div class="text-danger d-none" id="pay-error">此支付出现了问题。@auth
|
|
我们将稍后带您去余额界面。稍后请尽快联系我们。
|
|
@else
|
|
您可以让 {{ $balance->user->name }} 联系我们，或者您可以点击上方的"联系我们"按钮。
|
|
@endauth
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script>
|
|
const inter = setInterval(function () {
|
|
axios.get(location.href)
|
|
.then(function (response) {
|
|
if (response.data.paid_at ?? null) {
|
|
document.getElementById('pay-success').classList.remove('d-none');
|
|
document.getElementById('pay').classList.add('d-none');
|
|
|
|
clearInterval(inter);
|
|
|
|
@auth
|
|
setTimeout(function () {
|
|
location.href = '/balances';
|
|
}, 3000);
|
|
@endauth
|
|
}
|
|
})
|
|
.catch(function () {
|
|
document.getElementById('pay-error').classList.remove('d-none');
|
|
document.getElementById('pay').classList.add('d-none');
|
|
|
|
@auth
|
|
setTimeout(function () {
|
|
location.href = '/balances';
|
|
}, 3000);
|
|
@endauth
|
|
|
|
clearInterval(inter);
|
|
});
|
|
}, 1500);
|
|
</script>
|
|
|
|
@endsection
|