Files
lpj/resources/views/surveyor/components/inspeksi.blade.php

336 lines
13 KiB
PHP

@extends('layouts.main')
@section('breadcrumbs')
{{ Breadcrumbs::render(request()->route()->getName()) }}
@endsection
@section('content')
@include('lpj::assetsku.includenya')
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
<form id="formInspeksi" method="POST" enctype="multipart/form-data" class="grid gap-5">
@csrf
<input type="hidden" name="permohonan_id" value="{{ $permohonan->id }}">
<input type="hidden" name="jenis_jaminan_id" value="{{ request('jenis_jaminan') }}">
@foreach ($permohonan->debiture->documents as $dokumen)
@if ($dokumen->jenisJaminan)
@php
$formKategori = json_decode($dokumen->jenisJaminan->form_kategori, true);
@endphp
@if (isset($formKategori) && $formKategori)
<input type="hidden" name="action"
value="{{ is_array($formKategori) ? implode(',', $formKategori) : $formKategori }}">
<input type="hidden" name="type"
value="{{ is_array($formKategori) ? implode(',', $formKategori) : $formKategori }}">
@if (is_array($formKategori))
@foreach ($formKategori as $kategori)
@include('lpj::surveyor.components.' . str_replace('-', '-', $kategori), [
'dokumen' => $dokumen,
])
@endforeach
@endif
@endif
@endif
@endforeach
<div class="flex justify-end gap-2" style="margin-right: 20px; margin-top: 20px">
<button type="button" class="btn btn-success" id="saveButton" onclick="submitData()">
<span id="saveButtonText">Save</span>
<div class="spinner-border spinner-border-sm text-light" role="status" style="display: none;"
id="saveButtonSpinner">
</div>
</button>
</div>
</form>
</div>
<!-- Loading Overlay -->
<div id="loadingOverlay" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50">
<div class="bg-white p-4 rounded-lg">
<div class="loader"></div>
<p class="mt-2 text-center">Sedang memproses...</p>
</div>
</div>
@endsection
@push('scripts')
<script type="text/javascript">
function updateAlamatFields(type) {
if (type === 'sesuai') {
// Update nilai form dengan data sesuai
document.getElementById('nama_jalan').value = "{{ $dokumen->address ?? '' }}";
document.getElementById('provinsi').value = "{{ $dokumen->province->code ?? '' }}";
document.getElementById('kota_kabupaten').value = "{{ $dokumen->city->code ?? '' }}";
document.getElementById('kecamatan').value = "{{ $dokumen->district->code ?? '' }}";
document.getElementById('desa_kelurahan').value = "{{ $dokumen->village->code ?? '' }}";
} else if (type === 'tidak sesuai') {
// Reset nilai form untuk input manual
document.getElementById('nama_jalan').value = '';
document.getElementById('provinsi').value = '';
document.getElementById('kota_kabupaten').value = '';
document.getElementById('kecamatan').value = '';
document.getElementById('desa_kelurahan').value = '';
}
}
function toggleFieldVisibility(fieldName, inputId, visibleValues = []) {
const selectedValue = $(`[name="${fieldName}"]:checked`).val();
const inputField = $(`#${inputId}`);
if (visibleValues.includes(selectedValue)) {
inputField.show();
} else {
inputField.hide().val('');
}
}
function toggleCheckboxVisibility(fieldName, inputId, visibleValues = []) {
const selectedValues = $(`[name="${fieldName}[]"]:checked`)
.map(function() {
return $(this).val().toLowerCase(); // Konversi nilai ke huruf kecil
})
.get();
const inputField = $(`#${inputId}`);
// Cek apakah salah satu nilai yang dipilih cocok dengan visibleValues
const shouldShow = visibleValues.some(value => selectedValues.includes(value.toLowerCase()));
if (shouldShow) {
inputField.show();
} else {
inputField.hide().val('');
}
}
function toggleMultipleFields(fieldName, mappings) {
// Ambil semua nilai checkbox yang dicentang
const selectedValues = $(`[name="${fieldName}[]"]:checked`)
.map(function() {
return $(this).val().toLowerCase(); // Konversi nilai ke huruf kecil
})
.get();
// Iterasi melalui setiap mapping
for (const [key, inputId] of Object.entries(mappings)) {
const inputField = $(`#${inputId}`);
// Tampilkan input jika nilai yang relevan dipilih
if (selectedValues.includes(key.toLowerCase())) {
inputField.show();
} else {
inputField.hide().val(''); // Sembunyikan dan reset nilai
}
}
}
function toggleAlamatVisibility(idSesuai, idTidakSesuai, selectedValue) {
// Ambil elemen berdasarkan ID
const alamatSesuai = document.getElementById(idSesuai);
const alamatTidakSesuai = document.getElementById(idTidakSesuai);
// Periksa nilai yang dipilih dan tampilkan elemen yang sesuai
if (selectedValue === 'sesuai') {
alamatSesuai.style.display = 'grid'; // Tampilkan "Alamat Sesuai"
alamatTidakSesuai.style.display = 'none'; // Sembunyikan "Alamat Tidak Sesuai"
} else if (selectedValue === 'tidak sesuai') {
alamatSesuai.style.display = 'none'; // Sembunyikan "Alamat Sesuai"
alamatTidakSesuai.style.display = 'grid'; // Tampilkan "Alamat Tidak Sesuai"
}
}
function submitData() {
const loadingOverlay = document.getElementById('loadingOverlay');
loadingOverlay.classList.remove('hidden');
loadingOverlay.classList.add('flex');
const formElement = $('#formInspeksi')[0];
const formData = new FormData(formElement);
formData.forEach((value, key) => {
console.log(key, value);
});
// $.ajax({
// url: '{{ route('surveyor.store') }}',
// type: 'POST',
// data: formData,
// processData: false,
// contentType: false,
// headers: {
// 'X-CSRF-TOKEN': '{{ csrf_token() }}'
// },
// success: function(response) {
// if (response.success) {
// Swal.fire({
// title: 'Berhasil!',
// text: response.message,
// icon: 'success',
// confirmButtonText: 'OK'
// }).then((response) => {
// if (response.isConfirmed) {
// window.location.href =
// '{{ route('surveyor.show', ['id' => $permohonan->id]) }}';
// }
// });
// } else {
// Swal.fire({
// title: 'Error!',
// text: response.message || 'Terjadi kesalahan',
// icon: 'error',
// confirmButtonText: 'OK'
// });
// }
// console.log(response);
// },
// error: function(xhr, status, error) {
// let errors = xhr.responseJSON?.errors;
// $('.alert').text('');
// if (errors) {
// $.each(errors, function(key, value) {
// $(`#error-${key}`).text(value[0]);
// });
// }
// console.error('Terjadi error:', error); // Menampilkan pesan error di konsol
// console.log('Status:', status);
// console.log('Response:', xhr.responseText);
// console.log(errors);
// toastrErrorBuild(error);
// },
// complete: function() {
// // Re-enable the button and hide the spinner
// loadingOverlay.classList.add('hidden');
// loadingOverlay.classList.remove('flex');
// }
// });
}
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();
}
reader.readAsDataURL(input.files[0]);
} else {
$('#' + previewId).hide();
}
}
function addClonableItem(containerId, itemClass) {
const container = document.getElementById(containerId);
if (!container) {
console.error(`Container with ID "${containerId}" not found.`);
return;
}
const template = container.querySelector(`.${itemClass}`);
if (!template) {
console.error(`Template with class "${itemClass}" not found in container "${containerId}".`);
return;
}
const newElement = template.cloneNode(true);
const textarea = newElement.querySelector('textarea');
if (textarea) {
textarea.value = '';
}
const deleteButton = newElement.querySelector('.remove-btn');
if (deleteButton) {
deleteButton.style.display = 'inline-block';
deleteButton.addEventListener('click', () => newElement.remove());
}
container.appendChild(newElement);
}
function updateAnalisa(params) {
const inputMap = {
jenis_asset: 'jenis_asset_tidak_sesuai',
analisa_tanah: 'analisa_tanah_tidak_sesuai',
analisa_unit: 'analisa_luas_unit_tidak_sesuai',
analisa_bangunan: 'analisa_bangunan_tidak_sesuai',
};
// Pastikan elemen ID ada di inputMap
if (!inputMap[params]) {
console.error('Parameter tidak valid:', params);
return;
}
// Ambil nilai berdasarkan parameter
const inputValue = document.getElementById(inputMap[params]).value;
const data = {
[params === 'jenis_asset' ? 'jenis_asset' : params.replace('analisa_', 'luas_')]: inputValue,
types: params
};
$.ajax({
url: '{{ route('surveyor.update_analisa', ['id' => $permohonan->id]) }}',
type: 'POST',
data: data,
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
},
success: function(response) {
console.log(response);
if (response.success) {
// window.location.href =
// '{{ route('surveyor.show', ['id' => $permohonan->id]) }}';
toastrSuccessBuild(response.message);
}
},
error: function(xhr, status, error) {
console.error('Terjadi error:', error);
console.log('Status:', status);
console.log('Response:', xhr.responseText);
if (xhr.responseJSON.message) {
toastrErrorBuild(xhr.responseJSON.message);
} else {
toastrErrorBuild('Terjadi kesalahan');
}
}
});
}
</script>
@endpush
<style>
.loader {
border: 4px solid #f3f3f3;
border-radius: 50%;
border-top: 4px solid #3498db;
width: 40px;
height: 40px;
animation: spin 1s linear infinite;
margin: 0 auto;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.scrollable-x-auto {
overflow-x: auto;
max-width: 100%;
}
.table {
min-width: 100%;
}
</style>