perbaikan foto dan penambahan basic data foto objek jaminan, print-out
This commit is contained in:
majid
@@ -1,77 +1,115 @@
|
||||
@extends('layouts.main')
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="card w-full bg-white rounded-lg shadow-md h-100vh">
|
||||
<div class="card-header 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 class="card w-full bg-white rounded-lg shadow-md h-100vh">
|
||||
<div class="card-header 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>
|
||||
@php
|
||||
$inspeksiId = null;
|
||||
$documentId = null;
|
||||
$jenisJaminanId = null;
|
||||
|
||||
<!-- Iframe -->
|
||||
<iframe id="reportIframe" style="display:none" width="100%" height="600px"></iframe>
|
||||
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
|
||||
<div class="card-body relative flex flex-col h-[calc(100vh-4rem)] overflow-hidden">
|
||||
<!-- 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>
|
||||
|
||||
<div class="flex justify-between mt-4">
|
||||
<button id="zoomIn" class="btn btn-outline btn-primary">
|
||||
<i class="ki-filled ki-plus"></i>
|
||||
</button>
|
||||
<button id="zoomOut" class="btn btn-outline btn-warning">
|
||||
<i class="ki-filled ki-minus"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="iframe-container" style="width: 100%; border: 1px solid #ccc; height: 800px; overflow: hidden; margin: 10px;">
|
||||
<iframe id="reportIframe" width="100%" height="100%" style="border: none; transform-origin: top left;">
|
||||
</iframe>
|
||||
</div>
|
||||
|
||||
<div class="card-footer flex justify-end">
|
||||
<a href="{{ route('penilai.print-out') }}?permohonanId={{ $permohonan->id }}&documentId={{ $documentId }}&inspeksiId={{ $inspeksiId }}&jaminanId={{ $jenisJaminanId }}&statusLpj=0" class="btn btn-primary">
|
||||
<i class="ki-filled ki-printer"></i> Print
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</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`;
|
||||
const iframe = document.getElementById('reportIframe');
|
||||
const loading = document.getElementById('loading');
|
||||
const zoomInButton = document.getElementById('zoomIn');
|
||||
const zoomOutButton = document.getElementById('zoomOut');
|
||||
|
||||
// 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();
|
||||
// Initial zoom level
|
||||
let zoomLevel = 1;
|
||||
const url = `{{ route('penilai.print-out') }}?permohonanId={{ $permohonan->id }}&documentId={{ $documentId }}&jaminanId={{ $jenisJaminanId }}&statusLpj=true`;
|
||||
|
||||
// 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>
|
||||
// Display the loading spinner
|
||||
loading.style.display = 'flex';
|
||||
|
||||
// Load the content into the iframe
|
||||
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 the iframe
|
||||
const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
|
||||
iframeDoc.open();
|
||||
iframeDoc.write(html);
|
||||
iframeDoc.close();
|
||||
loading.style.display = 'none';
|
||||
iframe.style.display = 'block';
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Problem with fetch operation:', error);
|
||||
loading.innerHTML = `<p class="text-red-500">Failed to load the report. Please try again later.</p>`;
|
||||
});
|
||||
|
||||
// Zoom in function
|
||||
zoomInButton.addEventListener('click', function () {
|
||||
zoomLevel += 0.1; // Increase zoom level
|
||||
iframe.style.transform = `scale(${zoomLevel})`;
|
||||
iframe.style.transformOrigin = 'top left';
|
||||
iframe.style.width = `${100 / zoomLevel}%`;
|
||||
iframe.style.height = `${800 / zoomLevel}px`;
|
||||
});
|
||||
|
||||
// Zoom out function
|
||||
zoomOutButton.addEventListener('click', function () {
|
||||
zoomLevel = Math.max(0.5, zoomLevel - 0.1);
|
||||
iframe.style.transform = `scale(${zoomLevel})`;
|
||||
iframe.style.transformOrigin = 'top left';
|
||||
iframe.style.width = `${100 / zoomLevel}%`;
|
||||
iframe.style.height = `${800 / zoomLevel}px`;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* Loader styles */
|
||||
|
||||
Reference in New Issue
Block a user