// Fungsi inisialisasi Selectize dan Auto-expand function initSelectize(formElement) { const tanggalSelect = formElement.querySelector('.date-input'); if (tanggalSelect) { $(tanggalSelect).selectize({ valueField: 'tanggal', labelField: 'tgl', create: true, placeholder: "Masukkan Tanggal...", }); } } document.addEventListener('DOMContentLoaded', function () { const firstForm = document.querySelector('.form-set'); initSelectize(firstForm); }); // Fungsi untuk menambah form baru let countForm = 1; // karena form pertama pakai index 0 function addFormJadwalKonsul() { const container = document.getElementById('form-sets-container'); const original = container.querySelector('.form-set'); const html = original.outerHTML .replace(/\[0\]/g, `[${countForm}]`); const wrapper = document.createElement('div'); wrapper.innerHTML = html.trim(); const newForm = wrapper.firstChild; // Hapus Selectize wrapper jika ada newForm.querySelectorAll('select').forEach(select => { const wrapper = select.nextElementSibling; if (wrapper?.classList.contains('selectize-control')) wrapper.remove(); select.value = ''; if (select.multiple) { // Untuk multiple select, pastikan semua opsi tidak terseleksi Array.from(select.options).forEach(option => option.selected = false); } }); container.appendChild(newForm); initSelectize(newForm); countForm++; } // Hapus form-set (kecuali jika hanya 1) document.addEventListener('click', function (e) { if (e.target.closest('.btn-remove-form')) { const targetForm = e.target.closest('.form-set'); const total = document.querySelectorAll('.form-set').length; if (total > 1) { targetForm.remove(); } else { alert('Minimal satu form harus ada.'); } } }); document.getElementById('formMasterJadwalKonsul').addEventListener('submit', function(e){ e.preventDefault(); const form = this; const actionUrl = form.getAttribute('action'); const formData = new FormData(form); fetch(actionUrl, { method: 'POST', headers: { 'X-CSRF-TOKEN': document.querySelector('input[name="_token"]').value, }, body: formData }).then(async (res) => { const data = await res.json(); if (data.status) { const handler = function () { Swal.fire({ icon: 'success', title: 'Berhasil', text: data.message, timer: 2000, showConfirmButton: false, backdrop: true, }); datatableMasterJadwalKonsul.bootstrapTable('refresh'); modalAddJadwalKonsul.removeEventListener('hidden.bs.modal', handler); // ✅ pakai DOM }; modalAddJadwalKonsul.addEventListener('hidden.bs.modal', handler); // ✅ pakai DOM bootstrap.Modal.getInstance(modalAddJadwalKonsul).hide(); // ✅ pakai instance const allFormSets = document.querySelectorAll('.form-set'); for(let i = 1; i < allFormSets.length; i++){ allFormSets[i].remove(); } document.querySelectorAll('.form-set').forEach((formSet, index) => { formSet.querySelectorAll('input, textarea, select').forEach(el => { // Reset Selectize jika ada if (el.classList.contains('selectized')) { const selectize = el.selectize; if (selectize) { selectize.clear(); } } }); }); } else { throw new Error(data.message || 'Terjadi kesalahan saat mengubah status.'); } }).catch(err => { console.error(err); Swal.fire({ icon: 'error', title: 'Gagal', text: err.message || 'Terjadi kesalahan pada server.', }); }); }) function deleteMasterJadwalKonsul(e){ let id = $(e).data('jadwal_konsul_id') Swal.fire({ title: "Apakah kamu yakin ingin menghapus data ini?", text : $(e).data('nama_dokter'), icon: "warning", showCancelButton: true, backdrop: true, }).then((result) => { if(result.isConfirmed){ fetch(`/dashboard/jadwal-konsul/${id}`, { method:'DELETE', headers: { "X-CSRF-TOKEN": document.querySelector('input[name="_token"]').value, "Content-Type": "application/json" } }).then((response) => { if(!response.ok){ throw new Error("Network response was not ok"); } return response.json(); }) .then((data) => { if(data.status){ Swal.fire({ title: "Success", text: "Data berhasil dihapus", icon:"success", showConfirmButton: false, timer: 1000 }).then(() => { datatableMasterJadwalKonsul.bootstrapTable("refresh") }) }else{ Swal.fire({ title: "Error!", text: data.message || "Failed to delete Item.", icon: "error" }); } }) .catch(error => { Swal.fire({ title: "Error!", text: "Something went wrong. Please try again later.", icon: "error" }); }); } }) } let tanggalSelectizeInstance = null; function editMasterJadwalKonsul(e) { const el = $(e); const modal = new bootstrap.Modal(modalMasterJadwalKonsulEdit); formMasterJadwalKonsulEdit.setAttribute('action', `/dashboard/jadwal-konsul/${el.data('jadwal_konsul_id')}`) modal.show(); // Ambil data let dataOld = { jadwal_konsul_id: el.data('jadwal_konsul_id'), nama_dokter: el.data('nama_dokter'), tgl: JSON.parse(decodeURIComponent(el.data('tgl_available') || '[]')), }; // Set value ke input form $("#nama_dokter_edit").val(dataOld.nama_dokter); const tanggalField = document.getElementById('tanggal_edit'); if(tanggalSelectizeInstance){ tanggalSelectizeInstance.destroy(); tanggalSelectizeInstance = null } tanggalField.style.display = 'block'; tanggalSelectizeInstance =$('#tanggal_edit').selectize({ valueField: 'tanggal', labelField: 'tgl', create: true, placeholder: 'Masukkan Tanggal...', onInitialize: function () { const s = this; dataOld.tgl.forEach(item => { const tglValue = item?.tgl_harian || item?.tanggal || item; s.addOption({ tanggal: tglValue, tgl: tglValue }); s.addItem(tglValue); }); } })[0].selectize; } document.getElementById('formMasterJadwalKonsulEdit').addEventListener('submit', function(e){ e.preventDefault(); const form = this; const actionUrl = form.getAttribute('action'); const formData = new FormData(form); fetch(actionUrl, { method: 'POST', headers: { 'X-CSRF-TOKEN': document.querySelector('input[name="_token"]').value, }, body: formData }).then(async (res) => { const data = await res.json(); if (data.status) { form.reset(); const handler = function () { Swal.fire({ icon: 'success', title: 'Berhasil', text: data.message, timer: 2000, showConfirmButton: false, backdrop: true, }); datatableMasterJadwalKonsul.bootstrapTable('refresh'); modalMasterJadwalKonsulEdit.removeEventListener('hidden.bs.modal', handler); // ✅ pakai DOM }; modalMasterJadwalKonsulEdit.addEventListener('hidden.bs.modal', handler); // ✅ pakai DOM bootstrap.Modal.getInstance(modalMasterJadwalKonsulEdit).hide(); // ✅ pakai instance } else { throw new Error(data.message || 'Terjadi kesalahan saat mengubah status.'); } }).catch(err => { console.error(err); Swal.fire({ icon: 'error', title: 'Gagal', text: err.message || 'Terjadi kesalahan pada server.', }); }); })