@lingxiteam/ebe-utils 0.5.11 → 0.6.2

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

@@ -1,11 +1,11 @@
+import React, { useMemo, useImperativeHandle } from 'react';
 import { LingxiForwardRef } from '@lingxiteam/types';
-import { Popover } from 'antd-mobile-5';
-import classnames from 'classnames';
-import React, { useImperativeHandle, useMemo } from 'react';
 import CustomModule from '../utils/CustomModule';
+import { Popover } from 'antd-mobile-5';
+import getLabelSizeMode from './utils/getLabelSizeMode';
 import { useListenProps } from '../utils/hooks/useListenState';
+import classnames from 'classnames';
 import './index.less';
-import getLabelSizeMode from './utils/getLabelSizeMode';
 
 const prefixCls = 'lcdp-description';
 
@@ -24,7 +24,7 @@ export interface MyDescriptionProps {
   colServiceData?: any;
   lineBreak?: string;
   appId?: string;
-  layout?: 'horizontal' | 'vertical';
+  layout?: 'horizontal' | 'vertical',
   labelSize?: any;
 }
 
@@ -45,8 +45,9 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
     layout = 'horizontal',
     getEngineApis,
   } = props;
-  const { textPadding, labelColor, labelFontSize, labelFontWeight, textColor, textFontSize, textFontWeight, textLineHeight, ...restStyle } =
-    style || {};
+  const {
+    textPadding, labelColor, labelFontSize, labelFontWeight, textColor, textFontSize, textFontWeight, textLineHeight, ...restStyle
+  } = style || {};
 
   const [dataSource, setDataSource] = useListenProps(props.dataSource || {});
   const [colServiceData, setColServiceData] = useListenProps(props.colServiceData);
@@ -67,7 +68,12 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
   }));
 
   const engineApis = getEngineApis?.() || {};
