update
Ilham Wara Nugroho
parent
e26f81fe40
commit
2c57fd3c80
|
|
@ -1172,429 +1172,6 @@
|
||||||
(subKategori || sessionSubKategori);
|
(subKategori || sessionSubKategori);
|
||||||
}
|
}
|
||||||
|
|
||||||
// function loadQuestion(mitigation_id) {
|
|
||||||
// $('#section4').show();
|
|
||||||
// $('#accordion-4').html('<p class="text-muted ml-1">Loading...</p>');
|
|
||||||
|
|
||||||
// $.get(base_url+'/mitigasi/form-mitigasi-question', { mitigation_id })
|
|
||||||
// .done(data => {
|
|
||||||
// if (!data || !data.length) {
|
|
||||||
// $('#accordion-4').html(
|
|
||||||
// '<p class="text-muted ml-1" style="font-size:12px">Pertanyaan tidak tersedia.</p>'
|
|
||||||
// );
|
|
||||||
// return;
|
|
||||||
// }
|
|
||||||
// window.lastQuestionData = data;
|
|
||||||
|
|
||||||
// const answers = window.sessionActivityForms || {};
|
|
||||||
// const questionMap = {};
|
|
||||||
// const childMap = {};
|
|
||||||
// data.forEach(q => {
|
|
||||||
// questionMap[q.sequence] = q;
|
|
||||||
// if (q.ad_sequence) {
|
|
||||||
// if (!childMap[q.ad_sequence]) childMap[q.ad_sequence] = [];
|
|
||||||
// childMap[q.ad_sequence].push(q.sequence);
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// function getAnswer(seq, idx = 0) {
|
|
||||||
// const arr = answers[`activity_data_${seq}`];
|
|
||||||
// return arr && arr.length > idx ? arr[idx] : '';
|
|
||||||
// }
|
|
||||||
// function getUnit(seq, idx = 0) {
|
|
||||||
// const arr = answers[`unit_${seq}`];
|
|
||||||
// if (Array.isArray(arr)) return arr.length > idx ? arr[idx] : '';
|
|
||||||
// return typeof arr === 'string' ? arr : '';
|
|
||||||
// }
|
|
||||||
|
|
||||||
// let multiQs = data.filter(q => q.is_multiple || q.group === 'MULTIPLE' || q.type === 'multiple');
|
|
||||||
|
|
||||||
// const methodQuestion = data.find(q => q.type === 'method');
|
|
||||||
// const methodSequence = methodQuestion?.sequence;
|
|
||||||
// let methodAnswer = '';
|
|
||||||
// if (methodSequence) {
|
|
||||||
// const methodAnswers = answers[`activity_data_${methodSequence}`];
|
|
||||||
// if (Array.isArray(methodAnswers) && methodAnswers.length > 0) {
|
|
||||||
// methodAnswer = methodAnswers[0];
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function makeRow(q, idx, showRemove, value) {
|
|
||||||
// let inputEl = "";
|
|
||||||
// value = value || '';
|
|
||||||
// if (q.type === 'text') {
|
|
||||||
// inputEl = `<input type="text"
|
|
||||||
// name="activity_data_${q.sequence}[${idx}]"
|
|
||||||
// class="form-control mb-2 w-95 question-input"
|
|
||||||
// data-sequence="${q.sequence}" data-parent="${q.ad_sequence || ''}"
|
|
||||||
// value="${value.replace(/"/g, '"')}"
|
|
||||||
// ${q.is_required ? 'required' : ''}>`;
|
|
||||||
// } else if (q.type === 'form' || q.type === 'method') {
|
|
||||||
// console.log(value);
|
|
||||||
// inputEl = `
|
|
||||||
// <select name="activity_data_${q.sequence}[${idx}]"
|
|
||||||
// class="form-control mb-2 w-95 question-input"
|
|
||||||
// data-sequence="${q.sequence}" data-parent="${q.ad_sequence || ''}"
|
|
||||||
// ${q.is_required ? 'required' : ''}>
|
|
||||||
// ${q.choices.map(c => {
|
|
||||||
// let selected = '';
|
|
||||||
// if (typeof value === 'string' && value.trim().toLowerCase() === c.form.trim().toLowerCase()) {
|
|
||||||
// selected = ' selected';
|
|
||||||
// }
|
|
||||||
// return `<option value="${c.form}"${selected}>${c.form}</option>`;
|
|
||||||
// }).join('')}
|
|
||||||
// </select>
|
|
||||||
// `;
|
|
||||||
// } else {
|
|
||||||
// console.log(value);
|
|
||||||
// console.log(typeof(value));
|
|
||||||
// console.log(q.choices);
|
|
||||||
// console.log(q.choices.map(c => value === c));
|
|
||||||
// inputEl = `<select name="activity_data_${q.sequence}[${idx}]"
|
|
||||||
// class="form-control mb-2 w-95 question-input"
|
|
||||||
// data-sequence="${q.sequence}" data-parent="${q.ad_sequence || ''}"
|
|
||||||
// ${q.is_required ? 'required' : ''}>
|
|
||||||
// ${q.choices.map(c => `<option${value === c ? ' selected' : ''}>${c}</option>`).join('')}
|
|
||||||
// </select>`;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const removeBtn = showRemove
|
|
||||||
// ? `<button type="button" class="btn btn-danger btn-sm ml-2 remove-row">Hapus</button>`
|
|
||||||
// : `<button type="button" class="btn btn-danger btn-sm ml-2 remove-row d-none">Hapus</button>`;
|
|
||||||
|
|
||||||
// return `
|
|
||||||
// <div class="mb-2 row-input question-row"
|
|
||||||
// data-sequence="${q.sequence}" data-parent="${q.ad_sequence || ''}" data-question-plus="${q.question_plus || ''}">
|
|
||||||
// ${inputEl}
|
|
||||||
// ${removeBtn}
|
|
||||||
// </div>`;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// let allHtml = '';
|
|
||||||
// data.forEach((q, idx) => {
|
|
||||||
// let unitOrDesc = '';
|
|
||||||
// let unitVal = getUnit(q.sequence);
|
|
||||||
|
|
||||||
// if (q.type === 'form' || q.type === 'method') {
|
|
||||||
// unitOrDesc = `
|
|
||||||
// <div class="form-desc-list mt-1" data-sequence="${q.sequence}">
|
|
||||||
// ${q.choices.map(c => `
|
|
||||||
// <p class="form-desc" data-form="${c.form}" style="display:none;font-size:12px;margin-bottom:0;">
|
|
||||||
// ${c.desc}
|
|
||||||
// </p>
|
|
||||||
// `).join('')}
|
|
||||||
// </div>`;
|
|
||||||
// } else if (q.units && q.units.length === 1) {
|
|
||||||
// unitOrDesc = `<input type="hidden" name="unit_${q.sequence}" value="${q.units[0]}">
|
|
||||||
// <span class="text-muted small ml-1">${q.units[0]}</span>`;
|
|
||||||
// } else if (q.units && q.units.length > 1) {
|
|
||||||
// unitOrDesc = `<select name="unit_${q.sequence}"
|
|
||||||
// class="form-control-sm d-inline-block w-auto unit-select mt-2" required>
|
|
||||||
// ${q.units.map(u => `<option${unitVal === u ? ' selected' : ''}>${u}</option>`).join('')}
|
|
||||||
// </select>`;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// if (!q.is_multiple) {
|
|
||||||
// const val = getAnswer(q.sequence, 0);
|
|
||||||
// allHtml += `
|
|
||||||
// <div class="form-group question-group" id="group-${q.sequence}"
|
|
||||||
// data-question-plus="${q.question_plus || ''}" ${q.ad_sequence ? 'data-ad-sequence="1"' : ''}>
|
|
||||||
// <label class="${q.is_required ? 'required-label' : ''} font-weight-bold">
|
|
||||||
// ${q.activity_data}
|
|
||||||
// </label>
|
|
||||||
// ${makeRow(q, 0, false, val)}
|
|
||||||
// ${unitOrDesc ? `<div class="mt-2">${unitOrDesc}</div>` : ''}
|
|
||||||
// </div>`;
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// function makeMultipleCard(idx) {
|
|
||||||
// let title = '';
|
|
||||||
// const rowsHtml = multiQs.map((q) => {
|
|
||||||
// title = q.title_group || title || 'Data';
|
|
||||||
// let unitOrDesc = '';
|
|
||||||
// let unitVal = getUnit(q.sequence, idx);
|
|
||||||
|
|
||||||
// if (q.type === 'form' || q.type === 'method') {
|
|
||||||
// unitOrDesc = `
|
|
||||||
// <div class="form-desc-list mt-1" data-sequence="${q.sequence}">
|
|
||||||
// ${q.choices.map(c => `
|
|
||||||
// <p class="form-desc" data-form="${c.form}" style="display:none;font-size:12px;margin-bottom:0;">
|
|
||||||
// ${c.desc}
|
|
||||||
// </p>
|
|
||||||
// `).join('')}
|
|
||||||
// </div>`;
|
|
||||||
// } else if (q.units && q.units.length === 1) {
|
|
||||||
// unitOrDesc = `<input type="hidden" name="unit_${q.sequence}" value="${q.units[0]}">
|
|
||||||
// <span class="text-muted small ml-1">${q.units[0]}</span>`;
|
|
||||||
// } else if (q.units && q.units.length > 1) {
|
|
||||||
// unitOrDesc = `<select name="unit_${q.sequence}"
|
|
||||||
// class="form-control-sm d-inline-block w-auto unit-select mt-2" required>
|
|
||||||
// ${q.units.map(u => `<option${unitVal === u ? ' selected' : ''}>${u}</option>`).join('')}
|
|
||||||
// </select>`;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const val = getAnswer(q.sequence, idx);
|
|
||||||
// return `
|
|
||||||
// <div class="form-group question-group" id="group-${q.sequence}-${idx}"
|
|
||||||
// data-question-plus="${q.question_plus || ''}" ${q.ad_sequence ? 'data-ad-sequence="1"' : ''}>
|
|
||||||
// <label class="${q.is_required ? 'required-label' : ''} font-weight-bold">
|
|
||||||
// ${q.activity_data}
|
|
||||||
// </label>
|
|
||||||
// <div class="multiple-input-group" data-sequence="${q.sequence}">
|
|
||||||
// ${makeRow(q, idx, false, val)}
|
|
||||||
// </div>
|
|
||||||
// ${unitOrDesc ? `<div class="mt-2">${unitOrDesc}</div>` : ''}
|
|
||||||
// </div>`;
|
|
||||||
// }).join('');
|
|
||||||
|
|
||||||
// return `
|
|
||||||
// <div class="card multiple-card" data-index="${idx}">
|
|
||||||
// <div class="card-header d-flex justify-content-between align-items-center">
|
|
||||||
// <strong>${title}</strong>
|
|
||||||
// <button type="button" class="btn btn-delete btn-sm remove-card">
|
|
||||||
// Hapus Data
|
|
||||||
// </button>
|
|
||||||
// </div>
|
|
||||||
// <div class="card-body">
|
|
||||||
// ${rowsHtml}
|
|
||||||
// </div>
|
|
||||||
// </div>`;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// let multipleLayout = '';
|
|
||||||
// let multiCardQuestionPlus = '';
|
|
||||||
// if (multiQs.length > 0) {
|
|
||||||
// let maxGroup = 1;
|
|
||||||
// multiQs.forEach(q => {
|
|
||||||
// const arr = answers[`activity_data_${q.sequence}`];
|
|
||||||
// if (Array.isArray(arr)) maxGroup = Math.max(maxGroup, arr.length);
|
|
||||||
// });
|
|
||||||
// if (maxGroup < 1) maxGroup = 1;
|
|
||||||
// multiCardQuestionPlus = multiQs[0]?.question_plus || '';
|
|
||||||
// multipleLayout = `
|
|
||||||
// <div id="card-data-1-wrapper"
|
|
||||||
// data-question-plus="${multiCardQuestionPlus}">
|
|
||||||
// <div id="multiple-container">
|
|
||||||
// ${Array.from({ length: maxGroup }).map((_, idx) => makeMultipleCard(idx)).join('')}
|
|
||||||
// </div>
|
|
||||||
// <button type="button" id="add-group" class="btn btn-add-data add-row btn-sm mt-2">
|
|
||||||
// Tambah Data
|
|
||||||
// </button>
|
|
||||||
// </div>`;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const html = `
|
|
||||||
// <div class="card">
|
|
||||||
// <div class="card-header">
|
|
||||||
// <h5 class="mb-0">
|
|
||||||
// <button class="btn d-flex justify-content-between w-100 align-items-center form-title-accordion collapsed"
|
|
||||||
// data-toggle="collapse" data-target="#collapse6">
|
|
||||||
// ${data[0].title.toUpperCase()}
|
|
||||||
// <span class="arrow mr-2"><i class="ti ti-angle-right"></i></span>
|
|
||||||
// </button>
|
|
||||||
// </h5>
|
|
||||||
// </div>
|
|
||||||
// <div id="collapse6" class="collapse" data-parent="#accordion-4">
|
|
||||||
// <div class="card-body">
|
|
||||||
// <p class="text-muted small">${data[0].activity_desc}</p>
|
|
||||||
// ${allHtml}
|
|
||||||
// ${multipleLayout}
|
|
||||||
// <div class="mt-4 text-right">
|
|
||||||
// <button type="submit" id="final-submit" class="btn btn-submit btn-primary px-4 py-2">
|
|
||||||
// Submit
|
|
||||||
// </button>
|
|
||||||
// </div>
|
|
||||||
// </div>
|
|
||||||
// </div>
|
|
||||||
// </div>
|
|
||||||
// `;
|
|
||||||
|
|
||||||
// $('#accordion-4').html(html);
|
|
||||||
// updateConditionalQuestions();
|
|
||||||
|
|
||||||
// function refreshRemoveButtons() {
|
|
||||||
// const cards = $('#multiple-container .multiple-card');
|
|
||||||
// if (cards.length === 1) {
|
|
||||||
// cards.find('.remove-card').addClass('d-none');
|
|
||||||
// } else {
|
|
||||||
// cards.find('.remove-card').removeClass('d-none');
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// if (multiQs.length > 0) {
|
|
||||||
// $('#accordion-4').off('click', '#add-group').on('click', '#add-group', function() {
|
|
||||||
// const idx = $('#multiple-container .multiple-card').length;
|
|
||||||
// $('#multiple-container').append(makeMultipleCard(idx));
|
|
||||||
// refreshRemoveButtons();
|
|
||||||
// updateConditionalQuestions();
|
|
||||||
// });
|
|
||||||
// $('#accordion-4').off('click', '.remove-card').on('click', '.remove-card', function() {
|
|
||||||
// $(this).closest('.multiple-card').remove();
|
|
||||||
// refreshRemoveButtons();
|
|
||||||
// updateConditionalQuestions();
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// $('#accordion-4').on('change', 'select.question-input', function() {
|
|
||||||
// const $select = $(this);
|
|
||||||
// const val = $select.val();
|
|
||||||
// $select.closest('.question-group').find('.form-desc').hide();
|
|
||||||
// $select.closest('.question-group').find(`.form-desc[data-form="${val}"]`).show();
|
|
||||||
|
|
||||||
// updateConditionalQuestions();
|
|
||||||
// });
|
|
||||||
|
|
||||||
// function checkShowCardData1() {
|
|
||||||
// if (multiQs.length === 0) return;
|
|
||||||
// if (!methodSequence) return;
|
|
||||||
// const methodVal = $(`[name="activity_data_${methodSequence}[0]"]`).val();
|
|
||||||
// if (!methodVal || methodVal === '') {
|
|
||||||
// $('#card-data-1-wrapper').hide();
|
|
||||||
// $('#add-group').hide();
|
|
||||||
// } else {
|
|
||||||
// $('#card-data-1-wrapper').show();
|
|
||||||
// $('#add-group').show();
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// if (multiQs.length > 0 && methodSequence) {
|
|
||||||
// $('#accordion-4').on('change', `select[name="activity_data_${methodSequence}[0]"]`, function() {
|
|
||||||
// checkShowCardData1();
|
|
||||||
// updateConditionalQuestions();
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// function updateConditionalQuestions(selectedValue = false) {
|
|
||||||
// let currentMethod = '';
|
|
||||||
// if (methodSequence) {
|
|
||||||
// currentMethod = $(`[name="activity_data_${methodSequence}[0]"]`).val() || '';
|
|
||||||
// }
|
|
||||||
|
|
||||||
// $('.question-group').each(function() {
|
|
||||||
// const seq = $(this).find('.question-row').data('sequence');
|
|
||||||
// const q = questionMap[seq];
|
|
||||||
// let show = true;
|
|
||||||
// if (q && q.question_plus !== undefined && q.question_plus !== null && q.question_plus !== '') {
|
|
||||||
// if (String(q.question_plus) !== String(currentMethod)) show = false;
|
|
||||||
// }
|
|
||||||
// if (q && q.ad_sequence) {
|
|
||||||
// let parentVal = $(`[name="activity_data_${q.ad_sequence}[0]"]`).val();
|
|
||||||
// if (typeof parentVal === "undefined") parentVal = '';
|
|
||||||
// if (String(parentVal) !== String(q.question_plus)) show = false;
|
|
||||||
// }
|
|
||||||
// // Paling galak, pake style.setProperty agar anti override
|
|
||||||
// if (show) {
|
|
||||||
// this.style.setProperty('display', 'block', 'important');
|
|
||||||
// } else {
|
|
||||||
// this.style.setProperty('display', 'none', 'important');
|
|
||||||
// }
|
|
||||||
// if (!show) {
|
|
||||||
// $(this).find('input,select').val('');
|
|
||||||
// $(this).find('.form-desc').hide();
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// // Multiple card wrapper
|
|
||||||
// if (multiQs.length > 0) {
|
|
||||||
// const $multiCardWrapper = $('#card-data-1-wrapper');
|
|
||||||
// if ($multiCardWrapper.length) {
|
|
||||||
// const wrapperQPlus = $multiCardWrapper.data('question-plus');
|
|
||||||
// let show = true;
|
|
||||||
// if (wrapperQPlus && String(wrapperQPlus) !== String(currentMethod)) show = false;
|
|
||||||
// $multiCardWrapper[0].style.setProperty('display', show ? 'block' : 'none', 'important');
|
|
||||||
// // Extra hack untuk mengantisipasi Bootstrap collapse/accordion
|
|
||||||
// $multiCardWrapper.css({
|
|
||||||
// opacity: show ? 1 : 0,
|
|
||||||
// 'pointer-events': show ? 'auto' : 'none',
|
|
||||||
// height: show ? '' : '0',
|
|
||||||
// 'min-height': show ? '' : '0',
|
|
||||||
// 'max-height': show ? '' : '0',
|
|
||||||
// overflow: show ? '' : 'hidden'
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // Multiple card (child)
|
|
||||||
// if (multiQs.length > 0) {
|
|
||||||
// $('#multiple-container .multiple-card').each(function(cardIdx) {
|
|
||||||
// $(this).find('.question-group').each(function() {
|
|
||||||
// const seq = $(this).find('.question-row').data('sequence');
|
|
||||||
// const q = questionMap[seq];
|
|
||||||
// let show = true;
|
|
||||||
// if (q && q.question_plus !== undefined && q.question_plus !== null && q.question_plus !== '') {
|
|
||||||
// if (String(q.question_plus) !== String(currentMethod)) show = false;
|
|
||||||
// }
|
|
||||||
// if (q && q.ad_sequence) {
|
|
||||||
// let parentVal = $(`[name="activity_data_${q.ad_sequence}[${cardIdx}]"]`).val();
|
|
||||||
// if(!parentVal) parentVal = $(`[name="activity_data_${q.ad_sequence}[0]"]`).val();
|
|
||||||
// if (String(parentVal) !== String(q.question_plus)) show = false;
|
|
||||||
// }
|
|
||||||
// if (show) {
|
|
||||||
// this.style.setProperty('display', 'block', 'important');
|
|
||||||
// } else {
|
|
||||||
// this.style.setProperty('display', 'none', 'important');
|
|
||||||
// }
|
|
||||||
// if (!show) {
|
|
||||||
// $(this).find('input,select').val('');
|
|
||||||
// $(this).find('.form-desc').hide();
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// checkShowCardData1();
|
|
||||||
// }
|
|
||||||
|
|
||||||
// window.updateConditionalQuestions = updateConditionalQuestions;
|
|
||||||
|
|
||||||
// // Observer agar auto hidden walaupun ada re-render/collapse
|
|
||||||
// if (window.__mitigationObserver) {
|
|
||||||
// window.__mitigationObserver.disconnect();
|
|
||||||
// }
|
|
||||||
// window.__mitigationObserver = new MutationObserver(function(mutations) {
|
|
||||||
// const wrapper = document.getElementById('card-data-1-wrapper');
|
|
||||||
// if(wrapper) {
|
|
||||||
// const wrapperQPlus = $(wrapper).data('question-plus');
|
|
||||||
// let currentMethod = '';
|
|
||||||
// if (methodSequence) {
|
|
||||||
// currentMethod = $(`[name="activity_data_${methodSequence}[0]"]`).val() || '';
|
|
||||||
// }
|
|
||||||
// let show = true;
|
|
||||||
// if (wrapperQPlus && String(wrapperQPlus) !== String(currentMethod)) show = false;
|
|
||||||
// wrapper.style.setProperty('display', show ? 'block' : 'none', 'important');
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// window.__mitigationObserver.observe(document.getElementById('accordion-4'), {childList: true, subtree: true});
|
|
||||||
|
|
||||||
// $('.form-desc-list').each(function() {
|
|
||||||
// $(this).find('.form-desc').hide();
|
|
||||||
// const $select = $(this).closest('.question-group').find('select.question-input');
|
|
||||||
// const val = $select.val();
|
|
||||||
// if (val) {
|
|
||||||
// $(this).find(`.form-desc[data-form="${val}"]`).show();
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// if (multiQs.length > 0) refreshRemoveButtons();
|
|
||||||
// updateConditionalQuestions();
|
|
||||||
|
|
||||||
// $('#accordion-4').on('change', '.question-input', function() {
|
|
||||||
// updateConditionalQuestions(true);
|
|
||||||
// });
|
|
||||||
|
|
||||||
// // (Tambahan) Bootstrap collapse event agar update selalu fresh
|
|
||||||
// $('#collapse6').on('shown.bs.collapse hide.bs.collapse', function () {
|
|
||||||
// updateConditionalQuestions();
|
|
||||||
// });
|
|
||||||
// })
|
|
||||||
// .fail((xhr, status, error) => {
|
|
||||||
// console.error('Gagal mengambil pertanyaan:', status, error);
|
|
||||||
// $('#accordion-4').html(
|
|
||||||
// '<p class="text-danger small">Terjadi kesalahan saat memuat pertanyaan.</p>'
|
|
||||||
// );
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
function loadQuestion(mitigation_id) {
|
function loadQuestion(mitigation_id) {
|
||||||
$('#section4').show();
|
$('#section4').show();
|
||||||
$('#accordion-4').html('<p class="text-muted ml-1">Loading...</p>');
|
$('#accordion-4').html('<p class="text-muted ml-1">Loading...</p>');
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue