130 lines
3.6 KiB
JavaScript
130 lines
3.6 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-handle",
|
|
animation: 150,
|
|
});
|
|
}
|
|
}
|