added loader and fix marhun call
This commit is contained in:
Hafifie PKB
@@ -41,6 +41,13 @@
|
||||
<title>Bayar SAG | Portal Pelanggan</title>
|
||||
<div>
|
||||
|
||||
<div id="load-arrahn" class="d-none">
|
||||
<div class="overlay-arrahn"></div>
|
||||
<div class="loader-arrahn text-center">
|
||||
<img src="{{ asset('argon/img/brand/ar-rahn-take-2.gif') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form name="formpayment" method="post" action="{{ route('payment.engine') }}">
|
||||
@csrf
|
||||
<div class="row">
|
||||
@@ -62,7 +69,10 @@
|
||||
<div class="row align-items-center">
|
||||
<div class="d-flex">
|
||||
<h4 class="text-white" style="margin-right: 1%;">PKB</h4>
|
||||
<input type="radio" id="pkb" name="radpembayaran" value="pkb" class="ms-auto" style="width: 20px; height: 20px;" />
|
||||
<div class="ms-auto">
|
||||
<small class="text-white mr-2 font-weight-bold">*sila tick di sini untuk memilih bayaran.</small>
|
||||
<input type="radio" id="pkb" name="radpembayaran" value="pkb" class="ms-auto" style="width: 30px; height: 30px;" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -145,7 +155,10 @@
|
||||
<div class="row align-items-center">
|
||||
<div class="d-flex">
|
||||
<h4 class="text-white" style="margin-right: 1%;">KOPKB</h4>
|
||||
<input type="radio" id="kopkb" name="radpembayaran" value="kopkb" class="ms-auto" style="width: 20px; height: 20px;" />
|
||||
<div class="ms-auto">
|
||||
<small class="text-white mr-2 font-weight-bold">*sila tick di sini untuk memilih bayaran.</small>
|
||||
<input type="radio" id="kopkb" name="radpembayaran" value="kopkb" class="ms-auto" style="width: 20px; height: 20px;" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -2,6 +2,13 @@
|
||||
@section('content')
|
||||
<title>Home | Portal Pelanggan</title>
|
||||
|
||||
<div id="load-arrahn" class="d-none">
|
||||
<div class="overlay-arrahn"></div>
|
||||
<div class="loader-arrahn text-center">
|
||||
<img src="{{ asset('argon/img/brand/ar-rahn-take-2.gif') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row mt-n9 top-0">
|
||||
<x-dashboard-card
|
||||
title="Jum. Pembiayaan Semasa"
|
||||
@@ -188,6 +195,8 @@
|
||||
const cartsAvailable = await checkCarts();
|
||||
if (!cartsAvailable || (typeof cartsAvailable === 'object' && Object.keys(cartsAvailable).length === 0)) {
|
||||
// console.log('No carts available or an error occurred.');
|
||||
const loader = document.getElementById('load-arrahn');
|
||||
loader.classList.remove('d-none');
|
||||
event.target.submit();
|
||||
return;
|
||||
}
|
||||
@@ -199,6 +208,8 @@
|
||||
confirmButtonText: "Pergi Ke Troli",
|
||||
denyButtonText: `Buang Troli`
|
||||
}).then((result) => {
|
||||
const loader = document.getElementById('load-arrahn');
|
||||
loader.classList.remove('d-none');
|
||||
if (result.isDenied) {
|
||||
let remove_carts = fetch('/deletecarts')
|
||||
.then(response => {
|
||||
|
||||
@@ -64,6 +64,42 @@
|
||||
opacity: 0.8;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.loader-arrahn {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.loader-arrahn img {
|
||||
width: 100px; /* Image size */
|
||||
}
|
||||
|
||||
.loader-arrahn:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
border-radius: 50%;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.overlay-arrahn {
|
||||
position: fixed;
|
||||
z-index: 9998;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
@@ -1,69 +1,51 @@
|
||||
<!-- <div class="container position-sticky z-index-sticky top-0">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<nav class="navbar navbar-expand-lg position-absolute top-0 z-index-3 w-100 shadow-none my-3 navbar-transparent ">
|
||||
<div class="container">
|
||||
<a class="navbar-brand text-white " href="#home" rel="tooltip" title="Designed and Coded by Creative Tim" data-placement="bottom">
|
||||
MOHAMAD HAFIZUDDIN BIN HANAFI
|
||||
</a>
|
||||
<button class="navbar-toggler shadow-none ms-2" type="button" data-bs-toggle="collapse" data-bs-target="#navigation" aria-controls="navigation" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon mt-2">
|
||||
<span class="navbar-toggler-bar bar1"></span>
|
||||
<span class="navbar-toggler-bar bar2"></span>
|
||||
<span class="navbar-toggler-bar bar3"></span>
|
||||
</span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse w-100 pt-3 pb-2 py-lg-0 ms-lg-12 ps-lg-5" id="navigation">
|
||||
<ul class="navbar-nav navbar-nav-hover ms-auto">
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="#rekodpembelian">
|
||||
<i class="fa fa-list-alt me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Senarai Rekod Gadaian & Tebusan">Rekod Pembelian</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="#pemabayaran">
|
||||
<i class="fa fa-money me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Transaksi Pembayaran Upah">Pembayaran</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="#tebus">
|
||||
<i class="fa fa-exchange me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Tebus Marhun">Tebus</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="#analisa">
|
||||
<i class="fa fa-line-chart me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Analisa Marhun">Analisa</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="#analisa">
|
||||
<i class="fa fa-microchip me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Function Seterusnya">Next</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="portalprofile">
|
||||
<i class="fa fa-user me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Tetapan Profile">Profil</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item my-auto ms-3 ms-lg-0">
|
||||
<a href="loginportal" class="btn btn-sm bg-white mb-0 me-1 mt-2 mt-md-0">Log out</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<style>
|
||||
.loader-arrahn {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.loader-arrahn img {
|
||||
width: 100px; /* Image size */
|
||||
}
|
||||
|
||||
.loader-arrahn:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
border-radius: 50%;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.overlay-arrahn {
|
||||
position: fixed;
|
||||
z-index: 9998;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script> let routetrolley = '{{ route("payment.action") }}';let csrftoken = '{{ csrf_token() }}';</script>
|
||||
<script src="{{ asset('js/miscellaneous/navigation-trolley.js') }}"></script>
|
||||
|
||||
<div id="load-arrahn" class="d-none">
|
||||
<div class="overlay-arrahn"></div>
|
||||
<div class="loader-arrahn text-center">
|
||||
<img src="{{ asset('argon/img/brand/ar-rahn-take-2.gif') }}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container position-sticky z-index-sticky top-0">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
@@ -81,24 +63,6 @@
|
||||
</button>
|
||||
<div class="collapse navbar-collapse pt-3 pb-2 py-lg-0 w-100" id="navigation">
|
||||
<ul class="navbar-nav navbar-nav-hover ms-auto">
|
||||
{{-- <li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="{{ route('semaksag') }}">
|
||||
<i class="fa fa-list-alt me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Senarai Rekod Gadaian & Tebusan">Rekod Pembelian</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="{{ route('pembayaransag') }}">
|
||||
<i class="fa fa-money me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Transaksi Pembayaran Upah">Pembayaran</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="{{ route('analisa.index') }}">
|
||||
<i class="fa fa-line-chart me-1"></i>
|
||||
<p class="d-inline text-sm z-index-1 font-weight-bold" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Analisa Marhun">Analisa</p>
|
||||
</a>
|
||||
</li> --}}
|
||||
<li class="nav-item ms-lg-auto">
|
||||
<a class="nav-link nav-link-icon me-2" href="{{ route('profile.edit') }}">
|
||||
<i class="fa fa-user me-1"></i>
|
||||
|
||||
@@ -22,6 +22,7 @@
|
||||
<td>
|
||||
<a href="#" class="marhun-detail-link">
|
||||
<span class="text-sm text-info">{{ $data->norujukan }}</span>
|
||||
<input type="hidden" name="tag_syarikat" value="{{ $data->tag_syarikat }}"/>
|
||||
</a>
|
||||
</td>
|
||||
<td class="hide-xs">{{ $data->tempoh }}</td>
|
||||
|
||||
@@ -169,13 +169,23 @@
|
||||
|
||||
@push('additional_js_scripts')
|
||||
<script>
|
||||
const showMarhunDetailModal = async function(event) {
|
||||
const showMarhunDetailModal = async function(event,tagsyarikat) {
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
const norujukan = event.target.innerHTML;
|
||||
|
||||
const data = await fetch('/api/pembiayaan-modal-data/' + norujukan).then(x => x.json());
|
||||
const data = await fetch('/api/pembiayaan-modal-data/' + norujukan + "/" + tagsyarikat)
|
||||
.then(x => x.json())
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
const loader = document.getElementById('load-arrahn');
|
||||
loader.classList.add('d-none');
|
||||
throw error;
|
||||
});
|
||||
|
||||
const loader = document.getElementById('load-arrahn');
|
||||
loader.classList.add('d-none');
|
||||
|
||||
const formatter = new Intl.NumberFormat('en-US', {
|
||||
minimumFractionDigits: 2
|
||||
@@ -228,7 +238,11 @@
|
||||
|
||||
|
||||
$('#main-table').on('click', 'a.marhun-detail-link', function(e) {
|
||||
showMarhunDetailModal(e)
|
||||
const loader = document.getElementById('load-arrahn');
|
||||
loader.classList.remove('d-none');
|
||||
|
||||
const tag_syarikat = $(this).find('input[name="tag_syarikat"]').val();
|
||||
showMarhunDetailModal(e,tag_syarikat)
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user