¨4.0.1¨

This commit is contained in:
¨NW¨
2023-12-03 14:07:47 +00:00
parent c08b36d1b6
commit f35052522d
1112 changed files with 43019 additions and 24987 deletions

View File

@@ -3,7 +3,7 @@ export default class {
for (let key in errors) {
let inputField = this.getInputFieldForErrorKey(key);
inputField.closest('.option').addClass('option-has-errors');
inputField.closest(".option").addClass("option-has-errors");
let parent = inputField.parent();
@@ -12,7 +12,7 @@ export default class {
}
getRowTemplate(data) {
let template = _.template($('#option-select-values-template').html());
let template = _.template($("#option-select-values-template").html());
return $(template(data));
}
@@ -20,13 +20,16 @@ export default class {
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' } };
let optionValuesData = {
optionId,
value: { id: "", label: "", price: "", price_type: "fixed" },
};
if (this.shouldNotChangeTemplate(templateType, optionValuesElement)) {
return;
}
if (values.length !== 0 && templateType === 'text') {
if (values.length !== 0 && templateType === "text") {
optionValuesData.value = values[0];
}
@@ -34,13 +37,13 @@ export default class {
optionValuesElement.html(template(optionValuesData));
if (templateType === 'select') {
if (templateType === "select") {
this.addOptionRowEventListener(optionId);
this.addOptionRows({ optionId, values });
if (values.length === 0) {
this.getAddNewRowButton(optionId).trigger('click');
this.getAddNewRowButton(optionId).trigger("click");
}
}
}
@@ -57,41 +60,53 @@ export default class {
getTemplateType(type) {
if (this.templateTypeIsText(type)) {
return 'text';
return "text";
}
if (this.templateTypeIsSelect(type)) {
return 'select';
return "select";
}
}
templateTypeIsText(type) {
return ['field', 'textarea', 'date', 'date_time', 'time'].includes(type);
return ["field", "textarea", "date", "date_time", "time"].includes(
type
);
}
templateTypeIsSelect(type) {
return ['dropdown', 'checkbox', 'checkbox_custom', 'radio', 'radio_custom', 'multiple_select'].includes(type);
return [
"dropdown",
"checkbox",
"checkbox_custom",
"radio",
"radio_custom",
"multiple_select",
].includes(type);
}
shouldNotChangeTemplate(templateType, optionValuesElement) {
return templateType === undefined || this.alreadyHasCurrentTemplate(templateType, optionValuesElement);
return (
templateType === undefined ||
this.alreadyHasCurrentTemplate(templateType, optionValuesElement)
);
}
alreadyHasCurrentTemplate(templateType, optionValuesElement) {
if (templateType === 'text') {
return optionValuesElement.children().hasClass('option-text');
if (templateType === "text") {
return optionValuesElement.children().hasClass("option-text");
}
if (templateType === 'select') {
return optionValuesElement.children().hasClass('option-select');
if (templateType === "select") {
return optionValuesElement.children().hasClass("option-select");
}
}
initOptionRow(template, selectValues) {
if (selectValues.length !== 0 && ! selectValues.is('.sortable')) {
if (selectValues.length !== 0 && !selectValues.is(".sortable")) {
this.makeSortable(selectValues[0]);
selectValues.addClass('sortable');
selectValues.addClass("sortable");
}
this.deleteOptionRowEventListener(template);
@@ -100,14 +115,14 @@ export default class {
}
deleteOptionRowEventListener(row) {
row.find('.delete-row').on('click', (e) => {
$(e.currentTarget).closest('.option-row').remove();
row.find(".delete-row").on("click", (e) => {
$(e.currentTarget).closest(".option-row").remove();
});
}
makeSortable(el) {
Sortable.create(el, {
handle: '.drag-icon',
handle: ".drag-handle",
animation: 150,
});
}

View File

@@ -1,10 +1,5 @@
import Option from './Option';
import ProductOption from './ProductOption';
import Option from "./Option";
if ($('#option-create-form, #option-edit-form').length !== 0) {
if ($("#option-create-form, #option-edit-form").length !== 0) {
new Option();
}
if ($('#product-create-form, #product-edit-form').length !== 0) {
new ProductOption();
}

View File

@@ -1,37 +1,64 @@
.new-option {
.checkbox {
margin: 30px 0 0;
display: inline-block;
.options-group {
.option-values {
margin-top: 15px;
}
}
.delete-option {
margin-top: 25px;
padding: 10px 15px;
.new-option {
overflow: hidden;
margin-bottom: -15px;
.checkbox {
margin: 26px 0 0;
display: inline-block;
}
}
.options-group-wrapper {
.panel-title a {
.panel-title [data-toggle="collapse"] {
font-size: 14px;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
padding: 9px 15px;
text-decoration: none;
overflow: hidden;
cursor: pointer;
> .drag-icon {
&:after {
top: 11px !important;
}
.drag-handle {
font-size: 16px;
color: #737881;
cursor: move;
vertical-align: top;
margin: 4px 10px 0 0;
margin-right: 11px;
white-space: nowrap;
display: inline-block;
i {
float: left;
cursor: move;
i {
&:nth-child(2) {
margin-left: 1px;
margin-left: -3px;
}
}
}
.delete-option {
width: 30px;
display: flex;
align-items: center;
align-self: stretch;
justify-content: center;
margin-right: 20px;
color: #4d4d4d;
transition: 150ms ease-in-out;
cursor: pointer;
&:hover {
color: #333333;
}
}
}
.form-group {
@@ -47,7 +74,7 @@
thead th {
&:first-child {
width: 40px;
width: 35px;
}
&:last-child {
@@ -76,39 +103,8 @@
}
}
.add-global-option {
.form-group {
margin-left: 0 !important;
margin-right: 10px !important;
}
> button {
margin-bottom: 15px;
}
}
@media screen and (max-width: 1199px) {
.add-global-option {
float: none !important;
clear: both;
}
.new-option {
.checkbox {
margin-top: 4px;
}
.delete-option {
margin-top: 0;
}
.p-l-0 {
padding-right: 0;
}
}
.options-group-wrapper {
.options-group {
.option-values {
.option-text,
.option-select {
@@ -120,8 +116,82 @@
@media screen and (max-width: 991px) {
.new-option {
.form-group {
label {
margin-bottom: 6px;
padding-top: 0;
}
}
.checkbox {
padding-top: 7px;
padding-top: 8px;
label {
padding-top: 0;
}
}
}
}
@media screen and (min-width: 768px) {
.new-option {
> .row {
> .col-sm-6 {
padding-right: 10px;
}
> .col-sm-3 {
padding-left: 10px;
padding-right: 10px;
}
}
}
}
@media screen and (max-width: 767px) {
.options-group {
.option-values {
margin-top: 20px;
.option-select {
.table {
> tbody {
> tr {
> td {
&:nth-child(2) {
min-width: 160px;
}
&:nth-child(3) {
min-width: 145px;
}
&:nth-child(4) {
min-width: 110px;
}
}
}
}
}
}
}
}
.new-option {
margin-bottom: -10px;
> .row {
> div {
&:nth-child(3) {
.form-group {
margin-bottom: 10px;
}
}
}
}
.checkbox {
margin-top: -3px;
}
}
}