react-admin-kit
Version:
A react based UI components for admin system
169 lines (164 loc) • 8.35 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.ReadonlyTypeContext = exports.ReadonlyContext = exports.LayoutContext = exports.InnerRefContext = exports.EmbedColumnContext = exports.DescriptionsPropsContext = void 0;
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _proForm = require("@ant-design/pro-form");
var _antd = require("antd");
var _react = require("react");
var _utils = require("../SchemaForm/utils");
var _context2 = require("../context");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["onFinish", "formRef", "initialValues", "children", "innerRef", "submitter", "readonlyType", "descriptionsProps"];
var InnerRefContext = exports.InnerRefContext = /*#__PURE__*/(0, _react.createContext)(undefined);
var LayoutContext = exports.LayoutContext = /*#__PURE__*/(0, _react.createContext)('vertical');
var ReadonlyContext = exports.ReadonlyContext = /*#__PURE__*/(0, _react.createContext)(false);
var ReadonlyTypeContext = exports.ReadonlyTypeContext = /*#__PURE__*/(0, _react.createContext)('form');
var DescriptionsPropsContext = exports.DescriptionsPropsContext = /*#__PURE__*/(0, _react.createContext)({});
var EmbedColumnContext = exports.EmbedColumnContext = /*#__PURE__*/(0, _react.createContext)({});
var ProForm = function ProForm(props) {
var onFinish = props.onFinish,
propsFormRef = props.formRef,
initialValues = props.initialValues,
children = props.children,
propsInnerRef = props.innerRef,
_props$submitter = props.submitter,
submitter = _props$submitter === void 0 ? false : _props$submitter,
_props$readonlyType = props.readonlyType,
readonlyType = _props$readonlyType === void 0 ? 'form' : _props$readonlyType,
_props$descriptionsPr = props.descriptionsProps,
descriptionsProps = _props$descriptionsPr === void 0 ? {} : _props$descriptionsPr,
rest = (0, _objectWithoutProperties2.default)(props, _excluded);
// 当 innerRef 不传时提供一个内部默认值, 保证 innerRef 不为空
var innerRef = (0, _react.useRef)((0, _context2.CreateBaseInner)());
/**
* 给 innerRef 增加方法
*/
(0, _react.useImperativeHandle)(propsInnerRef, function () {
return innerRef.current;
}, []);
var handleOnFinish = /*#__PURE__*/function () {
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee(values) {
return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
if (!onFinish) {
_context.next = 4;
break;
}
_context.next = 3;
return onFinish((0, _utils.splitValues)(values));
case 3:
return _context.abrupt("return", _context.sent);
case 4:
case "end":
return _context.stop();
}
}, _callee);
}));
return function handleOnFinish(_x) {
return _ref.apply(this, arguments);
};
}();
var selfFormRef = (0, _react.useRef)();
var initialValuesRef = (0, _react.useRef)(initialValues);
var embedColumnsRef = (0, _react.useRef)([]);
var getDataIndexes = function getDataIndexes(values) {
return embedColumnsRef.current.reduce(function (prev, item) {
return prev.concat((0, _utils.collectDataIndex)(item.columns, values, item.baseName));
}, []);
};
var wrapForm = function wrapForm(form) {
var setFieldsValue = form.setFieldsValue;
form.from = 'proform';
form.setFieldsValue = function (values) {
var _innerRef$current;
var $values = (0, _utils.transformValuesForConvention)(values, getDataIndexes(values));
setFieldsValue($values);
/** 将赋值的值额外存在 innerRef 里, 在 render 函数(只读模式), 表单提交等场景里可用 */
(_innerRef$current = innerRef.current) === null || _innerRef$current === void 0 || _innerRef$current.setData($values || {});
};
return form;
};
var _Form$useForm = _antd.Form.useForm(),
_Form$useForm2 = (0, _slicedToArray2.default)(_Form$useForm, 1),
form = _Form$useForm2[0];
var formInstance = _antd.Form.useFormInstance();
var formInstanceRef = (0, _react.useRef)(wrapForm(props.form || formInstance || form));
(0, _react.useEffect)(function () {
if (formInstanceRef.current) {
var _formInstanceRef$curr2;
// @ts-ignore
var _formInstanceRef$curr = formInstanceRef.current.getInternalHooks('RC_FORM_INTERNAL_HOOKS'),
setInitialValues = _formInstanceRef$curr.setInitialValues;
var $values = (0, _utils.transformValuesForConvention)(initialValues, getDataIndexes(initialValues));
(_formInstanceRef$curr2 = formInstanceRef.current) === null || _formInstanceRef$curr2 === void 0 || _formInstanceRef$curr2.setFieldsValue($values);
setInitialValues($values);
}
}, []);
/* 包装 form 实例的取值相关的方法, 需要约定式转化
* getFieldsValue, validateFields, getFieldsFormatValue, validateFieldsReturnFormatValue
*/
(0, _react.useImperativeHandle)(propsFormRef, function () {
if (selfFormRef.current) {
var _selfFormRef$current = selfFormRef.current,
_getFieldsValue = _selfFormRef$current.getFieldsValue,
_validateFields = _selfFormRef$current.validateFields,
getFieldsFormatValue = _selfFormRef$current.getFieldsFormatValue,
validateFieldsReturnFormatValue = _selfFormRef$current.validateFieldsReturnFormatValue;
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, selfFormRef.current), {}, {
getFieldsValue: function getFieldsValue() {
// @ts-ignore
return (0, _utils.splitValues)(_getFieldsValue.apply(void 0, arguments));
},
getFieldsFormatValue: getFieldsFormatValue ? function (namePath, filter) {
return (0, _utils.splitValues)(getFieldsFormatValue(namePath, filter));
} : undefined,
validateFields: function validateFields() {
return _validateFields.apply(void 0, arguments).then(function (res) {
return (0, _utils.splitValues)(res);
});
},
validateFieldsReturnFormatValue: validateFieldsReturnFormatValue ? function (namePath) {
return validateFieldsReturnFormatValue(namePath).then(function (res) {
return (0, _utils.splitValues)(res);
});
} : undefined
});
}
}, [selfFormRef.current]);
return /*#__PURE__*/(0, _jsxRuntime.jsx)(InnerRefContext.Provider, {
value: innerRef,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(LayoutContext.Provider, {
value: props.layout,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ReadonlyContext.Provider, {
value: props.readonly || false,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ReadonlyTypeContext.Provider, {
value: readonlyType,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(DescriptionsPropsContext.Provider, {
value: descriptionsProps,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(EmbedColumnContext.Provider, {
value: embedColumnsRef,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_proForm.ProForm, (0, _objectSpread2.default)((0, _objectSpread2.default)({
onFinish: handleOnFinish,
initialValues: initialValuesRef.current,
formRef: selfFormRef,
submitter: submitter === true ? {} : submitter
}, rest), {}, {
form: formInstanceRef.current,
children: children
}))
})
})
})
})
})
});
};
var _default = exports.default = ProForm;