@uiw-admin/components/esm/ProForm/formdom.js

业务组件集合

import _extends from "@babel/runtime/helpers/extends";
import React, { useRef, useEffect } from 'react';
import { Form, Button, Col, Row } from 'uiw';
import { useStore, useColPropsContext } from './hooks/store';
import { fromValidate } from './utils';
import './style/form-item.css';
import { createElement as _createElement } from "react";
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
function FormDom(_ref) {
  var {
    formDatas = [],
    formfields,
    formType,
    onSubmit: _onSubmit,
    onChange: _onChange,
    onSubmitError: _onSubmitError,
    buttonsContainer,
    showSaveButton = false,
    showResetButton = false,
    saveButtonProps = {},
    resetButtonProps = {},
    formInstanceRef,
    className,
    style
  } = _ref;
  var baseRef = useRef(null);
  var store = useStore();
  var colProps = useColPropsContext();
  var {
    setFormState
  } = store;

  // 通过store获取表单实例
  useEffect(() => setFormState == null ? void 0 : setFormState(baseRef), [baseRef]);

  // 通过ref获取表单实例
  useEffect(() => {
    if (baseRef && baseRef.current) {
      formInstanceRef.current = baseRef;
    }
  }, [baseRef]);
  var styles = _extends({
    paddingBottom: 10
  }, style);
  if (formType !== 'pure') {
    styles.background = '#fff';
  }
  return /*#__PURE__*/_jsx(Form, {
    className: className,
    ref: baseRef,
    style: styles,
    resetOnSubmit: false,
    onSubmit: _ref2 => {
      var {
        initial,
        current
      } = _ref2;
      // 如果传入了onSubmit走onSubmit,否则主动验证
      var filterFormDatas = formDatas.filter(item => item.hide !== true);
      var validateList = filterFormDatas.map(item => ({
        key: item.key,
        value: current[item.key],
        rules: item.rules,
        required: item.required
      })) || [];
      var errorObj = fromValidate(validateList);
      if (Object.keys(errorObj).length > 0) {
        var err = new Error();
        err.filed = errorObj;
        throw err;
      }
      _onSubmit == null ? void 0 : _onSubmit(initial, current);
    },
    onChange: _ref3 => {
      var {
        initial,
        current
      } = _ref3;
      return _onChange == null ? void 0 : _onChange(initial, current);
    },
    onSubmitError: error => {
      if (_onSubmitError) {
        _onSubmitError == null ? void 0 : _onSubmitError(error);
      } else {
        return error.filed ? _extends({}, error.filed) : null;
      }
    },
    fields: formfields,
    children: _ref4 => {
      var {
        fields = {},
        state,
        canSubmit = () => false,
        resetForm
      } = _ref4;
      return /*#__PURE__*/_jsxs(React.Fragment, {
        children: [/*#__PURE__*/_jsx(Row, {
          gutter: 10,
          children: Object.keys(fields).map(key => {
            var _fields$key, _fields$key$props, _fields$key2, _fields$key2$props;
            var colSpan = ((_fields$key = fields[key]) == null ? void 0 : (_fields$key$props = _fields$key.props) == null ? void 0 : _fields$key$props.span) || colProps && colProps.span || '8';
            var colstyle = ((_fields$key2 = fields[key]) == null ? void 0 : (_fields$key2$props = _fields$key2.props) == null ? void 0 : _fields$key2$props.colstyle) || {};
            return /*#__PURE__*/_createElement(Col, _extends({}, colProps, {
              style: _extends({}, colProps && colProps.style || {}, colstyle),
              key: key,
              span: colSpan
            }), fields[key]);
          })
        }), /*#__PURE__*/_jsxs("div", {
          className: "w-form-item-center",
          style: _extends({}, buttonsContainer),
          children: [/*#__PURE__*/_jsx(Button, _extends({
            className: "uiw-admin-proform-btn",
            style: {
              display: showSaveButton ? 'flex' : 'none'
            },
            disabled: !canSubmit(),
            type: "primary",
            htmlType: "submit"
          }, saveButtonProps, {
            children: saveButtonProps.label || '提交'
          })), /*#__PURE__*/_jsx(Button, _extends({
            className: "uiw-admin-proform-btn",
            style: {
              display: showResetButton ? 'flex' : 'none'
            },
            onClick: resetForm
          }, resetButtonProps, {
            children: resetButtonProps.label || '重置'
          }))]
        })]
      });
    }
  });
}
export default FormDom;