ming-demo3/lib/components/basic/tag2.js

mdf metaui web

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _react = _interopRequireWildcard(require("react"));

var _reactDom = require("react-dom");

var _basic = require("../basic");

var _baseui = require("@mdf/baseui");

var CheckableTag = _baseui.Tag.CheckableTag;

var Tag2 = function (_Component) {
  (0, _inherits2["default"])(Tag2, _Component);

  function Tag2(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, Tag2);
    _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(Tag2).call(this, props));
    _this.CanMultSel = _this.props.TagCanMultSel;
    _this.Title = _this.props.TagTitle;
    _this.state = {
      selectedTags: []
    };
    return _this;
  }

  (0, _createClass2["default"])(Tag2, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      if (this.props.model) this.props.model.addListener(this);
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      if (this.props.model) this.props.model.removeListener(this);
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {
      if (this.props.model) this.props.model.addListener(this);
    }
  }, {
    key: "setListenerState",
    value: function setListenerState(params) {
      if (params.value) {
        this.setValue(params.value);
        delete params.value;
        if (this.props.TagClicked) this.props.TagClicked();
      }

      this.setState(params);
    }
  }, {
    key: "handleChange",
    value: function handleChange(tag, checked) {
      if (this.CanMultSel != undefined && this.CanMultSel == false) this.state.selectedTags = [];
      var selectedTags = this.state.selectedTags;
      var nextSelectedTags = checked ? [].concat((0, _toConsumableArray2["default"])(selectedTags), [tag]) : selectedTags.filter(function (t) {
        return t !== tag;
      });

      if (this.props.model) {
        this.props.model.setValue(nextSelectedTags, true);
      }

      if (this.props.TagClicked) this.props.TagClicked();
    }
  }, {
    key: "setValue",
    value: function setValue(value) {
      var selectedTags = [];
      value.forEach(function (item) {
        selectedTags.push(item.value);
      });
      this.setState({
        selectedTags: selectedTags
      });
    }
  }, {
    key: "baseControl",
    value: function baseControl() {
      var _this2 = this;

      var _this$state = this.state,
          dataSource = _this$state.dataSource,
          valueField = _this$state.valueField,
          textField = _this$state.textField,
          selectedTags = _this$state.selectedTags;
      var CheckableTagList = [];
      dataSource.forEach(function (item) {
        var value = item[valueField],
            text = item[textField];
        CheckableTagList.push(_react["default"].createElement(CheckableTag, {
          key: value,
          checked: selectedTags.indexOf(value) > -1,
          onChange: function onChange(checked) {
            return _this2.handleChange(value, checked);
          }
        }, text));
      });
      return CheckableTagList;
    }
  }, {
    key: "relatedControl",
    value: function relatedControl() {
      var control = this.baseControl();
      var relatedControl = this.props.relatedControl;
      if (!relatedControl) return control;
      return _react["default"].createElement("div", {
        className: "has-related"
      }, _react["default"].createElement("div", {
        className: "viewCell"
      }, control), relatedControl);
    }
  }, {
    key: "render",
    value: function render() {
      var dataSource = this.state.dataSource;
      if (!dataSource || !dataSource.length) return null;
      var CheckableTagList = this.relatedControl();
      return _react["default"].createElement("div", {
        className: "tag-group"
      }, _react["default"].createElement(_basic.Row, {
        colCount: 6
      }, _react["default"].createElement(_basic.Col, {
        className: "label-control"
      }, this.Title), _react["default"].createElement(_basic.Col, {
        span: 4
      }, "   ", CheckableTagList, " ")));
    }
  }]);
  return Tag2;
}(_react.Component);

exports["default"] = Tag2;
//# sourceMappingURL=tag2.js.map