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

mdf metaui web

"use strict";

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

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

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 = _interopRequireDefault(require("react"));

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

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

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

  function FieldHelp(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, FieldHelp);
    _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(FieldHelp).call(this, props));
    _this.state = {
      dataSource: props.dataSource || [{
        type: 'text',
        data: '测试文字是否按规则显示测试文字是否按规则显示测试文字是否按规则显示',
        className: 'test_text'
      }, {
        type: 'image',
        data: "https://f10.baidu.com/it/u=2885280456,2961378604&fm=72",
        className: 'test_img'
      }],
      placement: props.config && props.config.placement ? props.config.placement : 'top',
      className: props.config && props.config.className ? props.config.className : 'field_help'
    };
    return _this;
  }

  (0, _createClass2["default"])(FieldHelp, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      if (this.props.model) this.props.model.addListener(this);
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {
      if (this.props.model) this.props.model.addListener(this);
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      if (this.props.model) this.props.model.removeListener(this);
    }
  }, {
    key: "render",
    value: function render() {
      var _this$state = this.state,
          dataSource = _this$state.dataSource,
          placement = _this$state.placement,
          className = _this$state.className;
      var innerContent = [];
      dataSource.forEach(function (ele) {
        switch (ele.type) {
          case 'text':
            innerContent.push(_react["default"].createElement("p", {
              className: ele.className
            }, ele.data));
            break;

          case 'image':
            innerContent.push(_react["default"].createElement("div", {
              style: {
                "text-align": "center"
              }
            }, _react["default"].createElement("img", {
              className: ele.className,
              src: ele.data,
              alt: ""
            })));
            break;

          case 'text&image':
            innerContent.push(_react["default"].createElement("div", null));
            break;
        }
      });

      var content = _react["default"].createElement("div", null, innerContent);

      return _react["default"].createElement(_baseui.Popover, {
        content: content,
        trigger: "hover",
        placement: placement,
        overlayClassName: className
      }, _react["default"].createElement(_SvgIcon["default"], {
        type: "bangzhuzhongxin",
        style: {
          width: '1.5em',
          height: '1.5em',
          cursor: 'pointer'
        }
      }));
    }
  }]);
  return FieldHelp;
}(_react["default"].Component);

exports["default"] = FieldHelp;
//# sourceMappingURL=fieldHelp.js.map