import Schema, { RuleItem } from 'async-validator'; import { CancellablePromise } from '../typings'; export type ValidFormatterType = any; export interface ErrorMessage { message: string; field: string; } export type InputStatus = 'default' | 'focus' | 'blur'; export type ErrorType = ErrorMessage[] | undefined; export type ErrorsType = { [U in keyof T]?: ErrorType; }; export type ComponentStoresType = { [P in keyof T]: ComponentStoreInterface; }; export type Rules = RuleItem | RuleItem[]; export type SubmitCallbackType = (props: SubmitCallbackProps) => void; export type SubmitType = (callback: SubmitCallbackType) => void; export interface FunctionProperty { [key: string]: any; } export type Parse = (...args: any) => U | undefined; export type Format = (value?: U) => any; export type CheckResult = 'loading' | 'error' | 'success' | 'default'; export type SubStore = U extends object[] ? FormStoreInstance[] : U extends { [key: string]: any } ? FormStoreInstance : undefined; export interface OnChangeContext { noParse?: boolean; } export interface ComponentStoreInterface { /** * 字段 */ key: keyof T; /** * 错误信息 */ err: ErrorType; /** * 字段交联错误信息 */ crossErr: { [key: string]: ErrorMessage; }; /** * onChange上下文,每次onChange结束清空 */ onChangeContext: OnChangeContext; setOnChangeContext(context?: OnChangeContext): void; clearOnChangeContext: () => void; /** * 对外数据的错误信息(err and crossErr) */ errors: ErrorType; /** * 父组件实例 */ formStore: FormStoreInstance; /** * 前一次输入后的值 */ prevValue: U | undefined; /** * 格式化输出的值 */ value: U | undefined; /** * 当前输入后的值 */ source: U | undefined; /** * 子sotre */ subStore?: SubStore; /** * 默认值 */ defaultValue: U | undefined; /** * 是否输入过 */ isChange: boolean; /** * 是否正在验证 */ validing: boolean; /** * 输出错误信息的时机,默认 "default" */ errorOutputTrigger: InputStatus; /** * 输入状态 */ inputStatus: InputStatus; /** * 检测结果 */ checkResult: CheckResult; /** * 验证规则,详情请查看相关链接 * @see {@link https://github.com/yiminghe/async-validator} */ rules?: Rules; /** * 验证规则实例 */ schema?: Schema; /** * @summary 输入的值格式化 */ parse?: Parse; /** * 输出的值格式化 */ format?: Format; setProps: ( props: Omit, 'key' | 'formStore'>, ) => void; setSubStore: (store?: SubStore) => void; setValiding: (validing: boolean) => void; setParse: (parse?: Parse) => void; setFormat: (format?: Format) => void; setCrossErr: (props: { [key: string]: ErrorMessage }) => void; delCrossErr: (keys: string[]) => void; onChange: (value: U | undefined, ...args: any) => void; setDefaultValue: (value: U | undefined) => void; setRules: (rules: Rules | undefined) => void; setInputStatus: (inputStatus: InputStatus) => void; setErrorOutputTrigger: (inputStatus: InputStatus) => void; /** * @param rootId 根id,用于生成errorkey */ valid: (rootId?: string) => CancellablePromise; reset: () => void; } export interface ComponentStoreProps { key: keyof T; formStore: FormStoreInstance; /** * 默认值 */ defaultValue?: U; /** * 验证规则,详情请查看相关链接 * @see {@link https://github.com/yiminghe/async-validator} */ rules?: Rules; /** * @summary 输入的值格式化 */ parse?: Parse; /** * 输出的值格式化 */ format?: Format; /** * 输出错误信息的时机,默认 "default" */ errorOutputTrigger?: InputStatus; } export type SubmitCallbackProps = | { values: T; errs: undefined; } | { values: Partial; errs: ErrorsType; }; export interface FormStoreProps { getInstances: (formStore: FormStoreInstance) => ComponentStoresType; } export interface FormStoreInstance { /** * 父store */ fatherStore?: ComponentStoreInterface; /** * 全局disabled */ disabled: boolean; /** * valid一个错误就停止 */ validFirst?: boolean; setDisabled: (disabled: boolean) => void; /** * 所有的component store */ componentStores: ComponentStoresType; crossValidFuncsDict: { [P in keyof T]?: (() => void)[]; }; /** * 提交 */ submit: SubmitType; /** * 表单是否输入过 */ isChange: boolean; /** * 自动返回当前的所有错误 */ errors?: ErrorType; /** * 表单变化触发 * @param key 触发的key * @param value 触发的值(格式化过的) * @param original 触发的原始值 * @param originalArgs 触发的原始值的其他参数 * @param subStore 触发的子store */ onChange?( key: keyof T, value: any, original: any, originalOtherArgs: any, subStore: ComponentStoreInterface, ): void; /** * 重置 */ setChangeState: (isChange: boolean) => void; reset: () => void; getValue(key: K): T[K] | undefined; /** * keys不传的情况下返回所有值 * @param keys 获取的值 */ getValues( keys?: KEYS, ): Partial< { [K in KEYS[number]]: T[K]; } >; setValue( key: keyof T, value?: T[keyof T], onChangeContext?: OnChangeContext, ): void; setValues(props: Partial, onChangeContext?: OnChangeContext): void; /** * 跟上面 setValues 区别在于 此接口是把所有值更新成props,setValues({})不会更新任何值,setAllValues({})会把所有值更新成undefined * @param props */ setAllValues(props: Partial, onChangeContext?: OnChangeContext): void; /** * 触发全局验证 * @param rootId 根id,用于生成errorkey */ valid: (rootId?: string) => Promise> | undefined>; /** * 触发key对应的字段验证 * @param key * @param rootId 用于生成errorkey */ validValue(key: keyof T, rootId?: string): Promise; /** * 触发keys对应的字段集验证 * @param keys * @param rootId 用于生成errorkey */ validValues = ErrorsType>( keys: (keyof T)[], rootId?: string, ): Promise>; } /** * 自动交联验证 */ export interface AutoValid { /** * 错误显示在那个key上 */ primaryKey: P; /** * 除 primaryKey 外监听的其他key,primaryKey 与 key对应的值改变,即触发动作 */ listenKey: (keyof T)[]; /** * 触发动作 */ effect: ( arg: T, formStore: FormStoreInstance, value?: T[P], ) => string | undefined; } /** * 自动处理 */ export interface AutoHandle { /** * 监听的key,key对应的值改变,即触发动作 */ listenKey: (keyof T)[]; /** * 触发动作 */ effect: (arg: T, formStore: FormStoreInstance) => void; } export interface FormConfig extends Omit, 'key' | 'formStore'> {} export type FormConfigs = { [P in keyof T]: FormConfig; }; export type PartialUndefined = { [P in keyof T]: T[P] | undefined; }; export interface GlobalOptions { autoValid?: AutoValid | AutoValid[]; autoHandle?: AutoHandle | AutoHandle[]; errorOutputTrigger?: InputStatus; }