115 lines
3.4 KiB
JavaScript
115 lines
3.4 KiB
JavaScript
export default class {
|
|
addOptionsErrors(errors) {
|
|
for (let key in errors) {
|
|
let inputField = this.getInputFieldForErrorKey(key);
|
|
|
|
inputField.closest('.option').addClass('option-has-errors');
|
|
|
|
let parent = inputField.parent();
|
|
|
|
parent.append(`<span class="help-block">${errors[key][0]}</span>`);
|
|
}
|
|
}
|
|
|
|
getRowTemplate(data) {
|
|
let template = _.template($('#option-select-values-template').html());
|
|
|
|
return $(template(data));
|
|
}
|
|
|
|
changeOptionType({ optionId, type, values = [] }) {
|
|
let optionValuesElement = this.getOptionValuesElement(optionId);
|
|
let templateType = this.getTemplateType(type, optionValuesElement);
|
|
let optionValuesData = { optionId, value: { id: '', label: '', price: '', price_type: 'fixed' } };
|
|
|
|
if (this.shouldNotChangeTemplate(templateType, optionValuesElement)) {
|
|
return;
|
|
}
|
|
|
|
if (values.length !== 0 && templateType === 'text') {
|
|
optionValuesData.value = values[0];
|
|
}
|
|
|
|
let template = _.template($(`#option-${templateType}-template`).html());
|
|
|
|
optionValuesElement.html(template(optionValuesData));
|
|
|
|
if (templateType === 'select') {
|
|
this.addOptionRowEventListener(optionId);
|
|
|
|
this.addOptionRows({ optionId, values });
|
|
|
|
if (values.length === 0) {
|
|
this.getAddNewRowButton(optionId).trigger('click');
|
|
}
|
|
}
|
|
}
|
|
|
|
addOptionRows({ optionId, values }) {
|
|
for (let [index, value] of values.entries()) {
|
|
this.addOptionRow({
|
|
optionId,
|
|
valueId: index,
|
|
value,
|
|
});
|
|
}
|
|
}
|
|
|
|
getTemplateType(type) {
|
|
if (this.templateTypeIsText(type)) {
|
|
return 'text';
|
|
}
|
|
|
|
if (this.templateTypeIsSelect(type)) {
|
|
return 'select';
|
|
}
|
|
}
|
|
|
|
templateTypeIsText(type) {
|
|
return ['field', 'textarea', 'date', 'date_time', 'time'].includes(type);
|
|
}
|
|
|
|
templateTypeIsSelect(type) {
|
|
return ['dropdown', 'checkbox', 'checkbox_custom', 'radio', 'radio_custom', 'multiple_select'].includes(type);
|
|
}
|
|
|
|
shouldNotChangeTemplate(templateType, optionValuesElement) {
|
|
return templateType === undefined || this.alreadyHasCurrentTemplate(templateType, optionValuesElement);
|
|
}
|
|
|
|
alreadyHasCurrentTemplate(templateType, optionValuesElement) {
|
|
if (templateType === 'text') {
|
|
return optionValuesElement.children().hasClass('option-text');
|
|
}
|
|
|
|
if (templateType === 'select') {
|
|
return optionValuesElement.children().hasClass('option-select');
|
|
}
|
|
}
|
|
|
|
initOptionRow(template, selectValues) {
|
|
if (selectValues.length !== 0 && ! selectValues.is('.sortable')) {
|
|
this.makeSortable(selectValues[0]);
|
|
|
|
selectValues.addClass('sortable');
|
|
}
|
|
|
|
this.deleteOptionRowEventListener(template);
|
|
|
|
window.admin.tooltip();
|
|
}
|
|
|
|
deleteOptionRowEventListener(row) {
|
|
row.find('.delete-row').on('click', (e) => {
|
|
$(e.currentTarget).closest('.option-row').remove();
|
|
});
|
|
}
|
|
|
|
makeSortable(el) {
|
|
Sortable.create(el, {
|
|
handle: '.drag-icon',
|
|
animation: 150,
|
|
});
|
|
}
|
|
}
|