daengdeni/lpj
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update denah bisa upload pdf

Browse Source
This commit is contained in:
majid
2024-12-10 08:55:30 +07:00
parent bccc89f794
commit a4139c1e19
2 changed files with 76 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/Http/Controllers/SurveyorController.php
View File

@@ -217,7 +217,7 @@ class SurveyorController extends Controller
try {
$maxSize = getMaxFileSize('Foto');
$validatedData = $request->validate([
'foto_denah' => 'required|image|mimes:jpeg,png,jpg,gif,svg|max:'. $maxSize,
'foto_denah' => 'required|file|mimes:jpeg,jpg,png,pdf,svg|max:'. $maxSize,
'luas' => 'required|numeric',
'permohonan_id' => 'required',
'jenis_jaminan_id' => 'required'
@@ -843,7 +843,7 @@ class SurveyorController extends Controller
$inspectionData = json_decode($inspeksi->data_form, true);
if (json_last_error() !== JSON_ERROR_NONE) {
throw new \Exception('Error decoding inspection data: ' . json_last_error_msg());
throw new \Exception('Harap mengisi form inspeksi terlebih dahulu.');
}
if ($inspeksi->data_pembanding) {

95
resources/views/surveyor/components/denah.blade.php
View File

@@ -5,6 +5,15 @@
@endsection
@section('content')
<style>
.pdf-preview {
width: 100%;
max-width: 100%;
border: 1px solid #ddd;
margin-top: 10px;
}
</style>
@include('lpj::assetsku.includenya')
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
<div class="card min-w-full">
@@ -130,34 +139,40 @@
<input type="hidden" value="{{ $permohonan->id }}" name="permohonan_id">
<input type="hidden" name="jenis_jaminan_id" value="{{ request('jenis_jaminan') }}">
<div class="mt-2">
<div class=""max-w-4xl mx-auto bg-white rounded-lg shadow-md overflow-hidden">
<div>
</div>
<div class=" mx-auto overflow-hidden">
<div class="flex flex-wrap gap-4" style="margin-top: 20px">
<div class="flex w-full items-center justify-center gap-4">
<div class="flex w-full items-center justify-center gap-4">
<label class="form-label max-w-56">
<span class="form-label">Upload Denah</span>
<span class="form-label">Upload Denah (Foto/PDF)</span>
</label>
<div class="w-full grid gap-5">
<img id="foto_denah-preview"
src="{{ isset($formDenah['foto_denah']) ? asset('storage/' . old('foto_denah', $formDenah['foto_denah'])) : '' }}"
alt="Gambar foto_denah"
style="{{ isset($formDenah['foto_denah']) ? 'width: 30rem;' : 'display: none;' }}">
<!-- Preview Container -->
<div id="preview-container">
<!-- Image preview -->
<img id="foto_denah-preview"
src="{{ isset($formDenah['foto_denah']) ? asset('storage/' . old('foto_denah', $formDenah['foto_denah'])) : '' }}"
alt="Gambar foto_denah"
style="{{ isset($formDenah['foto_denah']) && strpos($formDenah['foto_denah'], '.pdf') === false ? 'width: 30rem;' : 'display: none;' }}">
<!-- PDF preview -->
@if (isset($formDenah['foto_denah']) && strpos($formDenah['foto_denah'], '.pdf') !== false)
<div id="pdf-preview" class="pdf-preview">
<embed src="{{ asset('storage/' . $formDenah['foto_denah']) }}"
type="application/pdf" width="100%" height="500px">
</div>
@endif
</div>
<div class="input-group w-full flex gap-2">
<input type="file"
value="{{ old('foto_denah', isset($formDenah['foto_denah']) ? $formDenah['foto_denah'] : '') }}"
name="foto_denah" class="file-input file-input-bordered w-full "
accept="image/*" onchange="previewImage(this, 'foto_denah-preview')">
name="foto_denah" class="file-input file-input-bordered w-full"
accept=".jpg,.jpeg,.png,.pdf" onchange="previewFile(this)">
</div>
</div>
</div>
</div>
<em id="error-foto_denah" class="alert text-danger text-sm"></em>
</div>
</div>
@@ -202,18 +217,56 @@
@push('scripts')
<script>
function previewImage(input, previewId) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function(e) {
$('#' + previewId).attr('src', e.target.result).show();
function previewFile(input) {
const previewContainer = document.getElementById('preview-container');
const imagePreview = document.getElementById('foto_denah-preview');
const file = input.files[0];
// Hapus preview PDF yang ada (jika ada)
const existingPdfPreview = document.getElementById('pdf-preview');
if (existingPdfPreview) {
existingPdfPreview.remove();
}
if (file) {
// Cek tipe file
if (file.type.startsWith('image/')) {
// Jika file adalah gambar
imagePreview.style.display = 'block';
const reader = new FileReader();
reader.onload = function(e) {
imagePreview.src = e.target.result;
imagePreview.style.width = '30rem';
}
reader.readAsDataURL(file);
} else if (file.type === 'application/pdf') {
// Jika file adalah PDF
imagePreview.style.display = 'none';
// Buat preview PDF
const pdfPreview = document.createElement('div');
pdfPreview.id = 'pdf-preview';
pdfPreview.className = 'pdf-preview';
const pdfEmbed = document.createElement('embed');
pdfEmbed.src = URL.createObjectURL(file);
pdfEmbed.type = 'application/pdf';
pdfEmbed.width = '100%';
pdfEmbed.height = '500px';
pdfPreview.appendChild(pdfEmbed);
previewContainer.appendChild(pdfPreview);
}
reader.readAsDataURL(input.files[0]);
} else {
$('#' + previewId).hide();
// Jika tidak ada file yang dipilih
imagePreview.style.display = 'none';
imagePreview.src = '';
}
}
function submitDenah() {
const loadingOverlay = document.getElementById('loadingOverlay');
loadingOverlay.classList.remove('hidden');