From 454cdd176a138d3a4e61135c8523ee7f98909ae2 Mon Sep 17 00:00:00 2001 From: yangd Date: Tue, 21 Aug 2018 08:29:24 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E6=96=B0=E7=89=88=E6=9C=AC3.?= =?UTF-8?q?0.0=E7=9A=84iview=E5=85=A8=E9=83=A8=E7=BB=84=E4=BB=B6=E7=9A=84t?= =?UTF-8?q?s=E7=B1=BB=E5=9E=8B=E5=AE=9A=E4=B9=89d.ts=E6=96=87=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- types/iview/affix.d.ts | 22 ++ types/iview/alert.d.ts | 48 ++++ types/iview/anchor.d.ts | 67 ++++++ types/iview/auto-complete.d.ts | 75 ++++++ types/iview/avatar.d.ts | 30 +++ types/iview/back-top.d.ts | 32 +++ types/iview/badge.d.ts | 47 ++++ types/iview/breadcrumb.d.ts | 30 +++ types/iview/button.d.ts | 86 +++++++ types/iview/card.d.ts | 53 +++++ types/iview/carousel.d.ts | 61 +++++ types/iview/cascader.d.ts | 84 +++++++ types/iview/cell.d.ts | 81 +++++++ types/iview/checkbox.d.ts | 61 +++++ types/iview/circle.d.ts | 57 +++++ types/iview/collapse.d.ts | 53 +++++ types/iview/color-picker.d.ts | 54 +++++ types/iview/date-picker.d.ts | 153 ++++++++++++ types/iview/divider.d.ts | 23 ++ types/iview/dropdown.d.ts | 79 +++++++ types/iview/form.d.ts | 100 ++++++++ types/iview/grid.d.ts | 72 ++++++ types/iview/icon.d.ts | 20 ++ types/iview/index.d.ts | 237 +++++++++++++++++++ types/iview/input-number.d.ts | 75 ++++++ types/iview/input.d.ts | 168 +++++++++++++ types/iview/iview.d.ts | 4 + types/iview/layout.d.ts | 72 ++++++ types/iview/loading-bar.d.ts | 61 +++++ types/iview/menu.d.ts | 102 ++++++++ types/iview/message.d.ts | 84 +++++++ types/iview/modal.d.ts | 218 +++++++++++++++++ types/iview/notice.d.ts | 92 ++++++++ types/iview/page.d.ts | 99 ++++++++ types/iview/poptip.d.ts | 123 ++++++++++ types/iview/progress.d.ts | 47 ++++ types/iview/radio.d.ts | 64 +++++ types/iview/rate.d.ts | 54 +++++ types/iview/scroll.d.ts | 35 +++ types/iview/select.d.ts | 141 +++++++++++ types/iview/slider.d.ts | 70 ++++++ types/iview/spin.d.ts | 26 ++ types/iview/split.d.ts | 68 ++++++ types/iview/steps.d.ts | 48 ++++ types/iview/switch.d.ts | 54 +++++ types/iview/table.d.ts | 419 +++++++++++++++++++++++++++++++++ types/iview/tabs.d.ts | 81 +++++++ types/iview/tag.d.ts | 48 ++++ types/iview/time-picker.d.ts | 169 +++++++++++++ types/iview/time.ts | 27 +++ types/iview/timeline.d.ts | 34 +++ types/iview/tooltip.d.ts | 91 +++++++ types/iview/transfer.d.ts | 80 +++++++ types/iview/tree.d.ts | 103 ++++++++ types/iview/upload.d.ts | 130 ++++++++++ 55 files changed, 4512 insertions(+) create mode 100644 types/iview/affix.d.ts create mode 100644 types/iview/alert.d.ts create mode 100644 types/iview/anchor.d.ts create mode 100644 types/iview/auto-complete.d.ts create mode 100644 types/iview/avatar.d.ts create mode 100644 types/iview/back-top.d.ts create mode 100644 types/iview/badge.d.ts create mode 100644 types/iview/breadcrumb.d.ts create mode 100644 types/iview/button.d.ts create mode 100644 types/iview/card.d.ts create mode 100644 types/iview/carousel.d.ts create mode 100644 types/iview/cascader.d.ts create mode 100644 types/iview/cell.d.ts create mode 100644 types/iview/checkbox.d.ts create mode 100644 types/iview/circle.d.ts create mode 100644 types/iview/collapse.d.ts create mode 100644 types/iview/color-picker.d.ts create mode 100644 types/iview/date-picker.d.ts create mode 100644 types/iview/divider.d.ts create mode 100644 types/iview/dropdown.d.ts create mode 100644 types/iview/form.d.ts create mode 100644 types/iview/grid.d.ts create mode 100644 types/iview/icon.d.ts create mode 100644 types/iview/index.d.ts create mode 100644 types/iview/input-number.d.ts create mode 100644 types/iview/input.d.ts create mode 100644 types/iview/iview.d.ts create mode 100644 types/iview/layout.d.ts create mode 100644 types/iview/loading-bar.d.ts create mode 100644 types/iview/menu.d.ts create mode 100644 types/iview/message.d.ts create mode 100644 types/iview/modal.d.ts create mode 100644 types/iview/notice.d.ts create mode 100644 types/iview/page.d.ts create mode 100644 types/iview/poptip.d.ts create mode 100644 types/iview/progress.d.ts create mode 100644 types/iview/radio.d.ts create mode 100644 types/iview/rate.d.ts create mode 100644 types/iview/scroll.d.ts create mode 100644 types/iview/select.d.ts create mode 100644 types/iview/slider.d.ts create mode 100644 types/iview/spin.d.ts create mode 100644 types/iview/split.d.ts create mode 100644 types/iview/steps.d.ts create mode 100644 types/iview/switch.d.ts create mode 100644 types/iview/table.d.ts create mode 100644 types/iview/tabs.d.ts create mode 100644 types/iview/tag.d.ts create mode 100644 types/iview/time-picker.d.ts create mode 100644 types/iview/time.ts create mode 100644 types/iview/timeline.d.ts create mode 100644 types/iview/tooltip.d.ts create mode 100644 types/iview/transfer.d.ts create mode 100644 types/iview/tree.d.ts create mode 100644 types/iview/upload.d.ts diff --git a/types/iview/affix.d.ts b/types/iview/affix.d.ts new file mode 100644 index 00000000..b5b020b0 --- /dev/null +++ b/types/iview/affix.d.ts @@ -0,0 +1,22 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Affix extends Vue { + /** + * 距离窗口顶部达到指定偏移量后触发 + * @default 0 + */ + 'offset-top'?: number; + /** + * 距离窗口底部达到指定偏移量后触发 + */ + 'offset-bottom'?: number; + /** + * 在固定状态发生改变时触发 + * @param value true | false + */ + $emit(eventName: 'on-change', value: boolean): this; +} \ No newline at end of file diff --git a/types/iview/alert.d.ts b/types/iview/alert.d.ts new file mode 100644 index 00000000..ffaf36e8 --- /dev/null +++ b/types/iview/alert.d.ts @@ -0,0 +1,48 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Alert extends Vue { + /** + * 警告提示样式，可选值为info、success、warning、error + * @default info + */ + type?: 'info' | 'success' | 'warning' | 'error'; + /** + * 是否可关闭 + * @default false + */ + closable?: boolean; + /** + * 是否显示图标 + * @default false + */ + 'show-icon'?: boolean; + /** + * 关闭时触发 + */ + $emit(eventName: 'on-close', event: HTMLElement): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 警告提示内容 + */ + '': VNode[]; + /** + * 警告提示辅助性文字介绍 + */ + desc: VNode[]; + /** + * 自定义图标内容 + */ + icon: VNode[]; + /** + * 自定义关闭内容 + */ + close: VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/anchor.d.ts b/types/iview/anchor.d.ts new file mode 100644 index 00000000..d1071b3d --- /dev/null +++ b/types/iview/anchor.d.ts @@ -0,0 +1,67 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Anchor extends Vue { + /** + * 固定模式 + * @default true + */ + affix?: boolean; + /** + * 距离窗口顶部达到指定偏移量后触发 + * @default 0 + */ + 'offset-top'?: number; + /** + * 距离窗口底部达到指定偏移量后触发 + */ + 'offset-bottom'?: number; + /** + * 锚点区域边界，单位：px + * @default 5 + */ + bounds?: number; + /** + * 点击滚动的额外距离 + * @default 0 + */ + 'scroll-offset'?: number; + /** + * 指定滚动的容器 + */ + container?: string | HTMLElement; + /** + * 是否显示小圆点 + * @default false + */ + 'show-ink'?: boolean; + /** + * 点击锚点时触发，返回链接 + */ + $emit(eventName: 'on-select', href: string): this; + /** + * 链接改变时触发，返回新链接和旧链接 + */ + $emit(eventName: 'on-change', []): this; +} + +export interface AnchorLink extends Vue { + /** + * 锚点链接 + * @default + */ + href?: string; + /** + * 文字内容 + * @default + */ + title?: string; + /** + * 点击滚动的额外距离 + * @default 0 + */ + 'scroll-offset'?: number; +} \ No newline at end of file diff --git a/types/iview/auto-complete.d.ts b/types/iview/auto-complete.d.ts new file mode 100644 index 00000000..40183a27 --- /dev/null +++ b/types/iview/auto-complete.d.ts @@ -0,0 +1,75 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface AutoComplete extends Vue { + /** + * 绑定的值，可使用 v-model 双向绑定 + */ + value?: string | number; + /** + * 自动完成的数据源 + * @default [] + */ + data?: string[] | number[]; + /** + * 是否可以清空选项 + * @default false + */ + clearable?: boolean; + /** + * 是否禁用 + * @default false + */ + disabled?: boolean; + /** + * 占位文本 + */ + placeholder?: string; + /** + * 输入框尺寸，可选值为 large、small、default 或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 输入框尾部图标 + */ + icon?: string; + /** + * 是否根据输入项进行筛选。当其为一个函数时，会接收 value 和 option 两个参数， + * 当 option 符合筛选条件时，应返回 true，反之则返回 false, + * @default false + */ + 'filter-method'?: boolean | (() => boolean); + /** + * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时， + * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果, + * @default false + */ + transfer?: boolean; + /** + * 给表单元素设置 id，详见 Form 用法。 + */ + 'element-id'?: string; + /** + * 选中 option，或 input 的 value 变化时，调用此函数 + */ + $emit(eventName: 'on-change', value: string | number): this; + /** + * 被选中时调用，参数为选中项的 value 值 + */ + $emit(eventName: 'on-select', value: string | number): this; + /** + * 搜索补全项的时候调用 + */ + $emit(eventName: 'on-search', query: string): this; + /** + * 搜索补全项的时候调用 + */ + $emit(eventName: 'on-focus', event: KeyboardEvent): this; + /** + * 搜索补全项的时候调用 + */ + $emit(eventName: 'on-blur', event: KeyboardEvent): this; +} diff --git a/types/iview/avatar.d.ts b/types/iview/avatar.d.ts new file mode 100644 index 00000000..dfa37203 --- /dev/null +++ b/types/iview/avatar.d.ts @@ -0,0 +1,30 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Avatar extends Vue { + /** + * 指定头像的形状，可选值为 circle、square + * @default circle + */ + shape?: 'circle' | 'square'; + /** + * 设置头像的大小，可选值为 large、small、default + * @default default + */ + size?: 'large'|'small'|'default'; + /** + * 图片类头像的资源地址 + */ + src?: string; + /** + * 设置头像的图标类型，参考 Icon 组件 + */ + icon?: string; + /** + * 自定义图标 + */ + 'custom-icon'?: string; +} \ No newline at end of file diff --git a/types/iview/back-top.d.ts b/types/iview/back-top.d.ts new file mode 100644 index 00000000..28a2f881 --- /dev/null +++ b/types/iview/back-top.d.ts @@ -0,0 +1,32 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface BackTop extends Vue { + /** + * 页面滚动高度达到该值时才显示BackTop组件 + * @default 400 + */ + height?: number; + /** + * 组件距离底部的距离 + * @default 30 + */ + bottom?: number; + /** + * 组件距离右部的距离 + * @default 30 + */ + right?: number; + /** + * 滚动动画持续时间，单位 毫秒 + * @default 1000 + */ + duration?: number; + /** + * 点击按钮时触发 + */ + $emit(eventName: 'on-click'): this; +} diff --git a/types/iview/badge.d.ts b/types/iview/badge.d.ts new file mode 100644 index 00000000..2be4658d --- /dev/null +++ b/types/iview/badge.d.ts @@ -0,0 +1,47 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Badge extends Vue { + /** + * 显示的数字，大于overflowCount时，显示${overflowCount}+，为 0 时隐藏 + */ + count?: number | string; + /** + * 展示封顶的数字值 + * @default 99 + */ + 'overflow-count'?: number | string; + /** + * 不展示数字，只有一个小红点，如需隐藏 dot ，需要设置count为 0 + * @default false + */ + dot?: boolean + /** + * 自定义的class名称，dot 模式下无效 + */ + 'class-name'?: string; + /** + * 使用预设的颜色，可选值为 success、primary、normal、error、warning、info + */ + type?: 'success' | 'primary' | 'normal' | 'error' | 'warning' | 'info'; + /** + * 当数值为 0 时，是否展示 Badge + * @default false + */ + 'show-zero'?: boolean; + /** + * 设置 Badge 为状态点，可选值为 success、processing、default、error、warning + */ + status?: 'success' | 'processing' | 'default' | 'error' | 'warning'; + /** + * 自定义内容，如果设置了 status，则为状态点的文本 + */ + text?: string; + /** + * 设置状态点的位置偏移，格式为 [x, y] + */ + offset?: number[]; +} \ No newline at end of file diff --git a/types/iview/breadcrumb.d.ts b/types/iview/breadcrumb.d.ts new file mode 100644 index 00000000..6491a107 --- /dev/null +++ b/types/iview/breadcrumb.d.ts @@ -0,0 +1,30 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Breadcrumb extends Vue { + /** + * 自定义分隔符 + * @default / + */ + separator?: string; +} + +export interface BreadcrumbItem extends Vue { + /** + * 链接，不传则没有链接 + */ + to?: string | object; + /** + * 路由跳转时，开启 replace 将不会向 history 添加新记录 + * @default false + */ + replace?: boolean; + /** + * 相当于 a 链接的 target 属性 + * @default _self + */ + target?: '_blank' | '_self' | '_parent' | '_top'; +} \ No newline at end of file diff --git a/types/iview/button.d.ts b/types/iview/button.d.ts new file mode 100644 index 00000000..9a994dad --- /dev/null +++ b/types/iview/button.d.ts @@ -0,0 +1,86 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Button extends Vue { + /** + * 按钮类型，可选值为 default、primary、dashed、text、info、success、warning、error或者不设置 + * @default default + */ + type?: '' | 'default' | 'primary' | 'dashed' | 'text' | 'info' | 'success' | 'warning' | 'error'; + /** + * 幽灵属性，使按钮背景透明 + * @default false + */ + ghost?: boolean; + /** + * 按钮大小，可选值为large、small、default或者不设置 + * @default default + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 按钮形状，可选值为circle或者不设置 + */ + shape?: '' | 'circle'; + /** + * 开启后，按钮的长度为 100% + * @default false + */ + long?: boolean; + /** + * 设置button原生的type，可选值为button、submit、reset + * @default button + */ + 'html-type'?: 'button' | 'submit' | 'reset'; + /** + * 设置按钮为禁用状态 + * @default false + */ + disabled?: boolean; + /** + * 设置按钮为加载中状态 + * @default false + */ + loading?: boolean; + /** + * 设置按钮的图标类型 + */ + icon?: string; + /** + * 设置按钮的自定义图标 + */ + 'custom-icon'?: string; + /** + * 跳转的链接，支持 vue-router 对象 + */ + to?: string | object; + /** + * 路由跳转时，开启 replace 将不会向 history 添加新记录 + * @default false + */ + replace?: boolean; + /** + * 相当于 a 链接的 target 属性 + * @default _self + */ + target?: '_blank' | '_self' | '_parent' | '_top'; +} + +export interface ButtonGroup extends Vue { + /** + * 按钮组合大小，可选值为large、small、default或者不设置 + * @default default + */ + size?: 'large' | 'small' | 'default'; + /** + * 按钮组合形状，可选值为circle或者不设置 + */ + shape?: '' | 'circle'; + /** + * 是否纵向排列按钮组 + * @default false + */ + vertical?: boolean; +} \ No newline at end of file diff --git a/types/iview/card.d.ts b/types/iview/card.d.ts new file mode 100644 index 00000000..b9864d51 --- /dev/null +++ b/types/iview/card.d.ts @@ -0,0 +1,53 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Card extends Vue { + /** + * 是否显示边框，建议在灰色背景下使用 + * @default true + */ + 'bordered'?: boolean; + /** + * 禁用鼠标悬停显示阴影 + * @default false + */ + 'dis-hover'?: boolean; + /** + * 卡片阴影，建议在灰色背景下使用 + * @default false + */ + 'shadow'?: boolean; + /** + * 卡片内部间距，单位 px + * @default 16 + */ + 'padding'?: number; + /** + * 标题，2.12.0 新增 + */ + title?: string; + /** + * 标题前的图标，2.12.0 新增 + */ + icon?: string; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义卡片标题，如果是简单文字，可以使用

标签包裹 + */ + title: VNode[]; + /** + * 额外显示的内容，默认位置在右上角 + */ + extra: VNode[]; + /** + * 卡片主体内容 + */ + '': VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/carousel.d.ts b/types/iview/carousel.d.ts new file mode 100644 index 00000000..3d636519 --- /dev/null +++ b/types/iview/carousel.d.ts @@ -0,0 +1,61 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Carousel extends Vue { + /** + * 幻灯片的索引，从 0 开始，可以使用 v-model 双向绑定数据 + * @default 0 + */ + value?: number; + /** + * 走马灯的高度，可填 auto 或具体高度数值，单位 px + * @default auto + */ + height?: string | number; + /** + * 是否开启循环 + * @default false + */ + loop?: boolean; + /** + * 是否自动切换 + */ + autoplay?: boolean; + /** + * 自动切换的时间间隔，单位为毫秒 + * @default 2000 + */ + 'autoplay-speed'?: number; + /** + * 指示器的位置，可选值为 inside （内部），outside（外部），none（不显示） + * @default inside + */ + dots?: 'inside' | 'outside' | 'none'; + /** + * 是否显示圆形指示器 + * @default false + */ + 'radius-dot'?: boolean; + /** + * 指示器的触发方式，可选值为 click（点击），hover（悬停） + * @default click + */ + trigger?: 'click' | 'hover'; + /** + * 切换箭头的显示时机，可选值为 hover（悬停），always（一直显示），never（不显示） + * @default hover + */ + arrow?: 'hover' | 'always' | 'never'; + /** + * 动画效果 + * @default ease + */ + easing?: string; + /** + * 幻灯片切换时触发，目前激活的幻灯片的索引，原幻灯片的索引 + */ + $emit(eventName: 'on-change', oldValue: number, value: number): this; +} \ No newline at end of file diff --git a/types/iview/cascader.d.ts b/types/iview/cascader.d.ts new file mode 100644 index 00000000..67082d31 --- /dev/null +++ b/types/iview/cascader.d.ts @@ -0,0 +1,84 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Cascader extends Vue { + /** + * 可选项的数据源，格式参照示例说明 + * @default [] + */ + data?: object[]; + /** + * 当前已选项的数据，格式参照示例说明 + * @default [] + */ + value?: object[]; + /** + * 选择后展示的函数，用于自定义显示格式 + * @default label => label.join(' / ') + */ + 'render-format'?: (label?: string[]) => string + /** + * 是否禁用选择器 + * @default false + */ + disabled?: boolean; + /** + * 是否支持清除 + * @default true + */ + clearable?: boolean; + /** + * 输入框占位符 + * @default 请选择 + */ + placeholder?: string; + /** + * 次级菜单展开方式，可选值为 click 或 hover + * @default click + */ + trigger?: 'click' | 'hover'; + /** + * 当此项为 true 时，点选每级菜单选项值都会发生变化，具体见上面的示例 + * @default false + */ + 'change-on-select'?: boolean; + /** + * 输入框大小，可选值为large和small或者不填 + */ + size?: '' | 'large' | 'small'; + /** + * 动态获取数据，数据源需标识 loading + */ + 'load-data'?: () => void; + /** + * 是否支持搜索 + * @default false + */ + filterable?: boolean; + /** + * 当搜索列表为空时显示的内容 + * @default 无匹配数据 + */ + 'not-found-text'?: string; + /** + * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时， + * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果 + * @default false + */ + transfer?: boolean; + /** + * 给表单元素设置 id，详见 Form 用法。 + */ + 'element-id'?: string; + /** + * 选择完成后的回调，返回值 value 即已选值 value，selectedData 为已选项的具体数据 + */ + $emit(eventName: 'on-change', value: object, selectedData: object[]): this; + /** + * 展开和关闭弹窗时触发 + */ + $emit(eventName: 'on-visible-change', status: boolean): this; +} \ No newline at end of file diff --git a/types/iview/cell.d.ts b/types/iview/cell.d.ts new file mode 100644 index 00000000..42a0acaf --- /dev/null +++ b/types/iview/cell.d.ts @@ -0,0 +1,81 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Cell extends Vue { + /** + * 用来标识这一项 + */ + name?: string | number; + /** + * 左侧标题 + */ + title?: string; + /** + * 标题下方的描述信息 + */ + label?: string; + /** + * 右侧额外内容 + */ + extra?: string; + /** + * 禁用该项 + * @default false + */ + disabled?: boolean; + /** + * 标记该项为选中状态 + * @default false + */ + selected?: boolean; + /** + * 跳转的链接，支持 vue-router 对象 + */ + to?: string | object; + /** + * 路由跳转时，开启 replace 将不会向 history 添加新记录 + * @default false + */ + replace?: boolean; + /** + * 相当于 a 链接的 target 属性 + * @default _self + */ + target?: '_blank' | '_self' | '_parent' | '_top'; + /** + * slot插槽对象 + */ + $slots: { + /** + * 相当于 title + */ + '': VNode[]; + /** + * 标题前的 Icon + */ + icon: VNode[]; + /** + * 相当于 label + */ + label: VNode[]; + /** + * 相当于 extra + */ + extra: VNode[]; + /** + * 有链接时，可自定义右侧箭头 + */ + arrow: VNode[]; + } +} + +export interface CellGroup extends Vue { + /** + * 点击单元格时触发 + * + */ + $emit(eventName: 'on-click', name: string): this; +} \ No newline at end of file diff --git a/types/iview/checkbox.d.ts b/types/iview/checkbox.d.ts new file mode 100644 index 00000000..43d35bc5 --- /dev/null +++ b/types/iview/checkbox.d.ts @@ -0,0 +1,61 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Checkbox extends Vue { + /** + * 只在单独使用时有效。可以使用 v-model 双向绑定数据 + * @default false + */ + value?: boolean; + /** + * 只在组合使用时有效。指定当前选项的 value 值，组合会自动判断是否选中 + */ + label?: string | number | boolean; + /** + * 是否禁用当前项 + * @default false + */ + disabled?: boolean; + /** + * 设置 indeterminate 状态，只负责样式控制 + * @default false + */ + indeterminate?: boolean; + /** + * 多选框的尺寸，可选值为 large、small、default 或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用 + * @default true + */ + 'true-value'?: string | number | boolean; + /** + * 没有选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用 + * @default false + */ + 'false-value'?: string | number | boolean; + /** + * 只在单独使用时有效。在选项状态发生改变时触发，通过修改外部的数据改变时不会触发 + */ + $emit(eventName: 'on-change', value: boolean): this; +} + +export interface CheckboxGroup extends Vue { + /** + * 指定选中项目的集合，可以使用 v-model 双向绑定数据 + * @default [] + */ + value?: string[] | number[] | boolean[]; + /** + * 多选框组的尺寸，可选值为 large、small、default 或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 在选项状态发生改变时触发，返回已选中的数组。通过修改外部的数据改变时不会触发 + */ + $emit(eventName: 'on-change', values: Array): this; +} \ No newline at end of file diff --git a/types/iview/circle.d.ts b/types/iview/circle.d.ts new file mode 100644 index 00000000..f4adce51 --- /dev/null +++ b/types/iview/circle.d.ts @@ -0,0 +1,57 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Circle extends Vue { + /** + * 百分比 + * @default 0 + */ + percent?: number; + /** + * 图表的宽度和高度，单位 px + * @default 120 + */ + size?: number; + /** + * 进度环顶端的形状，可选值为square（方）和round（圆） + * @default round + */ + 'stroke-linecap'?: 'square' | 'round'; + /** + * 进度环的线宽，单位 px + * @default 6 + */ + 'stroke-width'?: number; + /** + * 进度环的颜色 + * @default #2db7f5 + */ + 'stroke-color'?: string + /** + * 进度环背景的线宽，单位 px + * @default 5 + */ + 'trail-width'?: number; + /** + * 进度环背景的颜色 + * @default #eaeef2 + */ + 'trail-color'?: string; + /** + * 是否显示为仪表盘 + * @default false + */ + dashboard?: boolean; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义显示中间内容，内容默认垂直居中 + */ + '': VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/collapse.d.ts b/types/iview/collapse.d.ts new file mode 100644 index 00000000..0d6a2c4d --- /dev/null +++ b/types/iview/collapse.d.ts @@ -0,0 +1,53 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Collapse extends Vue { + /** + * 当前激活的面板的 name，可以使用 v-model 双向绑定 + */ + value?: string[] | string; + /** + * 是否开启手风琴模式，开启后每次至多展开一个面板 + * @default false + */ + accordion?: boolean; + /** + * 是否开启简洁模式 + * @default false + */ + simple?: boolean; + /** + * 切换面板时触发，返回当前已展开的面板的 key，格式为数组 + * @default [] + */ + $emit(eventName: 'on-change', []): this; +} + +export interface CollapsePanel extends Vue { + /** + * 当前面板的 name，与 Collapse的value对应，不填为索引值 + * @default index的值 + */ + name?: string; + /** + * 隐藏箭头 + * @default false + */ + 'hide-arrow'?: boolean; + /** + * slot插槽对象 + */ + $slots: { + /** + * 面板头内容 + */ + '': VNode[]; + /** + * 描素内容 + */ + content: VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/color-picker.d.ts b/types/iview/color-picker.d.ts new file mode 100644 index 00000000..0b3258d3 --- /dev/null +++ b/types/iview/color-picker.d.ts @@ -0,0 +1,54 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface ColorPicker extends Vue { + /** + * 绑定的值，可使用 v-model 双向绑定 + */ + value?: string; + /** + * 是否支持透明度选择 + * @default false + */ + alpha?: boolean; + /** + * 是否支持色彩选择 + * @default true + */ + hue?: boolean; + /** + * 是否支持透明度选择 + * @default false + */ + recommend?: boolean; + /** + * 自定义颜色预设 + */ + colors?: string[]; + /** + * 颜色的格式，可选值为 hsl、hsv、hex、rgb + * @default 开启 alpha 时为 rgb，其它为 hex + */ + format?: 'hsl' | 'hsv' | 'hex' | 'rgb'; + /** + * 尺寸，可选值为large、small、default或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 当绑定值变化时触发 + * @default 当前值 + */ + $emit(eventName: 'on-change', value: string): this; + /** + * 面板中当前显示的颜色发生改变时触发 + * @default 当前显示的颜色值 + */ + $emit(eventName: 'on-active-change', value: string): this; + /** + * 下拉框展开或收起时触发 + */ + $emit(eventName: 'on-open-change', value: boolean): this; +} \ No newline at end of file diff --git a/types/iview/date-picker.d.ts b/types/iview/date-picker.d.ts new file mode 100644 index 00000000..0bf488b6 --- /dev/null +++ b/types/iview/date-picker.d.ts @@ -0,0 +1,153 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface DatePicker extends Vue { + /** + * 显示类型，可选值为 date、daterange、datetime、datetimerange、year、month'|'默认值date + */ + type?: 'date' | 'daterange' | 'datetime' | 'datetimerange' | 'year' | 'month'; + /** + * 日期，可以是 JavaScript 的 Date，例如 new Date()，也可以是标准的日期格式，点击右边查看 + * 注意：value 使用 v-model 时，值是 Date 类型，可以配合 @on-change 使用 + */ + value?: Date; + /** + * 展示的日期格式 + * date | daterange?: yyyy-MM-dd + * datetime | datetimerange：yyyy-MM-dd HH:mm:ss + * year：yyyy + * month：yyyy-MM + */ + format?: string; + /** + * 日期选择器出现的位置， + * 可选值为top,top-start,top-end, + * bottom,bottom-start,bottom-end, + * left,left-start,left-end, + * right,right-start,right-end + * 2.12.0 版本开始支持自动识别 + * @default bottom-start + */ + placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end' + /** + * 占位文本默认值空 + * @default 空 + */ + placeholder?: string; + /** + * 选择器额外配置，比如不可选日期与快捷选项，具体项详见下表 + */ + options?: object; + /** + * 开启后，左右面板不联动，仅在 daterange 和 datetimerange 下可用。 + * @default false + */ + 'split-panels'?: boolean; + /** + * 开启后，可以选择多个日期，仅在 date 下可用。 + * @default false + */ + multiple?: boolean; + /** + * 开启后，可以显示星期数。 + * @default false + */ + 'show-week-numbers': boolean; + /** + * 设置默认显示的起始日期。 + */ + 'start-date'?: Date; + /** + * 是否显示底部控制栏，开启后，选择完日期，选择器不会主动关闭，需用户确认后才可关闭, + * @default false + */ + confirm?: boolean; + /** + * 手动控制日期选择器的显示状态，true 为显示，false 为收起。使用该属性后，选择器不会主动关闭。 + * 建议配合 slot 及 confirm 和相关事件一起使用 + * @default null + */ + open?: boolean; + /** + * 尺寸，可选值为large、small、default或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 是否禁用选择器 + * @default false + */ + disabled?: boolean; + /** + * 是否显示清除按钮 + * @default true + */ + clearable?: boolean; + /** + * 完全只读，开启后不会弹出选择器，只在没有设置 open 属性下生效 + * @default false + */ + readonly?: boolean; + /** + * 文本框是否可以输入，只在没有使用 slot 时有效 + * @default true + */ + editable?: boolean; + /** + * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时， + * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果, + * @default false + */ + transfer?: boolean; + /** + * 给表单元素设置 id，详见 Form 用法。 + */ + 'element-id'?: string; + /** + * 可以在 type 为 datetime 和 datetimerange 下，配置 TimePicker 的属性， + * 比如时间间隔 steps：:time-picker-options="{steps: [1, 10, 10]}" + * @default {} + */ + 'time-picker-options'?: object; + /** + * 日期发生变化时触发 已经格式化后的日期，比如 2016-01-01 + */ + $emit(eventName: 'on-change', value: string): this; + /** + * 弹出日历和关闭日历时触发 + */ + $emit(eventName: 'on-open-change', value: boolean): this; + /** + * 在 confirm 模式下有效，点击确定按钮时触发 + */ + $emit(eventName: 'on-ok'): this; + /** + * 在 confirm 模式或 clearable = true 时有效，在清空日期时触发 + */ + $emit(eventName: 'on-clear'): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义选择器的显示内容，建议与 open 等参数一起使用，详见示例 + */ + '': VNode[]; + }; +} + +export interface DatePickerOptions extends Vue { + /** + * 设置快捷选项，每项内容： + * text：显示的文案 + * value?: 返回指定的日期，如需自己控制逻辑，可不设置，并使用 onClick 回调 + * onClick?: 点击时的回调，参数为当前日期选择器的 Vue 实例，当需要自定义复杂操作时，可以使用 + */ + shortcuts?: { text?: string, value?: () => void, onClick?: () => void }[]; + /** + * 设置不可选择的日期，参数为当前的日期，需要返回 Boolean 是否禁用这天 + */ + disabledDate(): boolean; +} \ No newline at end of file diff --git a/types/iview/divider.d.ts b/types/iview/divider.d.ts new file mode 100644 index 00000000..a2521ab5 --- /dev/null +++ b/types/iview/divider.d.ts @@ -0,0 +1,23 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Divider extends Vue { + /** + * 水平还是垂直类型，可选值为 horizontal 或 vertical + * @default horizontal + */ + type?: 'horizontal' | 'vertical'; + /** + * 分割线标题的位置，可选值为 left、right 或 center + * @default center + */ + orientation?: 'left' | 'right' | 'center'; + /** + * 是否虚线 + * @default false + */ + dashed?: boolean; +} \ No newline at end of file diff --git a/types/iview/dropdown.d.ts b/types/iview/dropdown.d.ts new file mode 100644 index 00000000..f21b2ae6 --- /dev/null +++ b/types/iview/dropdown.d.ts @@ -0,0 +1,79 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Dropdown extends Vue { + /** + * 触发方式，可选值为 hover（悬停）click（点击）contextMenu（右键）custom（自定义），使用 custom 时，需配合 visible 一起使用 + * @default hover + */ + trigger?: 'hover'|'click'|'custom'|'contextMenu'; + /** + * 手动控制下拉框的显示，在 trigger = 'custom' 时使用 + * @default false + */ + visible?: boolean; + /** + * 下拉菜单出现的位置，可选值为 + * top，top-start，top-end，bottom，bottom-start，bottom-end， + * left，left-start，left-end，right，right-start，right-end + * 2.12.0 版本开始支持自动识别 + * @default bottom + */ + placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'; + /** + * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性，它将不受父级样式影响，从而达到更好的效果 + * @default false + */ + transfer?: boolean; + /** + * 点击菜单项时触发 + * + */ + $emit(eventName: 'on-click', value: string): this; + /** + * 菜单显示状态改变时调用 + */ + $emit(eventName: 'on-visible-change', value: boolean): this; + /** + * 点击外部关闭下拉菜单时触发 + */ + $emit(eventName: 'on-clickoutside', event: object): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 主体内容 + */ + '': VNode[]; + /** + * 列表内容，一般由 DropdownMenu 承担 + */ + list: VNode[]; + }; +} + +export interface DropdownItem extends Vue { + /** + * 用来标识这一项 + */ + name?: string; + /** + * 禁用该项 + * @default false + */ + disabled?: boolean; + /** + * 显示分割线 + * @default false + */ + divided?: boolean; + /** + * 标记该项为选中状态 + * @default false + */ + selected?: boolean; +} \ No newline at end of file diff --git a/types/iview/form.d.ts b/types/iview/form.d.ts new file mode 100644 index 00000000..72d8588f --- /dev/null +++ b/types/iview/form.d.ts @@ -0,0 +1,100 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Form extends Vue { + /** + * 表单数据对象 + */ + model?: object; + /** + * 表单验证规则，具体配置查看 async-validator + */ + rules?: object; + /** + * 是否开启行内表单模式 + * @default false + */ + inline?: boolean; + /** + * 表单域标签的位置，可选值为 left、right、top + * @default right + */ + 'label-position'?: 'left'|'right'|'top'; + /** + * 表单域标签的宽度，所有的 FormItem 都会继承 Form 组件的 label-width 的值 + */ + 'label-width'?: number; + /** + * 是否显示校验错误信息 + * @default true + */ + 'show-message'?: boolean; + /** + * 对整个表单进行校验，参数为检验完的回调，会返回一个 Boolean 表示成功与失败 + */ + validate(callback?: (valid?: boolean) => void): void; + /** + * 对部分表单字段进行校验的方法，参数1为需校验的 prop，参数2为检验完回调，返回错误信息 + */ + validateField(prop?: string, callback?: (valid?: boolean) => void): void; + /** + * 对整个表单进行重置，将所有字段值重置为空并移除校验结果 + */ + resetFields(): void; +} + +export interface FormItem extends Vue { + /** + * 对应表单域 model 里的字段 + */ + prop?: string; + /** + * 标签文本 + */ + label?: string; + /** + * 表单域标签的的宽度 + */ + 'label-width'?: number; + /** + * 指定原生的 label 标签的 for 属性，配合控件的 element-id 属性，可以点击 label 时聚焦控件。 + */ + 'label-for'?: string; + /** + * 是否必填，如不设置，则会根据校验规则自动生成 + */ + required?: boolean; + /** + * 表单验证规则 + */ + rules?: object | Array; + /** + * 表单域验证错误信息, 设置该值会使表单验证状态变为error，并显示该错误信息 + */ + error?: string; + /** + * 是否显示校验错误信息 + * @default true + */ + 'show-message'?: boolean; + /** + * slot插槽对象 + */ + $slots: { + /** + * 内容 + */ + '': VNode[]; + /** + * label 内容 + */ + label: VNode[]; + }; +} + + + + diff --git a/types/iview/grid.d.ts b/types/iview/grid.d.ts new file mode 100644 index 00000000..41f7dfab --- /dev/null +++ b/types/iview/grid.d.ts @@ -0,0 +1,72 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface GridRow extends Vue { + /** + * 栅格间距，单位 px，左右平分 + * @default 0 + */ + gutter?: number; + /** + * 布局模式，可选值为flex或不选，在现代浏览器下有效 + */ + type?: string; + /** + * lex 布局下的垂直对齐方式，可选值为top、middle、bottom + */ + align?: 'top'|'middle'|'bottom'; + /** + * flex 布局下的水平排列方式，可选值为start、end、center、space-around、space-between + */ + justify?: 'start'|'end'|'center'|'space-around'|'space-between'; + /** + * 自定义的class名称 + */ + 'class-name'?: string; +} + +export interface GridCol extends Vue { + /** + * 栅格的占位格数，可选值为0~24的整数，为 0 时，相当于display:none + */ + span?: number | string; + /** + * 栅格的顺序，在flex布局模式下有效 + */ + order?: number | string; + /** + * 栅格左侧的间隔格数，间隔内不可以有栅格 + */ + offset?: number | string; + /** + * 栅格向右移动格数 + */ + push?: number | string; + /** + * 栅格向左移动格数 + */ + pull?: number | string; + /** + * 自定义的class名称 + */ + 'class-name'?: string; + /** + * <768px 响应式栅格，可为栅格数或一个包含其他属性的对象 + */ + xs?: number | object; + /** + * ≥768px 响应式栅格，可为栅格数或一个包含其他属性的对象 + */ + sm?: number | object; + /** + * ≥992px 响应式栅格，可为栅格数或一个包含其他属性的对象 + */ + md?: number | object; + /** + * ≥1200px 响应式栅格，可为栅格数或一个包含其他属性的对象 + */ + lg?: number | object; +} \ No newline at end of file diff --git a/types/iview/icon.d.ts b/types/iview/icon.d.ts new file mode 100644 index 00000000..f6134417 --- /dev/null +++ b/types/iview/icon.d.ts @@ -0,0 +1,20 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Icon extends Vue { + /** + * 图标的名称 + */ + type?: string; + /** + * 图标的大小，单位是 px + */ + size?: number | string; + /** + * 图标的颜色 + */ + color?: string; +} \ No newline at end of file diff --git a/types/iview/index.d.ts b/types/iview/index.d.ts new file mode 100644 index 00000000..62152192 --- /dev/null +++ b/types/iview/index.d.ts @@ -0,0 +1,237 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode, PluginFunction } from "vue"; + +import { Affix } from "./affix"; +import { Alert } from "./alert"; +import { Anchor, AnchorLink } from "./anchor"; +import { AutoComplete } from "./auto-complete"; +import { Avatar } from "./avatar"; +import { BackTop } from "./back-top"; +import { Badge } from "./badge"; +import { Breadcrumb, BreadcrumbItem } from "./breadcrumb"; +import { Button, ButtonGroup } from "./button"; +import { Card } from "./card"; +import { Carousel } from "./carousel"; +import { Cascader } from "./cascader"; +import { Cell, CellGroup } from "./cell"; +import { Checkbox, CheckboxGroup } from "./checkbox"; +import { Circle } from "./circle"; +import { Collapse, CollapsePanel } from "./collapse"; +import { ColorPicker } from "./color-picker"; +import { DatePicker, DatePickerOptions } from "./date-picker"; +import { Divider } from "./divider"; +import { Dropdown, DropdownItem } from "./dropdown"; +import { Form, FormItem } from "./form"; +import { GridRow, GridCol } from "./grid"; +import { Icon } from "./icon"; +import { Input } from "./input"; +import { InputNumber } from "./input-number"; +import { Layout } from "./layout"; +import { LoadingBarInstance, LoadingBarConfig } from "./loading-bar"; +import { Menu, MenuItem, Submenu, MenuGroup } from "./menu"; +import { MessageInstance, MessageConfig } from "./message"; +import { Modal, ModalInstance, ModalConfig } from "./modal"; +import { NoticeInstance, NoticeConfig, NoticeGlobalConfig } from "./notice"; +import { Page } from "./page"; +import { Poptip } from "./poptip"; +import { Progress } from "./progress"; +import { Radio, RadioGroup } from "./radio"; +import { Rate } from "./rate"; +import { Scroll } from "./scroll"; +import { Select, SelectOption, SelectOptionGroup } from "./select"; +import { Spin } from "./spin"; +import { Split } from "./split"; +import { Steps, Step } from "./steps"; +import { Switch } from "./switch"; +import { Table, TableColumn, TableRenderCreateElementData, TableRenderCreateElementResult, TableColumnRenderParams, TableExportCsvParams } from "./table"; +import { Tabs, TabPane } from "./tabs"; +import { Tag } from "./tag"; +import { Time } from "./time"; +import { Timeline, TimelineItem } from "./timeline"; +import { TimePicker } from "./time-picker"; +import { Tooltip } from "./tooltip"; +import { Transfer } from "./transfer"; +import { Tree, TreeChild } from "./tree"; +import { Upload } from "./upload"; + +declare namespace IView { + type IAffix = Affix; + type IAlert = Alert; + type IAnchor = Anchor; + type IAnchorLink = AnchorLink; + type IAutoComplete = AutoComplete; + type IAvatar = Avatar; + type IBackTop = BackTop; + type IBadge = Badge; + type IBreadcrumb = Breadcrumb; + type IBreadcrumbItem = BreadcrumbItem; + type IButton = Button; + type IButtonGroup = ButtonGroup; + type ICard = Card; + type ICarousel = Carousel; + type ICascader = Cascader; + type ICell = Cell; + type ICellGroup = CellGroup; + type ICheckbox = Checkbox; + type ICheckboxGroup = CheckboxGroup; + type ICircle = Circle; + type ICollapse = Collapse; + type ICollapsePanel = CollapsePanel; + type IColorPicker = ColorPicker; + type IDatePicker = DatePicker; + type IDatePickerOptions = DatePickerOptions; + type IDivider = Divider; + type IDropdown = Dropdown; + type IDropdownItem = DropdownItem; + type IForm = Form; + type IFormItem = FormItem; + type IGridCol = GridCol; + type IGridRow = GridRow; + type IIcon = Icon; + type IInput = Input; + type IInputNumber = InputNumber; + type ILayout = Layout; + type ILoadingBarInstance = LoadingBarInstance; + type ILoadingBarConfig = LoadingBarConfig; + type IMenu = Menu; + type IMenuGroup = MenuGroup; + type IMenuItem = MenuItem; + type IMessageConfig = MessageConfig; + type IMessageInstance = MessageInstance; + type IModal = Modal; + type IModalConfig = ModalConfig; + type IModalInstance = ModalInstance; + type INoticeConfig = NoticeConfig; + type INoticeGlobalConfig = NoticeGlobalConfig; + type INoticeInstance = NoticeInstance; + type IPage = Page; + type IPoptip = Poptip; + type IProgress = Progress; + type IRadio = Radio; + type IRadioGroup = RadioGroup; + type IRate = Rate; + type IScroll = Scroll; + type ISelect = Select; + type ISelectOption = SelectOption; + type ISelectOptionGroup = SelectOptionGroup; + type ISpin = Spin; + type ISplit = Split; + type IStep = Step; + type ISteps = Steps; + type ISubmenu = Submenu; + type ISwitch = Switch; + type ITable = Table; + type ITableColumn = TableColumn; + type ITableColumnRenderParams = TableColumnRenderParams; + type ITableExportCsvParams = TableExportCsvParams; + type ITableRenderCreateElementData = TableRenderCreateElementData; + type ITableRenderCreateElementResult = TableRenderCreateElementResult; + type ITabPane = TabPane; + type ITabs = Tabs; + type ITag = Tag; + type ITime = Time; + type ITimeline = Timeline; + type ITimelineItem = TimelineItem; + type ITimePicker = TimePicker; + type ITooltip = Tooltip; + type ITransfer = Transfer; + type ITree = Tree; + type ITreeChild = TreeChild; + type IUpload = Upload; +} + +declare interface IView extends PluginFunction { + readonly IAffix: Affix; + readonly IAlert: Alert; + readonly IAnchor: Anchor; + readonly IAnchorLink: AnchorLink; + readonly IAutoComplete: AutoComplete; + readonly IAvatar: Avatar; + readonly IBackTop: BackTop; + readonly IBadge: Badge; + readonly IBreadcrumb: Breadcrumb; + readonly IBreadcrumbItem: BreadcrumbItem; + readonly IButton: Button; + readonly IButtonGroup: ButtonGroup; + readonly ICard: Card; + readonly ICarousel: Carousel; + readonly ICascader: Cascader; + readonly ICell: Cell; + readonly ICellGroup: CellGroup; + readonly ICheckbox: Checkbox; + readonly ICheckboxGroup: CheckboxGroup; + readonly ICircle: Circle; + readonly ICollapse: Collapse; + readonly ICollapsePanel: CollapsePanel; + readonly IColorPicker: ColorPicker; + readonly IDatePicker: DatePicker; + readonly IDatePickerOptions: DatePickerOptions; + readonly IDivider: Divider; + readonly IDropdown: Dropdown; + readonly IDropdownItem: DropdownItem; + readonly IForm: Form; + readonly IFormItem: FormItem; + readonly IGridCol: GridCol; + readonly IGridRow: GridRow; + readonly IIcon: Icon; + readonly IInput: Input; + readonly IInputNumber: InputNumber; + readonly ILayout: Layout; + readonly ILoadingBarInstance: LoadingBarInstance; + readonly ILoadingBarConfig: LoadingBarConfig; + readonly IMenu: Menu; + readonly IMenuGroup: MenuGroup; + readonly IMenuItem: MenuItem; + readonly IMessageConfig: MessageConfig; + readonly IMessageInstance: MessageInstance; + readonly IModal: Modal; + readonly IModalConfig: ModalConfig; + readonly IModalInstance: ModalInstance; + readonly INoticeConfig: NoticeConfig; + readonly INoticeGlobalConfig: NoticeGlobalConfig; + readonly INoticeInstance: NoticeInstance; + readonly IPage: Page; + readonly IPoptip: Poptip; + readonly IProgress: Progress; + readonly IRadio: Radio; + readonly IRadioGroup: RadioGroup; + readonly IRate: Rate; + readonly IScroll: Scroll; + readonly ISelect: Select; + readonly ISelectOption: SelectOption; + readonly ISelectOptionGroup: SelectOptionGroup; + readonly ISpin: Spin; + readonly ISplit: Split; + readonly IStep: Step; + readonly ISteps: Steps; + readonly ISubmenu: Submenu; + readonly ISwitch: Switch; + readonly ITable: Table; + readonly ITableColumn: TableColumn; + readonly ITableColumnRenderParams: TableColumnRenderParams; + readonly ITableExportCsvParams: TableExportCsvParams; + readonly ITableRenderCreateElementData: TableRenderCreateElementData; + readonly ITableRenderCreateElementResult: TableRenderCreateElementResult; + readonly ITabPane: TabPane; + readonly ITabs: Tabs; + readonly ITag: Tag; + readonly ITime: Time; + readonly ITimeline: Timeline; + readonly ITimelineItem: TimelineItem; + readonly ITimePicker: TimePicker; + readonly ITooltip: Tooltip; + readonly ITransfer: Transfer; + readonly ITree: Tree; + readonly ITreeChild: TreeChild; + readonly IUpload: Upload; +} + +export default IView; + +declare module 'iview/types/iview' { + const iView: IView; + export default iView; +} diff --git a/types/iview/input-number.d.ts b/types/iview/input-number.d.ts new file mode 100644 index 00000000..222d6bde --- /dev/null +++ b/types/iview/input-number.d.ts @@ -0,0 +1,75 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface InputNumber extends Vue { + /** + * 最大值，默认值Infinity + */ + max?: number; + /** + * 最小值，默认值-Infinity + */ + min?: number; + /** + * 当前值，可以使用 v-model 双向绑定数据，默认值1 + */ + value?: number; + /** + * 每次改变的步伐，可以是小数，默认值1 + */ + step?: number; + /** + * 输入框尺寸，可选值为large、small、default或者不填 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 设置禁用状态，默认值false + */ + disabled?: boolean; + /** + * 输入框占位符 + * @default 请选择 + */ + placeholder?: string; + /** + * 指定输入框展示值的格式 + */ + formatter?: () => void; + /** + * 指定从 formatter 里转换回数字的方式，和 formatter 搭配使用 + */ + parser?: () => void; + /** + * 是否设置为只读 + * @default false + */ + readonly?: boolean; + /** + * 是否可编辑 + * @default true + */ + editable?: boolean; + /** + * 数值精度 + */ + precision?: number; + /** + * 给表单元素设置 id，详见 Form 用法。 + */ + 'element-id'?: string; + /** + * 数值改变时的回调，返回当前值，默认值当前值 + */ + $emit(eventName: 'on-change', value: number): this; + /** + * 聚焦时触发 + */ + $emit(eventName: 'on-focus', event: KeyboardEvent): this; + /** + * 失焦时触发 + */ + $emit(eventName: 'on-blur', event: KeyboardEvent): this; +} \ No newline at end of file diff --git a/types/iview/input.d.ts b/types/iview/input.d.ts new file mode 100644 index 00000000..760968c6 --- /dev/null +++ b/types/iview/input.d.ts @@ -0,0 +1,168 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Input extends Vue { + /** + * 输入框类型，可选值为 text、password、textarea、url、email、date + * @default text + */ + type?: 'text' | 'password' | 'textarea' | 'url' | 'email' | 'date'; + /** + * 绑定的值，可使用 v-model 双向绑定 + * @default 空 + */ + value?: string | number; + /** + * 输入框尺寸，可选值为large、small、default或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 占位文本 + */ + placeholder?: string; + /** + * 是否显示清空按钮 + * @default false + */ + clearable?: boolean; + /** + * 设置输入框为禁用状态 + * @default false + */ + disabled?: boolean; + /** + * 设置输入框为只读 + * @default false + */ + readonly?: boolean; + /** + * 最大输入长度 + */ + maxlength?: number; + /** + * 输入框尾部图标，仅在 text 类型下有效 + */ + icon?: string; + /** + * 输入框头部图标 + * @default false + */ + prefix?: string; + /** + * 输入框尾部图标 + * @default false + */ + suffix?: String; + /** + * 是否显示为搜索型输入框 + * @default false + */ + search?: boolean; + /** + * 开启 search 时可用，是否有确认按钮，可设为按钮文字 + * @default false + */ + 'enter-button'?: boolean | string; + /** + * 文本域默认行数，仅在 textarea 类型下有效 + * @default 2 + */ + rows?: number; + /** + * 自适应内容高度，仅在 textarea 类型下有效，可传入对象，如 { minRows: 2, maxRows: 6 } + * @default false + */ + autosize?: boolean | { minRows?: number, maxRows?: number }; + /** + * 将用户的输入转换为 number 类型 + * @default false + */ + number?: boolean; + /** + * 自动获取焦点 + * @default false + */ + autofocus?: boolean; + /** + * 原生的自动完成功能，可选值为 off 和 on,off + */ + autocomplete?: string; + /** + * 给表单元素设置 id，详见 Form 用法。 + */ + 'element-id'?: string; + /** + * 原生的 spellcheck 属性 + * @default false + */ + spellcheck?: boolean; + /** + * 原生的 wrap 属性，可选值为 hard 和 soft，仅在 textarea 下生效 + * @default soft + */ + wrap?: 'hard' | 'soft'; + /** + * 按下回车键时触发 + */ + $emit(eventName: 'on-enter'): this; + /** + * 设置 icon 属性后，点击图标时触发 + */ + $emit(eventName: 'on-click'): this; + /** + * 数据改变时触发 + */ + $emit(eventName: 'on-change', event: string): this; + /** + * 输入框聚焦时触发 + */ + $emit(eventName: 'on-focus'): this; + /** + * 输入框失去焦点时触发 + */ + $emit(eventName: 'on-blur'): this; + /** + * 原生的 keyup 事件 + */ + $emit(eventName: 'on-keyup', event: KeyboardEvent): this; + /** + * 原生的 keydown 事件 + */ + $emit(eventName: 'on-keydown', event: KeyboardEvent): this; + /** + * 原生的 keypress 事件 + */ + $emit(eventName: 'on-keypress', event: KeyboardEvent): this; + /** + * 开启 search 时可用，点击搜索或按下回车键时触发 + */ + $emit(eventName: 'on-search', value: string): this; + /** + * 手动聚焦输入框 + */ + focus(): void; + /** + * slot插槽对象 + */ + $slots: { + /** + * 前置内容，仅在 text 类型下有效 + */ + prepend: VNode[]; + /** + * 后置内容，仅在 text 类型下有效 + */ + append: VNode[]; + /** + * 输入框头部图标 + */ + prefix: VNode[]; + /** + * 输入框尾部图标 + */ + suffix: VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/iview.d.ts b/types/iview/iview.d.ts new file mode 100644 index 00000000..408519fa --- /dev/null +++ b/types/iview/iview.d.ts @@ -0,0 +1,4 @@ +declare module 'iview' { + const iView: any; + export default iView; +} \ No newline at end of file diff --git a/types/iview/layout.d.ts b/types/iview/layout.d.ts new file mode 100644 index 00000000..cadc4c45 --- /dev/null +++ b/types/iview/layout.d.ts @@ -0,0 +1,72 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Layout extends Vue { + /** + * 触发响应式布局的断点，可选值为xs,sm,md,lg,xl或xxl，若不设此属性则不会触发响应式布局。 + * { + * xs?: '480px', + * sm?: '768px', + * md?: '992px', + * lg?: '1200px', + * xl?: '1600px' + * } + */ + breakpoint?: string; + /** + * 侧边栏是否收起，可使用 v-model 双向绑定数据。 + * @default false + */ + value?: boolean; + /** + * 宽度 + * @default 200 + */ + width?: number; + /** + * 是否可收起，设为false后，默认触发器会隐藏，且响应式布局不会触发 + * @default false + */ + collapsible?: boolean; + /** + * 收缩宽度，设置为 0 会出现特殊 trigger + * @default 64 + */ + 'collapsed-width'?: number; + /** + * 隐藏默认触发器 + * @default false + */ + 'hide-trigger'?: boolean; + /** + * 是否默认收起，设置了collapsible后设置此属性侧边栏仍会收起。 + * @default false + */ + 'default-collapsed'?: boolean; + /** + * 改变侧边栏触发器箭头方向，和改变侧边栏收起方向，当Sider在右边时可以使用。 + * @default false + */ + 'reverse-arrow'?: boolean; + /** + * 展开-收起时的回调true/false + */ + $emit(eventName: 'on-collapse', []): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义触发器 + * @default + */ + trigger: VNode[]; + }; + /** + * methods, 改变Sider展开-收起状态。 + */ + toggleCollapse(): void; +} \ No newline at end of file diff --git a/types/iview/loading-bar.d.ts b/types/iview/loading-bar.d.ts new file mode 100644 index 00000000..2111efa6 --- /dev/null +++ b/types/iview/loading-bar.d.ts @@ -0,0 +1,61 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface LoadingBarInstance { + /** + * 开始从 0 显示进度条，并自动加载进度 + */ + start(): void; + /** + * 结束进度条，自动补全剩余进度 + */ + finish(): void; + /** + * 以错误的类型结束进度条，自动补全剩余进度 + */ + error(): void; + /** + * 精确加载到指定的进度 + * @param percent 指定的进度百分比 + */ + update(percent?: number): void; + /** + * 全局配置 + * @param options 配置对象 + */ + config(options?: LoadingBarConfig): void; + /** + * 全局销毁 + */ + destroy(): void; +} + +export interface LoadingBarConfig { + /** + * 进度条的颜色，默认为 iView 主色 + * @default primary + */ + color?: string; + /** + * 失败时的进度条颜色，默认为 iView 主色 + * @default error + */ + failedColor?: string; + /** + * 进度条高度，单位 px + * @default 2 + */ + height?: number; +} + +declare module "vue/types/vue" { + interface Vue { + /** + * 加载进度条 + */ + $Loading?: LoadingBarInstance; + } +} \ No newline at end of file diff --git a/types/iview/menu.d.ts b/types/iview/menu.d.ts new file mode 100644 index 00000000..1a8cc7ec --- /dev/null +++ b/types/iview/menu.d.ts @@ -0,0 +1,102 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Menu extends Vue { + /** + * 菜单类型，可选值为 horizontal（水平） 和 vertical（垂直） + * @default vertical + */ + mode?: 'horizontal' | 'vertical'; + /** + * 主题，可选值为 light、dark、primary，其中 primary 只适用于 mode="horizontal" + * @default light + */ + theme?: 'light' | 'dark' | 'primary'; + /** + * 激活菜单的 name 值 + */ + 'active-name'?: string | number; + /** + * 展开的 Submenu 的 name 集合 + */ + 'open-names'?: string[] | number[]; + /** + * 是否开启手风琴模式，开启后每次至多展开一个子菜单 + * @default false + */ + accordion?: boolean; + /** + * 导航菜单的宽度，只在 mode="vertical" 时有效，如果使用 Col 等布局，建议设置为 auto + * @default 240px + */ + width?: string; + /** + * 选择菜单（MenuItem）时触发 + */ + $emit(eventName: 'on-select', name?: string | number): this; + /** + * 当 展开/收起 子菜单时触发 + * @default 当前展开的 Submenu 的 name 值数组 + */ + $emit(eventName: 'on-open-change', names: string[] | number[]): this; + /** + * 手动更新展开的子目录，注意要在 $nextTick 里调用 + */ + updateOpened(): void; + /** + * 手动更新当前选择项，注意要在 $nextTick 里调用 + */ + updateActiveName(): void; +} + +export interface MenuItem extends Vue { + /** + * 菜单项的唯一标识，必填 + */ + name?: string | number; + /** + * 跳转的链接，支持 vue-router 对象 + */ + to?: string | object; + /** + * 路由跳转时，开启 replace 将不会向 history 添加新记录 + * @default false + */ + replace?: boolean; + /** + * 相当于 a 链接的 target 属性 + * @default _self + */ + target?: '_blank' | '_self' | '_parent' | '_top'; +} + +export interface Submenu extends Vue { + /** + * 子菜单的唯一标识，必填 + */ + name?: string | number; + /** + * slot插槽对象 + */ + $slots: { + /** + * 菜单项 + */ + '': VNode[]; + /** + * 子菜单标题 + */ + title: VNode[]; + }; +} + +export interface MenuGroup extends Vue { + /** + * 分组标题 + * @default 空 + */ + title?: string; +} \ No newline at end of file diff --git a/types/iview/message.d.ts b/types/iview/message.d.ts new file mode 100644 index 00000000..a49659ab --- /dev/null +++ b/types/iview/message.d.ts @@ -0,0 +1,84 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode, CreateElement } from "vue"; + +export interface MessageInstance { + /** + * 消息 + * @param config MessageConfig为相关配置,string为待显示的内容 + */ + info(config?: MessageConfig | string): void; + /** + * 成功 + * @param config MessageConfig为相关配置,string为待显示的内容 + */ + success(config?: MessageConfig | string): void; + /** + * 警告 + * @param config MessageConfig为相关配置,string为待显示的内容 + */ + warning(config?: MessageConfig | string): void; + /** + * 错误 + * @param config MessageConfig为相关配置,string为待显示的内容 + */ + error(config?: MessageConfig | string): void; + /** + * 配置 + * @param config MessageConfig为相关配置,string为待显示的内容 + */ + loading(options?: MessageConfig | string): void; + /** + * 配置 + * @param config MessageConfig为相关配置,string为待显示的内容 + */ + config(options?: MessageConfig): void; + /** + * 销毁 + */ + destroy(): void; +} + +export interface MessageConfig { + /** + * 提示内容 + */ + content?: string; + /** + * 自定义描述内容，使用 Vue 的 Render 函数 + */ + render?: (h: CreateElement) => VNode; + /** + * 关闭时的回调 + */ + onClose?: () => void; + /** + * 页面是否可以滚动 + * @default false + */ + closable?: boolean; + /** + * 提示组件距离顶端的距离，单位像素 + * @default 24 + */ + top?: number; + /** + * 默认自动关闭的延时，单位秒 + * @default 1.5 + */ + duration?: number; +} + +declare module "vue/types/vue" { + interface Vue { + /** + * 全局提示 + */ + $Message?: MessageInstance; + } +} + + + diff --git a/types/iview/modal.d.ts b/types/iview/modal.d.ts new file mode 100644 index 00000000..ed8a50fe --- /dev/null +++ b/types/iview/modal.d.ts @@ -0,0 +1,218 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Modal { + /** + * 对话框是否显示，可使用 v-model 双向绑定数据。 + * @default false + */ + value?: boolean; + /** + * 对话框标题，如果使用 slot 自定义了页头，则 title 无效 + */ + title?: string; + /** + * 是否显示右上角的关闭按钮，关闭后 Esc 按键也将关闭, + * @default true + */ + closable?: boolean; + /** + * 是否允许点击遮罩层关闭 + * @default true + */ + 'mask-closable'?: boolean; + /** + * 点击确定按钮时，确定按钮是否显示 loading 状态，开启则需手动设置visible来关闭对话框, + * @default false + */ + loading?: boolean; + /** + * 页面是否可以滚动 + * @default false + */ + scrollable?: boolean; + /** + * 是否全屏显示 + * @default false + */ + fullscreen?: boolean; + /** + * 是否可以拖拽移动 + * @default false + */ + draggable?: boolean; + /** + * 是否显示遮罩层，开启 draggable 时，强制不显示 + * @default true + */ + mask?: boolean; + /** + * 确定按钮文字 + * @default 确定 + */ + 'ok-text'?: string; + /** + * 取消按钮文字 + * @default 取消 + */ + 'cancel-text'?: string; + /** + * 对话框宽度，单位 px。 + * 对话框的宽度是响应式的，当屏幕尺寸小于 768px 时，宽度会变为自动auto, + * @default 520 + */ + width?: number | string; + /** + * 不显示底部 + * @default false + */ + 'footer-hide'?: boolean; + /** + * 设置浮层样式，调整浮层位置等，该属性设置的是.ivu-modal的样式 + */ + style?: object; + /** + * 设置对话框容器.ivu-modal-wrap的类名，可辅助实现垂直居中等自定义效果 + */ + 'class-name'?: string; + /** + * 自定义显示动画，第一项是模态框，第二项是背景, + * @default ['ease', 'fade'] + */ + 'transition-names'?: Array; + /** + * 是否将弹层放置于 body 内，默认值true + * @default true + */ + transfer?: boolean; + /** + * 点击确定的回调 + */ + $emit(eventName: 'on-ok'): this; + /** + * 开关变化时触发，返回当前的状态 + */ + $emit(eventName: 'on-cancel'): this; + /** + * 开关变化时触发，返回当前的状态 + */ + $emit(eventName: 'on-visible-change', visible: boolean): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 对话框主体内容 + */ + '': VNode[]; + /** + * 自定义页头 + */ + header: VNode[]; + /** + * 自定义页脚内容 + */ + footer: VNode[]; + /** + * 自定义右上角关闭内容 + */ + close: VNode[]; + }; +} + +export interface ModalInstance { + /** + * 消息 + * @param config ModalConfig为相关配置,string为待显示的内容 + */ + info(config?: ModalConfig | string): void; + /** + * 成功 + * @param config ModalConfig为相关配置,string为待显示的内容 + */ + success(config?: ModalConfig | string): void; + /** + * 警告 + * @param config ModalConfig为相关配置,string为待显示的内容 + */ + warning(config?: ModalConfig | string): void; + /** + * 错误 + * @param config ModalConfig为相关配置,string为待显示的内容 + */ + error(config?: ModalConfig | string): void; + /** + * 对话框 + * @param config ModalConfig为相关配置,string为待显示的内容 + */ + confirm(config?: ModalConfig | string): void; + /** + * 移除 + */ + remove(): void; +} + +export interface ModalConfig { + /** + * 标题或者Element选择器字符串 + */ + title?: string; + /** + * 内容或者Element选择器字符串 + */ + content?: string; + /** + * 自定义内容，使用后不再限制类型， content 也无效。 + */ + render?: () => void; + /** + * 宽度，单位 px + * @default 416 + */ + width?: number | string; + /** + * 确定按钮的文字 + * @default 确定 + */ + okText?: string; + /** + * 取消按钮的文字，只在Modal.confirm()下有效 + * @default 取消 + */ + cancelText?: string; + /** + * 点击确定按钮时，确定按钮是否显示 loading 状态，开启则需手动调用Modal.remove()来关闭对话框 + * @default false + */ + loading?: boolean; + /** + * 页面是否可以滚动 + * @default false + */ + scrollable?: boolean; + /** + * 页面是否可以滚动 + * @default false + */ + closable?: boolean; + /** + * 点击确定的回调 + */ + onOk?: () => void; + /** + * 点击取消的回调，只在Modal.confirm()下有效 + */ + onCancel?: () => void; +} + +declare module "vue/types/vue" { + interface Vue { + /** + * 对话框 + */ + $Modal?: ModalInstance; + } +} \ No newline at end of file diff --git a/types/iview/notice.d.ts b/types/iview/notice.d.ts new file mode 100644 index 00000000..808b1f6e --- /dev/null +++ b/types/iview/notice.d.ts @@ -0,0 +1,92 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode, CreateElement } from "vue"; + +export interface NoticeInstance { + /** + * 打开 + * @param config NoticeConfig为相关配置,string为待显示的内容 + */ + open(config?: NoticeConfig | string): void; + /** + * 信息 + * @param config NoticeConfig为相关配置,string为待显示的内容 + */ + info(config?: NoticeConfig | string): void; + /** + * 成功 + * @param config NoticeConfig为相关配置,string为待显示的内容 + */ + success(config?: NoticeConfig | string): void; + /** + * 警告 + * @param config NoticeConfig为相关配置,string为待显示的内容 + */ + warning(config?: NoticeConfig | string): void; + /** + * 错误 + * @param config NoticeConfig为相关配置,string为待显示的内容 + */ + error(config?: NoticeConfig): void; + /** + * 全局配置 + */ + config(options?: NoticeGlobalConfig): void; + /** + * 全局关闭某个通知 + */ + close(name?: string): void; + /** + * 全局销毁 + */ + destroy(): void; +} + +export interface NoticeConfig { + /** + * 通知提醒的标题 + */ + title?: string; + /** + * 通知提醒的内容，为空或不填时，自动应用仅标题模式下的样式 + */ + desc?: string; + /** + * 自定义描述内容，使用 Vue 的 Render 函数 + */ + render?: (h: CreateElement) => VNode; + /** + * 自动关闭的延时，单位秒，不关闭可以写 0 默认4.5 + */ + duration?: number; + /** + * 当前通知的唯一标识 + */ + name?: string; + /** + * 关闭时的回调 + */ + onClose?: Function; +} + +export interface NoticeGlobalConfig { + /** + * 通知组件距离顶端的距离，单位像素 默认24 + */ + top?: number; + /** + * 默认自动关闭的延时，单位秒 默认4.5 + */ + duration?: number; +} + +declare module "vue/types/vue" { + interface Vue { + /** + * 通知提醒 + */ + $Notice?: NoticeInstance; + } +} \ No newline at end of file diff --git a/types/iview/page.d.ts b/types/iview/page.d.ts new file mode 100644 index 00000000..2e8cd7c0 --- /dev/null +++ b/types/iview/page.d.ts @@ -0,0 +1,99 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Page extends Vue { + /** + * 当前页码，支持 .sync 修饰符 + * @default 1 + */ + current?: number; + /** + * 数据总数 + * @default 0 + */ + total?: number; + /** + * 每页条数 + * @default 10 + */ + 'page-size'?: number; + /** + * 每页条数切换的配置 + * @default [10, 20, 30, 40] + */ + 'page-size-opts'?: number[]; + /** + * 条数切换弹窗的展开方向，可选值为 bottom 和 top + * @default bottom + */ + placement?: string; + /** + * 可选值为small（迷你版）或不填（默认） + */ + size?: string; + /** + * 简洁版 + * @default false + */ + simple?: boolean; + /** + * 显示总数 + * @default false + */ + 'show-total'?: boolean; + /** + * 显示电梯，可以快速切换到某一页 + * @default false + */ + 'show-elevator'?: boolean; + /** + * 显示分页，用来改变page-size + * @default false + */ + 'show-sizer'?: boolean; + /** + * 自定义 class 名称 + */ + 'class-name'?: string; + /** + * 自定义 style 样式 + */ + styles?: object; + /** + * 是否将弹层放置于 body 内， + * 在 Tabs、带有 fixed 的 Table 列内使用时，建议添加此属性， + * 它将不受父级样式影响，从而达到更好的效果 + * @default false + */ + transfer?: boolean; + /** + * 替代图标显示的上一页文字 + */ + 'prev-text'?: string; + /** + * 替代图标显示的下一页文字 + */ + 'next-text'?: string; + /** + * 页码改变的回调，返回改变后的页码 + * @param pageNum 页码 + */ + $emit(eventName: 'on-change', pageNum: number): this; + /** + * 切换每页条数时的回调，返回切换后的每页条数 + * @param pageSize 每页条数 + */ + $emit(eventName: 'on-page-size-change', pageSize: number): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义显示总数的内容 + */ + '': VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/poptip.d.ts b/types/iview/poptip.d.ts new file mode 100644 index 00000000..58d321b9 --- /dev/null +++ b/types/iview/poptip.d.ts @@ -0,0 +1,123 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Poptip extends Vue { + /** + * 触发方式，可选值为hover（悬停）click（点击）focus（聚焦）, + * 在 confirm 模式下，只有 click 有效 + * @default click + */ + trigger?: string; + /** + * 显示的标题 + */ + title?: string | number; + /** + * 显示的正文内容，只在非 confirm 模式下有效\ + * @default 空 + */ + content?: string | number; + /** + * 提示框出现的位置，可选值为 + * top，top-start，top-end，bottom，bottom-start，bottom-end， + * left，left-start，left-end，right，right-start，right-end + * 2.12.0 版本开始支持自动识别 + * @default top + */ + placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'; + /** + * 宽度，最小宽度为 150px，在 confirm 模式下，默认最大宽度为 300px + */ + width?: string | number; + /** + * 是否开启对话框模式 + * @default false + */ + confirm?: boolean; + /** + * 确定按钮的文字，只在 confirm 模式下有效 + * @default 确定 + */ + 'ok-text'?: string; + /** + * 取消按钮的文字，只在 confirm 模式下有效 + * @default 取消 + */ + 'cancel-text'?: string; + /** + * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时， + * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果 + * @default false + */ + transfer?: boolean; + /** + * 给 Poptip 设置 class-name，在使用 transfer 时会很有用 + * @default false + */ + 'popper-class'?: string; + /** + * 开启后，超出指定宽度文本将自动换行，并两端对齐 + * @default false + */ + 'word-wrap'?: boolean; + /** + * 自定义间距值 + * @default 8px 16px + */ + padding?: string; + /** + * 出现位置的偏移量 + * @default false + */ + offset?: string; + /** + * 自定义 popper.js 的配置项，具体配置见 popper.js 文档 + * @default { + modifiers: { + computeStyle:{ + gpuAcceleration: false, + }, + preventOverflow :{ + boundariesElement: 'window' + } + } + } + */ + options?: object; + /** + * 在提示框显示时触发 + */ + $emit(eventName: 'on-popper-show'): this; + /** + * 在提示框消失时触发 + */ + $emit(eventName: 'on-popper-hide'): this; + /** + * 点击确定的回调，只在 confirm 模式下有效 + */ + $emit(eventName: 'on-ok'): this; + /** + * 点击取消的回调，只在 confirm 模式下有效 + */ + $emit(eventName: 'on-cancel'): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 主体内容 + */ + '': VNode[]; + /** + * 提示框标题，定义此 slot 时，会覆盖 props title + */ + title: VNode[]; + /** + * 提示框内容，定义此 slot 时，会覆盖 props content，只在非 confirm 模式下有效 + */ + content: VNode[]; + } +} \ No newline at end of file diff --git a/types/iview/progress.d.ts b/types/iview/progress.d.ts new file mode 100644 index 00000000..5d4748f3 --- /dev/null +++ b/types/iview/progress.d.ts @@ -0,0 +1,47 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Progress extends Vue { + /** + * 百分比 + * @default 0 + */ + percent?: number; + /** + * 状态，可选值为normal、active、wrong、success + * @default normal + */ + status?: 'normal'|'active'|'wrong'|'success'; + /** + * 进度条的线宽，单位 px + * @default 10 + */ + 'stroke-width'?: number; + /** + * 隐藏数值或状态图标 + * @default false + */ + 'hide-info'?: boolean; + /** + * 是否在垂直方向显示 + * @default false + */ + vertical?: boolean; + /** + * 已完成的分段百分比 + * @default 0 + */ + 'success-percent'?: number; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义显示状态内容 + */ + '': VNode[]; + }; +} diff --git a/types/iview/radio.d.ts b/types/iview/radio.d.ts new file mode 100644 index 00000000..32c1104c --- /dev/null +++ b/types/iview/radio.d.ts @@ -0,0 +1,64 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Radio extends Vue { + /** + * 只在单独使用时有效。可以使用 v-model 双向绑定数据 + * @default false + */ + value?: boolean; + /** + * 只在组合使用时有效。指定当前选项的 value 值，组合会自动判断当前选择的项目 + */ + label?: string | number; + /** + * 是否禁用当前项 + * @default false + */ + disabled?: boolean; + /** + * 单选框的尺寸，可选值为 large、small、default 或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用 + * @default true + */ + 'true-value'?: string | number | boolean; + /** + * 没有选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用 + * @default false + */ + 'false-value'?: string | number | boolean; + /** + * 在选项状态发生改变时触发，返回当前状态。通过修改外部的数据改变时不会触发 + */ + $emit(eventName: 'on-change', arg: string | number | boolean): this; +} + +export interface RadioGroup extends Vue { + /** + * 指定当前选中的项目数据。可以使用 v-model 双向绑定数据 + */ + value?: string | number; + /** + * 可选值为 button 或不填，为 button 时使用按钮样式 + */ + type?: string; + /** + * 尺寸，可选值为large、small、default或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 是否垂直排列，按钮样式下无效 + * @default false + */ + vertical?: boolean; + /** + * 在选项状态发生改变时触发，返回当前选中的项。通过修改外部的数据改变时不会触发 + */ + $emit(eventName: 'on-change', ...args: Array): this; +} diff --git a/types/iview/rate.d.ts b/types/iview/rate.d.ts new file mode 100644 index 00000000..09b36887 --- /dev/null +++ b/types/iview/rate.d.ts @@ -0,0 +1,54 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Rate extends Vue { + /** + * star总数 + * @default 5 + */ + count?: number; + /** + * 当前 star 数，可以使用 v-model 双向绑定数据 + * @default 0 + */ + value?: number; + /** + * 是否允许半选 + * @default false + */ + 'allow-half'?: boolean; + /** + * 是否只读，无法进行交互 + * @default false + */ + disabled?: boolean; + /** + * 是否显示提示文字 + * @default false + */ + 'show-text'?: boolean; + /** + * 是否可以取消选择 + * @default false + */ + clearable?: boolean; + /** + * 自定义字符 + */ + character?: string; + /** + * 使用图标 + */ + icon?: string; + /** + * 使用自定义图标 + */ + 'custom-icon'?: string; + /** + * 评分改变时触发 + */ + $emit(eventName: 'on-change', value: number): this; +} \ No newline at end of file diff --git a/types/iview/scroll.d.ts b/types/iview/scroll.d.ts new file mode 100644 index 00000000..dae6ccf4 --- /dev/null +++ b/types/iview/scroll.d.ts @@ -0,0 +1,35 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Scroll extends Vue { + /** + * 滚动区域的高度，单位像素 + * @default 300 + */ + height?: string | number; + /** + * 加载中的文案 + * @default 加载中 + */ + 'loading-text'?: string; + /** + * 滚动至顶部时触发，需返回Promise + */ + 'on-reach-top'?: () => void; + /** + * 滚动至底部时触发，需返回Promise + */ + 'on-reach-bottom'?: () => void; + /** + * 滚动至顶部或底部时触发，需返回Promise + */ + 'on-reach-edge'?: () => void; + /** + * 从边缘到触发回调的距离。如果是负的，回调将在到达边缘之前触发。值最好在 24 以下。 + * @default [20, 20] + */ + 'distance-to-edge'?: number | number[]; +} \ No newline at end of file diff --git a/types/iview/select.d.ts b/types/iview/select.d.ts new file mode 100644 index 00000000..fc555bda --- /dev/null +++ b/types/iview/select.d.ts @@ -0,0 +1,141 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Select extends Vue { + /** + * 指定选中项目的 value 值，可以使用 v-model 双向绑定数据。 + * 单选时只接受 String 或 Number，多选时只接受 Array + * @default 空 + */ + value?: string | number | string[] | number[]; + /** + * 是否支持多选 + * @default false + */ + multiple?: boolean; + /** + * 是否禁用 + * @default false + */ + disabled?: boolean; + /** + * 是否可以清空选项，只在单选时有效 + * @default false + */ + clearable?: boolean; + /** + * 是否支持搜索 + * @default false + */ + filterable?: boolean; + /** + * 是否使用远程搜索 + * @default false + */ + remote?: boolean; + /** + * 远程搜索的方法 + */ + 'remote-method'?: () => void; + /** + * 当前是否正在远程搜索 + * @default false + */ + loading?: boolean; + /** + * 远程搜索中的文字提示 + * @default 加载中 + */ + 'loading-text'?: string; + /** + * 仅在 remote 模式下，初始化时使用。因为仅通过 value 无法得知选项的 label，需手动设置。默认值空 + */ + label?: string | number | string[] | number[]; + /** + * 选择框大小，可选值为large、small、default或者不填 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 选择框默认文字 + * @default 请选择 + */ + placeholder?: string; + /** + * 当下拉列表为空时显示的内容 + * @default 无匹配数据 + */ + 'not-found-text'?: string; + /** + * 在返回选项时，是否将 label 和 value 一并返回，默认只返回 + * @default false + */ + 'label-in-value'?: boolean; + /** + * 弹窗的展开方向，可选值为 bottom 和 top + * @default bottom + */ + placement?: 'bottom' | 'top'; + /** + * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时， + * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果 + * @default false + */ + transfer?: boolean; + /** + * 给表单元素设置 id，详见 Form 用法。 + */ + 'element-id'?: string; + /** + * 选中的Option变化时触发，默认返回 value，如需返回 label，详见 label-in-value 属性 当前选中项 + */ + $emit(eventName: 'on-change'): this; + /** + * 搜索词改变时触发,query + */ + $emit(eventName: 'on-query-change', query: string): this; + /** + * 搜索词改变时触发,query + */ + $emit(eventName: 'on-clear'): this; + /** + * 搜索词改变时触发,query + */ + $emit(eventName: 'on-open-change', params: boolean): this; + /** + * 设置搜索词，为空时清空，仅在 filterable="true" 时有效 + */ + setQuery(query: string): void; + /** + * 清空单选项，仅在 clearable="true" 时有效 + */ + clearSingleSelect(): void; +} + +export interface SelectOption extends Vue { + /** + * 选项值，默认根据此属性值进行筛选，必填 + */ + value?: string | number; + /** + * 选项显示的内容，默认会读取 slot，无 slot 时，优先读取该 label 值， + * 无 label 时，读取 value。当选中时，选择器会显示 label 为已选文案。 + * 大部分情况不需要配置此项，直接写入 slot 即可，在自定义选项时，该属性非常有用。 + */ + label?: string; + /** + * 是否禁用当前项 + * @default false + */ + disabled?: boolean; +} + +export interface SelectOptionGroup extends Vue { + /** + * 分组的组名 + * @default 空 + */ + label?: string; +} \ No newline at end of file diff --git a/types/iview/slider.d.ts b/types/iview/slider.d.ts new file mode 100644 index 00000000..767069a5 --- /dev/null +++ b/types/iview/slider.d.ts @@ -0,0 +1,70 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Slider extends Vue { + /** + * 滑块选定的值，可以使用 v-model 双向绑定数据。普通模式下，数据格式为数字， + * 在双滑块模式下，数据格式为长度是2的数组，且每项都为数字, + * @default 0 + */ + value?: number | number[]; + /** + * 最小值 + * @default 0 + */ + min?: number; + /** + * 最大值 + * @default 100 + */ + max?: number; + /** + * 步长，取值建议能被（max - min）整除 + * @default 1 + */ + step?: number; + /** + * 是否禁用滑块 + * @default false + */ + disabled?: boolean; + /** + * 是否开启双滑块模式 + * @default false + */ + range?: boolean; + /** + * 是否显示数字输入框，仅在单滑块模式下有效 + * @default false + */ + 'show-input'?: boolean; + /** + * 是否显示间断点，建议在 step 不密集时使用 + * @default false + */ + 'show-stops'?: boolean; + /** + * 提示的显示控制，可选值为 hover（悬停，默认）、always（总是可见）、never（不可见） + * @default false + */ + 'show-tip'?: boolean; + /** + * 会把当前值传给 tip-format，并在 Tooltip 中显示 tip-format 的返回值，若为 null，则隐藏 Tooltip + */ + 'tip-format'?: (value?: number | number[]) => void; + /** + * 数字输入框的尺寸，可选值为large、small、default或者不填，仅在开启 show-input 时有效 + */ + 'input-size'?: '' | 'large' | 'small' | 'default'; + /** + * 在松开滑动时触发，返回当前的选值，在滑动过程中不会触发 + */ + $emit(eventName: 'on-change', value: number | number[]): this; + /** + * 滑动条数据变化时触发，返回当前的选值，在滑动过程中实时触发 + */ + $emit(eventName: 'on-input', value: number | number[]): this; +} \ No newline at end of file diff --git a/types/iview/spin.d.ts b/types/iview/spin.d.ts new file mode 100644 index 00000000..50a8ce41 --- /dev/null +++ b/types/iview/spin.d.ts @@ -0,0 +1,26 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Spin extends Vue { + /** + * Spin尺寸，可选值为large和small或者不设置 + */ + size?: 'large' | 'small'; + /** + * 是否固定，需要父级有relative或absolute + * @default false + */ + fix?: boolean; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义 Spin 的内容，设置slot后，默认的样式不生效 + */ + '': VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/split.d.ts b/types/iview/split.d.ts new file mode 100644 index 00000000..067456ce --- /dev/null +++ b/types/iview/split.d.ts @@ -0,0 +1,68 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Split extends Vue { + /** + * 面板位置，可以是 0~1 代表百分比，或具体数值的像素，可用 v-model 双向绑定 + * @default 0.5 + */ + value?: number | string; + /** + * 类型，可选值为 horizontal 或 vertical + * @default horizontal + */ + mode?: 'horizontal' | 'vertical'; + /** + * 最小阈值 + * @default 40px + */ + min?: number | string; + /** + * 最大阈值 + * @default 40px + */ + max?: number | string; + /** + * 拖拽开始 - + * @default false + */ + $emit(eventName: 'on-move-start', []): this; + /** + * 拖拽中 + */ + $emit(eventName: 'on-moving', []): this; + /** + * 拖拽结束 + * @default false + */ + $emit(eventName: 'on-move-end', []): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * mode 为 horizontal 时可用，左边面板 + * @default false + */ + left: VNode[]; + /** + * mode 为 horizontal 时可用，右边面板 + */ + right: VNode[]; + /** + * mode 为 vertical 时可用，上边面板 + */ + top: VNode[]; + /** + * mode 为 vertical 时可用，下边面板 + */ + bottom: VNode[]; + /** + * 自定义分割拖拽节点 + */ + trigger: VNode[]; + } +} \ No newline at end of file diff --git a/types/iview/steps.d.ts b/types/iview/steps.d.ts new file mode 100644 index 00000000..8e8ad5b7 --- /dev/null +++ b/types/iview/steps.d.ts @@ -0,0 +1,48 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Steps extends Vue { + /** + * 当前步骤，从 0 开始计数 + * @default 0 + */ + current?: number; + /** + * 当前步骤的状态，可选值为wait、process、finish、error + * @default process + */ + status?: 'wait' | 'process' | 'finish' | 'error'; + /** + * 步骤条的尺寸，可选值为small或者不写 + */ + size?: '' | 'small'; + /** + * 步骤条的方向，可选值为horizontal（水平）或vertical（垂直） + * @default horizontal + */ + direction?: 'horizontal' | 'vertical'; +} + +export interface Step extends Vue { + /** + * 步骤的状态，可选值为wait、process、finish、error，不设置时自动判断 + * @default process + */ + status?: 'wait' | 'process' | 'finish' | 'error'; + /** + * 标题 + * @default 空 + */ + title?: string; + /** + * 步骤的详细描述，可选 + */ + content?: string; + /** + * 步骤的图标，可选 + */ + icon?: string; +} \ No newline at end of file diff --git a/types/iview/switch.d.ts b/types/iview/switch.d.ts new file mode 100644 index 00000000..b64744f8 --- /dev/null +++ b/types/iview/switch.d.ts @@ -0,0 +1,54 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Switch extends Vue { + /** + * 指定当前是否选中，可以使用 v-model 双向绑定数据 + * @default false + */ + value?: boolean; + /** + * 开关的尺寸，可选值为large、small、default或者不写。建议开关如果使用了2个汉字的文字，使用 large。 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 禁用开关 + * @default false + */ + disabled?: boolean; + /** + * 选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用 + * @default true + */ + 'true-value'?: string | number | boolean; + /** + * 没有选中时的值，当使用类似 1 和 0 来判断是否选中时会很有用 + * @default false + */ + 'false-value'?: string | number | boolean; + /** + * 加载中的开关 + * @default false + */ + loading?: boolean; + /** + * 开关变化时触发，返回当前的状态 + */ + $emit(eventName: 'on-change', value: boolean): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义显示打开时的内容 + */ + open: VNode[]; + /** + * 自定义显示关闭时的内容 + */ + close: VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/table.d.ts b/types/iview/table.d.ts new file mode 100644 index 00000000..eb11b9c2 --- /dev/null +++ b/types/iview/table.d.ts @@ -0,0 +1,419 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Table extends Vue { + /** + * 显示的结构化数据，其中，字段 cellClassName 用于设置任意单元格的样式名称， + * 因此数据不能使用该字段，详见示例特定样式。 + * @default [] + */ + data?: object[]; + /** + * 表格列的配置描述，具体项见后文 + * @default [] + */ + columns?: object[]; + /** + * 是否显示间隔斑马纹 + * @default false + */ + stripe?: boolean; + /** + * 是否显示纵向边框 + * @default false + */ + border?: boolean; + /** + * 是否显示表头 + * @default true + */ + 'show-header'?: boolean; + /** + * 表格宽度，单位 px + * @default 自动 + */ + width?: number | string; + /** + * 表格高度，单位 px，设置后，如果表格内容大于此值，会固定表头 + */ + height?: number | string; + /** + * 表格是否加载中 + * @default false + */ + loading?: boolean; + /** + * 禁用鼠标悬停时的高亮 + * @default false + */ + 'disabled-hover'?: boolean; + /** + * 是否支持高亮选中的行，即单选 + * @default false + */ + 'highlight-row'?: boolean; + /** + * 行的 className 的回调方法，传入参数： + * row：当前行数据 + * index：当前行的索引 + */ + 'row-class-name'?: (row?: object, index?: number) => void; + /** + * 表格尺寸，可选值为 large、small、default 或者不填 + */ + size?: string; + /** + * 数据为空时显示的提示内容 + * @default 暂无数据 + */ + 'no-data-text'?: string; + /** + * 筛选数据为空时显示的提示内容 + * @default 暂无筛选结果 + */ + 'no-filtered-data-text'?: string; + /** + * 开启 highlight-row 后有效，当表格的当前行发生变化的时候会触发 + * currentRow：当前高亮行的数据 + * oldCurrentRow：上一次高亮的数据 + */ + $emit(eventName: 'on-current-change', currentRow: object, oldCurrentRow: object): this; + /** + * 在多选模式下有效，选中某一项时触发 + * selection：已选项数据 + * row：刚选择的项数据 + */ + $emit(eventName: 'on-select', selection: object[], row: object): this; + /** + * 在多选模式下有效，取消选中某一项时触发 + * selection：已选项数据 + * row：取消选择的项数据 + */ + $emit(eventName: 'on-select-cancel', selection: object[], row: object): this; + /** + * 在多选模式下有效，点击全选时触发 + * selection：已选项数据 + */ + $emit(eventName: 'on-select-all', selection: object[]): this; + /** + * 在多选模式下有效，只要选中项发生变化时就会触发 + * selection：已选项数据 + */ + $emit(eventName: 'on-selection-change', selection: object[]): this; + /** + * 排序时有效，当点击排序时触发 + * column：当前列数据 + * key：排序依据的指标 + * order：排序的顺序，值为 asc 或 desc + */ + $emit(eventName: 'on-sort-change', column?: object, key?: string, order?: 'asc' | 'desc'): this; + /** + * 筛选时有效，筛选条件发生变化时触发 当前列数据 + */ + $emit(eventName: 'on-filter-change', value: any): this; + /** + * 单击某一行时触发 + * currentRow：当前行的数据 + * index?: 当前行的索引 + */ + $emit(eventName: 'on-row-click', currentRow: object, index: number): this; + /** + * 双击某一行时触发 + * currentRow：当前行的数据 + * index?: 当前行的索引 + */ + $emit(eventName: 'on-row-dblclick', currentRow: object, index: number): this; + /** + * 展开或收起某一行时触发 + * row：当前行的数据 + * status：当前的状态 + */ + $emit(eventName: 'on-expand', row: object, status: string): this; + /** + * 导出数据 + */ + exportCsv(params: TableExportCsvParams): void; + /** + * 执行改变大小重绘table + */ + handleResize(): void; + /** + * 清除高亮项，仅在开启 highlight-row 时可用 + */ + clearCurrentRow(): void; + /** + * slot插槽对象 + */ + $slots: { + /** + * 表头 + */ + header: VNode[]; + /** + * 页脚 + */ + footer: VNode[]; + /** + * 加载中 + */ + loading: VNode[]; + }; +} + +export interface TableColumn { + /** + * 列类型，可选值为 index、selection、expand、html + */ + type?: 'index' | 'selection' | 'expand' | 'html'; + /** + * 列头显示文字 + * @default # + */ + title?: string; + /** + * 对应列内容的字段名 + */ + key?: string; + /** + * 列宽 + */ + width?: number; + /** + * 最小列宽 + */ + minWidth?: number; + /** + * 最大列宽 + */ + maxWidth?: number; + /** + * 对齐方式，可选值为 left 左对齐、right 右对齐和 center 居中对齐,默认 left + * @default left + */ + align?: 'left' | 'right' | 'center'; + /** + * 列的样式名称 + */ + className?: string; + /** + * 列是否固定在左侧或者右侧，可选值为 left 左侧和 right 右侧 + */ + fixed?: 'left' | 'right'; + /** + * 开启后，文本将不换行，超出部分显示为省略号 + * @default false + */ + ellipsis?: boolean; + /** + * 开启后，文本将不换行，超出部分显示为省略号，并用 Tooltip 组件显示完整内容 + * @default false + */ + tooltip?: boolean; + /** + * 自定义渲染列，使用 Vue 的 Render 函数。 + * 传入两个参数，第一个是 h，第二个为对象，包含 row、column 和 index， + * 分别指当前行数据，当前列数据，当前行索引，详见示例。 + * 学习 Render 函数的内容 从 rc.18 版本开始，我们将不再支持旧的用法。旧的 render 函数已被废弃。 + */ + render?: (h?: + ( + el?: string | object | Function, + data?: string | TableRenderCreateElementData | TableRenderCreateElementResult | Array, + vnode?: string | TableRenderCreateElementResult[] + ) => TableRenderCreateElementResult, + params?: TableColumnRenderParams + ) => TableRenderCreateElementResult; + /** + * 自定义列头显示内容，传入参数有两个，column 和 index，分别为当前列数据和当前列索引，不支持渲染自定义组件 + */ + renderHeader?: (h?: + ( + el?: string | object | Function, + data?: string | TableRenderCreateElementData | TableRenderCreateElementResult | Array, + vnode?: string | TableRenderCreateElementResult[] + ) => TableRenderCreateElementResult, + params?: TableColumnRenderHeadParams + ) => TableRenderCreateElementResult; + /** + * 对应列是否可以排序，如果设置为 custom，则代表用户希望远程排序， + * 需要监听 Table 的 on- sort - change 事件,默认false + * @default false + */ + sortable?: boolean; + /** + * 自定义排序使用的方法，接收三个参数 a 、 b 和 type， + * 当设置 sortable?: true 时有效。type 值为 asc 和 desc + */ + sortMethod?: (a: any, b: any, type: 'asc' | 'desc') => void; + /** + * 设置初始化排序。值为 asc 和 desc + */ + sortType?: 'asc' | 'desc'; + /** + * 过滤数据的选项，格式为数组，数组中每项包含 label 和 value 属性，使用过滤，必须同时配置filterMethod + */ + filters?: { label: string, value: string | number | boolean }[]; + /** + * 数据过滤使用的方法，如果是多选的筛选项，对每一条数据会执行多次，任意一次返回 true 就会显示 + */ + filterMethod?: () => void; + /** + * 数据过滤的选项是否多选 + * @default true + */ + filterMultiple?: boolean; + /** + * 在初始化时使用过滤，数组，值为需要过滤的 value 集合 + */ + filteredValue?: (string | number | boolean)[]; + /** + * 使用远程过滤 + */ + filterRemote?: () => void; + /** + * 表头分组 + */ + children?: object[]; +} + +export interface TableRenderCreateElementData { + /** + * 和`v-bind:class`一样的 API + */ + 'class'?: object; + /** + * 和`v-bind:style`一样的 API + */ + style?: object; + /** + * 正常的 HTML 特性 + */ + attrs?: object, + /** + * 组件 props + */ + props?: object; + /** + * DOM 属性 + */ + domProps?: object; + /** + * 事件监听器基于 "on" + * 所以不再支持如 v-on?:keyup.enter 修饰器 + * 需要手动匹配 keyCode。 + */ + on?: object; + /** + * 仅对于组件，用于监听原生事件，而不是组件使用 vm.$emit 触发的事件。 + */ + nativeOn?: object; + /** + * 自定义指令. 注意事项：不能对绑定的旧值设值 + * Vue 会为您持续追踨 + */ + directives?: object[]; + /** + * 如果子组件有定义 slot 的名称 + */ + slot?: string; + /** + * 其他特殊顶层属性,myKey + */ + key?: string; + /** + * myRef + */ + ref?: string +} + +export interface TableColumnRenderParams { + /** + * 当前行数据 + */ + row?: object; + /** + * 当前列数据 + */ + column?: object; + /** + * 当前行索引 + */ + index?: number; +} + +export interface TableRenderCreateElementResult { + child?: object; + children?: Array; + componentInstance?: object; + componentOptions?: object; + context?: object; + data?: object; + elm?: object; + functionalContext?: object; + isCloned?: boolean; + isComment?: boolean; + isOnce?: boolean; + isRootInsert?: boolean; + isStatic?: boolean; + key?: object; + ns?: object; + parent?: object; + raw?: boolean; + tag?: string; + text?: object; +} + +export interface TableColumnRenderHeadParams { + /** + * 当前列数据 + */ + column?: object; + /** + * 当前行索引 + */ + index?: number; +} + +export interface TableExportCsvParams { + /** + * 文件名，默认为 table.csv + */ + filename?: string; + /** + * 是否导出为原始数据，默认为 true + */ + original?: boolean; + /** + * 不显示表头，默认为 false + */ + noHeader?: boolean; + /** + * 自定义导出的列数据 + */ + columns?: any[]; + /** + * 自定义导出的行数据 + */ + data?: any[]; + /** + * 添加此函数后，不会下载，而是返回数据 + */ + callback?: () => void; + /** + * 数据分隔符，默认是逗号(,) + * @default , + */ + separator?: string; + /** + * 每项数据是否加引号 + * @default false + */ + quoted?: boolean; +} + + + + diff --git a/types/iview/tabs.d.ts b/types/iview/tabs.d.ts new file mode 100644 index 00000000..2bd112fc --- /dev/null +++ b/types/iview/tabs.d.ts @@ -0,0 +1,81 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Tabs extends Vue { + /** + * 当前激活 tab 面板的 name，可以使用 v-model 双向绑定数据 + * @default 默认为第一项的 name + */ + value?: string; + /** + * 页签的基本样式，可选值为 line 和 card + * @default line + */ + type?: 'line' | 'card'; + /** + * 尺寸，可选值为 default 和 small，仅在 type="line" 时有效 + * @default default + */ + size?: 'default' | 'small'; + /** + * 是否可以关闭页签，仅在 type="card" 时有效 + * @default false + */ + closable?: boolean; + /** + * 是否使用 CSS3 动画 + * @default true + */ + animated?: boolean; + /** + * Tabs 内的表单类组件是否自动获得焦点 + * @default false + */ + 'capture-focus'?: boolean; + /** + * tab 被点击时触发 + */ + $emit(eventName: 'on-click', name: string): this; + /** + * tab 被关闭时触发 + */ + $emit(eventName: 'on-tab-remove', name: string): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 附加内容 + */ + extra: VNode[]; + }; +} + +export interface TabPane extends Vue { + /** + * 用于标识当前面板，对应 value，默认为其索引值 + */ + name?: string | number; + /** + * 选项卡头显示文字，支持 Render 函数。 + * @default 空 + */ + label?: string | (() => void); + /** + * 选项卡图标 + */ + icon?: string; + /** + * 是否禁用该选项卡 + * @default false + */ + disabled?: boolean; + /** + * 是否可以关闭页签，仅在 type="card" 时有效 + * @default null + */ + closable?: boolean; +} \ No newline at end of file diff --git a/types/iview/tag.d.ts b/types/iview/tag.d.ts new file mode 100644 index 00000000..dbf9160c --- /dev/null +++ b/types/iview/tag.d.ts @@ -0,0 +1,48 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Tag extends Vue { + /** + * 标签是否可以关闭 + * @default false + */ + closable?: boolean + /** + * 标签是否可以选择 + * @default false + */ + checkable?: boolean; + /** + * 标签的选中状态 + * @default true + */ + checked?: boolean; + /** + * 标签的样式类型，可选值为border、dot或不填 + */ + type?: '' | 'border' | 'dot'; + /** + * 标签颜色，预设颜色值为 + * default、primary、success、warning、error、blue、green、 + * red、yellow、pink、magenta、volcano、orange、gold、 + * lime、cyan、geekblue、purple + * 你也可以自定义颜色值。 + */ + color?: 'default' | 'primary' | 'success' | 'warning' | 'error' | 'blue' | 'green' | 'red' | 'yellow' | 'pink' | 'magenta' | 'volcano' | 'orange' | 'gold' | 'lime' | 'cyan' | 'geekblue' | 'purple'; + /** + * 当前标签的名称，使用 v-for，并支持关闭时，会比较有用 + */ + name?: string | number; + /** + * 是否在出现和消失时使用渐变的动画，动画时长可能会引起占位的闪烁 + * @default true + */ + fade?: boolean; + /** + * 关闭时触发 + */ + $emit(eventName: 'on-close', event: object, name: string): this; +} \ No newline at end of file diff --git a/types/iview/time-picker.d.ts b/types/iview/time-picker.d.ts new file mode 100644 index 00000000..943053c3 --- /dev/null +++ b/types/iview/time-picker.d.ts @@ -0,0 +1,169 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface TimePicker extends Vue { + /** + * 显示类型，可选值为 time、timerange + * @default time + */ + type?: 'time' | 'timerange'; + /** + * 时间，可以是 JavaScript 的 Date，例如 new Date()，也可以是标准的时间格式，点击右边查看 + * 注意：value 使用 v-model 时，值是 Date 类型，可以配合 @on-change 使用 + * 名称 说明 示例 + * yyyy 年份（四位） 2016 + * yy 年份（两位） 16 + * MM 月份（两位） 01 + * M 月份（一位） 1 + * MMMM 月份（英文） January + * MMM 月份（英文简写） Jan + * dd 日期（两位） 01 + * d 日期（一位） 1 + * Do 日期（简写） 1st + * DD 星期（两位） 00 + * D 星期（一位） 0 + * dddd 星期（英文） Monday + * ddd 星期（英文简写） Mon + * HH 小时（24小时制两位） 01 + * H 小时（24小时制一位） 1 + * hh 小时（12小时制两位） 01 + * h 小时（12小时制一位） 1 + * mm 分钟（两位） 01 + * m 分钟（一位） 1 + * ss 秒钟（两位） 01 + * s 秒钟（一位） 1 + * SSS 毫秒（三位） 019 + * SS 毫秒（两位） 01 + * S 毫秒（一位） 1 + * A 上午与下午（大写） AM/PM + * a 上午与下午（小写） am/pm + * ZZ 时区 +0800 + */ + value?: Date; + /** + * 展示的时间格式 + * @default HH:mm:ss + * 名称 说明 示例 + * yyyy 年份（四位） 2016 + * yy 年份（两位） 16 + * MM 月份（两位） 01 + * M 月份（一位） 1 + * MMMM 月份（英文） January + * MMM 月份（英文简写） Jan + * dd 日期（两位） 01 + * d 日期（一位） 1 + * Do 日期（简写） 1st + * DD 星期（两位） 00 + * D 星期（一位） 0 + * dddd 星期（英文） Monday + * ddd 星期（英文简写） Mon + * HH 小时（24小时制两位） 01 + * H 小时（24小时制一位） 1 + * hh 小时（12小时制两位） 01 + * h 小时（12小时制一位） 1 + * mm 分钟（两位） 01 + * m 分钟（一位） 1 + * ss 秒钟（两位） 01 + * s 秒钟（一位） 1 + * SSS 毫秒（三位） 019 + * SS 毫秒（两位） 01 + * S 毫秒（一位） 1 + * A 上午与下午（大写） AM/PM + * a 上午与下午（小写） am/pm + * ZZ 时区 +0800 + */ + format?: string; + /** + * 下拉列表的时间间隔，数组的三项分别对应小时、分钟、秒。 + * 例如设置为 [1, 15] 时，分钟会显示：00、15、30、45。 + * @default [] + */ + steps?: any[]; + /** + * 时间选择器出现的位置，可选值为 + * top,top-start,top-end + * bottom,bottom-start,bottom-end + * left,left-start,left-end + * right,right-start,right-end + * @default bottom-start + */ + placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'; + /** + * 占位文本 + * @default 空 + */ + placeholder?: string; + /** + * 是否显示底部控制栏 + * @default false + */ + confirm?: boolean; + /** + * 手动控制时间选择器的显示状态，true 为显示，false 为收起。 + * 使用该属性后，选择器不会主动关闭。建议配合 slot 及 confirm 和相关事件一起使用, + * @default null + */ + open?: boolean; + /** + * 尺寸，可选值为large、small、default或者不设置 + */ + size?: '' | 'large' | 'small' | 'default'; + /** + * 是否禁用选择器 + * @default false + */ + disabled?: boolean; + /** + * 是否显示清除按钮 + * @default true + */ + clearable?: boolean; + /** + * 完全只读，开启后不会弹出选择器，只在没有设置 open 属性下生效 + * @default false + */ + readonly?: boolean; + /** + * 文本框是否可以输入，只在没有使用 slot 时有效 + * @default true + */ + editable?: boolean; + /** + * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时， + 建议添加此属性，它将不受父级样式影响，从而达到更好的效果 + * @default false + */ + transfer?: boolean; + /** + * 给表单元素设置 id，详见 Form 用法。 + */ + 'element-id'?: boolean; + /** + * 时间发生变化时触发 已经格式化后的时间，比如 09:41:00 + */ + $emit(eventName: 'on-change', value: string): this; + /** + * 弹出浮层和关闭浮层时触发 + */ + $emit(eventName: 'on-open-change', value: boolean): this; + /** + * 点击确定按钮时触发 + */ + $emit(eventName: 'on-ok'): this; + /** + * 在清空日期时触发 + */ + $emit(eventName: 'on-clear'): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义选择器的显示内容，建议与 open 等参数一起使用，详见示例 + */ + '': VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/time.ts b/types/iview/time.ts new file mode 100644 index 00000000..7de152ed --- /dev/null +++ b/types/iview/time.ts @@ -0,0 +1,27 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Time extends Vue { + /** + * 需要对比的时间，可以是时间戳或 Date 类型 + */ + time?: number |Date |string; + /** + * 类型，可选值为 relative、date 或 datetime + * @default relative + */ + type?: 'relative'|'date'|'datetime'; + /** + * 自动更新的间隔，单位：秒 + * @default 60 + */ + interval?: number; + /** + * 填写该值，点击会定位锚点 + * @default false + */ + hash?: string; +} \ No newline at end of file diff --git a/types/iview/timeline.d.ts b/types/iview/timeline.d.ts new file mode 100644 index 00000000..fa6ce3f6 --- /dev/null +++ b/types/iview/timeline.d.ts @@ -0,0 +1,34 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Timeline extends Vue { + /** + * 指定是否最后一个节点为幽灵节点 + * @default false + */ + pending?: boolean; +} + +export interface TimelineItem extends Vue { + /** + * 圆圈颜色，可选值为blue、red、green，或自定义色值 + * @default blue + */ + color?: 'blue' | 'red' | 'green' | string; + /** + * slot插槽对象 + */ + $slots: { + /** + * 基本内容 + */ + '': VNode[]; + /** + * 自定义时间轴点内容 + */ + dot: VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/tooltip.d.ts b/types/iview/tooltip.d.ts new file mode 100644 index 00000000..3dff6994 --- /dev/null +++ b/types/iview/tooltip.d.ts @@ -0,0 +1,91 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Tooltip extends Vue { + /** + * 显示的内容 + * @default 空 + */ + content?: string | number; + /** + * 提示框出现的位置，可选值为 + * top，top-start，top-end，bottom，bottom-start，bottom-end， + * left，left-start，left-end，right，right-start，right-end + * 2.12.0 版本开始支持自动识别 + * @default bottom + */ + placement?: 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end'; + /** + * 是否禁用提示框 + * @default false + */ + disabled?: boolean; + /** + * 延迟显示，单位毫秒 + * @default 0 + */ + delay?: number; + /** + * 是否总是可见 + * @default false + */ + always?: boolean; + /** + * 主题，可选值为 dark 或 light + * @default dark + */ + theme?: string; + /** + * 最大宽度，超出最大值后，文本将自动换行，并两端对齐 + */ + 'max-width'?: string|number; + /** + * 出现位置的偏移量 + * @default 0 + */ + offset?: number; + /** + * 是否将弹层放置于 body 内，在 Tabs、带有 fixed 的 Table 列内使用时， + * 建议添加此属性，它将不受父级样式影响，从而达到更好的效果 + * @default false + */ + transfer?: boolean; + /** + * 出现位置的偏移量 + * @default { + modifiers: { + computeStyle:{ + gpuAcceleration: false, + }, + preventOverflow :{ + boundariesElement: 'window' + } + } + } + */ + options?: object; + /** + * 在提示框显示时触发 + */ + $emit(eventName: 'on-popper-show'): this; + /** + * 在提示框消失时触发 + */ + $emit(eventName: 'on-popper-hide'): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 主体内容 + */ + '': VNode[]; + /** + * 提示框的内容，定义此 slot 时，会覆盖 props content。 + */ + content: VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/transfer.d.ts b/types/iview/transfer.d.ts new file mode 100644 index 00000000..9ec98b96 --- /dev/null +++ b/types/iview/transfer.d.ts @@ -0,0 +1,80 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Transfer extends Vue { + /** + * 数据源，其中的数据将会被渲染到左边一栏中，targetKeys 中指定的除外。 + * @default [] + */ + data?: object[]; + /** + * 显示在右侧框数据的key集合 + * @default [] + */ + targetKeys?: string[]; + /** + * 每行数据渲染函数，该函数的入参为 data 中的项 + * value?: 默认显示label，没有时显示key + */ + 'render-format'?: (value?: string) => void; + /** + * 设置哪些项应该被选中 + * @default [] + */ + 'selected-keys'?: string[]; + /** + * 两个穿梭框的自定义样式 + * @default {} + */ + 'list-style'?: object; + /** + * 标题集合，顺序从左至右 Array + * @default ['源列表', '目的列表'] + */ + titles?: string[]; + /** + * 操作文案集合，顺序从上至下 + * @default [] + */ + operations?: object[]; + /** + * 是否显示搜索框 + * @default false + */ + filterable?: object[]; + /** + * 搜索框的占位 + * @default 请输入搜索内容 + */ + 'filter-placeholder'?: string; + /** + * 自定义搜索函数，入参为 data 和 query，data 为项，query 为当前输入的搜索词 + * 默认搜索label + */ + 'filter-method'?: (value?: string) => void; + /** + * 当列表为空时显示的内容 + * @default 列表为空 + */ + 'not-found-text'?: string; + /** + * 选项在两栏之间转移时的回调函数 + */ + $emit(eventName: 'on-change', targetKeys: string[], direction: string, moveKeys: string[]): this; + /** + * 选项在两栏之间转移时的回调函数 + */ + $emit(eventName: 'on-selected-change', sourceSelectedKeys: string[], targetSelectedKeys: string[]): this; + /** + * slot插槽对象 + */ + $slots: { + /** + * 自定义底部内容 + */ + '': VNode[]; + }; +} \ No newline at end of file diff --git a/types/iview/tree.d.ts b/types/iview/tree.d.ts new file mode 100644 index 00000000..c8640a1d --- /dev/null +++ b/types/iview/tree.d.ts @@ -0,0 +1,103 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Tree extends Vue { + /** + * 可嵌套的节点属性的数组，生成 tree 的数据 + */ + data?: TreeChild[]; + /** + * 是否支持多选 + * @default false + */ + multiple?: boolean; + /** + * 是否显示多选框 + * @default false + */ + 'show-checkbox'?: boolean; + /** + * 没有数据时的提示 + * @default 暂无数据 + */ + 'empty-text'?: string; + /** + * 异步加载数据的方法 + */ + 'load-data'?: () => void; + /** + * 自定义渲染内容 + */ + render?: () => void; + /** + * 定义子节点键 + * @default children + */ + 'children-key'?:string; + /** + * 点击树节点时触发 + * @default 当前已选中的节点数组 + */ + $emit(eventName: 'on-select-change', value: TreeChild[]): this; + /** + * 点击复选框时触发 + * @default 当前已勾选节点的数组 + */ + $emit(eventName: 'on-check-change', value: TreeChild[]): this; + /** + * 展开和收起子列表时触发 + * @default 当前节点的数据 + */ + $emit(eventName: 'on-toggle-expand', value: TreeChild): this; + /** + * 获取被勾选的节点 + */ + getCheckedNodes(): void; + /** + * 获取被选中的节点 + */ + getSelectedNodes(): void; +} + +export interface TreeChild extends Vue { + /** + * 标题 + */ + title?: string; + /** + * 是否展开直子节点 + * @default false + */ + expand?: boolean; + /** + * 禁掉响应 + * @default false + */ + disabled?: boolean; + /** + * 禁掉checkbox + * @default false + */ + disableCheckbox?: boolean; + /** + * 是否选中子节点 + * @default false + */ + selected?: boolean; + /** + * 是否勾选(如果勾选，子节点也会全部勾选) + * @default false + */ + checked?: boolean; + /** + * 子节点属性数组 + */ + children?: TreeChild[]; + /** + * 自定义当前节点渲染内容，见示例 + */ + render(): void; +} \ No newline at end of file diff --git a/types/iview/upload.d.ts b/types/iview/upload.d.ts new file mode 100644 index 00000000..94305167 --- /dev/null +++ b/types/iview/upload.d.ts @@ -0,0 +1,130 @@ +// Type definitions for iview 3.0.0 +// Project: https://github.com/iview/iview +// Definitions by: yangdan +// Definitions: https://github.com/yangdan8/iview.git +import Vue, { VNode } from "vue"; + +export interface Upload extends Vue { + /** + * 上传的地址，必填 + */ + action?: string; + /** + * 设置上传的请求头部 + * @default {} + */ + headers?: object; + /** + * 是否支持多选文件 + * @default false + */ + multiple?: boolean; + /** + * 是否支持粘贴上传文件 + * @default false + */ + paste?: boolean; + /** + * 上传时附带的额外参数 + */ + data?: object; + /** + * 上传的文件字段名 + * @default file + */ + name?: string; + /** + * 支持发送 cookie 凭证信息 + * @default false + */ + 'with-credentials'?: boolean; + /** + * 是否显示已上传文件列表 + * @default true + */ + 'show-upload-list'?: boolean; + /** + * 上传控件的类型，可选值为 select（点击选择），drag（支持拖拽） + * @default select + */ + type?: 'select' | 'drag'; + /** + * 接受上传的文件类型 + */ + accept?: string; + /** + * 支持的文件类型，与 accept 不同的是， + * format 是识别文件的后缀名， + * accept 为 input 标签原生的 accept 属性， + * 会在选择文件时过滤，可以两者结合使用， + * @default [] + */ + format?: string[]; + /** + * 文件大小限制，单位 kb + */ + 'max-size'?: number; + /** + * 上传文件之前的钩子，参数为上传的文件，若返回 false 或者 Promise 则停止上传 + */ + 'before-upload'?: Function; + /** + * 文件上传时的钩子，返回字段为 event, file, fileList + */ + 'on-progress'?: Function; + /** + * 文件上传成功时的钩子，返回字段为 response, file, fileList + */ + 'on-success'?: Function; + /** + * 文件上传失败时的钩子，返回字段为 error, file, fileList + */ + 'on-error'?: Function; + /** + * 点击已上传的文件链接时的钩子，返回字段为 file， 可以通过 file.response 拿到服务端返回数据 + */ + 'on-preview'?: Function; + /** + * 文件列表移除文件时的钩子，返回字段为 file, fileList + */ + 'on-remove'?: Function; + /** + * 文件格式验证失败时的钩子，返回字段为 file, fileList + */ + 'on-format-error'?: Function; + /** + * 文件超出指定大小限制时的钩子，返回字段为 file, fileList + */ + 'on-exceeded-size'?: Function; + /** + * 默认已上传的文件列表，例如： + * [ + * { + * name?: 'img1.jpg', + * url?: 'http://www.xxx.com/img1.jpg' + * }, + * { + * name?: 'img2.jpg', + * url?: 'http://www.xxx.com/img2.jpg' + * } + * ] + */ + 'default-file-list'?: string[]; + /** + * 清空已上传的文件列表 + */ + 'clearFiles'(): void; + /** + * slot插槽对象 + */ + $slots: { + /** + * 触发上传组件的控件 + */ + '': VNode[]; + /** + * 辅助提示内容 + */ + tip: VNode[]; + }; +} \ No newline at end of file