226 lines
7.8 KiB
PHP
226 lines
7.8 KiB
PHP
@extends('layouts.appmin')
|
|
|
|
@section('tajuk')
|
|
Pemeriksaan Tapak Permohonan Lesen Penjaja
|
|
@endsection
|
|
|
|
@section('css')
|
|
|
|
<!-- Select2 -->
|
|
<link rel="stylesheet" href="{{ asset('plugins/select2/css/select2.min.css') }}">
|
|
<link rel="stylesheet" href="{{ asset('plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css') }}">
|
|
<link href="{{ asset('css/jsapi-template-main.css') }}" rel="stylesheet" type="text/css"/>
|
|
<style>
|
|
#viewDiv {
|
|
padding: 0;
|
|
margin: 0;
|
|
height: 500px;
|
|
width: 100%;
|
|
}
|
|
|
|
@if($show == 'dokumen')
|
|
#preview-container {
|
|
overflow: auto;
|
|
background: #f9f9f9;
|
|
text-align: center;
|
|
}
|
|
canvas {
|
|
display: inline-block;
|
|
}
|
|
@endif
|
|
|
|
</style>
|
|
@endsection
|
|
|
|
|
|
@section('breadcrumb')
|
|
<ul class="breadcrumbs mb-3">
|
|
<li class="nav-home">
|
|
<a href="#">
|
|
<i class="icon-home"></i>
|
|
</a>
|
|
</li>
|
|
<li class="separator">
|
|
<i class="icon-arrow-right"></i>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="#">Penjaja</a>
|
|
</li>
|
|
<li class="separator">
|
|
<i class="icon-arrow-right"></i>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="#">Pemeriksaan Tapak</a>
|
|
</li>
|
|
<li class="separator">
|
|
<i class="icon-arrow-right"></i>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a href="#">Papar Permohonan</a>
|
|
</li>
|
|
</ul>
|
|
@endsection
|
|
|
|
@section('content')
|
|
<div class="row mb-3">
|
|
<div class="col-md-12">
|
|
<a href="{{route('admin.papar', [$mohon_id])}}" class="btn btn-primary mx-1 my-2">Permohonan</a>
|
|
<a href="{{route('admin.papar-map', [$mohon_id])}}" class="btn btn-primary mx-1 my-2">Peta Lokasi</a>
|
|
<a href="{{route('admin.papar-dokumen', [$mohon_id])}}" class="btn btn-primary mx-1 my-2">Dokumen</a>
|
|
<a href="{{route('admin.papar-wangproses', [$mohon_id])}}" class="btn btn-primary mx-1 my-2">Wang Proses</a>
|
|
|
|
@if(in_array($permohonan?->status_progress, ['lawatan tapak','ulasan pegawai','ulasan pengarah','sokong dibawa ke mesyuarat','ditangguhkan','keputusan diperolehi']))
|
|
<a href="{{route('admin.papar-pemeriksaan', [$mohon_id])}}" class="btn btn-primary mx-1 my-2">Ulasan
|
|
@if(in_array($show, ['ulasan ik', 'cadangan pegawai', 'cadangan pengarah']))
|
|
<i class="fa fa-angle-down" aria-hidden="true"></i>
|
|
@else
|
|
<i class="fa fa-angle-right" aria-hidden="true"></i>
|
|
@endif
|
|
</a>
|
|
<a href="{{route('admin.papar-lesen', [$mohon_id])}}" class="btn btn-primary mx-1 my-2">Lesen </a>
|
|
@endif
|
|
|
|
</div>
|
|
</div>
|
|
@if($show == 'utama')
|
|
@include('admin.penjaja.partials.pemohon_ssm')
|
|
@elseif($show == 'lokasi')
|
|
@include('admin.penjaja.partials.lokasi')
|
|
@elseif($show == 'dokumen')
|
|
@include('admin.penjaja.partials.dokumen')
|
|
@elseif($show == 'wang proses')
|
|
@include('admin.penjaja.partials.wangproses_nofail')
|
|
@elseif($show == 'lesen')
|
|
@include('admin.penjaja.partials.daftar_lesen')
|
|
@elseif($show == 'ulasan ik')
|
|
@include('admin.penjaja.partials.ulasan')
|
|
@elseif($show == 'cadangan pegawai')
|
|
@include('admin.penjaja.partials.cadangan_pegawai')
|
|
@elseif($show == 'cadangan pengarah')
|
|
@include('admin.penjaja.partials.ulasan_cadangan_pegawai')
|
|
@endif
|
|
@endsection
|
|
|
|
@section('js')
|
|
<!-- Select2 -->
|
|
<script src="{{ asset('plugins/select2/js/select2.full.min.js') }}"></script>
|
|
|
|
@if($show == 'dokumen')
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/pdfjs-dist/wasm/openjpeg_nowasm_fallback.min.js"></script>
|
|
<script type="module" src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.16.105/pdf.min.js"></script>
|
|
<script type="module" src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.16.105/pdf.worker.min.js"></script>
|
|
|
|
<script type="module">
|
|
|
|
let currentUrl = null;
|
|
let zoom = 1.0;
|
|
|
|
|
|
$(document).ready(function() {
|
|
$('.dokumen-item').on('click', function() {
|
|
let url = $(this).data('url');
|
|
currentUrl = url;
|
|
loadFile(url);
|
|
});
|
|
|
|
// attach button listeners (module-safe)
|
|
document.getElementById('btn-zoom-in').addEventListener('click', () => {
|
|
zoom += 0.2;
|
|
if (currentUrl) loadFile(currentUrl);
|
|
});
|
|
document.getElementById('btn-zoom-out').addEventListener('click', () => {
|
|
zoom = Math.max(0.5, zoom - 0.2);
|
|
if (currentUrl) loadFile(currentUrl);
|
|
});
|
|
});
|
|
|
|
function loadFile(url) {
|
|
const ext = url.split('.').pop().toLowerCase();
|
|
if (['pdf'].includes(ext)) {
|
|
loadPDF(url);
|
|
} else if (['jpg','jpeg','png'].includes(ext)) {
|
|
loadImage(url);
|
|
} else {
|
|
console.warn("Format tak disokong:", ext);
|
|
}
|
|
}
|
|
|
|
// ... (sertakan semula loadPDF dan loadImage dari code kau)
|
|
function loadPDF(url){
|
|
const canvas = document.getElementById('pdf-canvas');
|
|
const context = canvas.getContext('2d');
|
|
const container = document.getElementById('preview-container');
|
|
|
|
pdfjsLib.getDocument(url).promise.then(pdf => {
|
|
pdf.getPage(1).then(page => {
|
|
const containerWidth = container.clientWidth;
|
|
const viewport = page.getViewport({ scale: 1 });
|
|
const scale = (containerWidth / viewport.width) * zoom;
|
|
const scaledViewport = page.getViewport({ scale: scale });
|
|
const outputScale = window.devicePixelRatio || 1;
|
|
|
|
canvas.width = Math.floor(scaledViewport.width * outputScale);
|
|
canvas.height = Math.floor(scaledViewport.height * outputScale);
|
|
canvas.style.width = Math.floor(scaledViewport.width) + "px";
|
|
canvas.style.height = Math.floor(scaledViewport.height) + "px";
|
|
|
|
const renderContext = {
|
|
canvasContext: context,
|
|
viewport: scaledViewport,
|
|
transform: [outputScale, 0, 0, outputScale, 0, 0],
|
|
};
|
|
|
|
context.clearRect(0,0,canvas.width,canvas.height);
|
|
page.render(renderContext);
|
|
});
|
|
}).catch(err => console.error("Error loading PDF:", err));
|
|
}
|
|
|
|
function loadImage(url) {
|
|
const canvas = document.getElementById('pdf-canvas');
|
|
const context = canvas.getContext('2d');
|
|
const container = document.getElementById('preview-container');
|
|
const img = new Image();
|
|
img.crossOrigin = "anonymous";
|
|
|
|
img.onload = function() {
|
|
const containerWidth = container.clientWidth;
|
|
const containerHeight = container.clientHeight;
|
|
|
|
// ukuran asal imej
|
|
const originalWidth = img.width;
|
|
const originalHeight = img.height;
|
|
|
|
// skala fit ke dalam container (hanya digunakan pada zoom = 1)
|
|
const fitScale = Math.min(containerWidth / originalWidth, containerHeight / originalHeight);
|
|
|
|
// guna zoom multiplier (supaya bila zoom berubah, betul-betul besar/kecil)
|
|
const finalWidth = originalWidth * fitScale * zoom;
|
|
const finalHeight = originalHeight * fitScale * zoom;
|
|
|
|
// set saiz canvas ikut saiz baru
|
|
canvas.width = finalWidth;
|
|
canvas.height = finalHeight;
|
|
|
|
// clear dan lukis imej
|
|
/* context.clearRect(0, 0, canvas.width, canvas.height);
|
|
context.drawImage(img, 0, 0, canvas.width, canvas.height); */
|
|
context.save();
|
|
context.translate(canvas.width / 2, canvas.height / 2);
|
|
context.scale(zoom, zoom);
|
|
context.drawImage(img, -img.width * fitScale / 2, -img.height * fitScale / 2, img.width * fitScale, img.height * fitScale);
|
|
context.restore();
|
|
};
|
|
|
|
img.onerror = function() {
|
|
console.error("Error loading image:", url);
|
|
};
|
|
|
|
img.src = url;
|
|
}
|
|
|
|
</script>
|
|
@endif
|
|
|
|
@endsection |