@zat-design/sisyphus-react 3.12.1-beta.1 → 3.12.1-beta.3

package/es/ProForm/index.js

@@ -27,8 +27,9 @@ import { useFieldProps } from './utils/useFieldProps';
 import locale from '../locale';
 import useWatch from './utils/useWatch';
 import FormsProvider, { useContextForms, useForms } from '../FormsProvider';
+import { useStep } from '../ProStep';
 var ProForm = function ProForm(props, ref) {
-  var _localStorage, _ref2;
+  var _localStorage, _ref3;
   var _props$mode = props.mode,
     mode = _props$mode === void 0 ? 'search' : _props$mode,
     span = props.span,
@@ -78,11 +79,15 @@ var ProForm = function ProForm(props, ref) {
   var _ref = useProDrawerFormContext() || {},
     _ref$source = _ref.source,
     source = _ref$source === void 0 ? '' : _ref$source;
+  // stepSource: 用于区分是哪个组件调用，用于错误提示
+  var _ref2 = useStep() || {},
+    _ref2$source = _ref2.source,
+    stepSource = _ref2$source === void 0 ? '' : _ref2$source;
   var _useForm = useForm(originForm, {
       scrollToError: scrollToError,
       optimize: optimize,
       formKey: formKey,
-      source: source || 'ProForm'
+      source: source || stepSource || 'ProForm'
     }),
     _useForm2 = _slicedToArray(_useForm, 1),
     form = _useForm2[0];
@@ -220,7 +225,7 @@ var ProForm = function ProForm(props, ref) {
     className: cls,
     form: form
   }, formProps), omit(config, ['isDiffAll'])), otherProps), {}, {
-    labelAlign: (_ref2 = labelAlign !== null && labelAlign !== void 0 ? labelAlign : config.labelAlign) !== null && _ref2 !== void 0 ? _ref2 : 'left',
+    labelAlign: (_ref3 = labelAlign !== null && labelAlign !== void 0 ? labelAlign : config.labelAlign) !== null && _ref3 !== void 0 ? _ref3 : 'left',
     onValuesChange: handleValuesChange,
     onFinish: handleFinish,
     initialValues: _initialValues,

package/es/ProForm/utils/useForm.js

@@ -7,7 +7,7 @@ import _Form from "antd/es/form";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { useContext } from 'react';
 import { filterInternalFields } from './index';
-import { handleScrollToError } from '../../ProEditTable/utils/tools';
+import { handleScrollToError as handleScrollToErrorProEditTable } from '../../ProEditTable/utils/tools';
 import { FormsContext } from '../../FormsProvider';
 export var useForm = function useForm(originForm, options) {
   // 如果没有form实例可以直接把options放在第一个参数位置
@@ -121,7 +121,7 @@ export var useForm = function useForm(originForm, options) {
                 behavior: 'smooth'
               });
             }
-            handleScrollToError();
+            handleScrollToErrorProEditTable();
             throw _context.t0;
           case 23:
           case "end":

package/es/ProStep/components/Listener/index.js

@@ -8,35 +8,6 @@ import React from 'react';
 import { forceVisible } from 'react-lazyload';
 import { useStep } from '../../index';
 import { getLoadedMap } from '../../utils';
