ElementPlus生成器

Appearance

生成器类型 ​

入口 ​

ts
import TableGenerator from './TableGenerator';
import FormGenerator from './FormGenerator';
import StepsGenerator from './StepsGenerator';
import * as GeneratorUtils from './utils';
export { TableGenerator, FormGenerator, StepsGenerator, GeneratorUtils, };

关于FormGenerator、TableGenerator、StepsGenerator ​

ts
import type { Ref, Component, ExtractPropTypes } from 'vue'
import type { InputProps, InputAutoSize } from 'element-plus/lib/components/input/src/input'
import type { InputNumberProps } from 'element-plus/lib/components/input-number/src/input-number'
import { cascaderProps as CascaderProps } from 'element-plus/lib/components/cascader/src/cascader'
import type { CascaderOption } from 'element-plus/es/components/cascader-panel'
import type { TreeComponentProps } from 'element-plus/lib/components/tree/src/tree.type'
import type { RadioProps } from 'element-plus/lib/components/radio/src/radio'
import type { RadioGroupProps } from 'element-plus/lib/components/radio/src/radio-group'
import type { CheckboxProps } from 'element-plus/lib/components/checkbox/src/checkbox.d'
import type { CheckboxGroupProps } from 'element-plus/lib/components/checkbox/src/checkbox-group'
import type { SwitchProps } from 'element-plus/lib/components/switch/src/switch'
import type { UploadProps } from 'element-plus/lib/components/upload/src/upload'
import type { FormProps } from 'element-plus/lib/components/form/src/form'
import type { FormContext } from 'element-plus/lib/components/form/src/types'
import type { ISelectProps as SelectProps } from 'element-plus/es/components/select-v2/src/token'
import type { FormItemProps } from 'element-plus/lib/components/form/src/form-item'
import type { FormItemRule } from 'element-plus/es/components/form/src/types'
import type { TableProps } from 'element-plus/lib/components/table/index'
import _default from 'element-plus/lib/components/table/src/table-column/defaults'
import { FormItemProp } from 'element-plus/lib/components/form/src/form-item.d.ts'
import type {
  FormEvents,
  InputEvents,
  InputSlots,
  InputNumberEvents,
  SelectEvents,
  SelectSlots,
  TreeEvents,
  CascaderEvents,
  CascaderSlots,
  RadioEvents,
  RadioSlots,
  CheckboxEvents,
  CheckboxSlots,
  DatePickerProps,
  DatePickerEvents,
  DatePickerSlots,
  TimePickerProps,
  TimePickerEvents,
  SwitchEvents,
  UploadSlots,
  Expose,
  TableEvents,
  TableExposes
} from './element-plus'
import type { ValidateFieldsError } from 'async-validator';

/**
 * @description: Form 方法
 * @param resetFields 重置该表单项，将其值重置为初始值，并移除校验结果
 * @param clearValidate 清理某个字段的表单验证信息。
 * @param validate 对整个表单的内容进行验证。 接收一个回调函数，或返回 Promise。
 * @param validateField 验证具体的某个字段。
 * @param scrollToField 滚动到指定的字段
 * @param submit 表单走验证后回调传入的方法
 * @param reset 表单重置并回调submit
 * @param cancel dialog表单返回
 * @param $refs 表单中所有控件expose内容的入口
 */
export declare type RefFormGeneratorObj = {
  validate: (callback?: (isValid: boolean, invalidFields?: ValidateFieldsError) => void) => Promise<void>
  scrollToField: (prop: FormItemProp) => void;
  submit: () => void
  reset: () => void
  cancel: (...arg: any) => void
  $refs: Record<string, Ref<Expose | undefined>>
} & Pick<FormContext, 'resetFields' | 'validateField' | 'clearValidate'>

export declare type RefFormGenerator = () => RefFormGeneratorObj

/**
 * @description: 表单生成配置
 * @param model 表单数据对象
 * @param formOption 表单生成配置
 * @param noFooter 表单底部按钮
 * @param type search:搜索表单 dialog:dialog表单
 * @param column 判断展开收起的长度（包括搜索按钮那个容器）
 * @param slot 插槽（默认插槽是确定、取消按钮那块区域）
 * @param loading  确定按钮loading
 */
