choerodon-ui/pro/es/screening/index.js

An enterprise-class UI design language and React-based implementation

import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
import _inherits from "@babel/runtime/helpers/inherits";
import _createSuper from "@babel/runtime/helpers/createSuper";
import { __decorate } from "tslib";
import React, { Children, cloneElement } from 'react';
import { observer } from 'mobx-react';
import { observable, computed, action, runInAction, toJS } from 'mobx';
import Tag from '../../../es/tag';
import isNumber from 'lodash/isNumber';
import isString from 'lodash/isString';
import isNil from 'lodash/isNil';
import omit from 'lodash/omit';
import warning from '../../../es/_util/warning';
import isArray from 'lodash/isArray';
import isSame from '../_util/isSame';
import DataSetComponent from '../data-set/DataSetComponent';
import ScreeningItem from './ScreeningItem';
import { $l } from '../locale-context';

var Screening = /*#__PURE__*/function (_DataSetComponent) {
  _inherits(Screening, _DataSetComponent);

  var _super = _createSuper(Screening);

  function Screening(props, context) {
    var _this;

    _classCallCheck(this, Screening);

    _this = _super.call(this, props, context);
    _this.emptyValue = null; // 存下所有子集的ref便于直接调用其中内部方法

    _this.child = {};

    _this.onRef = function (ref, name) {
      _this.child[name] = ref;
    };

    _this.handleChange = function (value, oldValue) {
      var onChange = _this.props.onChange;

      if (onChange) {
        onChange(value, oldValue);
      }
    };

    _this.handleConfirm = function (_ref) {
      var value = _ref.value,
          fieldName = _ref.fieldName;
      var oldValue = omit(toJS(_this.mergeValue), '__dirty');

      if (fieldName) {
        _this.mergeValue = _objectSpread(_objectSpread({}, _this.mergeValue), {}, _defineProperty({}, fieldName, value));
      }

      var valueNow = omit(toJS(_this.mergeValue), '__dirty');

      if (!isSame(oldValue, valueNow)) {
        _this.handleChange(valueNow, oldValue);
      }
    };

    _this.handleCloseItem = function (filedName) {
      var dataSet = _this.props.dataSet;

      if (dataSet && filedName) {
        (_this.record || dataSet.create({})).set(filedName, _this.emptyValue);
      }

      _this.mergeValue[filedName] = _this.emptyValue;

      if (_this.child && _this.child[filedName]) {
        _this.child[filedName].handleClear();
      }
    };

    _this.findByValue = function (value, name) {
      if (value && _this.child && _this.child[name]) {
        return _this.child[name].processValue(value);
      }

      return value;
    };

    _this.renderTag = function (mergeValue) {
      var _assertThisInitialize = _assertThisInitialized(_this),
          dataSet = _assertThisInitialize.dataSet;

      var prefixCls = _this.prefixCls;
      var tagRender = _this.props.tagRender;
      var tagsProps = [];

      if (dataSet) {
        Object.keys(mergeValue).forEach(function (key) {
          var value = mergeValue[key];
          var field = dataSet.getField(key);
          var label = key;
          var text = value;

          if (field) {
            var _assertThisInitialize2 = _assertThisInitialized(_this),
                _record = _assertThisInitialize2.record;

            label = field.get('label', _record);

            if (isArray(value)) {
              text = value.map(function (v) {
                var itemText = field.getText(v, undefined, _record);

                if (isNil(itemText)) {
                  itemText = _this.findByValue(v, key);
                }

                return itemText;
              });
            } else {
              text = field.getText(value, undefined, _record);

              if (isNil(text)) {
                text = _this.findByValue(value, key);
              }
            }
          }

          if (text && label) {
            var tagProps = {
              text: text,
              label: label,
              handleClose: function handleClose(filedName) {
                _this.handleCloseItem(filedName);
              },
              key: key
            };
            tagsProps.push(tagProps);
          }
        });
        var labelTitle = "".concat($l('Screening', 'selected'), ":");
        var labelNode = /*#__PURE__*/React.createElement("span", {
          className: "".concat(prefixCls, "-choosed-label")
        }, labelTitle);

        if (tagsProps.length > 0) {
          return tagRender ? tagRender({
            labelTitle: labelTitle,
            tagsProps: tagsProps
          }) : /*#__PURE__*/React.createElement("div", {
            className: "".concat(prefixCls, "-choosed")
          }, /*#__PURE__*/React.createElement("div", {
            className: "".concat(prefixCls, "-choosed-title")
          }, labelNode), /*#__PURE__*/React.createElement("div", {
            className: "".concat(prefixCls, "-choosed-content")
          }, tagsProps.map(function (tagItemProps) {
            return /*#__PURE__*/React.createElement(Tag, {
              onClose: function onClose(e) {
                e.preventDefault();
                tagItemProps.handleClose(tagItemProps.key);
              },
              key: tagItemProps.key,
              closable: true
            }, "".concat(tagItemProps.label, ":").concat(tagItemProps.text));
          })));
        }
      }

      return null;
    };

    var dataSet = _this.dataSet;
    var record = _this.record;
    runInAction(function () {
      if (dataSet && record) {
        _this.mergeValue = record.toData();
      }
    });
    return _this;
  }
  /**
   * return the record: dataIndex record, current, undefined
   */


  _createClass(Screening, [{
    key: "record",
    get: function get() {
      var _this$observableProps = this.observableProps,
          record = _this$observableProps.record,
          dataSet = _this$observableProps.dataSet,
          dataIndex = _this$observableProps.dataIndex;

      if (record) {
        return record;
      }

      if (dataSet) {
        if (isNumber(dataIndex)) {
          return dataSet.get(dataIndex);
        }

        return dataSet.current;
      }

      return undefined;
    }
  }, {
    key: "dataSet",
    get: function get() {
      var record = this.record;

      if (record) {
        return record.dataSet;
      }

      return this.observableProps.dataSet;
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var dataSet = this.dataSet;
      var children = this.props.children;
      var mergeValue = toJS(this.mergeValue);
      mergeValue = omit(mergeValue, ['__dirty']);
      var filteredChildren = Children.toArray(children).filter(function (c) {
        return !!c;
      });
      return /*#__PURE__*/React.createElement("div", {
        className: "".concat(this.prefixCls)
      }, this.renderTag(mergeValue), Children.map(filteredChildren, function (child, _index) {
        var name = child.props.name;

        if (_this2.mergeValue && name && isNil(_this2.mergeValue[name])) {
          var screenProps = {
            onConfirm: _this2.handleConfirm,
            onChange: _this2.handleChange,
            dataSet: dataSet,
            onRef: function onRef(ref) {
              _this2.onRef(ref, name);
            }
          };

          if (!isString(name)) {
            // @ts-expect-error: this should be optional
            delete screenProps.onRef;
            warning(false, "ScreeningItem need binding DataSet with property name.");
          }

          return /*#__PURE__*/cloneElement(child, screenProps);
        }
      }));
    }
  }]);

  return Screening;
}(DataSetComponent);

Screening.displayName = 'Screening';
Screening.ScreeningItem = ScreeningItem;
Screening.defaultProps = {
  suffixCls: 'screening'
};

__decorate([observable], Screening.prototype, "mergeValue", void 0);

__decorate([computed], Screening.prototype, "record", null);

__decorate([computed], Screening.prototype, "dataSet", null);

__decorate([action], Screening.prototype, "handleConfirm", void 0);

__decorate([action], Screening.prototype, "handleCloseItem", void 0);

Screening = __decorate([observer], Screening);
export default Screening;
//# sourceMappingURL=index.js.map