-  const { px2rem, sandBoxSafeRun, renderPopover, sandBoxLoadModule } = engineApis;
+  const {
+    px2rem,
+    sandBoxSafeRun,
+    renderPopover,
+    sandBoxLoadModule,
+  } = engineApis;
 
   const _dataSource = useMemo(() => {
     if (dataSource instanceof Object) {
@@ -100,6 +106,7 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
     return finalContent;
   };
 
+
   const finalColums = useMemo(() => {
     // 解析动态列
     const resolvedDymColumns = columns
@@ -176,10 +183,10 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
           if (Array.isArray(staticDataSource)) {
             // 支持数组类型值或字符串逗号隔开值翻译
             content = (Array.isArray(text) ? text : String(text).split(','))
-              .map(n => {
+              .map((n) => {
                 // 弱等保证 Number 与 String 可比较
                 // eslint-disable-next-line eqeqeq
-                const obj = staticDataSource.find(o => o.value == n);
+                const obj = staticDataSource.find((o) => o.value == n);
                 return obj ? obj.label : n;
               })
               .join(',');
@@ -187,7 +194,7 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
           // 服务数据翻译
           if (staticService && colServiceData) {
             const { labelKey, valueKey } = staticService;
-            const needtranskey = Object.keys(colServiceData).find(k => {
+            const needtranskey = Object.keys(colServiceData).find((k) => {
               if (k === c.dataIndex && Array.isArray(colServiceData[k])) {
                 return true;
               }
@@ -196,7 +203,7 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
             if (needtranskey) {
               // 支持数组类型值或字符串逗号隔开值翻译
               content = (Array.isArray(text) ? text : String(text).split(','))
-                .map(n => {
+                .map((n) => {
                   // 弱等保证 Number 与 String 可比较
                   // eslint-disable-next-line eqeqeq
                   const obj = colServiceData[needtranskey].find((o: any) => o[valueKey] == n);
@@ -270,7 +277,9 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
                 <Popover
                   content={
                     <div style={{ maxWidth: maxWidth || 'none' }}>
-                      {newPopTitle && <div className={`${prefixCls}-popover-title`}>{newPopTitle}</div>}
+                      {newPopTitle && (
+                      <div className={`${prefixCls}-popover-title`}>{newPopTitle}</div>
+                      )}
                       {newPopContent}
                     </div>
                   }
@@ -291,20 +300,10 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
   }, [columns, colServiceData, lineBreak, _dataSource, layout, labelWidth, labelSize]);
 
   const labelStyle = useMemo(() => {
-    return {
-      color: labelColor,
-      fontSize: labelFontSize,
-      fontWeight: labelFontWeight,
-      lineHeight: textLineHeight,
-    };
+    return { color: labelColor, fontSize: labelFontSize, fontWeight: labelFontWeight, lineHeight: textLineHeight };
   }, [labelColor, labelFontSize, labelFontWeight, textPadding, textLineHeight]);
   const textStyle = useMemo(() => {
-    return {
-      color: textColor,
-      fontSize: textFontSize,
-      fontWeight: textFontWeight,
-      lineHeight: textLineHeight,
-    };
+    return { color: textColor, fontSize: textFontSize, fontWeight: textFontWeight, lineHeight: textLineHeight };
   }, [textColor, textFontSize, textFontWeight, textLineHeight]);
   const textPaddingStyle = useMemo(() => {
     if (textPadding) {
@@ -354,7 +353,7 @@ const Description = LingxiForwardRef<any, MyDescriptionProps>((props, ref) => {
             return (
               <div
                 className={classnames(`${prefixCls}-cell`, `${prefixCls}-${tagLayout}-cell`, bordered ? 'border' : '')}
-                style={{ flex: `0 0 ${100 / (24 / (span || colSpan))}%` }}
+                style={{ flex: `0 0 ${(100 / (24 / (span || colSpan)))}%` }}
                 key={key}
               >
                 <div

package/lib/h5public/src/components/factory/src/Description/utils/getLabelSizeMode.ts

@@ -2,7 +2,7 @@ const getLabelSizeMode = (config: any) => {
   const { tagSize, tagWidth, labelWidth, labelSize, colSpan, span } = config || {};
   let width = tagSize;
   if (!width && (tagWidth || labelWidth)) {
-    width = `${tagWidth || labelWidth}px`;
+    width = `${(tagWidth || labelWidth)}px`;
   }
   if (!width) {
     width = labelSize;
@@ -13,15 +13,13 @@ const getLabelSizeMode = (config: any) => {
       width,
       contentWidth: 'auto',
     };
-  }
-  if (/^(1\d|24|[1-9])$/.test(width)) {
+  } if (/^(1\d|24|[1-9])$/.test(width)) {
     return {
       mode: 'grid',
       width: `${(width / 24) * 100}%`,
       contentWidth: `${((24 - width) / 24) * 100}%`,
     };
-  }
-  if (/^(?!0\/0)\d+\/(?!0)\d+$/.test(width)) {
+  } if (/^(?!0\/0)\d+\/(?!0)\d+$/.test(width)) {
     const currentSpan = span || colSpan;
     // 占比值为分数形式
     // eslint-disable-next-line no-eval

package/lib/h5public/src/components/factory/src/DformCustom/Context.tsx

@@ -1,6 +1,7 @@
 import type { FormInstance } from 'rc-field-form';
 import React from 'react';
 
+
 export interface DFormCustomContextProviderType {
   inCustomForm: true;
   name: string;
@@ -14,16 +15,24 @@ export interface DFormCustomContextProviderType {
   form: FormInstance;
 }
 
-const DFormCustomContext = React.createContext<DFormCustomContextProviderType | { inCustomForm: false }>({
+const DFormCustomContext = React.createContext<
+  DFormCustomContextProviderType | { inCustomForm: false }
+>({
   inCustomForm: false,
 });
 
 DFormCustomContext.displayName = 'DFormCustomContext';
 
+
 const DFormCustomProvider = DFormCustomContext.Provider;
 
 const useDformCustom = () => {
   return React.useContext(DFormCustomContext);
 };
 
-export { DFormCustomContext, useDformCustom, DFormCustomProvider };
+
+export {
+  DFormCustomContext,
+  useDformCustom,
+  DFormCustomProvider,
+};

package/lib/h5public/src/components/factory/src/DformCustom/FormCustomField.tsx

@@ -19,18 +19,27 @@ interface ErrorBlockType {
 }
 
 const ErrorBlock: FC<ErrorBlockType> = ({ error }) => {
-  return error ? <div className="lcdp-dform-custom-error-text">{error}</div> : null;
+  return error ? (
+    <div className="lcdp-dform-custom-error-text">{error}</div>
+  ) : null;
 };
 
-const FormCustomField: FC<FormCustomFieldType> = props => {
-  const { children, showError, valuePropName = 'value', trigger = 'onChange', getEngineApis } = props;
+const FormCustomField: FC<FormCustomFieldType> = (props) => {
+  const {
+    children,
+    showError,
+    valuePropName = 'value',
+    trigger = 'onChange',
+    getEngineApis,
+  } = props;
   const formContext = useDformCustom();
   const { compatConfig } = getEngineApis?.() || {};
   if (!formContext.inCustomForm) {
     return children;
   }
 
-  const { name, error, disabled, onChange, getRules, visible, message, form } = formContext;
+  const { name, error, disabled, onChange, getRules, visible, message, form } =
+    formContext;
 
   // 兼容表单行容器没有放到表单内，拖拽画布出现bug，导致存在这种数据。
   if (!form) {
@@ -58,7 +67,12 @@ const FormCustomField: FC<FormCustomFieldType> = props => {
   }, [visible]);
   return (
     <>
-      <Form.DFormField name={name} rules={rules} valuePropName={valuePropName} trigger={trigger}>
+      <Form.DFormField
+        name={name}
+        rules={rules}
+        valuePropName={valuePropName}
+        trigger={trigger}
+      >
         {React.cloneElement(children, {
           [trigger]: (...e: any[]) => {
             if (isFunction(triggerHandle)) {
@@ -73,7 +87,9 @@ const FormCustomField: FC<FormCustomFieldType> = props => {
           rules: visible ? getRules() : [],
         })}
       </Form.DFormField>
-      {showError && <ErrorBlock error={error?.[name] ? message || error?.[name] : ''} />}
+      {showError && (
+        <ErrorBlock error={error?.[name] ? message || error?.[name] : ''} />
+      )}
     </>
   );
 };

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

@@ -1,5 +1,5 @@
-import { LingxiForwardRef } from '@lingxiteam/types';
 import React from 'react';
+import { LingxiForwardRef } from '@lingxiteam/types';
 import { DFormWrapper, FormItem } from '../BasicComponents';
 import { useFormItem, UseFormItemProps } from '../utils/hooks/useFormItem';
 import { DFormCustomContextProviderType, DFormCustomProvider, useDformCustom } from './Context';
@@ -56,9 +56,6 @@ DformCustom.displayName = 'dformCustom';
 (DformCustom as any).useDformCustom = useDformCustom;
 (DformCustom as any).Item = FormCustomField;
 
-const instance = DformCustom as typeof DformCustom & {
-  useDformCustom: typeof useDformCustom;
-  Item: typeof FormCustomField;
-};
+const instance = DformCustom as typeof DformCustom & { useDformCustom: typeof useDformCustom; Item: typeof FormCustomField };
 
 export default instance as any;

package/lib/h5public/src/components/factory/src/DformDate/DatePicker.tsx

@@ -1,11 +1,14 @@
 import { DformDatePicker } from '@lingxiteam/dform';
-import { LingxiForwardRef } from '@lingxiteam/types';
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState, useMemo } from 'react';
 import { DFormWrapper } from '../BasicComponents';
 import { dateToFormatter, toDate, useLocaleFormatter } from '../utils/date';
 import { useFormItem, UseFormItemProps } from '../utils/hooks/useFormItem';
+import { LingxiForwardRef } from '@lingxiteam/types';
+import { HolidaysLimitType, generatorDisabledCallback, getRuleCallback } from '../utils/DateUtils/generatorDisabledCallback';
+import moment from 'moment';
 
-export interface DatePickerProps extends UseFormItemProps {
+export interface DatePickerProps
+  extends UseFormItemProps {
   minDate?: string;
   maxDate?: string;
   formatter?: string;
@@ -18,8 +21,49 @@ export interface DatePickerProps extends UseFormItemProps {
   iconColor?: string;
   fieldProps: string;
   value: any;
-  valueFormat?: 'standard' | 'show';
+  valueFormat?: 'standard' | 'show',
   modeType?: any;
+  name?: string;
+
+  /**
+   * 选择类型
+   */
+  chooseType: 'Calendar' | 'DatePicker';
+
+  /**
+   * 限制范围
+   */
+  limitRange?: string;
+
+  /**
+   * 开始时间
+   */
+  startTime?: string;
+
+  /**
+   * 结束时间
+   */
+  endTime?: string;
+
+  /**
+   * 可用多选日期
+   */
+  validMultiDate?: string[];
+
+  /**
+   * 节假日限制
+   */
+  holidaysLimit: HolidaysLimitType;
+
+  /**
+   * 指定日期
+   */
+  selectTime?: string;
+
+  /**
+   * 自定义提示文案
+   */
+  customTip?: string;
 }
 
 const DatePicker = LingxiForwardRef<any, DatePickerProps>((props, ref) => {
@@ -33,9 +77,40 @@ const DatePicker = LingxiForwardRef<any, DatePickerProps>((props, ref) => {
     fieldProps,
     getEngineApis,
     valueFormat,
+    limitRange,
+    startTime,
+    endTime,
+    holidaysLimit,
+    validMultiDate,
+    selectTime,
+    customTip,
     ...restProps
   } = props;
 
+  const disabledFnResult = useMemo(() => {
+    // 日历模式才需要开启禁用函数
+    if (props?.modeType === 'date' && props?.chooseType === 'Calendar') {
+      return generatorDisabledCallback({
+        limitRange: limitRange as any,
+        startDate: startTime,
+        endDate: endTime,
+        holidaysLimit,
+        validMultiDate,
+        selectTime,
+        timeMode: 'date',
+      });
+    }
+    return null;
+  }, [
+    limitRange,
+    startTime,
+    endTime,
+    holidaysLimit,
+    validMultiDate,
+    selectTime,
+    props?.modeType,
+  ]);
+
   const { getLocale, getLocaleEnv } = getEngineApis?.() || {};
   const lanEnv = getLocaleEnv();
   const { showFormat, valueFormat: finalValueFormat } = useLocaleFormatter(newFormatter, lanEnv, {
@@ -46,28 +121,59 @@ const DatePicker = LingxiForwardRef<any, DatePickerProps>((props, ref) => {
     },
   });
 
-  const { isForm, disabled, form, val, onInputChange, getRules, required, readOnly, visible } = useFormItem(
-    ref,
-    {
-      ...props,
-      defaultValue: dateToFormatter(showFormat, defaultValue, finalValueFormat),
+  const {
+    isForm,
+    disabled,
+    form,
+    val,
+    onInputChange,
+    getRules,
+    required,
+    readOnly,
+    visible,
+  } = useFormItem(ref, {
+    ...props,
+    defaultValue: dateToFormatter(showFormat, defaultValue, finalValueFormat),
+  }, {
+    get value() {
+      return isForm
+        ? dateToFormatter(showFormat, form?.getFieldValue(props.fieldProps), finalValueFormat)
+        : dateToFormatter(showFormat, val, finalValueFormat);
+    },
+    setVal: (v: string) => {
+      onInputChange(dateToFormatter(showFormat, v, finalValueFormat));
+      if (isForm) {
+        form?.setFieldsValue({ [props.fieldProps]: dateToFormatter(showFormat, v, finalValueFormat) });
+      }
     },
-    {
-      get value() {
-        return isForm
-          ? dateToFormatter(showFormat, form?.getFieldValue(props.fieldProps), finalValueFormat)
-          : dateToFormatter(showFormat, val, finalValueFormat);
-      },
-      setVal: (v: string) => {
-        onInputChange(dateToFormatter(showFormat, v, finalValueFormat));
-        if (isForm) {
-          form?.setFieldsValue({
-            [props.fieldProps]: dateToFormatter(showFormat, v, finalValueFormat),
-          });
+  });
+
+  const finalRules = useMemo(() => {
+    const rules: any[] = getRules();
+    if (disabledFnResult) {
+      const rangeCheckValidator = (_: any, val: any) => {
+        const result = getRuleCallback({
+          ...disabledFnResult,
+          tiemMode: 'date',
+          currentValue: val,
+          getLocale: (key, obj) => getLocale(key, '', obj),
+          name: props.title || '',
+          holidaysLimit,
+          format: finalValueFormat,
+        });
+        // 校验不通过
+        if (result) {
+          return Promise.reject(
+            new Error(customTip || result),
+          );
         }
-      },
+        return Promise.resolve();
+      };
+      rules.push({ validator: rangeCheckValidator });
     }
-  );
+    return rules;
+  }, [disabledFnResult, getRules()?.length, customTip]);
+
   const [afterMinDate, setAfterMinDate] = useState<any>();
   const [afterMaxDate, setAfterMaxDate] = useState<any>();
   const onDateChange = (v?: Date) => {
@@ -90,11 +196,14 @@ const DatePicker = LingxiForwardRef<any, DatePickerProps>((props, ref) => {
     <DFormWrapper visible={visible} getEngineApis={props.getEngineApis}>
       <DformDatePicker
         {...restProps}
+        shouldDisableDate={disabledFnResult?.disabledDateFn ? (curDate) => {
+          return disabledFnResult?.disabledDateFn(moment(curDate));
+        } : undefined}
         fieldProps={fieldProps}
         minDate={afterMinDate}
         maxDate={afterMaxDate}
         defaultValue={val}
-        rules={getRules()}
+        rules={finalRules}
         disabled={disabled}
         format={showFormat}
         required={required}

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

@@ -1,5 +1,4 @@
 import { Form } from '@lingxiteam/dform';
-import { LingxiForwardRef } from '@lingxiteam/types';
 import React from 'react';
 import { FormItem } from '../BasicComponents';
 import { DFormContext } from '../utils/form';
@@ -7,6 +6,7 @@ import { withTransformProps } from '../utils/withTransformProps';
 import type { DatePickerProps } from './DatePicker';
 import DatePicker from './DatePicker';
 import transformProps from './transformProps';
+import { LingxiForwardRef } from '@lingxiteam/types';
 
 export interface MyDformDateProps extends DatePickerProps {
   title: string;
@@ -21,7 +21,11 @@ export interface MyDformDateProps extends DatePickerProps {
 }
 
 const DformDate = LingxiForwardRef<any, MyDformDateProps>((props, ref) => {
-  const { defaultValue, fieldProps, fieldName } = props;
+  const {
+    defaultValue,
+    fieldProps,
+    fieldName,
+  } = props;
   const { isForm } = React.useContext(DFormContext) || {};
   if (!isForm) {
     return (

package/lib/h5public/src/components/factory/src/DformDate/transformProps.tsx

@@ -15,7 +15,8 @@ const timeModeMap: any = {
 };
 
 export default function transformProps(props: Props) {
-  const { basicStatus, fieldName, name, format, value, isCurrent, timeMode = 'time', ...restProps } = props;
+  const { basicStatus, fieldName, name, format, value, isCurrent, timeMode = 'time', ...restProps } =
+    props;
   const newProps: Record<string, any> = {
     ...(restProps as any),
     status: `${basicStatus}`,