export type FormAttrs<T = Record<string, any>> = {
  model: T
  formOption: Array<FormOption>
  noFooter?: boolean
  type?: 'search' | 'dialog'
  column?: number
  slot?: Record<string, ((...args: any[]) => JSX.Element | string | void) | string>
  loading?: boolean
} & CanWrite<Partial<Omit<FormProps, 'model' | 'rules'>>> & FormEvents & {
  onSubmit?: (reset: 'init' | undefined) => void
  onCancel?: (...arg: any) => void
}

/**
 * @description: formItem类型
 * @param prop formItem唯一值
 * @param style 行内样式
 * @param class 类名
 */
type FormItem = {
  prop: string
  style?: string
  class?: string
  rules?: FormItemRule | Array<FormItemRule>
  slots?: {
    label?: ((...args: any[]) => JSX.Element | string | void) | string
    error?: ((...args: any[]) => JSX.Element | string | void) | string
  }
} & CanWrite<Partial<Omit<FormItemProps, 'prop' | 'rules'>>>

/**
 * @description: control类型
 * @param style 行内样式
 * @param class 类名
 */
type Control = {
  style?: string
  class?: string
}

/**
 * @description: 表单生成配置
 * @param type 表单控件类型
 * @param show 是否显示
 * @param formItem form下formItem属性
 * @param control 控件属性
 */
export type FormOption = Input | InputNumber | Select | TreeSelect | Cascader | Radio | RadioButton | Checkbox | CheckboxButton | DatePicker | DateTimePicker | TimePicker | Switch | Upload | Slot

type ControlType = 'input' | 'input-number' | 'select' | 'tree-select' | 'cascader' | 'radio' | 'radio-button' | 'checkbox' | 'checkbox-button' | 'date-picker' | 'date-time-picker' | 'time-picker' | 'switch' | 'upload' | 'slot'

export type Input = {
  type: 'input'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<Omit<InputProps, 'autosize'>>> & InputEvents & InputSlots & Partial<{
    maxlength: string | number,
    minlength: string | number,
    autosize: InputAutoSize
    rows: number
    name: string
    max: number | string
    min: number | string
    step: number | string
    autofocus: boolean
  }>
}

export type InputNumber = {
  type: 'input-number'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<InputNumberProps>> & InputNumberEvents
}

export type TreeSelect = {
  type: 'tree-select'
  show?: boolean
  formItem: FormItem
  control?: Control & Partial<SelectProps> & SelectEvents & SelectSlots & Partial<{
    fitInputWidth: boolean
    remoteShowSuffix: boolean
    suffixIcon: (() => JSX.Element | string | void) | string
    suffixTransition: boolean
    tagType: 'success' | 'info' | 'warning' | 'danger'
    maxCollapseTags: number
  }> & Partial<TreeComponentProps> & TreeEvents & {
    cacheData?: Array<{
      label?: string
      value: string | number
    }>
    slots?: {
      default?: ((...args: any[]) => JSX.Element | string | void) | string
    }
  }
}

export type Select = {
  type: 'select'
  show?: boolean
  formItem: FormItem
  control?: Control & Partial<SelectProps> & SelectEvents & SelectSlots & Partial<{
    fitInputWidth: boolean
    remoteShowSuffix: boolean
    suffixIcon: (() => JSX.Element | string | void) | string
    suffixTransition: boolean
    tagType: 'success' | 'info' | 'warning' | 'danger'
    maxCollapseTags: number
    slots?: {
      default?: ((...args: any[]) => JSX.Element | string | void) | string
      header?: ((...args: any[]) => JSX.Element | string | void) | string
      footer?: ((...args: any[]) => JSX.Element | string | void) | string
      prefix?: ((...args: any[]) => JSX.Element | string | void) | string
      empty?: ((...args: any[]) => JSX.Element | string | void) | string
      tag?: ((...args: any[]) => JSX.Element | string | void) | string
      loading?: ((...args: any[]) => JSX.Element | string | void) | string
    }
  }> & {
    option: Array<{
      label?: string
      value: string | number,
      disabled?: boolean,
      slots?: {
        default?: ((...args: any[]) => JSX.Element | string | void) | string
      }
    }> | Ref<Array<{
      label?: string
      value: string | number,
      disabled?: boolean,
      slots?: {
        default?: ((...args: any[]) => JSX.Element | string | void) | string
      }
    }>>
  }
}

