@alifd/meet-react/lib/form/form.js

Fusion Mobile React UI System Component

"use strict";

exports.__esModule = true;
exports.default = void 0;
var _tslib = require("tslib");
var _classnames = _interopRequireDefault(require("classnames"));
var _react = _interopRequireWildcard(require("react"));
var _field = _interopRequireDefault(require("../field"));
var _utils = require("../utils");
var _view = _interopRequireDefault(require("../view"));
var _context = _interopRequireWildcard(require("./context"));
var _utils2 = require("./utils");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var Form = exports.default = /*#__PURE__*/function (_Component) {
  _inheritsLoose(Form, _Component);
  function Form(props) {
    var _this = _Component.call(this, props) || this;
    _this.mapNameToGuid = {};
    _this.validateCallback = [];
    _this.handleAfterValidate = _this.handleAfterValidate.bind(_assertThisInitialized(_this));
    if (props.field) {
      _this.field = props.field;
      props.field.afterValidateRerender = props.field.afterValidateRerender ? (0, _utils.makeChain)(_this.handleAfterValidate, props.field.afterValidateRerender) : _this.handleAfterValidate;
      props.field.setOptions({
        onChange: (0, _utils.makeChain)(props.field.options.onChange, _this.handleChange.bind(_assertThisInitialized(_this)))
      });
    } else {
      var _props$autoUnmount = props.autoUnmount,
        autoUnmount = _props$autoUnmount === void 0 ? true : _props$autoUnmount,
        _props$autoValidate = props.autoValidate,
        autoValidate = _props$autoValidate === void 0 ? true : _props$autoValidate,
        _props$scrollToFirstE = props.scrollToFirstError,
        scrollToFirstError = _props$scrollToFirstE === void 0 ? false : _props$scrollToFirstE;
      _this.field = new _field.default(_assertThisInitialized(_this), {
        autoUnmount: autoUnmount,
        autoValidate: autoValidate,
        values: props.value || props.defaultValue || {},
        onChange: _this.handleChange.bind(_assertThisInitialized(_this)),
        scrollToFirstError: scrollToFirstError,
        afterValidateRerender: _this.handleAfterValidate
      });
    }
    if (props.saveField) {
      props.saveField(_this.field);
    }
    return _this;
  }
  var _proto = Form.prototype;
  _proto.submit = function submit() {
    var _this2 = this,
      _this$field;
    if (arguments.length === 0) {
      return this.field.validatePromise();
    }
    var names;
    var callback = null;
    var skipValidate = false;
    switch (arguments.length) {
      case 1:
        if (Array.isArray(arguments.length <= 0 ? undefined : arguments[0])) {
          names = arguments.length <= 0 ? undefined : arguments[0];
        } else if (typeof (arguments.length <= 0 ? undefined : arguments[0]) === 'function') {
          callback = arguments.length <= 0 ? undefined : arguments[0];
        }
        break;
      case 2:
        if ((0, _utils.isBoolean)(arguments.length <= 1 ? undefined : arguments[1])) {
          callback = arguments.length <= 0 ? undefined : arguments[0];
          skipValidate = arguments.length <= 1 ? undefined : arguments[1];
        } else {
          names = arguments.length <= 0 ? undefined : arguments[0];
          callback = arguments.length <= 1 ? undefined : arguments[1];
        }
        break;
      case 3:
        names = arguments.length <= 0 ? undefined : arguments[0];
        callback = arguments.length <= 1 ? undefined : arguments[1];
        skipValidate = arguments.length <= 2 ? undefined : arguments[2];
        break;
      default:
        {
          console.error('调用 Form.submit 参数错误，期待参数 <names?: [], callback?: function>');
        }
    }
    var validateCb = function validateCb(errors, values) {
      var onSubmit = _this2.props.onSubmit;
      if (errors) {
        callback(null, errors, _this2.field);
        if (onSubmit) {
          onSubmit(null, errors, _this2.field);
        }
      } else {
        callback(values, null, _this2.field);
        if (onSubmit) {
          onSubmit(values, null, _this2.field);
        }
      }
    };
    var validateParams = names ? [names, validateCb] : [validateCb];
    if (skipValidate) {
      var onSubmit = this.props.onSubmit;
      callback(this.getValue(names), null, this.field);
      if (onSubmit) {
        onSubmit(this.getValue(names), null, this.field);
      }
      return;
    }
    return (_this$field = this.field).validateCallback.apply(_this$field, validateParams);
  };
  _proto.reset = function reset(toDefault, names) {
    if (toDefault === void 0) {
      toDefault = true;
    }
    if (toDefault) {
      this.field.resetToDefault(names);
    } else {
      this.field.reset(names);
    }
  };
  _proto.getValue = function getValue(names) {
    return this.field.getValues(names);
  };
  _proto.setValue = function setValue(values) {
    this.field.setValues(values);
  };
  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
    if (this.props.field && this.props.field !== prevProps.field) {
      this.field = this.props.field;
      this.forceUpdate();
    }
    if (this.props.scrollToFirstError !== prevProps.scrollToFirstError) {
      this.field.setOptions({
        scrollToFirstError: !!this.props.scrollToFirstError
      });
    }
    if ('value' in this.props) {
      var value = this.props.value;
      if (value === prevProps.value) {
        return;
      }
      if (value) {
        this.field.setValues(value);
      } else {
        this.field.resetToDefault();
      }
    }
  };
  _proto.handleChange = function handleChange(name, value) {
    var onChange = this.props.onChange;
    if (onChange) {
      onChange(this.field.getValues(), {
        name: name,
        value: value,
        field: this.field
      });
    }
  };
  _proto.handleAfterValidate = function handleAfterValidate(data) {
    var _this3 = this;
    var errorsGroup = data.errorsGroup;
    if (errorsGroup && this.props.scrollToFirstError) {
      var firstNodeId = null;
      for (var i in errorsGroup) {
        if (errorsGroup.hasOwnProperty(i) && typeof this.mapNameToGuid[i] !== 'undefined') {
          firstNodeId = this.mapNameToGuid[i];
          break;
        }
      }
      if (firstNodeId) {
        (0, _utils.scrollToId)(firstNodeId);
      }
    }
    this.validateCallback.forEach(function (it) {
      return it.apply(_this3);
    });
  };
  _proto.onValidate = function onValidate(cb) {
    var _this4 = this;
    if (!this.validateCallback.includes(cb)) {
      this.validateCallback.push(cb);
    }
    return function () {
      var index = _this4.validateCallback.indexOf(cb);
      if (index >= 0) {
        _this4.validateCallback.splice(index, 1);
      }
    };
  };
  _proto.render = function render() {
    var _a = this.props,
      _a$prefix = _a.prefix,
      prefix = _a$prefix === void 0 ? 'mt-' : _a$prefix,
      children = _a.children,
      className = _a.className,
      onSubmit = _a.onSubmit,
      _a$labelAlign = _a.labelAlign,
      labelAlign = _a$labelAlign === void 0 ? _context.defaultContext.labelAlign : _a$labelAlign,
      _a$labelWidth = _a.labelWidth,
      labelWidth = _a$labelWidth === void 0 ? _context.defaultContext.labelWidth : _a$labelWidth,
      _a$labelTextAlign = _a.labelTextAlign,
      labelTextAlign = _a$labelTextAlign === void 0 ? _context.defaultContext.labelTextAlign : _a$labelTextAlign,
      _a$contentAlign = _a.contentAlign,
      contentAlign = _a$contentAlign === void 0 ? _context.defaultContext.contentAlign : _a$contentAlign,
      _a$isPreview = _a.isPreview,
      isPreview = _a$isPreview === void 0 ? _context.defaultContext.isPreview : _a$isPreview,
      _a$useLabelForErrorMe = _a.useLabelForErrorMessage,
      useLabelForErrorMessage = _a$useLabelForErrorMe === void 0 ? _context.defaultContext.useLabelForErrorMessage : _a$useLabelForErrorMe,
      _a$size = _a.size,
      size = _a$size === void 0 ? _context.defaultContext.size : _a$size,
      onChange = _a.onChange,
      others = (0, _tslib.__rest)(_a, ["prefix", "children", "className", "onSubmit", "labelAlign", "labelWidth", "labelTextAlign", "contentAlign", "isPreview", "useLabelForErrorMessage", "size", "onChange"]);
    var field = this.field;
    var contextValue = {
      labelAlign: labelAlign,
      labelWidth: labelWidth,
      labelTextAlign: labelTextAlign,
      contentAlign: contentAlign,
      isPreview: isPreview,
      useLabelForErrorMessage: useLabelForErrorMessage,
      size: size,
      form: this,
      field: field
    };
    return /*#__PURE__*/(0, _react.createElement)(_context.default.Provider, {
      value: contextValue
    }, /*#__PURE__*/(0, _react.createElement)(_view.default, _extends({}, (0, _utils2.removeFormAttrs)(others), {
      className: (0, _classnames.default)(prefix + "form", className)
    }), children));
  };
  return Form;
}(_react.Component);