Ben Lin
2024-06-18 ebbd788fbb2c0b45d4473798efc57eec8ba74a25
src/components/Form/src/types/form.ts
@@ -1,9 +1,9 @@
import type { NamePath, RuleObject } from 'ant-design-vue/lib/form/interface';
import type { VNode, CSSProperties } from 'vue';
import type { ButtonProps as AntdButtonProps } from '/@/components/Button';
import type { ButtonProps as AntdButtonProps } from '@/components/Button';
import type { FormItem } from './formItem';
import type { ColEx, ComponentType } from './index';
import type { TableActionType } from '/@/components/Table/src/types/table';
import type { ColEx, ComponentType, ComponentProps } from './';
import type { TableActionType } from '@/components/Table/src/types/table';
import type { RowProps } from 'ant-design-vue/lib/grid/Row';
export type FieldMapToTime = [string, [string, string], (string | [string, string])?][];
@@ -13,7 +13,7 @@
};
export interface RenderCallbackParams {
  schema: FormSchema;
  schema: FormSchemaInner;
  values: Recordable;
  model: Recordable;
  field: string;
@@ -29,18 +29,19 @@
  resetFields: () => Promise<void>;
  getFieldsValue: () => Recordable;
  clearValidate: (name?: string | string[]) => Promise<void>;
  updateSchema: (data: Partial<FormSchema> | Partial<FormSchema>[]) => Promise<void>;
  resetSchema: (data: Partial<FormSchema> | Partial<FormSchema>[]) => Promise<void>;
  updateSchema: (data: Partial<FormSchemaInner> | Partial<FormSchemaInner>[]) => Promise<void>;
  resetSchema: (data: Partial<FormSchemaInner> | Partial<FormSchemaInner>[]) => Promise<void>;
  setProps: (formProps: Partial<FormProps>) => Promise<void>;
  removeSchemaByField: (field: string | string[]) => Promise<void>;
  appendSchemaByField: (
    schema: FormSchema | FormSchema[],
    schema: FormSchemaInner | FormSchemaInner[],
    prefixField: string | undefined,
    first?: boolean | undefined,
  ) => Promise<void>;
  validateFields: (nameList?: NamePath[]) => Promise<any>;
  validate: (nameList?: NamePath[]) => Promise<any>;
  validate: <T = Recordable>(nameList?: NamePath[] | false) => Promise<T>;
  scrollToField: (name: NamePath, options?: ScrollOptions) => Promise<void>;
  resetDefaultField: (name?: NamePath[]) => void;
}
export type RegisterFn = (formInstance: FormActionType) => void;
@@ -85,6 +86,8 @@
  size?: 'default' | 'small' | 'large';
  // Whether to disable
  disabled?: boolean;
  // Whether to readonly
  readonly?: boolean;
  // Time interval fields are mapped into multiple
  fieldMapToTime?: FieldMapToTime;
  // Placeholder is set automatically
@@ -123,15 +126,22 @@
  transformDateFunc?: (date: any) => string;
  colon?: boolean;
}
export interface FormSchema {
export type RenderOpts = {
  disabled: boolean;
  [key: string]: any;
};
interface BaseFormSchema<T extends ComponentType = any> {
  // Field name
  field: string;
  // Extra Fields name[]
  fields?: string[];
  // Event name triggered by internal value change, default change
  changeEvent?: string;
  // Variable name bound to v-model Default value
  valueField?: string;
  // Label name
  label: string | VNode;
  label?: string | VNode | ((renderCallbackParams: RenderCallbackParams) => string | VNode);
  // Auxiliary text
  subLabel?: string;
  // Help text on the right side of the text
@@ -145,8 +155,6 @@
  labelWidth?: string | number;
  // Disable the adjustment of labelWidth with global settings of formModel, and manually set labelCol and wrapperCol by yourself
  disabledLabelWidth?: boolean;
  // render component
  component: ComponentType;
  // Component parameters
  componentProps?:
    | ((opt: {
@@ -154,13 +162,21 @@
        tableAction: TableActionType;
        formActionType: FormActionType;
        formModel: Recordable;
      }) => Recordable)
    | object;
      }) => ComponentProps[T])
    | ComponentProps[T];
  // Required
  required?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
  suffix?: string | number | ((values: RenderCallbackParams) => string | number);
  suffix?:
    | string
    | number
    | VNode
    | ((renderCallbackParams: RenderCallbackParams) => string | VNode | number);
  prefix?:
    | string
    | number
    | VNode
    | ((renderCallbackParams: RenderCallbackParams) => string | VNode | number);
  // Validation rules
  rules?: Rule[];
  // Check whether the information is added to the label
@@ -175,8 +191,14 @@
  // 默认值
  defaultValue?: any;
  // 额外默认值数组对象
  defaultValueObj?: { [key: string]: any };
  // 是否自动处理与时间相关组件的默认值
  isHandleDateDefaultValue?: boolean;
  // 是否使用valueFormat自动处理默认值
  isHandleDefaultValue?: boolean;
  isAdvanced?: boolean;
@@ -188,26 +210,60 @@
  show?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
  // Render the content in the form-item tag
  render?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string;
  render?: (
    renderCallbackParams: RenderCallbackParams,
    opts: RenderOpts,
  ) => VNode | VNode[] | string;
  // Rendering col content requires outer wrapper form-item
  renderColContent?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string;
  renderColContent?: (
    renderCallbackParams: RenderCallbackParams,
    opts: RenderOpts,
  ) => VNode | VNode[] | string;
  renderComponentContent?:
    | ((renderCallbackParams: RenderCallbackParams) => any)
    | ((renderCallbackParams: RenderCallbackParams, opts: RenderOpts) => any)
    | VNode
    | VNode[]
    | string;
  // Custom slot, in from-item
  slot?: string;
  // Custom slot, similar to renderColContent
  colSlot?: string;
  dynamicDisabled?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
  dynamicReadonly?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
  dynamicRules?: (renderCallbackParams: RenderCallbackParams) => Rule[];
  valueFormat?: (arg: Partial<RenderCallbackParams> & { value: any }) => any;
}
export interface ComponentFormSchema<T extends ComponentType = any> extends BaseFormSchema<T> {
  // render component
  component: T;
}
export interface SlotFormSchema extends BaseFormSchema {
  // Custom slot, in form-item
  slot: string;
}
type ComponentFormSchemaType<T extends ComponentType = ComponentType> = T extends any
  ? ComponentFormSchema<T>
  : never;
export type FormSchema = ComponentFormSchemaType | SlotFormSchema;
export type FormSchemaInner = Partial<ComponentFormSchema> &
  Partial<SlotFormSchema> &
  BaseFormSchema;
export function isSlotFormSchema(schema: FormSchemaInner): schema is SlotFormSchema {
  return 'slot' in schema;
}
export function isComponentFormSchema(schema: FormSchemaInner): schema is ComponentFormSchema {
  return !isSlotFormSchema(schema);
}
export interface HelpComponentProps {
  maxWidth: string;