ProForm.d.ts 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. import { type FormItemRule } from 'element-plus'
  2. export = ProForm
  3. export as namespace ProForm
  4. export interface EnumProps {
  5. label?: string // 选项框显示的文字
  6. value?: string | number | boolean | any[] // 选项框值
  7. disabled?: boolean // 是否禁用此选项
  8. tagType?: string // 当 tag 为 true 时,此选择会指定 tag 显示类型
  9. children?: EnumProps[] // 为树形选择时,可以通过 children 属性指定子选项
  10. [key: string]: any
  11. }
  12. declare namespace ProForm {
  13. // element-plus 表单组件el-标签名,可以新增
  14. type ElTagName =
  15. | 'input'
  16. | 'checkbox'
  17. | 'checkbox-group'
  18. | 'select'
  19. | 'select-v2'
  20. | 'date-picker'
  21. | 'input-number'
  22. | 'select-icon'
  23. | 'tree-select'
  24. | 'cascader'
  25. | 'radio-group'
  26. | 'radio-button'
  27. | 'slot'
  28. | 'rate'
  29. | 'slider'
  30. | 'switch'
  31. | 'time-picker'
  32. | 'time-select'
  33. | 'transfer' // label不显示 使用插槽吧
  34. | 'icon' // 图标
  35. interface FormOptions {
  36. inline?: boolean
  37. labelWidth?: string | number
  38. labelPosition?: 'left' | 'right' | 'top'
  39. disabled?: boolean // 不可编辑
  40. hasFooter?: boolean // 是否显示底部操作按钮
  41. labelSuffix?: ': ' | string
  42. showResetButton?: boolean // 是否展示重置按钮
  43. showCancelButton?: boolean // 是否展示取消按钮
  44. submitButtonText?: string
  45. resetButtonText?: string
  46. cancelButtonText?: string
  47. blockSubmitButton?: boolean // 提交按钮是否以块级按钮呈现
  48. }
  49. interface ItemsOptions {
  50. /** form-item 配置项 */
  51. label?: string
  52. labelWidth?: string | number // 标签宽度,例如 '50px'。 可以使用 auto。
  53. prop: string // prop
  54. value?: any // 默认值
  55. tooltip?: string // 问号,tooltip提示
  56. required?: boolean
  57. rules?: FormItemRule[]
  58. span?: number // 表单col宽度
  59. show?: (params?: any) => Promise<any> | boolean | string // 是否显示 默认显示
  60. /** 表单组件配置项 */
  61. compOptions: CompAttributes // 表单组件配置项
  62. }
  63. interface FormItem {
  64. label?: string
  65. labelWidth?: string | number // 标签宽度,例如 '50px'。 可以使用 auto。
  66. prop: string // prop
  67. value?: any // 默认值
  68. tooltip?: string // 问号,tooltip提示
  69. required?: boolean
  70. rules?: FormItemRule[]
  71. span?: number // 表单col宽度
  72. show?: (params?: any) => Promise<any> | boolean | string // 是否显示 默认显示
  73. // showLabel?: boolean // 是否显示label
  74. // showHelp?: boolean // 是否显示帮助信息
  75. // helpMessage?: string | string[]
  76. // render?: (form: any) => JSX.Element
  77. // renderFormItem?: (form: any) => JSX.Element
  78. // renderComponent?: (form: any) => JSX.Element
  79. // renderComponentContent?: (form: any) => JSX.Element
  80. }
  81. interface CompAttributes {
  82. clearable?: boolean // 是否可清空
  83. showPassword?: boolean // 是否显示切换密码图标
  84. enum?: EnumProps[] | Ref<EnumProps[]> | ((params?: any) => Promise<any>) // 枚举字典
  85. enumKey?: string
  86. labelKey?: string
  87. valueKey?: string
  88. children?: string
  89. placeholder?: string
  90. data?: Record<string, any>[]
  91. multiple?: boolean
  92. elTagName?: ElTagName
  93. type?: string
  94. rangeSeparator?: string // 时间范围分隔符
  95. startPlaceholder?: string // 开始时间Placeholder
  96. endPlaceholder?: string // 开始时间Placeholder
  97. step?: number // 滑块
  98. max?: number
  99. min?: number
  100. rows?: number
  101. filterable?: boolean
  102. allowCreate?: boolean
  103. valueFormat?: string
  104. props?: Record<string, any>
  105. width?: string | number
  106. style?: Record<string, any> | string
  107. appendToBody?: boolean // 树下拉
  108. checkStrictly?: boolean // 可选
  109. renderAfterExpand?: boolean // 可选
  110. controlsPosition?: 'left' | 'right' // 可选
  111. }
  112. }