@gm-pc/react 1.24.9-beta.13 → 1.24.9-beta.14

package/src/component/controlled_form/controlled_form.tsx

@@ -1,141 +1,141 @@
-/*
- * @Description: 受控表单
- */
-import React, {
-  useState,
-  useEffect,
-  useCallback,
-  useRef,
-  useImperativeHandle,
-  ReactNode,
-  Ref,
-} from 'react'
-import { Form, FormProps } from '../form'
-import { noop } from 'lodash'
-import { useForm, UseFormProps, FormInstance } from '../../common/hooks'
-import { getRecordPartialObject, isFalsy } from '../../common/utils'
-import { ControlledFormContext, ControlledFormContextProps } from './context'
-import { RecordPartial, StringKey, anyCallback } from '../../types'
-
-export interface ControlledFormProps<K = any>
-  extends UseFormProps<K>,
-    Omit<FormProps, 'onSubmit' | 'onSubmitValidated'> {
-  /* 表单实例，可拿到一些方法 */
-  form?: Ref<FormInstance<K>>
-  /* 要隐藏的表单项 */
-  hideItems?: RecordPartial<K, boolean>
-  /* 提交获取值是否过滤 null | undefined | '' */
-  isIgnoreFalsy?: boolean
-  // 初始化是否触发onSubmit
-  isSubmitInit?: boolean
-  children?: ReactNode
-  /* 表单提交的回调 */
-  onSubmit?(values: Partial<K>): void
-}
-
-function ControlledForm<K = any>(props: ControlledFormProps<K>) {
-  const {
-    form,
-    // 默认值
-    initialValues = getRecordPartialObject<K, any>(),
-    // 规格化配置
-    normalizes = getRecordPartialObject<K, anyCallback>(),
-    // 表单提交时是否去除值为undefined, null, ''的项
-    isIgnoreFalsy = true,
-    isSubmitInit,
-    // 隐藏的表单项 要隐藏将fieldName设为tue ，如{ alloc_type: true }
-    hideItems = getRecordPartialObject<K, boolean>(),
-    children,
-    // 表单项改变的时候,回调第一个是改变的字段及新的值，第二个参数是所有新的值
-    onFieldsChange = noop,
-    // 表单提交的回调
-    onSubmit: onTempSubmit,
-    ...res
-  } = props
-
-  const {
-    values = getRecordPartialObject<K, any>(),
-    onChange,
-    resetFields,
-    setFieldsValue,
-    getFieldsValue,
-    getNormalizeValue,
-    canSubmit,
-    setCanSubmit,
-    validateFields,
-  } = useForm<K>({
-    initialValues,
-    normalizes,
-    onFieldsChange,
-  })
-  const [didClickSubmit, setDidClickSubmit] = useState(false)
-  const didMountRef = useRef(false)
-
-  const formRef = useRef<Form>(null)
-
-  //  表单提交
-  const onSubmit = useCallback((): void => {
-    const tempValues: ControlledFormProps<K>['initialValues'] = { ...values }
-    if (isIgnoreFalsy || Object.keys(normalizes).length) {
-      Object.keys(values).forEach((key) => {
-        const tempKey = key as StringKey<K>
-
-        const value = values[tempKey]
-        // 剔除掉undefined, null和空字符串
-        if (isIgnoreFalsy && isFalsy(value)) {
-          delete tempValues[tempKey]
-        } else {
-          tempValues[tempKey] = getNormalizeValue(tempKey, value)
-        }
-      })
-    }
-    setDidClickSubmit(true)
-    onTempSubmit && canSubmit() && onTempSubmit(tempValues as K)
-  }, [values, isIgnoreFalsy, normalizes, onTempSubmit, getNormalizeValue, canSubmit])
-  useEffect(() => {
-    if (isSubmitInit && !didMountRef.current) {
-      didMountRef.current = true
-      onSubmit()
-    }
-  }, [isSubmitInit, onSubmit])
-  useImperativeHandle(form, () => ({
-    resetFields,
-    setFieldsValue,
-    getFieldsValue,
-    validateFields: () => {
-      setDidClickSubmit(true)
-      return validateFields()
-    },
-    apiDoValidate: () => {
-      setDidClickSubmit(true)
-      return canSubmit()
-    },
-  }))
-
-  const formProps = {
-    ...res,
-    ref: formRef,
-  }
-  if (onTempSubmit) {
-    Object.assign(formProps, { onSubmit })
-  }
-  const providerValues = {
-    values,
-    hideItems,
-    onChange,
-    resetFields,
-    setFieldsValue,
-    getFieldsValue,
-    setCanSubmit,
-    didClickSubmit,
-  } as ControlledFormContextProps
-  return (
-    <Form {...formProps}>
-      <ControlledFormContext.Provider value={providerValues}>
-        {children}
-      </ControlledFormContext.Provider>
-    </Form>
-  )
-}
-
-export default ControlledForm
+/*
+ * @Description: 受控表单
+ */
+import React, {
+  useState,
+  useEffect,
+  useCallback,
+  useRef,
+  useImperativeHandle,
+  ReactNode,
+  Ref,
+} from 'react'
+import { Form, FormProps } from '../form'
+import { noop } from 'lodash'
+import { useForm, UseFormProps, FormInstance } from '../../common/hooks'
+import { getRecordPartialObject, isFalsy } from '../../common/utils'
+import { ControlledFormContext, ControlledFormContextProps } from './context'
+import { RecordPartial, StringKey, anyCallback } from '../../types'
+
+export interface ControlledFormProps<K = any>
+  extends UseFormProps<K>,
+    Omit<FormProps, 'onSubmit' | 'onSubmitValidated'> {
+  /* 表单实例，可拿到一些方法 */
+  form?: Ref<FormInstance<K>>
+  /* 要隐藏的表单项 */
+  hideItems?: RecordPartial<K, boolean>
+  /* 提交获取值是否过滤 null | undefined | '' */
+  isIgnoreFalsy?: boolean
+  // 初始化是否触发onSubmit
+  isSubmitInit?: boolean
+  children?: ReactNode
+  /* 表单提交的回调 */
+  onSubmit?(values: Partial<K>): void
+}
+
+function ControlledForm<K = any>(props: ControlledFormProps<K>) {
+  const {
+    form,
+    // 默认值
+    initialValues = getRecordPartialObject<K, any>(),
+    // 规格化配置
+    normalizes = getRecordPartialObject<K, anyCallback>(),
+    // 表单提交时是否去除值为undefined, null, ''的项
+    isIgnoreFalsy = true,
+    isSubmitInit,
+    // 隐藏的表单项 要隐藏将fieldName设为tue ，如{ alloc_type: true }
+    hideItems = getRecordPartialObject<K, boolean>(),
+    children,
+    // 表单项改变的时候,回调第一个是改变的字段及新的值，第二个参数是所有新的值
+    onFieldsChange = noop,
+    // 表单提交的回调
+    onSubmit: onTempSubmit,
+    ...res
+  } = props
+
+  const {
+    values = getRecordPartialObject<K, any>(),
+    onChange,
+    resetFields,
+    setFieldsValue,
+    getFieldsValue,
+    getNormalizeValue,
+    canSubmit,
+    setCanSubmit,
+    validateFields,
+  } = useForm<K>({
+    initialValues,
+    normalizes,
+    onFieldsChange,
+  })
+  const [didClickSubmit, setDidClickSubmit] = useState(false)
+  const didMountRef = useRef(false)
+
+  const formRef = useRef<Form>(null)
+
+  //  表单提交
+  const onSubmit = useCallback((): void => {
+    const tempValues: ControlledFormProps<K>['initialValues'] = { ...values }
+    if (isIgnoreFalsy || Object.keys(normalizes).length) {
+      Object.keys(values).forEach((key) => {
+        const tempKey = key as StringKey<K>
+
+        const value = values[tempKey]
+        // 剔除掉undefined, null和空字符串
+        if (isIgnoreFalsy && isFalsy(value)) {
+          delete tempValues[tempKey]
+        } else {
+          tempValues[tempKey] = getNormalizeValue(tempKey, value)
+        }
+      })
+    }
+    setDidClickSubmit(true)
+    onTempSubmit && canSubmit() && onTempSubmit(tempValues as K)
+  }, [values, isIgnoreFalsy, normalizes, onTempSubmit, getNormalizeValue, canSubmit])
+  useEffect(() => {
+    if (isSubmitInit && !didMountRef.current) {
+      didMountRef.current = true
+      onSubmit()
+    }
+  }, [isSubmitInit, onSubmit])
+  useImperativeHandle(form, () => ({
+    resetFields,
+    setFieldsValue,
+    getFieldsValue,
+    validateFields: () => {
+      setDidClickSubmit(true)
+      return validateFields()
+    },
+    apiDoValidate: () => {
+      setDidClickSubmit(true)
+      return canSubmit()
+    },
+  }))
+
+  const formProps = {
+    ...res,
+    ref: formRef,
+  }
+  if (onTempSubmit) {
+    Object.assign(formProps, { onSubmit })
+  }
+  const providerValues = {
+    values,
+    hideItems,
+    onChange,
+    resetFields,
+    setFieldsValue,
+    getFieldsValue,
+    setCanSubmit,
+    didClickSubmit,
+  } as ControlledFormContextProps
+  return (
+    <Form {...formProps}>
+      <ControlledFormContext.Provider value={providerValues}>
+        {children}
+      </ControlledFormContext.Provider>
+    </Form>
+  )
+}
+
+export default ControlledForm

