@newview/ui 0.0.1

package/types/ComForm.d.ts

@@ -0,0 +1,1660 @@
+import { BaseInstance } from "@newview/base-vue";
+
+export declare class ComFormInstance extends BaseInstance {
+    /**
+     * 获取孩子节点
+     * @param datas 
+     * @param pId 
+     * @param pIdFiled 
+     * @returns 
+     */
+    getChildData(datas: any[], pId: any, pIdFiled: string): any[];
+
+    // 响应式方法 | xxx = () => {}
+    /**
+     * 转换为Tree数据
+     * @param prop 
+     * @returns 
+     */
+    convertTreeData(prop: ConvertTreeDataProp): any[];
+}
+
+/**
+ * IconSelect Prop
+ */
+export interface IconSelectProp {
+    /**
+     * 提示信息
+     */
+    placeholder?: string,
+    /**
+     * 宽度，默认为100%
+     */
+    width?: number,
+    /**
+     * 弹出框宽度
+     */
+    poptipWidth?: number,
+    /**
+     * 只读
+     */
+    readonly?: boolean,
+    /**
+     * 在选项状态发生改变时触发，返回当前选中的项。通过修改外部的数据改变时不会触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * 数据转换参数
+ */
+export interface ConvertTreeDataProp {
+    /**
+     * 需要转换的数据
+     */
+    datas: any[],
+    /**
+     * 标题字段
+     */
+    titleField: string,
+    /**
+     * 值字段
+     */
+    valueField?: string,
+    /**
+     * 父节点Id
+     */
+    pIdField?: string,
+    /**
+     * 增加的根节点标题
+     */
+    rootTitle?: string,
+    /**
+     * 增加的根节点值
+     */
+    rootValue?: any,
+    /**
+     * 是否展开，true: 展开所有 false: 不展开 1: 展开一级节点
+     */
+    expandAll?: boolean | 1,
+}
+
+/**
+ * Switch 参数
+ */
+export interface SwitchProp {
+    /**
+     * 开关的尺寸，可选值为`large`、`small`、`default`或者不写。建议开关如果使用了2个汉字的文字，使用 large。
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 禁用开关
+     */
+    disabled?: boolean;
+
+    /**
+     * 选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用
+     */
+    'true-value'?: string | number | boolean;
+
+    /**
+     * 没有选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用
+     */
+    'false-value'?: string | number | boolean;
+
+    /**
+     * 自定义打开时的背景色
+     */
+    'true-color'?: string;
+
+    /**
+     * 自定义关闭时的背景色
+     */
+    'false-color'?: string;
+
+    /**
+     * 返回 Promise 可以阻止切换
+     */
+    'before-change'?: Function;
+
+    /**
+     * 加载中的开关
+     */
+    loading?: boolean;
+
+    /**
+     * 开关变化时触发，返回当前的状态
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * Button 参数
+ */
+export interface ButtonProp {
+    /**
+     * 按钮类型，可选值为 `default`、`primary`、`dashed`、`text`、`info`、`success`、`warning`、`error`或者不设置
+     */
+    type?: '' | 'default' | 'primary' | 'dashed' | 'text' | 'info' | 'success' | 'warning' | 'error';
+
+    /**
+     * 幽灵属性，使按钮背景透明
+     */
+    ghost?: boolean;
+
+    /**
+     * 按钮大小，可选值为 `large`、`small`、`default` 或者不设置
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 按钮形状，可选值为 `circle` 或者不设置
+     */
+    shape?: string;
+
+    /**
+     * 开启后，按钮的长度为 100%
+     */
+    long?: boolean;
+
+    /**
+     * 设置 `button` 原生的 `type`，可选值为 `button`、`submit`、`reset`
+     */
+    'html-type'?: 'button' | 'submit' | 'reset';
+
+    /**
+     * 设置按钮为禁用状态
+     */
+    disabled?: boolean;
+
+    /**
+     * 设置按钮为加载中状态
+     */
+    loading?: boolean;
+
+    /**
+     * 设置按钮的图标类型
+     */
+    icon?: string;
+
+    /**
+     * 设置按钮的自定义图标
+     */
+    'custom-icon'?: string;
+
+    /**
+     * 点击时触发
+     */
+    onClick?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * Input 参数
+ */
+export interface InputProp {
+    /**
+     * 输入框类型，可选值为 `text`、`password`、`textarea`、`url`、`email`、`date`、`number`、`tel`
+     */
+    type?: 'text' | 'password' | 'textarea' | 'url' | 'email' | 'date' | 'number' | 'tel';
+
+    /**
+     * 输入框尺寸，可选值为`large`、`small`、`default`或者不设置
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 占位文本
+     */
+    placeholder?: string;
+
+    /**
+     * 是否显示清空按钮
+     */
+    clearable?: boolean;
+
+    /**
+     * 是否显示边框
+     */
+    border?: boolean;
+
+    /**
+     * 设置输入框为禁用状态
+     */
+    disabled?: boolean;
+
+    /**
+     * 设置输入框为只读
+     */
+    readonly?: boolean;
+
+    /**
+     * 最大输入长度
+     */
+    maxlength?: number;
+
+    /**
+     * 是否显示输入字数统计，可以配合 maxlength 使用
+     */
+    'show-word-limit'?: boolean;
+
+    /**
+     * 是否显示切换密码图标
+     */
+    password?: boolean;
+
+    /**
+     * 输入框尾部图标，仅在 text 类型下有效
+     */
+    icon?: string;
+
+    /**
+     * 输入框头部图标
+     */
+    prefix?: string;
+
+    /**
+     * 输入框尾部图标
+     */
+    suffix?: string;
+
+    /**
+     * 前置内容，仅在 text 类型下有效
+     */
+    prepend?: string;
+
+    /**
+     * 后置内容，仅在 text 类型下有效
+     */
+    append?: string;
+
+    /**
+     * 是否显示为搜索型输入框
+     */
+    search?: boolean;
+
+    /**
+     * 开启 search 时可用，是否有确认按钮，可设为按钮文字
+     */
+    'enter-button'?: boolean | string;
+
+    /**
+     * 文本域默认行数，仅在 textarea 类型下有效
+     */
+    rows?: number;
+
+    /**
+     * 自适应内容高度，仅在 textarea 类型下有效，可传入对象，如 { minRows: 2, maxRows: 6 }
+     */
+    autosize?: boolean | object;
+
+    /**
+     * 将用户的输入转换为 Number 类型
+     */
+    number?: boolean;
+
+    /**
+     * 自动获取焦点
+     */
+    autofocus?: boolean;
+
+    /**
+     * 原生的自动完成功能
+     */
+    autocomplete?: string;
+
+    /**
+     * 给表单元素设置 `id`，详见 Form 用法。
+     */
+    'element-id'?: string;
+
+    /**
+     * 原生的 spellcheck 属性
+     */
+    spellcheck?: boolean;
+
+    /**
+     * 原生的 wrap 属性，可选值为 hard 和 soft，仅在 textarea 下生效
+     */
+    wrap?: 'hard' | 'soft';
+
+    /**
+     * 按下回车键时触发
+     */
+    onEnter?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 设置 icon 属性后，点击图标时触发
+     */
+    onClick?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 数据改变时触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 输入框聚焦时触发
+     */
+    onFocus?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 输入框失去焦点时触发
+     */
+    onBlur?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 原生的 keyup 事件
+     */
+    onKeyup?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 原生的 keydown 事件
+     */
+    onKeydown?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 原生的 keypress 事件
+     */
+    onKeypress?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 开启 search 时可用，点击搜索或按下回车键时触发
+     */
+    onSearch?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 开启 clearable 时可用，点击清空按钮时触发
+     */
+    onClear?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * InputNumber 参数
+ */
+export interface InputNumberProp {
+    /**
+     * 最大值
+     */
+    max?: number;
+
+    /**
+     * 最小值
+     */
+    min?: number;
+
+    /**
+     * 按钮位置是否置于两侧
+     */
+    'controls-outside'?: boolean;
+
+    /**
+     * 每次改变的步伐，可以是小数
+     */
+    step?: number;
+
+    /**
+     * 输入框尺寸，可选值为`large`、`small`、`default`或者不填
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 设置禁用状态
+     */
+    disabled?: boolean;
+
+    /**
+     * 占位文本
+     */
+    placeholder?: string;
+
+    /**
+     * 指定输入框展示值的格式
+     */
+    formatter?: Function;
+
+    /**
+     * 指定从 formatter 里转换回数字的方式，和 formatter 搭配使用
+     */
+    parser?: Function;
+
+    /**
+     * 是否设置为只读
+     */
+    readonly?: boolean;
+
+    /**
+     * 是否可编辑
+     */
+    editable?: boolean;
+
+    /**
+     * 数值精度
+     */
+    precision?: number;
+
+    /**
+     * 给表单元素设置 `id`，详见 Form 用法。
+     */
+    'element-id'?: string;
+
+    /**
+     * 是否实时响应数据，设置为 false 时，只会在失焦时更改数据
+     */
+    'active-change'?: boolean;
+
+    /**
+     * 数值改变时的回调，返回当前值
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 聚焦时触发
+     */
+    onFocus?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 失焦时触发
+     */
+    onBlur?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * 项参数
+ */
+export interface OptionProp {
+    /**
+     * 值
+     */
+    value?: any,
+    /**
+     * 文本
+     */
+    text?: string
+}
+
+/**
+ * Select 参数
+ */
+export interface SelectProp {
+    /**
+     * 数据
+     */
+    datas: OptionProp[];
+    /**
+     * 是否支持多选
+     */
+    multiple?: boolean;
+
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+
+    /**
+     * 是否可以清空选项，只在单选时有效
+     */
+    clearable?: boolean;
+
+    /**
+     * 是否支持搜索
+     */
+    filterable?: boolean;
+
+    /**
+     * 在搜索时，是否只按照 label 进行搜索
+     */
+    'filter-by-label'?: boolean;
+
+    /**
+     * 远程搜索的方法
+     */
+    'remote-method'?: Function;
+
+    /**
+     * 当前是否正在远程搜索
+     */
+    loading?: boolean;
+
+    /**
+     * 远程搜索中的文字提示
+     */
+    'loading-text'?: string;
+
+    /**
+     * 远程搜索时，显示默认 label，详见示例
+     */
+    'default-label'?: string | number | any[];
+
+    /**
+     * 选择框大小，可选值为`large`、`small`、`default`或者不填
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 选择框默认文字
+     */
+    placeholder?: string;
+
+    /**
+     * 当下拉列表为空时显示的内容
+     */
+    'not-found-text'?: string;
+
+    /**
+     * 在返回选项时，是否将 label 和 value 一并返回，默认只返回 value
+     */
+    'label-in-value'?: boolean;
+
+    /**
+     * 弹窗的展开方向，可选值为 `top`、`bottom`、`top-start`、`bottom-start`、`top-end`、`bottom-end`
+     */
+    placement?: 'bottom' | 'top' | 'top-start' | 'bottom-start' | 'top-end' | 'bottom-end';
+
+    /**
+     * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+     */
+    transfer?: boolean;
+
+    /**
+     * 给表单元素设置 `id`，详见 Form 用法。
+     */
+    'element-id'?: string;
+
+    /**
+     * 开启 transfer 时，给浮层添加额外的 class 名称
+     */
+    'transfer-class-name'?: string;
+
+    /**
+     * 在 Select 内显示图标
+     */
+    prefix?: string;
+
+    /**
+     * 多选时最多显示多少个 tag
+     */
+    'max-tag-count'?: number;
+
+    /**
+     * 隐藏 tag 时显示的内容，参数是剩余项数量
+     */
+    'max-tag-placeholder'?: Function;
+
+    /**
+     * 是否允许用户创建新条目，需开启 filterable
+     */
+    'allow-create'?: boolean;
+
+    /**
+     * 是否开启 capture 模式，也可通过全局配置
+     */
+    capture?: boolean;
+
+    /**
+     * 是否开启 Popper 的 eventsEnabled 属性，开启可能会牺牲一定的性能
+     */
+    'events-enabled'?: boolean;
+
+    /**
+     * 选中的`Option`变化时触发，默认返回 value，如需返回 label，详见 label-in-value 属性
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 搜索词改变时触发
+     */
+    onQueryChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 点击清空按钮时触发
+     */
+    onClear?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 下拉框展开或收起时触发
+     */
+    onOpenChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 新建条目时触发
+     */
+    onCreate?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 选择项目时触发
+     */
+    onSelect?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 配合 default-label 使用，详见示例
+     */
+    onSetDefaultOptions?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * RadioGroup 参数
+ */
+export interface RadioGroupProp {
+    /**
+     * 数据
+     */
+    datas: OptionProp[];
+    /**
+     * 可选值为 button 或不填，为 button 时使用按钮样式
+     */
+    type?: string;
+
+    /**
+     * 按钮样式，可选值为 default 和 solid
+     */
+    'button-style'?: string;
+
+    /**
+     * 尺寸，可选值为`large`、`small`、`default`或者不设置
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 是否垂直排列，按钮样式下无效
+     */
+    vertical?: boolean;
+
+    /**
+     * 在选项状态发生改变时触发，返回当前选中的项。通过修改外部的数据改变时不会触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * CheckboxGroup 参数
+ */
+export interface CheckboxGroupProp {
+    /**
+     * 数据
+     */
+    datas: OptionProp[];
+    /**
+     * 多选框组的尺寸，可选值为 `large`、`small`、`default` 或者不设置
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 在选项状态发生改变时触发，返回已选中的数组。通过修改外部的数据改变时不会触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * TreeSelect 参数
+ */
+export interface TreeSelectProp {
+    /**
+     * Tree 的数据，基本同 View UI Plus Tree，但要额外设置一个 `value` 字段，而且 `selected` 和 `checked` 字段需预先设置在 data 中，详见示例
+     */
+    data?: any[];
+
+    /**
+     * 是否支持多选
+     */
+    multiple?: boolean;
+
+    /**
+     * 是否显示多选框
+     */
+    'show-checkbox'?: boolean;
+
+    /**
+     * 异步加载数据的方法，详见示例
+     */
+    'load-data'?: Function;
+
+    /**
+     * 是否将弹层放置于 body 内
+     */
+    transfer?: boolean;
+
+    /**
+     * 选项变化时触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 下拉框展开或收起时触发
+     */
+    onOpenChange?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * City 参数
+ */
+export interface CityProp {
+    /**
+     * value 值可以设置为名称，比如北京（名称不含“市”字）
+     */
+    'use-name'?: boolean;
+
+    /**
+     * 预设城市，会出现在快捷选择区域，各项为城市 code
+     */
+    cities?: any[];
+
+    /**
+     * 是否禁用选择器
+     */
+    disabled?: boolean;
+
+    /**
+     * 是否显示后缀“市”，例如开启则显示“北京市”，否则显示“北京”
+     */
+    'show-suffix'?: boolean;
+
+    /**
+     * 选择框大小，可选值为`large`、`small`、`default` 或者不填
+     */
+    size?: string;
+
+    /**
+     * 是否将弹层放置于 body 内
+     */
+    transfer?: boolean;
+
+    /**
+     * 给表单元素设置 `id`，详见 Form 用法。
+     */
+    'element-id'?: string;
+
+    /**
+     * 默认的提示文字
+     */
+    placeholder?: string;
+
+    /**
+     * 搜索框默认文字
+     */
+    'search-placeholder'?: string;
+
+    /**
+     * 选择城市时触发，返回该城市的详细内容，包括城市 code (c)，对应省 code (p)，城市名 (n)，城市名首字母缩写 (l)
+     */
+    onChange?: (event?: any) => any;
+}
+
+/**
+ * AutoComplete 参数
+ */
+export interface AutoCompleteProp {
+    /**
+     * 自动完成的数据源
+     */
+    data?: any[];
+
+    /**
+     * 是否可以清空选项
+     */
+    clearable?: boolean;
+
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+
+    /**
+     * 占位文本
+     */
+    placeholder?: string;
+
+    /**
+     * 输入框尺寸，可选值为 `large`、`small`、`default` 或者不设置
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 输入框尾部图标
+     */
+    icon?: string;
+
+    /**
+     * 是否根据输入项进行筛选。当其为一个函数时，会接收 `value` 和 `option` 两个参数，当 option 符合筛选条件时，应返回 true，反之则返回 false
+     */
+    'filter-method'?: Function | boolean;
+
+    /**
+     * 弹窗的展开方向，可选值为 `bottom`、`top`、`top-start`、`bottom-start`、`top-end`、`bottom-end`，2.12.0 版本开始支持自动识别
+     */
+    placement?: string;
+
+    /**
+     * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+     */
+    transfer?: boolean;
+
+    /**
+     * 给表单元素设置 `id`，详见 Form 用法。
+     */
+    'element-id'?: string;
+
+    /**
+     * 开启 transfer 时，给浮层添加额外的 class 名称
+     */
+    'transfer-class-name'?: string;
+
+    /**
+     * 是否开启 capture 模式，也可通过全局配置
+     */
+    capture?: boolean;
+
+    /**
+     * 是否开启 Popper 的 eventsEnabled 属性，开启可能会牺牲一定的性能
+     */
+    'events-enabled'?: boolean;
+
+    /**
+     * 选中 option，或 input 的 value 变化时，调用此函数
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 被选中时调用，参数为选中项的 value 值
+     */
+    onSelect?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 搜索补全项的时候调用
+     */
+    onSearch?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 聚焦时触发
+     */
+    onFocus?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 失焦时触发
+     */
+    onBlur?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 清空时触发
+     */
+    onClear?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * Slider 参数
+ */
+export interface SliderProp {
+    /**
+     * 最小值
+     */
+    min?: number;
+
+    /**
+     * 最大值
+     */
+    max?: number;
+
+    /**
+     * 步长，取值建议能被（max - min）整除
+     */
+    step?: number;
+
+    /**
+     * 是否禁用滑块
+     */
+    disabled?: boolean;
+
+    /**
+     * 是否开启双滑块模式
+     */
+    range?: boolean;
+
+    /**
+     * 是否显示数字输入框，仅在单滑块模式下有效
+     */
+    'show-input'?: boolean;
+
+    /**
+     * 是否显示间断点，建议在 step 不密集时使用
+     */
+    'show-stops'?: boolean;
+
+    /**
+     * 提示的显示控制，可选值为 `hover`（悬停，默认）、`always`（总是可见）、`never`（不可见）
+     */
+    'show-tip'?: string;
+
+    /**
+     * Slider 会把当前值传给 `tip-format`，并在 Tooltip 中显示 tip-format 的返回值，若为 null，则隐藏 Tooltip
+     */
+    'tip-format'?: Function;
+
+    /**
+     * 数字输入框的尺寸，可选值为`large`、`small`、`default`或者不填，仅在开启 show-input 时有效
+     */
+    'input-size'?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 同 InputNumber 的 active-change
+     */
+    'active-change'?: boolean;
+
+    /**
+     * 标记， key 的类型必须为 number 且取值在闭区间 [min, max] 内，每个标记可以单独设置样式
+     */
+    marks?: object;
+
+    /**
+     * 在松开滑动时触发，返回当前的选值，在滑动过程中不会触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 滑动条数据变化时触发，返回当前的选值，在滑动过程中实时触发
+     */
+    onInput?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * DatePicker 参数
+ */
+export interface DatePickerProp {
+    /**
+     * 显示类型，可选值为 `date`、`daterange`、`datetime`、`datetimerange`、`year`、`month`
+     */
+    type?: 'date' | 'daterange' | 'datetime' | 'datetimerange' | 'year' | 'month';
+
+    /**
+     * 展示的日期格式
+     */
+    format?: Date;
+
+    /**
+     * 日期选择器出现的位置，可选值为`top` `top-start` `top-end` `bottom` `bottom-start` `bottom-end` `left` `left-start` `left-end` `right` `right-start` `right-end`
+     */
+    placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+
+    /**
+     * 占位文本
+     */
+    placeholder?: string;
+
+    /**
+     * 选择器额外配置，比如不可选日期与快捷选项，具体项详见下表
+     */
+    options?: object;
+
+    /**
+     * 开启后，左右面板不联动，仅在 `daterange` 和 `datetimerange` 下可用。
+     */
+    'split-panels'?: boolean;
+
+    /**
+     * 开启后，可以选择多个日期，仅在 `date` 下可用。
+     */
+    multiple?: boolean;
+
+    /**
+     * 开启后，可以显示星期数。
+     */
+    'show-week-numbers'?: boolean;
+
+    /**
+     * 设置默认显示的起始日期。
+     */
+    'start-date'?: Date;
+
+    /**
+     * 是否显示底部控制栏，开启后，选择完日期，选择器不会主动关闭，需用户确认后才可关闭
+     */
+    confirm?: boolean;
+
+    /**
+     * 手动控制日期选择器的显示状态，true 为显示，false 为收起。使用该属性后，选择器不会主动关闭。建议配合 slot 及 confirm 和相关事件一起使用
+     */
+    open?: boolean;
+
+    /**
+     * 尺寸，可选值为`large`、`small`、`default`或者不设置
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 是否禁用选择器
+     */
+    disabled?: boolean;
+
+    /**
+     * 是否显示清除按钮
+     */
+    clearable?: boolean;
+
+    /**
+     * 完全只读，开启后不会弹出选择器，只在没有设置 open 属性下生效
+     */
+    readonly?: boolean;
+
+    /**
+     * 文本框是否可以输入，只在没有使用 slot 时有效
+     */
+    editable?: boolean;
+
+    /**
+     * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+     */
+    transfer?: boolean;
+
+    /**
+     * 给表单元素设置 `id`，详见 Form 用法。
+     */
+    'element-id'?: string;
+
+    /**
+     * 可以在 type 为 datetime 和 datetimerange 下，配置 TimePicker 的属性，比如时间间隔 steps：`:time-picker-options="{steps: [1, 10, 10]}"`
+     */
+    'time-picker-options'?: object;
+
+    /**
+     * 两个日期间的分隔符
+     */
+    separator?: string;
+
+    /**
+     * 是否开启 capture 模式，也可通过全局配置
+     */
+    capture?: boolean;
+
+    /**
+     * 开启 transfer 时，给浮层添加额外的 class 名称
+     */
+    'transfer-class-name'?: string;
+
+    /**
+     * 是否开启 Popper 的 eventsEnabled 属性，开启可能会牺牲一定的性能
+     */
+    'events-enabled'?: boolean;
+
+    /**
+     * 设置快捷选项，每项内容：**text | String**：显示的文案， **value | Function**：返回指定的日期，如需自己控制逻辑，可不设置，并使用 onClick 回调， **onClick | Function**：点击时的回调，参数为当前日期选择器的 Vue 实例，当需要自定义复杂操作时，可以使用
+     */
+    shortcuts?: any[];
+
+    /**
+     * 设置不可选择的日期，参数为当前的日期，需要返回 Boolean 是否禁用这天
+     */
+    disabledDate?: Function;
+
+    /**
+     * 日期发生变化时触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 弹出日历和关闭日历时触发
+     */
+    onOpenChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 在 confirm 模式下有效，点击确定按钮时触发
+     */
+    onOk?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 在 confirm 模式或 clearable = true 时有效，在清空日期时触发
+     */
+    onClear?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 点击外部关闭下拉菜单时触发
+     */
+    onClickoutside?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * TimePicker 参数
+ */
+export interface TimePickerProp {
+    /**
+     * 显示类型，可选值为 `time`、`timerange`
+     */
+    type?: 'time' | 'timerange';
+
+    /**
+     * 展示的时间格式
+     */
+    format?: Date;
+
+    /**
+     * 下拉列表的时间间隔，数组的三项分别对应小时、分钟、秒。例如设置为 [1, 15] 时，分钟会显示：00、15、30、45。
+     */
+    steps?: any[];
+
+    /**
+     * 时间选择器出现的位置，可选值为`top` `top-start` `top-end` `bottom` `bottom-start` `bottom-end` `left` `left-start` `left-end` `right` `right-start` `right-end`
+     */
+    placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+
+    /**
+     * 占位文本
+     */
+    placeholder?: string;
+
+    /**
+     * 是否显示底部控制栏
+     */
+    confirm?: boolean;
+
+    /**
+     * 手动控制时间选择器的显示状态，true 为显示，false 为收起。使用该属性后，选择器不会主动关闭。建议配合 slot 及 confirm 和相关事件一起使用
+     */
+    open?: boolean;
+
+    /**
+     * 尺寸，可选值为`large`、`small`、`default`或者不设置
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 是否禁用选择器
+     */
+    disabled?: boolean;
+
+    /**
+     * 是否显示清除按钮
+     */
+    clearable?: boolean;
+
+    /**
+     * 完全只读，开启后不会弹出选择器，只在没有设置 open 属性下生效
+     */
+    readonly?: boolean;
+
+    /**
+     * 文本框是否可以输入，只在没有使用 slot 时有效
+     */
+    editable?: boolean;
+
+    /**
+     * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+     */
+    transfer?: boolean;
+
+    /**
+     * 给表单元素设置 `id`，详见 Form 用法。
+     */
+    'element-id'?: string;
+
+    /**
+     * 两个日期间的分隔符
+     */
+    separator?: string;
+
+    /**
+     * 是否开启 capture 模式，也可通过全局配置
+     */
+    capture?: boolean;
+
+    /**
+     * 开启 transfer 时，给浮层添加额外的 class 名称
+     */
+    'transfer-class-name'?: string;
+
+    /**
+     * 是否开启 Popper 的 eventsEnabled 属性，开启可能会牺牲一定的性能
+     */
+    'events-enabled'?: boolean;
+
+    /**
+     * 时间发生变化时触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 弹出浮层和关闭浮层时触发
+     */
+    onOpenChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 点击确定按钮时触发
+     */
+    onOk?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 在清空日期时触发
+     */
+    onClear?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * Cascader 参数
+ */
+export interface CascaderProp {
+    /**
+     * 可选项的数据源，格式参照示例说明
+     */
+    data?: any[];
+
+    /**
+     * 选择后展示的函数，用于自定义显示格式
+     */
+    'render-format'?: Function;
+
+    /**
+     * 是否禁用选择器
+     */
+    disabled?: boolean;
+
+    /**
+     * 是否支持清除
+     */
+    clearable?: boolean;
+
+    /**
+     * 输入框占位符
+     */
+    placeholder?: string;
+
+    /**
+     * 次级菜单展开方式，可选值为 `click` 或 `hover`
+     */
+    trigger?: 'click' | 'hover';
+
+    /**
+     * 当此项为 true 时，点选每级菜单选项值都会发生变化，具体见上面的示例
+     */
+    'change-on-select'?: boolean;
+
+    /**
+     * 输入框大小，可选值为`large`和`small`或者不填
+     */
+    size?: '' | 'large' | 'small';
+
+    /**
+     * 动态获取数据，数据源需标识 loading
+     */
+    'load-data'?: Function;
+
+    /**
+     * 是否支持搜索
+     */
+    filterable?: boolean;
+
+    /**
+     * 当搜索列表为空时显示的内容
+     */
+    'not-found-text'?: string;
+
+    /**
+     * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+     */
+    transfer?: boolean;
+
+    /**
+     * 给表单元素设置 `id`，详见 Form 用法。
+     */
+    'element-id'?: string;
+
+    /**
+     * 开启 transfer 时，给浮层添加额外的 class 名称
+     */
+    'transfer-class-name'?: string;
+
+    /**
+     * 是否开启 Popper 的 eventsEnabled 属性，开启可能会牺牲一定的性能
+     */
+    'events-enabled'?: boolean;
+
+    /**
+     * 选择完成后的回调，返回值 value 即已选值 value，selectedData 为已选项的具体数据
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 展开和关闭弹窗时触发
+     */
+    onVisibleChange?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * TagSelect 参数
+ */
+export interface TagSelectProp {
+    /**
+     * 数据
+     */
+    datas: OptionProp[];
+
+    /**
+     * 是否显示 `展开/收起` 按钮
+     */
+    expandable?: boolean;
+
+    /**
+     * 隐藏 `全部` 按钮
+     */
+    'hide-check-all'?: boolean;
+
+    /**
+     * 文案配置
+     */
+    locale?: object;
+
+    /**
+     * 选项变化时触发，返回已选项 name 集合和当前项 name
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 全选状态变化时触发，返回全选状态
+     */
+    onCheckedAll?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * Rate 参数
+ */
+export interface RateProp {
+    /**
+     * star 总数
+     */
+    count?: number;
+
+    /**
+     * 是否允许半选
+     */
+    'allow-half'?: boolean;
+
+    /**
+     * 是否只读，无法进行交互
+     */
+    disabled?: boolean;
+
+    /**
+     * 是否显示提示文字
+     */
+    'show-text'?: boolean;
+
+    /**
+     * 是否可以取消选择
+     */
+    clearable?: boolean;
+
+    /**
+     * 自定义字符
+     */
+    character?: string;
+
+    /**
+     * 使用图标
+     */
+    icon?: string;
+
+    /**
+     * 使用自定义图标
+     */
+    'custom-icon'?: string;
+
+    /**
+     * 评分改变时触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * ColorPicker 参数
+ */
+export interface ColorPickerProp {
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+
+    /**
+     * 是否可以输入色值
+     */
+    editable?: boolean;
+
+    /**
+     * 是否支持透明度选择
+     */
+    alpha?: boolean;
+
+    /**
+     * 是否支持色彩选择
+     */
+    hue?: boolean;
+
+    /**
+     * 是否显示推荐的颜色预设
+     */
+    recommend?: boolean;
+
+    /**
+     * 自定义颜色预设
+     */
+    colors?: any[];
+
+    /**
+     * 颜色的格式，可选值为 hsl、hsv、hex、rgb
+     */
+    format?: 'hsl' | 'hsv' | 'hex' | 'rgb';
+
+    /**
+     * 尺寸，可选值为`large`、`small`、`default`或者不设置
+     */
+    size?: '' | 'large' | 'small' | 'default';
+
+    /**
+     * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，它将不受父级样式影响，从而达到更好的效果
+     */
+    transfer?: boolean;
+
+    /**
+     * 是否开启 capture 模式，也可通过全局配置
+     */
+    capture?: boolean;
+
+    /**
+     * 开启 transfer 时，给浮层添加额外的 class 名称
+     */
+    'transfer-class-name'?: string;
+
+    /**
+     * 是否开启 Popper 的 eventsEnabled 属性，开启可能会牺牲一定的性能
+     */
+    'events-enabled'?: boolean;
+
+    /**
+     * 当绑定值变化时触发
+     */
+    onChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 面板中当前显示的颜色发生改变时触发
+     */
+    onActiveChange?: (event?: any, item?: ComFormItem) => any;
+
+    /**
+     * 下拉框展开或收起时触发
+     */
+    onOpenChange?: (event?: any, item?: ComFormItem) => any;
+}
+
+/**
+ * FormItem 参数
+ */
+export interface ComFormItem {
+    /**
+     * 绑定值
+     */
+    model: string;
+
+    /**
+     * 表单组子项
+     */
+    children?: ComFormItem[];
+
+    /**
+     * 栅格的占位格数，可选值为0~24的整数，为 0 时，相当于 display:none
+     */
+    span?: number;
+
+    /**
+     * 是否显示
+     */
+    isShow?: Function | boolean;
+
+    /**
+     * 表单项类型
+     */
+    type?: "Switch" | "Label" | "Button" | "Input" | "InputNumber" | "Select" | "Radio" | "Checkbox" |
+    "TreeSelect" | "City" | "AutoComplete" | "Slider" | "DatePicker" | "TimePicker" | "Cascader" |
+    "TagSelect" | "Rate" | "ColorPicker" | "IconSelect";
+
+    /**
+     * Switch 参数
+     */
+    switchProp?: SwitchProp;
+
+    /**
+     * Button 参数
+     */
+    buttonProp?: ButtonProp;
+
+    /**
+     * Input 参数
+     */
+    inputProp?: InputProp;
+
+    /**
+     * InputNumber 参数
+     */
+    inputNumberProp?: InputNumberProp;
+
+    /**
+     * Select 参数
+     */
+    selectProp?: SelectProp;
+
+    /**
+     * Radio 参数
+     */
+    radioProp?: RadioGroupProp;
+
+    /**
+     * Checkbox 参数
+     */
+    checkboxProp?: CheckboxGroupProp;
+
+    /**
+     * TreeSelect 参数
+     */
+    treeSelectProp?: TreeSelectProp;
+
+    /**
+     * City 参数
+     */
+    cityProp?: CityProp;
+
+    /**
+     * AutoComplete 参数
+     */
+    autoCompleteProp?: AutoCompleteProp;
+
+    /**
+     * Slider 参数
+     */
+    sliderProp?: SliderProp;
+
+    /**
+     * DatePicker 参数
+     */
+    datePickerProp?: DatePickerProp;
+
+    /**
+     * TimePicker 参数
+     */
+    timePickerProp?: TimePickerProp;
+
+    /**
+     * Cascader 参数
+     */
+    cascaderProp?: CascaderProp;
+
+    /**
+     * TagSelect 参数
+     */
+    tagSelectProp?: TagSelectProp;
+
+    /**
+     * Rate 参数
+     */
+    rateProp?: RateProp;
+
+    /**
+     * ColorPicker 参数
+     */
+    colorPickerProp?: ColorPickerProp;
+
+    /**
+     * IconSelect 参数
+     */
+    iconSelectProp?: IconSelectProp;
+
+    /**
+     * 对应表单域 model 里的字段
+     */
+    prop?: string;
+
+    /**
+     * 标签文本
+     */
+    label?: string;
+
+    /**
+     * 表单域标签的的宽度
+     */
+    'label-width'?: number;
+
+    /**
+     * 指定原生的 label 标签的 for 属性，配合控件的 `element-id` 属性，可以点击 label 时聚焦控件。
+     */
+    'label-for'?: string;
+
+    /**
+     * 是否必填，如不设置，则会根据校验规则自动生成
+     */
+    required?: boolean;
+
+    /**
+     * 表单验证规则
+     */
+    rules?: object | any[];
+
+    /**
+     * 表单域验证错误信息, 设置该值会使表单验证状态变为error，并显示该错误信息
+     */
+    error?: string;
+
+    /**
+     * 是否显示校验错误信息
+     */
+    'show-message'?: boolean;
+}
+
+import type { DefineComponent } from 'vue';
+
+export declare const ComForm: DefineComponent<{
+    /**
+     * 是否只读
+     */
+    onlyView: Boolean,
+    /**
+     * 表单项
+     */
+    formItems: Array<ComFormItem>,
+    /**
+     * 表单数据
+     */
+    formModel: object
+}>