-/**
- * 检查错误列表并返回第一个错误项
- * @param arr DOM元素数组
- * @returns 错误元素信息
- */
-var checkErrorList = function checkErrorList(arr) {
-  for (var i = 0; i < arr.length; i++) {
-    if (arr[i].className.includes('errored')) {
-      return {
-        errorDom: arr[i],
-        index: i
-      };
-    }
-  }
-  return null;
-};
-/**
- * 查找第一个错误的DOM元素
- * @returns 错误元素信息
- */
-var findFirstErrorDom = function findFirstErrorDom() {
-  var errorList = document.querySelectorAll('.pro-step-com-menu-item');
-  var hasErrorItem = document.querySelectorAll('.pro-step-com-menu-item .errored');
-  var hasFormError = document.querySelector('.ant-form-item-explain-error');
-  if ((hasErrorItem === null || hasErrorItem === void 0 ? void 0 : hasErrorItem.length) && !hasFormError) {
-    return checkErrorList(errorList);
-  }
-  return null;
-};
 /**
  * 检查所有模块是否已加载完成
  * @param data 模块加载数据
@@ -83,11 +54,6 @@ var Listener = function Listener(_ref) {
             values = _context.sent;
             setTimeout(function () {
               var localData = localStorage.getItem('cache-pro-step');
-              var _ref3 = findFirstErrorDom() || {},
-                errorDom = _ref3.errorDom;
-              if (errorDom) {
-                errorDom.click();
-              }
               if (localData !== 'false') {
                 var _children$props, _children$props$onCli;
                 children === null || children === void 0 ? void 0 : (_children$props = children.props) === null || _children$props === void 0 ? void 0 : (_children$props$onCli = _children$props.onClick) === null || _children$props$onCli === void 0 ? void 0 : _children$props$onCli.call(_children$props, values);
@@ -99,7 +65,7 @@ var Listener = function Listener(_ref) {
             return _context.stop();
         }
       }, _callee);
-    })), 3000)
+    })), 1000)
   }));
 };
 export default Listener;

package/es/ProStep/index.js

@@ -9,7 +9,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { createContext, useCallback, useContext, useMemo, useRef, useState } from 'react';
 import { debounce } from 'lodash';
 import { useSetState, useLocalStorageState } from 'ahooks';
-import { handleScroll } from './utils';
+import { handleScroll, handleScrollError } from './utils';
 import Step from './components/Step';
 import Item from './components/Item';
 import Listener from './components/Listener';
@@ -37,11 +37,8 @@ var ProStep = function ProStep(_ref) {
     _useLocalStorageState2 = _slicedToArray(_useLocalStorageState, 2),
     setLocalData = _useLocalStorageState2[1];
   var ids = Object.keys(registerMap.current);
-  var targetOffset = resetProps.targetOffset,
-    _resetProps$collapse = resetProps.collapse,
+  var _resetProps$collapse = resetProps.collapse,
     collapse = _resetProps$collapse === void 0 ? false : _resetProps$collapse,
-    _resetProps$scrollToE = resetProps.scrollToError,
-    scrollToError = _resetProps$scrollToE === void 0 ? true : _resetProps$scrollToE,
     _resetProps$lazyLoad = resetProps.lazyLoad,
     lazyLoad = _resetProps$lazyLoad === void 0 ? false : _resetProps$lazyLoad;
   var dataSource = useMemo(function () {
@@ -147,22 +144,6 @@ var ProStep = function ProStep(_ref) {
       });
     }
   };
-  var handleScrollError = function handleScrollError(data) {
-    var errorModuleKeys = Object.keys(data).reverse();
-    if (errorModuleKeys === null || errorModuleKeys === void 0 ? void 0 : errorModuleKeys.length) {
-      var _dataSource$find;
-      var firstErrorModuleKey = (_dataSource$find = dataSource.find(function (item) {
-        var moduleKey = errorModuleKeys.find(function (child) {
-          return child === item.code;
-        });
-        return data[moduleKey];
-      })) === null || _dataSource$find === void 0 ? void 0 : _dataSource$find.code;
-      firstErrorModuleKey && handleScroll(firstErrorModuleKey, {
-        targetOffset: targetOffset,
-        scrollToError: scrollToError
-      });
-    }
-  };
   var notify = /*#__PURE__*/function () {
     var _ref6 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2(params) {
       var _ref7, excludes, triggerIds, events, res, nextErrorCollection;
@@ -193,7 +174,7 @@ var ProStep = function ProStep(_ref) {
             setState({
               errorCollection: nextErrorCollection
             });
-            handleScrollError(nextErrorCollection);
+            handleScrollError();
             return _context2.abrupt("return", res);
           case 12:
           case "end":
@@ -231,7 +212,7 @@ var ProStep = function ProStep(_ref) {
             setState({
               errorCollection: nextErrorCollection
             });
-            handleScrollError(nextErrorCollection);
+            handleScrollError();
             return _context3.abrupt("return", result);
           case 10:
           case "end":
@@ -252,7 +233,8 @@ var ProStep = function ProStep(_ref) {
       triggerTo: triggerTo,
       handleScroll: handleScroll,
       lazyLoad: lazyLoad,
-      unNotify: unNotify
+      unNotify: unNotify,
+      source: 'ProStep'
     },
     children: _jsxs("div", {
       className: "pro-step-wrapper",

package/es/ProStep/propsType.d.ts

@@ -104,6 +104,8 @@ export interface ProStepContextType {
     lazyLoad?: boolean | any;
     /** 取消注册函数 */
     unNotify: (keys: string | string[]) => void;
+    /** 来源 */
+    source?: string;
 }
 /**
  * 注册参数类型
@@ -175,16 +177,6 @@ export interface ListenerProps {
     /** 允许其他任意属性 */
     [key: string]: any;
 }
-/**
- * 错误结果类型
- * @interface ErrorResult
- */
-export interface ErrorResult {
-    /** 错误DOM元素 */
-    errorDom: HTMLElement | null;
-    /** 索引 */
-    index: number;
-}
 /**
  * 锚点SVG属性类型
  * @interface AnchorSvgProps

package/es/ProStep/utils/index.d.ts

@@ -1,7 +1,11 @@
 import React from 'react';
 import type { LoadedMapType } from '../propsType';
 /**
- * 处理滚动到指定元素位置
+ * 滚动到错误位置, 延迟200ms解决ProForm错误还未生成
+ */
+export declare const handleScrollError: (dom?: HTMLElement) => void;
+/**
+ * 处理滚动到指定元素位置, 如发现有错误, 则优先滚动到错误位置
  * @param id 目标元素的ID
  * @param options 滚动选项
  */

package/es/ProStep/utils/index.js

@@ -1,7 +1,21 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { debounce, pick } from 'lodash';
 /**
- * 处理滚动到指定元素位置
+ * 滚动到错误位置, 延迟200ms解决ProForm错误还未生成
+ */
+export var handleScrollError = function handleScrollError(dom) {
+  setTimeout(function () {
+    var errorDom = dom || document.querySelector('[class*="form-item-has-error"]');
+    if (errorDom) {
+      errorDom.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center'
+      });
+    }
+  }, 200);
+};
+/**
+ * 处理滚动到指定元素位置, 如发现有错误, 则优先滚动到错误位置
  * @param id 目标元素的ID
  * @param options 滚动选项
  */
@@ -13,12 +27,20 @@ export var handleScroll = function handleScroll(id, options) {
   if (!scrollToError) return;
   var dom = document.querySelector("#".concat(id));
   if (dom) {
-    setTimeout(debounce(function () {
-      window.scrollTo({
-        top: dom.offsetTop - targetOffset,
-        behavior: 'smooth'
-      });
-    }, 100), 0);
+    // 查找指定id下的错误表单项
+    var errorDom = dom.querySelector('[class*="form-item-has-error"]');
+    if (errorDom && scrollToError) {
+      // 如果发现错误表单项，执行handleScrollError函数
+      handleScrollError(errorDom);
+    } else {
+      // 如果没有错误表单项，则滚动到指定元素位置
+      setTimeout(debounce(function () {
+        window.scrollTo({
+          top: dom.offsetTop - targetOffset,
+          behavior: 'smooth'
+        });
+      }, 100), 0);
+    }
   }
 };
 /**

package/lib/ProForm/index.js

@@ -27,9 +27,10 @@ var _useFieldProps = require("./utils/useFieldProps");
 var _locale = _interopRequireDefault(require("../locale"));
 var _useWatch = _interopRequireDefault(require("./utils/useWatch"));
 var _FormsProvider = _interopRequireWildcard(require("../FormsProvider"));
+var _ProStep = require("../ProStep");
 var _excluded = ["mode", "span", "disabled", "isView", "columns", "footer", "onOk", "okText", "onCancel", "confirmLoading", "cancelText", "form", "children", "rowProps", "className", "expand", "expandOpen", "expandOpenChange", "viewEmpty", "labelAlign", "labelWidth", "onValuesChange", "onFinish", "diffConfig", "submitOnEnter", "clearNotShow", "initialValues", "requiredOnView", "formId", "required", "formKey", "globalControl", "scrollToError", "optimize", "desensitizationKey"];
 var ProForm = function ProForm(props, ref) {
-  var _localStorage, _ref2;
+  var _localStorage, _ref3;
   var _props$mode = props.mode,
     mode = _props$mode === void 0 ? 'search' : _props$mode,
     span = props.span,
@@ -79,11 +80,15 @@ var ProForm = function ProForm(props, ref) {
   var _ref = (0, _ProDrawerForm.useProDrawerFormContext)() || {},
     _ref$source = _ref.source,
     source = _ref$source === void 0 ? '' : _ref$source;
+  // stepSource: 用于区分是哪个组件调用，用于错误提示
+  var _ref2 = (0, _ProStep.useStep)() || {},
+    _ref2$source = _ref2.source,
+    stepSource = _ref2$source === void 0 ? '' : _ref2$source;
   var _useForm = (0, _useForm3.useForm)(originForm, {
       scrollToError: scrollToError,
       optimize: optimize,
       formKey: formKey,
-      source: source || 'ProForm'
+      source: source || stepSource || 'ProForm'
     }),
     _useForm2 = (0, _slicedToArray2.default)(_useForm, 1),
     form = _useForm2[0];
@@ -221,7 +226,7 @@ var ProForm = function ProForm(props, ref) {
     className: cls,
     form: form
   }, formProps), (0, _lodash.omit)(config, ['isDiffAll'])), otherProps), {}, {
-    labelAlign: (_ref2 = labelAlign !== null && labelAlign !== void 0 ? labelAlign : config.labelAlign) !== null && _ref2 !== void 0 ? _ref2 : 'left',
+    labelAlign: (_ref3 = labelAlign !== null && labelAlign !== void 0 ? labelAlign : config.labelAlign) !== null && _ref3 !== void 0 ? _ref3 : 'left',
     onValuesChange: handleValuesChange,
     onFinish: handleFinish,
     initialValues: _initialValues,

package/lib/ProStep/components/Listener/index.js

@@ -15,35 +15,6 @@ var _reactLazyload = require("react-lazyload");
 var _index = require("../../index");
 var _utils = require("../../utils");
 var _excluded = ["children", "delayTime", "excludes"];
-/**
- * 检查错误列表并返回第一个错误项
- * @param arr DOM元素数组
- * @returns 错误元素信息
- */
-var checkErrorList = function checkErrorList(arr) {
-  for (var i = 0; i < arr.length; i++) {
-    if (arr[i].className.includes('errored')) {
-      return {
-        errorDom: arr[i],
-        index: i
-      };
-    }
-  }
-  return null;
-};
-/**
- * 查找第一个错误的DOM元素
- * @returns 错误元素信息
- */
-var findFirstErrorDom = function findFirstErrorDom() {
-  var errorList = document.querySelectorAll('.pro-step-com-menu-item');
-  var hasErrorItem = document.querySelectorAll('.pro-step-com-menu-item .errored');
-  var hasFormError = document.querySelector('.ant-form-item-explain-error');
-  if ((hasErrorItem === null || hasErrorItem === void 0 ? void 0 : hasErrorItem.length) && !hasFormError) {
-    return checkErrorList(errorList);
-  }
-  return null;
-};
 /**
  * 检查所有模块是否已加载完成
  * @param data 模块加载数据
@@ -90,11 +61,6 @@ var Listener = function Listener(_ref) {
             values = _context.sent;
             setTimeout(function () {
               var localData = localStorage.getItem('cache-pro-step');
-              var _ref3 = findFirstErrorDom() || {},
-                errorDom = _ref3.errorDom;
-              if (errorDom) {
-                errorDom.click();
-              }
               if (localData !== 'false') {
                 var _children$props, _children$props$onCli;
                 children === null || children === void 0 ? void 0 : (_children$props = children.props) === null || _children$props === void 0 ? void 0 : (_children$props$onCli = _children$props.onClick) === null || _children$props$onCli === void 0 ? void 0 : _children$props$onCli.call(_children$props, values);
@@ -106,7 +72,7 @@ var Listener = function Listener(_ref) {
             return _context.stop();
         }
       }, _callee);
-    })), 3000)
+    })), 1000)
   }));
 };
 var _default = exports.default = Listener;

package/lib/ProStep/index.js

@@ -44,11 +44,8 @@ var ProStep = function ProStep(_ref) {
     _useLocalStorageState2 = (0, _slicedToArray2.default)(_useLocalStorageState, 2),
     setLocalData = _useLocalStorageState2[1];
   var ids = Object.keys(registerMap.current);
-  var targetOffset = resetProps.targetOffset,
-    _resetProps$collapse = resetProps.collapse,
+  var _resetProps$collapse = resetProps.collapse,
     collapse = _resetProps$collapse === void 0 ? false : _resetProps$collapse,
-    _resetProps$scrollToE = resetProps.scrollToError,
-    scrollToError = _resetProps$scrollToE === void 0 ? true : _resetProps$scrollToE,
     _resetProps$lazyLoad = resetProps.lazyLoad,
     lazyLoad = _resetProps$lazyLoad === void 0 ? false : _resetProps$lazyLoad;
   var dataSource = (0, _react.useMemo)(function () {
@@ -154,22 +151,6 @@ var ProStep = function ProStep(_ref) {
       });
     }
   };
-  var handleScrollError = function handleScrollError(data) {
-    var errorModuleKeys = Object.keys(data).reverse();
-    if (errorModuleKeys === null || errorModuleKeys === void 0 ? void 0 : errorModuleKeys.length) {
-      var _dataSource$find;
-      var firstErrorModuleKey = (_dataSource$find = dataSource.find(function (item) {
-        var moduleKey = errorModuleKeys.find(function (child) {
-          return child === item.code;
-        });
-        return data[moduleKey];
-      })) === null || _dataSource$find === void 0 ? void 0 : _dataSource$find.code;
-      firstErrorModuleKey && (0, _utils.handleScroll)(firstErrorModuleKey, {
-        targetOffset: targetOffset,
-        scrollToError: scrollToError
-      });
-    }
-  };
   var notify = /*#__PURE__*/function () {
     var _ref6 = (0, _asyncToGenerator2.default)(/*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2(params) {
       var _ref7, excludes, triggerIds, events, res, nextErrorCollection;
@@ -200,7 +181,7 @@ var ProStep = function ProStep(_ref) {
             setState({
               errorCollection: nextErrorCollection
             });
-            handleScrollError(nextErrorCollection);
+            (0, _utils.handleScrollError)();
             return _context2.abrupt("return", res);
           case 12:
           case "end":
@@ -238,7 +219,7 @@ var ProStep = function ProStep(_ref) {
             setState({
               errorCollection: nextErrorCollection
             });
-            handleScrollError(nextErrorCollection);
+            (0, _utils.handleScrollError)();
             return _context3.abrupt("return", result);
           case 10:
           case "end":
@@ -259,7 +240,8 @@ var ProStep = function ProStep(_ref) {
       triggerTo: triggerTo,
       handleScroll: _utils.handleScroll,
       lazyLoad: lazyLoad,
-      unNotify: unNotify
+      unNotify: unNotify,
+      source: 'ProStep'
     },
     children: (0, _jsxRuntime.jsxs)("div", {
       className: "pro-step-wrapper",

package/lib/ProStep/propsType.d.ts

@@ -104,6 +104,8 @@ export interface ProStepContextType {
     lazyLoad?: boolean | any;
     /** 取消注册函数 */
     unNotify: (keys: string | string[]) => void;
+    /** 来源 */
+    source?: string;
 }
 /**
  * 注册参数类型
@@ -175,16 +177,6 @@ export interface ListenerProps {
     /** 允许其他任意属性 */
     [key: string]: any;
 }
-/**
- * 错误结果类型
- * @interface ErrorResult
- */
-export interface ErrorResult {
-    /** 错误DOM元素 */
-    errorDom: HTMLElement | null;
-    /** 索引 */
-    index: number;
-}
 /**
  * 锚点SVG属性类型
  * @interface AnchorSvgProps

package/lib/ProStep/utils/index.d.ts

@@ -1,7 +1,11 @@
 import React from 'react';
 import type { LoadedMapType } from '../propsType';
 /**
- * 处理滚动到指定元素位置
+ * 滚动到错误位置, 延迟200ms解决ProForm错误还未生成
+ */
+export declare const handleScrollError: (dom?: HTMLElement) => void;
+/**
+ * 处理滚动到指定元素位置, 如发现有错误, 则优先滚动到错误位置
  * @param id 目标元素的ID
  * @param options 滚动选项
  */

package/lib/ProStep/utils/index.js

@@ -4,11 +4,25 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.handleScroll = exports.getLoadedMap = exports.default = void 0;
+exports.handleScrollError = exports.handleScroll = exports.getLoadedMap = exports.default = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _lodash = require("lodash");
 /**
- * 处理滚动到指定元素位置
+ * 滚动到错误位置, 延迟200ms解决ProForm错误还未生成
+ */
+var handleScrollError = exports.handleScrollError = function handleScrollError(dom) {
+  setTimeout(function () {
+    var errorDom = dom || document.querySelector('[class*="form-item-has-error"]');
+    if (errorDom) {
+      errorDom.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center'
+      });
+    }
+  }, 200);
+};
+/**
+ * 处理滚动到指定元素位置, 如发现有错误, 则优先滚动到错误位置
  * @param id 目标元素的ID
  * @param options 滚动选项
  */
@@ -20,12 +34,20 @@ var handleScroll = exports.handleScroll = function handleScroll(id, options) {
   if (!scrollToError) return;
   var dom = document.querySelector("#".concat(id));
   if (dom) {
-    setTimeout((0, _lodash.debounce)(function () {
-      window.scrollTo({
-        top: dom.offsetTop - targetOffset,
-        behavior: 'smooth'
-      });
-    }, 100), 0);
+    // 查找指定id下的错误表单项
+    var errorDom = dom.querySelector('[class*="form-item-has-error"]');
+    if (errorDom && scrollToError) {
+      // 如果发现错误表单项，执行handleScrollError函数
+      handleScrollError(errorDom);
+    } else {
+      // 如果没有错误表单项，则滚动到指定元素位置
+      setTimeout((0, _lodash.debounce)(function () {
+        window.scrollTo({
+          top: dom.offsetTop - targetOffset,
+          behavior: 'smooth'
+        });
+      }, 100), 0);
+    }
   }
 };
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "3.12.1-beta.1",
+  "version": "3.12.1-beta.3",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",