026eb1115b
- Menambahkan border dan background pada elemen card dengan class `border-agi-100` dan `bg-agi-50`. - Perubahan berlaku di berbagai file blade untuk meningkatkan konsistensi UI.
95 lines
3.0 KiB
PHP
95 lines
3.0 KiB
PHP
@extends('layouts.main')
|
|
|
|
@section('content')
|
|
|
|
<div class="card border border-agi-100 w-full bg-white rounded-lg shadow-md h-100vh">
|
|
<div class="card-header bg-agi-50 flex justify-between items-center">
|
|
<h3 class="card-title uppercase">
|
|
Laporan
|
|
</h3>
|
|
<a href="{{ url()->previous() }}" class="btn btn-xs btn-info flex items-center">
|
|
<i class="ki-filled ki-exit-left"></i> Back
|
|
</a>
|
|
</div>
|
|
<div class="card-body relative flex flex-col h-[calc(100vh-4rem)]">
|
|
<!-- Loading Spinner -->
|
|
<div id="loading" class="absolute inset-0 flex items-center justify-center bg-gray-100 bg-opacity-50">
|
|
<div class="loader ease-linear rounded-full border-4 border-t-4 border-gray-200 h-12 w-12"></div>
|
|
<p class="text-gray-600 mt-2">Loading...</p>
|
|
</div>
|
|
|
|
<!-- Iframe -->
|
|
<iframe id="reportIframe" style="display:none" width="100%" height="600px"></iframe>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
@endsection
|
|
|
|
@php
|
|
$inspeksiId = null;
|
|
$documentId = null;
|
|
$jenisJaminanId = null;
|
|
|
|
foreach ($permohonan->debiture->documents as $item) {
|
|
if (!empty($item->inspeksi)) {
|
|
$inspeksiId = $item->inspeksi[0]->id; // Asumsi mengambil inspeksi pertama
|
|
}
|
|
$documentId = $item->id;
|
|
$jenisJaminanId = $item->jenis_jaminan_id;
|
|
}
|
|
@endphp
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const iframe = document.getElementById('reportIframe');
|
|
const loading = document.getElementById('loading');
|
|
const url = `{{ route('penilai.print-out') }}?permohonanId={{ $permohonan->id }}&documentId={{ $documentId }}&inspeksiId={{ $inspeksiId }}&jaminanId={{ $jenisJaminanId }}&statusLpj=true`;
|
|
|
|
// Show loading indicator
|
|
loading.style.display = 'flex';
|
|
fetch(url)
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error('Network response was not ok ' + response.statusText);
|
|
}
|
|
return response.text();
|
|
})
|
|
.then(html => {
|
|
// Load the content into iframe
|
|
const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
|
|
iframeDoc.open();
|
|
iframeDoc.write(html);
|
|
iframeDoc.close();
|
|
|
|
// Hide loading indicator and show iframe
|
|
loading.style.display = 'none';
|
|
iframe.style.display = 'block';
|
|
})
|
|
.catch(error => {
|
|
console.error('There has been a problem with your fetch operation:', error);
|
|
loading.innerHTML = `<p class="text-red-500">Failed to load the report. Please try again later.</p>`;
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<style>
|
|
/* Loader styles */
|
|
.loader {
|
|
border-color: #f3f3f3;
|
|
border-top-color: #3498db;
|
|
animation: spin 1s linear infinite;
|
|
}
|
|
|
|
@keyframes spin {
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
/* Full height for iframe */
|
|
.card-body {
|
|
position: relative;
|
|
}
|
|
</style>
|