export type Radio = {
  type: 'radio'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<RadioGroupProps>> & { radioGroup: Ref<Array<(Partial<Omit<RadioProps, 'modelValue' | 'label'>> & { value: string | number; label?: string | number } & RadioSlots)>> | Array<(Partial<Omit<RadioProps, 'modelValue' | 'label'>> & { value: string | number; label?: string | number } & RadioSlots)> } & RadioEvents
}

export type RadioButton = {
  type: 'radio-button'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<RadioGroupProps>> & { radioGroup: Ref<Array<(Partial<Omit<RadioProps, 'modelValue' | 'label'>> & { value: string | number; label?: string | number } & RadioSlots)>> | Array<(Partial<Omit<RadioProps, 'modelValue' | 'label'>> & { value: string | number; label?: string | number } & RadioSlots)> } & RadioEvents
}

export type Cascader = {
  type: 'cascader'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<Omit<ExtractPropTypes<typeof CascaderProps>, 'options'>>> & { options?: Ref<Array<CascaderOption>> | Array<CascaderOption> } & Partial<CascaderEvents> & CascaderSlots
}

export type Checkbox = {
  type: 'checkbox'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<CheckboxGroupProps>> & { checkboxGroup: Ref<Array<(Partial<Omit<CheckboxProps, 'modelValue' | 'label'>> & { value: string | number; label?: string | number } & CheckboxSlots)>> | Array<(Partial<Omit<CheckboxProps, 'modelValue' | 'label'>> & { value: string | number; label?: string | number } & CheckboxSlots)> } & CheckboxEvents
}

export type CheckboxButton = {
  type: 'checkbox-button'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<CheckboxGroupProps>> & { checkboxGroup: Ref<Array<(Partial<Omit<CheckboxProps, 'modelValue' | 'label'>> & { value: string | number; label?: string | number } & CheckboxSlots)>> | Array<(Partial<Omit<CheckboxProps, 'modelValue' | 'label'>> & { value: string | number; label?: string | number } & CheckboxSlots)> } & CheckboxEvents
}

export type DatePicker = {
  type: 'date-picker'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<DatePickerProps>> & DatePickerEvents & DatePickerSlots
}

export type DateTimePicker = {
  type: 'date-time-picker'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<DatePickerProps>> & DatePickerEvents & DatePickerSlots
}

export type TimePicker = {
  type: 'time-picker'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<TimePickerProps>> & TimePickerEvents
}

export type Switch = {
  type: 'switch'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<Omit<SwitchProps, 'loading'>>> & { loading?: Ref<boolean> | boolean } & SwitchEvents
}

export type Upload = {
  type: 'upload'
  show?: boolean
  formItem: FormItem
  control?: Control & CanWrite<Partial<UploadProps>> & UploadSlots
}

export type Slot = {
  type: 'slot'
  show?: boolean
  formItem: FormItem
  control?: {
    slots?: Record<string, ((...args: any[]) => JSX.Element | string | void) | string>
  }
}

type FormOptionItemObj = {
  'input': Input
  'input-number': InputNumber
  'select': Select
  'tree-select': TreeSelect
  'cascader': Cascader
  'radio': Radio
  'radio-button': RadioButton
  'checkbox': Checkbox
  'checkbox-button': CheckboxButton
  'date-picker': DatePicker
  'date-time-picker': DateTimePicker
  'time-picker': TimePicker
  'switch': Switch
  'upload': Upload
  'slot': Slot
}

export type FormOptionItem<T extends ControlType = ControlType> = FormOptionItemObj[T]

/**
 * @description: Table 方法
 */
export declare type RefTableGeneratorObj = TableExposes
export declare type RefTableGenerator = () => RefTableGeneratorObj

/**
 * @description: 表格生成配置
 * @param data 表格数据
 * @param tableOption 表格生成配置
 * @param loading 是否加载动画
 */
export type TableAttrs<T = Record<string, any>> = {
  tableOption: Array<TableOption>
  loading?: boolean
  operationWidth?: number
} & Partial<TableProps<T>> & TableEvents

/**
 * @description: 表格生成配置
 * @param prop 表格列key
 * @param label 表格列名称
 * @param type 列的类型
 */
export type TableOption = {
  type?: 'selection' | 'index' | 'expand'
  slots?: Record<string, ((...args: any[]) => JSX.Element | string | void) | string>
  children?: Array<TableOption>
  formatter?: (scope: { $index: number, row: Record<string, any> }) => any
} & Partial<Omit<ExtractPropTypes<typeof _default>, 'type' | 'formatter'>>

