@zat-design/sisyphus-react 4.3.3-beta.1 → 4.3.3

package/es/ProEnum/hooks/useEnumRequest.js

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useEffect, useMemo, useRef } from 'react';
 import { useDeepCompareEffect, useRequest as useRequestFunc } from 'ahooks';
 import { diffCode, getEnumData, setEnumData, removeEnumData, cacheFieldNames, baseCacheKey, baseStorage } from "../utils";
 import locale from "../../locale";
@@ -29,13 +29,58 @@ const useEnumRequest = (props, dispatch) => {
       console.warn('proEnum：', msg);
     }
   };
-  const enumRes = useRequestFunc(useRequest?.service, {
+
+  // IndexedDB 缓存策略：包装 service，在 service 层面返回缓存数据，
+  // 而非跳过 run()。这样 enumRes.data/loading 正常变更，
+  // ProConfigProvider 的 onSuccess 回调能正常触发（修复白屏问题）。
+  const fromCacheRef = useRef(null);
+  const originalService = useRequest?.service;
+  const serviceForRequest = useMemo(() => {
+    if (!originalService || storage !== 'indexedDB') {
+      return originalService;
+    }
+    return async (...args) => {
+      if (!requestRefresh) {
+        const cached = await Promise.resolve(getEnumData(storage, cacheKey));
+        if (cached?.data && Object.keys(cached.data).length > 0 && cached?.time && Date.now() - cached.time <= 6e4 * 60) {
+          fromCacheRef.current = cached.data;
+          return {
+            status: 200,
+            data: cached.data
+          };
+        }
+      }
+      fromCacheRef.current = null;
+      return originalService(...args);
+    };
+  }, [originalService, storage, requestRefresh, cacheKey]);
+  const enumRes = useRequestFunc(serviceForRequest, {
     manual: true,
     cacheKey,
     cacheTime: -1,
     staleTime: 6e4 * 60,
     ...useRequest?.options,
     setCache: async res => {
+      // 缓存命中时跳过 transformResponse 和重复处理，直接 dispatch
+      if (fromCacheRef.current) {
+        const cachedData = fromCacheRef.current;
+        dispatch({
+          type: 'setProEnumDic',
+          payload: {
+            ...dics,
+            ...dataSource,
+            ...cachedData
+          }
+        });
+        if (main) {
+          setTimeout(() => {
+            window?.eventCenter?.publish('pro-enum-event', cachedData);
+            logDebug(locale?.ProEnum?.mainInitByCache);
+          }, 10000);
+        }
+        fromCacheRef.current = null;
+        return res;
+      }
       let response = res.data;
       if (transformResponse && typeof transformResponse === 'function') {
         response = await transformResponse(res.data);
@@ -97,40 +142,18 @@ const useEnumRequest = (props, dispatch) => {
       });
       if (main) {
         setTimeout(() => {
-          window?.eventCenter?.publish('zat-design-pro-component-event', res.data);
+          window?.eventCenter?.publish('pro-enum-event', res.data);
           logDebug(locale?.ProEnum?.mainInitByRequest);
         }, 10000);
       }
       return res;
     },
-    getCache: () => {
-      // 支持异步读取
-      const cachePromise = Promise.resolve(getEnumData(storage, cacheKey) || {
-        data: {}
-      });
-
-      // 对于同步存储，直接返回；对于异步存储，返回 Promise
+    getCache: params => {
       if (storage === 'indexedDB') {
-        return cachePromise.then(res => {
-          dispatch({
-            type: 'setProEnumDic',
-            payload: {
-              ...dics,
-              ...dataSource,
-              ...res?.data
-            }
-          });
-          if (main) {
-            setTimeout(() => {
-              window?.eventCenter?.publish('zat-design-pro-component-event', res.data);
-              logDebug(locale?.ProEnum?.mainInitByCache);
-            }, 10000);
-          }
-          return res;
-        });
+        return undefined;
       }
 
-      // 同步存储的处理
+      // 同步存储的处理（原始逻辑）
       const res = getEnumData(storage, cacheKey) || {
         data: {}
       };
@@ -144,7 +167,7 @@ const useEnumRequest = (props, dispatch) => {
       });
       if (main) {
         setTimeout(() => {
-          window?.eventCenter?.publish('zat-design-pro-component-event', res.data);
+          window?.eventCenter?.publish('pro-enum-event', res.data);
           logDebug(locale?.ProEnum?.mainInitByCache);
         }, 10000);
       }
@@ -210,7 +233,7 @@ const useEnumRequest = (props, dispatch) => {
               ...cacheData.data
             }
           });
-        } else if (dataSource && Object.keys(dataSource)) {
+        } else if (dataSource && Object.keys(dataSource).length > 0) {
           // 子系统也可能会有 dataSource
           dispatch({
             type: 'setProEnumDic',
@@ -233,16 +256,13 @@ const useEnumRequest = (props, dispatch) => {
         if (requestRefresh) {
           window.localStorage.removeItem(cacheKey);
           window.sessionStorage.removeItem(cacheKey);
-          // 清除 IndexedDB
           if (storage === 'indexedDB') {
             await removeEnumData('indexedDB', cacheKey);
           }
         }
         enumRes.run(params);
-
-        // TODO 这段代码目前看起来是没啥用的、没起到作用
         mergeData();
-      } else if (Object.keys(dataSource)) {
+      } else if (dataSource && Object.keys(dataSource).length > 0) {
         const res = await Promise.resolve(getEnumData(storage, cacheKey) || {
           data: {}
         });
@@ -283,15 +303,15 @@ const useEnumRequest = (props, dispatch) => {
   };
   useEffect(() => {
     if (main) {
-      window?.eventCenter?.publish('zat-design-pro-component-event', {});
+      window?.eventCenter?.publish('pro-enum-event', {});
       logDebug(locale?.ProEnum?.mainInitOnce);
     }
     if (!main && share) {
-      window?.eventCenter?.subscribe('zat-design-pro-component-event', shareProEnumDic);
+      window?.eventCenter?.subscribe('pro-enum-event', shareProEnumDic);
       logDebug(locale?.ProEnum?.sonInitEvent);
     }
     return () => {
-      window?.eventCenter?.unsubscribe('zat-design-pro-component-event', shareProEnumDic);
+      window?.eventCenter?.unsubscribe('pro-enum-event', shareProEnumDic);
     };
   }, []);
   return enumRes;

package/es/ProForm/components/combination/Group/utils/index.d.ts

@@ -75,33 +75,35 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
     confirm?: boolean | import("antd").ModalFuncProps | import("../../../render/propsType").FunctionArgs<any, boolean | import("antd").ModalFuncProps>;
     show?: boolean | ReactiveFunction<any, boolean>;
     component?: React.ReactNode | ReactiveFunction<any, React.ReactNode>;
-    className?: string;
-    style?: React.CSSProperties;
+    onReset?: () => void;
     trim?: boolean;
     normalize?: (value: any, prevValue: any, allValues: import("@rc-component/form/lib/interface").Store) => any;
     children?: React.ReactNode | ((form: FormInstance<any>) => React.ReactNode);
+    className?: string;
+    status?: "" | "warning" | "error" | "success" | "validating";
     hidden?: boolean;
     id?: string;
-    onReset?: () => void;
-    prefixCls?: string;
-    rootClassName?: string;
-    vertical?: boolean;
+    style?: React.CSSProperties;
     htmlFor?: string;
-    layout?: import("antd/es/form/Form").FormItemLayout;
-    help?: React.ReactNode;
-    preserve?: boolean;
+    prefixCls?: string;
     trigger?: string;
     isView?: boolean;
-    status?: "" | "warning" | "error" | "success" | "validating";
+    rootClassName?: string;
+    getValueProps?: ((value: any) => Record<string, unknown>) & ((value: any) => Record<string, unknown>);
+    vertical?: boolean;
+    desensitization?: [number, number] | ReactiveFunction<any, [number, number]>;
     validateTrigger?: string | false | string[];
-    colon?: boolean;
+    preserve?: boolean;
+    clearNotShow?: boolean;
     labelAlign?: import("antd/es/form/interface").FormLabelAlign;
+    colon?: boolean;
+    layout?: import("antd/es/form/Form").FormItemLayout;
     labelCol?: import("antd").ColProps;
+    wrapperCol?: import("antd").ColProps;
     getValueFromEvent?: (...args: import("@rc-component/form/lib/interface").EventArgs) => any;
     shouldUpdate?: import("@rc-component/form/lib/Field").ShouldUpdate<any>;
     validateDebounce?: number;
     valuePropName?: string;
-    getValueProps?: ((value: any) => Record<string, unknown>) & ((value: any) => Record<string, unknown>);
     messageVariables?: Record<string, string>;
     initialValue?: any;
     onMetaChange?: (meta: import("@rc-component/form/lib/Field").MetaEvent) => void;
@@ -112,7 +114,7 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
         icons: import("antd/es/form/FormItem").FeedbackIcons;
     };
     validateStatus?: "" | "warning" | "error" | "success" | "validating";
-    wrapperCol?: import("antd").ColProps;
+    help?: React.ReactNode;
     fieldId?: string;
     valueType?: import("../../../render/propsType").ProFormValueType;
     switchValue?: [any, any];
@@ -125,8 +127,6 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
     upperCase?: boolean;
     toISOString?: boolean;
     toCSTString?: boolean;
-    clearNotShow?: boolean;
-    desensitization?: [number, number] | ReactiveFunction<any, [number, number]>;
     name: any;
     dependencies: any[];
     tooltip: string | {
@@ -141,7 +141,7 @@ export declare const useFormItemProps: (column: FlexibleGroupColumnType, context
  * 创建组件属性
  */
 export declare const createComponentProps: (column: FlexibleGroupColumnType, formItemProps: any) => {
-    componentProps: import("lodash").Omit<any, "format" | "valueType" | "switchValue" | "dependNames" | "toISOString" | "toCSTString" | "clearNotShow" | "precision">;
+    componentProps: import("lodash").Omit<any, "format" | "clearNotShow" | "valueType" | "switchValue" | "dependNames" | "toISOString" | "toCSTString" | "precision">;
     formItemTransform: {
         getValueProps: any;
         normalize: any;

package/es/ProForm/index.js

@@ -227,6 +227,16 @@ const ProForm = (props, ref) => {
     labelAlign: labelAlign ?? config.labelAlign ?? 'left',
     onValuesChange: handleValuesChange,
     onFinish: handleFinish,
+    onFinishFailed: ({
+      errorFields
+    }) => {
+      if (scrollToError && errorFields?.length) {
+        form.scrollToField(errorFields[0]?.name, {
+          block: 'center',
+          behavior: 'smooth'
+        });
+      }
+    },
     initialValues: _initialValues,
     children: [/*#__PURE__*/_jsxs(Row, {
       gutter: 24,

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

@@ -25,7 +25,8 @@ const ProStepItem = ({
   const {
     register,
     collapse,
-    lazyLoad: globalLazyLoad
+    lazyLoad: globalLazyLoad,
+    targetOffset
   } = useStep();
   const lazyLoad = stepLazyLoad ?? globalLazyLoad;
   useEffect(() => {
@@ -60,6 +61,9 @@ const ProStepItem = ({
     return /*#__PURE__*/_jsx("div", {
       className: "pro-step-item",
       id: id,
+      style: {
+        scrollMarginTop: targetOffset ? `${targetOffset}px` : undefined
+      },
       children: /*#__PURE__*/_jsx(ProCollapse, {
         title: title,
         icon: true,
@@ -83,6 +87,9 @@ const ProStepItem = ({
   return /*#__PURE__*/_jsx("div", {
     className: "pro-step-item",
     id: id,
+    style: {
+      scrollMarginTop: targetOffset ? `${targetOffset}px` : undefined
+    },
     children: renderChildren()
   });
 };

package/es/ProStep/index.js

@@ -27,7 +27,8 @@ const ProStep = ({
   const ids = Object.keys(registerMap.current);
   const {
     collapse = false,
-    lazyLoad = false
+    lazyLoad = false,
+    targetOffset
   } = resetProps;
   const dataSource = useMemo(() => {
     if (resetProps?.dataSource) {
@@ -150,6 +151,7 @@ const ProStep = ({
       triggerTo,
       handleScroll,
       lazyLoad,
+      targetOffset,
       unNotify,
       source: 'ProStep'
     },

package/es/ProStep/propsType.d.ts

@@ -102,6 +102,8 @@ export interface ProStepContextType {
     handleScroll: (id: string, options?: ScrollOptions) => void;
     /** 懒加载配置 */
     lazyLoad?: boolean | any;
+    /** 滚动偏移量 */
+    targetOffset?: number;
     /** 取消注册函数 */
     unNotify: (keys: string | string[]) => void;
     /** 来源 */

package/es/ProStep/utils/index.js

@@ -1,5 +1,6 @@
 import _pick from "lodash/pick";
 import _debounce from "lodash/debounce";
+import scrollIntoView from 'scroll-into-view-if-needed';
 /**
  * 滚动到错误位置, 延迟200ms解决ProForm错误还未生成
  */
@@ -7,9 +8,10 @@ export const handleScrollError = dom => {
   setTimeout(() => {
     const errorDom = dom || document.querySelector('[class*="form-item-has-error"]');
     if (errorDom) {
-      errorDom.scrollIntoView({
+      scrollIntoView(errorDom, {
         behavior: 'smooth',
-        block: 'center'
+        block: 'center',
+        scrollMode: 'if-needed'
       });
     }
   }, 200);
@@ -25,7 +27,6 @@ export const handleScroll = (id, options) => {
     targetOffset = 0,
     scrollToError
   } = options || {};
-  if (!scrollToError) return;
   const dom = document.querySelector(`#${id}`);
   if (dom) {
     // 查找指定id下的错误表单项
@@ -36,10 +37,10 @@ export const handleScroll = (id, options) => {
     } else {
       // 如果没有错误表单项，则滚动到指定元素位置
       setTimeout(_debounce(() => {
-        const rect = dom.getBoundingClientRect();
-        window.scrollTo({
-          top: window.scrollY + rect.top - targetOffset,
-          behavior: 'smooth'
+        scrollIntoView(dom, {
+          behavior: 'smooth',
+          block: 'start',
+          scrollMode: 'if-needed'
         });
       }, 100), 0);
     }

package/es/ProThemeTools/component/ProTools/index.js

@@ -135,6 +135,9 @@ const ProTools = ({
     }, {
       color: '#A00F20',
       active: false
+    }, {
+      color: '#31AF96',
+      active: false
     }]);
     onReset();
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "4.3.3-beta.1",
+  "version": "4.3.3",
   "license": "MIT",
   "files": [
     "es",