119 lines
4.1 KiB
JavaScript
119 lines
4.1 KiB
JavaScript
class LayoutUtil {
|
|
static flattenObject(obj, prefix = '') {
|
|
return _.reduce(obj, (acc, value, key) => {
|
|
const fullKey = prefix ? `${prefix}.${key}` : key;
|
|
if (_.isObject(value) && !_.isArray(value)) {
|
|
_.assign(acc, this.flattenObject(value, fullKey));
|
|
} else if (_.isArray(value)) {
|
|
// Process each item in the array
|
|
value.forEach((item, index) => {
|
|
// If the item is an object, recurse, otherwise assign directly
|
|
if (_.isObject(item)) {
|
|
_.assign(acc, this.flattenObject(item, `${fullKey}[${index}]`));
|
|
} else {
|
|
acc[`${fullKey}[${index}]`] = item;
|
|
}
|
|
});
|
|
} else {
|
|
acc[fullKey] = value;
|
|
}
|
|
return acc;
|
|
}, {});
|
|
}
|
|
|
|
static createGroup(groupModel) {
|
|
let groupHtml = `<div><h6>${groupModel.groupTitle}</h6>`;
|
|
|
|
groupModel.fields.forEach(item => {
|
|
groupHtml += this.createFormElement(item);
|
|
});
|
|
|
|
groupHtml += '</div>';
|
|
return groupHtml;
|
|
}
|
|
|
|
static createTextInput(elementModel) {
|
|
return `
|
|
<div class="form-floating mb-2">
|
|
<input type="text" name="${elementModel.path}" class="form-control mb-2" id="${elementModel.path}" placeholder="${elementModel.placeholder}">
|
|
<label for="${elementModel.path}" class="form-label">${elementModel.label}</label>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
static createBooleanInput(elementModel) {
|
|
return `
|
|
<div class="form-floating mb-2">
|
|
<div class="form-check form-check-inline">
|
|
<input type="checkbox" name="${elementModel.path}" class="form-check-input mb-2" id="${elementModel.path}" placeholder="${elementModel.placeholder}">
|
|
<label class="form-check-label" for="${elementModel.path}" class="form-label">${elementModel.label}</label>
|
|
</div>
|
|
</div>`;
|
|
|
|
}
|
|
|
|
|
|
static createSelectInput(elementModel) {
|
|
const optionsHtml = elementModel.options.map(optionValue => `<option value="${optionValue}">${optionValue}</option>`).join('');
|
|
|
|
return `
|
|
<div class="form-floating mb-2">
|
|
<select class="form-select mb-2" id="${elementModel.path}" name="${elementModel.path}">
|
|
${optionsHtml}
|
|
</select>
|
|
<label for="${elementModel.path}" class="form-label">${elementModel.label}</label>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
static createTextAreaInput(elementModel) {
|
|
return `
|
|
<div class="form-floating mb-2">
|
|
<textarea class="form-control mb-2" name="${elementModel.path}" id="${elementModel.path}" placeholder="${elementModel.placeholder}"></textarea>
|
|
<label for="${elementModel.path}" class="form-label">${elementModel.label}</label>
|
|
</div>`;
|
|
}
|
|
|
|
static createFormElement(elementModel) {
|
|
switch (elementModel.type) {
|
|
case "boolean":
|
|
return this.createBooleanInput(elementModel);
|
|
case "text":
|
|
return this.createTextInput(elementModel);
|
|
case "select":
|
|
return this.createSelectInput(elementModel);
|
|
case "textarea":
|
|
return this.createTextAreaInput(elementModel);
|
|
default:
|
|
console.error("Unsupported element type: " + elementModel.type);
|
|
return '';
|
|
}
|
|
}
|
|
|
|
static createForm(model) {
|
|
let formHtml = '';
|
|
model.forEach(group => {
|
|
formHtml += this.createGroup(group);
|
|
});
|
|
return formHtml;
|
|
}
|
|
|
|
static getFieldValue(element) {
|
|
if ($(element).is('select') || $(element).is('input[type="text"]') || $(element).is('textarea')) {
|
|
return $(element).val();
|
|
}
|
|
if ($(element).is('input[type="checkbox"]')) {
|
|
return $(element).is(':checked');
|
|
}
|
|
}
|
|
|
|
static echartReplacer(key, value) {
|
|
if (key === 'echart' || key === 'series') {
|
|
return undefined;
|
|
}
|
|
return value;
|
|
}
|
|
}
|
|
|
|
export default LayoutUtil;
|