Files
lpj/resources/views/surveyor/components/data-pembanding.blade.php

823 lines
47 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">
<div class="grid gap-5">
<div class="card-grid min-w-full" data-datatable="false" data-datatable-page-size="5"
data-datatable-state-save="false" id="data-table" data-api-url="">
<form id="dataPembandingForm" method="POST" enctype="multipart/form-data">
@csrf
<input type="hidden" name="permohonan_id" value="{{ $permohonan->id }}">
<input type="hidden" name="type" value="tanah">
<input type="hidden" name="jenis_jaminan_id" value="{{ request('jenis_jaminan') }}">
<div class="card">
<div class="card-header">
<h3 class="card-title">
Data Pembanding
</h3>
<div class="flex items-center gap-2">
<a href="{{ route('surveyor.show', ['id' => request('pembanding')]) }}"
class="btn btn-xs btn-info">
<i class="ki-filled ki-exit-left"></i> Back
</a>
</div>
</div>
<div class="card-header py-5 flex-wrap flex justify-end">
<button type="button" id="addColumnBtn" class="btn btn-primary btn-sm">
<i class="ki-filled ki-plus"></i> Tambah Kolom
</button>
<button type="button" id="removeColumnBtn" class="btn btn-danger btn-sm ml-2"
style="display: none;">
<i class="ki-filled ki-minus"></i> Hapus Kolom
</button>
</div>
<div class="card-body">
<div class="scrollable-x-auto">
<table id="dataTable"
class="table table-auto table-border align-middle text-gray-700 font-medium text-sm"
data-datatable-table="true">
<thead>
<tr>
<th class="min-w-[250px]" data-datatable-column="code" style="min-width: 350px">
<span class="sort"> <span class="sort-label"> Nama </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[250px]" data-datatable-column="name" style="min-width: 350px">
<span class="sort"> <span class="sort-label"> Objek Penilaian </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[50px]" data-datatable-column="actions"
style="min-width: 350px"id="dataPembanding2Header">
Data Pembanding 1
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
Foto
</td>
<td>
@php
$formFoto = json_decode($forminspeksi['foto_form'], true);
$formIns = json_decode($forminspeksi['data_form'], true);
@endphp
@if (isset($formFoto['object_jaminan']) &&
count($formFoto['object_jaminan']) > 0 &&
isset($formFoto['object_jaminan'][0]['foto_object']))
<img src="{{ asset('storage/' . $formFoto['object_jaminan'][0]['foto_object']) }}"
class="img-responsive" alt="Gambar Pendamping"
style="width: 10rem; height: 10rem;" id="uploadedImage1">
@else
<img src="#" class="img-responsive" alt="Gambar Pendamping"
style="width: 10rem; height: 10rem; display: none;"
id="uploadedImage1">
@endif
<input type="file" class="file-input mt-2" placeholder=""
onchange="previewImage(event, 'uploadedImage1')" name="foto_objek[]" />
</td>
<td class="text-center">
<img src="" class="img-responsive" alt="Gambar Pendamping"
style="width: 10rem; height: 10rem; display: none;" id="uploadedImage2">
<input type="file" class="file-input" placeholder=""
onchange="previewImage(event, 'uploadedImage2')"
name="foto_pembanding[]" />
</td>
</tr>
<tr>
<td>
<p>Alamat</p>
</td>
<td>
<input type="text" class="input"
value="{{ isset($formIns['asset']['nama_jalan']) ? $formIns['asset']['nama_jalan'] . ' ' . $formIns['desa_kelurahan'] : '' }}"
name="alamat" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="alamat_pembanding[]" />
</td>
</tr>
<tr>
<td>Desa</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['asset']['kecamatan']) ? $formIns['asset']['desa'] : '' }}"
name="desa" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="desa_pembanding[]" />
</td>
</tr>
<tr>
<td>Kecamatan</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['asset']['kecamatan']) ? $formIns['asset']['kecamatan'] : '' }}"
name="kecamatan" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="kecamatan_pembanding[]" />
</td>
</tr>
<tr>
<td>Kabupaten</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['asset']['kota_kabupaten']) ? $formIns['asset']['kota_kabupaten'] : '' }}"
name="kabupaten" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="kabupaten_pembanding[]" />
</td>
</tr>
<tr>
<td>Provinsi</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['asset']['provinsi']) ? $formIns['asset']['provinsi'] : '' }}"
name="provinsi" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="provinsi_pembanding[]" />
</td>
</tr>
<tr>
<td>
Tahun Penilaian
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="tahun" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="tahun_pembanding[]" />
</td>
</tr>
<tr>
<td>
Luas Tanah
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="luas_tanah" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="luas_tanah_pembanding[]" />
</td>
</tr>
<tr>
<td>
Luas Bangunan
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="luas_bangunan" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="luas_bangunan_pembanding[]" />
</td>
</tr>
<tr>
<td>
Tahun Bangunan
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="tahun_bangunan" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="tahun_bangunan_pembanding[]" />
</td>
</tr>
<tr>
<td>
Estimasi Tahun Visual
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="estimasi_tahun_visual" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="estimasi_tahun_visual_pembanding[]" />
</td>
</tr>
<tr>
<td>
Kepemilikan
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="kepemilikan" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="kepemilikan_pembanding[]" />
</td>
</tr>
<tr>
<td>
Harga
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="harga" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="harga_pembanding[]" />
</td>
</tr>
<tr>
<td>
Tinggi Lantai
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="tinggi_lantai" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="tinggi_lantai_pembanding[]" />
</td>
</tr>
<tr>
<td>
Lebar Depan
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="lebar_depan" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="lebar_depan_pembanding[]" />
</td>
</tr>
<tr>
<td>
Lebar Jalan
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="lebar_jalan" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="lebar_jalan_pembanding[]" />
</td>
</tr>
<tr>
<td>
Sumber
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="sumber" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="sumber_pembanding[]" />
</td>
</tr>
<tr>
<td>
Nomor tlp
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="nomor_tlp" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="nomor_tlp_pembanding[]" />
</td>
</tr>
<tr>
<td colspan="3">
Titik Lokasi
</td>
</tr>
<tr>
<td>
Koordinat Lat
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
value="{{ isset($formIns['asset']['kordinat_lat']) ? $formIns['asset']['kordinat_lat'] : '' }}"
name="kordinat_lat" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data pembanding"
name="kordinat_lat_pembanding[]" />
</td>
</tr>
<tr>
<td>
Koordinat Lng
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
value="{{ isset($formIns['asset']['kordinat_lng']) ? $formIns['asset']['kordinat_lng'] : '' }}"
name="kordinat_lng" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data pembanding"
name="kordinat_lng_pembanding[]" />
</td>
</tr>
<tr>
<td>
Link Internet
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="link_internet" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="link_internet_pembanding[]" />
</td>
</tr>
<tr>
<td colspan="3">Lokasi</td>
</tr>
<tr>
<td>
<p>Jarak Ke jalan utama</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['lingkungan']['jarak_jalan_utama']) ? $formIns['lingkungan']['jarak_jalan_utama'] : '' }}"
name="jarak_jalan_utama" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="jarak_jalan_utama_pembanding[]" />
</td>
</tr>
<tr>
<td>
<p>Lebar jalan depan aset (m)</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['lingkungan']['jarak_cbd_point']) ? $formIns['lingkungan']['jarak_cbd_point'] : '' }}"
name="jarak_cbd_point" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="jarak_cbd_point_pembanding[]" />
</td>
</tr>
<tr>
<td>
<p>Posisi kavling</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['tanah']['posisi_kavling']) ? $formIns['tanah']['posisi_kavling'][0] : '' }}"
name="posisi_kavling" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="posisi_kavling_pembanding[]" />
{{-- <in/put type="text" class="input" placeholder="Data Pembanding 1" /> --}}
</td>
</tr>
<tr>
<td>
<p>Tingkat Keramaian (Occupancy)</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['tanah']['tingkat_keramaian']) ? $formIns['tanah']['tingkat_keramaian'][0] : '' }}"
name="tingkat_keramaian" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="tingkat_keramaian_pembanding[]" />
</td>
</tr>
<tr>
<td colspan="3">Karakteristik Fisik</td>
</tr>
<tr>
<td>
<p>Kondisi Fisik Tanah</p>
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
value="{{ isset($formIns['tanah']['kondisi_fisik_tanah']) ? $formIns['tanah']['kondisi_fisik_tanah'][0] : '' }}"
name="kondisi_fisik_tanah" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="kondisi_fisik_tanah_pembanding[]" />
</td>
</tr>
<tr>
<td>
<p>Beda Ketinggian dengan Jalan</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['tanah']['ketinggian_jalan']) ? $formIns['tanah']['ketinggian_jalan'][0] : '' }}"
name="ketinggian_jalan" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="ketinggian_jalan_pembanding[]" />
</td>
</tr>
<tr>
<td>
<p>Bentuk Tanah</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['tanah']['bentuk_tanah']) ? $formIns['tanah']['bentuk_tanah'][0] : '' }}"
name="bentuk_tanah" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="bentuk_tanah_pembanding[]" />
</td>
</tr>
<tr>
<td>
<p>Lebar Depan</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
value="{{ isset($formIns['tanah']['bentuk_tanah']) ? $formIns['tanah']['bentuk_tanah'][0] : '' }}"
name="lebar_depan" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="lebar_depan_pembanding[]" />
</td>
</tr>
<tr>
<td>
<p>Fasos Fasum</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
name="fasos_fasum" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="fasos_fasum_pembanding[]" />
</td>
</tr>
<tr>
<td>
<p>Lain-lain</p>
</td>
<td>
<input type="text" class="input mt-2" placeholder="Objek Penilaian"
name="lain_lain" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="lain_lain_pembanding[]" />
</td>
</tr>
<tr>
<td>
Karakteristik Ekonomi
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="karakteristik_ekonomi" />
</td>
<td class="text-center">
<input type="text" class="input" placeholder="Data Pembanding 1"
name="karakteristik_ekonomi_pembanding[]" />
</td>
</tr>
<tr>
<td colspan="3">Pengunaan</td>
</tr>
<tr>
<td>
Zonasi/Tata Kota
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="zonasi_tata_kota" />
</td>
<td>
<input type="text" class="input" placeholder="Data Pembanding 1"
name="zonasi_tata_kota_pembanding[]" />
</td>
</tr>
<tr>
<td>
KDB
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
value="{{ isset($formIns['fakta']['kdb']) ? $formIns['fakta']['kdb'] : '' }}"
name="kdb" />
</td>
<td>
<input type="text" class="input" placeholder="Data Pembanding 1"
name="kdb_pembanding[]" />
</td>
</tr>
<tr>
<td>
KLB
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
value="{{ isset($formIns['fakta']['klb']) ? $formIns['fakta']['klb'] : '' }}"
name="klb" />
</td>
<td>
<input type="text" class="input" placeholder="Data Pembanding 1"
name="klb_pembanding[]" />
</td>
</tr>
<tr>
<td>
KTB
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
value="{{ isset($formIns['fakta']['ktb']) ? $formIns['fakta']['ktb'] : '' }}"
name="ktb" />
</td>
<td>
<input type="text" class="input" placeholder="Data Pembanding 1"
name="ktb_pembanding[]" />
</td>
</tr>
<tr>
<td>
KDH
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
value="{{ isset($formIns['fakta']['kdh']) ? $formIns['fakta']['kdh'] : '' }}"
name="kdh" />
</td>
<td>
<input type="text" class="input" placeholder="Data Pembanding 1"
name="kdh_pembanding[]" />
</td>
</tr>
<tr>
<td>
Peraturan
</td>
<td>
<input type="text" class="input" placeholder="Objek Penilaian"
name="peraturan" />
</td>
<td>
<input type="text" class="input" placeholder="Data Pembanding 1"
name="peraturan_pembanding[]" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="flex justify-end gap-2" style="margin-right: 20px; margin-top: 20px">
<button type="button" class="btn btn-success" id="saveButton" onclick="submitDataPembanding()">
<span id="saveButtonText">Save</span>
<div class="spinner-border spinner-border-sm text-light" role="status"
style="display: none;" id="saveButtonSpinner">
<span class="visually-hidden">Loading...</span>
</div>
</button>
</div>
</form>
</div>
</div>
<script>
let columnCount = 1;
document.getElementById('addColumnBtn').addEventListener('click', function() {
columnCount++;
// Create new header cell
const headerRow = document.querySelector('#dataTable thead tr');
const newHeader = document.createElement('th');
newHeader.className = 'min-w-[350px] text-center';
newHeader.textContent = `Data Pembanding ${columnCount}`;
headerRow.appendChild(newHeader);
// Show remove column button
document.getElementById('removeColumnBtn').style.display = 'inline-block';
const tableBody = document.querySelector('#dataTable tbody');
const rows = tableBody.querySelectorAll('tr');
rows.forEach((row) => {
// Check if this is a colspan row
const colspanCell = row.querySelector('td[colspan]');
if (colspanCell) {
// Update colspan value
const currentColspan = parseInt(colspanCell.getAttribute('colspan'));
colspanCell.setAttribute('colspan', currentColspan + 1);
return; // Skip adding new cell for colspan rows
}
const newCell = document.createElement('td');
newCell.className = 'text-center';
// Check if the row contains an image upload field
const hasImageUpload = row.querySelector('.file-input');
if (hasImageUpload) {
// Create image upload structure
const imgContainer = document.createElement('div');
imgContainer.className = 'flex flex-col items-center';
const imgElement = document.createElement('img');
imgElement.src = '';
imgElement.className = 'img-responsive';
imgElement.alt = 'Gambar Pendamping';
imgElement.style.width = '10rem';
imgElement.style.height = '10rem';
imgElement.style.display = 'none';
imgElement.id = `uploadedImage${columnCount + 1}`;
const fileInput = document.createElement('input');
fileInput.type = 'file';
fileInput.className = 'file-input mt-2';
fileInput.name = `foto_pembanding[]`; // Add name attribute for file inputs
fileInput.onchange = function(event) {
previewImage(event, imgElement.id);
};
imgContainer.appendChild(imgElement);
imgContainer.appendChild(fileInput);
newCell.appendChild(imgContainer);
} else {
// Create text input for non-image cells
const textInput = document.createElement('input');
textInput.type = 'text';
textInput.className = 'input';
textInput.placeholder = `Data Pembanding ${columnCount}`;
// Get the name from the first column's input
const firstColumnInput = row.querySelector('input[name]');
if (firstColumnInput) {
const baseFieldName = firstColumnInput.name.replace('[]', '');
if (baseFieldName.includes('_pembanding')) {
textInput.name = baseFieldName + '[]';
} else {
textInput.name = baseFieldName + '_pembanding[]';
}
}
newCell.appendChild(textInput);
}
row.appendChild(newCell);
});
});
// Modified submit function to collect all data
function submitDataPembanding() {
const formElement = $('#dataPembandingForm')[0];
const formData = new FormData(formElement);
$('#saveButton').prop('disabled', true);
$('#saveButtonText').hide();
$('#saveButtonSpinner').show();
// Log form data for debugging
for (let pair of formData.entries()) {
console.log(pair[0] + ': ' + pair[1]);
}
$.ajax({
url: '{{ route('surveyor.storeDataPembanding') }}',
type: 'POST',
data: formData,
processData: false,
contentType: false,
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
},
success: function(response) {
if (response.success) {
window.location.href =
'{{ route('surveyor.show', ['id' => $permohonan->id]) }}?form=form-inspeksi';
toastrSuccessBuild(response.message);
}
console.log(response);
},
error: function(xhr, status, error) {
console.error('Terjadi error:', error);
console.log('Status:', status);
console.log('Response:', xhr.responseText);
toastrErrorBuild(error);
},
complete: function() {
$('#saveButton').prop('disabled', false);
$('#saveButtonText').show();
$('#saveButtonSpinner').hide();
}
});
}
</script>
</div>
@endsection