264 lines
15 KiB
PHP
264 lines
15 KiB
PHP
@extends('layout.app')
|
|
|
|
@section('content')
|
|
<div class="page-header">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item">Home</li>
|
|
<li class="breadcrumb-item"><a href="{{ route('warga.index') }}">Data Warga</a></li>
|
|
<li class="breadcrumb-item active">Edit Warga</li>
|
|
</ol>
|
|
</div>
|
|
|
|
<div class="row gutters">
|
|
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
|
|
<div class="card shadow-sm">
|
|
<div class="card-header">
|
|
<div class="card-title">Edit Data Penerima Bantuan Sosial: {{ $warga->nama }}</div>
|
|
</div>
|
|
<div class="card-body">
|
|
@if (session('error'))
|
|
<div class="alert alert-danger">{{ session('error') }}</div>
|
|
@endif
|
|
|
|
<form action="{{ route('warga.update', $warga->id) }}" method="POST" enctype="multipart/form-data"
|
|
id="formWarga">
|
|
@csrf
|
|
@method('PUT')
|
|
|
|
{{-- SEKSI I: IDENTITAS DIRI --}}
|
|
<div class="row gutters">
|
|
<div class="col-12">
|
|
<h6 class="mb-3 text-success font-weight-bold">I. Identitas Diri</h6>
|
|
</div>
|
|
|
|
<div class="col-md-4 col-12">
|
|
<div class="form-group">
|
|
<label>NIK (16 Digit)</label>
|
|
<input type="text" name="nik"
|
|
class="form-control @error('nik') is-invalid @enderror"
|
|
value="{{ old('nik', $warga->nik) }}" required maxlength="16">
|
|
@error('nik')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-8 col-12">
|
|
<div class="form-group">
|
|
<label>Nama Lengkap Kepala Keluarga</label>
|
|
<input type="text" name="nama"
|
|
class="form-control @error('nama') is-invalid @enderror"
|
|
value="{{ old('nama', $warga->nama) }}" required>
|
|
@error('nama')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-8 col-12">
|
|
<div class="form-group">
|
|
<label>Alamat Domisili</label>
|
|
<input type="text" name="alamat"
|
|
class="form-control @error('alamat') is-invalid @enderror"
|
|
value="{{ old('alamat', $warga->alamat) }}" required>
|
|
@error('alamat')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-2 col-6">
|
|
<div class="form-group">
|
|
<label>RT</label>
|
|
<input type="text" name="rt"
|
|
class="form-control @error('rt') is-invalid @enderror"
|
|
value="{{ old('rt', $warga->rt) }}" required maxlength="3">
|
|
@error('rt')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-4 col-12">
|
|
<div class="form-group">
|
|
<label class="text-danger font-weight-bold">Status Keberadaan Warga</label>
|
|
<select name="status_bansos_riil"
|
|
class="form-control @error('status_bansos_riil') is-invalid @enderror" required>
|
|
<option value="aktif"
|
|
{{ old('status_bansos_riil', $warga->status_bansos_riil) == 'aktif' ? 'selected' : '' }}>
|
|
🟢 Aktif / Masih Ada</option>
|
|
<option value="meninggal"
|
|
{{ old('status_bansos_riil', $warga->status_bansos_riil) == 'meninggal' ? 'selected' : '' }}>
|
|
⚫ Meninggal Dunia</option>
|
|
<option value="pindah"
|
|
{{ old('status_bansos_riil', $warga->status_bansos_riil) == 'pindah' ? 'selected' : '' }}>
|
|
🟠 Pindah Domisili / Luar Kota</option>
|
|
<option value="mampu"
|
|
{{ old('status_bansos_riil', $warga->status_bansos_riil) == 'mampu' ? 'selected' : '' }}>
|
|
🔵 Sudah Mampu (Kaya)</option>
|
|
</select>
|
|
@error('status_bansos_riil')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-2 col-6">
|
|
<div class="form-group">
|
|
<label>RW</label>
|
|
<input type="text" name="rw"
|
|
class="form-control @error('rw') is-invalid @enderror"
|
|
value="{{ old('rw', $warga->rw) }}" required maxlength="3">
|
|
@error('rw')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<hr class="my-4">
|
|
|
|
{{-- SEKSI II: KRITERIA --}}
|
|
<div class="row gutters">
|
|
<div class="col-12">
|
|
<h6 class="mb-3 text-success font-weight-bold">II. Variabel Kriteria Seleksi</h6>
|
|
</div>
|
|
@foreach ($kriterias as $k)
|
|
@php
|
|
$savedDetail = $warga->details->where('kriteria_id', $k->id)->first();
|
|
$currentValue = $savedDetail ? $savedDetail->nilai_asli : '';
|
|
@endphp
|
|
<div class="col-md-6 col-12">
|
|
<div class="form-group">
|
|
<label class="font-weight-bold text-dark">{{ $k->kode }}:
|
|
{{ $k->nama }}</label>
|
|
<select name="kriteria_{{ $k->id }}" class="form-control" required>
|
|
<option value="">-- Pilih {{ $k->nama }} --</option>
|
|
@foreach ($k->subKriterias as $sub)
|
|
<option value="{{ $sub->nama_sub }}"
|
|
{{ old('kriteria_' . $k->id, $currentValue) == $sub->nama_sub ? 'selected' : '' }}>
|
|
{{ $sub->nama_sub }}</option>
|
|
@endforeach
|
|
</select>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
|
|
<hr class="my-4">
|
|
|
|
{{-- SEKSI III: BERKAS PENDUKUNG --}}
|
|
<div class="row gutters">
|
|
<div class="col-12">
|
|
<h6 class="mb-2 text-success font-weight-bold">III. Berkas Pendukung</h6>
|
|
</div>
|
|
|
|
@if ($warga->dokumen_pendukung && count($warga->dokumen_pendukung) > 0)
|
|
<div class="col-12 mb-3">
|
|
<label class="small font-weight-bold text-muted">File Terpilih (Centang untuk
|
|
menghapus):</label>
|
|
<div class="row bg-light p-3 rounded border">
|
|
@foreach ($warga->dokumen_pendukung as $path)
|
|
<div class="col-md-2 col-6 mb-2">
|
|
<div
|
|
class="border p-2 rounded text-center bg-white shadow-sm position-relative">
|
|
@if (Str::endsWith($path, '.pdf'))
|
|
<i class="icon-file-text h2 text-danger d-block mb-2"></i>
|
|
@else
|
|
{{-- Perbaikan Path Gambar --}}
|
|
<img src="{{ asset('storage/' . $path) }}"
|
|
class="img-fluid rounded mb-2"
|
|
style="height: 60px; object-fit: cover;"
|
|
onerror="this.src='https://placehold.co/100x100?text=Error'">
|
|
@endif
|
|
<div class="custom-control custom-checkbox">
|
|
<input type="checkbox" name="hapus_dokumen[]"
|
|
value="{{ $path }}" class="custom-control-input"
|
|
id="del-{{ $loop->index }}">
|
|
<label class="custom-control-label text-danger small"
|
|
for="del-{{ $loop->index }}">Hapus</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
@endif
|
|
|
|
<div class="col-12">
|
|
<div class="form-group p-4 text-center"
|
|
style="border: 2px dashed #32be8f; border-radius: 12px; background: #fafffd;">
|
|
<div id="file-preview-container" class="row mb-3 justify-content-center"></div>
|
|
<i class="icon-plus-circle h1 text-success opacity-50 d-block"></i>
|
|
<label class="d-block mt-2 font-weight-bold" style="cursor: pointer;"
|
|
for="file-selector">Pilih Dokumen Tambahan</label>
|
|
<input type="file" id="file-selector" class="form-control-file d-none" multiple
|
|
accept=".jpg,.jpeg,.png,.pdf">
|
|
<input type="file" name="files[]" id="real-file-input" class="d-none" multiple>
|
|
<small class="text-muted d-block mt-2">JPG, PNG, PDF. Maks 2MB/file.</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row gutters mt-4">
|
|
<div class="col-12 text-right">
|
|
<a href="{{ route('warga.index') }}"
|
|
class="btn btn-outline-secondary px-4 mr-2">Batal</a>
|
|
<button type="submit" class="btn btn-primary px-5"
|
|
style="background-color: #32be8f; border: none;">Update Data Warga</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
const fileSelector = document.getElementById('file-selector');
|
|
const realFileInput = document.getElementById('real-file-input');
|
|
const previewContainer = document.getElementById('file-preview-container');
|
|
let dataStorage = new DataTransfer();
|
|
|
|
fileSelector.addEventListener('change', function() {
|
|
const files = Array.from(this.files);
|
|
files.forEach(file => {
|
|
dataStorage.items.add(file);
|
|
const reader = new FileReader();
|
|
reader.onload = function(e) {
|
|
const col = document.createElement('div');
|
|
col.className = 'col-md-2 col-sm-4 col-6 mb-3 position-relative';
|
|
let icon = file.type === 'application/pdf' ?
|
|
'<i class="icon-file-text text-danger" style="font-size: 40px; margin:15px 0;"></i>' :
|
|
`<img src="${e.target.result}" class="img-thumbnail" style="height: 80px; width: 100%; object-fit: cover;">`;
|
|
|
|
col.innerHTML = `
|
|
<div class="p-2 border rounded bg-white shadow-sm h-100 d-flex flex-column align-items-center justify-content-center">
|
|
${icon}
|
|
<small class="d-block text-truncate mt-1 w-100 text-center" title="${file.name}">${file.name}</small>
|
|
<button type="button" class="btn btn-danger btn-sm position-absolute rounded-circle btn-remove"
|
|
data-name="${file.name}" style="top: -5px; right: 5px; padding: 0px 6px; z-index:10;">×</button>
|
|
</div>`;
|
|
previewContainer.appendChild(col);
|
|
}
|
|
reader.readAsDataURL(file);
|
|
});
|
|
realFileInput.files = dataStorage.files;
|
|
this.value = '';
|
|
});
|
|
|
|
previewContainer.addEventListener('click', function(e) {
|
|
if (e.target.classList.contains('btn-remove')) {
|
|
const fileName = e.target.getAttribute('data-name');
|
|
const newDataTransfer = new DataTransfer();
|
|
Array.from(dataStorage.files).forEach(file => {
|
|
if (file.name !== fileName) newDataTransfer.items.add(file);
|
|
});
|
|
dataStorage = newDataTransfer;
|
|
realFileInput.files = dataStorage.files;
|
|
e.target.closest('.col-md-2').remove();
|
|
}
|
|
});
|
|
</script>
|
|
@endsection
|