@lingxiteam/ebe-utils 0.2.3 → 0.2.5

package/lib/h5public/src/components/factory/src/DynamicDataContainer/index.tsx

@@ -1,324 +1,265 @@
 import Form, { type FormInstance } from '@lingxiteam/dform';
-import {
-  DynamicDataFieldItem,
-  DynamicDataType,
-  LingxiForwardRef,
-} from '@lingxiteam/types';
+import { DynamicDataFieldItem, DynamicDataType, LingxiForwardRef } from '@lingxiteam/types';
 import { SpinLoading } from 'antd-mobile-5';
-import {
-  CSSProperties,
-  useEffect,
-  useImperativeHandle,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
-import {
-  DynamicDataContext,
-  DynamicDataProvider,
-} from '../utils/dynamicUtils/DynamicContext';
+import { CSSProperties, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import { DynamicDataContext, DynamicDataProvider } from '../utils/dynamicUtils/DynamicContext';
 import './index.less';
 import { useDynamicDataContainer } from './useDynamicDataContainer';
 
-type RuleParameter = {
+type RuleParamsItem = {
   paramId: string;
-  valueCode?: string;
+  valueCode?: string | string[];
   originValueCode?: string;
   paramCode?: string;
 };
 export interface DynamicDataContainerProps {
   className: string;
   style: CSSProperties;
-  engineRule?: Array<Array<RuleParameter>>;
+  engineRule?: Array<{
+    conditionId: string;
+    rules?: RuleParamsItem[];
+  }>;
   name: string;
-  onValuesChange?: (
-    formCode: string,
-    changedFieldName: string,
-    changedFieldValue: any,
-    allValues: Record<string, Record<string, any>>,
-  ) => void;
+  onValuesChange?: (formCode: string, changedFieldName: string, changedFieldValue: any, allValues: Record<string, Record<string, any>>) => void;
   dynamicCode: string;
   visible?: boolean;
-  scene?: 'edit' | 'readonly';
+  readOnly?: boolean;
   boxSpace?: string;
 }
 
-const DynamicDataContainer = LingxiForwardRef<any, DynamicDataContainerProps>(
-  (props, ref) => {
-    const {
-      className,
-      getEngineApis,
-      style = {},
-      engineRule,
-      $$componentItem,
-      name,
-      onValuesChange,
-      dynamicCode,
-      boxSpace,
-    } = props || {};
-    const engineApis = getEngineApis?.() || {};
-    const [loading, setLoading] = useState<boolean>(false);
-    const { service, dynamicDataUtils, renderDynamicPage } = engineApis;
-    const { dynamicData2DSL, diffChange } = dynamicDataUtils || {};
-    const dynamicHelperRef = useRef<ReturnType<typeof dynamicData2DSL>>();
-    const [pageData, setPageData] = useState<any>();
-    const formsRef = useRef<
-      Record<
-        string,
-        {
-          form: FormInstance<any>;
-          validateFormAndScroll?: () => Promise<any>;
-          getFieldsValue?: FormInstance['getFieldsValue'];
-          setFieldsValue?: (values: any, refs: Record<string, any>) => void;
-          resetFields?: FormInstance['resetFields'];
-          setDisabled?: (v: boolean) => void;
-          setReadOnly?: (v: boolean) => void;
-        }
-      >
-    >({});
+const DynamicDataContainer = LingxiForwardRef<any, DynamicDataContainerProps>((props, ref) => {
+  const { className, getEngineApis, style = {}, engineRule, $$componentItem, name, onValuesChange, dynamicCode, boxSpace, readOnly } = props || {};
+  const engineApis = getEngineApis?.() || {};
+  const [loading, setLoading] = useState<boolean>(false);
+  const { service, dynamicDataUtils, renderDynamicPage } = engineApis;
+  const { dynamicData2DSL, diffChange, combineRules } = dynamicDataUtils || {};
+  const dynamicHelperRef = useRef<ReturnType<typeof dynamicData2DSL>>();
+  const [pageData, setPageData] = useState<any>();
+  const formsRef = useRef<
+    Record<
+      string,
+      {
+        form: FormInstance<any>;
+        validateFormAndScroll?:() => Promise<any>;
+        getFieldsValue?: FormInstance['getFieldsValue'];
+        setFieldsValue?: (values: any, refs: Record<string, any>) => void;
+        resetFields?: FormInstance['resetFields'];
+        setDisabled?: (v: boolean) => void;
+        setReadOnly?: (v: boolean) => void;
+          }
+          >
+          >({});
 
-    const {
-      dynamicPageRef,
-      staticAttrKeys,
-      yieldMethod,
-      readyComplete,
-      engineliftCycle,
-    } = useDynamicDataContainer({
-      dynamicHelper: dynamicHelperRef.current,
-    });
+  const { dynamicPageRef, staticAttrKeys, yieldMethod, readyComplete, engineliftCycle } = useDynamicDataContainer({
+    dynamicHelper: dynamicHelperRef.current,
+  });
 
-    const getDynamicData = async (
-      rules: DynamicDataContainerProps['engineRule'],
-    ) => {
-      try {
-        setLoading(true);
-        if (rules && rules?.length) {
-          const res = await service.batchMatchDynamicData({
-            terminalType: 'h5',
-            findDataDetail: true,
-            paramGroupList: rules,
-          });
-          if (res) {
-            if (res && typeof dynamicData2DSL === 'function') {
-              const dataHelper = dynamicData2DSL(
-                res as DynamicDataType[],
-                { uid: $$componentItem.uid, name },
-                (
-                  DSLCore,
-                  dynamicData: DynamicDataType | DynamicDataFieldItem,
-                ) => {
-                  if ('dataId' in dynamicData) {
-                    const node = DSLCore?.query?.(`Card_${dynamicData.dataId}`);
-                    if (node && boxSpace) {
-                      node?.setStyle?.({
-                        margin: `0 0 ${boxSpace} 0`,
-                      });
-                    }
+  const getDynamicData = async (rules: Array<Array<RuleParamsItem>>) => {
+    try {
+      setLoading(true);
+      if (rules && rules?.length) {
+        const res = await service.batchMatchDynamicData({
+          terminalType: 'h5',
+          findDataDetail: true,
+          paramGroupList: rules,
+        });
+        if (res) {
+          if (res && typeof dynamicData2DSL === 'function') {
+            const dataHelper = dynamicData2DSL(
+              res as DynamicDataType[],
+              { uid: $$componentItem.uid, name },
+              (DSLCore, dynamicData: DynamicDataType | DynamicDataFieldItem) => {
+                if ('dataId' in dynamicData) {
+                  const node = DSLCore?.query?.(`Card_${dynamicData.dataId}`);
+                  if (node && boxSpace) {
+                    node?.setStyle?.({
+                      margin: `0 0 ${boxSpace} 0`,
+                    });
                   }
-                },
-              );
-              setPageData(dataHelper.pageDSL);
-              dynamicHelperRef.current = dataHelper;
-            }
+                }
+              }
+            );
+            setPageData(dataHelper.pageDSL);
+            dynamicHelperRef.current = dataHelper;
           }
         }
-      } finally {
-        setLoading(false);
-      }
-    };
-
-    const getDynamicFormValue = async () => {
-      const allValues: Record<string, any> = {};
-      if (formsRef.current) {
-        const promise = Object.keys(formsRef.current).map((formCode) => {
-          const form = formsRef.current[formCode] || {};
-          return form?.getFieldsValue?.().then((res: any) => {
-            allValues[formCode] = res;
-          });
-        });
-        await Promise.all(promise);
       }
-      return allValues;
-    };
+    } finally {
+      setLoading(false);
+    }
+  };
 
-    useEffect(() => {
-      if (formsRef.current) {
-        Object.keys(formsRef.current).forEach((key) => {
-          const form = formsRef.current[key];
-          if (form?.setReadOnly) {
-            form.setReadOnly(props.scene === 'readonly');
-          }
+  const getDynamicFormValue = async () => {
+    const allValues: Record<string, any> = {};
+    if (formsRef.current) {
+      const promise = Object.keys(formsRef.current).map(formCode => {
+        const form = formsRef.current[formCode] || {};
+        return form?.getFieldsValue?.().then((res: any) => {
+          allValues[formCode] = res;
         });
-      }
-    }, [props.scene]);
+      });
+      await Promise.all(promise);
+    }
+    return allValues;
+  };
 
-    const resetFields = async () => {
-      const beforeData = await getDynamicFormValue();
-      if (formsRef.current) {
-        for (
-          let index = 0;
-          index < Object.keys(formsRef.current).length;
-          index += 1
-        ) {
-          const formCode = Object.keys(formsRef.current)[index];
-          const form = formsRef.current[formCode] || {};
-          const values = await form?.getFieldsValue?.();
-          const obj: any = {};
-          Object.keys(values).forEach((key) => {
-            obj[key] = undefined;
-          });
-          form?.setFieldsValue?.(
-            obj,
-            dynamicPageRef?.current?.sandboxContext?.refs,
-          );
+  useEffect(() => {
+    if (formsRef.current) {
+      Object.keys(formsRef.current).forEach(key => {
+        const form = formsRef.current[key];
+        if (form?.setReadOnly) {
+          form.setReadOnly(!!readOnly);
         }
-      }
-      const updateData = await getDynamicFormValue();
-      const { event } = dynamicHelperRef.current || {};
-      diffChange(beforeData, updateData, (diff) => {
-        // 执行事件处理变更联动
-        event?.eval(diff.formCode, diff.changeFieldName);
       });
-    };
+    }
+  }, [readOnly]);
 
-    const setFieldsValue = async (
-      assignData: Record<string, unknown>,
-      format: boolean = true,
-    ) => {
-      let formalFormData = assignData;
-      const { assign2FormData, event } = dynamicHelperRef.current || {};
-      if (format) {
-        // 解析赋值数据
-        formalFormData = assign2FormData?.(assignData) || {};
-      }
-      const beforeData = await getDynamicFormValue();
-      if (formsRef.current) {
-        Object.keys(formsRef.current).forEach((formCode) => {
-          const form = formsRef.current[formCode] || {};
-          form?.setFieldsValue?.(
-            formalFormData[formCode] || {},
-            dynamicPageRef?.current?.sandboxContext?.refs,
-          );
+  const resetFields = async () => {
+    const beforeData = await getDynamicFormValue();
+    if (formsRef.current) {
+      for (let index = 0; index < Object.keys(formsRef.current).length; index += 1) {
+        const formCode = Object.keys(formsRef.current)[index];
+        const form = formsRef.current[formCode] || {};
+        const values = await form?.getFieldsValue?.();
+        const obj: any = {};
+        Object.keys(values).forEach(key => {
+          obj[key] = undefined;
         });
+        form?.setFieldsValue?.(obj, dynamicPageRef?.current?.sandboxContext?.refs);
       }
-      const updateData = await getDynamicFormValue();
-      diffChange(beforeData, updateData, (diff) => {
-        // 执行事件处理变更联动
-        event?.eval(diff.formCode, diff.changeFieldName);
+    }
+    const updateData = await getDynamicFormValue();
+    const { event } = dynamicHelperRef.current || {};
+    diffChange(beforeData, updateData, diff => {
+      // 执行事件处理变更联动
+      event?.eval(diff.formCode, diff.changeFieldName);
+    });
+  };
+
+  const setFieldsValue = async (assignData: Record<string, unknown>, format: boolean = true) => {
+    let formalFormData = assignData;
+    const { assign2FormData, event } = dynamicHelperRef.current || {};
+    if (format) {
+      // 解析赋值数据
+      formalFormData = assign2FormData?.(assignData) || {};
+    }
+    const beforeData = await getDynamicFormValue();
+    if (formsRef.current) {
+      Object.keys(formsRef.current).forEach(formCode => {
+        const form = formsRef.current[formCode] || {};
+        form?.setFieldsValue?.(formalFormData[formCode] || {}, dynamicPageRef?.current?.sandboxContext?.refs);
       });
-    };
+    }
+    const updateData = await getDynamicFormValue();
+    diffChange(beforeData, updateData, diff => {
+      // 执行事件处理变更联动
+      event?.eval(diff.formCode, diff.changeFieldName);
+    });
+  };
 
-    const providerValue: DynamicDataContext = useMemo(() => {
-      return {
-        onFormChange: async (formName, changedFieldName, changedFieldValue) => {
-          const { formData2Retrieve, event } = dynamicHelperRef.current || {};
-          const allValues = await getDynamicFormValue();
-          event?.eval(formName, changedFieldName);
-          if (typeof onValuesChange === 'function') {
-            onValuesChange(
-              formName,
-              changedFieldName,
-              changedFieldValue,
-              formData2Retrieve?.(allValues) || allValues,
-            );
-          }
-        },
-        _innerDynamicDataContainer: true,
-        get formsRefMap() {
-          return formsRef.current;
-        },
-        updateFormChildRef: (formCode, formRef) => {
-          // 只读时每次上报设置表单控件为只读状态
-          if (props?.scene === 'readonly') {
-            formRef?.setReadOnly(props?.scene === 'readonly');
-          }
-          formsRef.current[formCode] = formRef;
+  const providerValue: DynamicDataContext = useMemo(() => {
+    return {
+      onFormChange: async (formName, changedFieldName, changedFieldValue) => {
+        const { formData2Retrieve, event } = dynamicHelperRef.current || {};
+        const allValues = await getDynamicFormValue();
+        event?.eval(formName, changedFieldName);
+        if (typeof onValuesChange === 'function') {
+          onValuesChange(formName, changedFieldName, changedFieldValue, formData2Retrieve?.(allValues) || allValues);
+        }
+      },
+      _innerDynamicDataContainer: true,
+      get formsRefMap() {
+        return formsRef.current;
+      },
+      updateFormChildRef: (formCode, formRef) => {
+        // 只读时每次上报设置表单控件为只读状态
+        if (readOnly) {
+          formRef?.setReadOnly(readOnly);
+        }
+        formsRef.current[formCode] = formRef;
+      },
+      form: {
+        getFieldsValue: () => getDynamicFormValue(),
+        resetFields,
+        setFieldsValue: (assignData: Record<string, unknown>) => {
+          return setFieldsValue(assignData, false);
         },
-        form: {
-          getFieldsValue: () => getDynamicFormValue(),
-          resetFields,
-          setFieldsValue: (assignData: Record<string, unknown>) => {
-            return setFieldsValue(assignData, false);
-          },
 
-          useWatch: (formCode: string, fieldCode: string) => {
-            return Form.useWatch(fieldCode, formsRef.current[formCode]?.form);
-          },
+        useWatch: (formCode: string, fieldCode: string) => {
+          return Form.useWatch(fieldCode, formsRef.current[formCode]?.form);
         },
-      };
-    }, [props?.scene]);
+      },
+    };
+  }, [readOnly]);
 
-    useEffect(() => {
-      getDynamicData(engineRule);
-    }, [engineRule]);
+  useEffect(() => {
+    if (engineRule && engineRule?.length) {
+      getDynamicData(combineRules(engineRule));
+    }
+  }, [engineRule]);
 
-    useImperativeHandle(ref, () => ({
-      dynamicCode,
-      // 更新动态数据
-      setRules: (newRules: DynamicDataContainerProps['engineRule']) => {
-        return getDynamicData(newRules);
-      },
-      // 获取动态数据表单转换协议后的值
-      getFieldsValue: async () => {
-        const allValues = await getDynamicFormValue();
+  useImperativeHandle(ref, () => ({
+    dynamicCode,
+    // 更新动态数据
+    setRules: (newRules: Array<Array<RuleParamsItem>>) => {
+      return getDynamicData(newRules);
+    },
+    // 获取动态数据表单转换协议后的值
+    getFieldsValue: async () => {
+      const allValues = await getDynamicFormValue();
+      const { formData2Retrieve } = dynamicHelperRef.current || {};
+      return formData2Retrieve?.(allValues) || allValues;
+    },
+    // 获取动态数据表单原始值
+    getOriginValue: () => {
+      return getDynamicFormValue();
+    },
+    // 校验表单并取值
+    validateFormAndScroll: async () => {
+      const allValues: Record<string, any> = {};
+      if (formsRef.current) {
+        const validatePromiseList = Object.keys(formsRef.current).map(formCode => {
+          const form = formsRef.current[formCode] || {};
+          return form?.validateFormAndScroll?.().then(res => {
+            allValues[formCode] = res;
+          });
+        });
+        await Promise.all(validatePromiseList);
         const { formData2Retrieve } = dynamicHelperRef.current || {};
         return formData2Retrieve?.(allValues) || allValues;
-      },
-      // 获取动态数据表单原始值
-      getOriginValue: () => {
-        return getDynamicFormValue();
-      },
-      // 校验表单并取值
-      validateFormAndScroll: async () => {
-        const allValues: Record<string, any> = {};
-        if (formsRef.current) {
-          const validatePromiseList = Object.keys(formsRef.current).map(
-            (formCode) => {
-              const form = formsRef.current[formCode] || {};
-              return form?.validateFormAndScroll?.().then((res) => {
-                allValues[formCode] = res;
-              });
-            },
-          );
-          await Promise.all(validatePromiseList);
-          const { formData2Retrieve } = dynamicHelperRef.current || {};
-          return formData2Retrieve?.(allValues) || allValues;
-        }
-        return undefined;
-      },
-      resetFields,
-      setFieldsValue: (assignData: Record<string, unknown>) => {
-        if (readyComplete) {
-          return setFieldsValue(assignData, true);
-        }
-        return yieldMethod.appendTo('setFieldsValue', setFieldsValue, [
-          assignData,
-        ]);
-      },
-    }));
+      }
+      return undefined;
+    },
+    resetFields,
+    setFieldsValue: (assignData: Record<string, unknown>) => {
+      if (readyComplete) {
+        return setFieldsValue(assignData, true);
+      }
+      return yieldMethod.appendTo('setFieldsValue', setFieldsValue, [assignData]);
+    },
+  }));
 
-    const dynamicStyle = {
-      ...(style || {}),
-      display: props?.visible ? undefined : 'none',
-    };
-    return (
-      <div className={className} style={dynamicStyle}>
-        <DynamicDataProvider value={providerValue}>
-          {pageData &&
-            renderDynamicPage(
-              pageData,
-              { uid: $$componentItem.uid },
-              {
-                ref: dynamicPageRef,
-                staticAttrKeys,
-                engineliftCycle,
-              },
-            )}
-        </DynamicDataProvider>
-        {loading && <SpinLoading />}
-      </div>
-    );
-  },
-);
+  const dynamicStyle = {
+    ...(style || {}),
+    display: props?.visible ? undefined : 'none',
+  };
+  return (
+    <div className={className} style={dynamicStyle}>
+      <DynamicDataProvider value={providerValue}>
+        {pageData &&
+          renderDynamicPage(
+            pageData,
+            { uid: $$componentItem.uid },
+            {
+              ref: dynamicPageRef,
+              staticAttrKeys,
+              engineliftCycle,
+            }
+          )}
+      </DynamicDataProvider>
+      {loading && <SpinLoading />}
+    </div>
+  );
+});
 
 export default DynamicDataContainer;

package/lib/h5public/src/components/factory/src/DynamicDataContainer/useDynamicDataContainer.ts

@@ -1,19 +1,13 @@
 import { useEffect, useMemo, useRef, useState } from 'react';
 import YieldMethod from './YieldMethod';
 
-export const useDynamicDataContainer = ({
-  dynamicHelper,
-}: {
-  dynamicHelper?: any;
-}) => {
+export const useDynamicDataContainer = ({ dynamicHelper }: { dynamicHelper?: any }) => {
   const dynamicPageRef = useRef<any>(null);
   const [readyComplete, setReadyComplete] = useState(false);
   const yieldMethod = useMemo(() => new YieldMethod(), []);
 
   useEffect(() => {
-    dynamicHelper?.updateSandboxContext(
-      () => dynamicPageRef.current?.sandboxContext,
-    );
+    dynamicHelper?.updateSandboxContext(() => dynamicPageRef.current?.sandboxContext);
   }, [dynamicHelper, dynamicPageRef.current]);
 
   const staticAttrKeys = useMemo(() => {

package/lib/h5public/src/components/factory/src/DynamicList/MySwipe/index.tsx

@@ -27,7 +27,7 @@ interface MySwipeProps {
   renderIcon: (props: any) => JSX.Element;
 }
 
-const CustomButton: React.FC<MySwipeProps> = (props) => {
+const CustomButton: React.FC<MySwipeProps> = props => {
   const {
     isEdit,
     children,
@@ -44,25 +44,14 @@ const CustomButton: React.FC<MySwipeProps> = (props) => {
   const getActionText = (swipeAction: [SwipeActionProps]) => {
     const actionArray: any[] = [];
     swipeAction?.forEach((item: SwipeActionProps, index: number) => {
-      const {
-        btnBackgroundColor,
-        checked,
-        iconPos,
-        rule,
-        icon,
-        disabled,
-        isIcon,
-        value,
-        title,
-      } = item;
+      const { btnBackgroundColor, checked, iconPos, rule, icon, disabled, isIcon, value, title } = item;
 
       let view = <></>;
       let iconView = <></>;
       let viewHidden: boolean | unknown = false;
       let viewDisabled: boolean | unknown = true;
       if (icon) {
-        const svgContent =
-          (icon?.iconFileInfo && icon?.iconFileInfo?.svgContent) || null;
+        const svgContent = (icon?.iconFileInfo && icon?.iconFileInfo?.svgContent) || null;
         iconView = renderIcon({
           ...icon,
           svgContent,
@@ -125,11 +114,7 @@ const CustomButton: React.FC<MySwipeProps> = (props) => {
   };
 
   return (
-    <SwipeAction
-      closeOnAction={closeOnAction}
-      closeOnTouchOutside={closeOnTouchOutside}
-      rightActions={getActionText(swipeAction)}
-    >
+    <SwipeAction closeOnAction={closeOnAction} closeOnTouchOutside={closeOnTouchOutside} rightActions={getActionText(swipeAction)}>
       {children}
     </SwipeAction>
   );