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

mdf metaui web

"use strict";

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

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

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

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 _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

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

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

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

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

var _label = _interopRequireDefault(require("./label"));

var _text = _interopRequireDefault(require("./text"));

var _SvgIcon = _interopRequireDefault(require("@mdf/metaui-web/lib/components/common/SvgIcon"));

var _extend = require("@mdf/cube/lib/extend");

var RadioGroup = _baseui.Radio.Group;
var RadioButton = _baseui.Radio.Button;

var RadioGroupControl = function (_React$Component) {
  (0, _inherits2["default"])(RadioGroupControl, _React$Component);

  function RadioGroupControl(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, RadioGroupControl);
    _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(RadioGroupControl).call(this, props));
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleBodyClick", function (e) {
      document.body.removeEventListener('click', _this.handleBodyClick);

      _this.setState({
        focus: false
      });

      if (_this.contains(_this.refs.div, e.target)) return;
      if (_this.props.model) _this.props.model.execute('blur');
    });
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "validate", function (val) {
      _this.setState({
        err: 'has-' + val.type,
        msg: val.message
      });
    });
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onChange", function (e) {
      if (_this.props.model) {
        _this.props.model.select(e.target.value);
      }
    });
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "setValue", function (value) {
      var valueField = _this.state.valueField;
      var textField = _this.state.textField;
      var states = {};
      var key, text;

      if (value) {
        key = value[valueField];
        text = value[textField];
      }

      states['value'] = key;
      states['text'] = text;

      _this.setState(states);
    });
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "setListenerState", function (data) {
      var value = data.value;

      if (value) {
        _this.setValue(value);

        delete data.value;
      }

      var states = {};

      for (var attr in data) {
        if (attr === 'dataSource') {
          states['options'] = data[attr];
        } else {
          states[attr] = data[attr];
        }
      }

      _this.setState(states);
    });
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getOptions", function () {
      var _this$state = _this.state,
          valueField = _this$state.valueField,
          textField = _this$state.textField,
          type = _this$state.type,
          value = _this$state.value;
      return _this.state.options.map(function (item, index) {
        if (type == 'button') {
          return _react["default"].createElement(RadioButton, {
            key: item[valueField],
            disabled: item.disabled,
            value: item.value
          }, item.text);
        } else {
          var radioCom = _react["default"].createElement(_baseui.Radio, {
            key: item[valueField],
            disabled: item.disabled,
            value: item.value
          }, item.text);

          if (item.nameType === 'icontext') {
            var className = item.value === value ? ' selected' : '';
            return _react["default"].createElement("span", {
              className: "radio-svg-btn"
            }, _react["default"].createElement("div", {
              className: "radio-icon".concat(className)
            }, _react["default"].createElement(_SvgIcon["default"], {
              type: item.icon,
              onClick: function onClick() {
                return _this.handleIconClick(item.value);
              }
            })), radioCom);
          }

          if (item.nameType === 'svgtext') {
            var icon = item.icon;
            if (item.value === value) icon += '-active';
            return _react["default"].createElement("span", {
              className: "radio-svg-btn"
            }, _react["default"].createElement("div", {
              className: "radio-svg"
            }, _react["default"].createElement(_SvgIcon["default"], {
              type: icon,
              onClick: function onClick() {
                return _this.handleIconClick(item.value);
              }
            })), radioCom);
          }

          return radioCom;
        }
      });
    });
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "baseControl", function () {
      var _this$state2 = _this.state,
          readOnly = _this$state2.readOnly,
          options = _this$state2.options,
          value = _this$state2.value,
          afterPopoverKey = _this$state2.afterPopoverKey;
      var _baseControl = null;

      if (readOnly) {
        var textCom = (0, _text["default"])(_this.state.text);
        var option = options.find(function (item) {
          return item.value === value;
        });

        if (option && option.nameType === 'icontext') {
          _baseControl = _react["default"].createElement("span", {
            style: {
              "float": 'left'
            }
          }, _react["default"].createElement("div", {
            className: "radio-icon"
          }, _react["default"].createElement(_SvgIcon["default"], {
            type: option.icon,
            style: {
              display: 'block'
            }
          })), textCom);
        } else {
          _baseControl = textCom;
        }
      } else {
        var cProps = {
          value: value,
          size: _this.state.size,
          onChange: _this.onChange,
          disabled: _this.state.disabled
        };
        _baseControl = _react["default"].createElement(RadioGroup, (0, _extends2["default"])({}, cProps, {
          onBlur: function onBlur(e) {
            return _this.handleBlur(e);
          }
        }), _this.getOptions());
      }

      var AfterComName = null;

      if (!afterPopoverKey) {
        return _baseControl;
      } else {
        AfterComName = _extend.extendComp.popover[afterPopoverKey];
        return _react["default"].createElement("div", {
          className: "input-bottom"
        }, _react["default"].createElement("div", {
          className: "control-flex"
        }, _baseControl, _react["default"].createElement(AfterComName, null)));
      }
    });
    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getControl", function () {
      var cShowCaption = _this.props.cShowCaption;
      var title = !_this.state.readOnly && _this.state.bIsNull === false && cShowCaption ? _react["default"].createElement("label", null, _react["default"].createElement(_baseui.Icon, {
        type: "star"
      }), cShowCaption) : _react["default"].createElement("label", null, cShowCaption);
      var control = cShowCaption ? _react["default"].createElement(_label["default"], {
        control: _this.baseControl(),
        title: title
      }) : _this.baseControl();
      return control;
    });
    var cStyle = props.cStyle;
    var config = null;

    if (cStyle) {
      try {
        config = JSON.parse(cStyle);
      } catch (e) {
        config = {};
      }
    }

    _this.state = Object.assign({
      bIsNull: props.bIsNull,
      valueField: 'value',
      textField: 'text',
      options: [],
      value: undefined,
      disabled: false,
      visible: !props.bHidden,
      size: 'default'
    }, config);
    return _this;
  }

  (0, _createClass2["default"])(RadioGroupControl, [{
    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: "handleIconClick",
    value: function handleIconClick(value) {
      if (this.props.model) this.props.model.select(value);
    }
  }, {
    key: "render",
    value: function render() {
      if (this.state.focus) document.body.addEventListener('click', this.handleBodyClick);
      var control = this.getControl();
      var style = this.state.visible ? {} : {
        display: "none"
      };
      var className = "";

      if (!this.state.readOnly && !this.state.afterPopoverKey) {
        className = 'control-radio ticket-opening';
      }

      var err = this.state.err ? this.state.err : '';
      className = className + ' ' + (this.state.classname ? "".concat(this.state.classname, " ") : '') + err;
      return _react["default"].createElement("div", {
        ref: "div",
        style: style,
        className: className
      }, control, _react["default"].createElement("div", {
        className: "ant-form-explain"
      }, this.state.msg));
    }
  }]);
  return RadioGroupControl;
}(_react["default"].Component);

exports["default"] = RadioGroupControl;
//# sourceMappingURL=radio.js.map