544 lines
16 KiB
JavaScript
544 lines
16 KiB
JavaScript
var ShopItemPropValues, ShopItemPropValuesPrice, ePropertyType, eShopItemPriceType;
|
||
|
||
ePropertyType = function () {
|
||
class ePropertyType {}
|
||
|
||
;
|
||
ePropertyType.TEXT = 1;
|
||
ePropertyType.NUMBER = 2;
|
||
ePropertyType.VALUES_ONE = 3;
|
||
ePropertyType.VALUES_MANY = 4;
|
||
return ePropertyType;
|
||
}.call(this);
|
||
|
||
eShopItemPriceType = function () {
|
||
class eShopItemPriceType {}
|
||
|
||
;
|
||
eShopItemPriceType.PRICE = 1;
|
||
eShopItemPriceType.COMPONENT = 2;
|
||
eShopItemPriceType.COMPONENT_LIST = 3;
|
||
eShopItemPriceType.GROWTH = 4;
|
||
return eShopItemPriceType;
|
||
}.call(this);
|
||
|
||
export default window.ShopItemPropValues = ShopItemPropValues = class ShopItemPropValues extends React.Component {
|
||
constructor(props) {
|
||
var data, ref, ref1, ref2, selected;
|
||
super(props);
|
||
data = (ref = props.data) != null ? ref : [];
|
||
selected = null;
|
||
|
||
if (data.length > 0) {
|
||
selected = data[0];
|
||
}
|
||
|
||
if (props.value == null) {
|
||
props.value = {};
|
||
}
|
||
|
||
this.state = {
|
||
data: data,
|
||
value: (ref1 = props.value.vals) != null ? ref1 : {},
|
||
price_type: (ref2 = props.value.price_type) != null ? ref2 : 1,
|
||
selected: selected
|
||
};
|
||
this.onSelect = this.onSelect.bind(this);
|
||
this.enterTextValue = this.enterTextValue.bind(this);
|
||
this.onChangeMany = this.onChangeMany.bind(this);
|
||
this.onChangeManyDefault = this.onChangeManyDefault.bind(this);
|
||
this.onChangeOne = this.onChangeOne.bind(this);
|
||
this.input = null;
|
||
this.properties = {};
|
||
this.defaults = {};
|
||
this.prices = {};
|
||
}
|
||
|
||
getValue() {
|
||
var i, prop_id, v, value;
|
||
({
|
||
value
|
||
} = this.state);
|
||
|
||
for (prop_id in value) {
|
||
for (i in value[prop_id]) {
|
||
v = value[prop_id][i];
|
||
value[prop_id][i].is_default = value[prop_id][i].is_default ? 1 : 0;
|
||
|
||
if (this.prices[prop_id] !== void 0) {
|
||
if (this.prices[prop_id][v.value] !== void 0 && this.prices[prop_id][v.value] != null) {
|
||
value[prop_id][i].price = this.prices[prop_id][v.value].getValue();
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
return value;
|
||
}
|
||
|
||
onSelect(x) {
|
||
return this.setState({
|
||
selected: x
|
||
});
|
||
}
|
||
|
||
onChangeManyDefault(id, val, checked) {
|
||
var i, v, value; //console.log('onChangeManyDefault',id,val,checked)
|
||
|
||
({
|
||
value
|
||
} = this.state); // Делаем цикл по свойствам
|
||
|
||
for (i in value[id]) {
|
||
v = value[id][i];
|
||
value[id][i].is_default = false;
|
||
|
||
if (v.value === val.id) {
|
||
value[id][i].is_default = checked;
|
||
}
|
||
}
|
||
|
||
for (i in this.defaults[id]) {
|
||
if (this.defaults[id][i] != null && this.defaults[id][i] !== void 0) {
|
||
this.defaults[id][i].setValueSilence(false);
|
||
|
||
if (i === val.id) {
|
||
this.defaults[id][i].setValueSilence(checked);
|
||
}
|
||
}
|
||
}
|
||
|
||
return this.setState({
|
||
value
|
||
});
|
||
}
|
||
|
||
onChangeMany(id, val, checked) {
|
||
var i, v, value;
|
||
({
|
||
value
|
||
} = this.state);
|
||
|
||
if (value[id] === void 0) {
|
||
value[id] = [];
|
||
} // Если у нас выделен, то нам надо просто добавить в конец
|
||
|
||
|
||
if (checked) {
|
||
value[id].push({
|
||
value: val.id,
|
||
title: val.title
|
||
});
|
||
} else {
|
||
// Если нет, то делаем цикл по свойствам
|
||
for (i in value[id]) {
|
||
v = value[id][i];
|
||
|
||
if (v.value === val.id) {
|
||
value[id].splice(i, 1);
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
return this.setState({
|
||
value
|
||
});
|
||
}
|
||
|
||
onChangeOne(id, val, checked) {
|
||
var i, value;
|
||
({
|
||
value
|
||
} = this.state);
|
||
|
||
if (value[id] === void 0) {
|
||
value[id] = [];
|
||
}
|
||
|
||
if (checked) {
|
||
value[id] = [{
|
||
value: val.id,
|
||
title: val.title
|
||
}];
|
||
|
||
for (i in this.properties[id]) {
|
||
this.properties[id][i].setValueSilence(i === val.id);
|
||
}
|
||
} else {
|
||
value[id] = [];
|
||
|
||
for (i in this.properties[id]) {
|
||
this.properties[id][i].setValueSilence(false);
|
||
}
|
||
}
|
||
|
||
return this.setState({
|
||
value
|
||
});
|
||
}
|
||
|
||
enterTextValue() {
|
||
var id, selected, val, value;
|
||
({
|
||
selected,
|
||
value
|
||
} = this.state);
|
||
val = this.input.value;
|
||
id = parseInt(selected.id);
|
||
|
||
if (val === '') {
|
||
value[id] = [];
|
||
} else {
|
||
value[id] = [{
|
||
title: val,
|
||
value: val
|
||
}];
|
||
}
|
||
|
||
return this.setState({
|
||
value
|
||
});
|
||
}
|
||
|
||
render() {
|
||
var _this = this;
|
||
|
||
var checked, data, defValue, i, isChecked, isShowDefault, j, k, key, l, len, len1, len2, len3, len4, len5, m, n, o, prop, ref, ref1, ref2, ref3, ref4, ref5, ref6, selected, t, v, vals, value, values, variants;
|
||
({
|
||
data,
|
||
value,
|
||
selected
|
||
} = this.state);
|
||
t = this;
|
||
values = [];
|
||
|
||
for (j = 0, len = data.length; j < len; j++) {
|
||
prop = data[j];
|
||
|
||
if (value[prop.id]) {
|
||
vals = [];
|
||
ref = value[prop.id];
|
||
|
||
for (k = 0, len1 = ref.length; k < len1; k++) {
|
||
v = ref[k];
|
||
vals.push( /*#__PURE__*/React.createElement("div", {
|
||
className: "sub_color"
|
||
}, v.title));
|
||
}
|
||
|
||
if (vals.length > 0) {
|
||
values.push( /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
|
||
className: "h2 " + (values.length > 0 ? "mt-20" : "")
|
||
}, prop.title), vals));
|
||
}
|
||
}
|
||
}
|
||
|
||
variants = [];
|
||
|
||
if (selected !== null) {
|
||
switch (parseInt(selected.type)) {
|
||
case ePropertyType.TEXT:
|
||
case ePropertyType.NUMBER:
|
||
defValue = '';
|
||
|
||
if (value[selected.id] !== void 0) {
|
||
defValue = (ref1 = (ref2 = value[selected.id][0]) != null ? ref2.title : void 0) != null ? ref1 : '';
|
||
}
|
||
|
||
variants.push( /*#__PURE__*/React.createElement("div", {
|
||
class: "input_wrap",
|
||
key: "prop" + selected.id
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
class: "label"
|
||
}, "\u0417\u043D\u0430\u0447\u0435\u043D\u0438\u0435"), /*#__PURE__*/React.createElement("input", {
|
||
placeholder: "Введите значение",
|
||
defaultValue: defValue,
|
||
className: "i",
|
||
onKeyUp: this.enterTextValue,
|
||
ref: function (i) {
|
||
return _this.input = i;
|
||
}
|
||
})));
|
||
break;
|
||
|
||
case ePropertyType.TEXT:
|
||
case ePropertyType.VALUES_MANY:
|
||
checked = {};
|
||
|
||
if (value[selected.id] !== void 0) {
|
||
ref3 = value[selected.id];
|
||
|
||
for (l = 0, len2 = ref3.length; l < len2; l++) {
|
||
i = ref3[l];
|
||
checked[i.value] = true;
|
||
}
|
||
}
|
||
|
||
this.properties[selected.id] = {};
|
||
this.defaults[selected.id] = {};
|
||
variants.push( /*#__PURE__*/React.createElement("div", {
|
||
class: "label",
|
||
key: "prop" + selected.id
|
||
}, "\u041C\u043E\u0436\u043D\u043E \u0432\u044B\u0431\u0440\u0430\u0442\u044C \u043D\u0435\u0441\u043A\u043E\u043B\u044C\u043A\u043E \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0439"));
|
||
ref4 = selected.values;
|
||
|
||
for (m = 0, len3 = ref4.length; m < len3; m++) {
|
||
i = ref4[m];
|
||
isChecked = checked[i.id] === true;
|
||
isShowDefault = selected.is_price && isChecked;
|
||
key = "prop" + selected.id + "value" + i.id;
|
||
|
||
if (t.prices[selected.id] === void 0) {
|
||
t.prices[selected.id] = {};
|
||
}
|
||
|
||
variants.push( /*#__PURE__*/React.createElement("div", {
|
||
key: key,
|
||
className: "" + (variants.length > 0 ? "mt-20" : '')
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
class: isShowDefault ? 'row2' : ''
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
class: isShowDefault ? 'c c-50' : ''
|
||
}, /*#__PURE__*/React.createElement(SwitchIOS, {
|
||
label: i.title,
|
||
checked: isChecked,
|
||
onChange: this.onChangeMany.bind(null, selected.id, i)
|
||
})), isShowDefault ? /*#__PURE__*/React.createElement("div", {
|
||
className: "c c-50"
|
||
}, function (selected, i) {
|
||
var is_default, y;
|
||
is_default = false;
|
||
|
||
if (t.state.value[selected.id] !== void 0) {
|
||
for (y in t.state.value[selected.id]) {
|
||
v = t.state.value[selected.id][y];
|
||
|
||
if (v.value === i.id) {
|
||
is_default = v.is_default;
|
||
console.log('is_def', v);
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
return /*#__PURE__*/React.createElement(SwitchIOS, {
|
||
label: "\u041F\u043E \u0443\u043C\u043E\u043B\u0447\u0430\u043D\u0438\u044E",
|
||
ref: function (r) {
|
||
return t.defaults[selected.id][i.id] = r;
|
||
},
|
||
checked: is_default,
|
||
onChange: t.onChangeManyDefault.bind(null, selected.id, i)
|
||
});
|
||
}(selected, i)) : null), selected.is_price ? function (isChecked, price_type, selected, i) {
|
||
var price, y;
|
||
price = {};
|
||
|
||
if (t.state.value[selected.id] !== void 0) {
|
||
for (y in t.state.value[selected.id]) {
|
||
v = t.state.value[selected.id][y];
|
||
|
||
if (v.value === i.id) {
|
||
price = v.price;
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
return /*#__PURE__*/React.createElement(ShopItemPropValuesPrice, {
|
||
visible: isChecked,
|
||
type: price_type,
|
||
price: price,
|
||
ref: function (inp) {
|
||
return t.prices[selected.id][i.id] = inp;
|
||
}
|
||
});
|
||
}(isChecked, this.state.price_type, selected, i) : null));
|
||
}
|
||
|
||
break;
|
||
|
||
case ePropertyType.TEXT:
|
||
case ePropertyType.VALUES_ONE:
|
||
checked = {};
|
||
|
||
if (value[selected.id] !== void 0) {
|
||
ref5 = value[selected.id];
|
||
|
||
for (n = 0, len4 = ref5.length; n < len4; n++) {
|
||
i = ref5[n];
|
||
checked[i.value] = true;
|
||
}
|
||
}
|
||
|
||
this.properties[selected.id] = {};
|
||
variants.push( /*#__PURE__*/React.createElement("div", {
|
||
class: "label",
|
||
key: "prop" + selected.id
|
||
}, "\u041C\u043E\u0436\u043D\u043E \u0432\u044B\u0431\u0440\u0430\u0442\u044C \u0442\u043E\u043B\u044C\u043A\u043E \u043E\u0434\u043D\u043E \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435"));
|
||
ref6 = selected.values;
|
||
|
||
for (o = 0, len5 = ref6.length; o < len5; o++) {
|
||
i = ref6[o];
|
||
|
||
(function (i, selected) {
|
||
return variants.push( /*#__PURE__*/React.createElement("div", {
|
||
key: "prop" + selected.id + "value" + i.id,
|
||
className: "" + (variants.length > 0 ? "mt-20" : '')
|
||
}, /*#__PURE__*/React.createElement(SwitchIOS, {
|
||
label: i.title,
|
||
checked: checked[i.id] === true,
|
||
ref: function (r) {
|
||
return t.properties[selected.id][i.id] = r;
|
||
},
|
||
onChange: t.onChangeOne.bind(null, selected.id, i)
|
||
})));
|
||
})(i, selected);
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
return /*#__PURE__*/React.createElement("div", {
|
||
className: "mt-20"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "row2"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "c c-50"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "h1"
|
||
}, "\u0412\u044B\u0431\u0435\u0440\u0438\u0442\u0435 \u043F\u0430\u0440\u0430\u043C\u0435\u0442\u0440"), /*#__PURE__*/React.createElement(Select, {
|
||
data: data,
|
||
onSelect: this.onSelect,
|
||
search: true
|
||
}), /*#__PURE__*/React.createElement("div", {
|
||
className: "mt-20"
|
||
}, variants)), /*#__PURE__*/React.createElement("div", {
|
||
className: "c c-50"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "h1"
|
||
}, "\u0412\u044B\u0431\u0440\u0430\u043D\u043D\u044B\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u044F"), values)));
|
||
}
|
||
|
||
};
|
||
ShopItemPropValuesPrice = class ShopItemPropValuesPrice extends React.Component {
|
||
constructor(props) {
|
||
var price;
|
||
super(props);
|
||
price = props.price === void 0 ? {} : props.price;
|
||
this.state = {
|
||
type: parseInt(props.type),
|
||
visible: props.visible,
|
||
price: price != null ? price : {}
|
||
};
|
||
this.types = [{
|
||
id: 1,
|
||
title: 'Значение'
|
||
}, {
|
||
id: 2,
|
||
title: 'Процент'
|
||
}];
|
||
}
|
||
|
||
componentWillReceiveProps(props) {
|
||
return this.setState({
|
||
visible: props.visible
|
||
});
|
||
}
|
||
|
||
getValue() {
|
||
var base, base1, s;
|
||
s = {
|
||
item_price: this.item_price != null && this.item_price !== void 0 ? this.item_price.value : 0,
|
||
item_type: this.item_type != null && this.item_type !== void 0 ? typeof (base = this.item_type).getValue === "function" ? base.getValue() : void 0 : 0,
|
||
component_price: this.component_price != null && this.component_price !== void 0 ? this.component_price.value : 0,
|
||
component_type: this.component_type != null && this.component_type !== void 0 ? typeof (base1 = this.component_type).getValue === "function" ? base1.getValue() : void 0 : 0
|
||
};
|
||
return s;
|
||
}
|
||
|
||
render() {
|
||
var _this2 = this;
|
||
|
||
var component_price, component_type, isComponentPrice, isItemPrice, item_price, item_type, price, ref, ref1, ref2, ref3, type, visible;
|
||
({
|
||
type,
|
||
visible,
|
||
price
|
||
} = this.state);
|
||
|
||
if (!visible) {
|
||
return null;
|
||
}
|
||
|
||
item_price = (ref = price.item_price) != null ? ref : 0;
|
||
item_type = (ref1 = price.item_type) != null ? ref1 : 1;
|
||
component_price = (ref2 = price.component_price) != null ? ref2 : 0;
|
||
component_type = (ref3 = price.component_type) != null ? ref3 : 1;
|
||
isItemPrice = type === eShopItemPriceType.PRICE || type === eShopItemPriceType.COMPONENT || type === eShopItemPriceType.COMPONENT_LIST;
|
||
isComponentPrice = type === eShopItemPriceType.COMPONENT;
|
||
return /*#__PURE__*/React.createElement("div", null, isItemPrice ? /*#__PURE__*/React.createElement("div", {
|
||
className: "row2 mt-10"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "c c-60"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "input_wrap"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "label"
|
||
}, "\u0426\u0435\u043D\u0430 \u043D\u0430 \u0442\u043E\u0432\u0430\u0440"), /*#__PURE__*/React.createElement("input", {
|
||
type: "text",
|
||
placeholder: "100",
|
||
className: "i c-100",
|
||
autoComplete: "off",
|
||
defaultValue: item_price,
|
||
ref: function (i) {
|
||
return _this2.item_price = i;
|
||
}
|
||
}))), /*#__PURE__*/React.createElement("div", {
|
||
className: "c c-40"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "input_wrap"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "label"
|
||
}, "\u0422\u0438\u043F"), /*#__PURE__*/React.createElement(Select, {
|
||
data: this.types,
|
||
id: item_type,
|
||
ref: function (i) {
|
||
return _this2.item_type = i;
|
||
}
|
||
})))) : null, isComponentPrice ? /*#__PURE__*/React.createElement("div", {
|
||
className: "row2 mt-10"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "c c-60"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "input_wrap"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "label"
|
||
}, "\u0426\u0435\u043D\u0430 \u043D\u0430 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442"), /*#__PURE__*/React.createElement("input", {
|
||
type: "text",
|
||
placeholder: "100",
|
||
className: "i c-100",
|
||
autoComplete: "off",
|
||
defaultValue: component_price,
|
||
ref: function (i) {
|
||
return _this2.component_price = i;
|
||
}
|
||
}))), /*#__PURE__*/React.createElement("div", {
|
||
className: "c c-40"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "input_wrap"
|
||
}, /*#__PURE__*/React.createElement("div", {
|
||
className: "label"
|
||
}, "\u0422\u0438\u043F"), /*#__PURE__*/React.createElement(Select, {
|
||
data: this.types,
|
||
id: component_type,
|
||
ref: function (i) {
|
||
return _this2.component_type = i;
|
||
}
|
||
})))) : null);
|
||
}
|
||
|
||
};
|
||
//# sourceMappingURL=ShopItemPropValues.js.map
|