meraproject/lib/js/bws/react/form/PropValues.js

var PropValues, ePropertyType;

ePropertyType = function () {
  class ePropertyType {}

  ;
  ePropertyType.TEXT = 1;
  ePropertyType.NUMBER = 2;
  ePropertyType.VALUES_ONE = 3;
  ePropertyType.VALUES_MANY = 4;
  return ePropertyType;
}.call(this);

export default window.PropValues = PropValues = class PropValues extends React.Component {
  constructor(props) {
    var data, ref, ref1, selected;
    super(props);
    data = (ref = props.data) != null ? ref : [];
    selected = null;

    if (data.length > 0) {
      selected = data[0];
    }

    this.state = {
      data: data,
      value: (ref1 = props.value) != null ? ref1 : {},
      selected: selected
    };
    this.onSelect = this.onSelect.bind(this);
    this.enterTextValue = this.enterTextValue.bind(this);
    this.onChangeMany = this.onChangeMany.bind(this);
    this.onChangeOne = this.onChangeOne.bind(this);
    this.input = null;
    this.properties = {};
  }

  getValue() {
    return this.state.value;
  }

  onSelect(x) {
    return this.setState({
      selected: x
    });
  }

  onChangeMany(id, val, checked) {
    var i, v, value;
    ({
      value
    } = this.state);

    if (value[id] === void 0) {
      value[id] = [];
    }

    console.log(id, val, checked); // Если у нас выделен, то нам надо просто добавить в конец

    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, j, k, 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); //console.log(data,value)

    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] = {};
          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];
            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,
              onChange: this.onChangeMany.bind(null, selected.id, i)
            })));
          }

          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)));
  }

};
//# sourceMappingURL=PropValues.js.map