package/src/component/controlled_form/index.ts

@@ -1,8 +1,8 @@
-export { useControlFormRef } from '../../common/hooks'
-export type { OnFieldsChange } from '../../common/hooks'
-export { default as ControlledForm } from './controlled_form'
-export { default as ControlledFormItem } from './items'
-export { cloneElement } from './items/utils'
-export type { RenderProps } from './items/utils'
-export * from './controlled_form'
-export * from './items'
+export { useControlFormRef } from '../../common/hooks'
+export type { OnFieldsChange } from '../../common/hooks'
+export { default as ControlledForm } from './controlled_form'
+export { default as ControlledFormItem } from './items'
+export { cloneElement } from './items/utils'
+export type { RenderProps } from './items/utils'
+export * from './controlled_form'
+export * from './items'

package/src/component/controlled_form/items/index.tsx

@@ -1,115 +1,115 @@
-/*
- * @Description: 渲染单个表单项
- */
-import React, { ReactElement, useContext } from 'react'
-import { FormInstance } from '../../../common/hooks'
-import { FormItem, FormItemProps } from '../../form'
-import { ControlledFormContext } from '../context'
-import { cloneElement, getWarningMessage } from './utils'
-import { StringKey } from '../../../types'
-/** ---------Rule -------- end */
-export declare type RuleType = 'integer' | 'url' | 'email'
-type StoreValue = any
-declare type Validator = (
-  rule: RuleObject,
-  value: StoreValue,
-  callback: (error?: string) => void
-) => Promise<void | any> | void
-export declare type RuleRender<T = any> = (values: T) => string | undefined
-export interface ValidatorRule {
-  message?: string | ReactElement
-  validator: Validator
-}
-interface BaseRule {
-  len?: number
-  max?: number
-  min?: number
-  pattern?: RegExp
-  required?: boolean
-  whitespace?: boolean
-  type?: RuleType
-}
-declare type AggregationRule = BaseRule & Partial<ValidatorRule>
-export declare type RuleObject = AggregationRule
-export declare type Rule<T = any> = RuleObject | RuleRender<T>
-/** ---------Rule -------- end */
-export interface ControlFormItemProps<T = any> extends FormItemProps {
-  /* 表单名 */
-  name?: StringKey<T>
-  /* 组件value名 */
-  valuePropName?: 'value' | 'checked' | 'selected' | 'date'
-  /* 是否隐藏表单 */
-  hide?: boolean
-  /* 组件触发函数名 */
-  trigger?: string
-  rules?: Rule<T>[]
-  children: ReactElement
-  /* 表单项改变的回调 */
-  onFieldChange?(
-    newValue: any,
-    context: Omit<FormInstance, 'apiDoValidate' | 'validateFields'>
-  ): void
-}
-function ControlledFormItem<T = any>(props: ControlFormItemProps<T>) {
-  const {
-    name = '',
-    valuePropName = 'value',
-    // 控制表单是否隐藏
-    hide,
-    trigger = 'onChange',
-    children,
-    onFieldChange,
-    rules,
-    ...restProps
-  } = props
-
-  const {
-    values,
-    hideItems,
-    onChange,
-    resetFields,
-    setFieldsValue,
-    getFieldsValue,
-    setCanSubmit,
-    didClickSubmit,
-  } = useContext(ControlledFormContext)
-  const isHide = hide || hideItems?.[name]
-
-  if (isHide) {
-    return null
-  }
-  const childProps = {
-    ...children.props,
-  }
-  // 如果有提供name
-  if (name) {
-    // 拦截加上value
-    childProps[valuePropName] = values?.[name]
-    const triggers = new Set<string>([trigger])
-    if (!Array.isArray(children)) {
-      triggers.forEach((eventName) => {
-        childProps[eventName] = (args: any) => {
-          // 触发更新
-          if (onChange) {
-            const newValue = onChange(name, args)
-            if (onFieldChange && resetFields && getFieldsValue && setFieldsValue) {
-              onFieldChange(newValue, { resetFields, getFieldsValue, setFieldsValue })
-            }
-          }
-        }
-      })
-    }
-  }
-  const warningMessage = getWarningMessage(rules, values as T, name, restProps.required)
-  if (name) {
-    setCanSubmit(name, warningMessage)
-  }
-
-  return (
-    <FormItem {...restProps} warningMessage={didClickSubmit ? warningMessage : undefined}>
-      {cloneElement(children, childProps)}
-    </FormItem>
-  )
-}
-
-export default ControlledFormItem
+/*
+ * @Description: 渲染单个表单项
+ */
+import React, { ReactElement, useContext } from 'react'
+import { FormInstance } from '../../../common/hooks'
+import { FormItem, FormItemProps } from '../../form'
+import { ControlledFormContext } from '../context'
+import { cloneElement, getWarningMessage } from './utils'
+import { StringKey } from '../../../types'
+/** ---------Rule -------- end */
+export declare type RuleType = 'integer' | 'url' | 'email'
+type StoreValue = any
+declare type Validator = (
+  rule: RuleObject,
+  value: StoreValue,
+  callback: (error?: string) => void
+) => Promise<void | any> | void
+export declare type RuleRender<T = any> = (values: T) => string | undefined
+export interface ValidatorRule {
+  message?: string | ReactElement
+  validator: Validator
+}
+interface BaseRule {
+  len?: number
+  max?: number
+  min?: number
+  pattern?: RegExp
+  required?: boolean
+  whitespace?: boolean
+  type?: RuleType
+}
+declare type AggregationRule = BaseRule & Partial<ValidatorRule>
+export declare type RuleObject = AggregationRule
+export declare type Rule<T = any> = RuleObject | RuleRender<T>
+/** ---------Rule -------- end */
+export interface ControlFormItemProps<T = any> extends FormItemProps {
+  /* 表单名 */
+  name?: StringKey<T>
+  /* 组件value名 */
+  valuePropName?: 'value' | 'checked' | 'selected' | 'date'
+  /* 是否隐藏表单 */
+  hide?: boolean
+  /* 组件触发函数名 */
+  trigger?: string
+  rules?: Rule<T>[]
+  children: ReactElement
+  /* 表单项改变的回调 */
+  onFieldChange?(
+    newValue: any,
+    context: Omit<FormInstance, 'apiDoValidate' | 'validateFields'>
+  ): void
+}
+function ControlledFormItem<T = any>(props: ControlFormItemProps<T>) {
+  const {
+    name = '',
+    valuePropName = 'value',
+    // 控制表单是否隐藏
+    hide,
+    trigger = 'onChange',
+    children,
+    onFieldChange,
+    rules,
+    ...restProps
+  } = props
+
+  const {
+    values,
+    hideItems,
+    onChange,
+    resetFields,
+    setFieldsValue,
+    getFieldsValue,
+    setCanSubmit,
+    didClickSubmit,
+  } = useContext(ControlledFormContext)
+  const isHide = hide || hideItems?.[name]
+
+  if (isHide) {
+    return null
+  }
+  const childProps = {
+    ...children.props,
+  }
+  // 如果有提供name
+  if (name) {
+    // 拦截加上value
+    childProps[valuePropName] = values?.[name]
+    const triggers = new Set<string>([trigger])
+    if (!Array.isArray(children)) {
+      triggers.forEach((eventName) => {
+        childProps[eventName] = (args: any) => {
+          // 触发更新
+          if (onChange) {
+            const newValue = onChange(name, args)
+            if (onFieldChange && resetFields && getFieldsValue && setFieldsValue) {
+              onFieldChange(newValue, { resetFields, getFieldsValue, setFieldsValue })
+            }
+          }
+        }
+      })
+    }
+  }
+  const warningMessage = getWarningMessage(rules, values as T, name, restProps.required)
+  if (name) {
+    setCanSubmit(name, warningMessage)
+  }
+
+  return (
+    <FormItem {...restProps} warningMessage={didClickSubmit ? warningMessage : undefined}>
+      {cloneElement(children, childProps)}
+    </FormItem>
+  )
+}
+
+export default ControlledFormItem