export type StepsAttrs = {
  space?: number | string
  direction?: 'vertical' | 'horizontal'
  processStatus?: 'wait' | 'process' | 'finish' | 'error' | 'success'
  finishStatus?: 'wait' | 'process' | 'finish' | 'error' | 'success'
  alignCenter?: boolean
  simple?: boolean
  stepsOption: Array<StepsOption>
  onPrev?: (activeIndex: number, next: (activeIndex?: number) => void) => void
  onNext?: (activeIndex: number, next: (activeIndex?: number) => void) => void
}

export type StepsOption = {
  key: string
  title?: string
  description?: string
  icon?: Component | string
  status?: '' | 'wait' | 'process' | 'finish' | 'error' | 'success'
  slots?: {
    icon?: ((...args: any[]) => JSX.Element | string | void) | string
    title?: ((...args: any[]) => JSX.Element | string | void) | string
    description?: ((...args: any[]) => JSX.Element | string | void) | string
  }
}

type CanWrite<T> = {
  -readonly [K in keyof T]: T[K] extends Record<any, any> ? CanWrite<T[K]> : T[K]
}
ts
import type { TreeNodeData, TreeKey, TreeData } from 'element-plus/lib/components/tree/src/tree.type'
import type { CascaderNode, CascaderValue, CascaderNodeValue, CascaderNodePathValue } from 'element-plus/lib/components/cascader-panel'
import type { EpPropFinalized, EpPropMergeType } from 'element-plus/lib/utils/vue/props/types.d.ts'
import type { IDatePickerType } from 'element-plus/lib/components/date-picker/src/date-picker.type'
import type { GetDisabledHours, GetDisabledMinutes, GetDisabledSeconds } from 'element-plus/lib/components/time-picker/src/props/shared'
import type { SingleOrRange, ModelValueType } from 'element-plus/lib/components/time-picker'
import type { CheckboxValueType } from 'element-plus/lib/components/checkbox/src/checkbox'
import type { CheckboxGroupValueType } from 'element-plus/es/components/checkbox/src/checkbox-group.d'
import type { FormItemProp } from 'element-plus/lib/components/form/src/form-item.d.ts'
import type { UploadFile, UploadStatus, UploadRawFile } from 'element-plus/lib/components/upload/src/upload.d.ts'
import type { Options } from '@popperjs/core'
import type { ExtractPropTypes, PropType, Component, ComputedOptions, MethodOptions, ShallowRef, ComputedRef, StyleValue, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps,DefineComponent } from 'vue'

