feat(jenis-legalitas-jaminan): tambahkan endpoint untuk mengambil custom fields

- Menambahkan metode `getCustomFields` pada `JenisLegalitasJaminanController` untuk mengembalikan custom fields berdasarkan ID.
- Memperbarui tampilan untuk menggunakan ID jenis legalitas jaminan saat menambahkan input file.
- Mengubah fungsi `addFileInput` untuk menerima ID jenis legalitas jaminan dan mengambil custom fields yang relevan.
- Memperbarui rute untuk menambahkan endpoint baru yang mengarah ke metode `getCustomFields`.
This commit is contained in:
Daeng Deni Mardaeni
2025-03-08 21:27:25 +07:00
parent 7d7e19cdce
commit 9619b74695
3 changed files with 66 additions and 37 deletions

View File

@@ -150,4 +150,16 @@
{
return Excel::download(new JenisLegalitasJaminanExport, 'jenis_legalitas_jaminan.xlsx');
}
public function getCustomFields($id)
{
$jenisLegalitasJaminan = JenisLegalitasJaminan::findOrFail($id);
if(!$jenisLegalitasJaminan->custom_fields) {
return response()->json([]);
}
$customFields = CustomField::whereIn('id', $jenisLegalitasJaminan->custom_fields)->get();
return response()->json($customFields);
}
}

View File

@@ -395,7 +395,7 @@
@endforeach
</div>
<div class="flex items-center justify-end gap-2 my-2 w-full">
<button type="button" class="flex-none btn btn-primary text-center" onclick="addFileInput({{$n}},{{ $p_index-1 }})">Add File</button>
<button type="button" class="flex-none btn btn-primary text-center" onclick="addFileInput({{$n}},{{ $detail->jenisLegalitasJaminan->id }})">Add File</button>
</div>
@else
<div class="flex flex-col w-full gap-2" id="document_container">
@@ -445,7 +445,7 @@
@endif
</div>
<div class="flex items-center justify-end gap-2 my-2 w-full">
<button type="button" class="flex-none btn btn-primary text-center" onclick="addFileInput({{ $n }})">Add File</button>
<button type="button" class="flex-none btn btn-primary text-center" onclick="addFileInput({{ $n }},{{ $detail->jenisLegalitasJaminan->id }})">Add File</button>
</div>
@php $p_index++; @endphp
@endif
@@ -536,7 +536,7 @@
</div>
</div>
<div class="flex items-center justify-end gap-2 my-2 w-full">
<button type="button" class="flex-none btn btn-primary text-center" onclick="addFileInput({{ $n }})">Add File</button>
<button type="button" class="flex-none btn btn-primary text-center" onclick="addFileInput({{ $n }}, {{ $item->id }})">Add File</button>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
@@ -619,6 +619,42 @@
{{--Legalitas Jaminan--}}
<script>
function getCustomFields(jenisLegalitasJaminanId, index, newFieldIndex) {
return fetch(`/basic-data/jenis-jaminan/custom-fields/${jenisLegalitasJaminanId}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
"X-Requested-With": "XMLHttpRequest"
}
})
.then(response => {
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
return response.json();
})
.then(customFields => {
let customFieldsHtml = '';
customFields.forEach(field => {
customFieldsHtml += `
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 mb-2 custom-field">
<label class="form-label max-w-56 capitalize">
${field.label}
</label>
<div class="flex flex-wrap items-baseline w-full">
${getCustomFieldInput(index, field.type, field.name, null, jenisLegalitasJaminanId, newFieldIndex)}
</div>
</div>
`;
});
return customFieldsHtml;
})
.catch(error => {
console.error("Error fetching custom fields:", error);
return '';
});
}
function getLegalitasJaminan() {
var legalitasJaminan = document.getElementById("jenis_jaminan_id").value;
var documentId = "{{ $document->id ?? "0" }}";
@@ -641,6 +677,7 @@
var doctainer = document.getElementById("doctainer");
doctainer.innerHTML = "";
data.forEach((item, index) => {
console.log(item);
doctainer.innerHTML += `
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56 font-bold">
@@ -686,7 +723,7 @@
</div>
<div class="flex items-center justify-end gap-2 my-2 w-full">
<button type="button" class="flex-none btn btn-primary text-center" onclick="addFileInput(${index})">Add File</button>
<button type="button" class="flex-none btn btn-primary text-center" onclick="addFileInput(${index},${item.jenis_legalitas_jaminan_id})">Add File</button>
</div>
</div>
@@ -704,16 +741,9 @@
.catch(error => console.error("Error:", error));
}
function addFileInput(index, pindex = null) {
function addFileInput(index, jenisLegalitasJaminanId = null) {
const documentContainer = document.getElementById(`document-container-${index}`);
let container = null;
const parentContainer = documentContainer.querySelector('#document_container');
if (pindex !== null) {
container = parentContainer.querySelector(`#document_container_${pindex}`);
} else {
container = documentContainer.querySelector('#document_container');
}
const container = documentContainer.querySelector('#document_container');
const customFields = container.querySelectorAll('.custom-field');
@@ -725,34 +755,20 @@
const newInput = document.createElement("div");
newInput.className = "flex flex-col w-full gap-2 mb-4 custom-field-set";
let customFieldsHtml = '';
customFields.forEach(field => {
const label = field.querySelector('label').textContent;
const input = field.querySelector('input, textarea, select');
const fieldName = input.name.match(/\[([^\]]+)\]$/)[1];
customFieldsHtml += `
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56 capitalize">${label}</label>
<div class="flex flex-wrap items-baseline w-full">
${getCustomFieldInput(index, input.type, fieldName, null, null, newFieldIndex)}
getCustomFields(jenisLegalitasJaminanId, index, newFieldIndex).then(customFieldsHtml => {
newInput.innerHTML = `
<div class="flex flex-wrap items-baseline w-full">
<div class="flex items-center gap-2 w-full">
<input class="flex-1 input" type="text" name="dokumen_nomor[${index}][]" placeholder="Nomor Dokumen">
<input class="flex-1 file-input" type="file" name="dokumen_jaminan[${index}][]" accept=".pdf,image/*">
<button type="button" class="flex-none btn btn-danger text-center" onclick="removeFileInput(this)">Remove</button>
</div>
</div>
${customFieldsHtml}
`;
container.appendChild(newInput);
});
newInput.innerHTML = `
<div class="flex flex-wrap items-baseline w-full">
<div class="flex items-center gap-2 w-full">
<input class="flex-1 input" type="text" name="dokumen_nomor[${index}][]" placeholder="Nomor Dokumen">
<input class="flex-1 file-input" type="file" name="dokumen_jaminan[${index}][]" accept=".pdf,image/*">
<button type="button" class="flex-none btn btn-danger text-center" onclick="removeFileInput(this)">Remove</button>
</div>
</div>
${customFieldsHtml}
`;
parentContainer.appendChild(newInput);
}
function removeFileInput(button) {

View File

@@ -82,6 +82,7 @@ Route::middleware(['auth'])->group(function () {
Route::resource('jenis-legalitas-jaminan', JenisLegalitasJaminanController::class);
Route::name('jenis-jaminan.')->prefix('jenis-jaminan')->group(function () {
Route::get('custom-fields/{id}', [JenisLegalitasJaminanController::class, 'getCustomFields'])->name('ustom-fields');
Route::get('legalitas/{id}/{jenisJaminanId}', [DokumenJaminanController::class, 'getLegalitasJaminan'])
->name('legalitas');
Route::get('restore/{id}', [JenisJaminanController::class, 'restore'])->name('restore');