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

403 lines
25 KiB
PHP

<div class="card border border-agi-100 w-full rounded-lg shadow-md overflow-hidden">
<div class="card-header light:bg-agi-50">
<h3 class="card-title uppercase">
Analisa Bangunan
</h3>
</div>
<div class="card-body">
<div class="grid gap-5">
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">Luas Bangunan(IMB)</label>
<div class="mt-2">
@if (isset($permohonan->documents))
@foreach ($permohonan->documents as $item)
@php
$luas_bangunan = 0;
$jenis_legalitas_jaminan_id = 0;
if ($item->detail) {
foreach ($item->detail as $luas) {
if (isset($luas->name) && $luas->jenis_legalitas_jaminan_id === 10) {
$jenis_legalitas_jaminan_id = $luas->jenis_legalitas_jaminan_id;
$details = json_decode($luas->details, true);
$luas_bangunan = isset($details['luas_bangunan']) ? $details['luas_bangunan'] : 0;
break;
}
}
}
@endphp
<input type="hidden"
id="jenis_legalistas_jaminan_bangunan_id"
name="jenis_legalistas_jaminan_bangunan_id"
class="input" value="{{ $jenis_legalitas_jaminan_id }}">
<input type="hidden" name="luas_bangunan_sesuai" class="input" value="{{ $luas_bangunan }}">
<p class="text-2sm text-gray-700">{{ $luas_bangunan }} m<sup>2</sup></p>
@endforeach
@endif
<div class="flex-wrap items-stretch">
<div class="grid grid-cols-2 md:grid-cols-3 gap-4 mt-2">
<label class="form-label flex items-center gap-3 text-nowrap">
<input type="radio"
onclick="toggleFieldVisibility('luas_tanah_bagunan', 'luas_tanah_bagunan_tidak_sesuai', ['tidak sesuai'])"
class="radio" name="luas_tanah_bagunan" value="sesuai"
{{ old('luas_tanah_bagunan', isset($forminspeksi['bangunan']['luas_tanah_bagunan']['sesuai'])) ? 'checked' : '' }}>
<span class="ml-2">Sesuai</span>
</label>
<label class="form-label flex items-center gap-2.5 text-nowrap">
<input type="radio" class="radio" name="luas_tanah_bagunan"
onclick="toggleFieldVisibility('luas_tanah_bagunan', 'luas_tanah_bagunan_tidak_sesuai', ['tidak sesuai'])"
value="tidak sesuai"
{{ old('luas_tanah_bagunan', isset($forminspeksi['bangunan']['luas_tanah_bagunan']['tidak sesuai'])) ? 'checked' : '' }}>
<span class="ml-2">Tidak Sesuai</span>
</label>
@php
$statusKey = isset($forminspeksi['bangunan']['luas_tanah_bagunan']['sesuai'])
? 'sesuai'
: 'tidak sesuai';
$selectedData = $forminspeksi['bangunan']['luas_tanah_bagunan'][$statusKey] ?? null;
@endphp
<div id="luas_tanah_bagunan_tidak_sesuai" class="flex items-baseline gap-2"
style="{{ old('luas_tanah_bagunan_tidak_sesuai', $selectedData) ? '' : 'display: none' }}">
<div class="input">
<input type="text" id="analisa_bangunan_tidak_sesuai"
name="luas_tanah_bagunan_tidak_sesuai" class="w-full number-format"
placeholder="Masukan Luas Bangunan Tidak Sesuai..."
value="{{ old('luas_tanah_bagunan_tidak_sesuai', $forminspeksi['bangunan']['luas_tanah_bagunan']['tidak sesuai'] ?? '') }}">
</div>
<button type="button" class="btn btn-md btn-primary"
onclick="updateAnalisa('analisa_bangunan')">
Save
</button>
</div>
</div>
<em id="error-luas_tanah_bagunan" class="alert text-danger text-sm"></em>
</div>
</div>
</div>
<!-- Jenis Bangunan -->
<div class="flex items-stretch flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">Jenis Bangunan</label>
<div class="flex-wrap items-stretch">
<div class="flex flex-col items-start gap-4">
@if (isset($basicData['jenisBangunan']))
@foreach ($basicData['jenisBangunan'] as $item)
<label class="form-label flex items-center gap-2.5 text-nowrap">
<input class="checkbox" name="jenis_bangunan[]" type="checkbox"
value="{{ $item->name }}"
{{ (is_array(old('jenis_bangunan')) && in_array($item->name, old('jenis_bangunan'))) ||
(isset($forminspeksi['bangunan']['jenis_bangunan']) &&
(is_array($forminspeksi['bangunan']['jenis_bangunan']) &&
in_array($item->name, $forminspeksi['bangunan']['jenis_bangunan'])))
? 'checked'
: '' }}
onclick="toggleCheckboxVisibility('jenis_bangunan', 'jenis_bangunan_lainnya', ['lainnya'])" />
{{ $item->name }}
</label>
@if (strcasecmp($item->name, 'Lainnya') == 0)
<input id="jenis_bangunan_lainnya" type="text" style="display: none;"
name="jenis_bangunan_lainnya" class="input w-full mt-2"
placeholder="Masukkan lainnya..." />
@endif
@endforeach
@endif
</div>
<em id="error-jenis_bangunan" class="alert text-danger text-sm"></em>
</div>
</div>
<!-- Kondisi Bangunan -->
<div class="flex items-stretch flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">Kondisi Bangunan</label>
<div class="flex-wrap items-stretch">
<div class="flex flex-col items-start gap-4">
@if (isset($basicData['kondisiBangunan']))
@foreach ($basicData['kondisiBangunan'] as $item)
<label class="form-label flex items-center gap-2.5 text-nowrap">
<input class="checkbox" name="kondisi_bangunan[]" type="checkbox"
value="{{ $item->name }}"
{{ in_array($item->name, old('kondisi_bangunan', $forminspeksi['bangunan']['kondisi_bangunan'] ?? [])) ? 'checked' : '' }} />
{{ $item->name }}
</label>
@if (strcasecmp($item->name, 'lainnya') == 0)
<div class="flex items-center">
<label class="form-label flex items-center gap-2.5 text-nowrap">
<input class="checkbox" name="kondisi_bangunan[]" type="checkbox"
value="{{ $item->name }}"
{{ in_array($item->name, old('kondisi_bangunan', $forminspeksi['bangunan']['kondisi_bangunan'] ?? [])) ? 'checked' : '' }} />
{{ $item->name }}
</label>
<input type="text" name="kondisi_bangunan_lainnya" class="input mt-2"
id="bentukTanahInput" placeholder="Masukkan Kondisi Bangunan..."
value="{{ old('kondisi_bangunan_lainnya', $forminspeksi['bangunan']['kondisi_bangunan_lainnya'] ?? '') }}">
</div>
@endif
@endforeach
@endif
</div>
<em id="error-kondisi_bangunan" class="alert text-danger text-sm"></em>
</div>
</div>
<!-- Sifat Bangunan -->
<div class="flex items-stretch flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">Sifat Bangunan</label>
<div class="flex-wrap items-stretch">
<div class="flex flex-col items-start gap-4">
@if (isset($basicData['sifatBangunan']))
@foreach ($basicData['sifatBangunan'] as $item)
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56 gap-2.5" style="width: 500px">
<input class="checkbox" name="sifat_bangunan[]" type="checkbox"
value="{{ $item->name }}"
{{ in_array($item->name, old('sifat_bangunan', $forminspeksi['bangunan']['sifat_bangunan'] ?? [])) ? 'checked' : '' }} />
{{ $item->name }}
</label>
<input type="text" name="sifat_bangunan_input[]" class="input w-full"
id="sifat_bangunan" placeholder="Masukkan {{ $item->name }}..."
value="{{ old('sifat_bangunan_input.' . $loop->index, $forminspeksi['bangunan']['sifat_bangunan_input'][$loop->index] ?? '') }}">
</div>
@endforeach
@endif
</div>
<em id="error-sifat_bangunan" class="alert text-danger text-sm"></em>
</div>
</div>
<!-- Spek Bangunan -->
<div class="gap-2.5">
<div class="flex items-stretch flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">Spek Bangunan</label>
<div class="flex flex-wrap items-baseline w-full" id="spek-bangunan-container">
@if (isset($forminspeksi['bangunan']) && is_array($forminspeksi['bangunan']))
@foreach ($forminspeksi['bangunan']['spesifikasi_bangunan'] as $index => $bangunan)
<div class="spek-bangunan w-full gap-4 mt-5">
<input type="hidden" name="nama_bangunan[]"
value="{{ isset($bangunan['bagunan']) ? $bangunan['bagunan'] : 'Bangunan ' . ($index + 1) }}"
required>
<label
class="building-label form-label">{{ isset($bangunan['bagunan']) ? $bangunan['bagunan'] : 'Bangunan ' . ($index + 1) }}</label>
<div class="grid grid-cols-2 md:grid-cols-3 gap-4 mt-2 w-full">
@if (@isset($basicData['spekKategoriBangunan']))
@foreach ($basicData['spekKategoriBangunan'] as $item)
<div>
<input type="hidden" name="spek_kategori_bangunan[]" value="{{ $item->name }}">
<label
class="form-label flex items-center gap-3 text-nowrap">{{ $item->name }}</label>
<div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4" style="margin-top: 10px">
@foreach ($basicData['spekBangunan'] as $spek)
@if ($spek->spek_kategori_bangunan_id == $item->id)
<label class="form-label flex items-center gap-2.5">
<input class="checkbox"
name="spek_bangunan[{{ $index }}][{{ $item->name }}][]"
type="checkbox"
value="{{ $spek->name }}"
{{ isset($bangunan['spek_kategori_bangunan'][$item->name]) &&
in_array($spek->name, $bangunan['spek_kategori_bangunan'][$item->name])
? 'checked'
: '' }} />
{{ $spek->name }}
</label>
@endif
@endforeach
<label class="form-label flex items-center gap-2.5 mt-2">
<input class="input" type="text"
name="spek_bangunan[{{ $index }}][{{ $item->name }}][lainnya]"
placeholder="Lainnya (sebutkan)"
value="{{ isset($bangunan['spek_kategori_bangunan'][$item->name]['lainnya']) ? $bangunan['spek_kategori_bangunan'][$item->name]['lainnya'] : '' }}">
</label>
</div>
<em id="error-spek_bangunan_{{ $item->name }}" class="alert text-danger text-sm"></em>
</div>
</div>
@endforeach
@endif
</div>
<button type="button" class="mt-2 btn btn-danger btn-outline btn-xs delete-button" style="display: none;">Hapus</button>
</div>
@endforeach
@else
<div class="spek-bangunan w-full gap-4 mt-5">
<input type="hidden" name="nama_bangunan[]" value="Bangunan 1" required>
<label class="building-label form-label">Bangunan 1</label>
<div class="grid grid-cols-2 md:grid-cols-3 gap-4 mt-2 w-full">
@if (@isset($basicData['spekKategoriBangunan']))
@foreach ($basicData['spekKategoriBangunan'] as $item)
<div>
<input type="hidden" name="spek_kategori_bangunan[]" value="{{ $item->name }}">
<label class="form-label flex items-center gap-3 text-nowrap">{{ $item->name }}</label>
<div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4" style="margin-top: 10px">
@foreach ($basicData['spekBangunan'] as $spek)
@if ($spek->spek_kategori_bangunan_id == $item->id)
<label class="form-label flex items-center gap-2.5">
<input class="checkbox"
name="spek_bangunan[0][{{ $item->name }}][]"
type="checkbox"
value="{{ $spek->name }}" />
{{ $spek->name }}
</label>
@endif
@endforeach
<label class="form-label flex items-center gap-2.5 mt-2">
<input class=input" type="text"
name="spek_bangunan[0][{{ $item->name }}][lainnya]"
placeholder="Lainnya (sebutkan)">
</label>
</div>
<em id="error-spek_bangunan_{{ $item->name }}" class="alert text-danger text-sm"></em>
</div>
</div>
@endforeach
@endif
</div>
<button type="button" class="mt-2 btn btn-danger btn-outline btn-xs delete-button" style="display: none;">Hapus</button>
</div>
@endif
</div>
</div>
<div class="flex justify-end">
<button class="btn btn-xs btn-primary" type="button" id="addBagunan">
tambah bangunan
<i class="ki-filled ki-plus"></i>
</button>
</div>
</div>
<!-- Sarana pelengkap -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">Sarana Pelengkap</label>
<div class="flex-wrap items-stretch">
<div class="flex flex-col items-start gap-4">
@if (isset($basicData['saranaPelengkap']))
@foreach ($basicData['saranaPelengkap'] as $item)
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56 gap-2.5" style="width: 500px">
<input class="checkbox" name="sarana_pelengkap[]" type="checkbox"
value="{{ $item->name }}"
{{ in_array($item->name, (array) old('sarana_pelengkap', $forminspeksi['bangunan']['sarana_pelengkap'] ?? [])) ? 'checked' : '' }} />
{{ $item->name }}
</label>
<input type="text" name="sarana_pelengkap_input[]" class="input w-full"
placeholder="Masukkan {{ $item->name }}..."
value="{{ old('sarana_pelengkap_input.' . $loop->index, $forminspeksi['bangunan']['sarana_pelengkap_input'][$loop->index] ?? '') }}">
</div>
@endforeach
@endif
</div>
<em id="error-sarana_pelengkap" class="alert text-danger text-sm"></em>
</div>
</div>
</div>
</div>
</div>
@push('scripts')
<script>
const spekBangunanContainer = document.getElementById('spek-bangunan-container');
function updateDeleteButtonsVisibility() {
const allDeleteButtons = spekBangunanContainer.querySelectorAll('.delete-button');
allDeleteButtons.forEach(button => {
button.style.display = spekBangunanContainer.querySelectorAll('.spek-bangunan').length > 1 ?
'inline-block' : 'none';
});
}
function updateBuildingLabels() {
const allSpekBangunan = spekBangunanContainer.querySelectorAll('.spek-bangunan');
allSpekBangunan.forEach((div, index) => {
const label = div.querySelector('.building-label');
const nameInput = div.querySelector('input[name^="nama_bangunan"]');
if (label) {
const buildingName = `Bangunan ${index + 1}`;
label.textContent = buildingName;
if (nameInput) {
nameInput.value = buildingName;
}
}
});
}
function updateInputNames(container, index) {
container.querySelectorAll('input').forEach(input => {
if (input.name) {
if (input.name.includes('[')) {
if (input.name.startsWith('spek_bangunan')) {
// Handle spek_bangunan inputs
const matches = input.name.match(/spek_bangunan\[\d+\]\[(.*?)\]/);
if (matches) {
input.name = `spek_bangunan[${index}][${matches[1]}][]`;
}
} else {
// Handle lainnya array inputs
input.name = input.name.replace(/\[\d*\]/, `[${index}]`);
}
}
}
});
}
document.getElementById('addBagunan').addEventListener('click', function() {
const newDiv = spekBangunanContainer.querySelector('.spek-bangunan').cloneNode(true);
const newIndex = spekBangunanContainer.querySelectorAll('.spek-bangunan').length;
// Reset and update inputs
newDiv.querySelectorAll('input').forEach(input => {
if (input.type === 'checkbox') {
input.checked = false;
} else {
input.value = '';
}
});
// Update input names
updateInputNames(newDiv, newIndex);
// Add delete button handler
const deleteButton = newDiv.querySelector('.delete-button');
deleteButton.addEventListener('click', function() {
newDiv.remove();
updateDeleteButtonsVisibility();
updateBuildingLabels();
});
// Append and update UI
spekBangunanContainer.appendChild(newDiv);
updateDeleteButtonsVisibility();
updateBuildingLabels();
});
// Initialize on page load
document.addEventListener('DOMContentLoaded', () => {
updateDeleteButtonsVisibility();
updateBuildingLabels();
// Add delete handlers to existing buttons
spekBangunanContainer.querySelectorAll('.delete-button').forEach(button => {
button.addEventListener('click', function() {
if (spekBangunanContainer.querySelectorAll('.spek-bangunan').length > 1) {
this.closest('.spek-bangunan').remove();
updateDeleteButtonsVisibility();
updateBuildingLabels();
}
});
});
});
</script>
@endpush