export type DatePickerProps = ExtractPropTypes<{
  type: EpPropFinalized<(new (...args: any[]) => IDatePickerType & {}) | (() => IDatePickerType) | ((new (...args: any[]) => IDatePickerType & {}) | (() => IDatePickerType))[], unknown, unknown, "date", boolean>;
  disabledDate: {
    readonly type: PropType<Function>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  cellClassName: {
    readonly type: PropType<Function>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  shortcuts: EpPropFinalized<ArrayConstructor, unknown, unknown, () => never[], boolean>;
  arrowControl: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
  label: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;
  tabindex: EpPropFinalized<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown, 0, boolean>;
  validateEvent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
  unlinkPanels: BooleanConstructor;
  disabledHours: {
    readonly type: PropType<GetDisabledHours>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  disabledMinutes: {
    readonly type: PropType<GetDisabledMinutes>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  disabledSeconds: {
    readonly type: PropType<GetDisabledSeconds>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  id: {
    readonly type: PropType<EpPropMergeType<(new (...args: any[]) => SingleOrRange<string> & {}) | (() => SingleOrRange<string>) | ((new (...args: any[]) => SingleOrRange<string> & {}) | (() => SingleOrRange<string>))[], unknown, unknown>>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  name: EpPropFinalized<(new (...args: any[]) => SingleOrRange<string> & {}) | (() => SingleOrRange<string>) | ((new (...args: any[]) => SingleOrRange<string> & {}) | (() => SingleOrRange<string>))[], unknown, unknown, "", boolean>;
  popperClass: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
  format: StringConstructor;
  valueFormat: StringConstructor;
  clearable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
  clearIcon: EpPropFinalized<(new (...args: any[]) => (string | Component<any, any, any, ComputedOptions, MethodOptions>) & {}) | (() => string | Component<any, any, any, ComputedOptions, MethodOptions>) | ((new (...args: any[]) => (string | Component<any, any, any, ComputedOptions, MethodOptions>) & {}) | (() => string | Component<any, any, any, ComputedOptions, MethodOptions>))[], unknown, unknown, DefineComponent<{}, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{}>>, {}>, boolean>;
  editable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
  prefixIcon: EpPropFinalized<(new (...args: any[]) => (string | Component<any, any, any, ComputedOptions, MethodOptions>) & {}) | (() => string | Component<any, any, any, ComputedOptions, MethodOptions>) | ((new (...args: any[]) => (string | Component<any, any, any, ComputedOptions, MethodOptions>) & {}) | (() => string | Component<any, any, any, ComputedOptions, MethodOptions>))[], unknown, unknown, "", boolean>;
  size: {
    readonly type: PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  readonly: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
  disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
  placeholder: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
  popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | ((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>))[], unknown, unknown, () => {}, boolean>;
  modelValue: EpPropFinalized<(new (...args: any[]) => ModelValueType & {}) | (() => ModelValueType) | ((new (...args: any[]) => ModelValueType & {}) | (() => ModelValueType))[], unknown, unknown, "", boolean>;
  rangeSeparator: EpPropFinalized<StringConstructor, unknown, unknown, "-", boolean>;
  startPlaceholder: StringConstructor;
  endPlaceholder: StringConstructor;
  defaultValue: {
    readonly type: PropType<EpPropMergeType<(new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>) | ((new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>))[], unknown, unknown>>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  defaultTime: {
    readonly type: PropType<EpPropMergeType<(new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>) | ((new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>))[], unknown, unknown>>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  isRange: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
}>

export type TimePickerProps = ExtractPropTypes<{
  isRange: {
    type: BooleanConstructor;
    default: boolean;
  };
  disabledDate: {
    readonly type: PropType<Function>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  cellClassName: {
    readonly type: PropType<Function>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  shortcuts: EpPropFinalized<ArrayConstructor, unknown, unknown, () => never[], boolean>;
  arrowControl: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
  label: EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;
  tabindex: EpPropFinalized<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown, 0, boolean>;
  validateEvent: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
  unlinkPanels: BooleanConstructor;
  disabledHours: {
    readonly type: PropType<GetDisabledHours>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  disabledMinutes: {
    readonly type: PropType<GetDisabledMinutes>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  disabledSeconds: {
    readonly type: PropType<GetDisabledSeconds>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  id: {
    readonly type: PropType<EpPropMergeType<(new (...args: any[]) => SingleOrRange<string> & {}) | (() => SingleOrRange<string>) | ((new (...args: any[]) => SingleOrRange<string> & {}) | (() => SingleOrRange<string>))[], unknown, unknown>>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  name: EpPropFinalized<(new (...args: any[]) => SingleOrRange<string> & {}) | (() => SingleOrRange<string>) | ((new (...args: any[]) => SingleOrRange<string> & {}) | (() => SingleOrRange<string>))[], unknown, unknown, "", boolean>;
  popperClass: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
  format: StringConstructor;
  valueFormat: StringConstructor;
  type: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
  clearable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
  clearIcon: EpPropFinalized<(new (...args: any[]) => (string | Component<any, any, any, ComputedOptions, MethodOptions>) & {}) | (() => string | Component<any, any, any, ComputedOptions, MethodOptions>) | ((new (...args: any[]) => (string | Component<any, any, any, ComputedOptions, MethodOptions>) & {}) | (() => string | Component<any, any, any, ComputedOptions, MethodOptions>))[], unknown, unknown, DefineComponent<{}, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<{}>>, {}>, boolean>;
  editable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
  prefixIcon: EpPropFinalized<(new (...args: any[]) => (string | Component<any, any, any, ComputedOptions, MethodOptions>) & {}) | (() => string | Component<any, any, any, ComputedOptions, MethodOptions>) | ((new (...args: any[]) => (string | Component<any, any, any, ComputedOptions, MethodOptions>) & {}) | (() => string | Component<any, any, any, ComputedOptions, MethodOptions>))[], unknown, unknown, "", boolean>;
  size: {
    readonly type: PropType<EpPropMergeType<StringConstructor, "" | "default" | "small" | "large", never>>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  readonly: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
  disabled: EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
  placeholder: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
  popperOptions: EpPropFinalized<(new (...args: any[]) => Partial<Options>) | (() => Partial<Options>) | ((new (...args: any[]) => Partial<Options>) | (() => Partial<Options>))[], unknown, unknown, () => {}, boolean>;
  modelValue: EpPropFinalized<(new (...args: any[]) => ModelValueType & {}) | (() => ModelValueType) | ((new (...args: any[]) => ModelValueType & {}) | (() => ModelValueType))[], unknown, unknown, "", boolean>;
  rangeSeparator: EpPropFinalized<StringConstructor, unknown, unknown, "-", boolean>;
  startPlaceholder: StringConstructor;
  endPlaceholder: StringConstructor;
  defaultValue: {
    readonly type: PropType<EpPropMergeType<(new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>) | ((new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>))[], unknown, unknown>>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
  defaultTime: {
    readonly type: PropType<EpPropMergeType<(new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>) | ((new (...args: any[]) => Date | [Date, Date]) | (() => SingleOrRange<Date>))[], unknown, unknown>>;
    readonly required: false;
    readonly validator: ((val: unknown) => boolean) | undefined;
    __epPropKey: true;
  };
}>

export type InputEvents = {
  "onUpdate:modelValue"?: ((value: string) => any) | undefined;
  onChange?: ((value: string) => any) | undefined;
  onInput?: ((value: string) => any) | undefined;
  onFocus?: ((evt: FocusEvent) => any) | undefined;
  onBlur?: ((evt: FocusEvent) => any) | undefined;
  onClear?: (() => any) | undefined;
}

export type InputNumberEvents = {
  onChange?: (currentValue: number | undefined, oldValue: number | undefined) => void;
  onFocus?: ((evt: FocusEvent) => any) | undefined;
  onBlur?: ((evt: FocusEvent) => any) | undefined;
}

export type SelectEvents = {
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
  onChange?: ((...args: any[]) => any) | undefined;
  onFocus?: ((...args: any[]) => any) | undefined;
  onBlur?: ((...args: any[]) => any) | undefined;
  onClear?: ((...args: any[]) => any) | undefined;
  onVisibleChange?: ((...args: any[]) => any) | undefined;
  onRemoveTag?: ((...args: any[]) => any) | undefined;
}

export type TreeEvents = {
  onCurrentChange?: ((...args: any[]) => any) | undefined;
  onNodeExpand?: ((...args: any[]) => any) | undefined;
  onCheck?: ((...args: any[]) => any) | undefined;
  onCheckChange?: ((...args: any[]) => any) | undefined;
  onNodeClick?: ((...args: any[]) => any) | undefined;
  onNodeContextmenu?: ((...args: any[]) => any) | undefined;
  onNodeCollapse?: ((...args: any[]) => any) | undefined;
  onNodeDragStart?: ((...args: any[]) => any) | undefined;
  onNodeDragEnd?: ((...args: any[]) => any) | undefined;
  onNodeDrop?: ((...args: any[]) => any) | undefined;
  onNodeDragLeave?: ((...args: any[]) => any) | undefined;
  onNodeDragEnter?: ((...args: any[]) => any) | undefined;
  onNodeDragOver?: ((...args: any[]) => any) | undefined;
}

export type CascaderEvents = {
  "onUpdate:modelValue"?: ((val: CascaderValue) => any) | undefined;
  onChange?: ((val: CascaderValue) => any) | undefined;
  onFocus?: ((evt: FocusEvent) => any) | undefined;
  onBlur?: ((evt: FocusEvent) => any) | undefined;
  onVisibleChange?: ((val: boolean) => any) | undefined;
  onExpandChange?: ((val: CascaderValue) => any) | undefined;
  onRemoveTag?: ((val: CascaderNodeValue | CascaderNodePathValue) => any) | undefined;
}

export type RadioEvents = {
  onChange?: ((val: string | number | boolean) => any) | undefined;
  "onUpdate:modelValue"?: ((val: string | number | boolean) => any) | undefined;
}

export type CheckboxEvents = {
  onChange?: ((val: CheckboxValueType[]) => any) | undefined;
  "onUpdate:modelValue"?: ((val: CheckboxGroupValueType) => any) | undefined;
}

export type DatePickerEvents = {
  onChange?: ((...args: any[]) => any) | undefined;
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
  onFocus?: ((...args: any[]) => any) | undefined;
  onBlur?: ((...args: any[]) => any) | undefined;
  onClear?: ((...args: any[]) => any) | undefined;
  onVisibleChange?: ((...args: any[]) => any) | undefined;
  onCalendarChange?: ((...args: any[]) => any) | undefined;
  onPanelChange?: ((...args: any[]) => any) | undefined;
}

export type TimePickerEvents = {
  onChange?: ((...args: any[]) => any) | undefined;
  "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
  onFocus?: ((...args: any[]) => any) | undefined;
  onBlur?: ((...args: any[]) => any) | undefined;
  onClear?: ((...args: any[]) => any) | undefined;
  onVisibleChange?: ((...args: any[]) => any) | undefined;
}
export type SwitchEvents = {
  onChange?: ((val: string | number | boolean) => any) | undefined;
  "onUpdate:modelValue"?: ((val: string | number | boolean) => any) | undefined;
  onInput?: ((val: string | number | boolean) => any) | undefined;
}

export type FormEvents = {
  onValidate?: ((prop: FormItemProp, isValid: boolean, message: string) => any) | undefined;
}

export type TableEvents = {
  onSelect?: ((...args: any[]) => any) | undefined;
  onExpandChange?: ((...args: any[]) => any) | undefined;
  onCurrentChange?: ((...args: any[]) => any) | undefined;
  onSelectAll?: ((...args: any[]) => any) | undefined;
  onSelectionChange?: ((...args: any[]) => any) | undefined;
  onCellMouseEnter?: ((...args: any[]) => any) | undefined;
  onCellMouseLeave?: ((...args: any[]) => any) | undefined;
  onCellContextmenu?: ((...args: any[]) => any) | undefined;
  onCellClick?: ((...args: any[]) => any) | undefined;
  onCellDblclick?: ((...args: any[]) => any) | undefined;
  onRowClick?: ((...args: any[]) => any) | undefined;
  onRowContextmenu?: ((...args: any[]) => any) | undefined;
  onRowDblclick?: ((...args: any[]) => any) | undefined;
  onHeaderClick?: ((...args: any[]) => any) | undefined;
  onHeaderContextmenu?: ((...args: any[]) => any) | undefined;
  onSortChange?: ((...args: any[]) => any) | undefined;
  onFilterChange?: ((...args: any[]) => any) | undefined;
  onHeaderDragend?: ((...args: any[]) => any) | undefined;
}

export type InputSlots = {
  slots?: {
    prefix?: ((...args: any[]) => JSX.Element | string | void) | string
    suffix?: ((...args: any[]) => JSX.Element | string | void) | string
    prepend?: ((...args: any[]) => JSX.Element | string | void) | string
    append?: ((...args: any[]) => JSX.Element | string | void) | string
  }
}

export type SelectSlots = {
  slots?: {
    prefix?: ((...args: any[]) => JSX.Element | string | void) | string
    empty?: ((...args: any[]) => JSX.Element | string | void) | string
  }
}

export type CascaderSlots = {
  slots?: {
    default?: ((...args: any[]) => JSX.Element | string | void) | string
    empty?: ((...args: any[]) => JSX.Element | string | void) | string
  }
}

export type RadioSlots = {
  slots?: {
    default?: ((...args: any[]) => JSX.Element | string | void) | string
  }
}

export type CheckboxSlots = {
  slots?: {
    default?: ((...args: any[]) => JSX.Element | string | void) | string
  }
}

export type DatePickerSlots = {
  slots?: {
    default?: ((...args: any[]) => JSX.Element | string | void) | string
    rangeSeparator?: ((...args: any[]) => JSX.Element | string | void) | string
  }
}

export type UploadSlots = {
  slots?: {
    default?: ((...args: any[]) => JSX.Element | string | void) | string
    trigger?: ((...args: any[]) => JSX.Element | string | void) | string
    tip?: ((...args: any[]) => JSX.Element | string | void) | string
    file?: ((...args: any[]) => JSX.Element | string | void) | string
  }
}

export type InputExposes = {
  blur: () => void;
  clear: () => void;
  focus: () => void;
  input: ShallowRef<HTMLInputElement | undefined>;
  ref: ComputedRef<HTMLInputElement | HTMLTextAreaElement | undefined>;
  resizeTextarea: () => void;
  select: () => void;
  textarea: ShallowRef<HTMLTextAreaElement | undefined>;
  textareaStyle: ComputedRef<StyleValue>;
}

export type InputNumberExposes = {
  blur: () => void;
  focus: () => void;
}

export type CascaderExposes = {
  getCheckedNodes: (leafOnly: boolean) => CascaderNode[] | undefined;
  cascaderPanelRef: ComputedRef<any>;
  togglePopperVisible: (visible?: boolean) => void;
  contentRef: ComputedRef<any>;
}

export type DatePickerExposes = {
  focus: () => void;
  handleOpen: () => void;
  handleClose: () => void;
}

export type TimePickerExposes = {
  focus: () => void;
  blur: () => void;
  handleOpen: () => void;
  handleClose: () => void;
}

export type SelectExposes = {
  focus: () => void;
  blur: () => void;
}

export type SwitchExposes = {
  blur: () => void;
}

export type TreeExposes = {
  filter: (value: any) => void;
  getCheckedNodes: (leafOnly?: boolean | undefined, includeHalfChecked?: boolean | undefined) => TreeNodeData[];
  getCheckedKeys: (leafOnly?: boolean | undefined) => TreeKey[];
  getCurrentNode: () => TreeNodeData;
  getCurrentKey: () => any;
  setCheckedNodes: (nodes: Node[], leafOnly?: boolean | undefined) => void;
  setCheckedKeys: (keys: TreeKey[], leafOnly?: boolean | undefined) => void;
  setChecked: (data: TreeKey | TreeNodeData, checked: boolean, deep: boolean) => void;
  getHalfCheckedNodes: () => TreeNodeData[];
  getHalfCheckedKeys: () => TreeKey[];
  setCurrentNode: (node: Node, shouldAutoExpandParent?: boolean) => void;
  setCurrentKey: (key?: TreeKey | undefined, shouldAutoExpandParent?: boolean) => void;
  getNode: (data: TreeKey | TreeNodeData) => Node;
  remove: (data: TreeNodeData | Node) => void;
  append: (data: TreeNodeData, parentNode: TreeNodeData | TreeKey | Node) => void;
  insertBefore: (data: TreeNodeData, refNode: TreeKey | TreeNodeData | Node) => void;
  insertAfter: (data: TreeNodeData, refNode: TreeKey | TreeNodeData | Node) => void;
  updateKeyChildren: (key: TreeKey, data: TreeData) => void;
}

export type UploadExposes = {
  abort: (file: UploadFile) => void;
  submit: () => void;
  clearFiles: (states?: UploadStatus[]) => void;
  handleStart: (rawFile: UploadRawFile) => void;
  handleRemove: (file: UploadFile | UploadRawFile, rawFile?: UploadRawFile | undefined) => void;
}
export type TableExposes = {
  clearSelection: () => void;
  getSelectionRows: () => any;
  toggleRowSelection: (row: any, selected: boolean) => void;
  toggleAllSelection: () => void;
  toggleRowExpansion: (row: any, expanded?: boolean | undefined) => void;
  setCurrentRow: (row: any) => void;
  clearSort: () => void;
  clearFilter: (columnKeys: string[]) => void;
  doLayout: () => void;
  sort: (prop: string, order: string) => void;
  scrollTo: (options: number | ScrollToOptions, yCoord?: number | undefined) => void;
  setScrollLeft: (left?: number | undefined) => void;
  setScrollTop: (top?: number | undefined) => void;
}

export type Expose = Partial<InputExposes & InputNumberExposes & CascaderExposes & DatePickerExposes & TimePickerExposes & SelectExposes & SwitchExposes & TreeExposes & UploadExposes>

关于GeneratorUtils ​

ts
import type { FormOption } from './type.d';
type option = {
    label: string;
    value: string;
};
/**
 * @description: 生成表单控件使用的option
 * @param arr 原始list
 * @param label 赋值label的key名
 * @param value 赋值value的key名
 * @param custom 自定义需要合并的对象
 */
export declare const getOption: (arr: Record<string, string>[] | string[], label: string, value: string, custom?: {}) => option[];
/**
 * @description: 生成校验配置
 * @param formOption 表单配置 formOption[]
 * @param omit 不需要验证的key  string[]
 * @return formOption
 */
export declare const setRequired: (formOption: Pick<FormOption, 'type' | 'formItem'>[], omit?: string[]) => Pick<FormOption, 'type' | 'formItem'>[];
export {};