205 lines
8.4 KiB
PHP
205 lines
8.4 KiB
PHP
@php
|
|
$hasScanIc = !empty($customer_info['has_scan_ic']);
|
|
$scanIcMime = strtolower((string) ($customer_info['scan_ic_mime'] ?? ''));
|
|
$scanIcIsPdf = strpos($scanIcMime, 'pdf') !== false;
|
|
$scanIcNoic = !empty($customer_info['kpbaru']) ? $customer_info['kpbaru'] : ($customer_info['kplama'] ?? '');
|
|
$scanIcPreviewUrl = $hasScanIc
|
|
? route('customer.showIcScan', ['icno' => $scanIcNoic, 't' => $customer_info['scan_ic'] ?? time()])
|
|
: '';
|
|
@endphp
|
|
|
|
<style>
|
|
.ic-scan-card {
|
|
border: 1px dashed #c5cdd6;
|
|
border-radius: 8px;
|
|
background: #f8f9fb;
|
|
padding: 16px;
|
|
margin: 0 15px 18px;
|
|
}
|
|
.ic-scan-card.is-missing {
|
|
border-color: #e0a800;
|
|
background: #fff8e8;
|
|
}
|
|
.ic-scan-preview {
|
|
max-width: 220px;
|
|
max-height: 140px;
|
|
object-fit: contain;
|
|
border: 1px solid #d0d5dd;
|
|
border-radius: 4px;
|
|
background: #fff;
|
|
}
|
|
</style>
|
|
|
|
<div id="ic-scan-card" class="ic-scan-card {{ $hasScanIc ? '' : 'is-missing' }}">
|
|
<div class="d-flex flex-wrap align-items-start justify-content-between">
|
|
<div>
|
|
<b>Scan Dokumen IC / Passport <span class="text-danger">*</span></b>
|
|
<div class="text-muted small mt-1">
|
|
Wajib dimuat naik sebelum daftar pembiayaan. Format JPG, PNG atau PDF (maks 4MB).
|
|
</div>
|
|
<div id="ic-scan-status" class="mt-2">
|
|
@if ($hasScanIc)
|
|
<span class="badge badge-success">Telah dimuat naik</span>
|
|
@else
|
|
<span class="badge badge-warning">Belum dimuat naik</span>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
<div class="mt-2 mt-md-0">
|
|
<input type="file" id="ic_scan_file" accept=".jpg,.jpeg,.png,.pdf,image/jpeg,image/png,application/pdf" class="d-none">
|
|
<button type="button" class="btn btn-outline-primary btn-sm" id="ic_scan_pick">
|
|
<i class="fas fa-upload mr-1"></i>{{ $hasScanIc ? 'Muat naik semula' : 'Pilih fail' }}
|
|
</button>
|
|
<button type="button" class="btn btn-primary btn-sm d-none" id="ic_scan_upload">Muat Naik</button>
|
|
</div>
|
|
</div>
|
|
<div id="ic-scan-preview-wrap" class="mt-3 {{ $hasScanIc ? '' : 'd-none' }}">
|
|
@if ($hasScanIc && $scanIcIsPdf)
|
|
<a id="ic-scan-pdf-link" href="{{ $scanIcPreviewUrl }}" target="_blank" rel="noopener">Lihat fail PDF</a>
|
|
<img id="ic-scan-preview-img" src="" alt="Preview scan IC" class="ic-scan-preview d-none">
|
|
@else
|
|
<a id="ic-scan-pdf-link" href="{{ $scanIcPreviewUrl }}" target="_blank" rel="noopener" class="{{ $hasScanIc ? 'd-none' : 'd-none' }}">Lihat fail PDF</a>
|
|
<img id="ic-scan-preview-img"
|
|
src="{{ $hasScanIc ? $scanIcPreviewUrl : '' }}"
|
|
alt="Preview scan IC"
|
|
class="ic-scan-preview {{ $hasScanIc ? '' : 'd-none' }}">
|
|
@endif
|
|
<div id="ic-scan-filename" class="small text-muted mt-1">{{ $customer_info['scan_ic_filename'] ?? '' }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
window.hasScanIc = @json($hasScanIc);
|
|
|
|
(function() {
|
|
var fileInput = document.getElementById('ic_scan_file');
|
|
var pickBtn = document.getElementById('ic_scan_pick');
|
|
var uploadBtn = document.getElementById('ic_scan_upload');
|
|
var previewWrap = document.getElementById('ic-scan-preview-wrap');
|
|
var previewImg = document.getElementById('ic-scan-preview-img');
|
|
var pdfLink = document.getElementById('ic-scan-pdf-link');
|
|
var filenameEl = document.getElementById('ic-scan-filename');
|
|
var statusEl = document.getElementById('ic-scan-status');
|
|
var card = document.getElementById('ic-scan-card');
|
|
var selectedFile = null;
|
|
var storeUrl = @json(route('customer.storeIcScan'));
|
|
var previewUrl = @json(route('customer.showIcScan', ['icno' => $scanIcNoic]));
|
|
var csrf = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
|
|
var icno = @json($scanIcNoic);
|
|
|
|
function showUploadedState(filename, mime) {
|
|
window.hasScanIc = true;
|
|
card.classList.remove('is-missing');
|
|
statusEl.innerHTML = '<span class="badge badge-success">Telah dimuat naik</span>';
|
|
pickBtn.innerHTML = '<i class="fas fa-upload mr-1"></i>Muat naik semula';
|
|
uploadBtn.classList.add('d-none');
|
|
previewWrap.classList.remove('d-none');
|
|
filenameEl.textContent = filename || '';
|
|
var url = previewUrl + (previewUrl.indexOf('?') === -1 ? '?' : '&') + 't=' + Date.now();
|
|
if ((mime || '').indexOf('pdf') !== -1) {
|
|
previewImg.classList.add('d-none');
|
|
pdfLink.classList.remove('d-none');
|
|
pdfLink.setAttribute('href', url);
|
|
} else {
|
|
pdfLink.classList.add('d-none');
|
|
previewImg.classList.remove('d-none');
|
|
previewImg.src = url;
|
|
}
|
|
}
|
|
|
|
pickBtn.addEventListener('click', function() {
|
|
fileInput.click();
|
|
});
|
|
|
|
fileInput.addEventListener('change', function() {
|
|
selectedFile = fileInput.files && fileInput.files[0] ? fileInput.files[0] : null;
|
|
if (!selectedFile) {
|
|
uploadBtn.classList.add('d-none');
|
|
return;
|
|
}
|
|
|
|
if (selectedFile.size > 4 * 1024 * 1024) {
|
|
selectedFile = null;
|
|
fileInput.value = '';
|
|
Swal.fire({
|
|
icon: 'error',
|
|
title: 'Fail terlalu besar',
|
|
text: 'Saiz fail maksimum 4MB.'
|
|
});
|
|
return;
|
|
}
|
|
|
|
uploadBtn.classList.remove('d-none');
|
|
previewWrap.classList.remove('d-none');
|
|
filenameEl.textContent = selectedFile.name;
|
|
|
|
if (selectedFile.type === 'application/pdf') {
|
|
previewImg.classList.add('d-none');
|
|
pdfLink.classList.remove('d-none');
|
|
pdfLink.setAttribute('href', URL.createObjectURL(selectedFile));
|
|
} else {
|
|
pdfLink.classList.add('d-none');
|
|
previewImg.classList.remove('d-none');
|
|
var reader = new FileReader();
|
|
reader.onload = function(e) {
|
|
previewImg.src = e.target.result;
|
|
};
|
|
reader.readAsDataURL(selectedFile);
|
|
}
|
|
});
|
|
|
|
uploadBtn.addEventListener('click', function() {
|
|
if (!selectedFile) {
|
|
Swal.fire({
|
|
icon: 'warning',
|
|
title: 'Tiada fail',
|
|
text: 'Sila pilih scan dokumen IC terlebih dahulu.'
|
|
});
|
|
return;
|
|
}
|
|
|
|
var formData = new FormData();
|
|
formData.append('icno', icno);
|
|
formData.append('scan_ic', selectedFile);
|
|
|
|
uploadBtn.disabled = true;
|
|
uploadBtn.textContent = 'Memuat naik...';
|
|
|
|
fetch(storeUrl, {
|
|
method: 'POST',
|
|
headers: {
|
|
'X-CSRF-TOKEN': csrf,
|
|
'Accept': 'application/json'
|
|
},
|
|
body: formData
|
|
}).then(function(res) {
|
|
return res.json().then(function(body) {
|
|
return { ok: res.ok, body: body };
|
|
});
|
|
}).then(function(result) {
|
|
uploadBtn.disabled = false;
|
|
uploadBtn.textContent = 'Muat Naik';
|
|
if (!result.ok || !result.body || !result.body.stored) {
|
|
throw new Error((result.body && (result.body.error || result.body.message)) || 'Gagal memuat naik scan IC.');
|
|
}
|
|
showUploadedState(selectedFile.name, selectedFile.type);
|
|
selectedFile = null;
|
|
fileInput.value = '';
|
|
Swal.fire({
|
|
icon: 'success',
|
|
title: 'Berjaya',
|
|
text: 'Scan dokumen IC telah dimuat naik.'
|
|
});
|
|
}).catch(function(err) {
|
|
uploadBtn.disabled = false;
|
|
uploadBtn.textContent = 'Muat Naik';
|
|
Swal.fire({
|
|
icon: 'error',
|
|
title: 'Tidak berjaya',
|
|
text: err.message || 'Gagal memuat naik scan IC.'
|
|
});
|
|
});
|
|
});
|
|
})();
|
|
</script>
|