km-web/src/typings/ProForm.d.ts

import { type FormItemRule } from 'element-plus'
export = ProForm
export as namespace ProForm
export interface EnumProps {
  label?: string // 选项框显示的文字
  value?: string | number | boolean | any[] // 选项框值
  disabled?: boolean // 是否禁用此选项
  tagType?: string // 当 tag 为 true 时，此选择会指定 tag 显示类型
  children?: EnumProps[] // 为树形选择时，可以通过 children 属性指定子选项
  [key: string]: any
}
declare namespace ProForm {
  // element-plus 表单组件el-标签名，可以新增
  type ElTagName =
    | 'input'
    | 'checkbox'
    | 'checkbox-group'
    | 'select'
    | 'select-v2'
    | 'date-picker'
    | 'input-number'
    | 'select-icon'
    | 'tree-select'
    | 'cascader'
    | 'radio-group'
    | 'radio-button'
    | 'file-upload'
    | 'slot'
    | 'rate'
    | 'slider'
    | 'switch'
    | 'time-picker'
    | 'time-select'
    | 'transfer' // label不显示 使用插槽吧
    | 'icon' // 图标
  interface FormOptions {
    inline?: boolean
    labelWidth?: string | number
    labelPosition?: 'left' | 'right' | 'top'
    disabled?: boolean // 不可编辑
    hasFooter?: boolean // 是否显示底部操作按钮
    labelSuffix?: ': ' | string
    showResetButton?: boolean // 是否展示重置按钮
    showCancelButton?: boolean // 是否展示取消按钮
    submitButtonText?: string
    resetButtonText?: string
    cancelButtonText?: string
    blockSubmitButton?: boolean // 提交按钮是否以块级按钮呈现
  }

  interface ItemsOptions {
    /** form-item 配置项 */
    label?: string
    labelWidth?: string | number // 标签宽度，例如 '50px'。 可以使用 auto。
    prop: string // prop
    tooltip?: string // 问号，tooltip提示
    required?: boolean
    hideLabelSuffix?: boolean // label后缀是否隐藏
    rules?: FormItemRule[]
    span?: number // 表单col宽度
    show?: (params?: any) => Promise<any> | boolean | string // 是否显示 默认显示
    /** 表单组件配置项 */
    compOptions: CompAttributes // 表单组件配置项
  }
  interface FormItem {
    label?: string
    labelWidth?: string | number // 标签宽度，例如 '50px'。 可以使用 auto。
    prop: string // prop
    value?: any // 默认值
    tooltip?: string // 问号，tooltip提示
    required?: boolean
    rules?: FormItemRule[]
    span?: number // 表单col宽度
    show?: (params?: any) => Promise<any> | boolean | string // 是否显示 默认显示
    // showLabel?: boolean // 是否显示label
    // showHelp?: boolean // 是否显示帮助信息
    // helpMessage?: string | string[]
    // render?: (form: any) => JSX.Element
    // renderFormItem?: (form: any) => JSX.Element
    // renderComponent?: (form: any) => JSX.Element
    // renderComponentContent?: (form: any) => JSX.Element
  }
  interface CompAttributes {
    clearable?: boolean // 是否可清空
    showPassword?: boolean // 是否显示切换密码图标
    enum?: EnumProps[] | Ref<EnumProps[]> | ((params?: any) => Promise<any>) // 枚举字典
    value?: string | number | boolean | any[] // 选项框值
    enumKey?: string
    labelKey?: string
    valueKey?: string
    children?: string
    placeholder?: string
    data?: Record<string, any>[]
    multiple?: boolean
    disabled?: boolean
    elTagName?: ElTagName
    type?: string
    rangeSeparator?: string // 时间范围分隔符
    startPlaceholder?: string // 开始时间Placeholder
    endPlaceholder?: string // 开始时间Placeholder
    step?: number // 滑块
    max?: number
    min?: number
    rows?: number
    filterable?: boolean
    allowCreate?: boolean
    valueFormat?: string
    props?: Record<string, any>
    width?: string | number
    style?: Record<string, any> | string
    appendToBody?: boolean // 树下拉
    checkStrictly?: boolean // 可选
    renderAfterExpand?: boolean // 可选
    controlsPosition?: 'left' | 'right' // 可选
    onChange?: (value: any) => void
    onSelect?: (value: any) => void
    onRemove?: (value: any) => void
    onClear?: () => void
    onFocus?: () => void
    onBlur?: () => void
    onInput?: (value: any) => void
    onSearch?: (value: any) => void
    onVisibleChange?: (value: any) => void
    onExpand?: (value: any) => void
    onCheck?: (value: any) => void
  }
}