choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
1,066 lines (881 loc) • 38.1 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _tslib = require("tslib");
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
var _mobxReact = require("mobx-react");
var _mobx = require("mobx");
var _omit = _interopRequireDefault(require("lodash/omit"));
var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
var _isString = _interopRequireDefault(require("lodash/isString"));
var _noop = _interopRequireDefault(require("lodash/noop"));
var _defaultTo = _interopRequireDefault(require("lodash/defaultTo"));
var _Responsive = _interopRequireDefault(require("../../../lib/responsive/Responsive"));
var _configure = require("../../../lib/configure");
var _UnitConvertor = require("../../../lib/_util/UnitConvertor");
var _isFunction = _interopRequireDefault(require("lodash/isFunction"));
var _isArray = _interopRequireDefault(require("lodash/isArray"));
var _axios = _interopRequireDefault(require("../axios"));
var _autobind = _interopRequireDefault(require("../_util/autobind"));
var _FormField = require("../field/FormField");
var _FormContext = _interopRequireDefault(require("./FormContext"));
var _DataSetComponent2 = _interopRequireDefault(require("../data-set/DataSetComponent"));
var _enum = require("./enum");
var _utils = require("./utils");
var _FormVirtualGroup = _interopRequireDefault(require("./FormVirtualGroup"));
var _PropTypes$shape, _PropTypes$shape2, _PropTypes$shape3, _PropTypes$shape4;
function _createSuper(Derived) {
function isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
return true;
} catch (e) {
return false;
}
}
return function () {
var Super = (0, _getPrototypeOf2["default"])(Derived),
result;
if (isNativeReflectConstruct()) {
var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor;
result = Reflect.construct(Super, arguments, NewTarget);
} else {
result = Super.apply(this, arguments);
}
return (0, _possibleConstructorReturn2["default"])(this, result);
};
}
/**
* 表单name生成器
*/
var NameGen =
/*#__PURE__*/
_regenerator["default"].mark(function _callee(start) {
return _regenerator["default"].wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
if (!true) {
_context.next = 6;
break;
}
start += 1;
_context.next = 4;
return "form-".concat(start);
case 4:
_context.next = 0;
break;
case 6:
case "end":
return _context.stop();
}
}
}, _callee);
})(0);
var labelWidthPropTypes = _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].oneOf(['auto']), _propTypes["default"].arrayOf(_propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].oneOf(['auto'])]))]);
var labelAlignPropTypes = _propTypes["default"].oneOf([_enum.LabelAlign.left, _enum.LabelAlign.center, _enum.LabelAlign.right]);
var labelLayoutPropTypes = _propTypes["default"].oneOf([_enum.LabelLayout.horizontal, _enum.LabelLayout.vertical, _enum.LabelLayout.placeholder, _enum.LabelLayout["float"]]);
var Form =
/*#__PURE__*/
function (_DataSetComponent) {
(0, _inherits2["default"])(Form, _DataSetComponent);
var _super = _createSuper(Form);
function Form(props, context) {
var _this;
(0, _classCallCheck2["default"])(this, Form);
_this = _super.call(this, props, context);
_this.fields = [];
_this.name = NameGen.next().value;
(0, _mobx.runInAction)(function () {
_this.responsiveItems = [];
});
return _this;
}
(0, _createClass2["default"])(Form, [{
key: "isDisabled",
value: function isDisabled() {
return (0, _get2["default"])((0, _getPrototypeOf2["default"])(Form.prototype), "isDisabled", this).call(this) || this.context.disabled;
}
}, {
key: "isReadOnly",
value: function isReadOnly() {
return this.props.readOnly || this.context.readOnly;
}
}, {
key: "getObservableProps",
value: function getObservableProps(props, context) {
return (0, _objectSpread3["default"])({}, (0, _get2["default"])((0, _getPrototypeOf2["default"])(Form.prototype), "getObservableProps", this).call(this, props, context), {
dataSet: 'dataSet' in props ? props.dataSet : context.dataSet,
record: 'record' in props ? props.record : context.record,
dataIndex: (0, _defaultTo["default"])(props.dataIndex, context.dataIndex),
labelLayout: 'labelLayout' in props ? props.labelLayout : context.labelLayout,
labelAlign: 'labelAlign' in props ? props.labelAlign : context.labelAlign,
labelWidth: (0, _defaultTo["default"])(props.labelWidth, context.labelWidth),
pristine: 'pristine' in props ? props.pristine : context.pristine,
columns: props.columns,
useColon: props.useColon,
excludeUseColonTagList: props.excludeUseColonTagList,
separateSpacing: props.separateSpacing
});
}
}, {
key: "getOtherProps",
value: function getOtherProps() {
var otherProps = (0, _omit["default"])((0, _get2["default"])((0, _getPrototypeOf2["default"])(Form.prototype), "getOtherProps", this).call(this), ['record', 'dataIndex', 'onSuccess', 'onError', 'processParams', 'labelWidth', 'labelAlign', 'labelLayout', 'columns', 'pristine', 'axios', 'useColon', 'excludeUseColonTagList', 'separateSpacing']);
otherProps.onSubmit = this.handleSubmit;
otherProps.onReset = this.handleReset;
if (!otherProps.name) {
otherProps.name = this.name;
}
return otherProps;
}
}, {
key: "getHeader",
value: function getHeader() {
var header = this.props.header,
prefixCls = this.prefixCls;
if (header) {
return _react["default"].createElement("div", {
key: "form-header",
className: "".concat(prefixCls, "-header")
}, header);
}
}
}, {
key: "getClassName",
value: function getClassName() {
var prefixCls = this.prefixCls,
labelLayout = this.labelLayout;
for (var _len = arguments.length, props = new Array(_len), _key = 0; _key < _len; _key++) {
props[_key] = arguments[_key];
}
return (0, _get2["default"])((0, _getPrototypeOf2["default"])(Form.prototype), "getClassName", this).call(this, (0, _objectSpread3["default"])({}, props, (0, _defineProperty2["default"])({}, "".concat(prefixCls, "-float-label"), labelLayout === _enum.LabelLayout["float"])));
}
}, {
key: "componentWillMount",
value: function componentWillMount() {
this.processDataSetListener(true);
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.processDataSetListener(false);
}
}, {
key: "processDataSetListener",
value: function processDataSetListener(flag) {
var dataSet = this.dataSet;
if (dataSet) {
var handler = flag ? dataSet.addEventListener : dataSet.removeEventListener;
handler.call(dataSet, 'validate', this.handleDataSetValidate);
}
} // 处理校验失败定位
}, {
key: "handleDataSetValidate",
value: function () {
var _handleDataSetValidate = (0, _asyncToGenerator2["default"])(
/*#__PURE__*/
_regenerator["default"].mark(function _callee2(_ref) {
var result, item;
return _regenerator["default"].wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
result = _ref.result;
_context2.next = 3;
return result;
case 3:
if (_context2.sent) {
_context2.next = 6;
break;
}
item = this.element ? (0, _utils.findFirstInvalidElement)(this.element) : null;
if (item) {
item.focus();
}
case 6:
case "end":
return _context2.stop();
}
}
}, _callee2, this);
}));
function handleDataSetValidate(_x) {
return _handleDataSetValidate.apply(this, arguments);
}
return handleDataSetValidate;
}()
}, {
key: "rasterizedChildren",
value: function rasterizedChildren() {
var _this2 = this;
var dataSet = this.dataSet,
record = this.record,
columns = this.columns,
labelLayout = this.labelLayout,
labelAlign = this.labelAlign,
useColon = this.useColon,
excludeUseColonTagList = this.excludeUseColonTagList,
children = this.props.children;
var prefixCls = (0, _configure.getProPrefixCls)(_utils.FIELD_SUFFIX);
var labelWidth = (0, _utils.normalizeLabelWidth)(this.labelWidth, columns);
var rows = [];
var cols = [];
var rowIndex = 0;
var colIndex = 0;
var matrix = [[]];
var noLabel = true;
var childrenArray = [];
var separateSpacingWidth = this.separateSpacing ? this.separateSpacing.width / 2 : 0;
_react.Children.forEach(children, function (child) {
if ((0, _react.isValidElement)(child)) {
var setChild = function setChild(arr, outChild) {
var groupProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
if (noLabel === true && labelLayout === _enum.LabelLayout.horizontal && (0, _utils.getProperty)(outChild.props, 'label', dataSet, record)) {
noLabel = false;
}
if (!(outChild === null || outChild === void 0 ? void 0 : outChild.type)) {
return;
}
if ((outChild === null || outChild === void 0 ? void 0 : outChild.type) && outChild.type.displayName === 'FormVirtualGroup') {
if (!outChild.props.children) {
return;
}
if ((0, _isArray["default"])(outChild.props.children)) {
outChild.props.children.forEach(function (c) {
setChild(arr, c, (0, _omit["default"])(outChild.props, ['children']));
});
} else if ((outChild === null || outChild === void 0 ? void 0 : outChild.type) && outChild.type.displayName === 'FormVirtualGroup') {
setChild(arr, outChild.props.children, (0, _omit["default"])(outChild.props, ['children']));
} else {
arr.push((0, _react.cloneElement)(outChild.props.children, (0, _objectSpread3["default"])({}, groupProps, {}, outChild.props.children.props)));
}
} else {
arr.push((0, _react.cloneElement)(outChild, (0, _objectSpread3["default"])({}, groupProps, {}, outChild.props)));
}
};
setChild(childrenArray, child);
}
});
function completeLine() {
if (cols.length) {
rows.push(_react["default"].createElement("tr", {
key: "row-".concat(rowIndex)
}, cols));
cols = [];
}
rowIndex++;
colIndex = 0;
matrix[rowIndex] = matrix[rowIndex] || [];
}
var _loop = function _loop(_index, len) {
var _classNames;
var _childrenArray$_index = childrenArray[_index],
props = _childrenArray$_index.props,
key = _childrenArray$_index.key,
type = _childrenArray$_index.type;
var TagName = type;
if ((0, _isFunction["default"])(type)) {
TagName = type.displayName;
}
var label = (0, _utils.getProperty)(props, 'label', dataSet, record);
var fieldLabelWidth = (0, _utils.getProperty)(props, 'labelWidth', dataSet, record);
var required = (0, _utils.getProperty)(props, 'required', dataSet, record);
var readOnly = (0, _utils.getProperty)(props, 'readOnly', dataSet, record) || _this2.isReadOnly();
var _props$rowSpan = props.rowSpan,
rowSpan = _props$rowSpan === void 0 ? 1 : _props$rowSpan,
_props$colSpan = props.colSpan,
colSpan = _props$colSpan === void 0 ? 1 : _props$colSpan,
newLine = props.newLine,
className = props.className,
fieldClassName = props.fieldClassName,
otherProps = (0, _objectWithoutProperties2["default"])(props, ["rowSpan", "colSpan", "newLine", "className", "fieldClassName"]);
var newColSpan = colSpan;
var currentRow = matrix[rowIndex];
if (newLine) {
if (colIndex !== 0) {
completeLine();
index = _index;
return "continue";
}
}
while (currentRow[colIndex]) {
colIndex++;
}
if (colIndex >= columns) {
completeLine();
index = _index;
return "continue";
}
if (newColSpan + colIndex > columns) {
newColSpan = columns - colIndex;
}
for (var _i2 = colIndex, k = colIndex + newColSpan; _i2 < k; _i2++) {
if (currentRow[_i2]) {
newColSpan = _i2 - colIndex;
break;
}
}
for (var _i3 = rowIndex; _i3 < rowSpan + rowIndex; _i3++) {
for (var j = colIndex, _k = newColSpan + colIndex; j < _k; j++) {
if (!matrix[_i3]) {
matrix[_i3] = [];
}
matrix[_i3][j] = true;
}
}
var isOutput = labelLayout === _enum.LabelLayout.horizontal && type.displayName === 'Output';
var labelClassName = (0, _classnames["default"])("".concat(prefixCls, "-label"), "".concat(prefixCls, "-label-").concat(labelAlign), fieldClassName, (_classNames = {}, (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-required"), required), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-readonly"), readOnly), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-label-vertical"), labelLayout === _enum.LabelLayout.vertical), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-label-output"), isOutput), (0, _defineProperty2["default"])(_classNames, "".concat(prefixCls, "-label-useColon"), useColon && !excludeUseColonTagList.find(function (v) {
return v === TagName;
})), _classNames));
var wrapperClassName = (0, _classnames["default"])("".concat(prefixCls, "-wrapper"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "-output"), isOutput));
if (!noLabel) {
if (!isNaN(fieldLabelWidth)) {
labelWidth[colIndex] = Math.max(labelWidth[colIndex], fieldLabelWidth);
}
cols.push(_react["default"].createElement("td", {
key: "row-".concat(rowIndex, "-col-").concat(colIndex, "-label"),
className: labelClassName,
rowSpan: rowSpan,
style: _this2.labelLayout === _enum.LabelLayout.horizontal && separateSpacingWidth ? {
paddingLeft: (0, _UnitConvertor.pxToRem)(separateSpacingWidth + 5)
} : undefined
}, _react["default"].createElement("label", {
title: (0, _isString["default"])(label) ? label : ''
}, _react["default"].createElement("span", null, label))));
}
var fieldElementProps = (0, _objectSpread3["default"])({
key: key,
className: (0, _classnames["default"])(prefixCls, className)
}, otherProps);
if (!(0, _isString["default"])(type)) {
fieldElementProps.rowIndex = rowIndex;
fieldElementProps.colIndex = colIndex;
}
cols.push(_react["default"].createElement("td", {
key: "row-".concat(rowIndex, "-col-").concat(colIndex, "-field"),
colSpan: noLabel ? newColSpan : newColSpan * 2 - 1,
rowSpan: rowSpan,
className: fieldClassName,
style: _this2.labelLayout === _enum.LabelLayout.horizontal && separateSpacingWidth ? {
paddingRight: (0, _UnitConvertor.pxToRem)(separateSpacingWidth + 5)
} : undefined
}, labelLayout === _enum.LabelLayout.vertical && _react["default"].createElement("label", {
className: labelClassName
}, label), _react["default"].createElement("div", {
className: wrapperClassName
}, (0, _react.createElement)(type, fieldElementProps))));
if (_index === len - 1) {
completeLine();
} else {
colIndex++;
}
_index++;
index = _index;
};
for (var index = 0, len = childrenArray.length; index < len;) {
var _ret = _loop(index, len);
if (_ret === "continue") continue;
}
cols = []; // 优化当使用separateSoacing label宽度太窄问题
var labelWidthProcess = function labelWidthProcess(widthInner) {
if ((0, _isNumber["default"])(widthInner)) {
if (_this2.labelLayout === _enum.LabelLayout.horizontal) {
return separateSpacingWidth + widthInner;
}
return widthInner;
}
return separateSpacingWidth + _utils.defaultLabelWidth;
};
if (!noLabel) {
for (var i = 0; i < columns; i++) {
cols.push(_react["default"].createElement("col", {
key: "label-".concat(i),
style: {
width: (0, _UnitConvertor.pxToRem)(labelWidthProcess(labelWidth[i % columns]))
}
}), _react["default"].createElement("col", {
key: "wrapper-".concat(i)
}));
}
} else {
for (var _i = 0; _i < columns; _i++) {
cols.push(_react["default"].createElement("col", {
key: "wrapper-".concat(_i)
}));
}
}
var tableStyle;
var separateSpacing = this.separateSpacing;
if (separateSpacing) {
if (this.labelLayout === _enum.LabelLayout.horizontal) {
tableStyle = {
borderCollapse: 'separate',
borderSpacing: "0rem ".concat((0, _UnitConvertor.pxToRem)(separateSpacing.height))
};
} else {
tableStyle = {
borderCollapse: 'separate',
borderSpacing: "".concat((0, _UnitConvertor.pxToRem)(separateSpacing.width), " ").concat((0, _UnitConvertor.pxToRem)(separateSpacing.height))
};
}
}
var isAutoWidth = this.labelWidth === 'auto' || (0, _mobx.isArrayLike)(this.labelWidth) && this.labelWidth.some(function (w) {
return w === 'auto';
});
return [this.getHeader(), _react["default"].createElement("table", {
style: tableStyle,
key: "form-body",
className: "".concat(isAutoWidth ? 'auto-width' : '')
}, cols.length ? _react["default"].createElement("colgroup", null, cols) : undefined, _react["default"].createElement("tbody", null, rows))];
}
}, {
key: "render",
value: function render() {
var labelWidth = this.labelWidth,
labelAlign = this.labelAlign,
labelLayout = this.labelLayout,
pristine = this.pristine,
dataSet = this.dataSet,
record = this.record,
dataIndex = this.dataIndex,
observableProps = this.observableProps;
var formNode = this.context.formNode;
var value = {
formNode: formNode || this,
dataSet: dataSet,
dataIndex: dataIndex,
record: record,
labelWidth: labelWidth,
labelAlign: labelAlign,
labelLayout: labelLayout,
pristine: pristine,
disabled: this.isDisabled(),
readOnly: this.isReadOnly()
};
var children = this.rasterizedChildren();
if (!formNode) {
children = _react["default"].createElement("form", (0, _extends2["default"])({}, this.getMergedProps(), {
noValidate: true
}), children);
}
return _react["default"].createElement(_Responsive["default"], {
items: [observableProps.columns, observableProps.labelWidth, observableProps.labelAlign, observableProps.labelLayout],
onChange: this.handleResponsive
}, _react["default"].createElement(_FormContext["default"].Provider, {
value: value
}, children));
}
}, {
key: "handleResponsive",
value: function handleResponsive(items) {
this.responsiveItems = items;
}
}, {
key: "handleSubmit",
value: function () {
var _handleSubmit = (0, _asyncToGenerator2["default"])(
/*#__PURE__*/
_regenerator["default"].mark(function _callee3(e) {
var _this$props, target, action, dataSet, method, _this$props$processPa, processParams, _this$props$onSuccess, onSuccess, _this$props$onError, onError, _this$props$onSubmit, onSubmit;
return _regenerator["default"].wrap(function _callee3$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
e.preventDefault();
e.persist();
_context3.next = 4;
return this.checkValidity();
case 4:
if (!_context3.sent) {
_context3.next = 31;
break;
}
_this$props = this.props, target = _this$props.target, action = _this$props.action, dataSet = _this$props.dataSet, method = _this$props.method, _this$props$processPa = _this$props.processParams, processParams = _this$props$processPa === void 0 ? _noop["default"] : _this$props$processPa, _this$props$onSuccess = _this$props.onSuccess, onSuccess = _this$props$onSuccess === void 0 ? _noop["default"] : _this$props$onSuccess, _this$props$onError = _this$props.onError, onError = _this$props$onError === void 0 ? _noop["default"] : _this$props$onError, _this$props$onSubmit = _this$props.onSubmit, onSubmit = _this$props$onSubmit === void 0 ? _noop["default"] : _this$props$onSubmit;
onSubmit(e);
_context3.prev = 7;
if (!dataSet) {
_context3.next = 16;
break;
}
_context3.t0 = onSuccess;
_context3.next = 12;
return dataSet.submit();
case 12:
_context3.t1 = _context3.sent;
(0, _context3.t0)(_context3.t1);
_context3.next = 26;
break;
case 16:
if (!action) {
_context3.next = 26;
break;
}
if (!(target && this.element)) {
_context3.next = 21;
break;
}
this.element.submit();
_context3.next = 26;
break;
case 21:
_context3.t2 = onSuccess;
_context3.next = 24;
return this.axios[method || 'get'](action, processParams(e));
case 24:
_context3.t3 = _context3.sent;
(0, _context3.t2)(_context3.t3);
case 26:
_context3.next = 31;
break;
case 28:
_context3.prev = 28;
_context3.t4 = _context3["catch"](7);
onError(_context3.t4);
case 31:
case "end":
return _context3.stop();
}
}
}, _callee3, this, [[7, 28]]);
}));
function handleSubmit(_x2) {
return _handleSubmit.apply(this, arguments);
}
return handleSubmit;
}()
}, {
key: "handleReset",
value: function handleReset(e) {
var _this$props$onReset = this.props.onReset,
onReset = _this$props$onReset === void 0 ? _noop["default"] : _this$props$onReset;
var record = this.record;
onReset(e);
if (!e.isDefaultPrevented()) {
if (record) {
record.reset();
} else {
this.getFields().forEach(function (field) {
return field.reset();
});
}
}
}
}, {
key: "checkValidity",
value: function checkValidity() {
var dataSet = this.dataSet;
if (dataSet) {
if (!dataSet.length) {
dataSet.create();
}
return dataSet.validate();
}
return Promise.all(this.getFields().map(function (field) {
return field.checkValidity();
})).then(function (results) {
return results.every(function (result) {
return result;
});
});
}
}, {
key: "getFields",
value: function getFields() {
var id = this.props.id;
if (id) {
return [].concat(this.fields, (0, _FormField.getFieldsById)(id));
}
return this.fields;
}
}, {
key: "getField",
value: function getField(name) {
return this.getFields().find(function (field) {
return field.props.name === name;
});
}
}, {
key: "addField",
value: function addField(field) {
this.fields.push(field);
}
}, {
key: "removeField",
value: function removeField(field) {
var index = this.fields.indexOf(field);
if (index !== -1) {
this.fields.splice(index, 1);
}
}
}, {
key: "axios",
get: function get() {
return this.observableProps.axios || (0, _configure.getConfig)('axios') || _axios["default"];
}
}, {
key: "dataSet",
get: function get() {
var record = this.record;
if (record) {
return record.dataSet;
}
return this.observableProps.dataSet;
}
}, {
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 ((0, _isNumber["default"])(dataIndex)) {
return dataSet.get(dataIndex);
}
return dataSet.current;
}
return undefined;
}
}, {
key: "dataIndex",
get: function get() {
return this.observableProps.dataIndex;
}
}, {
key: "useColon",
get: function get() {
var useColon = this.observableProps.useColon;
if (useColon !== undefined) {
return useColon;
}
var configUseColon = (0, _configure.getConfig)('useColon');
if (configUseColon !== undefined) {
return configUseColon;
}
return false;
}
}, {
key: "excludeUseColonTagList",
get: function get() {
var excludeUseColonTagList = this.observableProps.excludeUseColonTagList;
if (excludeUseColonTagList !== undefined) {
return excludeUseColonTagList;
}
var configExcludeUseColonTagList = (0, _configure.getConfig)('excludeUseColonTagList');
if (configExcludeUseColonTagList !== undefined) {
return configExcludeUseColonTagList;
}
return _utils.defaultExcludeUseColonTag;
}
}, {
key: "columns",
get: function get() {
var columns = this.observableProps.columns;
if ((0, _isNumber["default"])(columns)) {
return columns;
}
if (columns) {
var responsiveColumns = this.responsiveItems[0];
if (responsiveColumns) {
return responsiveColumns;
}
}
return _utils.defaultColumns;
}
}, {
key: "labelWidth",
get: function get() {
var labelWidth = this.observableProps.labelWidth;
if (labelWidth === 'auto') {
return labelWidth;
}
if ((0, _isNumber["default"])(labelWidth) || (0, _mobx.isArrayLike)(labelWidth)) {
return labelWidth;
}
if (labelWidth) {
var responsiveWidth = this.responsiveItems[1];
if (responsiveWidth !== undefined) {
return responsiveWidth;
}
}
return _utils.defaultLabelWidth;
}
}, {
key: "labelAlign",
get: function get() {
var labelAlign = this.observableProps.labelAlign;
var defaultLabelAlign = this.labelLayout === _enum.LabelLayout.vertical ? _enum.LabelAlign.left : _enum.LabelAlign.right;
if ((0, _isString["default"])(labelAlign)) {
return labelAlign;
}
if (labelAlign) {
var responsiveAlign = this.responsiveItems[2];
if (responsiveAlign) {
return responsiveAlign;
}
}
return defaultLabelAlign;
}
}, {
key: "labelLayout",
get: function get() {
var defaultLabelLayout = (0, _configure.getConfig)('labelLayout') || _enum.LabelLayout.horizontal;
var labelLayout = this.observableProps.labelLayout;
if ((0, _isString["default"])(labelLayout)) {
return labelLayout;
}
if (labelLayout) {
var responsiveLabelLayout = this.responsiveItems[3];
if (responsiveLabelLayout) {
return responsiveLabelLayout;
}
}
return defaultLabelLayout;
}
}, {
key: "pristine",
get: function get() {
return this.observableProps.pristine;
}
}, {
key: "separateSpacing",
get: function get() {
var separateSpacing = this.observableProps.separateSpacing;
if (separateSpacing) {
var _separateSpacing$widt = separateSpacing.width,
width = _separateSpacing$widt === void 0 ? 0 : _separateSpacing$widt,
_separateSpacing$heig = separateSpacing.height,
height = _separateSpacing$heig === void 0 ? 0 : _separateSpacing$heig;
if (width || height) {
return {
width: width,
height: height
};
}
}
return undefined;
}
}]);
return Form;
}(_DataSetComponent2["default"]);
Form.displayName = 'Form';
Form.FormVirtualGroup = _FormVirtualGroup["default"];
Form.propTypes = (0, _objectSpread3["default"])({
/**
* 表单提交请求地址
*/
action: _propTypes["default"].string,
/**
* 表单提交的HTTP Method
* 可选值：POST | GET
* @default POST
*/
method: _propTypes["default"].string,
/**
* 表单提交的目标
* 当表单设置了设置target且没有dataSet时作浏览器默认提交，否则作Ajax提交
*/
target: _propTypes["default"].string,
/**
* Ajax提交时的参数回调
*/
processParams: _propTypes["default"].func,
/**
* 只读
*/
readOnly: _propTypes["default"].bool,
/**
* 内部控件的标签的宽度
*/
labelWidth: _propTypes["default"].oneOfType([labelWidthPropTypes, _propTypes["default"].shape((_PropTypes$shape = {}, (0, _defineProperty2["default"])(_PropTypes$shape, _enum.ResponsiveKeys.xs, labelWidthPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape, _enum.ResponsiveKeys.sm, labelWidthPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape, _enum.ResponsiveKeys.md, labelWidthPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape, _enum.ResponsiveKeys.lg, labelWidthPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape, _enum.ResponsiveKeys.xl, labelWidthPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape, _enum.ResponsiveKeys.xxl, labelWidthPropTypes), _PropTypes$shape))]),
useColon: _propTypes["default"].bool,
excludeUseColonTagList: _propTypes["default"].array,
/**
* 标签文字对齐方式
* 可选值： 'left' | 'center' | 'right'
*/
labelAlign: _propTypes["default"].oneOfType([labelAlignPropTypes, _propTypes["default"].shape((_PropTypes$shape2 = {}, (0, _defineProperty2["default"])(_PropTypes$shape2, _enum.ResponsiveKeys.xs, labelAlignPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape2, _enum.ResponsiveKeys.sm, labelAlignPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape2, _enum.ResponsiveKeys.md, labelAlignPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape2, _enum.ResponsiveKeys.lg, labelAlignPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape2, _enum.ResponsiveKeys.xl, labelAlignPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape2, _enum.ResponsiveKeys.xxl, labelAlignPropTypes), _PropTypes$shape2))]),
/**
* 标签位置
* 可选值： 'horizontal' | 'vertical' | 'placeholder' | 'float' | 'none'
*/
labelLayout: _propTypes["default"].oneOfType([labelLayoutPropTypes, _propTypes["default"].shape((_PropTypes$shape3 = {}, (0, _defineProperty2["default"])(_PropTypes$shape3, _enum.ResponsiveKeys.xs, labelLayoutPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape3, _enum.ResponsiveKeys.sm, labelLayoutPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape3, _enum.ResponsiveKeys.md, labelLayoutPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape3, _enum.ResponsiveKeys.lg, labelLayoutPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape3, _enum.ResponsiveKeys.xl, labelLayoutPropTypes), (0, _defineProperty2["default"])(_PropTypes$shape3, _enum.ResponsiveKeys.xxl, labelLayoutPropTypes), _PropTypes$shape3))]),
/**
* 表单列数
*/
columns: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].shape((_PropTypes$shape4 = {}, (0, _defineProperty2["default"])(_PropTypes$shape4, _enum.ResponsiveKeys.xs, _propTypes["default"].number), (0, _defineProperty2["default"])(_PropTypes$shape4, _enum.ResponsiveKeys.sm, _propTypes["default"].number), (0, _defineProperty2["default"])(_PropTypes$shape4, _enum.ResponsiveKeys.md, _propTypes["default"].number), (0, _defineProperty2["default"])(_PropTypes$shape4, _enum.ResponsiveKeys.lg, _propTypes["default"].number), (0, _defineProperty2["default"])(_PropTypes$shape4, _enum.ResponsiveKeys.xl, _propTypes["default"].number), (0, _defineProperty2["default"])(_PropTypes$shape4, _enum.ResponsiveKeys.xxl, _propTypes["default"].number), _PropTypes$shape4))]),
pristine: _propTypes["default"].bool,
/**
* 表单头
*/
header: _propTypes["default"].string,
/**
* 提交回调
*/
onSubmit: _propTypes["default"].func,
/**
* 重置回调
*/
onReset: _propTypes["default"].func,
/**
* 提交成功回调
*/
onSuccess: _propTypes["default"].func,
/**
* 提交失败回调
*/
onError: _propTypes["default"].func,
separateSpacing: _propTypes["default"].object
}, _DataSetComponent2["default"].propTypes);
Form.defaultProps = {
suffixCls: 'form',
columns: _utils.defaultColumns,
labelWidth: _utils.defaultLabelWidth
};
Form.contextType = _FormContext["default"];
(0, _tslib.__decorate)([_mobx.observable], Form.prototype, "responsiveItems", void 0);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "axios", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "dataSet", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "record", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "dataIndex", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "useColon", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "excludeUseColonTagList", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "columns", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "labelWidth", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "labelAlign", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "labelLayout", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "pristine", null);
(0, _tslib.__decorate)([_mobx.computed], Form.prototype, "separateSpacing", null);
(0, _tslib.__decorate)([_autobind["default"]], Form.prototype, "handleDataSetValidate", null);
(0, _tslib.__decorate)([_autobind["default"], _mobx.action], Form.prototype, "handleResponsive", null);
(0, _tslib.__decorate)([_autobind["default"]], Form.prototype, "handleSubmit", null);
(0, _tslib.__decorate)([_autobind["default"]], Form.prototype, "handleReset", null);
Form = (0, _tslib.__decorate)([_mobxReact.observer], Form);
var _default = Form;
exports["default"] = _default;
//# sourceMappingURL=Form.js.map