61 lines
2.4 KiB
JavaScript
61 lines
2.4 KiB
JavaScript
export const renderForm = (type, geometry, onSubmit, onCancel) => {
|
|
const container = document.getElementById('form-container');
|
|
container.style.display = 'flex';
|
|
|
|
let extraFields = '';
|
|
if (type === 'spbu') {
|
|
extraFields = `
|
|
<div class="form-group">
|
|
<label class="checkbox-group">
|
|
<input type="checkbox" id="input-24jam">
|
|
<span>Buka 24 Jam</span>
|
|
</label>
|
|
</div>
|
|
`;
|
|
} else if (type === 'kavling') {
|
|
extraFields = `
|
|
<div class="form-group">
|
|
<input type="number" id="input-luas" class="form-control" placeholder="Luas (m²)" required min="1">
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
container.innerHTML = `
|
|
<div class="form-panel">
|
|
<h3 style="margin:0 0 10px 0; font-size:1rem; border-bottom:1px solid rgba(255,255,255,0.1); padding-bottom:8px;">Simpan Data (${type.toUpperCase()})</h3>
|
|
<div class="form-group">
|
|
<input type="text" id="input-nama" class="form-control" placeholder="Nama / Label" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<input type="text" id="input-deskripsi" class="form-control" placeholder="Deskripsi Singkat">
|
|
</div>
|
|
${extraFields}
|
|
<div style="display:flex; gap:10px; margin-top:8px;">
|
|
<button id="btn-save" class="btn-submit" style="flex:1;">Simpan</button>
|
|
<button id="btn-cancel" class="btn-submit" style="background:rgba(255,255,255,0.1); color:var(--text-light); flex:1;">Batal</button>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
document.getElementById('btn-save').addEventListener('click', () => {
|
|
const payload = {
|
|
type,
|
|
geometry,
|
|
nama: document.getElementById('input-nama').value,
|
|
deskripsi: document.getElementById('input-deskripsi').value,
|
|
};
|
|
if (type === 'spbu') payload.buka_24_jam = document.getElementById('input-24jam').checked;
|
|
if (type === 'kavling') payload.luas = document.getElementById('input-luas').value;
|
|
|
|
onSubmit(payload);
|
|
container.style.display = 'none';
|
|
container.innerHTML = '';
|
|
});
|
|
|
|
document.getElementById('btn-cancel').addEventListener('click', () => {
|
|
if(onCancel) onCancel();
|
|
container.style.display = 'none';
|
|
container.innerHTML = '';
|
|
});
|
|
};
|