update preview foto dan alamat surveyor
This commit is contained in:
@@ -48,7 +48,7 @@ class ActivityController extends Controller
|
|||||||
$regionId = $userTeam?->team->regions_id;
|
$regionId = $userTeam?->team->regions_id;
|
||||||
$teamId = $userTeam?->teams_id;
|
$teamId = $userTeam?->teams_id;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
$teamsActivity = TeamsUsers::with(['user', 'team', 'team.regions', 'user.roles'])
|
$teamsActivity = TeamsUsers::with(['user', 'team', 'team.regions', 'user.roles'])
|
||||||
->whereHas('team', function ($q) use ($regionId, $teamId) {
|
->whereHas('team', function ($q) use ($regionId, $teamId) {
|
||||||
@@ -74,7 +74,7 @@ class ActivityController extends Controller
|
|||||||
|
|
||||||
|
|
||||||
function updateTeamAssingment(Request $request) {
|
function updateTeamAssingment(Request $request) {
|
||||||
|
|
||||||
try {
|
try {
|
||||||
$id = $request->input('id');
|
$id = $request->input('id');
|
||||||
$user = PenilaianTeam::where('penilaian_id', $id)->get();
|
$user = PenilaianTeam::where('penilaian_id', $id)->get();
|
||||||
@@ -86,7 +86,7 @@ class ActivityController extends Controller
|
|||||||
}
|
}
|
||||||
return redirect()->route('activity.progres.index')->with('success', 'Surveyor berhasil diganti');
|
return redirect()->route('activity.progres.index')->with('success', 'Surveyor berhasil diganti');
|
||||||
}
|
}
|
||||||
|
|
||||||
} catch (\Throwable $th) {
|
} catch (\Throwable $th) {
|
||||||
return redirect()->route('activity.progres.index')->with('success', $th->getMessage());
|
return redirect()->route('activity.progres.index')->with('success', $th->getMessage());
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -12,12 +12,16 @@ use Illuminate\Support\Facades\DB;
|
|||||||
use Illuminate\Support\Facades\Auth;
|
use Illuminate\Support\Facades\Auth;
|
||||||
use Illuminate\Support\Facades\Storage;
|
use Illuminate\Support\Facades\Storage;
|
||||||
use Illuminate\Http\Response;
|
use Illuminate\Http\Response;
|
||||||
|
use Modules\Lpj\Models\Debiture;
|
||||||
use Modules\Lpj\Models\Permohonan;
|
use Modules\Lpj\Models\Permohonan;
|
||||||
use Modules\Lpj\Models\Branch;
|
use Modules\Lpj\Models\Branch;
|
||||||
use Modules\Lpj\Models\Surveyor;
|
use Modules\Lpj\Models\Surveyor;
|
||||||
use Modules\Lpj\Models\BentukTanah;
|
use Modules\Lpj\Models\BentukTanah;
|
||||||
use Modules\Lpj\Models\KonturTanah;
|
use Modules\Lpj\Models\KonturTanah;
|
||||||
use Modules\Location\Models\Province;
|
use Modules\Location\Models\Province;
|
||||||
|
use Modules\Location\Models\City;
|
||||||
|
use Modules\Location\Models\District;
|
||||||
|
use Modules\Location\Models\Village;
|
||||||
use Modules\Lpj\Models\PosisiKavling;
|
use Modules\Lpj\Models\PosisiKavling;
|
||||||
use Modules\Lpj\Models\KondisiFisikTanah;
|
use Modules\Lpj\Models\KondisiFisikTanah;
|
||||||
use Modules\Lpj\Models\KetinggianTanah;
|
use Modules\Lpj\Models\KetinggianTanah;
|
||||||
@@ -709,10 +713,14 @@ class SurveyorController extends Controller
|
|||||||
|
|
||||||
$branches = Branch::all();
|
$branches = Branch::all();
|
||||||
$provinces = Province::all();
|
$provinces = Province::all();
|
||||||
|
$debitur = Debiture::find($permohonan->debiture_id);
|
||||||
|
$cities = City::where('province_code', $debitur->province_code)->get();
|
||||||
|
$districts = District::where('city_code', $debitur->city_code)->get();
|
||||||
|
$villages = Village::where('district_code', $debitur->district_code)->get();
|
||||||
|
|
||||||
$surveyor = $id;
|
$surveyor = $id;
|
||||||
$branches = Branch::all();
|
$branches = Branch::all();
|
||||||
$provinces = Province::all();
|
|
||||||
$bentukTanah = BentukTanah::all();
|
$bentukTanah = BentukTanah::all();
|
||||||
$konturTanah = KonturTanah::all();
|
$konturTanah = KonturTanah::all();
|
||||||
$posisiKavling = PosisiKavling::all();
|
$posisiKavling = PosisiKavling::all();
|
||||||
@@ -755,6 +763,10 @@ class SurveyorController extends Controller
|
|||||||
'surveyor',
|
'surveyor',
|
||||||
'branches',
|
'branches',
|
||||||
'provinces',
|
'provinces',
|
||||||
|
'debitur',
|
||||||
|
'cities',
|
||||||
|
'districts',
|
||||||
|
'villages',
|
||||||
'bentukTanah',
|
'bentukTanah',
|
||||||
'konturTanah',
|
'konturTanah',
|
||||||
'posisiKavling',
|
'posisiKavling',
|
||||||
@@ -1460,11 +1472,11 @@ class SurveyorController extends Controller
|
|||||||
private function getAssetData(array $data): array
|
private function getAssetData(array $data): array
|
||||||
{
|
{
|
||||||
$alamatData = [
|
$alamatData = [
|
||||||
'nama_jalan' => $data['nama_jalan'] ?? null,
|
'address' => $data['address'] ?? null,
|
||||||
'desa_kelurahan' => $data['desa_kelurahan'] ?? null,
|
'village_code' => $data['village_code'] ?? null,
|
||||||
'kecamatan' => $data['kecamatan'] ?? null,
|
'district_code' => $data['district_code'] ?? null,
|
||||||
'kota_kabupaten' => $data['kota_kabupaten'] ?? null,
|
'city_code' => $data['city_code'] ?? null,
|
||||||
'provinsi' => $data['provinsi'] ?? null,
|
'province_code' => $data['province_code'] ?? null,
|
||||||
];
|
];
|
||||||
|
|
||||||
return [
|
return [
|
||||||
|
|||||||
@@ -528,11 +528,11 @@ class FormSurveyorRequest extends FormRequest
|
|||||||
'hub_cadeb_penghuni_sesuai' => 'nullable',
|
'hub_cadeb_penghuni_sesuai' => 'nullable',
|
||||||
'hub_cadeb_penghuni_tidak_sesuai' => 'nullable',
|
'hub_cadeb_penghuni_tidak_sesuai' => 'nullable',
|
||||||
|
|
||||||
'nama_jalan' => 'nullable',
|
'address' => 'nullable',
|
||||||
'desa_kelurahan' => 'nullable',
|
'village_code' => 'nullable',
|
||||||
'kecamatan' => 'nullable',
|
'district_code' => 'nullable',
|
||||||
'kota_kabupaten' => 'nullable',
|
'city_code' => 'nullable',
|
||||||
'provinsi' => 'nullable',
|
'province_code' => 'nullable',
|
||||||
'kordinat_lng' => 'nullable',
|
'kordinat_lng' => 'nullable',
|
||||||
'kordinat_lat' => 'nullable',
|
'kordinat_lat' => 'nullable',
|
||||||
];
|
];
|
||||||
|
|||||||
@@ -65,11 +65,8 @@
|
|||||||
src="{{ isset($fotoForm['object_jaminan'][0]['foto_objek']) ? asset('storage/' . $fotoForm['object_jaminan'][0]['foto_objek']) : '' }}"
|
src="{{ isset($fotoForm['object_jaminan'][0]['foto_objek']) ? asset('storage/' . $fotoForm['object_jaminan'][0]['foto_objek']) : '' }}"
|
||||||
class="max-w-[200px] {{ isset($fotoForm['object_jaminan'][0]['foto_objek']) ? '' : 'hidden' }}"
|
class="max-w-[200px] {{ isset($fotoForm['object_jaminan'][0]['foto_objek']) ? '' : 'hidden' }}"
|
||||||
alt="Uploaded Image">
|
alt="Uploaded Image">
|
||||||
<input type="file"
|
<input type="file" name="foto_objek" class="file-input"
|
||||||
name="foto_objek"
|
accept="image/*" onchange="previewImage(this, 'uploadedImage1')">
|
||||||
class="file-input"
|
|
||||||
accept="image/*"
|
|
||||||
onchange="previewImage(this, 'uploadedImage1')">
|
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
|
|
||||||
@@ -95,7 +92,9 @@
|
|||||||
<select name="jenis_aset" class="select">
|
<select name="jenis_aset" class="select">
|
||||||
<option value="">Pilih Jenis Aset</option>
|
<option value="">Pilih Jenis Aset</option>
|
||||||
@foreach ($data['jenisJaminan'] as $item)
|
@foreach ($data['jenisJaminan'] as $item)
|
||||||
<option value="{{ $item->name }}" {{ ($inspectionData['asset']['jenis_asset']['sesuai'] ?? '') == $item->name ? 'selected' : '' }}>{{ $item->name }}</option>
|
<option value="{{ $item->name }}"
|
||||||
|
{{ ($inspectionData['asset']['jenis_asset']['sesuai'] ?? '') == $item->name ? 'selected' : '' }}>
|
||||||
|
{{ $item->name }}</option>
|
||||||
@endforeach
|
@endforeach
|
||||||
|
|
||||||
</select>
|
</select>
|
||||||
@@ -104,7 +103,9 @@
|
|||||||
<select name="jenis_aset_pembanding[]" class="select">
|
<select name="jenis_aset_pembanding[]" class="select">
|
||||||
<option value="">Pilih Jenis Aset</option>
|
<option value="">Pilih Jenis Aset</option>
|
||||||
@foreach ($data['jenisJaminan'] as $item)
|
@foreach ($data['jenisJaminan'] as $item)
|
||||||
<option value="{{ $item->name }}" {{ ($inspectionData['jenis_aset'] ?? '') == $item->name ? 'selected' : '' }}>{{ $item->name }}</option>
|
<option value="{{ $item->name }}"
|
||||||
|
{{ ($inspectionData['jenis_aset'] ?? '') == $item->name ? 'selected' : '' }}>
|
||||||
|
{{ $item->name }}</option>
|
||||||
@endforeach
|
@endforeach
|
||||||
</select>
|
</select>
|
||||||
</td>
|
</td>
|
||||||
@@ -375,7 +376,8 @@
|
|||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
try {
|
try {
|
||||||
const inspectionData = {!! isset($inspectionData) ? json_encode($inspectionData) : 'null' !!};
|
const inspectionData = {!! isset($inspectionData) ? json_encode($inspectionData) : 'null' !!};
|
||||||
const comparisons = {!! isset($comparisons) ? json_encode($comparisons) : '' !!};
|
const comparisons = {!! isset($comparisons) ? json_encode($comparisons) : 'null' !!};
|
||||||
|
|
||||||
|
|
||||||
console.log('Inspection Data:', inspectionData); // Debug
|
console.log('Inspection Data:', inspectionData); // Debug
|
||||||
console.log('Comparisons:', comparisons); // Debug
|
console.log('Comparisons:', comparisons); // Debug
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
@endsection
|
@endsection
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
@include('lpj::assetsku.includenya')
|
@include('lpj::assetsku.includenya')
|
||||||
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
|
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
|
||||||
<div class="card min-w-full">
|
<div class="card min-w-full">
|
||||||
<div class="card min-w-full">
|
<div class="card min-w-full">
|
||||||
@@ -14,8 +14,7 @@
|
|||||||
Data Jaminan
|
Data Jaminan
|
||||||
</h3>
|
</h3>
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
<a href="{{ route('surveyor.show', ['id' => request('foto')]) }}"
|
<a href="{{ route('surveyor.show', ['id' => request('foto')]) }}" class="btn btn-xs btn-info">
|
||||||
class="btn btn-xs btn-info">
|
|
||||||
<i class="ki-filled ki-exit-left"></i> Back
|
<i class="ki-filled ki-exit-left"></i> Back
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
@@ -334,32 +333,35 @@
|
|||||||
|
|
||||||
@if (count($objekViews) > 0)
|
@if (count($objekViews) > 0)
|
||||||
@foreach ($objekViews as $view)
|
@foreach ($objekViews as $view)
|
||||||
<div class="flex flex-wrap gap-4 {{ !$loop->first ? 'mt-2' : '' }}">
|
<div class="flex flex-wrap gap-4 {{ !$loop->first ? 'mt-2' : '' }}">
|
||||||
<div class="flex w-full gap-4">
|
<div class="flex w-full gap-4">
|
||||||
<label class="form-label max-w-56"><span
|
<label class="form-label max-w-56"><span
|
||||||
class="form-label">{{ $view['label'] }}</span></label>
|
class="form-label">{{ $view['label'] }}</span></label>
|
||||||
<input type="hidden" class="form-control"
|
<input type="hidden" class="form-control"
|
||||||
name="name_objek[]" value="{{ $view['label'] }}" />
|
name="name_objek[]" value="{{ $view['label'] }}" />
|
||||||
<div class="w-full grid gap-5">
|
<div class="w-full grid gap-5">
|
||||||
<img id="foto_object_jaminan_preview_{{ $view['index'] }}"
|
<img id="foto_object_jaminan_preview_{{ $view['index'] }}"
|
||||||
src="{{ isset($formFoto['object_jaminan'][$view['index']]['foto_object']) ? asset('storage/' . $formFoto['object_jaminan'][$view['index']]['foto_object']) : '' }}"
|
src="{{ isset($formFoto['object_jaminan'][$view['index']]['foto_objek']) ? asset('storage/' . $formFoto['object_jaminan'][$view['index']]['foto_objek']) : '' }}"
|
||||||
alt="{{ $view['label'] }}" class="mb-2 w-48 h-auto"
|
alt="{{ $view['label'] }}" class="mb-2 h-auto"
|
||||||
style="{{ isset($formFoto['object_jaminan'][$view['index']]['foto_object']) ? '' : 'display: none;' }} width: 30rem;">
|
|
||||||
<div class="input-group w-full flex gap-2">
|
style="{{ isset($formFoto['object_jaminan'][$view['index']]['foto_objek']) ? 'width: 30rem;' : 'display: none;' }}"
|
||||||
<input type="file" name="foto_objek[]"
|
onerror="this.style.display='none';" />
|
||||||
class="file-input file-input-bordered w-full"
|
<div class="input-group w-full flex gap-2">
|
||||||
accept="image/*" capture="camera">
|
<input type="file" name="foto_objek[]"
|
||||||
<button type="button" id="btnCamera"
|
class="file-input file-input-bordered w-full"
|
||||||
class="btn btn-light"
|
accept="image/*" capture="camera"
|
||||||
data-modal-toggle="#cameraModal">
|
onchange="previewImage(this, 'foto_object_jaminan_preview_{{ $view['index'] }}')">
|
||||||
<i class="ki-outline ki-abstract-33"></i> Camera
|
<button type="button" id="btnCamera"
|
||||||
</button>
|
class="btn btn-light"
|
||||||
</div>
|
data-modal-toggle="#cameraModal">
|
||||||
<textarea name="deskripsi_objek[]" class="textarea" rows="3" placeholder="Deskripsi">{{ isset($formFoto['object_jaminan'][$view['index']]) ? str_replace($view['label'] . ': ', '', $formFoto['object_jaminan'][$view['index']]['deskripsi_objek']) : '' }}</textarea>
|
<i class="ki-outline ki-abstract-33"></i> Camera
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
<textarea name="deskripsi_objek[]" class="textarea" rows="3" placeholder="Deskripsi">{{ isset($formFoto['object_jaminan'][$view['index']]) ? str_replace($view['label'] . ': ', '', $formFoto['object_jaminan'][$view['index']]['deskripsi_objek']) : '' }}</textarea>
|
||||||
</div>
|
</div>
|
||||||
<span class="alert text-danger text-sm"></span>
|
|
||||||
</div>
|
</div>
|
||||||
|
<span class="alert text-danger text-sm"></span>
|
||||||
|
</div>
|
||||||
@endforeach
|
@endforeach
|
||||||
@endif
|
@endif
|
||||||
|
|
||||||
@@ -391,7 +393,7 @@
|
|||||||
<label class="form-label max-w-56">
|
<label class="form-label max-w-56">
|
||||||
<span class="form-label">Foto Lantai 1</span>
|
<span class="form-label">Foto Lantai 1</span>
|
||||||
</label>
|
</label>
|
||||||
<div class="w-full grid gap-5">
|
<div class="input-group w-full grid gap-5">
|
||||||
<img src="{{ asset('storage/' . old('foto_lantai_unit', $item['foto_lantai_unit'])) }}"
|
<img src="{{ asset('storage/' . old('foto_lantai_unit', $item['foto_lantai_unit'])) }}"
|
||||||
alt="Gambar Pendamping" style="width: 30rem;">
|
alt="Gambar Pendamping" style="width: 30rem;">
|
||||||
<input type="hidden" name="name_lantai_unit[]" value="lantai">
|
<input type="hidden" name="name_lantai_unit[]" value="lantai">
|
||||||
@@ -436,30 +438,33 @@
|
|||||||
|
|
||||||
<div id="inputContainerBasement" class="w-full" style="margin-top: 10px">
|
<div id="inputContainerBasement" class="w-full" style="margin-top: 10px">
|
||||||
<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">
|
<label class="form-label max-w-56">
|
||||||
<span class="form-label">Basement</span>
|
<span class="form-label">Basement</span>
|
||||||
</label>
|
</label>
|
||||||
<div class="input-group w-full flex flex-col gap-2">
|
<div class="input-group w-full flex flex-col gap-2">
|
||||||
<input type="hidden" name="name_basement" value="basement">
|
<input type="hidden" name="name_basement" value="basement">
|
||||||
<img id="foto_basement_preview"
|
<img id="foto_basement_preview"
|
||||||
src="{{ isset($formFoto['foto_basement']) ? asset('storage/' . old('foto_basement', $formFoto['foto_basement'])) : '#' }}"
|
src="{{ isset($formFoto['foto_basement']) ? asset('storage/' . old('foto_basement', $formFoto['foto_basement'])) : '#' }}"
|
||||||
alt="Gambar foto_basement" style="width: 30rem;"
|
alt="Gambar foto_basement" style="width: 30rem;"
|
||||||
onerror="this.style.display='none';"
|
onerror="this.style.display='none';"
|
||||||
onchange="previewImage(this, 'foto_basement_preview')">
|
onchange="previewImage(this, 'foto_basement_preview')">
|
||||||
<div class="input-group w-full flex gap-2">
|
<div class="input-group w-full flex gap-2">
|
||||||
<input id="inputBasement" type="file" name="foto_basement"
|
<input id="inputBasement" type="file" name="foto_basement"
|
||||||
class="file-input file-input-bordered w-full" accept="image/*" capture="camera">
|
class="file-input file-input-bordered w-full" accept="image/*"
|
||||||
<button type="button" id="btnCamera" class="btn btn-light" data-modal-toggle="#cameraModal">
|
capture="camera">
|
||||||
<i class="ki-outline ki-abstract-33"></i> Camera
|
<button type="button" id="btnCamera" class="btn btn-light"
|
||||||
</button>
|
data-modal-toggle="#cameraModal">
|
||||||
|
<i class="ki-outline ki-abstract-33"></i> Camera
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<button type="button" class="btn btn-danger btn-sm delete-btn"
|
||||||
<button type="button" class="btn btn-danger btn-sm delete-btn" style="display: none;" id="btnDelete">
|
style="display: none;" id="btnDelete">
|
||||||
<i class="ki-filled ki-trash"></i>
|
<i class="ki-filled ki-trash"></i>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<span id="alertBasement" class="alert text-danger text-sm"></span>
|
<span id="alertBasement" class="alert text-danger text-sm"></span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="lantaiLainnya" style="margin-top: 10px"></div>
|
<div id="lantaiLainnya" style="margin-top: 10px"></div>
|
||||||
|
|
||||||
@@ -475,63 +480,69 @@
|
|||||||
|
|
||||||
<div class="card bg-white rounded-lg shadow-md">
|
<div class="card bg-white rounded-lg shadow-md">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="text-white py-4 flex items-center justify-between">
|
<div class="text-white py-4 flex items-center justify-between">
|
||||||
<h1 class="text-md font-medium text-gray-900">Lingkungan</h1>
|
<h1 class="text-md font-medium text-gray-900">Lingkungan</h1>
|
||||||
<button id="btnLingkungan" type="button" class="btn btn-primary btn-sm">
|
<button id="btnLingkungan" type="button" class="btn btn-primary btn-sm">
|
||||||
<i class="ki-filled ki-plus text-lg"></i>
|
<i class="ki-filled ki-plus text-lg"></i>
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@if (isset($formFoto['lingkungan']) && is_array($formFoto['lingkungan']) && count($formFoto['lingkungan']) > 0)
|
|
||||||
@foreach ($formFoto['lingkungan'] as $key => $item)
|
|
||||||
<div id="inputContainerLingkungan_{{ $key }}" style="margin-top: 10px">
|
|
||||||
<div class="flex w-full items-center justify-center gap-4 mb-4">
|
|
||||||
<label class="form-label max-w-56">
|
|
||||||
<span class="form-label">Lingkungan</span>
|
|
||||||
</label>
|
|
||||||
<div class="w-full grid gap-5">
|
|
||||||
<img id="foto_lingkungan_preview_{{ $key }}"
|
|
||||||
src="{{ asset('storage/' . old('foto_lingkungan.' . $key, $item['foto_lingkungan'])) }}"
|
|
||||||
alt="Gambar Lingkungan" style="width: 30rem;">
|
|
||||||
<input type="hidden" name="name_lingkungan[]" value="lingkungan">
|
|
||||||
<div class="input-group w-full flex gap-2">
|
|
||||||
<input id="inputLingkungan_{{ $key }}" type="file" name="foto_lingkungan[]"
|
|
||||||
class="file-input file-input-bordered w-full" accept="image/*" capture="camera">
|
|
||||||
<button type="button" id="btnCamera" class="btn btn-light" data-modal-toggle="#cameraModal">
|
|
||||||
<i class="ki-outline ki-abstract-33"></i> Camera
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<button type="button" class="btn btn-danger btn-sm delete-btn" style="display: none;" id="btnDelete">
|
|
||||||
<i class="ki-filled ki-trash"></i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<span class="alert text-danger text-sm"></span>
|
|
||||||
</div>
|
|
||||||
@endforeach
|
|
||||||
@else
|
|
||||||
<div id="inputContainerLingkungan_0" style="margin-top: 10px">
|
|
||||||
<div class="flex w-full items-center justify-center gap-4 mb-4">
|
|
||||||
<label class="form-label max-w-56">
|
|
||||||
<span class="form-label">Lingkungan</span>
|
|
||||||
</label>
|
|
||||||
<div class="input-group w-full flex gap-2">
|
|
||||||
<input type="hidden" name="name_lingkungan[]" value="lingkungan">
|
|
||||||
<input id="inputLingkungan_0" type="file" name="foto_lingkungan[]"
|
|
||||||
class="file-input file-input-bordered w-full" accept="image/*" capture="camera">
|
|
||||||
<button type="button" id="btnCamera" class="btn btn-light" data-modal-toggle="#cameraModal">
|
|
||||||
<i class="ki-outline ki-abstract-33"></i> Camera
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<button type="button" class="btn btn-danger btn-sm delete-btn" style="display: none;" id="btnDelete">
|
|
||||||
<i class="ki-filled ki-trash"></i>
|
|
||||||
</button>
|
</button>
|
||||||
</div>
|
|
||||||
<span class="alert text-danger text-sm"></span>
|
|
||||||
</div>
|
</div>
|
||||||
@endif
|
|
||||||
|
@if (isset($formFoto['lingkungan']) && is_array($formFoto['lingkungan']) && count($formFoto['lingkungan']) > 0)
|
||||||
|
@foreach ($formFoto['lingkungan'] as $key => $item)
|
||||||
|
<div id="inputContainerLingkungan" style="margin-top: 10px">
|
||||||
|
<div class="flex w-full items-center justify-center gap-4 mb-4">
|
||||||
|
<label class="form-label max-w-56">
|
||||||
|
<span class="form-label">Lingkungan</span>
|
||||||
|
</label>
|
||||||
|
<div class="w-full grid gap-5">
|
||||||
|
<img id="foto_lingkungan_preview_{{ $key }}"
|
||||||
|
src="{{ asset('storage/' . old('foto_lingkungan.' . $key, $item['foto_lingkungan'])) }}"
|
||||||
|
alt="Gambar Lingkungan" style="width: 30rem;">
|
||||||
|
<input type="hidden" name="name_lingkungan[]" value="lingkungan">
|
||||||
|
<div class="input-group w-full flex gap-2">
|
||||||
|
<input id="inputLingkungan_{{ $key }}" type="file"
|
||||||
|
name="foto_lingkungan[]" class="file-input file-input-bordered w-full"
|
||||||
|
accept="image/*" capture="camera">
|
||||||
|
<button type="button" id="btnCamera" class="btn btn-light"
|
||||||
|
data-modal-toggle="#cameraModal">
|
||||||
|
<i class="ki-outline ki-abstract-33"></i> Camera
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<button type="button" class="btn btn-danger btn-sm delete-btn"
|
||||||
|
style="display: none;" id="btnDelete">
|
||||||
|
<i class="ki-filled ki-trash"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<span class="alert text-danger text-sm"></span>
|
||||||
|
</div>
|
||||||
|
@endforeach
|
||||||
|
@else
|
||||||
|
<div id="inputContainerLingkungan" style="margin-top: 10px">
|
||||||
|
<div class="flex w-full items-center justify-center gap-4 mb-4">
|
||||||
|
<label class="form-label max-w-56">
|
||||||
|
<span class="form-label">Lingkungan</span>
|
||||||
|
</label>
|
||||||
|
<div class="input-group w-full flex gap-2">
|
||||||
|
<input type="hidden" name="name_lingkungan[]" value="lingkungan">
|
||||||
|
<input id="inputLingkungan_0" type="file" name="foto_lingkungan[]"
|
||||||
|
class="file-input file-input-bordered w-full" accept="image/*" capture="camera">
|
||||||
|
<button type="button" id="btnCamera" class="btn btn-light"
|
||||||
|
data-modal-toggle="#cameraModal">
|
||||||
|
<i class="ki-outline ki-abstract-33"></i> Camera
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<button type="button" class="btn btn-danger btn-sm delete-btn" style="display: none;"
|
||||||
|
id="btnDelete">
|
||||||
|
<i class="ki-filled ki-trash"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<span class="alert text-danger text-sm"></span>
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="card bg-white rounded-lg shadow-md">
|
<div class="card bg-white rounded-lg shadow-md">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class=" text-white py-4 flex items-center justify-between">
|
<div class=" text-white py-4 flex items-center justify-between">
|
||||||
@@ -594,7 +605,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Modal Kamera -->
|
<!-- Modal Kamera -->
|
||||||
@include('lpj::surveyor.components.modal-kamera')
|
@include('lpj::surveyor.components.modal-kamera')
|
||||||
@endsection
|
@endsection
|
||||||
|
|
||||||
|
|
||||||
@@ -693,7 +704,3 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -100,7 +100,7 @@
|
|||||||
<h1 class="text-md font-medium text-gray-900">Deskripsi Aset jaminan</h1>
|
<h1 class="text-md font-medium text-gray-900">Deskripsi Aset jaminan</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="grid gap-5">
|
<div class="grid gap-5 w-full">
|
||||||
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||||
<label class="form-label max-w-56">Jenis Aset</label>
|
<label class="form-label max-w-56">Jenis Aset</label>
|
||||||
<div>
|
<div>
|
||||||
@@ -153,7 +153,7 @@
|
|||||||
|
|
||||||
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
||||||
<label class="form-label max-w-56">Alamat</label>
|
<label class="form-label max-w-56">Alamat</label>
|
||||||
<div>
|
<div class="w-full">
|
||||||
@foreach ($permohonan->debiture->documents as $dokumen)
|
@foreach ($permohonan->debiture->documents as $dokumen)
|
||||||
<span class="text-2sm text-gray-700">
|
<span class="text-2sm text-gray-700">
|
||||||
{{ formatAlamat($dokumen) }}
|
{{ formatAlamat($dokumen) }}
|
||||||
@@ -186,69 +186,117 @@
|
|||||||
<em id="error-alamat" class="alert text-danger text-sm"></em>
|
<em id="error-alamat" class="alert text-danger text-sm"></em>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="alamat_form" class="grid gap-2 mt-5">
|
<div id="alamat_form" class="grid gap-2 mt-5" style="{{ isset($forminspeksi['asset']['alamat']['tidak sesuai']) ? '' : 'display: none;' }}">
|
||||||
@php
|
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
|
||||||
$fields = [
|
<label for="address" class="form-label max-w-56">Jl.</label>
|
||||||
[
|
<div class="flex flex-wrap items-baseline w-full">
|
||||||
'label' => 'Jl.',
|
<input type="text" id="address" name="address" class="input w-full"
|
||||||
'name' => 'nama_jalan',
|
placeholder="Masukkan Jl."
|
||||||
'id' => 'nama_jalan',
|
value="{{ isset($forminspeksi['asset']['alamat']['tidak sesuai']['address'])
|
||||||
'readonly' => false,
|
? $forminspeksi['asset']['alamat']['tidak sesuai']['address']
|
||||||
],
|
: (isset($forminspeksi['asset']['alamat']['sesuai']['address'])
|
||||||
[
|
? $forminspeksi['asset']['alamat']['sesuai']['address']
|
||||||
'label' => 'Provinsi',
|
: old('address')) }}">
|
||||||
'name' => 'provinsi',
|
|
||||||
'id' => 'provinsi',
|
|
||||||
'type' => 'select',
|
|
||||||
'options' => $provinces,
|
|
||||||
],
|
|
||||||
[
|
|
||||||
'label' => 'Kota/Kabupaten',
|
|
||||||
'name' => 'kota_kabupaten',
|
|
||||||
'id' => 'kota_kabupaten',
|
|
||||||
'type' => 'select',
|
|
||||||
'options' => $provinces,
|
|
||||||
],
|
|
||||||
[
|
|
||||||
'label' => 'Kecamatan',
|
|
||||||
'name' => 'kecamatan',
|
|
||||||
'id' => 'kecamatan',
|
|
||||||
'type' => 'select',
|
|
||||||
'options' => $provinces,
|
|
||||||
],
|
|
||||||
[
|
|
||||||
'label' => 'Kelurahan',
|
|
||||||
'name' => 'desa_kelurahan',
|
|
||||||
'id' => 'desa_kelurahan',
|
|
||||||
'type' => 'select',
|
|
||||||
'options' => $provinces,
|
|
||||||
],
|
|
||||||
];
|
|
||||||
@endphp
|
|
||||||
|
|
||||||
@foreach ($fields as $field)
|
|
||||||
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
|
||||||
<label class="form-label max-w-56">{{ $field['label'] }}</label>
|
|
||||||
<div class="flex flex-wrap items-baseline w-full">
|
|
||||||
@if (isset($field['type']) && $field['type'] === 'select')
|
|
||||||
<select id="{{ $field['id'] }}" name="{{ $field['name'] }}" class="select w-full">
|
|
||||||
<option value="">{{ $field['label'] }}</option>
|
|
||||||
@foreach ($field['options'] as $option)
|
|
||||||
<option value="{{ $option->code }}">{{ $option->name }}</option>
|
|
||||||
@endforeach
|
|
||||||
</select>
|
|
||||||
@else
|
|
||||||
<input type="text" id="{{ $field['id'] }}" name="{{ $field['name'] }}" class="input"
|
|
||||||
{{ $field['readonly'] ? 'readonly' : '' }}>
|
|
||||||
@endif
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
@endforeach
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
|
||||||
|
<label for="province_code" class="form-label max-w-56">Provinsi</label>
|
||||||
|
<div class="flex flex-wrap items-baseline w-full">
|
||||||
|
<select id="province_code" name="province_code" class="input w-full" >
|
||||||
|
<option value="">Select Province</option>
|
||||||
|
@foreach ($provinces as $province)
|
||||||
|
@if (isset($debitur))
|
||||||
|
<option value="{{ $province->code }}"
|
||||||
|
{{ isset($debitur->province_code) && $debitur->province_code == $province->code ? 'selected' : '' }}>
|
||||||
|
{{ $province->name }}
|
||||||
|
</option>
|
||||||
|
@else
|
||||||
|
<option value="{{ $province->code }}">
|
||||||
|
{{ $province->name }}
|
||||||
|
</option>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
|
||||||
|
<label for="city_code" class="form-label max-w-56">Kota/Kabupaten</label>
|
||||||
|
<div class="flex flex-wrap items-baseline w-full">
|
||||||
|
<select id="city_code" name="city_code" class="select w-full">
|
||||||
|
<option value="">Pilih Kota/Kabupaten</option>
|
||||||
|
@if (isset($cities))
|
||||||
|
@foreach ($cities as $city)
|
||||||
|
@if (isset($debitur))
|
||||||
|
<option value="{{ $city->code }}"
|
||||||
|
{{ isset($debitur->city_code) && $debitur->city_code == $city->code ? 'selected' : '' }}>
|
||||||
|
{{ $city->name }}
|
||||||
|
</option>
|
||||||
|
@else
|
||||||
|
<option value="{{ $city->code }}">
|
||||||
|
{{ $city->name }}
|
||||||
|
</option>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
@endif
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
|
||||||
|
<label for="district_code" class="form-label max-w-56">Kecamatan</label>
|
||||||
|
<div class="flex flex-wrap items-baseline w-full">
|
||||||
|
<select id="district_code" name="district_code" class="select w-full">
|
||||||
|
<option value="">Pilih Kecamatan</option>
|
||||||
|
@if (isset($districts))
|
||||||
|
@foreach ($districts as $district)
|
||||||
|
@if (isset($debitur))
|
||||||
|
<option value="{{ $district->code }}"
|
||||||
|
{{ isset($debitur->district_code) && $debitur->district_code == $district->code ? 'selected' : '' }}>
|
||||||
|
{{ $district->name }}
|
||||||
|
</option>
|
||||||
|
@else
|
||||||
|
<option value="{{ $district->code }}">
|
||||||
|
{{ $district->name }}
|
||||||
|
</option>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
|
||||||
|
@endif
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
|
||||||
|
<label for="village_code" class="form-label max-w-56">Kelurahan</label>
|
||||||
|
<div class="flex flex-wrap items-baseline w-full">
|
||||||
|
<select id="village_code" name="village_code" class="select w-full">
|
||||||
|
<option value="">Pilih Kelurahan</option>
|
||||||
|
@if (isset($villages))
|
||||||
|
@foreach ($villages as $village)
|
||||||
|
@if (isset($debitur))
|
||||||
|
<option value="{{ $village->code }}"
|
||||||
|
{{ isset($debitur->village_code) && $debitur->village_code == $village->code ? 'selected' : '' }}>
|
||||||
|
{{ $village->name }}
|
||||||
|
</option>
|
||||||
|
@else
|
||||||
|
<option value="{{ $village->code }}">
|
||||||
|
{{ $village->name }}
|
||||||
|
</option>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
|
||||||
|
@endif
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -399,7 +447,7 @@
|
|||||||
<input
|
<input
|
||||||
onclick="toggleFieldVisibility('hub_cadeb','hub_cadeb_tidak_sesuai', ['tidak sesuai'])"
|
onclick="toggleFieldVisibility('hub_cadeb','hub_cadeb_tidak_sesuai', ['tidak sesuai'])"
|
||||||
type="radio" class="radio" name="hub_cadeb" value="tidak sesuai"
|
type="radio" class="radio" name="hub_cadeb" value="tidak sesuai"
|
||||||
{{ old('hub_cadeb', isset($forminspeksi['asset']['hub_cadeb']['tidak sesuai']))? 'checked' : '' }}>
|
{{ old('hub_cadeb', isset($forminspeksi['asset']['hub_cadeb']['tidak sesuai'])) ? 'checked' : '' }}>
|
||||||
<span class="ml-2">Tidak</span>
|
<span class="ml-2">Tidak</span>
|
||||||
</label>
|
</label>
|
||||||
<!-- Select dropdown untuk "Tidak Sesuai" -->
|
<!-- Select dropdown untuk "Tidak Sesuai" -->
|
||||||
|
|||||||
@@ -52,27 +52,60 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@endsection
|
@endsection
|
||||||
|
|
||||||
@push('scripts')
|
@push('scripts')
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
function updateAlamatFields(type) {
|
function updateAlamatFields(status) {
|
||||||
if (type === 'sesuai') {
|
// Ambil elemen formulir
|
||||||
// Update nilai form dengan data sesuai
|
const addressForm = document.getElementById('alamat_form');
|
||||||
document.getElementById('nama_jalan').value = "{{ $dokumen->address ?? '' }}";
|
const inputs = addressForm.querySelectorAll('input, select');
|
||||||
document.getElementById('provinsi').value = "{{ $dokumen->province->code ?? '' }}";
|
const addressInput = document.getElementById('address');
|
||||||
document.getElementById('kota_kabupaten').value = "{{ $dokumen->city->code ?? '' }}";
|
|
||||||
document.getElementById('kecamatan').value = "{{ $dokumen->district->code ?? '' }}";
|
if (status === 'sesuai') {
|
||||||
document.getElementById('desa_kelurahan').value = "{{ $dokumen->village->code ?? '' }}";
|
addressInput.value = "{{ $dokumen->address ?? '' }}";
|
||||||
} else if (type === 'tidak sesuai') {
|
inputs.forEach(element => {
|
||||||
// Reset nilai form untuk input manual
|
if (element.tagName === 'INPUT') {
|
||||||
document.getElementById('nama_jalan').value = '';
|
element.setAttribute('readonly', true);
|
||||||
document.getElementById('provinsi').value = '';
|
} else if (element.tagName === 'SELECT') {
|
||||||
document.getElementById('kota_kabupaten').value = '';
|
element.setAttribute('disabled', true);
|
||||||
document.getElementById('kecamatan').value = '';
|
element.classList.add('disabled-input')
|
||||||
document.getElementById('desa_kelurahan').value = '';
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
addressForm.style.display = 'grid';
|
||||||
|
addressForm.disabled = true;
|
||||||
|
addressForm.classList.add('disabled-input')
|
||||||
|
|
||||||
|
|
||||||
|
} else if (status === 'tidak sesuai') {
|
||||||
|
addressForm.style.display = 'grid';
|
||||||
|
|
||||||
|
addressForm.removeAttribute('disabled');
|
||||||
|
addressForm.classList.remove('disabled-input')
|
||||||
|
const formInspeksi = @json($forminspeksi);
|
||||||
|
const addressInput = document.getElementById('address');
|
||||||
|
|
||||||
|
if (formInspeksi && formInspeksi.asset && formInspeksi.asset.alamat) {
|
||||||
|
if (formInspeksi.asset.alamat['tidak sesuai'] && formInspeksi.asset.alamat['tidak sesuai'].address) {
|
||||||
|
addressInput.value = formInspeksi.asset.alamat['tidak sesuai'].address;
|
||||||
|
} else if (formInspeksi.asset.alamat['sesuai'] && formInspeksi.asset.alamat['sesuai'].address) {
|
||||||
|
addressInput.value = formInspeksi.asset.alamat['sesuai'].address;
|
||||||
|
} else {
|
||||||
|
addressInput.value = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
inputs.forEach(element => {
|
||||||
|
if (element.tagName === 'INPUT') {
|
||||||
|
element.removeAttribute('readonly');
|
||||||
|
} else if (element.tagName === 'SELECT') {
|
||||||
|
element.removeAttribute('disabled');
|
||||||
|
element.classList.remove('disabled-input')
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function toggleFieldVisibility(fieldName, inputId, visibleValues = []) {
|
function toggleFieldVisibility(fieldName, inputId, visibleValues = []) {
|
||||||
const selectedValue = $(`[name="${fieldName}"]:checked`).val();
|
const selectedValue = $(`[name="${fieldName}"]:checked`).val();
|
||||||
const inputField = $(`#${inputId}`);
|
const inputField = $(`#${inputId}`);
|
||||||
@@ -319,12 +352,21 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.scrollable-x-auto {
|
div[disabled] {
|
||||||
overflow-x: auto;
|
background-color: #f5f5f5;
|
||||||
max-width: 100%;
|
color: #a0a0a0;
|
||||||
|
border: 1px solid #d1d1d1;
|
||||||
|
cursor: not-allowed;
|
||||||
|
|
||||||
|
pointer-events: none;
|
||||||
|
|
||||||
|
}
|
||||||
|
div[disabled]:hover {
|
||||||
|
background-color: #e8e8e8;
|
||||||
}
|
}
|
||||||
|
|
||||||
.table {
|
div.disabled-input {
|
||||||
min-width: 100%;
|
opacity: 0.6;
|
||||||
|
transition: opacity 0.3s ease;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -202,94 +202,132 @@
|
|||||||
|
|
||||||
|
|
||||||
function setupInputHandlers(containerId, buttonId, labelText, inputDataClass, buttonDeleteClass) {
|
function setupInputHandlers(containerId, buttonId, labelText, inputDataClass, buttonDeleteClass) {
|
||||||
const inputContainer = document.getElementById(containerId);
|
const addButton = document.getElementById(buttonId);
|
||||||
const addButton = document.getElementById(buttonId);
|
const inputContainer = document.getElementById(containerId);
|
||||||
|
|
||||||
function updateLabels() {
|
if (!addButton || !inputContainer) {
|
||||||
const labels = inputContainer.querySelectorAll('.form-label span');
|
console.error(`Element with ID ${containerId} or ${buttonId} not found.`);
|
||||||
labels.forEach((label, index) => {
|
return;
|
||||||
label.textContent = `${labelText} ${index + 1}`;
|
}
|
||||||
});
|
|
||||||
|
function updateLabels() {
|
||||||
|
const labels = inputContainer.querySelectorAll('.form-label span');
|
||||||
|
labels.forEach((label, index) => {
|
||||||
|
label.textContent = `${labelText} ${index + 1}`;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleDeleteButtons() {
|
||||||
|
const deleteBtns = inputContainer.querySelectorAll(`.${buttonDeleteClass}`);
|
||||||
|
deleteBtns.forEach(btn => {
|
||||||
|
btn.style.display = inputContainer.children.length > 1 ? 'block' : 'none';
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function createNewInput() {
|
||||||
|
const newDiv = inputContainer.children[0].cloneNode(true);
|
||||||
|
|
||||||
|
// Reset semua input dalam elemen baru
|
||||||
|
const inputFile = newDiv.querySelector(`.${inputDataClass}`);
|
||||||
|
if (inputFile) {
|
||||||
|
inputFile.id = `inputLingkungan-${inputContainer.children.length}`;
|
||||||
|
inputFile.value = ''; // Reset input file
|
||||||
|
|
||||||
|
// Tambahkan event listener untuk preview
|
||||||
|
inputFile.addEventListener('change', function () {
|
||||||
|
const file = this.files[0];
|
||||||
|
if (file) {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.onload = function (e) {
|
||||||
|
const img = document.getElementById(
|
||||||
|
`foto_lingkungan_preview_${inputFile.id}`
|
||||||
|
);
|
||||||
|
img.src = e.target.result;
|
||||||
|
img.style.display = 'block';
|
||||||
|
};
|
||||||
|
reader.readAsDataURL(file);
|
||||||
}
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function handleDeleteButtons() {
|
// Tambahkan logika reset untuk elemen preview
|
||||||
const deleteBtns = inputContainer.querySelectorAll(`.${buttonDeleteClass}`);
|
const imgPreview = newDiv.querySelector('img');
|
||||||
deleteBtns.forEach(btn => {
|
if (imgPreview) {
|
||||||
btn.style.display = inputContainer.children.length > 1 ? 'block' : 'none';
|
imgPreview.src = '';
|
||||||
});
|
imgPreview.style.display = 'none';
|
||||||
}
|
}
|
||||||
|
|
||||||
function createNewInput() {
|
|
||||||
const newDiv = inputContainer.children[0].cloneNode(true);
|
|
||||||
const inputFile = newDiv.querySelector(`.${inputDataClass}`);
|
|
||||||
inputFile.id = `inputRute-${inputContainer.children.length}`;
|
|
||||||
|
|
||||||
// Reset input file value
|
|
||||||
if (inputFile) {
|
|
||||||
inputFile.value = '';
|
|
||||||
}
|
|
||||||
|
|
||||||
// Update the camera button to set currentInputField
|
|
||||||
const cameraButton = newDiv.querySelector('#btnCamera');
|
|
||||||
if (cameraButton) {
|
|
||||||
cameraButton.addEventListener('click', function(e) {
|
|
||||||
e.preventDefault();
|
|
||||||
currentInputField = inputFile; // Set current input field to the new input
|
|
||||||
modal.classList.remove('hidden');
|
|
||||||
modal.classList.add('modal-open');
|
|
||||||
editor.startCamera();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Add delete button functionality
|
|
||||||
const deleteBtn = newDiv.querySelector(`.${buttonDeleteClass}`);
|
|
||||||
if (deleteBtn) {
|
|
||||||
deleteBtn.addEventListener('click', function() {
|
|
||||||
inputContainer.removeChild(newDiv);
|
|
||||||
handleDeleteButtons();
|
|
||||||
updateLabels();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Update preview container
|
|
||||||
const previewContainer = document.createElement('div');
|
|
||||||
previewContainer.className = 'preview-container';
|
|
||||||
|
|
||||||
const img = document.createElement('img');
|
|
||||||
img.id = `foto_rute-preview-${inputFile.id}`;
|
|
||||||
img.src = '';
|
|
||||||
img.className = 'mt-2 h-auto';
|
|
||||||
img.style.display = 'none';
|
|
||||||
img.style.width = '30rem';
|
|
||||||
previewContainer.appendChild(img);
|
|
||||||
|
|
||||||
// Append preview container to the new input group
|
|
||||||
const inputGroup = newDiv.querySelector('.input-group');
|
|
||||||
inputGroup.appendChild(previewContainer);
|
|
||||||
|
|
||||||
newDiv.style.marginTop = '10px';
|
|
||||||
inputContainer.appendChild(newDiv);
|
|
||||||
updateLabels();
|
|
||||||
handleDeleteButtons();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (addButton) {
|
|
||||||
addButton.addEventListener('click', createNewInput);
|
|
||||||
}
|
|
||||||
|
|
||||||
const firstDeleteBtn = inputContainer.children[0].querySelector(`.${buttonDeleteClass}`);
|
|
||||||
if (firstDeleteBtn) {
|
|
||||||
firstDeleteBtn.addEventListener('click', function() {
|
|
||||||
if (inputContainer.children.length > 1) {
|
|
||||||
inputContainer.removeChild(this.closest('.flex'));
|
|
||||||
handleDeleteButtons();
|
|
||||||
updateLabels();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
|
const deleteBtn = newDiv.querySelector(`.${buttonDeleteClass}`);
|
||||||
|
if (deleteBtn) {
|
||||||
|
deleteBtn.addEventListener('click', function () {
|
||||||
|
inputContainer.removeChild(newDiv);
|
||||||
|
handleDeleteButtons();
|
||||||
updateLabels();
|
updateLabels();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tambahkan container preview jika tidak ada
|
||||||
|
let previewContainer = newDiv.querySelector('.preview-container');
|
||||||
|
if (!previewContainer) {
|
||||||
|
previewContainer = document.createElement('div');
|
||||||
|
previewContainer.className = 'preview-container';
|
||||||
|
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.id = `foto_lingkungan_preview_${inputFile.id}`;
|
||||||
|
img.src = '';
|
||||||
|
img.className = 'mt-2 h-auto';
|
||||||
|
img.style.display = 'none';
|
||||||
|
img.style.width = '30rem';
|
||||||
|
previewContainer.appendChild(img);
|
||||||
|
|
||||||
|
const inputGroup = newDiv.querySelector('.input-group');
|
||||||
|
inputGroup.appendChild(previewContainer);
|
||||||
|
}
|
||||||
|
|
||||||
|
newDiv.style.marginTop = '10px';
|
||||||
|
inputContainer.appendChild(newDiv);
|
||||||
|
updateLabels();
|
||||||
|
handleDeleteButtons();
|
||||||
|
}
|
||||||
|
|
||||||
|
addButton.addEventListener('click', createNewInput);
|
||||||
|
|
||||||
|
// Terapkan event listener pada elemen yang sudah ada
|
||||||
|
const existingInputs = inputContainer.querySelectorAll(`.${inputDataClass}`);
|
||||||
|
existingInputs.forEach((input, index) => {
|
||||||
|
const deleteBtn = input.closest('.flex').querySelector(`.${buttonDeleteClass}`);
|
||||||
|
if (deleteBtn) {
|
||||||
|
deleteBtn.addEventListener('click', function () {
|
||||||
|
if (inputContainer.children.length > 1) {
|
||||||
|
inputContainer.removeChild(this.closest('.flex'));
|
||||||
|
handleDeleteButtons();
|
||||||
|
updateLabels();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
input.addEventListener('change', function () {
|
||||||
|
const file = this.files[0];
|
||||||
|
if (file) {
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.onload = function (e) {
|
||||||
|
const img = document.getElementById(
|
||||||
|
`foto_lingkungan_preview_${index}`
|
||||||
|
);
|
||||||
|
img.src = e.target.result;
|
||||||
|
img.style.display = 'block';
|
||||||
|
};
|
||||||
|
reader.readAsDataURL(file);
|
||||||
}
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
updateLabels();
|
||||||
|
handleDeleteButtons();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
setupInputHandlers('inputContainerRute', 'btnRute', 'Foto Rute Menuju Lokasi', 'file-input',
|
setupInputHandlers('inputContainerRute', 'btnRute', 'Foto Rute Menuju Lokasi', 'file-input',
|
||||||
'delete-btn');
|
'delete-btn');
|
||||||
|
|||||||
Reference in New Issue
Block a user