diff --git a/.eslintrc.js b/.eslintrc.js index b4b4e069ab..3817900773 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -15,11 +15,7 @@ module.exports = { 'no-console': 'off', 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off', '@typescript-eslint/no-unused-vars': process.env.NODE_ENV === 'production' ? 'error' : 'warn', - '@typescript-eslint/explicit-module-boundary-types': 'off', '@typescript-eslint/no-explicit-any': 'off', - '@typescript-eslint/no-empty-interface': 'off', - 'vue/multi-word-component-names': 'off', - 'vue/multi-word-component': 'off', - 'multiline-ternary': 'off' + 'vue/multi-word-component-names': 'off' } } diff --git a/.gitignore b/.gitignore index de131671cf..ebd297a791 100644 --- a/.gitignore +++ b/.gitignore @@ -1,15 +1,12 @@ .DS_Store .history node_modules +/lib_temp +/packages_temp /dist /es /lib /docs -/public/v1 -/public/v2 -/public/v3 -/public/v3.5 -/public/v4 package-lock.json yarn.lock diff --git a/README.en.md b/README.en.md index 0259ccbabb..2b7ab34c5f 100644 --- a/README.en.md +++ b/README.en.md @@ -12,7 +12,7 @@ [![pull requests closed](https://img.shields.io/github/issues-pr-closed/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/pulls?q=is%3Apr+is%3Aclosed) [![npm license](https://img.shields.io/github/license/mashape/apistatus.svg)](LICENSE) -A [vue](https://www.npmjs.com/package/vue) based PC form component, support add delete change check, virtual tree, column drag and drop, lazy loading, shortcut menu, data verification, print export, form rendering, custom template, renderer, JSON configuration... +A [vue](https://www.npmjs.com/package/vue) based PC form component, support add delete change check, virtual tree, column drag and drop, lazy loading, shortcut menu, data verification, import/export/print, form rendering, custom template, renderer, JSON configuration... * Design concept * Efficient and concise API design for modern browsers. @@ -22,8 +22,10 @@ A [vue](https://www.npmjs.com/package/vue) based PC form component, support add * Plan * [x] ~~v1.0 Based on vue2.6, Support for all major browsers.~~ * [x] ~~v2.0 Based on vue2.6, Support for all major browsers.~~ - * [x] v3.0 Based on vue2.6, supports modern browsers and retains compatibility with IE11. - * [x] v4.0 Based on vue3.x, Only support modern browser, not IE. + * [x] v3.0 Based on vue2.6+, supports modern browsers and retains compatibility with IE11. + * [ ] v3.9 Based on vue2.6+, Reconstruct and split the components into [Vxe table](https://github.com/x-extends/vxe-table) and [Vxe UI](https://github.com/x-extends/vxe-pc-ui). Form Designer, list designer, process designer will be supported. + * [x] v4.0 Based on vue3.2+, Only support modern browser, not IE. + * [x] v4.7 Based on vue3.2+, Reconstruct and split the components into [Vxe table](https://github.com/x-extends/vxe-table) and [Vxe UI](https://github.com/x-extends/vxe-pc-ui). Form Designer, list designer, process designer will be supported. ## Browser Support @@ -90,10 +92,10 @@ Get on [unpkg](https://unpkg.com/vxe-table/) and [cdnjs](https://cdn.jsdelivr.ne ```javascript import { createApp } from 'vue' -import VXETable from 'vxe-table' +import VxeUITable from 'vxe-table' import 'vxe-table/lib/style.css' -createApp(App).use(VXETable).mount('#app') +createApp(App).use(VxeUITable).mount('#app') ``` ### CDN diff --git a/README.md b/README.md index 58b16c67db..cff03e81f2 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,7 @@ vxe-table-cz仓库：https://github.com/WHIPLASHCZ/vxe-table-fix-checkbox [![pull requests closed](https://img.shields.io/github/issues-pr-closed/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/pulls?q=is%3Apr+is%3Aclosed) [![npm license](https://img.shields.io/github/license/mashape/apistatus.svg)](LICENSE) -一个基于 [vue](https://www.npmjs.com/package/vue) 的 PC 端表单/表格组件，支持增删改查、虚拟树、列拖拽、懒加载、快捷菜单、数据校验、打印导出、表单渲染、自定义模板、渲染器、JSON 配置式... +一个基于 [vue](https://www.npmjs.com/package/vue) 的 PC 端表单/表格组件，支持增删改查、虚拟树、列拖拽、懒加载、快捷菜单、数据校验、导入/导出/打印、表单渲染、自定义模板、渲染器、JSON 配置式... * 设计理念 * 面向现代浏览器，高效的简洁 API 设计 @@ -26,8 +26,10 @@ vxe-table-cz仓库：https://github.com/WHIPLASHCZ/vxe-table-fix-checkbox * 计划 * [x] ~~v1.0 基于 vue2.6，支持所有主流的浏览器，实现表格的一切实用的功能~~ * [x] ~~v2.0 基于 vue2.6，支持所有主流的浏览器，同时兼具功能与性能~~ - * [x] v3.0 基于 vue2.6，支持现代浏览器并保留兼容 IE11 - * [x] v4.0 基于 vue3.x，只支持现代浏览器，不支持 IE + * [x] v3.0 基于 vue2.6+，支持现代浏览器并保留兼容 IE11 + * [ ] v3.9 基于 vue2.6+，重构拆分组件，分为 [Vxe table](https://github.com/x-extends/vxe-table) 和 [Vxe UI](https://github.com/x-extends/vxe-pc-ui)，将支持表单设计器、列表你设计器、流程设计器 + * [x] v4.0 基于 vue3.2+，只支持现代浏览器，不支持 IE + * [x] v4.7 基于 vue3.2+，重构拆分组件，分为 [Vxe table](https://github.com/x-extends/vxe-table) 和 [Vxe UI](https://github.com/x-extends/vxe-pc-ui)，将支持表单设计器、列表你设计器、流程设计器 * [ ] 下一阶段：sticky 渲染模式、将虚拟滚动提升到极致、虚拟滚动动态行高、数据图表可视化 ## 浏览器支持 @@ -101,10 +103,10 @@ Get on [unpkg](https://unpkg.com/vxe-table/) and [cdnjs](https://cdn.jsdelivr.ne ```javascript import { createApp } from 'vue' -import VXETable from 'vxe-table' +import VxeUITable from 'vxe-table' import 'vxe-table/lib/style.css' -createApp(App).use(VXETable).mount('#app') +createApp(App).use(VxeUITable).mount('#app') ``` ### CDN diff --git a/README.zh-TW.md b/README.zh-TW.md index 39468bc8df..5a4c6a103a 100644 --- a/README.zh-TW.md +++ b/README.zh-TW.md @@ -12,7 +12,7 @@ [![pull requests closed](https://img.shields.io/github/issues-pr-closed/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/pulls?q=is%3Apr+is%3Aclosed) [![npm license](https://img.shields.io/github/license/mashape/apistatus.svg)](LICENSE) -一個基於 [vue](https://www.npmjs.com/package/vue) 的PC端表格組件，支持增刪改查、虛擬樹、列拖拽、懶加載、快捷菜單、數據校驗、打印導出、表單渲染、自定義模板、渲染器、JSON 配置式… +一個基於 [vue](https://www.npmjs.com/package/vue) 的PC端表格組件，支持增刪改查、虛擬樹、列拖拽、懶加載、快捷菜單、數據校驗、導入/匯出/列印、表單渲染、自定義模板、渲染器、JSON 配置式… * 設計理念 * 面向現代瀏覽器，高效的簡潔 API 設計 @@ -22,8 +22,10 @@ * 計劃 * [x] ~~v1.0 基於 vue2.6，支持所有主流的瀏覽器，實現表格的一切實用的功能~~ * [x] ~~v2.0 基於 vue2.6，支持所有主流的瀏覽器，同時兼具功能與效能~~ - * [x] v3.0 基於 vue2.6，支持現代瀏覽器並保留相容IE11 + * [x] v3.0 基於 vue2.6+，支持現代瀏覽器並保留相容IE11 + * [ ] v3.9 基於 vue2.6+，重構拆分組件，分爲 [Vxe table](https://github.com/x-extends/vxe-table) 和 [Vxe UI](https://github.com/x-extends/vxe-pc-ui)，將支持表單設計器、列表你設計器、流程設計器 * [x] v4.0 基于 vue3.x，只支持現代瀏覽器，不支持IE + * [x] v4.7 基於 vue3.x，重構拆分組件，分爲 [Vxe table](https://github.com/x-extends/vxe-table) 和 [Vxe UI](https://github.com/x-extends/vxe-pc-ui)，將支持表單設計器、列表你設計器、流程設計器 ## 瀏覽器支持 @@ -89,10 +91,10 @@ Get on [unpkg](https://unpkg.com/vxe-table/) and [cdnjs](https://cdn.jsdelivr.ne ```javascript import { createApp } from 'vue' -import VXETable from 'vxe-table' +import VxeUITable from 'vxe-table' import 'vxe-table/lib/style.css' -createApp(App).use(VXETable).mount('#app') +createApp(App).use(VxeUITable).mount('#app') ``` ### CDN diff --git a/examples/App.vue b/examples/App.vue index 21c116d1c5..68b64cf904 100644 --- a/examples/App.vue +++ b/examples/App.vue @@ -1,2109 +1,57 @@ - - searchEvent, - clickEvent, - linkEvent, - vChangeEvent - } + diff --git a/examples/api/button.ts b/examples/api/button.ts deleted file mode 100644 index ab08120707..0000000000 --- a/examples/api/button.ts +++ /dev/null @@ -1,224 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'content', - descKey: 'app.api.button.desc.content', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - descKey: 'app.api.button.desc.type', - version: '', - type: 'string', - enum: 'text,submit,reset,button', - defVal: 'button', - list: [] - }, - { - name: 'size', - descKey: 'app.api.button.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'name', - descKey: 'app.api.button.desc.name', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'icon', - descKey: 'app.api.button.desc.icon', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'round', - desc: '圆角边框', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'circle', - desc: '圆角按钮', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'status', - descKey: 'app.api.button.desc.status', - version: '', - type: 'string', - enum: 'perfect, primary, success, info, warning, danger', - defVal: '', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.button.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'className', - desc: '附加 className', - version: '4.0.7', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'loading', - descKey: 'app.api.button.desc.loading', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'placement', - descKey: 'app.api.button.desc.placement', - version: '', - type: 'string', - enum: 'top, bottom', - defVal: 'bottom', - list: [] - }, - { - name: 'destroy-on-close', - desc: '在下拉容器关闭时销毁内容', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'transfer', - descKey: 'app.api.button.desc.transfer', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.button.transfer', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'default', - desc: '按钮内容', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'dropdowns', - desc: '下拉按钮', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'click', - desc: '在单击按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ $event }', - list: [] - }, - { - name: 'dropdown-click', - desc: '下拉列表按钮点击时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ name, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'focus()', - desc: '使按钮获取焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'blur()', - desc: '使按钮失去焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/checkbox-group.ts b/examples/api/checkbox-group.ts deleted file mode 100644 index 9edfa5e061..0000000000 --- a/examples/api/checkbox-group.ts +++ /dev/null @@ -1,68 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.checkbox.desc.value', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'size', - descKey: 'app.api.checkbox.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'disabled', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/checkbox.ts b/examples/api/checkbox.ts deleted file mode 100644 index eeeca1ca78..0000000000 --- a/examples/api/checkbox.ts +++ /dev/null @@ -1,132 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.checkbox.desc.value', - version: '', - type: 'string | number | boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'label', - descKey: 'app.api.checkbox.desc.label', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'content', - desc: '内容（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'size', - descKey: 'app.api.checkbox.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.checkbox.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'title', - descKey: 'app.api.checkbox.desc.title', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'indeterminate', - descKey: 'app.api.checkbox.desc.indeterminate', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'checked-value', - desc: '选中时的值', - version: '4.0.21', - type: 'string | number | boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'unchecked-value', - desc: '未选中时的值', - version: '4.0.21', - type: 'string | number | boolean', - enum: '', - defVal: 'false', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'change', - desc: '在值发生改变时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ checked, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/colgroup.ts b/examples/api/colgroup.ts deleted file mode 100644 index a2da31e887..0000000000 --- a/examples/api/colgroup.ts +++ /dev/null @@ -1,68 +0,0 @@ -import XEUtils from 'xe-utils' -import columnAPI from './column' - -const columnProps: any = columnAPI.find(item => item.name === 'Props') - -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: XEUtils.clone(columnProps, true).list.filter((item: any) => [ - 'field', - 'title', - 'width', - 'min-width', - 'resizable', - 'visible', - 'fixed', - 'align', - 'header-align', - 'show-overflow', - 'show-header-overflow', - 'header-class-name' - ].includes(item.name)) - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'header', - desc: '自定义表头内容的模板', - version: '', - type: '', - enum: '', - defVal: '{column, columnIndex, $columnIndex, _columnIndex, $rowIndex}', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/column.ts b/examples/api/column.ts deleted file mode 100644 index 309a203ae1..0000000000 --- a/examples/api/column.ts +++ /dev/null @@ -1,959 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'type', - descKey: 'app.api.tableColumn.desc.type', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [ - { - name: 'seq', - descKey: 'app.api.tableColumn.desc.seq', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'checkbox', - descKey: 'app.api.tableColumn.desc.checkbox', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'radio', - descKey: 'app.api.tableColumn.desc.radio', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'expand', - descKey: 'app.api.tableColumn.desc.expand', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'html', - descKey: 'app.api.tableColumn.desc.html', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'field', - descKey: 'app.api.tableColumn.desc.field', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title', - descKey: 'app.api.tableColumn.desc.title', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'width', - descKey: 'app.api.tableColumn.desc.width', - version: '', - type: 'number | string', - enum: 'px, %', - defVal: '继承 table.column-config.width', - list: [] - }, - { - name: 'min-width', - descKey: 'app.api.tableColumn.desc.minWidth', - version: '', - type: 'number | string', - enum: 'px, %', - defVal: '继承 table.column-config.minWidth', - list: [] - }, - { - name: 'resizable', - descKey: 'app.api.tableColumn.desc.resizable', - version: '', - type: 'boolean', - enum: '', - defVal: '继承 table.resizable', - list: [] - }, - { - name: 'visible', - descKey: 'app.api.tableColumn.desc.visible', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'fixed', - descKey: 'app.api.tableColumn.desc.fixed', - version: '', - type: 'string', - enum: 'left（固定左侧）, right（固定右侧）', - defVal: '', - list: [] - }, - { - name: 'align', - descKey: 'app.api.tableColumn.desc.align', - version: '', - type: 'string', - enum: 'left（左对齐）, center（居中对齐）, right（右对齐）', - defVal: '继承 table.align', - list: [] - }, - { - name: 'header-align', - descKey: 'app.api.tableColumn.desc.headerAlign', - version: '', - type: 'string', - enum: 'left（左对齐）, center（居中对齐）, right（右对齐）', - defVal: '继承 align > 继承 table.header-align', - list: [] - }, - { - name: 'footer-align', - descKey: 'app.api.tableColumn.desc.footerAlign', - version: '', - type: 'string', - enum: 'left（左对齐）, center（居中对齐）, right（右对齐）', - defVal: '继承 align > 继承 table.footer-align', - list: [] - }, - { - name: 'show-overflow', - descKey: 'app.api.tableColumn.desc.showOverflow', - version: '', - type: 'string | boolean', - enum: 'ellipsis（只显示省略号）, title（并且显示为原生 title）, tooltip（并且显示为 tooltip 提示）', - defVal: '继承 table.show-overflow', - list: [] - }, - { - name: 'show-header-overflow', - descKey: 'app.api.tableColumn.desc.showHeaderOverflow', - version: '', - type: 'string | boolean', - enum: 'ellipsis（只显示省略号）, title（并且显示为原生 title）, tooltip（并且显示为 tooltip 提示）', - defVal: '继承 table.show-header-overflow', - list: [] - }, - { - name: 'show-footer-overflow', - descKey: 'app.api.tableColumn.desc.showFooterOverflow', - version: '', - type: 'boolean | string', - enum: 'ellipsis（只显示省略号）,title（并且显示为原生 title）,tooltip（并且显示为 tooltip 提示）', - defVal: '继承 table.show-footer-overflow', - list: [] - }, - { - name: 'class-name', - descKey: 'app.api.tableColumn.desc.className', - version: '', - type: 'string | (({row, rowIndex, $rowIndex, column, columnIndex, $columnIndex}) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'header-class-name', - descKey: 'app.api.tableColumn.desc.headerClassName', - version: '', - type: 'string | (({ $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'footer-class-name', - descKey: 'app.api.tableColumn.desc.footerClassName', - version: '', - type: 'string | (({ $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'formatter', - descKey: 'app.api.tableColumn.desc.formatter', - version: '', - type: '(({ cellValue, row, column }) => string) | any[] | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'sortable', - descKey: 'app.api.tableColumn.desc.sortable', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'sort-by', - descKey: 'app.api.tableColumn.desc.sortBy', - version: '', - type: 'string | (({ row, column }) => string | number)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'sort-type', - descKey: 'app.api.tableColumn.desc.sortType', - version: '', - type: 'string', - enum: 'auto, number, string', - defVal: 'auto', - list: [] - }, - { - name: 'filters', - descKey: 'app.api.tableColumn.desc.filters', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [ - { - name: 'label', - desc: '显示的值', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'value', - desc: '实际的值', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'checked', - desc: '默认是否选中', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'resetValue', - desc: '重置时的默认值', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'data', - desc: '自定义渲染的数据值（当使用自定义模板时可能会用到）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'filter-multiple', - descKey: 'app.api.tableColumn.desc.filterMultiple', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'filter-method', - descKey: 'app.api.tableColumn.desc.filterMethod', - version: '', - type: '({ value, option, cellValue, row, column }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'filter-reset-method', - descKey: 'app.api.tableColumn.desc.filterResetMethod', - version: '', - type: '({ options, column }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'filter-recover-method', - descKey: 'app.api.tableColumn.desc.filterRecoverMethod', - version: '', - type: '({ option, column }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'filter-render', - descKey: 'app.api.tableColumn.desc.filterRender', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '渲染器名称', - version: '', - type: 'String', - enum: 'input, textarea, select, $input, $textarea, $select', - defVal: '', - list: [] - }, - { - name: 'props', - desc: '渲染的参数（请查看目标渲染的 Props）', - version: '', - type: 'Object', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'attrs', - // desc: '渲染的属性（请查看目标渲染的 Attribute）', - // version: '', - // type: 'Object', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'events', - desc: '渲染组件的事件（请查看目标渲染的 Events）', - version: '', - type: 'Object', - enum: '', - defVal: '{row,rowIndex,$rowIndex,column,columnIndex,$columnIndex}, ...[目标渲染的 arguments]', - list: [] - }, - // { - // name: 'nativeEvents', - // desc: '渲染组件的原生事件（请查看目标渲染的 Events）', - // version: '', - // type: 'Object', - // enum: '', - // defVal: '{row,rowIndex,$rowIndex,column,columnIndex,$columnIndex}, ...[目标渲染的 arguments]', - // list: [] - // }, - { - name: 'content', - desc: '渲染组件的内容（仅用于特殊组件）', - version: '', - type: 'String', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'export-method', - desc: '自定义单元格数据导出方法，返回自定义的值', - version: '', - type: '({ row, column }) => string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'footer-export-method', - desc: '自定义表尾单元格数据导出方法，返回自定义的值', - version: '', - type: '({ items, _columnIndex }) => string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title-help', - desc: '标题帮助图标配置项', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'content', - desc: '提示消息（支持开启国际化）', - version: '4.1.1', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'message', - disabled: true, - desc: '请使用 content', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'icon', - desc: '自定义图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'cell-type', - descKey: 'app.api.tableColumn.desc.cellType', - version: '', - type: 'string', - enum: 'auto（默认自动转换），number（数值）, string（字符串）', - defVal: 'auto', - list: [] - }, - { - name: 'cell-render', - descKey: 'app.api.tableColumn.desc.cellRender', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '渲染器名称', - version: '', - type: 'string', - enum: '$button, $buttons, $switch', - defVal: '', - list: [] - }, - { - name: 'props', - desc: '渲染的参数（请查看目标渲染的 Props）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'attrs', - // desc: '渲染的属性（请查看目标渲染的 Attribute）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'options', - desc: '只对 name=select 有效，下拉选项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'optionProps', - desc: '只对 name=select 有效，下拉选项属性参数配置', - version: '', - type: 'any', - enum: '', - defVal: '{ value, label }', - list: [] - }, - { - name: 'optionGroups', - desc: '只对 name=select 有效，下拉分组选项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'optionGroupProps', - desc: '只对 name=select 有效，下拉分组选项属性参数配置', - version: '', - type: 'any', - enum: '', - defVal: '{ options, label }', - list: [] - }, - { - name: 'events', - desc: '渲染组件的事件（请查看目标渲染的 Events）', - version: '', - type: 'any', - enum: '', - defVal: '{row,rowIndex,$rowIndex,column,columnIndex,$columnIndex}, ...[目标渲染的 arguments]', - list: [] - }, - // { - // name: 'nativeEvents', - // desc: '渲染组件的原生事件（请查看目标渲染的 Events）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{row,rowIndex,$rowIndex,column,columnIndex,$columnIndex}, ...[目标渲染的 arguments]', - // list: [] - // }, - { - name: 'content', - desc: '渲染组件的内容（仅用于特殊组件）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'edit-render', - descKey: 'app.api.tableColumn.desc.editRender', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '渲染器名称', - version: '', - type: 'string', - enum: 'input, textarea, select, $input, $select, $switch', - defVal: '', - list: [] - }, - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'props', - desc: '渲染的参数（请查看目标渲染的 Props）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'attrs', - // desc: '渲染的属性（请查看目标渲染的 Attribute）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'options', - desc: '只对 name=select 有效，下拉选项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'optionProps', - desc: '只对 name=select 有效，下拉选项属性参数配置', - version: '', - type: 'any', - enum: '', - defVal: '{ value, label }', - list: [] - }, - { - name: 'optionGroups', - desc: '只对 name=select 有效，下拉分组选项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'optionGroupProps', - desc: '只对 name=select 有效，下拉分组选项属性参数配置', - version: '', - type: 'any', - enum: '', - defVal: '{ options, label }', - list: [] - }, - { - name: 'events', - desc: '渲染组件的事件（请查看目标渲染的 Events）', - version: '', - type: 'any', - enum: '', - defVal: '{row,rowIndex,$rowIndex,column,columnIndex,$columnIndex}, ...[目标渲染的 arguments]', - list: [] - }, - // { - // name: 'nativeEvents', - // desc: '渲染组件的原生事件（请查看目标渲染的 Events）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{row,rowIndex,$rowIndex,column,columnIndex,$columnIndex}, ...[目标渲染的 arguments]', - // list: [] - // }, - { - name: 'content', - desc: '渲染组件的内容（仅用于特殊组件）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'autofocus', - desc: '如果是自定义渲染可以指定聚焦的选择器，例如 .my-input', - version: '', - type: 'String', - enum: '', - defVal: '', - list: [] - }, - { - name: 'autoselect', - desc: '是否在激活编辑之后自动选中输入框内容', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'defaultValue', - desc: '默认值（插入数据时列的默认值）', - version: '', - type: 'any | ({ column }) => any', - enum: '', - defVal: 'null', - list: [] - }, - { - name: 'immediate', - desc: '输入值实时同步更新（默认情况下单元格编辑的值只会在被触发时同步，如果需要实时同步可以设置为 true）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'placeholder', - desc: '单元格占位符，但单元格为空值时显示的占位符', - version: '4.0.5', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'content-render', - descKey: 'app.api.tableColumn.desc.contentRender', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '渲染器名称', - version: '', - type: 'string', - enum: 'input, textarea, select, $input, $textarea, $select', - defVal: '', - list: [] - }, - { - name: 'props', - desc: '渲染的参数（请查看目标渲染的 Props）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'attrs', - // desc: '渲染的属性（请查看目标渲染的 Attribute）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'options', - // desc: '只对 name=select 有效，下拉选项列表', - // version: '', - // type: 'any[]', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'optionProps', - // desc: '只对 name=select 有效，下拉选项属性参数配置', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{ value, label }', - // list: [] - // }, - // { - // name: 'optionGroups', - // desc: '只对 name=select 有效，下拉分组选项列表', - // version: '', - // type: 'any[]', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'optionGroupProps', - // desc: '只对 name=select 有效，下拉分组选项属性参数配置', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{ options, label }', - // list: [] - // }, - { - name: 'events', - desc: '渲染组件的事件（请查看目标渲染的 Events）', - version: '', - type: 'any', - enum: '', - defVal: '{data, property}, ...[目标渲染的 arguments]', - list: [] - // }, - // { - // name: 'nativeEvents', - // desc: '渲染组件的原生事件（请查看目标渲染的 Events）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{data, property}, ...[目标渲染的 arguments]', - // list: [] - } - ] - }, - { - name: 'tree-node', - descKey: 'app.api.tableColumn.desc.treeNode', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'params', - descKey: 'app.api.tableColumn.desc.params', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'col-id', - desc: '自定义列的唯一主键（注：99%的场景不应该设置，操作不正确将导致出现问题）', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'default', - desc: '自定义显示内容模板', - version: '', - type: '', - enum: '', - defVal: '{row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, _columnIndex}', - list: [] - }, - { - name: 'header', - desc: '自定义表头内容的模板', - version: '', - type: '', - enum: '', - defVal: '{column, columnIndex, $columnIndex, _columnIndex, $rowIndex}', - list: [] - }, - { - name: 'footer', - desc: '自定义表尾内容的模板', - version: '', - type: '', - enum: '', - defVal: '{column, columnIndex, $columnIndex, _columnIndex, $rowIndex, items}', - list: [] - }, - { - name: 'title', - desc: '只对 type=checkbox,radio 有效，自定义标题模板', - version: '4.0.15', - type: '', - enum: '', - defVal: '{column, columnIndex, $columnIndex, _columnIndex, $rowIndex}', - list: [] - }, - { - name: 'checkbox', - desc: '只对 type=checkbox 有效，自定义复选框模板', - version: '4.0.15', - type: '', - enum: '', - defVal: '{row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, _columnIndex, checked, disabled, indeterminate}', - list: [] - }, - { - name: 'radio', - desc: '只对 type=radio 有效，自定义单选框模板', - version: '4.0.15', - type: '', - enum: '', - defVal: '{row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, _columnIndex, checked, disabled}', - list: [] - }, - { - name: 'content', - desc: '只对 type=expand 有效，自定义展开后的内容模板', - version: '', - type: '', - enum: '', - defVal: '{row, rowIndex, $rowIndex, column}', - list: [] - }, - { - name: 'filter', - desc: '只对 filter-render 启用时有效，自定义筛选模板', - version: '', - type: '', - enum: '', - defVal: '{column, columnIndex, $columnIndex}', - list: [] - }, - { - name: 'edit', - desc: '只对 edit-render 启用时有效，自定义可编辑组件模板', - version: '', - type: '', - enum: '', - defVal: '{row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, _columnIndex}', - list: [] - // }, - // { - // name: 'icon', - // desc: '只对 type=expand 或 tree-node 有效，自定义图标模板', - // version: '', - // type: '', - // enum: '', - // defVal: '{row,rowIndex,$rowIndex,column,columnIndex,$columnIndex}', - // list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/form-gather.ts b/examples/api/form-gather.ts deleted file mode 100644 index 8a6852014a..0000000000 --- a/examples/api/form-gather.ts +++ /dev/null @@ -1,59 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'span', - descKey: 'app.api.formItem.desc.span', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'class-name', - desc: '给表单项附加 className', - version: '', - type: 'string, ({ field, data }) => string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/form-item.ts b/examples/api/form-item.ts deleted file mode 100644 index 7bf6356602..0000000000 --- a/examples/api/form-item.ts +++ /dev/null @@ -1,355 +0,0 @@ -import XEUtils from 'xe-utils' - -const titleTooltip = [ - { - name: 'content', - desc: '提示消息（支持开启国际化）', - version: '4.1.1', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'message', - disabled: true, - desc: '请使用 content', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'enterable', - desc: '只对 message 设置后有效，鼠标是否可进入到 tooltip 中', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'theme', - desc: '只对 message 设置后有效，设置 tooltip 的主题样式', - version: '', - type: 'string', - enum: 'dark, light', - defVal: 'dark', - list: [] - }, - { - name: 'icon', - desc: '自定义图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } -] - -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'field', - descKey: 'app.api.formItem.desc.field', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title', - descKey: 'app.api.formItem.desc.title', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'span', - descKey: 'app.api.formItem.desc.span', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'align', - descKey: 'app.api.formItem.desc.align', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title-align', - descKey: 'app.api.formItem.desc.titleAlign', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title-width', - descKey: 'app.api.formItem.desc.titleWidth', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title-overflow', - descKey: 'app.api.formItem.desc.titleOverflow', - version: '4.0.4', - type: 'string | boolean', - enum: 'ellipsis（只显示省略号）, title（并且显示为原生 title）, tooltip（并且显示为 tooltip 提示）', - defVal: '继承 form.title-overflow', - list: [] - }, - { - name: 'class-name', - desc: '给表单项附加 className', - version: '', - type: 'string, ({ field, data }) => string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible', - descKey: 'app.api.formItem.desc.visible', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'visible-method', - descKey: 'app.api.formItem.desc.visibleMethod', - version: '', - type: '({ data }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'folding', - descKey: 'app.api.formItem.desc.folding', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'collapse-node', - descKey: 'app.api.formItem.desc.collapseNode', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'title-prefix', - descKey: 'app.api.formItem.desc.titlePrefix', - version: '', - type: 'any', - enum: '', - defVal: '', - list: XEUtils.clone(titleTooltip, true) - }, - { - name: 'title-suffix', - descKey: 'app.api.formItem.desc.titleSuffix', - version: '', - type: 'any', - enum: '', - defVal: '', - list: XEUtils.clone(titleTooltip, true) - }, - { - name: 'reset-value', - descKey: 'app.api.formItem.desc.resetValue', - version: '', - type: 'any', - enum: '', - defVal: 'null', - list: [] - }, - { - name: 'item-render', - descKey: 'app.api.formItem.desc.itemRender', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '渲染器名称', - version: '', - type: 'string', - enum: 'input, textarea, select, $input, $textarea, $select, $button, $buttons, $radio, $checkbox, $switch', - defVal: '', - list: [] - }, - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'props', - desc: '渲染的参数（请查看目标渲染的 Props）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'attrs', - // desc: '渲染的属性（请查看目标渲染的 Attribute）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'options', - desc: '只对 name=select 有效，下拉选项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'optionProps', - desc: '只对 name=select 有效，下拉选项属性参数配置', - version: '', - type: 'any', - enum: '', - defVal: '{ value, label }', - list: [] - }, - { - name: 'optionGroups', - desc: '只对 name=select 有效，下拉分组选项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'optionGroupProps', - desc: '只对 name=select 有效，下拉分组选项属性参数配置', - version: '', - type: 'any', - enum: '', - defVal: '{ options, label }', - list: [] - }, - { - name: 'events', - desc: '渲染组件的事件（请查看目标渲染的 Events）', - version: '', - type: 'any', - enum: '', - defVal: '{data, property}, ...[目标渲染的 arguments]', - list: [] - }, - { - name: 'content', - desc: '渲染组件的内容（仅用于特殊组件）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'defaultValue', - desc: '项默认值', - version: '', - type: 'any | ({ item }) => any', - enum: '', - defVal: 'null', - list: [] - } - ] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'default', - desc: '自定义表单项', - version: '', - type: '', - enum: '', - defVal: '{ data, property }', - list: [] - }, - { - name: 'title', - desc: '自定义标题', - version: '', - type: '', - enum: '', - defVal: '{ data, property }', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/form.ts b/examples/api/form.ts deleted file mode 100644 index 2891b24894..0000000000 --- a/examples/api/form.ts +++ /dev/null @@ -1,441 +0,0 @@ -import XEUtils from 'xe-utils' -import itemAPI from './form-item' -// import gatherAPI from './form-gather' - -const itemProps: any = itemAPI.find(item => item.name === 'Props') -// const gatherProps: any = gatherAPI.find(item => item.name === 'Props') - -const itemSlots: any = XEUtils.clone(itemAPI.find(item => item.name === 'Slots'), true) -itemSlots.name = 'slots' -itemSlots.list.forEach((item: any) => { - item.type = 'string, ((params) => VNode[])' - item.defVal = `${item.defVal}` -}) - -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'data', - descKey: 'app.api.form.desc.data', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'loading', - descKey: 'app.api.form.desc.loading', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'span', - descKey: 'app.api.form.desc.span', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'align', - descKey: 'app.api.form.desc.align', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'size', - descKey: 'app.api.form.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'title-align', - descKey: 'app.api.form.desc.titleAlign', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title-width', - descKey: 'app.api.form.desc.titleWidth', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title-colon', - descKey: 'app.api.form.desc.titleColon', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.form.titleColon', - list: [] - }, - { - name: 'title-asterisk', - descKey: 'app.api.form.desc.titleAsterisk', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 true，继承 setup.form.titleAsterisk', - list: [] - }, - { - name: 'title-overflow', - descKey: 'app.api.form.desc.titleOverflow', - version: '4.0.4', - type: 'string | boolean', - enum: 'ellipsis（只显示省略号）, title（并且显示为原生 title）, tooltip（并且显示为 tooltip 提示）', - defVal: '', - list: [] - }, - { - name: 'class-name', - desc: '给表单附加 className', - version: '4.0.9', - type: 'string, ({ data }) => string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'collapse-status', - desc: 'v-model 绑定值，折叠状态', - version: '4.0.29', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'custom-layout', - desc: '是否使用自定义布局', - version: '4.0.29', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.form.customLayout', - list: [] - }, - { - name: 'items', - desc: '项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: XEUtils.mapTree(itemProps.list, (item: any) => Object.assign({}, item, { name: XEUtils.camelCase(item.name) })).concat([ - { - name: 'children', - desc: '项集合', - version: '4.0.7', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - itemSlots - ]) - }, - { - name: 'rules', - descKey: 'app.api.form.desc.rules', - version: '', - type: '{ [field: string]: VxeFormDefines.FormRule[] }', - enum: '', - defVal: '', - list: [ - { - name: 'required', - desc: '是否必填', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'min', - desc: '校验值最小长度（如果 type=number 则比较值大小）', - version: '', - type: 'number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'max', - desc: '校验值最大长度（如果 type=number 则比较值大小）', - version: '', - type: 'number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - desc: '数据校验的类型', - version: '', - type: 'string', - enum: 'number | string', - defVal: 'string', - list: [] - }, - { - name: 'pattern', - desc: '正则校验', - version: '', - type: 'RegExp | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'validator', - desc: '自定义校验方法，返回一个 Error 或者 Promise', - version: '', - type: '({ itemValue, rule, rules, data, property }) => Error | Promise', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'content', - // desc: '校验提示内容（支持开启国际化）', - // version: '4.1.1', - // type: 'string', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'message', - desc: '校验提示内容（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'trigger', - abandoned: true, - desc: '触发校验方式（如果为空，则为常规校验方式； 如果指定触发方式，则只会在匹配情况下进行校验）', - version: '', - type: 'string', - enum: 'change', - defVal: '', - list: [] - }, - { - name: 'maxWidth', - desc: '提示框的最大宽度（对于某些特殊场景可能会用到）', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'prevent-submit', - desc: '是否禁用默认的回车提交方式，禁用后配合 validate() 方法可以更加自由的控制提交逻辑', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'valid-config', - desc: '检验配置项', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'autoPos', - desc: '是否自动定位到校验不通过的项', - version: '', - type: 'bolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'showMessage', - desc: '是否显示错误显示', - version: '', - type: 'bolean', - enum: '', - defVal: 'true', - list: [] - } - ] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'submit', - desc: '只对 prevent-submit=false 有效，表单提交时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ data, $event }', - list: [] - }, - { - name: 'submit-invalid', - desc: '只对 prevent-submit=false 有效，表单提交时如果校验不通过会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ data, errMap, $event }', - list: [] - }, - { - name: 'reset', - desc: '表单重置时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ data, $event }', - list: [] - }, - { - name: 'toggle-collapse', - desc: '即将废弃，请使用 collapse', - disabled: true, - version: '', - type: '', - enum: '', - defVal: '{ status, data, $event }', - list: [] - }, - { - name: 'collapse', - desc: '当折叠按钮被手动点击时会触发该事件', - version: '4.0.29', - type: '', - enum: '', - defVal: '{ status, data, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'reset()', - desc: '重置表单', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'validate(callback)', - desc: '对表单进行校验，参数为一个回调函数。该回调函数会在校验结束后被调用 callback(errMap)。若不传入回调函数，则会返回一个 promise', - version: '', - type: 'Promise', - enum: '', - defVal: 'callback?: Function', - list: [] - }, - { - name: 'validateField(field, callback)', - desc: '对表单指定项进行校验，参数为一个回调函数。该回调函数会在校验结束后被调用 callback(errMap)。若不传入回调函数，则会返回一个 promise', - version: '4.0.28', - type: 'Promise', - enum: '', - defVal: 'field?: string, callback?: Function', - list: [] - }, - { - name: 'clearValidate(field)', - desc: '手动清除校验状态，如果指定 field 则清除指定的项，否则清除整个表单', - version: '', - type: 'Promise', - enum: '', - defVal: 'field?: string', - list: [] - }, - { - name: 'updateStatus(slotParams)', - desc: '更新项状态（当使用自定义渲染时可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: 'slotParams: { property }', - list: [] - }, - { - name: 'toggleCollapse()', - desc: '只对 collapse-node 有效，手动切换折叠状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getItems()', - desc: '获取表单项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/grid.ts b/examples/api/grid.ts deleted file mode 100644 index 68f6069d83..0000000000 --- a/examples/api/grid.ts +++ /dev/null @@ -1,793 +0,0 @@ -import XEUtils from 'xe-utils' -import tableAPI from './table' -import columnAPI from './column' -import toolbarAPI from './toolbar' -import pagerAPI from './pager' -import formAPI from './form' -import formItemAPI from './form-item' - -const toolbarSlots: any = XEUtils.clone(toolbarAPI.find(item => item.name === 'Slots'), true) -toolbarSlots.name = 'slots' -toolbarSlots.list.forEach((item: any) => { - item.type = 'string, ((params) => VNode[])' - item.defVal = `${item.defVal}` -}) - -const pagerSlots: any = XEUtils.clone(pagerAPI.find(item => item.name === 'Slots'), true) -pagerSlots.name = 'slots' -pagerSlots.list.forEach((item: any) => { - item.type = 'string, ((params) => VNode[])' - item.defVal = `${item.defVal}` -}) - -const formItemSlots: any = XEUtils.clone(formItemAPI.find(item => item.name === 'Slots'), true) -formItemSlots.name = 'slots' -formItemSlots.version = '' -formItemSlots.list.forEach((item: any) => { - item.type = 'string, ((params) => VNode[])' - item.defVal = `${item.defVal}` -}) - -const formProps: any = formAPI.find(item => item.name === 'Props') -const formItemProps: any = formItemAPI.find(item => item.name === 'Props') -const toolbarProps: any = toolbarAPI.find(item => item.name === 'Props') -const pagerProps: any = pagerAPI.find(item => item.name === 'Props') -const columnProps: any = columnAPI.find(item => item.name === 'Props') - -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'form-config', - descKey: 'app.api.grid.desc.formConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.grid.formConfig', - list: XEUtils.clone(formProps, true).list.map((item: any) => Object.assign({}, item, { name: XEUtils.camelCase(item.name) })).concat([ - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'items', - desc: '项配置', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: XEUtils.clone(formItemProps, true).list.map((item: any) => Object.assign({}, item, { name: XEUtils.camelCase(item.name) })).concat([ - formItemSlots - ]) - } - ]) - }, - { - name: 'toolbar-config', - descKey: 'app.api.grid.desc.toolbarConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.grid.toolbarConfig', - list: XEUtils.clone(toolbarProps.list, true).concat([ - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'zoom', - desc: '是否允许最大化显示', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'iconIn', - desc: '自定义最大化图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconOut', - desc: '自定义还原图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - toolbarSlots - ]) - }, - { - name: 'pager-config', - descKey: 'app.api.grid.desc.pagerConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.grid.pagerConfig', - list: XEUtils.mapTree(pagerProps.list.filter((item: any) => !['size', 'loading'].includes(item.name)), (item: any) => Object.assign({}, item, { name: XEUtils.camelCase(item.name) })).concat([ - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - pagerSlots - ]) - }, - { - name: 'proxy-config', - descKey: 'app.api.grid.desc.proxyConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.grid.proxyConfig', - list: [ - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'autoLoad', - desc: '是否自动加载查询数据', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'message', - desc: '是否显示内置的消息提示（可以设为 false 关闭内置的消息提示）', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'seq', - desc: '存在 type=index 列时有效，是否代理动态序号（根据分页动态变化）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'sort', - desc: '是否代理排序', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'filter', - desc: '是否代理筛选', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'form', - desc: '是否代理表单', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'props', - desc: '获取的属性配置', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'list', - desc: '响应结果中获取数据列表的属性', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'result', - desc: '只对 pager-config 配置了有效，响应结果中获取数据列表的属性', - version: '', - type: 'string', - enum: '', - defVal: 'result', - list: [] - }, - { - name: 'total', - desc: '只对 pager-config 配置了有效，响应结果中获取分页的属性', - version: '', - type: 'string', - enum: '', - defVal: 'page.total', - list: [] - }, - { - name: 'message', - desc: '只对 pager-config 配置了有效，响应结果中获取提示消息的属性', - version: '', - type: 'string', - enum: '', - defVal: 'message', - list: [] - } - ] - }, - { - name: 'ajax', - desc: '代理配置（任何使用 Promise API 的任何库都可以对接数据代理）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'query', - desc: '查询方法，可以通过 proxy-config.props 配置读取响应结构的字段；如果使用了服务端排序，sort 属性可以获取相关信息；如果使用了服务端过滤，filter 属性可以获取相关信息；如果使用了表单，form 属性可以获取相关信息', - version: '', - type: '({ page, sort, sorts, filters, form }) => Promise', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'beforeQuery', - // desc: '查询之前触发该方法，如果存在该方法，query 参数将失效', - // version: '', - // type: '({ page, sort, sorts, filters, form }) => Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'afterQuery', - // desc: '查询之后触发该方法', - // version: '', - // type: '({ page, sort, sorts, filters, form }) => Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'queryAll', - desc: '全量查询方法，和 query 同样属于查询方法，区别是 queryAll 只会被特殊行为触发，例如导出模式 export-config.mode=all 时会触发该方法并将返回值进行导出', - version: '', - type: '({ page, sort, sorts, filters, form }) => Promise', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'beforeQueryAll', - // desc: '全量查询之前触发该方法，queryAll 参数将失效', - // version: '', - // type: '({ page, sort, sorts, filters, form }) => Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'afterQueryAll', - // desc: '全量查询之后触发该方法', - // version: '', - // type: '({ page, sort, sorts, filters, form }) => Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'delete', - desc: '删除方法，提交的参数 { removeRecords }', - version: '', - type: '({ body }) => Promise', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'beforeDelete', - // desc: '删除之前触发该方法，delete 参数将失效', - // version: '', - // type: '({ body }) => Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'afterDelete', - // desc: '删除之后触发该方法', - // version: '', - // type: '({ body }) => Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'save', - desc: '保存方法', - version: '', - type: '({ body: { insertRecords: any[], updateRecords: any[], removeRecords: any[], pendingRecords: any[] } }) => Promise', - enum: '', - defVal: '', - list: [] - // }, - // { - // name: 'beforeSave', - // desc: '保存之前触发该方法，save 参数将失效', - // version: '', - // type: '({ body: { insertRecords: any[], updateRecords: any[], removeRecords: any[], pendingRecords: any[] } }) => Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'afterSave', - // desc: '保存之后触发该方法', - // version: '', - // type: '({ body: { insertRecords: any[], updateRecords: any[], removeRecords: any[], pendingRecords: any[] } }) => Promise', - // enum: '', - // defVal: '', - // list: [] - } - ] - } - ] - }, - { - name: 'zoom-config', - descKey: 'app.api.grid.desc.zoomConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.grid.zoomConfig', - list: [ - { - name: 'escRestore', - desc: '是否允许通过按下 ESC 键还原', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - } - ] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'form', - desc: '表单模板', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - }, - { - name: 'toolbar', - desc: '工具栏模板', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - }, - { - name: 'top', - desc: '表格顶部模板', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - }, - { - name: 'bottom', - desc: '表格底部模板', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - }, - { - name: 'pager', - desc: '分页模板', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'page-change', - desc: '只对 pager-config 配置时有效，分页发生改变时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ type, currentPage, pageSize, $event }', - list: [] - }, - { - name: 'form-submit', - desc: '只对 form-config 配置时有效，表单提交时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ data, $event }', - list: [] - }, - { - name: 'form-submit-invalid', - desc: '只对 form-config 配置时有效，表单提交时如果校验不通过会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ data, errMap, $event }', - list: [] - }, - { - name: 'form-reset', - desc: '只对 form-config 配置时有效，表单重置时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ data, $event }', - list: [] - }, - { - name: 'form-toggle-collapse', - desc: '即将废弃，请使用 form-collapse', - disabled: true, - version: '', - type: '', - enum: '', - defVal: '{ status, data, $event }', - list: [] - }, - { - name: 'form-collapse', - desc: '只对 form-config 配置时有效，当折叠按钮被手动点击时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ status, data, $event }', - list: [] - }, - { - name: 'toolbar-button-click', - desc: '只对 toolbar.buttons 配置时有效，当左侧按钮被点击时会后触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ code, button, $event }', - list: [] - }, - { - name: 'toolbar-tool-click', - desc: '只对 toolbar.tools 配置时有效，当右侧工具被点击时会后触发该事件', - version: '4.0.7', - type: '', - enum: '', - defVal: '{ code, tool, $event }', - list: [] - }, - { - name: 'zoom', - desc: '当最大化或还原操作被手动点击时会后触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ type, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'commitProxy(code, ...arguments)', - desc: '给数据代理提交指令（支持额外的参数，例如：手动调用触发查询、保存等方法）', - version: '', - type: '', - enum: '', - defVal: 'code: string', - list: [] - }, - { - name: 'zoom()', - desc: '切换表格最大化/还原', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'isMaximized()', - desc: '判断是否最大化显示', - version: '', - type: 'Boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'maximize()', - desc: '如果表格处于常规状态，则最大化表格', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'revert()', - desc: '如果表格处于最大化状态，则还原表格', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getFormItems(index)', - desc: '只对 form-config 有效，获取表单项列表', - version: '', - type: 'Array', - enum: '', - defVal: 'index? number', - list: [] - }, - { - name: 'getPendingRecords()', - desc: '获取已标记删除的数据', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getProxyInfo()', - desc: '获取数据代理信息', - version: '', - type: '{data, filter, form, sort, pager, pendingRecords}', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -const gridAPI: any = XEUtils.clone(tableAPI, true).map((item: any) => { - const rest: any = apis.find(obj => obj.name === item.name) - rest.list = item.list.concat(rest.list) - return rest -}) - -XEUtils.eachTree(gridAPI, (item: any, index, obj, paths, parent) => { - if (parent && ['export-config', 'print-config'].includes(parent.name) && item.name === 'modes') { - item.desc = '输出数据的方式列表，如果为 all，则会通过 proxy-config.ajax.queryAll 获取数据之后进行导出' - } - if (parent && parent.name === 'buttons' && item.name === 'code') { - item.list = [ - { - name: 'reload', - desc: '刷新数据并清除所有状态；触发 ajax.query 方法', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'query', - desc: '刷新数据；会自动触发 ajax.query 方法', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'insert', - desc: '新增数据', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'insert_actived', - desc: '新增数据并且默认激活第一个可编辑的单元格', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'mark_cancel', - desc: '将选中的数据标记或取消删除', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'delete', - desc: '删除选中行；会自动触发 ajax.delete 方法', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'remove', - desc: '移除选中行', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'save', - desc: '保存数据；会自动触发 ajax.save 方法，并且在 Promise 完成之后重新触发 ajax.query 方法', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'import', - desc: '直接导入', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'open_import', - desc: '高级导入', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'export', - desc: '直接导出', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'open_export', - desc: '高级导出', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'reset_custom', - desc: '重置个性化数据（显示/隐藏列、列宽拖动状态）', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } - ] - } -}, { children: 'list' }) - -const columnSlots: any = XEUtils.clone(columnAPI.find(item => item.name === 'Slots'), true) -columnSlots.name = 'slots' -columnSlots.list.forEach((item: any) => { - item.type = 'string | ((params) => VNode[])' - item.defVal = `${item.defVal}` -}) - -gridAPI.find((item: any) => item.name === 'Props').list.splice(1, 0, { - name: 'columns', - descKey: 'app.api.table.desc.columns', - type: 'array', - enum: '', - defVal: '', - list: XEUtils.mapTree(columnProps.list, (item: any) => Object.assign({}, item, { name: XEUtils.camelCase(item.name) })).concat([ - { - name: 'children', - desc: '表头分组', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - columnSlots - ]) -}) - -export default gridAPI diff --git a/examples/api/input.ts b/examples/api/input.ts deleted file mode 100644 index 9635c30ac7..0000000000 --- a/examples/api/input.ts +++ /dev/null @@ -1,542 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.input.desc.value', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'immediate', - // descKey: 'app.api.input.desc.immediate', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: 'true', - // list: [] - // }, - { - name: 'size', - descKey: 'app.api.input.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'type', - desc: '渲染类型', - version: '', - type: 'string', - enum: 'text, search, number, integer, float, password, date, time, datetime, week, month, quarter, year', - defVal: 'text', - list: [] - }, - { - name: 'name', - desc: '原生 name 属性', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'form', - desc: '原生 form 属性', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearable', - desc: '当有值时，是否在右侧显示清除按钮', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.input.clearable', - list: [] - }, - { - name: 'placeholder', - desc: '当值为空时，显示的占位符', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'autocomplete', - desc: '原生 autocomplete 属性', - version: '', - type: 'string', - enum: '', - defVal: 'off', - list: [] - }, - { - name: 'maxlength', - desc: '原生 maxlength 属性', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'readonly', - desc: '是否只读', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.input.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'className', - desc: '附加 className', - version: '4.0.7', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'prefix-icon', - descKey: 'app.api.input.desc.prefixIcon', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'suffix-icon', - descKey: 'app.api.input.desc.suffixIcon', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'min', - desc: '只对 type=number|integer|float 有效，最小值', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'max', - desc: '只对 type=number|integer|float 有效，最大值', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'step', - desc: '只对 type=number|integer|float 有效，数字间隔', - version: '', - type: 'number | string', - enum: '', - defVal: '1', - list: [] - }, - { - name: 'digits', - desc: '只对 type=float 有效，小数位数', - version: '', - type: 'number | string', - enum: '', - defVal: '默认 2，继承 setup.input.digits', - list: [] - }, - { - name: 'align', - desc: '内容对齐方式', - version: '', - type: 'string', - enum: 'left, center, right', - defVal: 'left', - list: [] - }, - { - name: 'exponential', - desc: '只对 type=number|integer|float 有效，数值是否允许输入科学计数', - version: '4.0.16', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.input.exponential', - list: [] - }, - { - name: 'controls', - desc: '只对 type=number|integer|float 有效，是否显示控制按钮', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 true，继承 setup.input.controls', - list: [] - }, - { - name: 'min-date', - abandoned: true, - desc: '只对 type=date|datetime|week|month|quarter|year 有效，设置日期可选范围的最小值', - version: '', - type: 'number | string | Date', - enum: '', - defVal: '默认 new Date(1900, 0, 1)，继承 setup.input.minDate', - list: [] - }, - { - name: 'max-date', - abandoned: true, - desc: '只对 type=date|datetime|week|month|quarter|year 有效，设置日期可选范围的最大值', - version: '', - type: 'number | string | Date', - enum: '', - defVal: '默认 new Date(2100, 0, 1)，继承 setup.input.maxDate', - list: [] - }, - { - name: 'start-week', - disabled: true, - desc: '即将废弃，请使用 start-day', - version: '', - type: 'number | string', - enum: '0, 1, 2, 3, 4, 5, 6', - defVal: '', - list: [] - }, - { - name: 'start-day', - desc: '设置每周的起始日期是星期几', - version: '4.0.16', - type: 'number | string', - enum: '0, 1, 2, 3, 4, 5, 6', - defVal: '默认 1，继承 setup.input.startDay', - list: [] - }, - { - name: 'select-day', - desc: '只对 type=week 有效，设置周视图选中后返回星期几', - version: '4.0.16', - type: 'number | string', - enum: '0, 1, 2, 3, 4, 5, 6', - defVal: '默认 1，继承 setup.input.selectDay', - list: [] - }, - { - name: 'label-format', - desc: '只对 type=date|datetime|week|month|quarter|year 有效，输入框中显示的日期格式', - version: '', - type: 'string', - enum: '', - defVal: '继承 setup.input.labelFormat', - list: [] - }, - { - name: 'value-format', - desc: '只对 type=date|datetime|week|month|quarter|year 有效，绑定值的返回格式，默认返回 Date 类型，如果指定格式则返回字符串', - version: '', - type: 'string', - enum: '', - defVal: '继承 setup.input.valueFormat', - list: [] - }, - { - name: 'editable', - desc: '只对 type=date|time|datetime|week|month|quarter|year 有效，文本框是否允许输入', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 true，继承 setup.input.editable', - list: [] - }, - { - name: 'disabled-method', - desc: '只对 type=date|datetime|week|month|quarter|year 有效，该方法的返回值用来决定该日期是否允许选中', - version: '', - type: '({ date, viewType }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'festival-method', - desc: '只对 type=date|datetime|week|month|quarter|year 有效，该方法用于返回对应日期显示的节日', - version: '', - type: '({ date, viewType }) => any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'transfer', - desc: '只对 type=date|time|datetime|week|month|quarter|year 有效，是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.input.transfer', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'prefix', - desc: '前缀图标模板', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'suffix', - desc: '后缀图标模板', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'input', - desc: '在键盘输入时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'change', - desc: '在键盘输入时值发生变化时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'keydown', - desc: '在键盘输入按下时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'keyup', - desc: '在键盘输入按下弹起时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - // { - // name: 'wheel', - // desc: '在鼠标在输入框内滚动时触发该事件', - // version: '', - // type: '', - // enum: '', - // defVal: '{ value, $event }', - // list: [] - // }, - { - name: 'click', - desc: '在点击输入框时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'focus', - desc: '在输入框聚焦时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'blur', - desc: '在输入框失焦时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'clear', - desc: '在点击右侧清除按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'search-click', - desc: '只对 type=search 有效，在点击右侧搜索按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'toggle-visible', - desc: '只对 type=password 有效，在点击右侧切换按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, visible, $event }', - list: [] - }, - { - name: 'prev-number', - desc: '只对 type=number 有效，在点击右侧向上按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'next-number', - desc: '只对 type=number 有效，在点击右侧向下按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'prefix-click', - desc: '在点击头部图标时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'suffix-click', - desc: '在点击尾部图标时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'date-prev', - desc: '只对 type=date|datetime|week|month|year 有效，在点击上一个视图按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'date-today', - desc: '只对 type=date|datetime|week|month|year 有效，在点击到今天视图按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'date-next', - desc: '只对 type=date|datetime|week|month|year 有效，在点击下一个视图按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'focus()', - desc: '使输入框获取焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'blur()', - desc: '使输入框失去焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/list.ts b/examples/api/list.ts deleted file mode 100644 index 5fe7c73bd9..0000000000 --- a/examples/api/list.ts +++ /dev/null @@ -1,224 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'data', - descKey: 'app.api.list.desc.data', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'size', - descKey: 'app.api.list.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'loading', - desc: '是否加载中', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'height', - desc: '列表高度', - version: '', - type: 'number | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'className', - desc: '附加 className', - version: '4.0.7', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'auto-resize', - desc: '自动监听父元素的变化去重新计算列表（对于父元素可能存在动态变化的场景可能会用到）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'sync-resize', - desc: '自动跟随某个属性的变化去重新计算列表，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换的场景可能会用到）', - version: '', - type: 'boolean | string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'scroll-y', - desc: '纵向虚拟滚动配置', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'gt', - desc: '指定大于指定行时自动启动纵向虚拟滚动', - version: '', - type: 'number', - enum: '', - defVal: '100', - list: [] - }, - { - name: 'oSize', - desc: '指定每次渲染的数据偏移量，偏移量越大渲染次数就越少，但每次渲染耗时就越久', - version: '', - type: 'number', - enum: '', - defVal: '0', - list: [] - }, - { - name: 'sItem', - desc: '指定行元素的选择器', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - // }, - // { - // name: 'rHeight', - // desc: '指定行高', - // version: '', - // type: 'number', - // enum: '', - // defVal: '默认自动计算', - // list: [] - } - ] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'scroll', - desc: '列表滚动时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'loadData(data)', - desc: '加载数据', - version: '', - type: 'Promise', - enum: '', - defVal: 'data: array', - list: [] - }, - { - name: 'reloadData(data)', - desc: '加载数据并清除所有状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'data: array', - list: [] - }, - { - name: 'recalculate()', - desc: '重新计算列表', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'scrollTo(scrollLeft, scrollTop)', - desc: '如果有滚动条，则滚动到对应的位置', - version: '', - type: 'Promise', - enum: '', - defVal: 'scrollLeft?: number, scrollTop?: number', - list: [] - }, - { - name: 'refreshScroll()', - desc: '刷新滚动操作，手动同步滚动相关位置', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearScroll()', - desc: '手动清除滚动相关信息，还原到初始状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/modal.ts b/examples/api/modal.ts deleted file mode 100644 index dc09f336c6..0000000000 --- a/examples/api/modal.ts +++ /dev/null @@ -1,604 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.modal.desc.value', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'size', - descKey: 'app.api.modal.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'loading', - descKey: 'app.api.modal.desc.loading', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'id', - descKey: 'app.api.modal.desc.id', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title', - descKey: 'app.api.modal.desc.title', - version: '', - type: 'string', - enum: '', - defVal: '消息提示', - list: [] - }, - { - name: 'type', - descKey: 'app.api.modal.desc.type', - version: '', - type: 'string', - enum: 'alert, confirm, message', - defVal: '', - list: [] - }, - { - name: 'status', - descKey: 'app.api.modal.desc.status', - version: '', - type: 'string', - enum: 'info, success, warning, error, loading', - defVal: '', - list: [] - }, - { - name: 'className', - desc: '给窗口附加 className', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconStatus', - descKey: 'app.api.modal.desc.iconStatus', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'content', - descKey: 'app.api.modal.desc.content', - version: '4.0.10', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'message', - abandoned: true, - descKey: 'app.api.modal.desc.message', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'cancel-button-text', - desc: '只对 type=confirm 有效，取消按钮的文本内容', - version: '', - type: 'string', - enum: '', - defVal: '取消', - list: [] - }, - { - name: 'confirm-button-text', - desc: '只对 type=alert|confirm 有效，确定按钮的文本内容', - version: '', - type: 'string', - enum: '', - defVal: '确定', - list: [] - }, - { - name: 'showHeader', - descKey: 'app.api.modal.desc.showHeader', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'showFooter', - descKey: 'app.api.modal.desc.showFooter', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'lock-view', - descKey: 'app.api.modal.desc.lockView', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'lock-scroll', - descKey: 'app.api.modal.desc.lockScroll', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'mask', - descKey: 'app.api.modal.desc.mask', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'mask-closable', - descKey: 'app.api.modal.desc.maskClosable', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'esc-closable', - descKey: 'app.api.modal.desc.escClosable', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'show-zoom', - descKey: 'app.api.modal.desc.showZoom', - version: '', - type: 'Boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'show-close', - desc: '是否显示关闭按钮', - version: '4.0.14', - type: 'Boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'resize', - descKey: 'app.api.modal.desc.resize', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'margin-size', - descKey: 'app.api.modal.desc.marginSize', - version: '', - type: 'number', - enum: '', - defVal: '默认 0，继承 setup.modal.marginSize', - list: [] - }, - { - name: 'duration', - descKey: 'app.api.modal.desc.duration', - version: '', - type: 'number | string', - enum: '', - defVal: '3000', - list: [] - }, - { - name: 'width', - descKey: 'app.api.modal.desc.width', - version: '', - type: 'number | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'height', - descKey: 'app.api.modal.desc.height', - version: '', - type: 'number | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'min-width', - descKey: 'app.api.modal.desc.minWidth', - version: '', - type: 'number | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'min-height', - descKey: 'app.api.modal.desc.minHeight', - version: '', - type: 'number | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'top', - descKey: 'app.api.modal.desc.top', - version: '', - type: 'number | string', - enum: '', - defVal: '15', - list: [] - }, - { - name: 'position', - descKey: 'app.api.modal.desc.position', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'top', - desc: '距离顶部的偏移', - version: '', - type: 'number | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'left', - desc: '距离左侧的偏移', - version: '', - type: 'number | string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'zIndex', - descKey: 'app.api.modal.desc.zIndex', - version: '', - type: 'number', - enum: '', - defVal: '继承 setup.zIndex', - list: [] - }, - { - name: 'show-title-overflow', - descKey: 'app.api.modal.desc.showTitleOverflow', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'transfer', - desc: '是否将弹框容器插入于 body 内', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.modal.transfer', - list: [] - }, - { - name: 'fullscreen', - descKey: 'app.api.modal.desc.fullscreen', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'draggable', - descKey: 'app.api.modal.desc.draggable', - version: '4.0.28', - type: 'boolean', - enum: '', - defVal: '默认 true，继承 setup.modal.draggable', - list: [] - }, - { - name: 'dblclickZoom', - descKey: 'app.api.modal.desc.dblclickZoom', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 true，继承 setup.modal.dblclickZoom', - list: [] - }, - { - name: 'remember', - descKey: 'app.api.modal.desc.remember', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'destroy-on-close', - descKey: 'app.api.modal.desc.destroyOnClose', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'storage', - descKey: 'app.api.modal.desc.storage', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'before-hide-method', - desc: '在窗口隐藏之前执行，可以返回 Error 阻止关闭，支持异步', - version: '', - type: '({ type }) => Error | Promise', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'default', - desc: '窗口内容模板', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'header', - desc: '窗口头部的模板（如果使用了，则 solt title 无效）', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'title', - desc: '窗口标题的模板', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'footer', - desc: '窗口底部的模板', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'show', - desc: '在窗口显示时会触发该事件', - version: '', - type: '{ type }', - enum: '', - defVal: '', - list: [] - }, - { - name: 'hide', - desc: '在窗口隐藏时会触发该事件', - version: '', - type: '{ type }', - enum: '', - defVal: '', - list: [] - }, - { - name: 'confirm', - desc: '点击确定按钮时会触发该事件', - version: '', - type: '{ type, $event }', - enum: '', - defVal: '', - list: [] - }, - { - name: 'cancel', - desc: '点击取消按钮时会触发该事件', - version: '', - type: '{ type, $event }', - enum: '', - defVal: '', - list: [] - }, - { - name: 'close', - desc: '点击关闭按钮时会触发该事件', - version: '', - type: '{ type, $event }', - enum: '', - defVal: '', - list: [] - }, - { - name: 'zoom', - desc: '窗口缩放时会触发该事件', - version: '', - type: '{ type, $event }', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'open()', - desc: '手动打开窗口', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'close()', - desc: '手动关闭窗口', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getBox()', - desc: '获取当前窗口元素', - version: '', - type: 'Element', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getPosition()', - desc: '只对 type=modal 有效，获取窗口位置', - version: '', - type: '{top,left}', - enum: '', - defVal: '', - list: [] - }, - { - name: 'setPosition(top, left)', - desc: '只对 type=modal 有效，设置窗口位置', - version: '', - type: 'Promise', - enum: '', - defVal: 'top?: number, left?: number', - list: [] - }, - { - name: 'isMaximized()', - desc: '判断是否最大化显示', - version: '', - type: 'Boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'zoom()', - desc: '切换窗口最大化/还原', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'maximize()', - desc: '如果窗口处于常规状态，则最大化窗口', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'revert()', - desc: '如果窗口处于最大化状态，则还原窗口', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/optgroup.ts b/examples/api/optgroup.ts deleted file mode 100644 index 643f9ca14d..0000000000 --- a/examples/api/optgroup.ts +++ /dev/null @@ -1,87 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'label', - descKey: 'app.api.optgroup.desc.label', - version: '', - type: 'string | number | boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible', - desc: '是否显示', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'class-name', - desc: '附加 className', - version: '4.1.0', - type: 'string | ((params: { option }) => string)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.optgroup.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'default', - desc: '自定义选项显示内容模板', - version: '4.0.21', - type: '', - enum: '', - defVal: '{option}', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/option.ts b/examples/api/option.ts deleted file mode 100644 index 5cf33ae9d5..0000000000 --- a/examples/api/option.ts +++ /dev/null @@ -1,96 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'value', - descKey: 'app.api.option.desc.value', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'label', - descKey: 'app.api.option.desc.label', - version: '', - type: 'string | number | boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible', - desc: '是否显示', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'class-name', - desc: '附加 className', - version: '4.1.0', - type: 'string | ((params: { option }) => string)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.option.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'default', - desc: '自定义选项显示内容模板', - version: '4.0.21', - type: '', - enum: '', - defVal: '{option}', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/pager.ts b/examples/api/pager.ts deleted file mode 100644 index 87a0fe5ea2..0000000000 --- a/examples/api/pager.ts +++ /dev/null @@ -1,287 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'size', - descKey: 'app.api.pager.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'loading', - descKey: 'app.api.pager.desc.loading', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'layouts', - descKey: 'app.api.pager.desc.layouts', - version: '', - type: 'string[]', - enum: 'PrevJump, PrevPage, Number, JumpNumber, NextPage, NextJump, Sizes, Jump, FullJump, PageCount, Total', - defVal: '默认 [PrevJump, PrevPage, Jump, PageCount, NextPage, NextJump, Sizes, Total]，继承 setup.pager.layouts', - list: [] - }, - { - name: 'current-page', - descKey: 'app.api.pager.desc.currentPage', - version: '', - type: 'number', - enum: '', - defVal: '1', - list: [] - }, - { - name: 'page-size', - descKey: 'app.api.pager.desc.pageSize', - version: '', - type: 'number', - enum: '', - defVal: '默认 10，继承 setup.pager.pageSize', - list: [] - }, - { - name: 'total', - descKey: 'app.api.pager.desc.total', - version: '', - type: 'number', - enum: '', - defVal: '0', - list: [] - }, - { - name: 'pager-count', - descKey: 'app.api.pager.desc.pagerCount', - version: '', - type: 'number', - enum: '', - defVal: '默认 7，继承 setup.pager.pagerCount', - list: [] - }, - { - name: 'page-sizes', - descKey: 'app.api.pager.desc.pageSizes', - version: '', - type: 'number[] | Array<{label: string, value: number}>', - enum: '', - defVal: '默认 [10,15,20,50,100]，继承 setup.pager.pageSizes', - list: [] - }, - { - name: 'align', - descKey: 'app.api.pager.desc.align', - version: '', - type: 'string', - enum: 'left（左对其）, center（居中对其）, right（右对齐）', - defVal: '默认 right，继承 setup.pager.align', - list: [] - }, - { - name: 'border', - descKey: 'app.api.pager.desc.border', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.pager.border', - list: [] - }, - { - name: 'background', - descKey: 'app.api.pager.desc.background', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.pager.background', - list: [] - }, - { - name: 'perfect', - desc: '配套的样式', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.pager.perfect', - list: [] - }, - { - name: 'class-name', - desc: '给分页附加 className', - version: '4.0.9', - type: 'string, ({}) => string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'auto-hidden', - desc: '当只有一页时自动隐藏', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.pager.autoHidden', - list: [] - }, - { - name: 'icon-prev-page', - descKey: 'app.api.pager.desc.iconPrevPage', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'icon-jump-prev', - descKey: 'app.api.pager.desc.iconJumpPrev', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'icon-jump-next', - descKey: 'app.api.pager.desc.iconJumpNext', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconnext-page', - descKey: 'app.api.pager.desc.iconNextPage', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'icon-jump-more', - descKey: 'app.api.pager.desc.iconJumpMore', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'left', - desc: '自定义左侧模板', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - }, - { - name: 'right', - desc: '自定义右侧模板', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'page-change', - desc: '分页发生改变时会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ type, currentPage, pageSize, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - // { - // name: 'prevPage()', - // desc: '跳转到上一页', - // version: '', - // type: '', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'nextPage()', - // desc: '跳转到下一页', - // version: '', - // type: '', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'prevJump()', - // desc: '向上翻页', - // version: '', - // type: '', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'nextJump()', - // desc: '向下翻页', - // version: '', - // type: '', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'jumpPage(currentPage)', - // desc: '跳转到指定页', - // version: '', - // type: '', - // enum: '', - // defVal: 'currentPage: number', - // list: [] - // } - ] - } -] - -export default apis diff --git a/examples/api/pulldown.ts b/examples/api/pulldown.ts deleted file mode 100644 index 051f5a5444..0000000000 --- a/examples/api/pulldown.ts +++ /dev/null @@ -1,152 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'size', - descKey: 'app.api.pulldown.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.pulldown.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'placement', - descKey: 'app.api.pulldown.desc.placement', - version: '', - type: 'string', - enum: 'top, bottom', - defVal: 'bottom', - list: [] - }, - { - name: 'destroy-on-close', - desc: '在下拉容器关闭时销毁内容', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'transfer', - descKey: 'app.api.pulldown.desc.transfer', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'default', - desc: '显示的内容', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'dropdown', - desc: '下拉面板显示的内容', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'hide-panel', - desc: '在下拉面板被触发隐藏时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'isPanelVisible()', - desc: '判断下拉面板是否可视', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'togglePanel()', - desc: '切换下拉面板', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'showPanel()', - desc: '显示下拉面板', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'hidePanel()', - desc: '隐藏下拉面板', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/radio-button.ts b/examples/api/radio-button.ts deleted file mode 100644 index 916753f853..0000000000 --- a/examples/api/radio-button.ts +++ /dev/null @@ -1,77 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.radio.desc.value', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'label', - desc: '绑定值', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'content', - desc: '显示内容', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'disabled', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/radio-group.ts b/examples/api/radio-group.ts deleted file mode 100644 index fa1b73661c..0000000000 --- a/examples/api/radio-group.ts +++ /dev/null @@ -1,68 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.radio.desc.value', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'size', - descKey: 'app.api.radio.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'disabled', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/radio.ts b/examples/api/radio.ts deleted file mode 100644 index afad217fc6..0000000000 --- a/examples/api/radio.ts +++ /dev/null @@ -1,105 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.radio.desc.value', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'label', - descKey: 'app.api.radio.desc.label', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'content', - desc: '内容（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'size', - descKey: 'app.api.radio.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.radio.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'name', - descKey: 'app.api.radio.desc.name', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'change', - desc: '在值发生改变时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ label, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/select.ts b/examples/api/select.ts deleted file mode 100644 index 67e1a8a4c5..0000000000 --- a/examples/api/select.ts +++ /dev/null @@ -1,296 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.select.desc.value', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - { - name: 'size', - descKey: 'app.api.select.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'multiple', - descKey: 'app.api.select.desc.multiple', - version: '', - type: 'boolean', - enum: 'false', - defVal: '', - list: [] - }, - { - name: 'multi-char-overflow', - desc: '只对 multiple 有效，设置多选中每个选项显示值的最大字符数，如果超出显示省略号；如果为 -1 则关闭', - version: '', - type: 'number, string', - enum: '', - defVal: '默认 8，继承 setup.select.multiCharOverflow', - list: [] - }, - { - name: 'clearable', - descKey: 'app.api.select.desc.clearable', - version: '', - type: 'boolean', - enum: 'false', - defVal: '', - list: [] - }, - { - name: 'placeholder', - descKey: 'app.api.select.desc.placeholder', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'class-name', - desc: '给下拉框附加 className', - version: '4.0.7', - type: 'string | (({}) => string)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible', - desc: '是否显示', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.select.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'prefix-icon', - descKey: 'app.api.select.desc.prefixIcon', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'placement', - descKey: 'app.api.select.desc.placement', - version: '', - type: 'string', - enum: 'top, bottom', - defVal: 'bottom', - list: [] - }, - { - name: 'options', - desc: '下拉选项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'option-props', - desc: '下拉选项属性参数配置', - version: '', - type: 'any', - enum: '', - defVal: '{ value, label }', - list: [] - }, - { - name: 'option-groups', - desc: '下拉分组选项列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'option-group-props', - desc: '下拉分组选项属性参数配置', - version: '', - type: 'any', - enum: '', - defVal: '{ options, label }', - list: [] - }, - { - name: 'option-id', - desc: '自定义选项唯一主键的字段名（选项必须要有唯一主键，默认自动生成）', - version: '', - type: 'string', - enum: '', - defVal: '默认 _XID，继承 setup.select.optionId', - list: [] - }, - { - name: 'option-key', - desc: '是否需要为每一行的 VNode 设置 key 属性（非特殊情况下没必要设置）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'transfer', - descKey: 'app.api.select.desc.transfer', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.select.transfer', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'prefix', - desc: '前缀图标模板', - version: '4.0.14', - type: '', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'change', - desc: '在值发生改变时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'clear', - desc: '在点击右侧清除按钮时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'isPanelVisible()', - desc: '判断下拉面板是否可视', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'togglePanel()', - desc: '切换下拉面板', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'showPanel()', - desc: '显示下拉面板', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'hidePanel()', - desc: '隐藏下拉面板', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'refreshOption()', - desc: '刷新选项（对于动态修改显示/隐藏选项等场景下可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'focus()', - desc: '使下拉框获取焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'blur()', - desc: '使下拉框失去焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/switch.ts b/examples/api/switch.ts deleted file mode 100644 index feb4202d53..0000000000 --- a/examples/api/switch.ts +++ /dev/null @@ -1,132 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.switch.desc.value', - version: '', - type: 'string | number | boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.switch.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'size', - descKey: 'app.api.switch.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'open-label', - descKey: 'app.api.switch.desc.onLabel', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'close-label', - descKey: 'app.api.switch.desc.offLabel', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'open-value', - descKey: 'app.api.switch.desc.onValue', - version: '', - type: 'string | number | boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'close-value', - descKey: 'app.api.switch.desc.offValue', - version: '', - type: 'string | number | boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'open-icon', - descKey: 'app.api.switch.desc.onIcon', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'close-icon', - descKey: 'app.api.switch.desc.offIcon', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'change', - desc: '值改变时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } -] - -export default apis diff --git a/examples/api/table.ts b/examples/api/table.ts deleted file mode 100644 index 39a449266d..0000000000 --- a/examples/api/table.ts +++ /dev/null @@ -1,4892 +0,0 @@ -import XEUtils from 'xe-utils' - -const contextMenuAPI = [ - { - name: 'disabled', - desc: '是否禁用右键', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'options', - desc: '菜单配置', - version: '', - type: 'any[][]', - enum: '', - defVal: '', - list: [ - { - name: 'code', - desc: '菜单键值', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'name', - desc: '菜单名称（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'prefixIcon', - desc: '前缀图标 className', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'suffixIcon', - desc: '后缀图标 className', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'className', - desc: '菜单项的 className', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible', - desc: '是否可视', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'disabled', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'children', - desc: '二级菜单（最多只允许有二级）', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [ - { - name: 'code', - desc: '菜单键值', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'name', - desc: '菜单名称', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'prefixIcon', - desc: '前缀图标 className', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible ', - desc: '是否可视', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'disabled ', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - } - ] - } - ] - } -] - -const exportDataAPI = [ - { - name: 'filename', - desc: '文件名', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'sheetName', - desc: '表名（只对支持的文档类型有效）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - desc: '文件类型', - version: '', - type: 'string', - enum: 'csv, html, xml, txt', - defVal: 'csv', - list: [] - }, - { - name: 'types', - desc: '可选文件类型列表', - version: '', - type: 'string[]', - enum: 'csv, html, xml, txt', - defVal: 'csv, html, xml, txt', - list: [] - }, - { - name: 'mode', - desc: '输出数据的方式', - version: '', - type: 'string', - enum: 'current, selected, all', - defVal: 'current', - list: [] - }, - { - name: 'modes', - desc: '输出数据的方式列表', - version: '', - type: 'string[]', - enum: 'current, selected, all', - defVal: 'current, selected', - list: [] - }, - { - name: 'original', - desc: '是否为源数据（某些场景下支持 true， 比如虚拟滚动、优化的固定列..，如果需要支持导入，则必须设置为 true）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'message', - desc: '是否显示内置的消息提示', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'isHeader', - desc: '是否需要表头', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'isColgroup', - desc: '如果存在，则支持带有分组结构的表头', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'isFooter', - desc: '是否需要表尾', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'isMerge', - desc: '如果存在，则支持临时合并的单元格', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isAllExpand', - desc: '如果存在，则强制展开所有树层级', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'download', - desc: '是否马上下载，如果设置为 false 则通过返回结果为内容的 Promise', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'data', - desc: '指定数据', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'columns', - desc: '指定列', - version: '', - type: 'Array<{ colId?: number; field:? string; type?: string }>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'columnFilterMethod', - desc: '列过滤方法，该函数的返回值用来决定是否过滤掉列', - version: '', - type: '({ column, $columnIndex }) => boolean', - enum: '', - defVal: '默认过滤掉 type=seq,checkbox,radio 和 field 为空的列', - list: [] - }, - { - name: 'dataFilterMethod', - desc: '数据过滤方法，该函数的返回值用来决定是否过滤掉数据行', - version: '', - type: '({ row, $rowIndex }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'footerFilterMethod', - desc: '表尾过滤方法，该函数的返回值用来决定是否过滤掉表尾行', - version: '', - type: '({ items, $rowIndex }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'remote', - desc: '是否服务端导出', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'style', - desc: '只对 type=html 有效，自定义文档的 css 样式信息', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'useStyle', - desc: '只对 type=html,xlsx 有效，支持带样式', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'sheetMethod', - desc: '只对 type=xlsx 有效，该函数用于自定义工作簿的单元格', - version: '2.10.9', - type: '({ options, workbook, worksheet }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'exportMethod', - desc: '只对 remote=true 有效，该函数用于自定义导出或服务端导出，返回 Promise', - version: '', - type: '({ options }) => Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforeExportMethod', - desc: '该方法会在导出之前触发', - version: '', - type: '({ options }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'afterExportMethod', - desc: '该方法会在导出之后触发', - version: '', - type: '({ options }) => viod', - enum: '', - defVal: '', - list: [] - } -] - -const importDataAPI = [ - { - name: 'mode', - desc: '导入数据的方式', - version: '', - type: 'string', - enum: 'covering, insert', - defVal: 'covering', - list: [] - }, - { - name: 'message', - desc: '是否显示内置的消息提示', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'types', - desc: '导入的文件类型列表', - version: '', - type: 'string[]', - enum: 'csv, html, xml, txt', - defVal: '[\'csv\', \'html\', \'xml\', \'txt\']', - list: [] - }, - { - name: 'remote', - desc: '是否服务端导入', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'importMethod', - desc: '只对 remote=true 有效，该函数用于自定义导入或服务端导入，返回 Promise', - version: '', - type: '({ file, options }) => Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforeImportMethod', - desc: '该方法会在导入之前触发', - version: '', - type: '({ options }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'afterImportMethod', - desc: '该方法会在导入之后触发', - version: '', - type: '({ options }) => viod', - enum: '', - defVal: '', - list: [] - } -] - -const printAPI = exportDataAPI.filter(item => !['filename', 'type', 'types', 'download', 'message', 'remote', 'sheetMethod', 'exportMethod', 'beforeExportMethod', 'afterExportMethod'].includes(item.name)).concat([ - { - name: 'content', - desc: '自定义打印的内容', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforePrintMethod', - desc: '该函数会在打印之前触发，可以通过返回自定义打印的内容', - version: '', - type: '({ content, options }) => string', - enum: '', - defVal: '', - list: [] - } -]) - -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'id', - descKey: 'app.api.table.desc.id', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'data', - descKey: 'app.api.table.desc.data', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'height', - descKey: 'app.api.table.desc.height', - version: '', - type: 'number | string', - enum: 'auto, %, px', - defVal: '', - list: [] - }, - { - name: 'max-height', - descKey: 'app.api.table.desc.maxHeight', - version: '', - type: 'number | string', - enum: '%, px', - defVal: '', - list: [] - }, - { - name: 'auto-resize', - descKey: 'app.api.table.desc.autoResize', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'sync-resize', - descKey: 'app.api.table.desc.syncResize', - version: '', - type: 'boolean | string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'resizable', - abandoned: true, - descKey: 'app.api.table.desc.resizable', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.table.resizable', - list: [] - }, - { - name: 'stripe', - descKey: 'app.api.table.desc.stripe', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.table.stripe', - list: [] - }, - { - name: 'border', - descKey: 'app.api.table.desc.border', - version: '', - type: 'boolean | string', - enum: 'default（默认）, full（完整边框）, outer（外边框）, inner（内边框）, none（无边框）', - defVal: '默认 false，继承 setup.table.border', - list: [] - }, - { - name: 'round', - descKey: 'app.api.table.desc.round', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.table.round', - list: [] - }, - { - name: 'size', - descKey: 'app.api.table.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - // { - // name: 'fit', - // descKey: 'app.api.table.desc.fit', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: 'true', - // list: [] - // }, - { - name: 'loading', - descKey: 'app.api.table.desc.loading', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'align', - descKey: 'app.api.table.desc.align', - version: '', - type: 'string', - enum: 'left（左对齐）, center（居中对齐）, right（右对齐）', - defVal: 'left', - list: [] - }, - { - name: 'header-align', - descKey: 'app.api.table.desc.headerAlign', - version: '', - type: 'string', - enum: 'left（左对齐）, center（居中对齐）, right（右对齐）', - defVal: '继承 align', - list: [] - }, - { - name: 'footer-align', - descKey: 'app.api.table.desc.footerAlign', - version: '', - type: 'string', - enum: 'left（左对齐）, center（居中对齐）, right（右对齐）', - defVal: '继承 align', - list: [] - }, - { - name: 'show-header', - descKey: 'app.api.table.desc.showHeader', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'highlight-current-row', - abandoned: true, - descKey: 'app.api.table.desc.highlightCurrentRow', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'highlight-hover-row', - abandoned: true, - descKey: 'app.api.table.desc.highlightHoverRow', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'highlight-current-column', - abandoned: true, - descKey: 'app.api.table.desc.highlightCurrentColumn', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'highlight-hover-column', - abandoned: true, - descKey: 'app.api.table.desc.highlightHoverColumn', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - // { - // name: 'highlight-cell', - // abandoned: true, - // descKey: 'app.api.table.desc.highlightCell', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: 'false', - // list: [] - // }, - { - name: 'row-class-name', - descKey: 'app.api.table.desc.rowClassName', - version: '', - type: 'string | (({ row, rowIndex, $rowIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'cell-class-name', - descKey: 'app.api.table.desc.cellClassName', - version: '', - type: 'string | (({ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'header-row-class-name', - descKey: 'app.api.table.desc.headerRowClassName', - version: '', - type: 'string | (({ $rowIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'header-cell-class-name', - descKey: 'app.api.table.desc.headerCellClassName', - version: '', - type: 'string | (({ $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'footer-row-class-name', - descKey: 'app.api.table.desc.footerRowClassName', - version: '', - type: 'string | (({ $rowIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'footer-cell-class-name', - descKey: 'app.api.table.desc.footerCellClassName', - version: '', - type: 'string | (({ $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'cell-style', - abandoned: true, - descKey: 'app.api.table.desc.cellStyle', - version: '', - type: 'any | (({ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'header-cell-style', - abandoned: true, - descKey: 'app.api.table.desc.headerCellStyle', - version: '', - type: 'any | (({ $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'footer-cell-style', - abandoned: true, - descKey: 'app.api.table.desc.footerCellStyle', - version: '', - type: 'any | (({ $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'row-style', - abandoned: true, - descKey: 'app.api.table.desc.rowStyle', - version: '', - type: 'any | (({ row, rowIndex, $rowIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'header-row-style', - abandoned: true, - descKey: 'app.api.table.desc.headerRowStyle', - version: '', - type: 'any | (({ $rowIndex, column, columnIndex, $columnIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'footer-row-style', - abandoned: true, - descKey: 'app.api.table.desc.footerRowStyle', - version: '', - type: 'any | (({ $rowIndex }) => any)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'show-footer', - descKey: 'app.api.table.desc.showFooter', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'footer-method', - descKey: 'app.api.table.desc.footerMethod', - version: '', - type: '({ columns, data }) => any[][]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'merge-cells', - descKey: 'app.api.table.desc.mergeCells', - version: '', - type: 'Array<{ row: number, col: number, rowspan: number, colspan: number }>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'merge-footer-items', - descKey: 'app.api.table.desc.mergeFooterItems', - version: '', - type: 'Array<{ row: number, col: number, rowspan: number, colspan: number }>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'span-method', - abandoned: true, - descKey: 'app.api.table.desc.spanMethod', - version: '', - type: '({ row, rowIndex, $rowIndex, _rowIndex, column, columnIndex, $columnIndex, _columnIndex, data }) => { rowspan: number, colspan: number}', - enum: '', - defVal: '{ rowspan: 1, colspan: 1}', - list: [] - }, - { - name: 'footer-span-method', - abandoned: true, - descKey: 'app.api.table.desc.footerSpanMethod', - version: '', - type: '({ $rowIndex, column, columnIndex, $columnIndex, _columnIndex, data }) => { rowspan: number, colspan: number}', - enum: '', - defVal: '{ rowspan: 1, colspan: 1}', - list: [] - }, - { - name: 'show-overflow', - descKey: 'app.api.table.desc.showOverflow', - version: '', - type: 'boolean | string', - enum: 'ellipsis（只显示省略号）,title（并且显示为原生 title）,tooltip（并且显示为 tooltip 提示）', - defVal: '', - list: [] - }, - { - name: 'show-header-overflow', - descKey: 'app.api.table.desc.showHeaderOverflow', - version: '', - type: 'boolean | string', - enum: 'ellipsis（只显示省略号）,title（并且显示为原生 title）,tooltip（并且显示为 tooltip 提示）', - defVal: '', - list: [] - }, - { - name: 'show-footer-overflow', - descKey: 'app.api.table.desc.showFooterOverflow', - version: '', - type: 'boolean | string', - enum: 'ellipsis（只显示省略号）,title（并且显示为原生 title）,tooltip（并且显示为 tooltip 提示）', - defVal: '', - list: [] - }, - { - name: 'column-key', - descKey: 'app.api.table.desc.columnKey', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'row-key', - descKey: 'app.api.table.desc.rowKey', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'row-id', - descKey: 'app.api.table.desc.rowId', - version: '', - type: 'string', - enum: '', - defVal: '默认 _XID，继承 setup.table.rowId', - list: [] - }, - { - name: 'keep-source', - descKey: 'app.api.table.desc.keepSource', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.table.keepSource', - list: [] - }, - // { - // name: 'z-index', - // abandoned: true, - // descKey: 'app.api.table.desc.zIndex', - // version: '', - // type: 'number', - // enum: '', - // defVal: '继承 setup.table.zIndex', - // list: [] - // }, - { - name: 'column-config', - desc: '列配置信息', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.columnConfig', - list: [ - { - name: 'isCurrent', - desc: '当鼠标点击列头时，是否要高亮当前列', - version: '4.1.5', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isHover', - desc: '当鼠标移到列头时，是否要高亮当前头', - version: '4.1.5', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'resizable', - desc: '每一列是否启用列宽调整', - version: '', - type: 'boolean', - enum: 'false', - defVal: '', - list: [] - }, - { - name: 'width', - desc: '每一列的宽度', - version: '', - type: 'number, string', - enum: 'auto, px, %', - defVal: '', - list: [] - }, - { - name: 'minWidth', - desc: '每一列的最小宽度', - version: '', - type: 'number, string', - enum: 'auto, px, %', - defVal: '', - list: [] - } - ] - }, - { - name: 'row-config', - desc: '行配置信息', - version: '4.1.1', - type: 'any', - enum: '', - defVal: '继承 setup.table.rowConfig', - list: [ - { - name: 'isCurrent', - desc: '当鼠标点击行时，是否要高亮当前行', - version: '4.1.5', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isHover', - desc: '当鼠标移到行时，是否要高亮当前行', - version: '4.1.5', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'height', - desc: '只对 show-overflow 有效，每一行的高度', - version: '', - type: 'number', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'resizable-config', - descKey: 'app.api.table.desc.resizableConfig', - version: '', - type: 'Object', - enum: '', - defVal: '继承 setup.table.resizableConfig', - list: [ - { - name: 'minWidth', - desc: '列宽拖动的最小宽度', - version: '', - type: 'number | string | (({ $table, column, columnIndex, cell }) => number | string)', - enum: '', - defVal: 'auto', - list: [] - } - ] - }, - { - name: 'seq-config', - descKey: 'app.api.table.desc.seqConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.seqConfig', - list: [ - { - name: 'startIndex', - desc: '设置序号的起始值', - version: '', - type: 'number', - enum: '', - defVal: '0', - list: [] - }, - { - name: 'seqMethod', - desc: '自定义序号的方法，返回处理后的值', - version: '', - type: '({ row, rowIndex, column, columnIndex }) => number', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'sort-config', - descKey: 'app.api.table.desc.sortConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.sortConfig', - list: [ - { - name: 'defaultSort', - desc: '默认排序（只会在初始化时被触发一次）', - version: '', - type: 'any | any[]', - enum: '', - defVal: '', - list: [ - { - name: 'field', - desc: '列字段名', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'order', - desc: '排序方式', - version: '', - type: 'string', - enum: 'asc（升序）,desc（降序）, null', - defVal: '', - list: [] - } - ] - }, - { - name: 'orders', - desc: '自定义轮转顺序', - version: '', - type: 'string[]', - enum: 'asc, desc, null', - defVal: '[\'asc\', \'desc\', \'null\']', - list: [] - }, - { - name: 'sortMethod', - desc: '全局排序方法，当触发排序时会调用该函数，返回排序后的列表', - version: '', - type: '({ data, column, property, order }) => any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'multiple', - desc: '是否启用多列组合筛选', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'remote', - desc: '所有列是否使用服务端排序，如果设置为 true 则不会对数据进行处理', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'trigger', - desc: '触发方式（注：当多种功能重叠时，会同时触发）', - version: '', - type: 'string', - enum: 'default（点击按钮触发）, cell（点击表头触发）', - defVal: 'default', - list: [] - }, - { - name: 'showIcon', - desc: '是否显示列头排序图标', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'iconAsc', - desc: '自定义升序的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconDesc', - desc: '自定义降序的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'filter-config', - descKey: 'app.api.table.desc.filterConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.filterConfig', - list: [ - { - name: 'remote', - desc: '所有列是否使用服务端筛选，如果设置为 true 则不会对数据进行处理', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'filterMethod', - desc: '全局筛选方法，当触发筛选时会调用该函数，返回是否有效', - version: '', - type: '({ options, values, cellValue, row, column }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'showIcon', - desc: '是否显示列头筛选图标', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'iconNone', - desc: '自定义无条件时显示的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconMatch', - desc: '自定义带条件时显示的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'export-config', - descKey: 'app.api.table.desc.exportConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.exportConfig', - list: XEUtils.clone(exportDataAPI, true) - }, - { - name: 'import-config', - descKey: 'app.api.table.desc.importConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.importConfig', - list: XEUtils.clone(importDataAPI, true) - }, - { - name: 'print-config', - descKey: 'app.api.table.desc.printConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.printConfig', - list: XEUtils.clone(printAPI, true) - }, - { - name: 'radio-config', - descKey: 'app.api.table.desc.radioConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.radioConfig', - list: [ - { - name: 'strict', - desc: '严格模式，选中后不能取消', - version: '4.0.22', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'reserve', - desc: '是否保留勾选状态，例如：数据被刷新或者分页之后还保留之前选中的状态（需要有 row-id）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'labelField', - desc: '单选框显示的字段名，可以直接显示在单选框中', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'checkRowKey', - desc: '默认选中指定行（只会在初始化时被触发一次，需要有 row-id）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visibleMethod', - desc: '是否允许勾选的方法，该方法，的返回值用来决定这一行的 radio 是否显示', - version: '4.1.3', - type: '({ row }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'checkMethod', - desc: '是否允许选中的方法，该方法，的返回值用来决定这一行的 radio 是否可以选中', - version: '', - type: '({ row }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'trigger', - desc: '触发方式（注：当多种功能重叠时，会同时触发）', - version: '', - type: 'string', - enum: 'default（默认）, cell（点击单元格触发）, row（点击行触发）', - defVal: 'default', - list: [] - }, - { - name: 'highlight', - desc: '高亮选中行', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - } - ] - }, - { - name: 'checkbox-config', - descKey: 'app.api.table.desc.checkboxConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.checkboxConfig', - list: [ - { - name: 'labelField', - desc: '复选框显示的字段名，可以直接显示在复选框中', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'checkField', - desc: '绑定选中属性，如果设置了该属性渲染速度更快（建议数据量大时使用，行数据中必须存在该字段，否则无效）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'showHeader', - desc: '是否显示全选按钮（如果 checkStrictly=true 则默认为 false）', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'checkAll', - desc: '默认勾选所有（只会在初始化时被触发一次）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'checkRowKeys', - desc: '默认勾选指定行（只会在初始化时被触发一次，需要有 row-id）', - version: '', - type: 'string[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'checkStrictly', - desc: '是否严格的遵循父子不互相关联的做法', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'strict', - desc: '严格模式，当数据为空或全部禁用时，列头的复选框为禁用状态', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'visibleMethod', - desc: '是否允许勾选的方法，该方法，的返回值用来决定这一行的 checkbox 是否显示', - version: '4.1.3', - type: '({ row }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'checkMethod', - desc: '是否允许勾选的方法，该方法，的返回值用来决定这一行的 checkbox 是否可以勾选', - version: '', - type: '({ row }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'trigger', - desc: '触发方式（注：当多种功能重叠时，会同时触发）', - version: '', - type: 'string', - enum: 'default（默认）, cell（点击单元格触发）, row（点击行触发）', - defVal: 'default', - list: [] - }, - { - name: 'highlight', - desc: '高亮勾选行', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'reserve', - desc: '是否保留勾选状态，对于某些场景可能会用到，比如数据被刷新之后还保留之前选中的状态（需要有 row-id）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'range', - desc: '开启复选框范围选择功能（启用后通过鼠标在复选框的列内滑动选中或取消指定行）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - } - ] - }, - { - name: 'tooltip-config', - descKey: 'app.api.table.desc.tooltipConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.tooltipConfig', - list: [ - { - name: 'showAll', - desc: '所有单元格开启 tooltip 显示', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'theme', - desc: 'tooltip 的主题颜色', - version: '', - type: 'string', - enum: 'dark,light', - defVal: 'dark', - list: [] - }, - { - name: 'enterable', - desc: '鼠标是否可进入到 tooltip 中', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'leaveDelay', - desc: '鼠标移出后延时多少才隐藏 tooltip', - version: '', - type: 'number', - enum: '', - defVal: '300', - list: [] - }, - { - name: 'contentMethod', - desc: '该方法可以通过返回值来重写默认的提示内容，可以返回 null 使用默认的提示消息，可以返回空内容去掉指定单元格的提示消息', - version: '', - type: '({ items?, row?, rowIndex?, $rowIndex, column, columnIndex, $columnIndex, type, cell, $event }) => string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'expand-config', - descKey: 'app.api.table.desc.expandConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.expandConfig', - list: [ - { - name: 'labelField', - desc: '展开列显示的字段名，可以直接显示在单元格中', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'expandAll', - desc: '默认展开所有行（只会在初始化时被触发一次）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'expandRowKeys', - desc: '默认展开指定行（只会在初始化时被触发一次，需要有 row-id）', - version: '', - type: 'string[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'accordion', - desc: '每次只能展开一行', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'trigger', - desc: '触发方式（注：当多种功能重叠时，会同时触发）', - version: '', - type: 'string', - enum: 'default（点击按钮触发）, cell（点击单元格触发）, row（点击行触发）', - defVal: 'default', - list: [] - }, - { - name: 'lazy', - desc: '是否使用懒加载', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'loadMethod', - desc: '该方法用于异步加载展开后的内容', - version: '', - type: '({ row, rowIndex?, $rowIndex? }) => Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'toggleMethod', - desc: '该方法在展开或关闭触发之前调用，可以通过返回值来决定是否允许继续执行', - version: '', - type: '({ expanded, column, columnIndex, row, rowIndex? }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visibleMethod', - desc: '该函数的返回值用来决定是否允许显示展开按钮', - version: '', - type: '({ column, columnIndex, row, rowIndex? }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'reserve', - desc: '是否保留展开状态，对于某些场景可能会用到，比如数据被刷新之后还保留之前展开的状态（需要有 row-id）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'showIcon', - desc: '是否显示图标按钮', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'iconOpen', - desc: '自定义展开后显示的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconClose', - desc: '自定义收起后显示的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconLoaded', - desc: '自定义懒加载中显示的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'tree-config', - descKey: 'app.api.table.desc.treeConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.treeConfig', - list: [ - { - name: 'transform', - desc: '自动将列表转为树结构', - version: '4.1.3', - type: 'string', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'rowField', - desc: '树节点的字段名', - version: '4.1.3', - type: 'string', - enum: '', - defVal: 'id', - list: [] - }, - { - name: 'parentField', - desc: '树父节点的字段名', - version: '4.1.3', - type: 'string', - enum: '', - defVal: 'parentId', - list: [] - }, - { - name: 'children', - desc: '树子节点的字段名', - version: '', - type: 'string', - enum: '', - defVal: 'children', - list: [] - }, - { - name: 'indent', - desc: '树节点的缩进', - version: '', - type: 'number', - enum: '', - defVal: '20', - list: [] - }, - { - name: 'line', - desc: '树节点的连接线（启用连接线会降低渲染性能）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'expandAll', - desc: '默认展开所有子孙树节点（只会在初始化时被触发一次）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'expandRowKeys', - desc: '默认展开指定树节点（只会在初始化时被触发一次，需要有 row-id）', - version: '', - type: 'string[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'accordion', - desc: '对于同一级的节点，每次只能展开一个', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'trigger', - desc: '触发方式（注：当多种功能重叠时，会同时触发）', - version: '', - type: 'string', - enum: 'default（点击按钮触发）, cell（点击单元格触发）, row（点击行触发）', - defVal: 'default', - list: [] - }, - { - name: 'lazy', - desc: '是否使用懒加载（启用后只有指定 hasChild 的节点才允许被点击）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'hasChild', - desc: '只对 lazy 启用后有效，标识是否存在子节点，从而控制是否允许被点击', - version: '', - type: 'string', - enum: '', - defVal: 'hasChild', - list: [] - }, - { - name: 'loadMethod', - desc: '该方法用于异步加载子节点', - version: '', - type: '({ row }) => Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'toggleMethod', - desc: '该方法在展开或关闭触发之前调用，可以通过返回值来决定是否允许继续执行', - version: '', - type: '({ expanded, row, column, columnIndex }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'reserve', - desc: '是否保留展开状态，对于某些场景可能会用到，比如数据被刷新之后还保留之前展开的状态（需要有 row-id）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'showIcon', - desc: '是否显示图标按钮', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'iconOpen', - desc: '自定义展开后显示的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconClose', - desc: '自定义收起后显示的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconLoaded', - desc: '自定义懒加载中显示的图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'menu-config', - descKey: 'app.api.table.desc.menuConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.menuConfig', - list: [ - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'header', - desc: '表头的右键菜单', - version: '', - type: 'any', - enum: '', - defVal: '', - list: XEUtils.clone(contextMenuAPI, true) - }, - { - name: 'body', - desc: '内容的右键菜单', - version: '', - type: 'any', - enum: '', - defVal: '', - list: XEUtils.clone(contextMenuAPI, true) - }, - { - name: 'footer', - desc: '表尾的右键菜单', - version: '', - type: 'any', - enum: '', - defVal: '', - list: XEUtils.clone(contextMenuAPI, true) - }, - { - name: 'trigger', - desc: '触发方式', - version: '', - type: 'string', - enum: 'default（默认右键表格触发）, cell（右键单元格触发）', - defVal: 'default', - list: [] - }, - { - name: 'visibleMethod', - desc: '该函数的返回值用来决定是否允许显示右键菜单（对于需要对菜单进行权限控制时可能会用到）', - version: '', - type: '({ type, options, columns, row?, rowIndex?, column?, columnIndex? }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'className', - desc: '菜单面板的 className', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'clip-config', - descKey: 'app.api.table.desc.clipConfig', - version: 'pro', - type: 'any', - enum: '', - defVal: '继承 setup.table.clipConfig', - list: [ - { - name: 'isCopy', - desc: '是否启用复制功能', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'isCut', - desc: '是否启用剪贴功能', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'isPaste', - desc: '是否启用粘贴功能', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'isFillPaste', - desc: '是否填充粘贴，如果启用了，当被选取的粘贴单元格与粘贴单元格的行与列数量不匹配时，会将内容强制粘贴所选的单元格', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isRowIncrement', - desc: '是否启用行自增，当粘贴的行数超出表格时自动插入新行', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isColumnIncrement', - desc: '是否启用列自增，当粘贴的列数超出表格时自动插入新列（需要注意自增的列自字段是否定义，否则将无法响应）', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'copyMethod', - desc: '重写单元格复制取值的方法，将单元格复制到剪贴板', - version: 'pro', - type: '({ isCut, row, column, cellValue }) => string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforeCopyMethod', - desc: '自定义单元格复制取值之前的方法，可以通过返回 false 阻止复制行为', - version: 'pro', - type: '({ isCut, targetAreas }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'afterCopyMethod', - desc: '自定义单元格复制到剪贴板之后的方法', - version: 'pro', - type: '({ isCut, targetAreas }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'cutMethod', - desc: '重写单元格剪贴值清除的方法，将剪贴单元格的值清除', - version: 'pro', - type: '({ row, column, cellValue }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforeCutMethod', - desc: '自定义单元格剪贴值清除之前的方法，可以通过返回 false 阻止清除行为', - version: 'pro', - type: '({ cutAreas, currentAreas }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'afterCutMethod', - desc: '自定义单元格剪贴值清除之后的方法', - version: 'pro', - type: '({ cutAreas, currentAreas }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'pasteMethod', - desc: '重写单元格粘贴赋值的方法，从剪贴板赋值到单元格', - version: 'pro', - type: '({ isCut, row, column, cellValue }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforePasteMethod', - desc: '自定义单元格粘贴赋值之前的方法，可以通过返回 false 阻止复制行为', - version: 'pro', - type: '({ isCut, cutAreas, currentAreas, targetAreas, cellValues, pasteCells }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'afterPasteMethod', - desc: '自定义单元格粘贴赋值之后的方法', - version: 'pro', - type: '({ isCut, cutAreas, currentAreas, targetAreas, cellValues, pasteCells, insertRows, insertColumns }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'createRowsMethod', - desc: '只对 isRowIncrement 有效，自定义创建自增行数据的方法', - version: 'pro', - type: '({ isCut, cutAreas, currentAreas, targetAreas, cellValues, pasteCells, insertRows }) => any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'createColumnsMethod', - desc: '只对 isColumnIncrement 有效，自定义创建自增列配置的方法', - version: 'pro', - type: '({ isCut, cutAreas, currentAreas, targetAreas, cellValues, pasteCells, insertColumns }) => any[]', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'fnr-config', - descKey: 'app.api.table.desc.fnrConfig', - version: 'pro', - type: 'any', - enum: '', - defVal: '继承 setup.table.fnrConfig', - list: [ - { - name: 'isFind', - desc: '是否启用查找功能', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'findMethod', - desc: '自定义单元格查找方法', - version: 'pro', - type: '({ cellValue, isWhole, isRE, isSensitive, findValue: findCellValue, findRE }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforeFindMethod', - desc: '自定义单元格查找之前的方法，可以通过返回 false 阻止查找行为', - version: 'pro', - type: '({ isAll, findValue }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'afterFindMethod', - desc: '自定义单元格查找之后的方法', - version: 'pro', - type: '({ isAll, findValue, result }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'isReplace', - desc: '是否启用替换功能', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'replaceMethod', - desc: '自定义单元格替换方法', - version: 'pro', - type: '({ row, column, cellValue }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforeReplaceMethod', - desc: '自定义单元格替换之前的方法，可以通过返回 false 阻止替换行为', - version: 'pro', - type: '({ isAll, findValue, replaceValue }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'afterReplaceMethod', - desc: '自定义单元格替换之后的方法', - version: 'pro', - type: '({ isAll, findValue, replaceValue, result }) => void', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'mouse-config', - descKey: 'app.api.table.desc.mouseConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.mouseConfig', - list: [ - { - name: 'selected', - desc: '开启单元格选中功能（只对 edit-config.mode=cell 有效）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'area', - desc: '如果功能被支持，则开启鼠标左键单元格区域选取功能，非连续的区域，同时按住 鼠标左键 + Ctrl 键，用鼠标逐一选取', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'extension', - desc: '只对 area 启用后有效，是否开启区域扩展选取功能，开启后可以通过鼠标左键按住区域内右下角扩展按钮，将区域横向或纵向扩大（支持扩大区域并复制值）', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - } - ] - }, - { - name: 'area-config', - descKey: 'app.api.table.desc.areaConfig', - version: 'pro', - type: 'any', - enum: '', - defVal: '继承 setup.table.areaConfig', - list: [ - { - name: 'selectCellByHeader', - desc: '只对 mouse-config.area 启用后有效，点击列头是否选取当前列的所有单元格', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'extendByCopy', - desc: '只对 mouse-config.extension 启用后有效，将被选取区域的值复制到扩展区域中（同时按住 shift 键可取消值复制功能）', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'extendByCalc', - desc: '只对 mouse-config.extension 启用后有效，当选取大于两行或两列时，自动识别最近两行或两列数据运算规则进行计算（同时按住 ctrl 键可取消值自动识别数字功能）', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'extendCalcMethod', - desc: '只对 extendByCalc 启用后有效，重写单元格扩展区域计算值的方法', - version: 'pro', - type: '({ rows, cols, targetValues, targetRows, targetCols, extendRows, extendCols, direction }) => any[][]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'extendSetMethod', - desc: '只对 extendByCopy | extendByCalc 启用后有效，重写单元格扩展区域赋值的方法', - version: 'pro', - type: '({ cellValue, row, column, rows, cols, targetValues, targetRows, targetCols, extendRows, extendCols, direction }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'beforeExtendSetMethod', - desc: '只对 extendByCopy | extendByCalc 启用后有效，自定义单元格扩展区域赋值之前的方法，可以通过返回 false 阻止扩展区域赋值行为', - version: 'pro', - type: '({ rows, cols, targetValues, targetRows, targetCols, extendRows, extendCols, direction }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'afterExtendSetMethod', - desc: '只对 extendByCopy | extendByCalc 启用后有效，自定义单元格扩展区域赋值之后的方法', - version: 'pro', - type: '(params: { rows, cols, targetValues, targetRows, targetCols, extendValues, extendRows, extendCols, direction }) => void', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'keyboard-config', - descKey: 'app.api.table.desc.keyboardConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.keyboardConfig', - list: [ - { - name: 'isArrow', - desc: '开启方向键功能', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isDel', - desc: '开启删除键功能', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isEnter', - desc: '开启回车键功能', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isTab', - desc: '开启 Tab 键功能', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isEdit', - desc: '开启任意键进入编辑（功能键除外）', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isMerge', - desc: '如果功能被支持，用于 mouse-config.area，开启合并和取消合并功能', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isClip', - desc: '如果功能被支持，用于 mouse-config.area，开启复制、剪贴、粘贴功能', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isFNR', - desc: '如果功能被支持，用于 mouse-config.area，开启查找和替换功能', - version: 'pro', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isChecked', - desc: '如果功能被支持，用于 column.type=checkbox|radio，开启空格键切换复选框或单选框状态功能', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'enterToTab', - desc: '是否将回车键行为改成 Tab 键行为', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'delMethod', - desc: '只对 isDel=true 有效，用于删除键清空单元格内容方法', - version: '', - type: '({ row, rowIndex, column, columnIndex }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'backMethod', - desc: '只对 isDel=true 有效，用于重写回退键清空单元格内容并激活为编辑状态方法', - version: '', - type: '({ row, rowIndex, column, columnIndex }) => void', - enum: '', - defVal: '', - list: [] - }, - { - name: 'editMethod', - desc: '只对 isEdit=true 有效，用于重写编辑单元格方法', - version: '', - type: '({ row, rowIndex, column, columnIndex }) => void', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'edit-config', - descKey: 'app.api.table.desc.editConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.editConfig', - list: [ - { - name: 'trigger', - desc: '触发方式', - version: '', - type: 'string', - enum: 'manual（手动触发方式，只能用于 mode=row）,click（点击触发编辑）,dblclick（双击触发编辑）', - defVal: 'click', - list: [] - }, - { - name: 'enabled', - desc: '是否启用', - version: '4.0.17', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'mode', - desc: '编辑模式', - version: '', - type: 'string', - enum: 'cell（单元格编辑模式）,row（行编辑模式）', - defVal: 'cell', - list: [] - }, - { - name: 'showIcon', - desc: '是否显示列头编辑图标', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'showStatus', - desc: '只对 keep-source 开启有效，是否显示单元格新增与修改状态', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'showUpdateStatus', - desc: '只对 keep-source 开启有效，是否显示单元格修改状态', - version: '4.0.1', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'showInsertStatus', - desc: '只对 keep-source 开启有效，是否显示单元格新增状态', - version: '4.0.1', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'showAsterisk', - desc: '是否显示必填字段的红色星号', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'autoClear', - desc: '当点击非编辑列之后，是否自动清除单元格的激活状态', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'activeMethod', - desc: '该方法的返回值用来决定该单元格是否允许编辑', - version: '', - type: '({ row, rowIndex, column, columnIndex }) => boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'icon', - desc: '自定义可编辑列的状态图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'valid-config', - descKey: 'app.api.table.desc.validConfig', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'autoPos', - desc: '是否自动定位到校验不通过的单元格', - version: '', - type: 'bolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'showMessage', - desc: '是否显示错误显示', - version: '', - type: 'bolean', - enum: '', - defVal: 'true', - list: [] - }, - // { - // name: 'message', - // abandoned: true, - // desc: '校验提示框的方式', - // version: '', - // type: 'string', - // enum: 'default（如果不设置高度，则默认第一行使用 tooltip，之后使用 inline）, none（关闭提示）, inline（强制使用内联的提示）, tooltip（强制使用 tooltip 提示）', - // defVal: 'default', - // list: [] - // }, - { - name: 'maxWidth', - abandoned: true, - desc: '校验提示框的最大宽度（对于某些特殊场景可能会用到）', - version: '', - type: 'string | number', - enum: '', - defVal: '320', - list: [] - } - ] - }, - { - name: 'edit-rules', - descKey: 'app.api.table.desc.editRules', - version: '', - type: '{ [field: string]: VxeTableDefines.ValidatorRule[] }', - enum: '', - defVal: '', - list: [ - { - name: 'required', - desc: '是否必填', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'min', - desc: '校验值最小长度（如果 type=number 则比较值大小）', - version: '', - type: 'number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'max', - desc: '校验值最大长度（如果 type=number 则比较值大小）', - version: '', - type: 'number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - desc: '数据校验的类型', - version: '', - type: 'string', - enum: 'number, string, array', - defVal: 'string', - list: [] - }, - { - name: 'pattern', - desc: '正则校验', - version: '', - type: 'RegExp | string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'validator', - desc: '自定义校验方法，返回一个 Error 或者 Promise', - version: '', - type: '({ cellValue, rule, rules, row, rowIndex，column, columnIndex }) => Error | Promise', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'content', - // desc: '校验提示内容（支持开启国际化）', - // version: '4.1.1', - // type: 'string', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'message', - desc: '校验提示内容（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'trigger', - abandoned: true, - desc: '触发校验方式（如果为空，则正常校验；如果为manual，则永远不会被自动触发；除非明确知道自定义目标的触发方式，否则设置后将导致不会被触发）', - version: '', - type: 'string', - enum: 'blur,change,manual', - defVal: '', - list: [] - }, - { - name: 'maxWidth', - abandoned: true, - desc: '提示框的最大宽度（对于某些特殊场景可能会用到）', - version: '', - type: 'number', - enum: '', - defVal: '320', - list: [] - } - ] - }, - { - name: 'empty-text', - descKey: 'app.api.table.desc.emptyText', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'empty-render', - descKey: 'app.api.table.desc.emptyRender', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.emptyRender', - list: [ - { - name: 'name', - desc: '渲染器名称', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - // }, - // { - // name: 'props', - // desc: '渲染的参数（请查看目标渲染的 Props）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'attrs', - // desc: '渲染的属性（请查看目标渲染的 Attribute）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'events', - // desc: '渲染组件的事件（请查看目标渲染的 Events）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{}, ...[目标渲染的 arguments]', - // list: [] - // }, - // { - // name: 'nativeEvents', - // desc: '渲染组件的原生事件（请查看目标渲染的 Events）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{}, ...[目标渲染的 arguments]', - // list: [] - } - ] - }, - { - name: 'custom-config', - descKey: 'app.api.table.desc.customConfig', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.customConfig', - list: [ - { - name: 'storage', - desc: '是否启用 localStorage 本地保存，会将列操作状态保留在本地（需要有 id）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'visible', - desc: '启用显示/隐藏列状态', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'resizable', - desc: '启用列宽状态', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'checkMethod', - desc: '自定义列是否允许列选中的方法，该方法的返回值用来决定这一列的 checkbox 是否可以选中', - version: '', - type: '({ column }) => boolean', - enum: '', - defVal: '', - list: [] - } - ] - }, - // { - // name: 'animat', - // abandoned: true, - // desc: '表格动画效果开关（关闭后视觉效果更快）', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: '默认 true，继承 setup.table.animat', - // list: [] - // }, - // { - // name: 'cloak', - // abandoned: true, - // desc: '用于低性能的浏览器，可以设置为 true 来避免初始化渲染时的闪动', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: '默认 false，继承 setup.table.cloak', - // list: [] - // }, - // { - // name: 'delay-hover', - // abandoned: true, - // desc: '当表格发生拖动、滚动...等行为时，至少多少毫秒之后才允许触发 hover 事件', - // version: '', - // type: 'number', - // enum: '', - // defVal: '默认 250，继承 setup.table.delayHover', - // list: [] - // }, - { - name: 'scroll-x', - desc: '横向虚拟滚动配置（不支持展开行）', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.scrollX', - list: [ - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'gt', - desc: '指定大于指定列时自动启动横向虚拟滚动，如果为 0 则总是启用，如果为 -1 则关闭', - version: '', - type: 'number', - enum: '', - defVal: '60', - list: [] - }, - { - name: 'oSize', - desc: '指定每次渲染的数据偏移量，偏移量越大渲染次数就越少，但每次渲染耗时就越久（对于低性能浏览器可以设置大一点，减低渲染次数）', - version: '', - type: 'number', - enum: '', - defVal: '0', - list: [] - } - ] - }, - { - name: 'scroll-y', - desc: '纵向虚拟滚动配置（不支持展开行）', - version: '', - type: 'any', - enum: '', - defVal: '继承 setup.table.scrollY', - list: [ - { - name: 'enabled', - desc: '是否启用', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'mode', - desc: '滚动模式', - version: '4.0.9', - type: 'string', - enum: 'default,wheel', - defVal: 'default', - list: [] - }, - { - name: 'gt', - desc: '指定大于指定行时自动启动纵向虚拟滚动，如果为 0 则总是启用，如果为 -1 则关闭（注：启用纵向虚拟滚动之后将不能支持动态行高）', - version: '', - type: 'number', - enum: '', - defVal: '100', - list: [] - }, - { - name: 'oSize', - desc: '指定每次渲染的数据偏移量，偏移量越大渲染次数就越少，但每次渲染耗时就越久（对于低性能浏览器可以设置大一点，减低渲染次数）', - version: '', - type: 'number', - enum: '', - defVal: '0', - list: [] - // }, - // { - // name: 'rHeight', - // desc: '当启用虚拟滚动后，该参数用于设置每一行的固定高度', - // version: '4.0.27', - // type: 'number', - // enum: '', - // defVal: '', - // list: [] - } - // { - // name: 'adaptive', - // desc: '自动适配最优的渲染方式', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: 'true', - // list: [] - // } - ] - // }, - // { - // name: 'rHeights', - // desc: '重写表格默认高度,必须和 scss 中的变量一致（用于重写表格默认行高的场景，谨慎使用，99%场景不需要更改）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [ - // { - // name: 'default', - // desc: '表格 default size', - // version: '', - // type: 'number', - // enum: '', - // defVal: '48', - // list: [] - // }, - // { - // name: 'medium', - // desc: '表格 medium size', - // version: '', - // type: 'number', - // enum: '', - // defVal: '44', - // list: [] - // }, - // { - // name: 'small', - // desc: '表格 small size', - // version: '', - // type: 'number', - // enum: '', - // defVal: '40', - // list: [] - // }, - // { - // name: 'mini', - // desc: '表格 mini size', - // version: '', - // type: 'number', - // enum: '', - // defVal: '36', - // list: [] - // } - // ] - }, - { - name: 'params', - descKey: 'app.api.table.desc.params', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'empty', - descKey: 'app.api.table.desc.empty', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'keydown', - desc: '当表格被激活且键盘被按下时会触发的事件', - version: '', - type: '', - enum: '', - defVal: '{ $event }', - list: [] - }, - { - name: 'current-change', - descKey: 'app.api.table.desc.currentChange', - version: '', - type: '', - enum: '', - defVal: '{ newValue, oldValue, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'radio-change', - descKey: 'app.api.table.desc.radioChange', - version: '', - type: '', - enum: '', - defVal: '{ newValue, oldValue, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'checkbox-change', - descKey: 'app.api.table.desc.checkboxChange', - version: '', - type: '', - enum: '', - defVal: '{ records, reserves, indeterminates, checked, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'checkbox-all', - descKey: 'app.api.table.desc.checkboxAll', - version: '', - type: '', - enum: '', - defVal: '{ records, reserves, indeterminates, checked, $event }', - list: [] - }, - { - name: 'checkbox-range-start', - desc: '只对 checkbox-config.range 有效，当鼠标范围选择开始时会触发的事件', - version: '', - type: '', - enum: '', - defVal: '{ records, reserves, $event }', - list: [] - }, - { - name: 'checkbox-range-change', - desc: '只对 checkbox-config.range 有效，当鼠标范围选择内的行数发生变化时会触发的事件', - version: '', - type: '', - enum: '', - defVal: '{ records, reserves, $event }', - list: [] - }, - { - name: 'checkbox-range-end', - desc: '只对 checkbox-config.range 有效，当鼠标范围选择结束时会触发的事件', - version: '', - type: '', - enum: '', - defVal: '{ records, reserves, $event }', - list: [] - }, - { - name: 'cell-click', - descKey: 'app.api.table.desc.cellClick', - version: '', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, triggerRadio, triggerCheckbox, triggerTreeNode, triggerExpandNode, $event }', - list: [] - }, - { - name: 'cell-dblclick', - descKey: 'app.api.table.desc.cellDblclick', - version: '', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'cell-menu', - descKey: 'app.api.table.desc.cellMenu', - version: '', - type: '', - enum: '', - defVal: '{ type, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'cell-mouseenter', - descKey: 'app.api.table.desc.cellMouseenter', - version: '', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'cell-mouseleave', - descKey: 'app.api.table.desc.cellMouseleave', - version: '', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'header-cell-click', - descKey: 'app.api.table.desc.headerCellClick', - version: '', - type: '', - enum: '', - defVal: '{ $rowIndex, column, columnIndex, $columnIndex, triggerResizable, triggerSort, triggerFilter, $event }', - list: [] - }, - { - name: 'header-cell-dblclick', - descKey: 'app.api.table.desc.headerCellDblclick', - version: '', - type: '', - enum: '', - defVal: '{ $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'header-cell-menu', - descKey: 'app.api.table.desc.headerCellMenu', - version: '', - type: '', - enum: '', - defVal: '{ type, column, columnIndex, $event }', - list: [] - }, - { - name: 'footer-cell-click', - descKey: 'app.api.table.desc.footerCellClick', - version: '', - type: '', - enum: '', - defVal: '{ items, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'footer-cell-dblclick', - descKey: 'app.api.table.desc.footerCellDblclick', - version: '', - type: '', - enum: '', - defVal: '{ items, $rowIndex, column, columnIndex, $columnIndex, $event}', - list: [] - }, - { - name: 'footer-cell-menu', - descKey: 'app.api.table.desc.footerCellMenu', - version: '', - type: '', - enum: '', - defVal: '{ type, column, columnIndex, $event}', - list: [] - }, - { - name: 'clear-merge', - desc: '当用户点击取消所有临时合并时会触发该事件', - version: '4.0.18', - type: '', - enum: '', - defVal: '{ mergeCells, mergeFooterItems, $event }', - list: [] - }, - { - name: 'sort-change', - descKey: 'app.api.table.desc.sortChange', - version: '', - type: '', - enum: '', - defVal: '{ column, property, order, sortBy, sortList, $event }', - list: [] - }, - { - name: 'clear-sort', - desc: '当用户点击清除所有排序时会触发该事件', - version: '4.0.18', - type: '', - enum: '', - defVal: '{ sortList, $event }', - list: [] - }, - { - name: 'filter-change', - descKey: 'app.api.table.desc.filterChange', - version: '', - type: '', - enum: '', - defVal: '{ column, property, values, datas, filterList, $event }', - list: [] - }, - { - name: 'filter-visible', - desc: '当筛选面板被触发时会触发该事件', - version: '4.1.0', - type: '', - enum: '', - defVal: '{ column, property, visible, filterList, $event }', - list: [] - }, - { - name: 'clear-filter', - desc: '当用户点击清除所有筛选条件时会触发该事件', - version: '4.0.18', - type: '', - enum: '', - defVal: '{ filterList, $event }', - list: [] - }, - { - name: 'resizable-change', - descKey: 'app.api.table.desc.resizableChange', - version: '', - type: '', - enum: '', - defVal: '{ $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'toggle-row-expand', - descKey: 'app.api.table.desc.toggleExpandChange', - version: '', - type: '', - enum: '', - defVal: '{ expanded, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'toggle-tree-expand', - descKey: 'app.api.table.desc.toggleTreeChange', - version: '', - type: '', - enum: '', - defVal: '{ expanded, row, column, columnIndex, $columnIndex, $event }', - list: [] - }, - { - name: 'menu-click', - descKey: 'app.api.table.desc.menuClick', - version: '', - type: '', - enum: '', - defVal: '{ menu, type, row, rowIndex, column, columnIndex, $event }', - list: [] - }, - { - name: 'cell-selected', - descKey: 'app.api.table.desc.cellSelected', - version: '', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }', - list: [] - }, - { - name: 'edit-closed', - descKey: 'app.api.table.desc.editClosed', - version: '', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }', - list: [] - }, - { - name: 'edit-actived', - descKey: 'app.api.table.desc.editActived', - version: '', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }', - list: [] - }, - { - name: 'edit-disabled', - descKey: 'app.api.table.desc.editDisabled', - version: '', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }', - list: [] - }, - { - name: 'valid-error', - descKey: 'app.api.table.desc.validError', - version: '', - type: '', - enum: '', - defVal: '{ rule, row, rowIndex, $rowIndex, column, columnIndex, $columnIndex }', - list: [] - }, - { - name: 'scroll', - descKey: 'app.api.table.desc.scroll', - version: '', - type: '', - enum: '', - defVal: '{ type, scrollTop, scrollLeft, bodyWidth, bodyHeight, isX, isY, $event }', - list: [] - }, - { - name: 'custom', - desc: '如果与工具栏关联，在自定义列按钮被手动点击后会触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ type, $event}', - list: [] - }, - { - name: 'open-fnr', - desc: '只对 keyboard-config.isFNR 配置时有效，在查找与替换弹框被打开时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ tab, $event}', - list: [] - }, - { - name: 'fnr-change', - desc: '只对 keyboard-config.isFNR 配置时有效，在查找与替换弹框的 Tab 页被切换时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ tab, $event}', - list: [] - }, - { - name: 'fnr-find', - desc: '只对 keyboard-config.isFNR 配置时有效，在点击查找时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ findValue, row, column, $event}', - list: [] - }, - { - name: 'fnr-find-all', - desc: '只对 keyboard-config.isFNR 配置时有效，在点击查找所有时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ findValue, result, $event}', - list: [] - }, - { - name: 'fnr-replace', - desc: '只对 keyboard-config.isFNR 配置时有效，在点击替换时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ findValue, replaceValue, row, column, $event}', - list: [] - }, - { - name: 'fnr-replace-all', - desc: '只对 keyboard-config.isFNR 配置时有效，在点击替换所有时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ findValue, replaceValue, result, $event}', - list: [] - }, - { - name: 'cell-area-copy', - desc: '只对 keyboard-config.isClip 配置时有效，在单元格被复制时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ status, targetAreas, cellValues, $event}', - list: [] - }, - { - name: 'cell-area-cut', - desc: '只对 keyboard-config.isClip 配置时有效，在单元格被剪贴时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ status, targetAreas, cellValues, $event}', - list: [] - }, - { - name: 'cell-area-paste', - desc: '只对 keyboard-config.isClip 配置时有效，在单元格被粘贴时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ status, targetAreas, $event}', - list: [] - }, - { - name: 'cell-area-merge', - desc: '只对 keyboard-config.isMerge 配置时有效，在单元格临时合并、取消时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ status, targetAreas, $event}', - list: [] - }, - { - name: 'clear-cell-area-merge', - desc: '只对 keyboard-config.isMerge 配置时有效，用户点击单元格取消时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ mergeCells, $event}', - list: [] - }, - { - name: 'header-cell-area-selection', - desc: '只对 area-config.selectCellByHeader 配置时有效，点击列头选取当前列的所有单元格时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, cell, targetRows, targetCols, $event}', - list: [] - }, - { - name: 'cell-area-selection-start', - desc: '只对 mouse-config.area 配置时有效，在单元格区域选取开始时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, cell, $event}', - list: [] - }, - { - name: 'cell-area-selection-end', - desc: '只对 mouse-config.area 配置时有效，在单元格区域选取结束时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ rows, cols, $event}', - list: [] - }, - { - name: 'cell-area-extension-start', - desc: '只对 mouse-config.extension 配置时有效，在单元格区域扩展开始时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, cell, targetRows, targetCols, $event}', - list: [] - }, - { - name: 'cell-area-extension-end', - desc: '只对 mouse-config.extension 配置时有效，在单元格区域扩展结束时会触发该事件', - version: 'pro', - type: '', - enum: '', - defVal: '{ rows, cols, targetRows, targetCols, $event}', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'loadData(data)', - desc: '加载数据（对于表格数据需要重载、局部递增场景下可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: 'data: array', - list: [] - }, - { - name: 'reloadData(data)', - desc: '加载数据并清除所有状态（对于表格数据需要重载、局部更新被修改的数据）', - version: '', - type: 'Promise', - enum: '', - defVal: 'data: array', - list: [] - }, - { - name: 'updateData()', - abandoned: true, - desc: '手动处理数据（对于手动更改了排序、筛选...等条件后需要重新处理数据时可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'syncData()', - // desc: '同步 data 数据；如果用了该方法，那么组件将不再记录增删改的状态，只能自行实现对应逻辑（对于某些特殊的场景，比如深层树节点元素发生变动时可能会用到）', - // version: '', - // type: 'Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'reloadRow(rows, record, field)', - desc: '局部加载行数据并恢复到初始状态，仅用于修改的数据，对新增的临时数据无效（对于行数据需要局部更改的场景中可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows: Row | Row[], record: object, field?: string', - list: [] - }, - { - name: 'reloadRowExpand(row)', - desc: '重新懒加载展开行，并展开内容', - version: '4.1.1', - type: 'Promise', - enum: '', - defVal: 'rows: Row', - list: [] - }, - { - name: 'reloadRowExpand(row)', - desc: '用于懒加载展开行，重新加载展开行的内容', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows: Row', - list: [] - }, - { - name: 'reloadTreeExpand(row)', - desc: '重新懒加载树节点，并展开该节点', - version: '4.1.1', - type: 'Promise', - enum: '', - defVal: 'rows: Row', - list: [] - }, - { - name: 'reloadTreeChilds(row)', - desc: '即将废弃，请使用 reloadTreeExpand', - disabled: true, - version: '', - type: 'Promise', - enum: '', - defVal: 'rows: Row', - list: [] - }, - // { - // name: 'loadChildren(row, children)', - // desc: '用于树结构，给行数据加载子节点', - // version: '', - // type: 'Promise', - // enum: '', - // defVal: 'row: Row, children: any[]', - // list: [] - // }, - { - name: 'loadColumn(columns)', - desc: '加载列配置（对于表格列需要重载、局部递增场景下可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: 'columns: array', - list: [] - }, - { - name: 'reloadColumn(columns)', - desc: '加载列配置并恢复到初始状态（对于表格列需要重载、局部递增场景下可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: 'columns: array', - list: [] - }, - { - name: 'refreshColumn()', - desc: '刷新列配置（对于动态修改属性、显示/隐藏列等场景下可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'createRow(records)', - desc: '创建 Row|Rows 对象（对于某些特殊场景需要对数据进行手动插入时可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: 'records: object | array', - list: [] - }, - { - name: 'createData(records)', - desc: '创建 data 对象（对于某些特殊场景可能会用到，会自动对数据的字段名进行检测，如果不存在就自动定义）', - version: '', - type: 'Promise', - enum: '', - defVal: 'records: array', - list: [] - }, - { - name: 'insert(records)', - desc: '往表格插入临时数据，从第一行插入一行或多行新数据', - version: '', - type: 'Promise<{row, rows}>', - enum: '', - defVal: 'records?: object | Array', - list: [] - }, - { - name: 'insertAt(records, row)', - desc: '往表格插入临时数据，从指定位置插入一行或多行；第二个参数：row 指定位置、null从第一行插入、-1 从最后插入', - version: '', - type: 'Promise<{row, rows}>', - enum: '', - defVal: 'records: object | Array, row?: Row | -1 | 0', - list: [] - }, - { - name: 'revertData(rows, field)', - desc: '只对 keep-source 开启有效，还原指定行 row 或者整个表格的数据', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows: Row | Array, field?: string', - list: [] - }, - { - name: 'remove(rows)', - desc: '删除指定行数据，指定 row 或 [row, ...] 删除多条数据，如果为空则删除所有数据', - version: '', - type: 'Promise<{row, rows}>', - enum: '', - defVal: 'rows: Row | Array', - list: [] - }, - { - name: 'removeCheckboxRow()', - desc: '删除复选框选中的行数据', - version: '', - type: 'Promise<{row, rows}>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'removeRadioRow()', - desc: '删除单选框选中的行数据', - version: '', - type: 'Promise<{row, rows}>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'removeCurrentRow()', - desc: '删除当前行选中的行数据', - version: '', - type: 'Promise<{row, rows}>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'removeInsertRow()', - desc: '删除新增的临时数据', - version: '', - type: 'Promise<{row, rows}>', - enum: '', - defVal: '4.0.30', - list: [] - }, - { - name: 'removeMergeCells(merges)', - desc: '取消单元格的临时合并状态，如果为数组，则取消多个合并', - version: '', - type: 'Promise', - enum: '', - defVal: 'merges: {row: Row, col: ColumnInfo} | {row: Row, col: ColumnInfo}[]', - list: [] - }, - { - name: 'removeMergeFooterItems(merges)', - desc: '取消表尾的临时合并状态，如果为数组，则取消多个合并', - version: '', - type: 'Promise', - enum: '', - defVal: 'merges: {row: Row, col: ColumnInfo} | {row: Row, col: ColumnInfo}[]', - list: [] - }, - { - name: 'getRowIndex(row)', - desc: '根据 row 获取相对于 data 中的索引', - version: '', - type: 'Number', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'getVTRowIndex(row)', - desc: '根据 row 获取相对于当前数据中的索引', - version: '', - type: 'Number', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'getVMRowIndex(row)', - desc: '根据 row 获取渲染中的虚拟索引', - version: '', - type: 'Number', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'getRowNode(tr)', - desc: '根据 tr 元素获取对应的 row 信息', - version: '', - type: '{item, items, index, parent}', - enum: '', - defVal: 'tr: Element', - list: [] - }, - { - name: 'getColumns()', - desc: '获取表格的可视的列', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getColid(column)', - desc: '根据列获取列的唯一主键', - version: '', - type: 'String', - enum: '', - defVal: 'column: ColumnConfig', - list: [] - }, - { - name: 'getColumnById(colid)', - desc: '根据列的唯一主键获取列', - version: '', - type: 'Column', - enum: '', - defVal: 'colid: string', - list: [] - }, - { - name: 'getColumnByField(field)', - desc: '根据列的字段名获取列', - version: '', - type: 'Column', - enum: '', - defVal: 'field: string', - list: [] - }, - { - name: 'getTableColumn()', - desc: '获取当前表格的列（收集到的全量列、全量表头列、处理条件之后的全量表头列、当前渲染中的表头列）', - version: '', - type: '{collectColumn, fullColumn, visibleColumn, tableColumn}', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getColumnIndex(column)', - desc: '根据 column 获取相对于 columns 中的索引', - version: '', - type: 'Number', - enum: '', - defVal: 'column: ColumnConfig', - list: [] - }, - { - name: 'getVMColumnIndex(column)', - desc: '根据 column 获取渲染中的虚拟索引', - version: '', - type: 'Number', - enum: '', - defVal: 'column', - list: [] - }, - { - name: 'getVTColumnIndex(column)', - desc: '根据 column 获取相对于当前表格列中的索引（分组表头可能会用到）', - version: '', - type: 'Number', - enum: '', - defVal: 'column', - list: [] - }, - { - name: 'getColumnNode(cell)', - desc: '根据 th/td 元素获取对应的 column 信息', - version: '', - type: '{item, items, index, parent}', - enum: '', - defVal: 'cell: HTMLTableDataCellElement | HTMLTableHeaderCellElement', - list: [] - }, - { - name: 'getSortColumns()', - desc: '获取当前排序的所有列信息', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getCheckedFilters()', - desc: '获取当前筛选的所有列信息', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getTableData()', - desc: '获取当前表格的数据（完整的全量表体数据、处理条件之后的全量表体数据、当前渲染中的表体数据、当前渲染中的表尾数据）', - version: '', - type: '{fullData, visibleData, tableData, footerData}', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getRowById(rowid)', - desc: '根据行的唯一主键获取行', - version: '', - type: 'String', - enum: '', - defVal: 'rowid: string', - list: [] - }, - { - name: 'getRowid(row)', - desc: '根据行获取行的唯一主键', - version: '', - type: 'Row', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'getData(rowIndex)', - desc: '获取数据，和 data 的行为一致，也可以指定索引获取数据', - version: '', - type: 'Array', - enum: '', - defVal: 'rowIndex?: number', - list: [] - }, - { - name: 'getRecordset()', - desc: '获取表格数据集（获取插入、删除、更改的数据，对于增删改查表格非常方便）', - version: '', - type: '{insertRecords, removeRecords, updateRecords}', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getInsertRecords()', - desc: '用于 edit-config，获取插入的临时数据', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getRemoveRecords()', - desc: '获取已删除的数据', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getUpdateRecords()', - desc: '只对 keep-source 开启有效，获取已修改的数据', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getMergeCells()', - desc: '获取临时合并的单元格', - version: '', - type: 'Array<{row: any, col: ColumnInfo, rowspan: number, colspan: number}>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getMergeFooterItems()', - desc: '获取临时合并的表尾', - version: '', - type: 'Array<{row: any, col: ColumnInfo, rowspan: number, colspan: number}>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getCurrentColumn()', - desc: '用于 highlight-current-column，获取当前列', - version: '', - type: 'ColumnConfig', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getCurrentRecord()', - desc: '用于 highlight-current-row，获取高亮的当前行数据', - version: '', - type: 'Row', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getRadioRecord(isFull)', - desc: '用于 type=radio，获取当前已选中的行数据（当前列表，如果 isFull=true 则获取全表已选中的数据）', - version: '', - type: 'Row', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getRadioReserveRecord(isFull)', - desc: '用于 radio-config.reserve，获取已保留选中的行数据（不包含当前列表，如果 isFull=true 则不包含全部列表）', - version: '', - type: 'Row', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getCheckboxRecords(isFull)', - desc: '用于 type=checkbox，获取当前已选中的行数据（当前列表，如果 isFull=true 则获取全表已选中的数据）', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getCheckboxReserveRecords(isFull)', - desc: '用于 checkbox-config.reserve，获取已保留选中的行数据（不包含当前列表，如果 isFull=true 则不包含全部列表）', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getCheckboxIndeterminateRecords(isFull)', - desc: '用于 tree-config 和 type=checkbox，获取半选状态的行数据（当前列表，如果 isFull=true 则获取全表已选中的数据）', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getRowExpandRecords()', - desc: '用于 expand-config，用于展开行，获取已展开的行数据', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getTreeExpandRecords()', - desc: '用于 tree-config，用于树表格，获取已展开的节点（注意，即使父节点被收起，只要该节点还处于展开状态都能获取到）', - version: '', - type: 'Array', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getActiveRecord()', - desc: '用于 edit-config，获取已激活的行数据', - version: '', - type: '{row,rowIndex,$rowIndex,column,columnIndex,$columnIndex}', - enum: '', - defVal: 'row', - list: [] - }, - { - name: 'getSelectedCell()', - desc: '用于 mouse-config.selected，获取选中的单元格信息', - version: '', - type: '{row,column}', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getCellAreas()', - desc: '如果功能被支持，用于 mouse-config.area，用于获取鼠标选择的所有区域', - version: 'pro', - type: 'Array<{cols: ColumnConfig[], rows: any[]}>', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getActiveCellArea()', - desc: '如果功能被支持，用于 mouse-config.area，用于获取区域中的活动单元格', - version: 'pro', - type: '{column: ColumnConfig, row: any}', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getCopyCellArea()', - desc: '如果功能被支持，用于 mouse-config.area，用于获取被标记为复制状态的区域', - version: 'pro', - type: '{cols: ColumnConfig[], rows: any[]}', - enum: '', - defVal: '', - list: [] - }, - { - name: 'getScroll()', - desc: '获取表格的滚动状态', - version: '', - type: '{virtualX, virtualY, scrollTop, scrollLeft}', - enum: '', - defVal: '', - list: [] - }, - { - name: 'isActiveByRow(row)', - desc: '用于 edit-config，判断行是否为激活编辑状态', - version: '', - type: 'boolean', - enum: '', - defVal: 'row', - list: [] - }, - { - name: 'isInsertByRow(row)', - desc: '用于 edit-config，判断行是否为插入的临时数据', - version: '', - type: 'boolean', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'isUpdateByRow(row, field)', - desc: '只对 keep-source 开启有效，判断行数据是否发生改变', - version: '', - type: 'boolean', - enum: '', - defVal: 'row: Row, field?: string', - list: [] - }, - { - name: 'isAllCheckboxChecked()', - desc: '用于 type=checkbox，判断列头复选框是否被选中', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'isAllCheckboxIndeterminate()', - desc: '用于 type=checkbox，判断列头复选框是否被半选', - version: '', - type: 'boolean', - enum: '', - defVal: '', - list: [] - }, - { - name: 'isCheckedByCheckboxRow(row)', - desc: '用于 type=checkbox，判断复选行数据是否勾选', - version: '', - type: 'boolean', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'isIndeterminateByCheckboxRow(row)', - desc: '用于 type=checkbox，判断复选行数据是否半选', - version: '4.0.18', - type: 'boolean', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'isCheckedByRadioRow(row)', - desc: '用于 type=radio，判断单选行数据是否勾选', - version: '', - type: 'boolean', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'isExpandByRow(row)', - desc: '用于 expand-config，判断行是否为展开状态', - version: '', - type: 'boolean', - enum: '', - defVal: 'row', - list: [] - }, - { - name: 'isRowExpandLoaded(row)', - desc: '用于 expand-config.lazy，用于懒加载展开行，判断展开行是否懒加载完成', - version: '', - type: 'boolean', - enum: '', - defVal: 'row', - list: [] - }, - { - name: 'isTreeExpandByRow(row)', - desc: '用于 tree-config，判断行是否为树形节点展开状态', - version: '', - type: 'boolean', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'isTreeExpandLoaded(row)', - desc: '用于 tree-config.lazy，用于懒加载树表格，判断树节点是否懒加载完成', - version: '', - type: 'boolean', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'isFilter(fieldOrColumn)', - desc: '判断指定列是否为筛选状态，如果为空则判断所有列', - version: '', - type: 'boolean', - enum: '', - defVal: 'fieldOrColumn?: string | ColumnInfo', - list: [] - }, - { - name: 'setFilter(fieldOrColumn, options)', - desc: '用于 filters，修改筛选列表（在筛选条件更新之后可以调用 updateData 函数处理表格数据）', - version: '', - type: 'Promise', - enum: '', - defVal: 'fieldOrColumn: string | ColumnInfo, options: []', - list: [] - }, - { - name: 'setActiveRow(row)', - desc: '用于 edit-config，激活行编辑并激活第一个单元格', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'setActiveCell(row, fieldOrColumn)', - desc: '用于 edit-config，激活单元格编辑', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row, fieldOrColumn: string | ColumnInfo', - list: [] - }, - { - name: 'setSelectCell(row, fieldOrColumn)', - desc: '用于 mouse-config.selected，选中指定的单元格', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row, fieldOrColumn: string | ColumnInfo', - list: [] - }, - { - name: 'setCellAreas(areaConfigs, activeArea)', - desc: '如果功能被支持，用于 mouse-config.area，选择指定区域的单元格（示例：setCellAreas([{ startRow, endRow, startColumn, endColumn }])）', - version: 'pro', - type: 'Promise', - enum: '', - defVal: 'areaConfigs: CellAreaConfig[], activeArea?: { area?: CellAreaConfig, row: Row, column: ColumnInfo }', - list: [] - }, - { - name: 'setMergeCells(merges)', - desc: '临时合并单元格，如果为数组则合并多个', - version: '', - type: 'Promise', - enum: '', - defVal: 'merges: TableMergeConfig | TableMergeConfig[]', - list: [] - }, - { - name: 'setMergeFooterItems(merges)', - desc: '临时合并表尾，如果为数组则合并多个', - version: '', - type: 'Promise', - enum: '', - defVal: 'merges: TableMergeConfig | TableMergeConfig[]', - list: [] - }, - { - name: 'setRowExpand(rows, checked)', - desc: '用于 expand-config，设置展开行，二个参数设置这一行展开与否', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows: Row | Array, checked: boolean', - list: [] - }, - { - name: 'setAllRowExpand(checked)', - desc: '用于 expand-config，设置所有行的展开与否（如果是关闭所有行，可以使用 clearRowExpand 快速清除）', - version: '', - type: 'Promise', - enum: '', - defVal: 'checked: boolean', - list: [] - }, - { - name: 'setTreeExpand(rows, checked)', - desc: '用于 tree-config，设置展开树形节点，二个参数设置这一行展开与否', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows: Row | Array, checked: boolean', - list: [] - }, - { - name: 'setAllTreeExpand(checked)', - desc: '用于 tree-config，设置所有树节点的展开与否（如果是关闭所有树节点，可以使用 clearTreeExpand 快速清除）', - version: '', - type: 'Promise', - enum: '', - defVal: 'checked: boolean', - list: [] - }, - { - name: 'setCurrentRow(row)', - desc: '用于 highlight-current-row，设置某一行为高亮状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'setCurrentColumn(fieldOrColumn)', - desc: '用于 highlight-current-column，设置某列行为高亮状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'fieldOrColumn: string | ColumnInfo', - list: [] - }, - { - name: 'setRadioRow(row)', - desc: '用于 type=radio 单选框，设置某一行为选中状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'setCheckboxRow(rows, checked)', - desc: '用于 type=checkbox 复选框，设置行为选中状态，第二个参数为选中与否', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows: Row | Array, checked: boolean', - list: [] - }, - { - name: 'setAllCheckboxRow(checked)', - desc: '用于 type=checkbox，设置所有行的选中状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'checked: boolean', - list: [] - }, - { - name: 'toggleCheckboxRow(row)', - desc: '用于 type=checkbox，切换某一行的选中状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'toggleAllCheckboxRow()', - desc: '用于 type=checkbox，切换所有行的选中状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'toggleRowExpand(row)', - desc: '用于 type=expand，切换展开行的状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'toggleTreeExpand(row)', - desc: '用于 tree-config，切换展开树形节点的状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row', - list: [] - }, - { - name: 'clearMergeCells()', - desc: '手动清除临时合并的单元格', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearMergeFooterItems()', - desc: '手动清除临时合并的表尾', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearCurrentRow()', - desc: '用于 highlight-current-row，手动清空当前高亮的状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearCurrentColumn()', - desc: '用于 highlight-current-column，手动清空当前高亮的状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearRadioRow()', - desc: '用于 type=radio，手动清空用户的选择', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearRadioReserve()', - desc: '用于 radio-config.reserve，手动清空用户保留选中的行数据', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearCheckboxRow()', - desc: '用于 type=checkbox，手动清空用户的选择', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearCheckboxReserve()', - desc: '用于 checkbox-config.reserve，手动清空用户保留选中的行数据', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearRowExpand()', - desc: '用于 type=expand，手动清空展开行状态，数据会恢复成未展开的状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearRowExpandLoaded(row)', - desc: '用于 expand-config.lazy，手动清空懒加载展开行的状态，数据会恢复成未展开的状态，当再次展开时会重新加载', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: any', - list: [] - }, - { - name: 'clearTreeExpand()', - desc: '用于 tree-config，手动清空树形节点的展开状态，数据会恢复成未展开的状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearTreeExpandLoaded(row)', - desc: '用于 tree-config.lazy，手动清空懒加载树节点的状态，数据会恢复成未展开的状态，当再次展开时会重新加载', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: any', - list: [] - }, - { - name: 'clearSort(fieldOrColumn)', - desc: '手动清空排序条件，数据会恢复成未排序的状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'fieldOrColumn?: string | ColumnConfig', - list: [] - }, - { - name: 'clearFilter(fieldOrColumn)', - desc: '手动清空筛选条件（如果不传 column 则清空所有筛选条件），数据会恢复成未筛选的状态', - version: '', - type: 'Promise', - enum: '', - defVal: 'fieldOrColumn?: string | ColumnConfig', - list: [] - }, - { - name: 'clearSelected()', - desc: '手动清除单元格选中状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearEdit()', - desc: '手动清除单元格激活状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'clearCopyed()', - // desc: '手动清空已复制的内容', - // type: 'Promise', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'clearCellAreas(area)', - desc: '如果功能被支持，用于 mouse-config.area，用于清除鼠标选择的区域，可以指定清除的区域', - version: 'pro', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearCopyCellArea()', - desc: '如果功能被支持，用于 mouse-config.area，手动清除标记为复制粘贴的区域', - version: 'pro', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearData(rows, field)', - desc: '手动清空单元格内容，如果不创参数，则清空整个表格内容，如果传了行则清空指定行内容，如果传了指定字段，则清空该字段内容', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows?: Row | Array, field?: string', - list: [] - }, - { - name: 'clearScroll()', - desc: '手动清除滚动相关信息，还原到初始状态', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearValidate()', - desc: '手动清除校验', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'clearAll()', - desc: '手动清除表格所有条件，还原到初始状态（对于增删改查的场景中可能会用到，比如在数据保存之后清除表格缓存）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'resetColumn(options)', - desc: '手动重置列的显示隐藏、列宽拖动的状态；如果为 true 则重置所有状态（如果已关联工具栏，则会同步更新）', - version: '', - type: 'Promise', - enum: '', - defVal: 'options: boolean | object', - list: [ - { - name: 'visible', - desc: '是否重置可视列状态', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'resizable', - desc: '是否重置列宽拖动状态', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - } - ] - }, - { - name: 'closeFilter()', - desc: '手动关闭筛选面板（某些特殊场景可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'closeTooltip()', - desc: '手动关闭 tooltip 提示（某些特殊场景可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'closeMenu()', - desc: '手动关闭右键菜单（某些特殊场景可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'updateFooter()', - desc: '手动更新表尾（对于某些需要频繁更新的场景下可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'updateStatus(slotParams)', - desc: '更新单元格状态（当使用自定义渲染时可能会用到）', - version: '', - type: 'Promise', - enum: '', - defVal: 'slotParams: { row, column }', - list: [] - }, - { - name: 'hideColumn(fieldOrColumn)', - desc: '隐藏指定列', - version: '', - type: 'Promise', - enum: '', - defVal: 'fieldOrColumn: string | ColumnConfig', - list: [] - }, - { - name: 'showColumn(fieldOrColumn)', - desc: '显示指定列', - version: '', - type: 'Promise', - enum: '', - defVal: 'fieldOrColumn: string | ColumnConfig', - list: [] - }, - { - name: 'scrollTo(scrollLeft, scrollTop)', - desc: '如果有滚动条，则滚动到对应的位置', - version: '', - type: 'Promise', - enum: '', - defVal: 'scrollLeft?: number, scrollTop?: number', - list: [] - }, - { - name: 'scrollToRow(row, fieldOrColumn)', - desc: '如果有滚动条，则滚动到对应的行（对于某些特定的场景可能会用到，比如定位到某一行）', - version: '', - type: 'Promise', - enum: '', - defVal: 'row: Row, fieldOrColumn?: string | ColumnConfig', - list: [] - }, - { - name: 'scrollToColumn(fieldOrColumn)', - desc: '如果有滚动条，则滚动到对应的列（对于某些特定的场景可能会用到，比如定位到某一列）', - version: '', - type: 'Promise', - enum: '', - defVal: 'fieldOrColumn: string | ColumnConfig', - list: [] - }, - // { - // name: 'scrollToTreeRow(row)', - // desc: '对于树形结构中，可以直接滚动到指定深层节点中（对于某些特定的场景可能会用到，比如定位到某一节点）', - // version: '', - // type: 'Promise', - // enum: '', - // defVal: 'column: ColumnConfig', - // list: [] - // }, - { - name: 'sort(sortConfs, order)', - desc: '手动对表格进行排序（如果 order 为空则自动切换排序）', - version: '', - type: 'Promise', - enum: '', - defVal: 'sortConfs: string | { field: string | ColumnInfo, order: \'desc\' | \'asc\' | null } | { field: string | ColumnInfo, order?: \'desc\' | \'asc\' | null }[], order?: \'desc\' | \'asc\' | null', - list: [] - }, - { - name: 'isSort(fieldOrColumn)', - desc: '判断指定列是否为排序状态，如果为空则判断所有列', - version: '', - type: 'boolean', - enum: '', - defVal: 'fieldOrColumn?: string | ColumnInfo', - list: [] - }, - { - name: 'recalculate(refull)', - desc: '重新计算表格，如果传 true 则进行完整计算（对于某些特殊场景可能会用到，比如隐藏的表格、重新计算列宽...等）', - version: '', - type: 'Promise', - enum: '', - defVal: 'refull?: boolean', - list: [] - }, - { - name: 'refreshScroll()', - desc: '刷新滚动操作，手动同步滚动相关位置（对于某些特殊的操作，比如滚动条错位、固定列不同步）', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'validate(rows, callback)', - desc: '快速校验，如果存在记录不通过的记录，则返回不再继续校验（异步校验除外）；如果第一个参数为 true 则校验当前表格数据，如果指定 row 或 rows 则校验指定行或多行，如果不指定数据，则默认只校验临时变动的数据，例如新增或修改。该回调函数会在校验结束后被调用 callback(errMap)。若不传入回调函数，则会返回一个 promise', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows?: boolean | Row | Row[], callback?: (errMap) => void', - list: [] - }, - { - name: 'fullValidate(rows, callback)', - desc: '完整校验，和 validate 的区别就是默认校验当前表格数据并且给有效数据中的每一行进行校验', - version: '', - type: 'Promise', - enum: '', - defVal: 'rows?: boolean | Row | Row[] | ((errMap) => void), callback?: (errMap) => void', - list: [] - }, - { - name: 'exportData(options)', - desc: '将表格数据导出（树结构和虚拟滚动只允许导出数据源）', - version: '', - type: 'Promise', - enum: '', - defVal: 'options: object', - list: XEUtils.clone(exportDataAPI, true) - }, - { - name: 'openExport(options)', - desc: '打开高级导出（只对 export-config 启用后有效）', - version: '', - type: 'Promise', - enum: '', - defVal: 'options: object', - list: XEUtils.clone(exportDataAPI.filter(item => !['columns', 'data', 'download', 'columnFilterMethod', 'dataFilterMethod', 'footerFilterMethod'].includes(item.name)), true) - }, - { - name: 'importData(options)', - desc: '将数据导入表格（只支持基本数据结构）', - version: '', - type: 'Promise', - enum: '', - defVal: 'options: object', - list: XEUtils.clone(importDataAPI, true) - }, - { - name: 'openImport(options)', - desc: '打开高级导入（只对 import-config 启用后有效）', - version: '', - type: 'Promise', - enum: '', - defVal: 'options: object', - list: XEUtils.clone(importDataAPI, true) - }, - { - name: 'print(options)', - desc: '打印', - version: '', - type: 'Promise', - enum: '', - defVal: 'options: object', - list: XEUtils.clone(printAPI, true) - }, - { - name: 'saveFile(options)', - desc: '保存文件到本地', - version: '', - type: 'Promise', - enum: '', - defVal: 'options: object', - list: [ - { - name: 'filename', - desc: '文件名', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - desc: '文件类型', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'content', - desc: '内容', - version: '', - type: 'string | Blob', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'readFile(options)', - desc: '读取本地文件', - version: '', - type: 'Promise<{ file, files }>', - enum: '', - defVal: 'options: object', - list: [ - { - name: 'multiple', - desc: '是否允许多选', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'types', - desc: '支持选取的文件类型', - version: '', - type: 'Array', - enum: '', - defVal: '[\'csv\', \'html\', \'xml\', \'txt\']', - list: [] - }, - { - name: 'message', - desc: '是否显示内置的消息提示', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - } - ] - }, - { - name: 'openTooltip(target, content)', - desc: '打开 tooltip 提示', - version: '', - type: 'Promise', - enum: '', - defVal: 'target: HTMLElement, content: string | number', - list: [] - }, - { - name: 'openFind()', - desc: '如果功能被支持，用于 mouse-config.area，打开单元格查找功能', - version: 'pro', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'openReplace()', - desc: '如果功能被支持，用于 mouse-config.area，打开单元格替换功能', - version: 'pro', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'focus()', - desc: '使表格获取焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'blur()', - desc: '使表格失去焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/textarea.ts b/examples/api/textarea.ts deleted file mode 100644 index 7a34f3d10f..0000000000 --- a/examples/api/textarea.ts +++ /dev/null @@ -1,269 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.input.desc.value', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'immediate', - // descKey: 'app.api.input.desc.immediate', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: 'true', - // list: [] - // }, - { - name: 'size', - descKey: 'app.api.input.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'name', - desc: '原生 name 属性', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'form', - desc: '原生 form 属性', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'placeholder', - desc: '当值为空时，显示的占位符', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'className', - desc: '附加 className', - version: '4.0.7', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'rows', - desc: '原生 rows 属性', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'maxlength', - desc: '最大长度', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'readonly', - desc: '是否只读', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'disabled', - descKey: 'app.api.input.desc.disabled', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'resize', - desc: '调整文本域大小的方式', - version: '', - type: 'string', - enum: 'none, both, horizontal, vertical', - defVal: '', - list: [] - }, - { - name: 'autosize', - desc: '自适应文本高度', - version: '', - type: 'boolean | object', - enum: '', - defVal: '继承 setup.textarea.autosize', - list: [ - { - name: 'minRows', - desc: '最小行', - version: '', - type: 'number', - enum: '', - defVal: '1', - list: [] - }, - { - name: 'maxRows', - desc: '最大行', - version: '', - type: 'number', - enum: '', - defVal: '10', - list: [] - } - ] - }, - { - name: 'showWordCount', - desc: '是否显示字数统计', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'countMethod', - desc: '自定义字数计算方法', - version: '4.0.18', - type: '({ value }) => number', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'input', - desc: '在输入时触发该方法', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'keydown', - desc: '在键盘输入按下时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'keyup', - desc: '在键盘输入按下弹起时触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'change', - desc: '在值发生改变时触发该方法', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'focus', - desc: '在聚焦时触发该方法', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - }, - { - name: 'blur', - desc: '在失焦时触发该方法', - version: '', - type: '', - enum: '', - defVal: '{ value, $event }', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'focus()', - desc: '使输入框获取焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'blur()', - desc: '使输入框失去焦点', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/api/toolbar.ts b/examples/api/toolbar.ts deleted file mode 100644 index 852b8d99cd..0000000000 --- a/examples/api/toolbar.ts +++ /dev/null @@ -1,899 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'size', - descKey: 'app.api.toolbar.desc.size', - version: '', - type: 'string', - enum: 'medium, small, mini', - defVal: '继承上下文', - list: [] - }, - { - name: 'loading', - descKey: 'app.api.toolbar.desc.loading', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'perfect', - desc: '配套的样式', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.toolbar.perfect', - list: [] - }, - { - name: 'class-name', - desc: '给工具栏 className', - version: '4.0.7', - type: 'string | (({}) => string)', - enum: '', - defVal: '', - list: [] - }, - { - name: 'import', - descKey: 'app.api.toolbar.desc.import', - version: '', - type: 'boolean | object', - enum: '', - defVal: '默认继承 setup.toolbar.import', - list: [ - // { - // name: 'mode', - // desc: '默认导入数据的方式', - // version: '', - // type: 'string', - // enum: 'covering, append', - // defVal: 'covering', - // list: [] - // }, - // { - // name: 'message', - // desc: '默认显示内置的消息提示', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: 'true', - // list: [] - // }, - // { - // name: 'types', - // desc: '导入的文件类型列表', - // version: '', - // type: 'string[]', - // enum: 'csv, html, xml, txt', - // defVal: '支持所有类型', - // list: [] - // }, - { - name: 'icon', - desc: '自定义图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'export', - descKey: 'app.api.toolbar.desc.export', - version: '', - type: 'boolean | object', - enum: '', - defVal: '默认继承 setup.toolbar.export', - list: [ - // { - // name: 'filename', - // desc: '默认的文件名', - // version: '', - // type: 'string', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'sheetName', - // desc: '默认的表名（只对支持的文档类型有效）', - // version: '', - // type: 'string', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'original', - // desc: '默认是否导出源数据（如果需要支持导入，则必须设置为 true）', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: 'true', - // list: [] - // }, - // { - // name: 'type', - // desc: '默认选中的类型', - // version: '', - // type: 'string', - // enum: '', - // defVal: '默认选中 types 第一个值', - // list: [] - // }, - // { - // name: 'types', - // desc: '导出的文件类型列表', - // version: '', - // type: 'string[]', - // enum: 'csv, html, xml, txt', - // defVal: '', - // list: [] - // }, - // { - // name: 'message', - // desc: '默认显示内置的消息提示', - // version: '', - // type: 'boolean', - // enum: '', - // defVal: 'true', - // list: [] - // }, - { - name: 'icon', - desc: '自定义图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'print', - descKey: 'app.api.toolbar.desc.print', - version: '', - type: 'boolean | object', - enum: '', - defVal: '默认继承 setup.toolbar.print', - list: [ - { - name: 'icon', - desc: '自定义图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'refresh', - descKey: 'app.api.toolbar.desc.refresh', - version: '', - type: 'boolean | object', - enum: '', - defVal: '默认继承 setup.toolbar.refresh', - list: [ - { - name: 'query', - desc: '查询的方法', - version: '', - type: '() => Promise', - enum: '', - defVal: '', - list: [] - }, - { - name: 'icon', - desc: '自定义图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'iconLoading', - desc: '自定义加载中图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'custom', - descKey: 'app.api.toolbar.desc.custom', - version: '', - type: 'boolean | object', - enum: '', - defVal: '默认继承 setup.toolbar.custom', - list: [ - { - name: 'trigger', - desc: '触发方式', - version: '', - type: 'string', - enum: 'manual,click,hover', - defVal: 'click', - list: [] - }, - { - name: 'immediate', - desc: '列勾选之后是否实时同步', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'isFooter', - desc: '是否显示底部操作按钮', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'icon', - desc: '自定义图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'buttons', - desc: '左侧按钮列表', - version: '', - type: 'any[]', - enum: '', - defVal: '默认继承 setup.toolbar.buttons', - list: [ - { - name: 'name', - desc: '按钮名称（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - desc: '按钮类型', - version: '', - type: 'string', - enum: 'text,submit,reset,button', - defVal: 'button', - list: [] - }, - { - name: 'status', - desc: '按钮状态', - version: '', - type: 'string', - enum: 'primary, success, info, warning, danger', - defVal: '', - list: [] - }, - { - name: 'code', - desc: '指令编码', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible ', - desc: '是否可视', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'disabled ', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'icon ', - desc: '按钮图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'round', - desc: '圆角边框', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'circle', - desc: '圆角按钮', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'placement', - descKey: 'app.api.button.desc.placement', - version: '', - type: 'string', - enum: 'top, bottom', - defVal: 'bottom', - list: [] - }, - { - name: 'destroy-on-close', - desc: '在下拉容器关闭时销毁内容', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'transfer', - descKey: 'app.api.button.desc.transfer', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.button.transfer', - list: [] - }, - { - name: 'dropdowns', - desc: '下拉按钮列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '按钮名称（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - desc: '按钮类型', - version: '', - type: 'string', - enum: 'text,submit,reset,button', - defVal: 'button', - list: [] - }, - { - name: 'status', - desc: '按钮状态', - version: '', - type: 'string', - enum: 'primary, success, info, warning, danger', - defVal: '', - list: [] - }, - { - name: 'code', - desc: '按钮编码', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible ', - desc: '是否可视', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'disabled ', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'icon ', - desc: '按钮图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'round', - desc: '圆角边框', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'circle', - desc: '圆角按钮', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - } - ] - }, - { - name: 'buttonRender ', - desc: '渲染器配置项', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '渲染器名称', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'props', - desc: '渲染的参数（请查看目标渲染的 Props）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'attrs', - // desc: '渲染的属性（请查看目标渲染的 Attribute）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'events', - desc: '渲染组件的事件（请查看目标渲染的 Events）', - version: '', - type: 'any', - enum: '', - defVal: '{button}, ...[目标渲染的 arguments]', - list: [] - // }, - // { - // name: 'nativeEvents', - // desc: '渲染组件的原生事件（请查看目标渲染的 Events）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{button}, ...[目标渲染的 arguments]', - // list: [] - } - ] - } - ] - }, - { - name: 'tools', - desc: '右侧工具列表', - version: '4.0.7', - type: 'any[]', - enum: '', - defVal: '默认继承 setup.toolbar.tools', - list: [ - { - name: 'name', - desc: '按钮名称（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - desc: '按钮类型', - version: '', - type: 'string', - enum: 'text,submit,reset,button', - defVal: 'button', - list: [] - }, - { - name: 'status', - desc: '按钮状态', - version: '', - type: 'string', - enum: 'primary, success, info, warning, danger', - defVal: '', - list: [] - }, - { - name: 'code', - desc: '指令编码', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible ', - desc: '是否可视', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'disabled ', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'icon ', - desc: '按钮图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'round', - desc: '圆角边框', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'circle', - desc: '圆角按钮', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'placement', - descKey: 'app.api.button.desc.placement', - version: '', - type: 'string', - enum: 'top, bottom', - defVal: 'bottom', - list: [] - }, - { - name: 'destroy-on-close', - desc: '在下拉容器关闭时销毁内容', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'transfer', - descKey: 'app.api.button.desc.transfer', - version: '', - type: 'boolean', - enum: '', - defVal: '默认 false，继承 setup.button.transfer', - list: [] - }, - { - name: 'dropdowns', - desc: '下拉按钮列表', - version: '', - type: 'any[]', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '按钮名称（支持开启国际化）', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'type', - desc: '按钮类型', - version: '', - type: 'string', - enum: 'text,submit,reset,button', - defVal: 'button', - list: [] - }, - { - name: 'status', - desc: '按钮状态', - version: '', - type: 'string', - enum: 'primary, success, info, warning, danger', - defVal: '', - list: [] - }, - { - name: 'code', - desc: '按钮编码', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'visible ', - desc: '是否可视', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'disabled ', - desc: '是否禁用', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'icon ', - desc: '按钮图标', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'round', - desc: '圆角边框', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'circle', - desc: '圆角按钮', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - } - ] - }, - { - name: 'toolRender ', - desc: '渲染器配置项', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [ - { - name: 'name', - desc: '渲染器名称', - version: '', - type: 'string', - enum: '', - defVal: '', - list: [] - }, - { - name: 'props', - desc: '渲染的参数（请查看目标渲染的 Props）', - version: '', - type: 'any', - enum: '', - defVal: '', - list: [] - }, - // { - // name: 'attrs', - // desc: '渲染的属性（请查看目标渲染的 Attribute）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '', - // list: [] - // }, - { - name: 'events', - desc: '渲染组件的事件（请查看目标渲染的 Events）', - version: '', - type: 'any', - enum: '', - defVal: '{tool}, ...[目标渲染的 arguments]', - list: [] - // }, - // { - // name: 'nativeEvents', - // desc: '渲染组件的原生事件（请查看目标渲染的 Events）', - // version: '', - // type: 'any', - // enum: '', - // defVal: '{tool}, ...[目标渲染的 arguments]', - // list: [] - } - ] - } - ] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'buttons', - desc: '按钮列表', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - }, - { - name: 'tools', - desc: '右侧工具列表', - version: '', - type: '', - enum: '', - defVal: '{}', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'button-click', - desc: '只对 buttons 配置时有效，当左侧按钮被点击时会后触发该事件', - version: '', - type: '', - enum: '', - defVal: '{ code, button, $event}', - list: [] - }, - { - name: 'tool-click', - desc: '只对 tools 配置时有效，当右侧工具被点击时会后触发该事件', - version: '4.0.7', - type: '', - enum: '', - defVal: '{ code, tool, $event}', - list: [] - } - ] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - // { - // name: 'hideColumn(column)', - // desc: '隐藏指定列', - // type: '', - // enum: '', - // defVal: 'column', - // list: [] - // }, - // { - // name: 'showColumn(column)', - // desc: '显示指定列', - // type: '', - // enum: '', - // defVal: 'column', - // list: [] - // }, - // { - // name: 'updateSetting()', - // desc: '手动更新列自定义的操作状态', - // version: '', - // type: '', - // enum: '', - // defVal: '', - // list: [] - // }, - // { - // name: 'updateResizable()', - // desc: '手动更新列宽拖动的操作状态', - // version: '', - // type: '', - // enum: '', - // defVal: '', - // list: [] - // } - ] - } -] - -export default apis diff --git a/examples/api/tooltip.ts b/examples/api/tooltip.ts deleted file mode 100644 index 9e9458a625..0000000000 --- a/examples/api/tooltip.ts +++ /dev/null @@ -1,142 +0,0 @@ -const apis = [ - { - name: 'Props', - descKey: 'app.api.title.props', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'modelValue', - descKey: 'app.api.tooltip.desc.value', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'content', - descKey: 'app.api.tooltip.desc.content', - version: '', - type: 'string | number', - enum: '', - defVal: '', - list: [] - }, - { - name: 'trigger', - descKey: 'app.api.tooltip.desc.trigger', - version: '', - type: 'string', - enum: 'manual, hover, click', - defVal: 'hover', - list: [] - }, - { - name: 'theme', - descKey: 'app.api.tooltip.desc.theme', - version: '', - type: 'string', - enum: 'dark, light', - defVal: 'dark', - list: [] - }, - { - name: 'zIndex', - descKey: 'app.api.tooltip.desc.zIndex', - version: '', - type: 'number', - enum: '', - defVal: '继承 setup.zIndex', - list: [] - }, - { - name: 'isArrow', - descKey: 'app.api.tooltip.desc.isArrow', - version: '', - type: 'boolean', - enum: '', - defVal: 'true', - list: [] - }, - { - name: 'enterable', - descKey: 'app.api.tooltip.desc.enterable', - version: '', - type: 'boolean', - enum: '', - defVal: 'false', - list: [] - }, - { - name: 'leaveDelay', - descKey: 'app.api.tooltip.desc.leaveDelay', - version: '', - type: 'number', - enum: '', - defVal: '300', - list: [] - } - ] - }, - { - name: 'Slots', - descKey: 'app.api.title.slots', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'default', - desc: '自定义显示内容模板', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - } - ] - }, - { - name: 'Events', - descKey: 'app.api.title.events', - version: '', - type: '', - enum: '', - defVal: '', - list: [] - }, - { - name: 'Methods', - descKey: 'app.api.title.methods', - version: '', - type: '', - enum: '', - defVal: '', - list: [ - { - name: 'open(target, message)', - desc: '手动打开提示框', - version: '', - type: 'Promise', - enum: '', - defVal: 'target?: HTMLElement, message?: string | number', - list: [] - }, - { - name: 'close()', - desc: '手动关闭提示框', - version: '', - type: 'Promise', - enum: '', - defVal: '', - list: [] - } - ] - } -] - -export default apis diff --git a/examples/components/GridAPILink.vue b/examples/components/GridAPILink.vue deleted file mode 100644 index e23007722b..0000000000 --- a/examples/components/GridAPILink.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/examples/components/PagerAPILink.vue b/examples/components/PagerAPILink.vue deleted file mode 100644 index 02cd60f9b6..0000000000 --- a/examples/components/PagerAPILink.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/examples/components/PreCode.vue b/examples/components/PreCode.vue deleted file mode 100644 index 04a0a76bbd..0000000000 --- a/examples/components/PreCode.vue +++ /dev/null @@ -1,16 +0,0 @@ - - - diff --git a/examples/components/TableAPILink.vue b/examples/components/TableAPILink.vue deleted file mode 100644 index 2cd2937242..0000000000 --- a/examples/components/TableAPILink.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/examples/components/TableColumnAPILink.vue b/examples/components/TableColumnAPILink.vue deleted file mode 100644 index e95025fdab..0000000000 --- a/examples/components/TableColumnAPILink.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/examples/components/ToolbarAPILink.vue b/examples/components/ToolbarAPILink.vue deleted file mode 100644 index 4a8f83eecc..0000000000 --- a/examples/components/ToolbarAPILink.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/examples/components/VirtualTreeAPILink.vue b/examples/components/VirtualTreeAPILink.vue deleted file mode 100644 index 6d22bc323d..0000000000 --- a/examples/components/VirtualTreeAPILink.vue +++ /dev/null @@ -1,15 +0,0 @@ - - - diff --git a/examples/i18n/index.ts b/examples/i18n/index.ts deleted file mode 100644 index 10a6cad013..0000000000 --- a/examples/i18n/index.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { createI18n } from 'vue-i18n' - -import tableZhCN from '../../packages/locale/lang/zh-CN' -import tableZhTC from '../../packages/locale/lang/zh-TC' -import tableEnUS from '../../packages/locale/lang/en-US' - -import myZhCN from './lang/zh-CN' -import myZhTC from './lang/zh-TC' -import myEnUS from './lang/en-US' - -const languageList = ['zh_CN', 'zh_TC', 'en_US'] -const customLanguage = localStorage.getItem('language') - -const i18n = createI18n({ - warnHtmlMessage: false, - locale: customLanguage && languageList.includes(customLanguage) ? customLanguage : ['zh-CN', 'zh-HK', 'zh-MO', 'zh-TW'].includes(navigator.language) ? 'zh_CN' : 'en_US', - messages: { - zh_CN: { - ...tableZhCN, - ...myZhCN - }, - zh_TC: { - ...tableZhTC, - ...myZhTC - }, - en_US: { - ...tableEnUS, - ...myEnUS - } - } -}) - -export default i18n diff --git a/examples/i18n/lang/en-US.ts b/examples/i18n/lang/en-US.ts deleted file mode 100644 index 4dbde802e9..0000000000 --- a/examples/i18n/lang/en-US.ts +++ /dev/null @@ -1,795 +0,0 @@ -export default { - app: { - aside: { - nav: { - start: 'Development', - install: 'Global install', - quick: 'Quick starts', - use: 'Import on demand', - global: 'Global props', - icons: 'Global icon', - theme: 'Global theme', - i18n: 'Internationalization', - - icon: 'Icon', - basics: 'Basic table', - base: 'Basics table', - autoBreak: 'Word wrap', - size: 'Size', - ellipsis: 'Cell overflow ellipsis', - tooltips: 'Cell tooltip', - width: 'Column width', - stripe: 'Striped', - border: 'Border', - round: 'Round border', - style: 'Cell style', - compact: 'Compact style', - dynamicStyle: 'Cell dynamic style', - scrollStyle: 'Scrollbar style', - hideHead: 'Hidden header', - resizable: 'Resizable', - fluidHeight: 'Maximum table height', - rowHeight: 'Row height', - resize: 'Resize height and width', - height: 'Table with fixed header', - visible: '默认是否显示', - fixed: 'Table with fixed column', - fullFixed: 'Table with fixed columns and header ', - group: 'Grouping table head', - merge: 'Merge rows or columns', - seq: 'Table sequence', - headerHighlight: 'Highlight column', - current: 'Highlight row', - radio: 'Radio', - checkbox: 'Checkbox', - sort: 'Sorting', - filter: 'Filter', - empty: 'Empty data', - loading: 'Loading', - format: 'Format content', - html: 'HTML tag', - data: 'Data and fields', - - more: 'Complex table', - events: 'Event', - template: 'Template', - dynamic: 'Use v-for dynamic implementation', - customCheckbox: 'Custom checkbox', - customRadio: 'Custom radio', - sortIcon: 'Custom sort icon', - customSort: 'Custom header sort', - multiSort: 'Multi-field sort', - manualFilter: 'Filtering advanced usage', - filterIcon: 'Custom filter icon', - customFilter: '自定义列头筛选', - span: 'Rowspan and colspan', - spanRow: 'Merge the list of horizontal trees', - mergeCell: 'Merge cells', - footer: 'Footer data', - footerSpan: 'Footer rowspan and colspan', - import: 'Import', - export: 'Export', - print: 'Print', - customPrint: 'Advanced print', - fixedType: 'Fixed type + import/export', - contextMenu: 'Context menu', - menuPrivilege: 'Context menu + permission', - footerImmediately: 'Footer + immediately update total', - expandRow: 'Expandable row', - expandRowIcon: 'Expandable row + More customizations', - expandRowLazy: 'Expandable row + lazy loading', - accordion: 'Expandable row + accordion', - toolbar: 'Toolbar', - customs: 'Show, hide, and collapsed columns', - customStorage: 'Custom column + localStorage', - customlWidthStorage: 'Full custom column + localStorage', - search: 'Table search', - groupBy: 'Row group', - details: 'Popup displays details', - popupEdit: 'Popup form edit', - pager: 'Pager', - pageIcon: 'Pagination + custom icon', - rangeSelect: 'The range of the checkbox is checked', - tabs: 'Switch tabs', - keepAlives: 'Show hide + keep-alive', - - grid: 'Advanced table', - reverse: 'Reverse table', - proxy: 'Data proxy', - proxyPage: 'Data proxy + Pager', - formProxy: 'Data proxy + Form', - configProxy: 'Strongest function', - fullQuery: 'Full query', - customToolbar: 'Custom toolbar', - toolbarIcon: 'Custom toolbar button icon', - fullscreen: 'Full screen zoom', - dynamicColumn: 'Configurable dynamic columns', - baseTree: 'Basics tree', - lazyTree: 'Lazy loading tree', - treeLazyEdit: 'Lazy loading tree + editable', - crudTreeToolbar: 'Tree + Toolbar', - crud: 'CRUD', - - tree: 'Tree table', - treeNormal: 'Normal tree', - customIcon: 'More customizations', - expandTreeLazy: 'Tree expansion line lazy load', - treeSearch: 'Deep to search', - treeSort: 'Deep sort', - groupSummary: 'Group summary', - groupSummaryCount: 'Group summary total', - edit: 'Editable', - crudToolbar: 'CRUD + Toolbar', - lazy: 'Lazy loading', - lazyMenu: 'Lazy loading + contextmenu', - lazyEdit: 'Lazy loading + editable', - treeLine: 'Nodal line', - full: 'Full demo', - - virtualTree: 'Virtual tree table', - big: 'Virtual scroll', - - scroll: 'Virtual Scroller', - bigData: 'Virtual Scroller', - scrollMode: 'Scroll mode', - scrollRows: 'vertical', - scrollFullRows: 'vertical + complicated', - scrollCols: 'horizontal', - scrollFullCols: 'horizontal and vertical + complicated', - moveHighlight: 'Keyboard move highlight row', - scrollTree: 'Virtual tree', - bigTree: 'Tree vertical', - treeRows: 'Tree vertical', - treeCols: 'Tree horizontal and vertical&纵向', - pageScroll: 'Scroll to page', - infiniteScroll: 'The infinite scroll', - partialLoad: 'Partial load', - fullPartialLoad: 'Full partial load', - - editable: 'Editable', - popupForm: 'Popup edit', - manual: 'Manual trigger', - click: 'Click trigger', - dblclick: 'dblclick trigger', - selectContent: 'Select the content', - autoClear: 'Auto clear', - cellPlaceholder: 'Cell placeholder', - insert: 'Insert', - delete: 'Delete', - revert: 'Revert', - status: 'Cell status', - partialUpdate: 'Partial update', - cellDisable: 'Disable editing + Cell', - rowDisable: 'Disable editing + Row', - cellValid: 'Verification + Cell', - rowValid: 'Verification + Row', - forceCellValid: 'Validate cell + lock', - forceRowValid: 'Validate row + lock', - highlightCell: 'Highlighting the editor', - keyboard: 'Keyboard navigation', - keyboardEdit: 'Keyboard navigation + Override the default edit behavior', - dataCount: 'Data count', - uniqueSelect: 'Unique select option', - cascadingSelect: 'Cascading select options', - realtimeSave: 'Realtime save', - upload: 'File upload', - - excel: 'More implementation', - cell: 'Cell', - - bad: 'Bad usage', - badEdit: 'The full table is rendered in edit', - badLineHeight: 'Dynamic row height with virtual scroll', - badNonsupport: 'Unsupported', - - module: 'Modules', - button: 'Button', - input: 'Input', - textarea: 'Textarea', - select: 'Select', - modal: 'Modal', - drawer: 'Drawer', - tooltip: 'Tooltip', - form: 'Form', - switch: 'Switch', - list: 'Virtual list', - pulldown: 'Pulldown', - file: 'File', - readFile: 'Read file', - - other: 'Integrated third party Library', - elementRender: 'element-plus -> Custom Templates', - iviewRender: 'iview -> Custom Templates', - antd: 'ant-design-vue -> Custom Templates', - elementUpload: 'element-plus -> Uploader', - sortablejsRow: 'sortablejs -> Row drag', - sortablejsColumn: 'sortablejs -> column moving', - xlsxRender: 'xlsx -> Import and export', - - plugin: 'Extension plug-in library', - elementPlugin: 'plugin-element Basic config', - elementFilterPlugin: 'plugin-element Filter config', - elementPluginMore: 'plugin-element More config', - iviewPlugin: 'plugin-iview Basic config', - iviewFilter: 'plugin-iview Filter config', - iviewPluginMore: 'plugin-iview More config', - antdPlugin: 'plugin-antd Basic config', - antdFilter: 'plugin-antd Filter config', - antdPluginMore: 'plugin-antd More config', - spanPlugin: 'Select merge cells', - shortcutKeyPlugin: 'plugin-shortcut-key Shortcut key Settings', - chartsPlugin: 'plugin-charts Chart tools', - exportXLSXPlugin: 'plugin-export The import/export xlsx', - exportPDFPlugin: 'plugin-export The export pdf', - rendererPlugin: 'plugin-renderer More renderer', - menusPlugin: 'plugin-menus Context menus', - excelPlugin: 'plugin-excel A simple excel', - treeRowPlugin: 'plugin-virtual-tree Virtual tree', - treeColPlugin: 'plugin-virtual-tree Horizontal and vertical', - - formats: '(全局复用) Formatter', - commands: '(全局复用) Command register', - menus: '(全局复用) Context menu', - - renderer: '(高级用法) VxeRenderer', - rendererFilter: 'Filter renderer', - rendererDefault: 'Cell renderer', - rendererEdit: 'Edit renderer', - rendererExpand: 'Content renderer', - rendererToolbar: 'Toolbar renderer', - rendererForm: 'Form renderer', - rendererEmpty: 'No data renderer', - - interceptor: '(高级用法) Event interceptor', - - optimize: 'Optimization and suggestion', - optimizeScroller: 'Virtual rolling optimization', - optimizeEdit: 'Editable optimization', - - api: 'API', - vxeTable: 'vxe-table', - vxeTableColgroup: 'vxe-colgroup', - vxeTableColumn: 'vxe-column', - vxeGrid: 'vxe-grid', - vxeVirtualTree: 'vxe-virtual-tree', - vxeExcel: 'vxe-excel', - vxeToolbar: 'vxe-toolbar', - vxePager: 'vxe-pager', - vxeRadio: 'vxe-radio', - vxeRadioGroup: 'vxe-radio-group', - vxeRadioButton: 'vxe-radio-button', - vxeCheckbox: 'vxe-checkbox', - vxeCheckboxGroup: 'vxe-checkbox-group', - vxeInput: 'vxe-input', - vxeTextarea: 'vxe-textarea', - vxeSelect: 'vxe-select', - vxeOptgroup: 'vxe-optgroup', - vxeOption: 'vxe-option', - vxeButton: 'vxe-button', - vxeTooltip: 'vxe-tooltip', - vxeModal: 'vxe-modal', - vxeForm: 'vxe-form', - vxeFormItem: 'vxe-form-item', - vxeFormGather: 'vxe-form-gather', - vxeSwitch: 'vxe-switch', - vxeList: 'vxe-list', - vxePulldown: 'vxe-pulldown' - } - }, - header: { - label: { - donation: '支持我们', - support: '付费插件' - } - }, - body: { - button: { - viewCode: 'View code', - runDemo: 'Run demo', - showCode: 'Show demo', - refresh: 'Refresh', - insert: 'Insert', - save: 'Save', - markCancel: 'Mark/Cancel', - deleteSelectedRecords: 'Delete selected records' - }, - label: { - on: 'ON', - off: 'OFF', - plan: 'Plan', - through: 'Through', - copy: 'Copy', - cut: 'Cut and paste', - paste: 'Paste', - delete: 'Delete', - sort: 'Sort', - filter: 'Filter', - translations: 'Translations', - version: 'Version', - name: 'Name', - age: 'Age', - sex: 'Sex', - search: 'Search', - reset: 'Reset', - createTime: 'Create Date', - updateTime: 'Update Date', - stableVersion: 'Stable', - latestVersion: 'Latest' - }, - valid: { - rName: 'The name of the required.' - }, - msg: { - error: 'Error message', - copyToClipboard: 'Copied to clipboard' - }, - other: { - v1: 'v1+ (vue 2.6+ End of life) ~ 2020-04 Stop', - v2: 'v2+ (vue 2.6+ Old) ~ 2021-12 Stop', - v3: 'v+ (vue 2.6+ Stable)', - v3d5: '3.5+ (vue 2.6+ Sticky)', - v4: 'v4+ (vue 3.0+ Latest)', - v4d5: '4.5+ (vue 3.0+ Sticky)', - plan: { - v1: 'v1 Based on vue2.6+, Support for all major browsers', - v2: 'v2 Based on vue2.6+, Support for all major browsers', - v3: 'v3 Support for modern browsers and partial compatibility with IE11 to improve rendering performance', - v4: 'v4 Based on vue3.0+, Only supports modern browsers, not IE' - }, - compatibility: 'Compatibility', - releases: 'Releases', - donation: '支持我们', - issuesTitle: '该群供大家交流問題，如果群人数已满，将会不定期剔除不活跃的
，如果有 bug 请通过 issues 反馈', - newFunc: 'Since the author is busy, there may be time to support this function later!', - newDevelopment: 'this release is being refactored. Stay tuned!' - }, - search: { - searchPlaceholder: 'Document search', - noDataPrefix: 'No results related to "', - noDataSuffix: '" can be found!' - }, - support: { - title: '该付费技术群用于快速解决使用过程中遇到的各种问题。' - }, - demo: { - start: { - i18n: { - i18nTitle: 'If you want to use the specified language, you need to make Multilingual Settings. Take Chinese / English as an example', - translate: 'Integration internationalization', - translateTitle: 'If you want to support global automatic translation in the project, you can turn it on through global parameters (automatic translation will be performed for column header, verification prompt, etc.)', - findError: 'Errors found? Want to participate in translation?' - } - } - } - }, - footer: { - donation: '支持我们', - donationDesc: 'vxe-table is open source and free for MIT. In order to make the project healthy and sustainable development, you can support the author through donation.' - }, - api: { - apiSearch: 'API Search', - title: { - prop: 'Attribute', - desc: 'Description', - type: 'Type / Return type', - enum: 'Accepted Values', - defVal: 'Default / Arguments', - version: 'Compatibility', - props: 'Table Attributes', - events: 'Table events', - slots: 'Table slots', - methods: 'Table methods' - }, - table: { - desc: { - id: 'Unique identification', - data: 'Table data(note that updating data does not reset the status)', - columns: 'Column configuration', - customs: 'Have been obsolete', - height: 'Table height, supports adaptive or fixed height(if you set adaptive, you must ensure that parent nodes exist and no adjacent elements are allowed)', - maxHeight: 'Maximum height of the table', - syncResize: 'Automatically following a property change to recalculate the table is the same as manually calling the recalculate method', - autoResize: 'Automatically listen for parent changes to recalculate the table (this may be used in scenarios where parent elements may be dynamically changing)', - resizable: 'Resizable', - stripe: 'Whether with zebra stripes(note that in the editable table scenario, the temporarily inserted data will not have a zebra-like pattern)', - border: 'Border', - round: 'Round border', - size: 'Table size', - fit: 'Whether the width of all columns is self-supporting(do not use parameters that may be discarded)', - loading: 'Whether the table is loaded', - align: 'All columns on its way', - headerAlign: 'Alignment of all header columns', - footerAlign: 'Alignment of all footer columns', - showHeader: 'Whether to display the header', - startIndex: 'Obsolete, please use "seq-config.startIndex"', - highlightCurrentRow: 'Whether to highlight the current row', - highlightHoverRow: 'Mouse over a row to highlight', - highlightCurrentColumn: 'Whether to highlight the current column', - highlightHoverColumn: 'Mouse over whether to highlight a column', - highlightCell: 'Only valid for edit-config configuration, whether to highlight cell borders during editing(Partial support only)', - rowClassName: 'Append a className to the row', - cellClassName: 'Append a className to the cell', - headerRowClassName: 'Append a className to the row in the header', - headerCellClassName: 'Append a className to the cell in the header', - footerRowClassName: 'Append a className to the row in the footer', - footerCellClassName: 'Append a className to the cell in the footer', - cellStyle: 'Append styles to cells', - headerCellStyle: 'Append styles to header cells', - footerCellStyle: 'A table footer cell is attached to a style', - rowStyle: 'Attach styles to rows', - headerRowStyle: 'Append styles to header rows', - footerRowStyle: 'Attach a style to the end of a table', - showFooter: 'Whether to display table footer', - footerMethod: 'The data method at table footer, return a two-dimensional array', - mergeCells: '临时合并指定的单元格 (不能用于展开行，不建议用于固定列、树形结构)', - mergeFooterItems: '临时合并表尾 (不能用于展开行，不建议用于固定列、树形结构)', - spanMethod: '自定义合并函数，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)', - footerSpanMethod: '表尾合并行或列，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)', - showOverflow: 'Sets all content to appear as ellipses if it is too long', - showHeaderOverflow: 'Sets the header to show ellipsis when all content is too long', - showAllOverflow: 'It is about to be abandoned, please use "show-overflow"', - showHeaderAllOverflow: 'It is about to be abandoned, please use "show-header-overflow"', - showFooterOverflow: 'Sets the footer to show ellipsis when all content is too long', - sortMethod: 'It is about to be abandoned, please use "sort-config.sortMethod"', - remoteSort: 'It is about to be abandoned, please use "sort-config.remote"', - remoteFilter: 'It is about to be abandoned, please use "filter-config.remote"', - columnWidth: 'Width of all columns', - columnMinWidth: 'All minimum column widths; The remaining space is automatically proportioned', - columnKey: 'Whether the key attribute needs to be set for each column VNode (not required for non-exceptional cases)', - rowKey: 'Do you need to set the key attribute for VNode on each row (not necessary for non-exceptional cases)', - rowId: 'Field names for custom row data unique primary keys (row data must have a unique primary key, automatically generated by default)', - keepSource: 'Maintain the state of the original data, depending on certain functions, such as edit state, restore data, etc.', - zIndex: 'Custom style z-index (may be used for special situations, such as occlusion)', - resizableConfig: 'Resizable configuration', - seqConfig: 'Sequence number configuration', - sortConfig: 'Sort configuration', - filterConfig: 'Filter configuration', - radioConfig: 'Radio configuration', - exportConfig: 'Export configuration', - importConfig: 'Import configuration', - printConfig: 'Print configuration', - selectConfig: 'Obsolete, please use "checkbox-config"', - checkboxConfig: 'Checkbox configuration', - tooltipConfig: 'tooltip configuration', - expandConfig: 'Expand the row configuration', - treeConfig: 'Tree configuration', - menuConfig: 'context menu configuration', - contextMenu: 'Obsolete, please use "menu-config"', - clipConfig: 'Copy and paste configuration', - fnrConfig: 'find and replace configuration', - mouseConfig: 'Mouse configuration', - areaConfig: 'Area selection configuration', - keyboardConfig: 'Keyboard configuration', - editConfig: 'Editable configuration', - validConfig: 'Validate configuration', - editRules: 'Checksum rule configuration entries', - emptyText: 'What is displayed when the data is empty', - emptyRender: 'Empty content renderer config', - customConfig: 'Custom configuration', - optimization: 'Have been obsolete', - - params: '自定义参数（可以用来存放一些自定义的数据）', - - empty: 'Text content displayed when empty data', - - currentChange: 'Only valid for highlightCurrentRow, the event that fires when the row is manually selected and the value changes', - radioChange: 'Only works for type=radio, the event that is triggered when the value is manually checked and changed', - selectChange: 'Obsolete, please use "checkbox-change"', - checkboxChange: 'Only valid for type=checkbox, events that are triggered when checked manually and the value changes', - selectAll: 'Obsolete, please use "checkbox-all"', - checkboxAll: 'Only valid for type=checkbox, events that are triggered when all is checked manually', - cellClick: 'This event is triggered when the cell is click', - cellDblclick: 'This event is triggered when a cell is dblclick', - cellMenu: 'This is only valid for "menu-config" configuration, and is triggered when the cell is context menu', - cellContextmenu: 'Obsolete, please use "Cell-Menu"', - headerCellClick: 'This event is triggered when the header cell is click', - headerCellDblclick: 'This event is triggered when a header cell is dblclick', - headerCellMenu: 'This is only valid for "menu-config" configuration, and is triggered when the header cell is context menu', - headerCellContextmenu: 'Obsolete, please use "header-Cell-Menu"', - footerCellClick: 'This event is triggered when a header cell is click', - footerCellDblclick: 'This event is triggered when a cell at the end of a table is dblclick', - footerCellMenu: 'This is only valid for "menu-config" configuration, and is triggered when the footer cell is context menu', - footerCellContextmenu: 'Obsolete, please use "footer-Cell-Menu"', - cellMouseenter: 'This is only valid for "tooltip-config" configuration, This event is fired when the cell mouseenter', - cellMouseleave: 'This is only valid for "tooltip-config" configuration, This event is fired when the cell mouseleave', - sortChange: 'This event is triggered when the sort condition changes', - filterChange: 'This event is triggered when a filter condition changes', - resizableChange: 'This event is triggered when the column width is dragged to change', - toggleExpandChange: 'This event is triggered when a row is expanded or collapsed', - toggleTreeChange: 'This event is triggered when the tree node is expanded or collapsed', - menuClick: 'This event is only valid for "menu-config" configuration and is triggered when the shortcut menu is clicked', - contextMenuClick: 'Obsolete, please use "menu-click"', - cellSelected: 'This event is triggered when a cell is selected', - editClosed: 'This event is triggered when the cell edit is turned close', - editActived: 'This event is triggered when the cell is activated for editing', - editDisabled: 'This event is triggered if the cell is disabled when activated', - validError: 'This event is triggered when data validation does not pass', - scroll: 'This event is triggered when the table scrolls' - } - }, - tableColumn: { - desc: { - type: 'The type of the column', - index: 'Obsolete, please use "seq"', - seq: 'Sequence number', - selection: 'Obsolete, please use "checkbox"', - checkbox: 'Checkbox', - radio: 'Radio', - expand: 'Expansion', - html: 'HTML tag(Rendering arbitrary HTML dynamically is very dangerous and can easily lead to XSS attacks, so make sure the content is trusted)', - visible: 'Whether or not show', - prop: 'Obsolete, please use "field"', - field: 'Column field', - label: 'Obsolete, please use "title"', - title: 'Column title (support internationalization)', - width: 'Column width (if empty, distribute the remaining widths evenly; if all columns are fixed, there may be a widescreen that does not fill up, either with "%" or "min-width" layout)', - minWidth: 'Minimum height of the column,The remaining space is automatically allocated proportionally', - resizable: 'Whether column resizing allows dragging column widths', - fixed: 'Fix the column to the left or right (note: fixed columns should be left and right)', - align: 'Column on its way', - headerAlign: 'Alignment of header columns', - footerAlign: 'Alignment of footer columns', - showOverflow: 'Appears as an ellipsis when the content is too long', - showHeaderOverflow: 'Appears as an ellipsis when the header content is too long', - showFooterOverflow: 'Appears as an ellipsis when the footer content is too long', - className: 'Append a className to the cell, It could be a function', - headerClassName: 'Append a className to the cell in the header, It could be a function', - footerClassName: 'Append a className to the cell in the footer, It could be a function', - formatter: 'A way to format the display content', - indexMethod: 'Obsolete, please use "seqMethod"', - seqMethod: 'Only valid for type=seq, custom indexing method', - sortable: 'Whether column sorting is allowed', - sortBy: 'Only valid for sortable, 指定排序的字段（当值 formatter 格式化后，可以设置该字段，使用值进行排序）', - sortType: '排序的字段类型，比如字符串转数值等', - sortMethod: 'Only valid for sortable, the sorting method of the column, whose return value is used to determine the collation of the row', - remoteSort: 'Whether to use remote sorting', - filters: 'Configure filter conditions(note: filtering can only be used for lists, if it is a tree, filter the root node)', - filterMultiple: 'Works only for filters, filtering whether multiple selections are allowed', - filterMethod: 'Valid only for filters, the filter method for the column, whose return value is used to determine whether the row is displayed', - filterResetMethod: '只对 filters 有效，自定义筛选重置方法', - filterRecoverMethod: '只对 filters 有效，自定义筛选复原方法（使用自定义筛选时可能会用到）', - filterRender: 'Filter renderer config', - treeNode: 'Only valid for tree-config configuration, specified as the tree node', - columnKey: 'Obsolete, please use "table.column-key"', - cellType: 'Cell value type', - cellRender: 'Default renderer config', - editRender: 'Edit renderer config', - contentRender: 'Content renderer config', - params: 'Additional parameters (Can be used to store some private parameters)' - } - }, - tooltip: { - desc: { - value: 'Whether or not shown', - content: 'Content', - trigger: 'trigger type', - theme: 'The theme style', - size: 'Size', - zIndex: 'Custom style z-index (may be used for special situations, such as occlusion)', - isArrow: 'Show arrow or not', - enterable: 'Whether the mouse can go into tooltip', - leaveDelay: 'How much delay to hide tooltip after mouse move' - } - }, - grid: { - desc: { - formConfig: 'Form config', - toolbar: 'Obsolete, please use "toolbar-config"', - toolbarConfig: 'Toolbar config', - pagerConfig: 'Pager config', - zoomConfig: 'Zoom config', - proxyConfig: 'Data proxy config(based on the Promise API)', - toolbarRender: 'Toolbar renderer config' - } - }, - toolbar: { - desc: { - id: 'Obsolete', - size: 'Size', - loading: 'Loading', - import: 'Import button config("import-config" needs to be set)', - export: 'Export button config("export-config" needs to be set)', - print: 'Printing button config', - refresh: 'Refresh button config', - resizable: 'Obsolete, please use "custom-config"', - setting: 'Obsolete, please use "custom"', - custom: 'Custom column config' - } - }, - pager: { - desc: { - size: 'Size', - loading: 'Loading', - layouts: 'Custom layouts', - currentPage: 'Current page', - pageSize: 'Page size', - total: 'Total number', - pagerCount: 'Displays the number of page number buttons', - pageSizes: 'List of options for page size', - align: 'On the way', - border: 'Show border', - background: 'Show background color', - iconPrevPage: 'Custom the previous page icon', - iconJumpPrev: 'Custom jump previous page icon', - iconJumpNext: 'Custom jump next page icon', - iconNextPage: 'Custom the next page icon', - iconJumpMore: 'Custom jump more icon' - } - }, - radio: { - desc: { - value: 'v-model Binding value', - label: 'value', - size: 'Size', - disabled: 'Whether to disable', - name: 'Native name attribute' - } - }, - checkbox: { - desc: { - value: 'v-model Binding value', - size: 'Size', - disabled: 'Whether to disable', - label: 'For checkbox-group only, value', - title: 'Title', - indeterminate: 'Whether there is an indeterminate state' - } - }, - input: { - desc: { - value: 'v-model Binding value', - immediate: 'By default the input will synchronize the value in real time. This will cause delays in complex renderings and can be set to false before synchronizing the value after change', - size: 'Size', - disabled: 'Whether to disable', - prefixIcon: 'Prefix icon', - suffixIcon: 'Suffix icon' - } - }, - button: { - desc: { - content: 'Content (support internationalization)', - type: 'Type', - size: 'Size', - name: 'To identify this item', - icon: 'button icon', - status: 'Status', - disabled: 'Whether to disable', - loading: 'Loading or not', - placement: 'Fix the direction of the display drop - down panel', - transfer: 'Whether to insert the popup container into the body（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）' - } - }, - modal: { - desc: { - value: 'v-model Binding value', - loading: 'Loading or not', - id: 'Set a unique id (may be used in scenarios such as Message preventing repeated pop-ups or Storage drag state saving)', - title: 'Message title (support internationalization)', - type: 'Message type', - status: 'Only valid for type=alert | confirm | message, message status', - iconStatus: 'Custom status icon', - message: 'Please use the "content"', - content: 'Displayed text', - showHeader: 'Whether to display the head', - showFooter: 'Whether to show bottom', - lockView: 'Whether or not the page is locked does not allow any action outside the modal', - lockScroll: 'Whether the scroll bar is locked and does not allow page scrolling', - mask: 'Whether to display the mask layer', - maskClosable: 'Click the mask layer to close the modal', - escClosable: 'Whether Esc key is allowed to close the modal', - showZoom: '标题是否标显示最大化与还原按钮', - resize: '是否允许窗口边缘拖动调整窗口大小', - marginSize: '只对 resize 启用后有效，用于设置可拖动界限范围，如果为负数则允许拖动超出屏幕边界', - duration: 'Only valid for type=message, auto-closed delay, if -1 is disabled automatically closed', - size: 'Size', - width: 'The width of the modal window', - height: 'The height of the modal window', - minWidth: 'The minimum width of the modal window', - minHeight: 'The minimum height of the modal window', - top: 'Valid only for type=message, message from top', - position: 'Only valid for type=modal. The default position of the window can be set to center display', - zIndex: 'Custom style z-index (may be used for special situations, such as occlusion)', - showTitleOverflow: 'Set the title content to appear as an ellipsis when it is too long', - fullscreen: 'Default maximized display', - draggable: 'Whether to enable window dragging', - dblclickZoom: 'It is only valid for type=modal. Is it allowed to enlarge or restore the window by double-clicking the head', - remember: 'The memory function will remember the last operation state and restore the window state when the window is opened again', - destroyOnClose: 'Destroy the content when the window closes', - storage: 'If localStorage is enabled, the state dragged by the window will be saved locally (the id needs to be set)' - } - }, - form: { - desc: { - loading: 'Loading or not', - data: 'Form data', - span: 'The number of columns occupied by the grid of all items(24 columns)', - align: 'All content align', - size: 'Size', - titleAlign: 'All title align', - titleWidth: 'All title width', - titleOverflow: '所有设置标题内容过长时显示为省略号', - titleColon: 'Whether to display the title colon', - titleAsterisk: 'Show red asterisk for required fields', - rules: 'Checksum rule configuration entries' - } - }, - formItem: { - desc: { - field: 'Field name ', - title: 'Title', - span: 'The number of columns a grid occupies(24 columns)', - align: 'Content align', - titleAlign: 'Title align', - titleWidth: 'Title width', - titleOverflow: '标题内容过长时显示为省略号', - folding: 'Default folding', - visible: '默认是否显示', - visibleMethod: 'The return value of this method Function({data, property}) determines whether the item is displayed', - collapseNode: 'Collapse node', - titlePrefix: 'Title prefix config', - titleSuffix: 'Title suffix config', - resetValue: 'The default value when reset', - itemRender: 'Form item renderer config' - } - }, - select: { - desc: { - value: 'v-model Binding value', - size: 'Size', - multiple: 'Whether alternative', - placeholder: 'Placeholder for null value empty', - clearable: 'Whether to display the clear button on the right when there is a value', - disabled: 'Whether to disable', - prefixIcon: 'Prefix icon', - placement: 'Fix the direction of the display drop - down panel', - transfer: 'Whether to insert the popup container into the body' - } - }, - optgroup: { - desc: { - label: 'display content', - disabled: 'Whether to disable', - size: 'Size' - } - }, - option: { - desc: { - value: 'v-model Binding value', - label: 'display content', - disabled: 'Whether to disable', - size: 'Size' - } - }, - switch: { - desc: { - value: 'v-model Binding value', - size: 'Size', - disabled: 'Disable', - onLabel: 'Text displayed on open', - offLabel: 'Text displayed on close', - onValue: 'Open value', - offValue: 'Value on close', - onIcon: 'Icon on open', - offIcon: 'Icon on close', - onClass: 'Classname on open', - offClass: 'Classname on shutdown' - } - }, - list: { - desc: { - data: 'List data', - size: 'Size' - } - }, - pulldown: { - desc: { - data: 'List data', - size: 'Size', - disabled: 'Disable', - placement: 'Fixed display direction of drop-down panel', - transfer: 'Whether to insert the pop-up container into the body' - } - } - } - } -} diff --git a/examples/i18n/lang/zh-CN.ts b/examples/i18n/lang/zh-CN.ts deleted file mode 100644 index cfa4d93f51..0000000000 --- a/examples/i18n/lang/zh-CN.ts +++ /dev/null @@ -1,793 +0,0 @@ -export default { - app: { - aside: { - nav: { - start: '开发指南', - install: '全局安装', - quick: '快速入门', - use: '按需加载', - global: '全局参数', - icons: '全局图标', - theme: '全局主题', - i18n: '国际化', - - icon: '图标', - basics: '基础表格', - base: '基础', - size: '尺寸', - autoBreak: '自动换行', - width: '列宽', - ellipsis: '单元格溢出省略号', - tooltips: '单元格工具提示', - stripe: '斑马线条纹', - border: '边框', - round: '圆角边框', - style: '单元格样式', - compact: '紧凑样式', - dynamicStyle: '单元格动态样式', - scrollStyle: '滚动条样式', - hideHead: '隐藏头部', - resizable: '列宽拖动', - fluidHeight: '最大高度', - rowHeight: '行高', - resize: '响应式宽高', - height: '固定表头', - fixed: '固定列', - fullFixed: '固定表头和列', - group: '表头分组', - merge: '合并行或列', - seq: '序号', - headerHighlight: '高亮列', - current: '高亮行', - radio: '单选框', - checkbox: '复选框', - sort: '排序', - filter: '筛选', - empty: '空数据', - loading: '加载中', - format: '格式化内容', - html: 'HTML 标签', - data: '数据格式与字段', - - more: '复杂表格', - events: '事件绑定', - template: '自定义模板', - dynamic: '使用 v-for 动态实现', - customCheckbox: '自定义复选框', - customRadio: '自定义单选框', - sortIcon: '自定义排序图标', - customSort: '自定义列头排序', - multiSort: '多字段排序', - manualFilter: '筛选高级用法', - filterIcon: '自定义筛选图标', - customFilter: '自定义列头筛选', - span: '合并行或列', - spanRow: '合并横向树列表', - mergeCell: '合并单元格', - footer: '表尾数据', - footerSpan: '表尾合并行或列', - import: '导入', - export: '导出', - print: '打印', - customPrint: '高级打印', - fixedType: '固定类型 + 导入/导出', - contextMenu: '右键菜单', - menuPrivilege: '右键菜单 + 权限控制', - footerImmediately: '表尾 + 实时更新合计', - expandRow: '展开行', - expandRowIcon: '展开行 + 更多自定义', - expandRowLazy: '展开行 + 懒加载', - accordion: '展开行 + 手风琴效果', - toolbar: '工具栏', - customs: '显示、隐藏、折叠列', - customStorage: '自定义列 + localStorage', - customlWidthStorage: '完整自定义列 + localStorage', - search: '全表搜索', - groupBy: '行分组', - details: '弹框显示详情', - popupEdit: '弹框表单编辑', - pager: '分页', - pageIcon: '分页 + 自定义图标', - rangeSelect: '复选框的范围选中', - tabs: '多页签切换', - keepAlives: '显示隐藏 + keep-alive', - - grid: '配置式表格', - reverse: '反转表格', - proxy: '数据代理', - proxyPage: '数据代理 + 分页', - formProxy: '数据代理 + 表单', - configProxy: '进阶封装', - fullQuery: '完整查询', - customToolbar: '自定义工具栏', - toolbarIcon: '自定义工具栏按钮图标', - fullscreen: '全屏缩放', - dynamicColumn: '实现可配置动态列', - baseTree: '基础树', - lazyTree: '懒加载树', - treeLazyEdit: '懒加载树 + 可编辑', - crudTreeToolbar: '树表格 + 工具栏', - crud: '增删改查', - - tree: '树形表格', - treeNormal: '普通树', - customIcon: '更多自定义', - expandTreeLazy: '树形展开行懒加载', - treeSearch: '深层查找', - treeSort: '深层排序', - groupSummary: '分组汇总', - groupSummaryCount: '分组汇总合计', - edit: '可编辑', - crudToolbar: '增删改查 + 工具栏', - lazy: '懒加载', - lazyMenu: '懒加载 + 右键菜单', - lazyEdit: '懒加载 + 可编辑', - treeLine: '连接线', - full: '完整功能', - - virtualTree: '虚拟树表格', - big: '虚拟滚动', - - scroll: '虚拟滚动', - bigData: '虚拟滚动', - scrollMode: '滚动模式', - scrollRows: '纵向', - scrollFullRows: '纵向 + 复杂渲染', - scrollCols: '横向', - scrollFullCols: '横向&纵向 + 复杂渲染', - moveHighlight: '键盘移动高亮行', - scrollTree: '虚拟树', - bigTree: '树形纵向', - treeRows: '树形纵向', - treeCols: '树形横向&纵向', - pageScroll: '滚动分页', - infiniteScroll: '无限滚动', - partialLoad: '局部加载', - fullPartialLoad: '完整的局部加载', - - editable: '编辑表格', - popupForm: '弹框编辑', - manual: '手动触发', - click: '点击触发', - dblclick: '双击触发', - selectContent: '选中内容', - autoClear: '关闭自动清除', - cellPlaceholder: '单元格占位符', - insert: '插入数据', - delete: '删除数据', - revert: '还原数据', - status: '数据状态', - partialUpdate: '局部更新', - cellDisable: '禁用编辑 + 单元格', - rowDisable: '禁用编辑 + 行', - cellValid: '数据校验 + 单元格', - rowValid: '数据校验 + 行', - forceCellValid: '数据校验 cell + 强制锁定', - forceRowValid: '数据校验 row + 强制锁定', - highlightCell: '高亮编辑', - keyboard: '键盘导航', - keyboardEdit: '键盘导航 + 重写默认编辑行为', - dataCount: '数据联动计算', - uniqueSelect: '唯一下拉选项', - cascadingSelect: '联动下拉选项', - realtimeSave: '实时保存', - upload: '文件上传', - - excel: '更多实现', - cell: '单元格', - - bad: '糟糕的用法', - badEdit: '全表渲染为编辑状态', - badLineHeight: '动态行高与虚拟滚动的取舍', - badNonsupport: '不被支持的用法', - - module: '功能模块', - button: '按钮', - input: '输入框', - textarea: '文本域', - select: '下拉框', - modal: '弹窗', - drawer: '抽屉', - tooltip: '工具提示', - form: '表单', - switch: '开关', - list: '虚拟列表', - pulldown: '下拉容器', - file: '文件操作', - readFile: '读取文件', - - other: '集成第三方库', - elementRender: 'element-plus -> 自定义渲染', - iviewRender: 'iview -> 自定义渲染', - antd: 'ant-design-vue -> 自定义渲染', - elementUpload: 'element-plus -> 附件上传', - sortablejsRow: 'sortablejs -> 行拖拽', - sortablejsColumn: 'sortablejs -> 列拖拽', - xlsxRender: 'xlsx -> 导入与导出', - - plugin: '扩展插件库', - elementPlugin: 'plugin-element 基本配置', - elementFilterPlugin: 'plugin-element 筛选配置', - elementPluginMore: 'plugin-element 更多配置', - iviewPlugin: 'plugin-iview 基本配置', - iviewFilter: 'plugin-iview 筛选配置', - iviewPluginMore: 'plugin-iview 更多配置', - antdPlugin: 'plugin-antd 基本配置', - antdFilter: 'plugin-antd 筛选配置', - antdPluginMore: 'plugin-antd 更多配置', - spanPlugin: '单元格选中合并', - shortcutKeyPlugin: 'plugin-shortcut-key 快捷键设置', - chartsPlugin: 'plugin-charts 图表工具', - exportXLSXPlugin: 'plugin-export 导入/导出 xlsx', - exportPDFPlugin: 'plugin-export 导出 pdf', - rendererPlugin: 'plugin-renderer 更多渲染', - menusPlugin: 'plugin-menus 右键菜单集', - treeRowPlugin: 'plugin-virtual-tree 虚拟树', - treeColPlugin: 'plugin-virtual-tree 横向与纵向', - - formats: '(全局复用) 格式化', - commands: '(全局复用) 指令注册', - menus: '(全局复用) 右键菜单', - - renderer: '(高级用法) 渲染器', - rendererFilter: '筛选渲染', - rendererDefault: '单元格渲染', - rendererEdit: '可编辑渲染', - rendererExpand: '内容渲染', - rendererToolbar: '工具栏渲染', - rendererForm: '表单渲染', - rendererEmpty: '空数据渲染', - - interceptor: '(高级用法) 事件拦截', - - optimize: '优化建议', - optimizeScroller: '虚拟滚动优化', - optimizeEdit: '可编辑优化', - - api: 'API', - vxeTable: 'vxe-table', - vxeTableColgroup: 'vxe-colgroup', - vxeTableColumn: 'vxe-column', - vxeGrid: 'vxe-grid', - vxeVirtualTree: 'vxe-virtual-tree', - vxeExcel: 'vxe-excel', - vxeToolbar: 'vxe-toolbar', - vxePager: 'vxe-pager', - vxeRadio: 'vxe-radio', - vxeRadioGroup: 'vxe-radio-group', - vxeRadioButton: 'vxe-radio-button', - vxeCheckbox: 'vxe-checkbox', - vxeCheckboxGroup: 'vxe-checkbox-group', - vxeInput: 'vxe-input', - vxeTextarea: 'vxe-textarea', - vxeSelect: 'vxe-select', - vxeOptgroup: 'vxe-optgroup', - vxeOption: 'vxe-option', - vxeButton: 'vxe-button', - vxeTooltip: 'vxe-tooltip', - vxeModal: 'vxe-modal', - vxeForm: 'vxe-form', - vxeFormItem: 'vxe-form-item', - vxeFormGather: 'vxe-form-gather', - vxeSwitch: 'vxe-switch', - vxeList: 'vxe-list', - vxePulldown: 'vxe-pulldown' - } - }, - header: { - label: { - donation: '支持我们', - support: '付费插件' - } - }, - body: { - button: { - viewCode: '查看代码', - runDemo: '在线运行', - showCode: '显示代码', - refresh: '刷新', - insert: '新增', - save: '保存', - markCancel: '标记/取消', - deleteSelectedRecords: '删除选中' - }, - label: { - on: '开', - off: '关', - plan: '计划', - through: '通过', - copy: '复制', - cut: '剪贴', - paste: '粘贴', - delete: '删除', - sort: '排序', - filter: '筛选', - translations: '语言', - version: '版本', - name: '名字', - age: '年龄', - sex: '性别', - search: '查询', - reset: '重置', - createTime: '创建时间', - updateTime: '更新时间', - stableVersion: '稳定版', - latestVersion: '最新版' - }, - valid: { - rName: '名称必须填写' - }, - msg: { - error: '错误提示', - copyToClipboard: '已复制到剪贴板！' - }, - other: { - v1: 'v1+ (vue 2.6+ 停止维护) ~ 2020-04 停止更新', - v2: 'v2+ (vue 2.6+ 旧版本) ~ 2021-12 停止更新', - v3: 'v3+ (vue 2.6+ 稳定版)', - v3d5: '3.5+ (vue 2.6+ 粘性表格)', - v4: 'v4+ (vue 3.0+ 最新版)', - v4d5: '4.5+ (vue 3.0+ 粘性表格)', - plan: { - v1: 'v1 基于 vue2.6+，支持所有主流的浏览器，实现表格的一切实用的功能', - v2: 'v2 基于 vue2.6+，支持所有主流的浏览器，同时兼具功能与性能', - v3: 'v3 基于 vue2.6+，支持现代浏览器并部分兼容 IE11，提升渲染性能', - v4: 'v4 基于 vue3.0+，只支持现代浏览器，不支持 IE' - }, - compatibility: '兼容性变动', - releases: '更新日志', - donation: '支持我们', - issuesTitle: '该群供大家交流問題，如果群人数已满，将会不定期剔除不活跃的
，如果有 bug 请通过 issues 反馈', - newFunc: '由于作者很忙，后续有时间可能会支持该功能！', - newDevelopment: '该版本正在重构中，敬请期待！' - }, - search: { - searchPlaceholder: '文档搜索', - noDataPrefix: '找不到与 “', - noDataSuffix: '” 相关的结果！' - }, - support: { - title: '该付费技术群用于快速解决使用过程中遇到的各种问题。' - }, - demo: { - start: { - i18n: { - i18nTitle: '如果希望使用指定语言，则需要进行多语言设置。以中/英文为例', - translate: '集成国际化', - translateTitle: '若希望在项目中支持全局自动翻译，可以通过全局参数开启（将对列头、校验提示..进行自动翻译）', - findError: '发现错误？想参与翻译？' - } - } - } - }, - footer: { - donation: '支持我们', - donationDesc: 'vxe-table 是 MIT 开源的，使用完全免费。为了使项目能够健康持续的发展下去，您可以通过下方扫码来支持作者。' - }, - api: { - apiSearch: 'API 搜索', - title: { - prop: '属性', - desc: '说明', - type: '类型 / 返回类型', - enum: '可选值', - defVal: '默认值 / 参数', - version: '兼容性', - props: '参数', - events: '事件', - slots: '插槽', - methods: '方法' - }, - table: { - desc: { - id: '唯一标识（被某些特定的功能所依赖）', - data: '表格数据（与 loadData 行为一致，更新数据是不会重置状态）', - columns: '列配置', - customs: '即将废弃', - height: '表格的高度；支持铺满父容器或者固定高度，如果设置 auto 为铺满父容器（如果设置为 auto，则必须确保存在父节点且不允许存在相邻元素）', - maxHeight: '表格的最大高度', - syncResize: '自动跟随某个属性的变化去重新计算表格，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换时可能会用到）', - autoResize: '自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到）', - resizable: '所有的列是否允许拖动列宽调整大小', - stripe: '是否带有斑马纹（需要注意的是，在可编辑表格场景下，临时插入的数据不会有斑马纹样式）', - border: '是否带有边框', - round: '是否为圆角边框', - size: '表格的尺寸', - fit: '所有列的宽度是否自撑开（可能会被废弃的参数，不要使用）', - loading: '表格是否显示加载中', - align: '所有的列对齐方式', - headerAlign: '所有的表头列的对齐方式', - footerAlign: '所有的表尾列的对齐方式', - showHeader: '是否显示表头', - startIndex: '即将废弃，请使用 seq-config.startIndex', - highlightCurrentRow: '是否要高亮当前行', - highlightHoverRow: '鼠标移到行是否要高亮显示', - highlightCurrentColumn: '是否要高亮当前列', - highlightHoverColumn: '鼠标移到列是否要高亮显示', - highlightCell: '只对 edit-config 配置时有效，是否在编辑时高亮单元格边框（只支持部分）', - rowClassName: '给行附加 className', - cellClassName: '给单元格附加 className', - headerRowClassName: '给表头的行附加 className', - headerCellClassName: '给表头的单元格附加 className', - footerRowClassName: '给表尾的行附加 className', - footerCellClassName: '给表尾的单元格附加 className', - cellStyle: '给单元格附加样式', - headerCellStyle: '给表头单元格附加样式', - footerCellStyle: '给表尾单元格附加样式', - rowStyle: '给行附加样式，也可以是函数', - headerRowStyle: '给表头行附加样式', - footerRowStyle: '给表尾行附加样式', - showFooter: '是否显示表尾', - footerMethod: '表尾的数据获取方法，返回一个二维数组', - mergeCells: '临时合并指定的单元格 (不能用于展开行，不建议用于固定列、树形结构)', - mergeFooterItems: '临时合并表尾 (不能用于展开行，不建议用于固定列、树形结构)', - spanMethod: '自定义合并函数，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)', - footerSpanMethod: '表尾合并行或列，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)', - showOverflow: '设置所有内容过长时显示为省略号（如果是固定列建议设置该值，提升渲染速度）', - showHeaderOverflow: '设置表头所有内容过长时显示为省略号', - showAllOverflow: '即将废弃，请使用 show-overflow', - showHeaderAllOverflow: '即将废弃，请使用 show-header-overflow', - showFooterOverflow: '设置表尾所有内容过长时显示为省略号', - sortMethod: '即将废弃，请使用 sort-config.sortMethod', - remoteSort: '即将废弃，请使用 sort-config.remote', - remoteFilter: '即将废弃，请使用 filter-config.remote', - columnWidth: '所有列宽度', - columnMinWidth: '所有最小列宽度；会自动将剩余空间按比例分配', - columnKey: '是否需要为每一列的 VNode 设置 key 属性（非特殊情况下不需要使用）', - rowKey: '是否需要为每一行的 VNode 设置 key 属性（非特殊情况下没必要设置）', - rowId: '自定义行数据唯一主键的字段名（行数据必须要有唯一主键，默认自动生成）', - keepSource: '保持原始值的状态，被某些功能所依赖，比如编辑状态、还原数据等（开启后影响性能，具体取决于数据量）', - zIndex: '自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）', - resizableConfig: '列宽拖动配置项', - seqConfig: '序号配置项', - sortConfig: '排序配置项', - filterConfig: '筛选配置项', - radioConfig: '单选框配置项', - exportConfig: '导出配置项', - importConfig: '导入配置项', - printConfig: '打印配置项', - selectConfig: '即将废弃，请使用 checkbox-config', - checkboxConfig: '复选框配置项', - tooltipConfig: 'tooltip 配置项', - expandConfig: '展开行配置项（不支持虚拟滚动）', - treeConfig: '树形结构配置项', - menuConfig: '右键菜单配置项', - contextMenu: '即将废弃，请使用 menu-config', - clipConfig: '复制/粘贴配置项', - fnrConfig: '查找/替换配置项', - mouseConfig: '鼠标配置项', - areaConfig: '区域选取配置项', - keyboardConfig: '按键配置项', - editConfig: '可编辑配置项', - validConfig: '校验配置项', - editRules: '校验规则配置项', - emptyText: '空数据时显示的内容', - emptyRender: '空内容渲染配置项，empty-render 的优先级大于 empty-text', - customConfig: '自定义列配置项', - optimization: '即将废弃', - - params: '自定义参数（可以用来存放一些自定义的数据）', - - empty: '空数据时显示的文本内容', - - currentChange: '只对 highlightCurrentRow 有效，当手动选中行并且值发生改变时触发的事件', - radioChange: '只对 type=radio 有效，当手动勾选并且值发生改变时触发的事件', - selectChange: '即将废弃，请使用 checkbox-change', - checkboxChange: '只对 type=checkbox 有效，当手动勾选并且值发生改变时触发的事件', - selectAll: '即将废弃，请使用 checkbox-all', - checkboxAll: '只对 type=checkbox 有效，当手动勾选全选时触发的事件', - cellClick: '单元格被点击时会触发该事件', - cellDblclick: '单元格被双击时会触发该事件', - cellMenu: '只对 menu-config 配置时有效，单元格被鼠标右键时触发该事件', - cellContextmenu: '即将废弃，请使用 cell-menu', - headerCellClick: '表头单元格被点击时会触发该事件', - headerCellDblclick: '表头单元格被双击时会触发该事件', - headerCellMenu: '只对 menu-config 配置时有效，表头单元格被鼠标右键时触发该事件', - headerCellContextmenu: '即将废弃，请使用 header-cell-menu', - footerCellClick: '表尾单元格被点击时会触发该事件', - footerCellDblclick: '表尾单元格被双击时会触发该事件', - footerCellMenu: '只对 menu-config 配置时有效，表尾单元格被鼠标右键时触发该事件', - footerCellContextmenu: '即将废弃，请使用 footer-cell-menu', - cellMouseenter: '只对 tooltip-config 配置时有效，当鼠标移动到单元格时会触发该事件', - cellMouseleave: '只对 tooltip-config 配置时有效，当鼠标移开单元格时会触发该事件', - sortChange: '当排序条件发生变化时会触发该事件', - filterChange: '当筛选条件发生变化时会触发该事件', - resizableChange: '当列宽拖动发生变化时会触发该事件', - toggleExpandChange: '当行展开或收起时会触发该事件', - toggleTreeChange: '当树节点展开或收起时会触发该事件', - menuClick: '只对 menu-config 配置时有效，当点击右键菜单时会触发该事件', - contextMenuClick: '即将废弃，请使用 menu-click', - cellSelected: '只对 mouse-config.selected 配置时有效，单元格被选中时会触发该事件', - editClosed: '只对 edit-config 配置时有效，单元格编辑状态下被关闭时会触发该事件', - editActived: '只对 edit-config 配置时有效，单元格被激活编辑时会触发该事件', - editDisabled: '只对 edit-config 配置时有效，当单元格激活时如果是禁用状态时会触发该事件', - validError: '只对 edit-rules 配置时有效，当数据校验不通过时会触发该事件', - scroll: '表格滚动时会触发该事件' - } - }, - tableColumn: { - desc: { - type: '列的类型', - index: '即将废弃，请使用 seq', - seq: '序号', - selection: '即将废弃，请使用 checkbox', - checkbox: '复选框', - radio: '单选框', - expand: '展开行', - html: 'HTML 标签（动态渲染任意 HTML 是非常危险的，很容易导致 XSS 攻击，应该确保内容是可信的）', - prop: '即将废弃，请使用 field', - visible: '默认是否显示', - field: '列字段名（注：属性层级越深，渲染性能就越差，例如：aa.bb.cc.dd.ee）', - label: '即将废弃，请使用 title', - title: '列标题（支持开启国际化）', - width: '列宽度（如果为空则均匀分配剩余宽度，如果全部列固定了，可能会存在宽屏下不会铺满，可以配合 "%" 或者 "min-width" 布局）', - minWidth: '最小列宽度；会自动将剩余空间按比例分配', - resizable: '列是否允许拖动列宽调整大小', - fixed: '将列固定在左侧或者右侧（注意：固定列应该放在左右两侧的位置）', - align: '列对齐方式', - headerAlign: '表头列的对齐方式', - footerAlign: '表尾列的对齐方式', - showOverflow: '当内容过长时显示为省略号', - showHeaderOverflow: '当表头内容过长时显示为省略号', - showFooterOverflow: '当表尾内容过长时显示为省略号', - className: '给单元格附加 className', - headerClassName: '给表头的单元格附加 className', - footerClassName: '给表尾的单元格附加 className', - formatter: '格式化显示内容', - indexMethod: '即将废弃，请使用 seqMethod', - seqMethod: '只对 type=seq 有效，自定义索引方法', - sortable: '是否允许列排序', - sortBy: '只对 sortable 有效，指定排序的字段（当值 formatter 格式化后，可以设置该字段，使用值进行排序）', - sortType: '排序的字段类型，比如字符串转数值等', - sortMethod: '只对 sortable 有效，列的排序方法，该方法的返回值用来决定该行的排序规则', - remoteSort: '是否使用服务端排序，如果设置为 true 则不会对数据进行处理', - filters: '配置筛选条件（注：筛选只能用于列表，如果是树结构则过滤根节点）', - filterMultiple: '只对 filters 有效，筛选是否允许多选', - filterMethod: '只对 filters 有效，列的筛选方法，该方法的返回值用来决定该行是否显示', - filterResetMethod: '只对 filters 有效，自定义筛选重置方法', - filterRecoverMethod: '只对 filters 有效，自定义筛选复原方法（使用自定义筛选时可能会用到）', - filterRender: '筛选渲染器配置项', - treeNode: '只对 tree-config 配置时有效，指定为树节点', - columnKey: '即将废弃，请使用 table.column-key', - cellType: '只对特定功能有效，单元格值类型（例如：导出数据类型设置）', - cellRender: '默认的渲染器配置项', - editRender: '可编辑渲染器配置项', - contentRender: '内容渲染配置项', - params: '额外的参数（可以用来存放一些私有参数）' - } - }, - tooltip: { - desc: { - value: '是否显示', - content: '显示内容', - trigger: '触发方式', - theme: '主题样式', - size: '尺寸', - zIndex: '自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）', - isArrow: '是否显示箭头', - enterable: '鼠标是否可进入到 tooltip 中', - leaveDelay: '鼠标移出后延时多少才隐藏 tooltip' - } - }, - grid: { - desc: { - formConfig: '表单配置项', - toolbar: '即将废弃，请使用 toolbar-config', - toolbarConfig: '工具栏配置', - pagerConfig: '分页配置项', - zoomConfig: '缩放配置项', - proxyConfig: '数据代理配置项（基于 Promise API）', - toolbarRender: '工具栏渲染器配置项' - } - }, - toolbar: { - desc: { - id: '即将废弃', - size: '尺寸', - loading: '是否加载中', - import: '导入按钮配置（需要设置 "import-config"）', - export: '导出按钮配置（需要设置 "export-config"）', - print: '打印按钮配置', - refresh: '刷新按钮配置', - resizable: '即将废弃，请使用 custom-config', - setting: '即将废弃，请使用 custom', - custom: '自定义列配置' - } - }, - pager: { - desc: { - size: '尺寸', - loading: '是否加载中', - layouts: '自定义布局', - currentPage: '当前页', - pageSize: '每页大小', - total: '总条数', - pagerCount: '显示页码按钮的数量', - pageSizes: '每页大小选项列表', - align: '对齐方式', - border: '带边框', - background: '带背景颜色', - iconPrevPage: '自定义上一页图标', - iconJumpPrev: '自定义向上跳页图标', - iconJumpNext: '自定义向下跳页图标', - iconNextPage: '自定义下一页图标', - iconJumpMore: '自定义跳页显示图标' - } - }, - radio: { - desc: { - value: 'v-model 绑定值', - label: '值', - size: '尺寸', - disabled: '是否禁用', - name: '原生 name 属性' - } - }, - checkbox: { - desc: { - value: 'v-model 绑定值', - size: '尺寸', - disabled: '是否禁用', - label: '只对 checkbox-group 有效，值', - title: '标题', - indeterminate: '是否不确定状态' - } - }, - input: { - desc: { - value: 'v-model 绑定值', - immediate: '默认情况下输入会实时同步值，当在复杂渲染时会导致卡顿，可以设置为 false 在 change 之后才同步值', - size: '尺寸', - disabled: '是否禁用', - prefixIcon: '头部图标', - suffixIcon: '尾部图标' - } - }, - button: { - desc: { - content: '内容（支持开启国际化）', - type: '类型', - size: '尺寸', - name: '用来标识这一项', - icon: '前缀图标', - status: '按钮的图标', - disabled: '是否禁用', - loading: '是否加载中', - placement: '固定显示下拉面板的方向', - transfer: '是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）' - } - }, - modal: { - desc: { - value: 'v-model 绑定值', - loading: '是否加载中', - id: '设置唯一的 id（对于 Message 防止重复弹出 或 Storage 拖动状态保存等场景可能会用到）', - title: '窗口的标题（支持开启国际化）', - type: '窗口类型', - status: '只对 type=alert | confirm | message 有效，消息状态', - iconStatus: '自定义状态图标', - message: '请使用 content', - content: '显示的文本（支持开启国际化）', - showHeader: '是否显示头部', - showFooter: '是否显示底部', - lockView: '是否锁住页面，不允许窗口之外的任何操作', - lockScroll: '是否锁住滚动条，不允许页面滚动', - mask: '是否显示遮罩层', - maskClosable: '是否允许点击遮罩层关闭窗口', - escClosable: '是否允许按 Esc 键关闭窗口', - showZoom: '标题是否标显示最大化与还原按钮', - resize: '是否允许窗口边缘拖动调整窗口大小', - marginSize: '只对 resize 启用后有效，用于设置可拖动界限范围，如果为负数则允许拖动超出屏幕边界', - duration: '只对 type=message 有效，自动关闭的延时，如果为 -1 禁用自动关闭', - size: '尺寸', - width: '窗口的宽度', - height: '窗口的高度', - minWidth: '窗口的最小宽度', - minHeight: '窗口的最小高度', - top: '只对 type=message 有效，消息距离顶部的位置', - position: '只对 type=modal 有效，窗口的默认位置，可以设置为 center 居中显示', - zIndex: '自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）', - showTitleOverflow: '设置标题内容过长时显示为省略号', - fullscreen: '默认最大化显示', - draggable: '是否启用窗口拖动', - dblclickZoom: '只对 type=modal 有效，是否允许通过双击头部放大或还原窗口', - remember: '记忆功能，会记住最后操作状态，再次打开窗口时还原窗口状态', - destroyOnClose: '在窗口关闭时销毁内容', - storage: '是否启用 localStorage 本地保存，会将窗口拖动的状态保存到本地（需要有 id）' - } - }, - form: { - desc: { - loading: '是否加载中', - data: '表单数据', - span: '所有项的栅格占据的列数（共 24 分栏）', - align: '所有项的内容对齐方式', - size: '尺寸', - titleAlign: '所有项的标题对齐方式', - titleWidth: '所有项的标题宽度', - titleOverflow: '所有设置标题内容过长时显示为省略号', - titleColon: '是否显示标题冒号', - titleAsterisk: '是否显示必填字段的红色星号', - rules: '校验规则配置项' - } - }, - formItem: { - desc: { - field: '字段名', - title: '标题（支持开启国际化）', - span: '栅格占据的列数（共 24 分栏）', - align: '内容对齐方式', - titleAlign: '标题对齐方式', - titleWidth: '标题宽度', - titleOverflow: '标题内容过长时显示为省略号', - folding: '默认收起', - visible: '默认是否显示', - visibleMethod: '该方法的返回值用来决定该项是否显示', - collapseNode: '折叠节点', - titlePrefix: '前缀配置项', - titleSuffix: '后缀配置项', - resetValue: '重置时的默认值', - itemRender: '项渲染器配置项' - } - }, - select: { - desc: { - value: 'v-model 绑定值', - size: '尺寸', - multiple: '是否多选', - placeholder: '空值显示的占位符', - clearable: '当有值时，是否在右侧显示清除按钮', - disabled: '是否禁用', - prefixIcon: '头部图标', - placement: '固定显示下拉面板的方向', - transfer: '是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）' - } - }, - optgroup: { - desc: { - label: '显示内容', - disabled: '是否禁用', - size: '尺寸' - } - }, - option: { - desc: { - value: 'v-model 绑定值', - label: '显示内容', - disabled: '是否禁用', - size: '尺寸' - } - }, - switch: { - desc: { - value: 'v-model 绑定值', - size: '尺寸', - disabled: '是否禁用', - onLabel: '打开时显示的文字', - offLabel: '关闭时显示的文字', - onValue: '打开时的值', - offValue: '关闭时的值', - onIcon: '打开时的图标', - offIcon: '关闭时的图标', - onClass: '打开时的 className', - offClass: '关闭时的 className' - } - }, - list: { - desc: { - data: '列表数据', - size: '尺寸' - } - }, - pulldown: { - desc: { - data: '列表数据', - size: '尺寸', - disabled: '是否禁用', - placement: '固定显示下拉面板的方向', - transfer: '是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）' - } - } - } - } -} diff --git a/examples/i18n/lang/zh-TC.ts b/examples/i18n/lang/zh-TC.ts deleted file mode 100644 index e7ddea4ebe..0000000000 --- a/examples/i18n/lang/zh-TC.ts +++ /dev/null @@ -1,793 +0,0 @@ -export default { - app: { - aside: { - nav: { - start: '開發指南', - install: '全局安装', - quick: '快速入门', - use: '按需加载', - global: '全域參數', - icons: '全域圖標', - theme: '全域主題', - i18n: '國際化', - - icon: '圖標', - basics: '基礎表格', - base: '基础', - size: '尺寸', - autoBreak: '自动换行', - width: '列宽', - ellipsis: '单元格溢出省略号', - tooltips: '单元格工具提示', - stripe: '斑马线条纹', - border: '边框', - round: '圆角边框', - style: '单元格样式', - compact: '紧凑样式', - dynamicStyle: '单元格动态样式', - scrollStyle: '滚动条样式', - hideHead: '隐藏头部', - resizable: '列宽拖动', - fluidHeight: '最大高度', - rowHeight: '行高', - resize: '响应式宽高', - height: '固定表头', - fixed: '固定列', - fullFixed: '固定表头和列', - group: '表头分组', - merge: '合并行或列', - seq: '序号', - headerHighlight: '高亮列', - current: '高亮行', - radio: '单选框', - checkbox: '复选框', - sort: '排序', - filter: '筛选', - empty: '空数据', - loading: '加载中', - format: '格式化内容', - html: 'HTML 标签', - data: '数据格式与字段', - - more: '複雜表格', - events: '事件绑定', - template: '自定义模板', - dynamic: '使用 v-for 动态实现', - customCheckbox: '自定义复选框', - customRadio: '自定义单选框', - sortIcon: '自定义排序图标', - customSort: '自定义列头排序', - multiSort: '多字段排序', - manualFilter: '筛选高级用法', - filterIcon: '自定义筛选图标', - customFilter: '自定义列头筛选', - span: '合并行或列', - spanRow: '合并横向树列表', - mergeCell: '合并单元格', - footer: '表尾数据', - footerSpan: '表尾合并行或列', - import: '导入', - export: '导出', - print: '打印', - customPrint: '高级打印', - fixedType: '固定类型 + 导入/导出', - contextMenu: '右键菜单', - menuPrivilege: '右键菜单 + 权限控制', - footerImmediately: '表尾 + 实时更新合计', - expandRow: '展开行', - expandRowIcon: '展开行 + 更多自定义', - expandRowLazy: '展开行 + 懒加载', - accordion: '展开行 + 手风琴效果', - toolbar: '工具栏', - customs: '显示、隐藏、折叠列', - customStorage: '自定义列 + localStorage', - customlWidthStorage: '完整自定义列 + localStorage', - search: '全表搜索', - groupBy: '行分组', - details: '弹框显示详情', - popupEdit: '弹框表单编辑', - pager: '分页', - pageIcon: '分页 + 自定义图标', - rangeSelect: '复选框的范围选中', - tabs: '多页签切换', - keepAlives: '显示隐藏 + keep-alive', - - grid: '高級表格', - reverse: '反转表格', - proxy: '数据代理', - proxyPage: '数据代理 + 分页', - formProxy: '数据代理 + 表单', - configProxy: '进阶封装', - fullQuery: '完整查询', - customToolbar: '自定义工具栏', - toolbarIcon: '自定义工具栏按钮图标', - fullscreen: '全屏缩放', - dynamicColumn: '实现可配置动态列', - baseTree: '基础树', - lazyTree: '懒加载树', - treeLazyEdit: '懒加载树 + 可编辑', - crudTreeToolbar: '树表格 + 工具栏', - crud: '增删改查', - - tree: '樹形表格', - treeNormal: '普通树', - customIcon: '更多自定义', - expandTreeLazy: '树形展开行懒加载', - treeSearch: '深层查找', - treeSort: '深层排序', - groupSummary: '分组汇总', - groupSummaryCount: '分组汇总合计', - edit: '可编辑', - crudToolbar: '增删改查 + 工具栏', - lazy: '懒加载', - lazyMenu: '懒加载 + 右键菜单', - lazyEdit: '懒加载 + 可编辑', - treeLine: '连接线', - full: '完整功能', - - virtualTree: '虛擬樹表格', - big: '虚拟滚动', - - scroll: '虚拟滚动', - bigData: '虚拟滚动', - scrollMode: '滚动模式', - scrollRows: '纵向', - scrollFullRows: '纵向 + 复杂渲染', - scrollCols: '横向', - scrollFullCols: '横向&纵向 + 复杂渲染', - moveHighlight: '键盘移动高亮行', - scrollTree: '虚拟树', - bigTree: '树形纵向', - treeRows: '树形纵向', - treeCols: '树形横向&纵向', - pageScroll: '滚动分页', - infiniteScroll: '无限滚动', - partialLoad: '局部加载', - fullPartialLoad: '完整的局部加载', - - editable: '編輯表格', - popupForm: '弹框编辑', - manual: '手动触发', - click: '点击触发', - dblclick: '双击触发', - selectContent: '选中内容', - autoClear: '关闭自动清除', - cellPlaceholder: '单元格占位符', - insert: '插入数据', - delete: '删除数据', - revert: '还原数据', - status: '数据状态', - partialUpdate: '局部更新', - cellDisable: '禁用编辑 + 单元格', - rowDisable: '禁用编辑 + 行', - cellValid: '数据校验 + 单元格', - rowValid: '数据校验 + 行', - forceCellValid: '数据校验 cell + 强制锁定', - forceRowValid: '数据校验 row + 强制锁定', - highlightCell: '高亮编辑', - keyboard: '键盘导航', - keyboardEdit: '键盘导航 + 重写默认编辑行为', - dataCount: '数据联动计算', - uniqueSelect: '唯一下拉选项', - cascadingSelect: '联动下拉选项', - realtimeSave: '实时保存', - upload: '文件上传', - - excel: '更多实现', - cell: '单元格', - - bad: '糟糕的用法', - badEdit: '全表渲染为编辑状态', - badLineHeight: '动态行高与虚拟滚动的取舍', - badNonsupport: '不被支持的用法', - - module: '功能模組', - button: '按钮', - input: '输入框', - textarea: '文本域', - select: '下拉框', - modal: '弹窗', - drawer: '抽屉', - tooltip: '工具提示', - form: '表单', - switch: '开关', - list: '虚拟列表', - pulldown: '下拉容器', - file: '文件操作', - readFile: '读取文件', - - other: '集成協力廠商庫', - elementRender: 'element-plus -> 自定义渲染', - iviewRender: 'iview -> 自定义渲染', - antd: 'ant-design-vue -> 自定义渲染', - elementUpload: 'element-plus -> 附件上传', - sortablejsRow: 'sortablejs -> 行拖拽', - sortablejsColumn: 'sortablejs -> 列拖拽', - xlsxRender: 'xlsx -> 导入与导出', - - plugin: '擴展挿件庫', - elementPlugin: 'plugin-element 基本配置', - elementFilterPlugin: 'plugin-element 筛选配置', - elementPluginMore: 'plugin-element 更多配置', - iviewPlugin: 'plugin-iview 基本配置', - iviewFilter: 'plugin-iview 筛选配置', - iviewPluginMore: 'plugin-iview 更多配置', - antdPlugin: 'plugin-antd 基本配置', - antdFilter: 'plugin-antd 筛选配置', - antdPluginMore: 'plugin-antd 更多配置', - spanPlugin: '单元格选中合并', - shortcutKeyPlugin: 'plugin-shortcut-key 快捷键设置', - chartsPlugin: 'plugin-charts 图表工具', - exportXLSXPlugin: 'plugin-export 导入/导出 xlsx', - exportPDFPlugin: 'plugin-export 导出 pdf', - rendererPlugin: 'plugin-renderer 更多渲染', - menusPlugin: 'plugin-menus 右键菜单集', - treeRowPlugin: 'plugin-virtual-tree 虚拟树', - treeColPlugin: 'plugin-virtual-tree 横向与纵向', - - formats: '(全局) 格式化', - commands: '(全局) 指令注册', - menus: '(全局) 右键菜单', - - renderer: '(高级用法) 渲染器', - rendererFilter: '筛选渲染', - rendererDefault: '单元格渲染', - rendererEdit: '可编辑渲染', - rendererExpand: '内容渲染', - rendererToolbar: '工具栏渲染', - rendererForm: '表单渲染', - rendererEmpty: '空数据渲染', - - interceptor: '(高级用法) 事件拦截', - - optimize: '优化建议', - optimizeScroller: '虚拟滚动优化', - optimizeEdit: '可编辑优化', - - api: 'API', - vxeTable: 'vxe-table', - vxeTableColgroup: 'vxe-colgroup', - vxeTableColumn: 'vxe-column', - vxeGrid: 'vxe-grid', - vxeVirtualTree: 'vxe-virtual-tree', - vxeExcel: 'vxe-excel', - vxeToolbar: 'vxe-toolbar', - vxePager: 'vxe-pager', - vxeRadio: 'vxe-radio', - vxeRadioGroup: 'vxe-radio-group', - vxeRadioButton: 'vxe-radio-button', - vxeCheckbox: 'vxe-checkbox', - vxeCheckboxGroup: 'vxe-checkbox-group', - vxeInput: 'vxe-input', - vxeTextarea: 'vxe-textarea', - vxeSelect: 'vxe-select', - vxeOptgroup: 'vxe-optgroup', - vxeOption: 'vxe-option', - vxeButton: 'vxe-button', - vxeTooltip: 'vxe-tooltip', - vxeModal: 'vxe-modal', - vxeForm: 'vxe-form', - vxeFormItem: 'vxe-form-item', - vxeFormGather: 'vxe-form-gather', - vxeSwitch: 'vxe-switch', - vxeList: 'vxe-list', - vxePulldown: 'vxe-pulldown' - } - }, - header: { - label: { - donation: '支持我们', - support: '付费插件' - } - }, - body: { - button: { - viewCode: '查看代码', - runDemo: '在线运行', - showCode: '显示代码', - refresh: '刷新', - insert: '新增', - save: '保存', - markCancel: '标记/取消', - deleteSelectedRecords: '删除选中' - }, - label: { - on: '开', - off: '关', - plan: '计划', - through: '通過', - copy: '複製', - cut: '剪貼', - paste: '粘貼', - delete: '删除', - sort: '排序', - filter: '篩選', - translations: '語言', - version: '版本', - name: '名字', - age: '年齡', - sex: '性别', - search: '査詢', - reset: '重置', - createTime: '創建時間', - updateTime: '更新時間', - stableVersion: '穩定版', - latestVersion: '最新版' - }, - valid: { - rName: '名稱必須填寫' - }, - msg: { - error: '錯誤提示', - copyToClipboard: '已複製到剪貼板！' - }, - other: { - v1: 'v1+ (vue 2.6+ 停止维护) ~ 2020-04 停止更新', - v2: 'v2+ (vue 2.6+ 旧版本) ~ 2021-12 停止更新', - v3: 'v3+ (vue 2.6+ 稳定版)', - v3d5: '3.5+ (vue 2.6+ 粘性表格)', - v4: 'v4+ (vue 3.0+ 最新版)', - v4d5: '4.5+ (vue 3.0+ 粘性表格)', - plan: { - v1: 'v1 基於 vue2.6+，支持所有主流的瀏覽器，實現表格的一切實用的功能', - v2: 'v2 基於 vue2.6+，支持所有主流的瀏覽器，同時兼具功能與效能', - v3: 'v3 基於 vue2.6+，支持現代瀏覽器並部分相容IE11，提升渲染效能', - v4: 'v4 基於 vue3.0+，只支持現代瀏覽器，不支持IE' - }, - compatibility: '相容性變動', - releases: '更新日誌', - donation: '支持我们', - issuesTitle: '该群供大家交流問題，如果群人数已满，将会不定期剔除不活跃的
，如果有 bug 请通过 issues 反馈', - newFunc: '由於作者很忙，後續有時間可能會支持該功能！', - newDevelopment: '該版本正在重構中，敬請期待！' - }, - search: { - searchPlaceholder: '檔案蒐索', - noDataPrefix: '找不到與 “', - noDataSuffix: '” 相關的結果！' - }, - support: { - title: '該付費科技群用於快速解决使用過程中遇到的各種問題。' - }, - demo: { - start: { - i18n: { - i18nTitle: '如果希望使用指定語言，則需要進行多語言設定。以中/英文為例', - translate: '集成國際化', - translateTitle: '若希望在項目中支持全域自動翻譯，可以通過全域參數開啟（將對列頭、校驗提示..進行自動翻譯）', - findError: '發現錯誤？想參與翻譯？' - } - } - } - }, - footer: { - donation: '支持我们', - donationDesc: 'vxe-table 是 MIT 开源的，使用完全免費。為了使項目能够健康持續的發展下去，您可以通過捐贈來支持作者。' - }, - api: { - apiSearch: 'API 蒐索', - title: { - prop: '屬性', - desc: '說明', - type: '類型/返回類型', - enum: '可選值', - defVal: '預設值/參數', - version: '相容性', - props: '參數', - events: '事件', - slots: '插槽', - methods: '方法' - }, - table: { - desc: { - id: '唯一标识（被某些特定的功能所依赖）', - data: '表格数据（与 loadData 行为一致，更新数据是不会重置状态）', - columns: '列配置', - customs: '即将废弃', - height: '表格的高度；支持铺满父容器或者固定高度，如果设置 auto 为铺满父容器（如果设置自适应时，必须确保存在父节点且不允许存在相邻元素）', - maxHeight: '表格的最大高度', - syncResize: '自动跟随某个属性的变化去重新计算表格，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换时可能会用到）', - autoResize: '自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到）', - resizable: '所有的列是否允许拖动列宽调整大小', - stripe: '是否带有斑马纹（需要注意的是，在可编辑表格场景下，临时插入的数据不会有斑马纹样式）', - border: '是否带有边框', - round: '是否为圆角边框', - size: '表格的尺寸', - fit: '所有列的宽度是否自撑开（可能会被废弃的参数，不要使用）', - loading: '表格是否显示加载中', - align: '所有的列对齐方式', - headerAlign: '所有的表头列的对齐方式', - footerAlign: '所有的表尾列的对齐方式', - showHeader: '是否显示表头', - startIndex: '即将废弃，请使用 seq-config.startIndex', - highlightCurrentRow: '是否要高亮当前行', - highlightHoverRow: '鼠标移到行是否要高亮显示', - highlightCurrentColumn: '是否要高亮当前列', - highlightHoverColumn: '鼠标移到列是否要高亮显示', - highlightCell: '只对 edit-config 配置时有效，是否在编辑时高亮单元格边框（只支持部分）', - rowClassName: '给行附加 className', - cellClassName: '给单元格附加 className', - headerRowClassName: '给表头的行附加 className', - headerCellClassName: '给表头的单元格附加 className', - footerRowClassName: '给表尾的行附加 className', - footerCellClassName: '给表尾的单元格附加 className', - cellStyle: '给单元格附加样式', - headerCellStyle: '给表头单元格附加样式', - footerCellStyle: '给表尾单元格附加样式', - rowStyle: '给行附加样式', - headerRowStyle: '给表头行附加样式', - footerRowStyle: '给表尾行附加样式', - showFooter: '是否显示表尾', - footerMethod: '表尾的数据获取方法，返回一个二维数组', - mergeCells: '临时合并指定的单元格 (不能用于展开行，不建议用于固定列、树形结构)', - mergeFooterItems: '临时合并表尾 (不能用于展开行，不建议用于固定列、树形结构)', - spanMethod: '自定义合并函数，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)', - footerSpanMethod: '表尾合并行或列，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)', - showOverflow: '设置所有内容过长时显示为省略号（如果是固定列建议设置该值，提升渲染速度）', - showHeaderOverflow: '设置表头所有内容过长时显示为省略号', - showAllOverflow: '即将废弃，请使用 show-overflow', - showHeaderAllOverflow: '即将废弃，请使用 show-header-overflow', - showFooterOverflow: '设置表尾所有内容过长时显示为省略号', - sortMethod: '即将废弃，请使用 sort-config.sortMethod', - remoteSort: '即将废弃，请使用 sort-config.remote', - remoteFilter: '即将废弃，请使用 filter-config.remote', - columnWidth: '所有列宽度', - columnMinWidth: '所有最小列宽度；会自动将剩余空间按比例分配', - columnKey: '是否需要为每一列的 VNode 设置 key 属性（非特殊情况下不需要使用）', - rowKey: '是否需要为每一行的 VNode 设置 key 属性（非特殊情况下没必要设置）', - rowId: '自定义行数据唯一主键的字段名（行数据必须要有唯一主键，默认自动生成）', - keepSource: '保持原始值的状态，被某些功能所依赖，比如编辑状态、还原数据等（开启后影响性能，具体取决于数据量）', - zIndex: '自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）', - resizableConfig: '列宽拖动配置项', - seqConfig: '序号配置项', - sortConfig: '排序配置项', - filterConfig: '筛选配置项', - radioConfig: '单选框配置项', - exportConfig: '导出配置项', - importConfig: '导入配置项', - printConfig: '打印配置项', - selectConfig: '即将废弃，请使用 checkbox-config', - checkboxConfig: '复选框配置项', - tooltipConfig: 'tooltip 配置项', - expandConfig: '展开行配置项（不能用于虚拟滚动）', - treeConfig: '树形结构配置项（不能用于虚拟滚动）', - menuConfig: '右键菜单配置项', - contextMenu: '即将废弃，请使用 menu-config', - clipConfig: '复制/粘贴配置项', - fnrConfig: '查找/替换配置项', - mouseConfig: '鼠标配置项', - areaConfig: '区域选取配置项', - keyboardConfig: '按键配置项', - editConfig: '可编辑配置项', - validConfig: '校验配置项', - editRules: '校验规则配置项', - emptyText: '空数据时显示的内容', - emptyRender: '空内容渲染配置项，empty-render 的优先级大于 empty-text', - customConfig: '自定义列配置项', - optimization: '即将废弃', - - params: '自定义参数（可以用来存放一些自定义的数据）', - - empty: '空数据时显示的文本内容', - - currentChange: '只对 highlightCurrentRow 有效，当手动选中行并且值发生改变时触发的事件', - radioChange: '只对 type=radio 有效，当手动勾选并且值发生改变时触发的事件', - selectChange: '即将废弃，请使用 checkbox-change', - checkboxChange: '只对 type=checkbox 有效，当手动勾选并且值发生改变时触发的事件', - selectAll: '即将废弃，请使用 checkbox-all', - checkboxAll: '只对 type=checkbox 有效，当手动勾选全选时触发的事件', - cellClick: '单元格被点击时会触发该事件', - cellDblclick: '单元格被双击时会触发该事件', - cellMenu: '只对 menu-config 配置时有效，单元格被鼠标右键时触发该事件', - cellContextmenu: '即将废弃，请使用 cell-menu', - headerCellClick: '表头单元格被点击时会触发该事件', - headerCellDblclick: '表头单元格被双击时会触发该事件', - headerCellMenu: '只对 menu-config 配置时有效，表头单元格被鼠标右键时触发该事件', - headerCellContextmenu: '即将废弃，请使用 header-cell-menu', - footerCellClick: '表尾单元格被点击时会触发该事件', - footerCellDblclick: '表尾单元格被双击时会触发该事件', - footerCellMenu: '只对 menu-config 配置时有效，表尾单元格被鼠标右键时触发该事件', - footerCellContextmenu: '即将废弃，请使用 footer-cell-menu', - cellMouseenter: '只对 tooltip-config 配置时有效，当鼠标移动到单元格时会触发该事件', - cellMouseleave: '只对 tooltip-config 配置时有效，当鼠标移开单元格时会触发该事件', - sortChange: '当排序条件发生变化时会触发该事件', - filterChange: '当筛选条件发生变化时会触发该事件', - resizableChange: '当列宽拖动发生变化时会触发该事件', - toggleExpandChange: '当行展开或收起时会触发该事件', - toggleTreeChange: '当树节点展开或收起时会触发该事件', - menuClick: '只对 menu-config 配置时有效，当点击右键菜单时会触发该事件', - contextMenuClick: '即将废弃，请使用 menu-click', - cellSelected: '只对 mouse-config.selected 配置时有效，单元格被选中时会触发该事件', - editClosed: '只对 edit-config 配置时有效，单元格编辑状态下被关闭时会触发该事件', - editActived: '只对 edit-config 配置时有效，单元格被激活编辑时会触发该事件', - editDisabled: '只对 edit-config 配置时有效，当单元格激活时如果是禁用状态时会触发该事件', - validError: '只对 edit-rules 配置时有效，当数据校验不通过时会触发该事件', - scroll: '表格滚动时会触发该事件' - } - }, - tableColumn: { - desc: { - type: '列的类型', - index: '即将废弃，请使用 seq', - seq: '序号', - selection: '即将废弃，请使用 checkbox', - checkbox: '复选框', - radio: '单选框', - expand: '展开行', - html: 'HTML 标签（动态渲染任意 HTML 是非常危险的，很容易导致 XSS 攻击，应该确保内容是可信的）', - prop: '即将废弃，请使用 field', - visible: '默认是否显示', - field: '列字段名（注：属性层级越深，渲染性能就越差，例如：aa.bb.cc.dd.ee）', - label: '即将废弃，请使用 title', - title: '列标题（支持开启国际化）', - width: '列宽度（如果为空则均匀分配剩余宽度，如果全部列固定了，可能会存在宽屏下不会铺满，可以配合 "%" 或者 "min-width" 布局）', - minWidth: '最小列宽度；会自动将剩余空间按比例分配', - resizable: '列是否允许拖动列宽调整大小', - fixed: '将列固定在左侧或者右侧（注意：固定列应该放在左右两侧的位置）', - align: '列对齐方式', - headerAlign: '表头列的对齐方式', - footerAlign: '表尾列的对齐方式', - showOverflow: '当内容过长时显示为省略号', - showHeaderOverflow: '当表头内容过长时显示为省略号', - showFooterOverflow: '当表尾内容过长时显示为省略号', - className: '给单元格附加 className', - headerClassName: '给表头的单元格附加 className', - footerClassName: '给表尾的单元格附加 classNam', - formatter: '格式化显示内容', - indexMethod: '即将废弃，请使用 seqMethod', - seqMethod: '只对 type=seq 有效，自定义索引方法', - sortable: '是否允许列排序', - sortBy: '只对 sortable 有效，指定排序的字段（当值 formatter 格式化后，可以设置该字段，使用值进行排序）', - sortType: '排序的字段类型，比如字符串转数值等', - sortMethod: '只对 sortable 有效，列的排序方法，该方法的返回值用来决定该行的排序规则', - remoteSort: '是否使用服务端排序，如果设置为 true 则不会对数据进行处理', - filters: '配置筛选条件（注：筛选只能用于列表，如果是树结构则过滤根节点）', - filterMultiple: '只对 filters 有效，筛选是否允许多选', - filterMethod: '只对 filters 有效，列的筛选方法，该方法的返回值用来决定该行是否显示', - filterResetMethod: '只对 filters 有效，自定义筛选重置方法', - filterRecoverMethod: '只对 filters 有效，自定义筛选复原方法（使用自定义筛选时可能会用到）', - filterRender: '筛选渲染器配置项', - treeNode: '只对 tree-config 配置时有效，指定为树节点', - columnKey: '即将废弃，请使用 table.column-key', - cellType: '只对特定功能有效，单元格值类型（例如：导出数据类型设置）', - cellRender: '默认的渲染器配置项', - editRender: '可编辑渲染器配置项', - contentRender: '内容渲染配置项', - params: '额外的参数（可以用来存放一些私有参数）' - } - }, - tooltip: { - desc: { - value: '是否显示', - content: '显示内容', - trigger: '触发方式', - theme: '主题样式', - size: '尺寸', - zIndex: '自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）', - isArrow: '是否显示箭头', - enterable: '鼠标是否可进入到 tooltip 中', - leaveDelay: '鼠标移出后延时多少才隐藏 tooltip' - } - }, - grid: { - desc: { - formConfig: '表单配置项', - toolbar: '即将废弃，请使用 toolbar-config', - toolbarConfig: '工具栏配置', - pagerConfig: '分页配置项', - zoomConfig: '缩放配置项', - proxyConfig: '数据代理配置项（基于 Promise API）', - toolbarRender: '工具栏渲染器配置项' - } - }, - toolbar: { - desc: { - id: '即将废弃', - size: '尺寸', - loading: '是否加载中', - import: '导入按钮配置（需要设置 "import-config"）', - export: '导出按钮配置（需要设置 "export-config"）', - print: '打印按钮配置', - refresh: '刷新按钮配置', - resizable: '即将废弃，请使用 custom-config', - setting: '即将废弃，请使用 custom', - custom: '自定义列配置' - } - }, - pager: { - desc: { - size: '尺寸', - loading: '是否加载中', - layouts: '自定义布局', - currentPage: '当前页', - pageSize: '每页大小', - total: '总条数', - pagerCount: '显示页码按钮的数量', - pageSizes: '每页大小选项列表', - align: '对齐方式', - border: '带边框', - background: '带背景颜色', - iconPrevPage: '自定义上一页图标', - iconJumpPrev: '自定义向上跳页图标', - iconJumpNext: '自定义向下跳页图标', - iconNextPage: '自定义下一页图标', - iconJumpMore: '自定义跳页显示图标' - } - }, - radio: { - desc: { - value: 'v-model 绑定值', - label: '值', - size: '尺寸', - disabled: '是否禁用', - name: '原生 name 属性' - } - }, - checkbox: { - desc: { - value: 'v-model 绑定值', - size: '尺寸', - disabled: '是否禁用', - label: '只对 checkbox-group 有效，值', - title: '标题', - indeterminate: '是否不确定状态' - } - }, - input: { - desc: { - value: 'v-model 绑定值', - immediate: '默认情况下输入会实时同步值，当在复杂渲染时会导致卡顿，可以设置为 false 在 change 之后才同步值', - size: '尺寸', - disabled: '是否禁用', - prefixIcon: '头部图标', - suffixIcon: '尾部图标' - } - }, - button: { - desc: { - content: '内容（支持开启国际化）', - type: '类型', - size: '尺寸', - name: '用来标识这一项', - icon: '按钮的图标', - status: '状态', - disabled: '是否禁用', - loading: '是否加载中', - placement: '固定显示下拉面板的方向', - transfer: '是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）' - } - }, - modal: { - desc: { - value: 'v-model 绑定值', - loading: '是否加载中', - id: '设置唯一的 id（对于 Message 防止重复弹出 或 Storage 拖动状态保存等场景可能会用到）', - title: '窗口的标题（支持开启国际化）', - type: '窗口类型', - status: '只对 type=alert | confirm | message 有效，消息状态', - iconStatus: '自定义状态图标', - message: '请使用 content', - content: '显示的文本（支持开启国际化）', - showHeader: '是否显示头部', - showFooter: '是否显示底部', - lockView: '是否锁住页面，不允许窗口之外的任何操作', - lockScroll: '是否锁住滚动条，不允许页面滚动', - mask: '是否显示遮罩层', - maskClosable: '是否允许点击遮罩层关闭窗口', - escClosable: '是否允许按 Esc 键关闭窗口', - showZoom: '标题是否标显示最大化与还原按钮', - resize: '是否允许窗口边缘拖动调整窗口大小', - marginSize: '只对 resize 启用后有效，用于设置可拖动界限范围，如果为负数则允许拖动超出屏幕边界', - duration: '只对 type=message 有效，自动关闭的延时，如果为 -1 禁用自动关闭', - size: '尺寸', - width: '窗口的宽度', - height: '窗口的高度', - minWidth: '窗口的最小宽度', - minHeight: '窗口的最小高度', - top: '只对 type=message 有效，消息距离顶部的位置', - position: '只对 type=modal 有效，窗口的默认位置，可以设置为 center 居中显示', - zIndex: '自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）', - showTitleOverflow: '设置标题内容过长时显示为省略号', - fullscreen: '默认最大化显示', - draggable: '是否启用窗口拖动', - dblclickZoom: '只对 type=modal 有效，是否允许通过双击头部放大或还原窗口', - remember: '记忆功能，会记住最后操作状态，再次打开窗口时还原窗口状态', - destroyOnClose: '在窗口关闭时销毁内容', - storage: '是否启用 localStorage 本地保存，会将窗口拖动的状态保存到本地（需要有 id）' - } - }, - form: { - desc: { - loading: '是否加载中', - data: '表单数据', - span: '所有项的栅格占据的列数（共 24 分栏）', - align: '所有项的内容对齐方式', - size: '尺寸', - titleAlign: '所有项的标题对齐方式', - titleWidth: '所有项的标题宽度', - titleOverflow: '所有设置标题内容过长时显示为省略号', - titleColon: '是否显示标题冒号', - titleAsterisk: '是否显示必填字段的红色星号', - rules: '校验规则配置项' - } - }, - formItem: { - desc: { - field: '字段名', - title: '标题（支持开启国际化）', - span: '栅格占据的列数（共 24 分栏）', - align: '内容对齐方式', - titleAlign: '标题对齐方式', - titleWidth: '标题宽度', - titleOverflow: '标题内容过长时显示为省略号', - folding: '默认收起', - visible: '默认是否显示', - visibleMethod: '该方法的返回值用来决定该项是否显示', - collapseNode: '折叠节点', - titlePrefix: '前缀配置项', - titleSuffix: '后缀配置项', - resetValue: '重置时的默认值', - itemRender: '项渲染器配置项' - } - }, - select: { - desc: { - value: 'v-model 绑定值', - size: '尺寸', - multiple: '是否多选', - placeholder: '空值显示的占位符', - clearable: '当有值时，是否在右侧显示清除按钮', - disabled: '是否禁用', - prefixIcon: '头部图标', - placement: '固定显示下拉面板的方向', - transfer: '是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）' - } - }, - optgroup: { - desc: { - label: '显示内容', - disabled: '是否禁用', - size: '尺寸' - } - }, - option: { - desc: { - value: 'v-model 绑定值', - label: '显示内容', - disabled: '是否禁用', - size: '尺寸' - } - }, - switch: { - desc: { - value: 'v-model 绑定值', - size: '尺寸', - disabled: '是否禁用', - onLabel: '打开时显示的文字', - offLabel: '关闭时显示的文字', - onValue: '打开时的值', - offValue: '关闭时的值', - onIcon: '打开时的图标', - offIcon: '关闭时的图标', - onClass: '打开时的 className', - offClass: '关闭时的 className' - } - }, - list: { - desc: { - data: '列表数据', - size: '尺寸' - } - }, - pulldown: { - desc: { - data: '列表数据', - size: '尺寸', - disabled: '是否禁用', - placement: '固定显示下拉面板的方向', - transfer: '是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）' - } - } - } - } -} diff --git a/examples/main.ts b/examples/main.ts index b18923ea42..eecff4e730 100644 --- a/examples/main.ts +++ b/examples/main.ts @@ -1,118 +1,17 @@ import { createApp } from 'vue' import App from './App.vue' import router from './router' -import store from './store' -import i18n from './i18n' -import './style/index.scss' -import './plugins' - -import PreCode from './components/PreCode.vue' -import GridAPILink from './components/GridAPILink.vue' -import TableAPILink from './components/TableAPILink.vue' -import TableColumnAPILink from './components/TableColumnAPILink.vue' -import ToolbarAPILink from './components/ToolbarAPILink.vue' -import PagerAPILink from './components/PagerAPILink.vue' -import VirtualTreeAPILink from './components/VirtualTreeAPILink.vue' - -import { - VXETable, - - VxeTableFilterModule, - VxeTableMenuModule, - VxeTableEditModule, - VxeTableExportModule, - VxeTableKeyboardModule, - VxeTableValidatorModule, - VxeTableCustomModule, - - VxeIcon, - VxeColumn, - VxeColgroup, - VxeTable, - VxeGrid, - VxeToolbar, - VxePager, - VxeCheckbox, - VxeCheckboxGroup, - VxeRadio, - VxeRadioGroup, - VxeRadioButton, - VxeInput, - VxeTextarea, - VxeButton, - VxeButtonGroup, - VxeModal, - VxeDrawer, - VxeTooltip, - VxeForm, - VxeFormItem, - VxeFormGather, - VxeSelect, - VxeOptgroup, - VxeOption, - VxeSwitch, - VxeList, - VxePulldown -} from '../packages/all' - -const app = createApp(App) +import VxeUI from 'vxe-pc-ui' +import 'vxe-pc-ui/lib/style.css' -app.component(PreCode.name, PreCode) -app.component(GridAPILink.name, GridAPILink) -app.component(TableAPILink.name, TableAPILink) -app.component(TableColumnAPILink.name, TableColumnAPILink) -app.component(ToolbarAPILink.name, ToolbarAPILink) -app.component(PagerAPILink.name, PagerAPILink) -app.component(VirtualTreeAPILink.name, VirtualTreeAPILink) +import VxeUITable from '../packages' +import '../styles/all.scss' -app.use(VxeTableFilterModule) -app.use(VxeTableMenuModule) -app.use(VxeTableEditModule) -app.use(VxeTableExportModule) -app.use(VxeTableKeyboardModule) -app.use(VxeTableValidatorModule) -app.use(VxeTableCustomModule) - -app.use(VxeIcon) -app.use(VxeColumn) -app.use(VxeColgroup) -app.use(VxeTable) -app.use(VxeGrid) -app.use(VxeToolbar) -app.use(VxePager) -app.use(VxeCheckbox) -app.use(VxeCheckboxGroup) -app.use(VxeRadio) -app.use(VxeRadioGroup) -app.use(VxeRadioButton) -app.use(VxeInput) -app.use(VxeTextarea) -app.use(VxeButton) -app.use(VxeButtonGroup) -app.use(VxeModal) -app.use(VxeDrawer) -app.use(VxeSelect) -app.use(VxeOptgroup) -app.use(VxeOption) -app.use(VxeSwitch) -app.use(VxeTooltip) -app.use(VxeForm) -app.use(VxeFormItem) -app.use(VxeFormGather) -app.use(VxeList) -app.use(VxePulldown) - -app.use(store) -app.use(router) -app.use(i18n) - -app.config.globalProperties.$t = i18n.global.t -app.config.globalProperties.$i18n = i18n.global - -app.config.globalProperties.$XModal = VXETable.modal -app.config.globalProperties.$XPrint = VXETable.print -app.config.globalProperties.$XSaveFile = VXETable.saveFile -app.config.globalProperties.$XReadFile = VXETable.readFile +import './style/index.scss' -app.mount('#app') +createApp(App) + .use(router) + .use(VxeUI) + .use(VxeUITable) + .mount('#app') diff --git a/examples/plugins/index.ts b/examples/plugins/index.ts deleted file mode 100644 index 03c31a605c..0000000000 --- a/examples/plugins/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -import './utils' -import './table' diff --git a/examples/plugins/table/formats.ts b/examples/plugins/table/formats.ts deleted file mode 100644 index 012f3b7bd1..0000000000 --- a/examples/plugins/table/formats.ts +++ /dev/null @@ -1,35 +0,0 @@ -import { VXETable } from '../../../packages/all' -import XEUtils from 'xe-utils' - -// 自定义全局的格式化处理函数 -VXETable.formats.mixin({ - // 格式化性别 - formatSex ({ cellValue }) { - return cellValue ? (cellValue === '1' ? '男' : '女') : '' - }, - // 格式化下拉选项 - formatSelect ({ cellValue }, list: any[]) { - const item = list.find(item => item.value === cellValue) - return item ? item.label : '' - }, - // 格式化日期，默认 yyyy-MM-dd HH:mm:ss - formatDate ({ cellValue }, format?: string) { - return XEUtils.toDateString(cellValue, format || 'yyyy-MM-dd HH:mm:ss') - }, - // 四舍五入金额，每隔3位逗号分隔，默认2位数 - formatAmount ({ cellValue }, digits = 2) { - return XEUtils.commafy(XEUtils.toNumber(cellValue), { digits }) - }, - // 格式化银行卡，默认每4位空格隔开 - formatBankcard ({ cellValue }) { - return XEUtils.commafy(XEUtils.toValueString(cellValue), { spaceNumber: 4, separator: ' ' }) - }, - // 四舍五入,默认两位数 - formatFixedNumber ({ cellValue }, digits = 2) { - return XEUtils.toFixed(XEUtils.round(cellValue, digits), digits) - }, - // 向下舍入,默认两位数 - formatCutNumber ({ cellValue }, digits = 2) { - return XEUtils.toFixed(XEUtils.floor(cellValue, digits), digits) - } -}) diff --git a/examples/plugins/table/index.ts b/examples/plugins/table/index.ts deleted file mode 100644 index 1061756211..0000000000 --- a/examples/plugins/table/index.ts +++ /dev/null @@ -1,5 +0,0 @@ -import './setup' -import './renderer' -import './formats' -import './menus' -import './validators' diff --git a/examples/plugins/table/menus.ts b/examples/plugins/table/menus.ts deleted file mode 100644 index ffe8065a41..0000000000 --- a/examples/plugins/table/menus.ts +++ /dev/null @@ -1,13 +0,0 @@ -import { VXETable } from '../../../packages/all' - -// 自定义全局的格式化处理函数 -VXETable.menus.mixin({ - alertMsg: { - menuMethod () { - alert('1') - } - }, - test1 () { - alert('2') - } -}) diff --git a/examples/plugins/table/renderer/components/EditDownModal.vue b/examples/plugins/table/renderer/components/EditDownModal.vue deleted file mode 100644 index 2a3d25f976..0000000000 --- a/examples/plugins/table/renderer/components/EditDownModal.vue +++ /dev/null @@ -1,161 +0,0 @@ - - - - - diff --git a/examples/plugins/table/renderer/components/EditDownTable.vue b/examples/plugins/table/renderer/components/EditDownTable.vue deleted file mode 100644 index 365518bc3d..0000000000 --- a/examples/plugins/table/renderer/components/EditDownTable.vue +++ /dev/null @@ -1,156 +0,0 @@ - - - - - diff --git a/examples/plugins/table/renderer/components/EditPopupModal.vue b/examples/plugins/table/renderer/components/EditPopupModal.vue deleted file mode 100644 index 9d0e454fb5..0000000000 --- a/examples/plugins/table/renderer/components/EditPopupModal.vue +++ /dev/null @@ -1,137 +0,0 @@ - - - - - diff --git a/examples/plugins/table/renderer/components/FilterComplex.vue b/examples/plugins/table/renderer/components/FilterComplex.vue deleted file mode 100644 index 8b077ac89d..0000000000 --- a/examples/plugins/table/renderer/components/FilterComplex.vue +++ /dev/null @@ -1,89 +0,0 @@ - - - - - diff --git a/examples/plugins/table/renderer/components/FilterContent.vue b/examples/plugins/table/renderer/components/FilterContent.vue deleted file mode 100644 index 080897064a..0000000000 --- a/examples/plugins/table/renderer/components/FilterContent.vue +++ /dev/null @@ -1,165 +0,0 @@ - - - - - diff --git a/examples/plugins/table/renderer/components/FilterExtend.vue b/examples/plugins/table/renderer/components/FilterExtend.vue deleted file mode 100644 index 54c3edbe0f..0000000000 --- a/examples/plugins/table/renderer/components/FilterExtend.vue +++ /dev/null @@ -1,298 +0,0 @@ - - - - - diff --git a/examples/plugins/table/renderer/components/FilterInput.vue b/examples/plugins/table/renderer/components/FilterInput.vue deleted file mode 100644 index 3fd63f2a11..0000000000 --- a/examples/plugins/table/renderer/components/FilterInput.vue +++ /dev/null @@ -1,65 +0,0 @@ - - - - - diff --git a/examples/plugins/table/renderer/content.tsx b/examples/plugins/table/renderer/content.tsx deleted file mode 100644 index e3a110cdfd..0000000000 --- a/examples/plugins/table/renderer/content.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { VXETable } from '../../../../packages/all' - -// 创建一个简单的展开内容渲染 -VXETable.renderer.add('MyExpand', { - renderExpand (renderOpts, params) { - const { row } = params - return [ -
    -
  • - ID： - { row.id } -
    • -
  • - Name： - { row.name } -
    • -
  • - UpdateTime： - { row.updateTime } -
    • -
  • - CreateTime： - { row.createTime } -
    • -
- ] - } -}) diff --git a/examples/plugins/table/renderer/default.tsx b/examples/plugins/table/renderer/default.tsx deleted file mode 100644 index 99f95ab285..0000000000 --- a/examples/plugins/table/renderer/default.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import { VXETable } from '../../../../packages/all' - -// 创建一个简单的超链接渲染 -VXETable.renderer.add('MyLink', { - // 默认显示模板 - renderDefault (renderOpts, params) { - const { row, column } = params - const { events = {} } = renderOpts - return [ - events.click(params) }>{row[column.property]} - ] - } -}) diff --git a/examples/plugins/table/renderer/edit.tsx b/examples/plugins/table/renderer/edit.tsx deleted file mode 100644 index 1657a1d91b..0000000000 --- a/examples/plugins/table/renderer/edit.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import { VXETable } from '../../../../packages/all' -import EditDownTable from './components/EditDownTable.vue' -import EditPopupModal from './components/EditPopupModal.vue' -import EditDownModal from './components/EditDownModal.vue' - -// 创建一个简单的输入框渲染 -VXETable.renderer.add('MyInput', { - // 激活时自动聚焦 - autofocus: '.my-cell', - // 可编辑激活模板 - renderEdit (renderOpts, params) { - const { row, column } = params - return [ - - ] - }, - // 可编辑显示模板 - renderCell (renderOpts, params) { - const { row, column } = params - return [ - { row[column.property] } - ] - } -}) - -// 创建一个下拉表格渲染 -VXETable.renderer.add('EditDownTable', { - autofocus: '.vxe-input--inner', - renderEdit (renderOpts, params) { - return [ - - ] - } -}) - -// 创建一个弹窗渲染 -VXETable.renderer.add('EditPopupModal', { - autofocus: '.vxe-input--inner', - renderEdit (renderOpts, params) { - return [ - - ] - } -}) - -// 创建一个复杂的组合渲染 -VXETable.renderer.add('EditDownModal', { - autofocus: '.vxe-input--inner', - renderEdit (renderOpts, params) { - return [ - - ] - } -}) diff --git a/examples/plugins/table/renderer/empty.tsx b/examples/plugins/table/renderer/empty.tsx deleted file mode 100644 index 15ec4cc14e..0000000000 --- a/examples/plugins/table/renderer/empty.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import { VXETable } from '../../../../packages/all' - -// 创建一个简单的空内容渲染 -VXETable.renderer.add('NotData', { - // 空内容模板 - renderTableEmptyView () { - return [ - - -

亲，没有更多数据了！

- - ] - } -}) diff --git a/examples/plugins/table/renderer/filter.tsx b/examples/plugins/table/renderer/filter.tsx deleted file mode 100644 index d65d49a9a8..0000000000 --- a/examples/plugins/table/renderer/filter.tsx +++ /dev/null @@ -1,125 +0,0 @@ -import { VXETable } from '../../../../packages/all' -import FilterInput from './components/FilterInput.vue' -import FilterContent from './components/FilterContent.vue' -import FilterComplex from './components/FilterComplex.vue' -import FilterExtend from './components/FilterExtend.vue' - -// 创建一个简单的输入框筛选 -VXETable.renderer.add('FilterInput', { - // 筛选模板 - renderFilter (renderOpts, params) { - return [ - - ] - }, - // 重置数据方法 - filterResetMethod (params) { - const { options } = params - options.forEach((option) => { - option.data = '' - }) - }, - // 重置筛选复原方法（当未点击确认时，该选项将被恢复为默认值） - filterRecoverMethod ({ option }) { - option.data = '' - }, - // 筛选方法 - filterMethod (params) { - const { option, row, column } = params - const { data } = option - const cellValue = row[column.property] - if (cellValue) { - return cellValue.indexOf(data) > -1 - } - return false - } -}) - -// 创建一个条件的渲染器 -VXETable.renderer.add('FilterComplex', { - // 不显示底部按钮，使用自定义的按钮 - showFilterFooter: false, - // 筛选模板 - renderFilter (renderOpts, params) { - return [ - - ] - }, - // 重置数据方法 - filterResetMethod (params) { - const { options } = params - options.forEach((option) => { - option.data = { type: 'has', name: '' } - }) - }, - // 筛选数据方法 - filterMethod (params) { - const { option, row, column } = params - const cellValue = row[column.property] - const { name } = option.data - if (cellValue) { - return cellValue.indexOf(name) > -1 - } - return false - } -}) - -// 创建一个支持列内容的筛选 -VXETable.renderer.add('FilterContent', { - // 不显示底部按钮，使用自定义的按钮 - showFilterFooter: false, - // 筛选模板 - renderFilter (renderOpts, params) { - return [ - - ] - }, - // 重置数据方法 - filterResetMethod (params) { - const { options } = params - options.forEach((option) => { - option.data = { vals: [], sVal: '' } - }) - }, - // 筛选数据方法 - filterMethod (params) { - const { option, row, column } = params - const { vals } = option.data - const cellValue = row[column.property] - return vals.includes(cellValue) - } -}) - -// 创建一个复杂的筛选器 -VXETable.renderer.add('FilterExtend', { - // 不显示底部按钮，使用自定义的按钮 - showFilterFooter: false, - // 筛选模板 - renderFilter (renderOpts, params) { - return [ - - ] - }, - // 重置数据方法 - filterResetMethod (params) { - const { options } = params - options.forEach((option) => { - option.data = { vals: [], sVal: '', fMenu: '', f1Type: '', f1Val: '', fMode: 'and', f2Type: '', f2Val: '' } - }) - }, - // 筛选数据方法 - filterMethod (params) { - const { option, row, column } = params - const cellValue = row[column.property] - const { vals, f1Type, f1Val } = option.data - if (cellValue) { - if (f1Type) { - return cellValue.indexOf(f1Val) > -1 - } else if (vals.length) { - // 通过指定值筛选 - return vals.includes(cellValue) - } - } - return false - } -}) diff --git a/examples/plugins/table/renderer/form.tsx b/examples/plugins/table/renderer/form.tsx deleted file mode 100644 index 0db56c6a8e..0000000000 --- a/examples/plugins/table/renderer/form.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { VXETable } from '../../../../packages/all' - -// 创建一个简单的表单-输入框渲染 -VXETable.renderer.add('FormItemInput', { - // 项内容模板 - renderItemContent (renderOpts, params) { - const { data, property } = params - const { props } = renderOpts - return [ - - ] - } -}) - -// 创建一个简单的表单-按钮组渲染 -VXETable.renderer.add('FormItemButtonGroup', { - // 项内容模板 - renderItemContent () { - return [ - 查询, - 重置 - ] - } -}) diff --git a/examples/plugins/table/renderer/index.tsx b/examples/plugins/table/renderer/index.tsx deleted file mode 100644 index 8d187ac767..0000000000 --- a/examples/plugins/table/renderer/index.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import './default' -import './filter' -import './edit' -import './content' -import './toolbar' -import './form' -import './empty' diff --git a/examples/plugins/table/renderer/toolbar.tsx b/examples/plugins/table/renderer/toolbar.tsx deleted file mode 100644 index ba3a3b1717..0000000000 --- a/examples/plugins/table/renderer/toolbar.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { VXETable } from '../../../../packages/all' - -// 创建一个简单的工具栏-左侧按钮渲染 -VXETable.renderer.add('ToolbarButtonDownload', { - renderToolbarButton (renderOpts, params) { - const { events = {} } = renderOpts - const { button } = params - return [ - { - events.click(button) - } - }> - ] - } -}) - -// 创建一个简单的工具栏-右侧工具渲染 -VXETable.renderer.add('ToolbarToolPrint', { - renderToolbarTool (renderOpts, params) { - const { $table } = params - return [ - { - $table.print() - } - }> - ] - } -}) diff --git a/examples/plugins/table/setup.ts b/examples/plugins/table/setup.ts deleted file mode 100644 index f1b46583e1..0000000000 --- a/examples/plugins/table/setup.ts +++ /dev/null @@ -1,17 +0,0 @@ -import i18n from '@/i18n' - -import { VXETable } from '../../../packages/all' - -// 设置默认参数 -VXETable.setConfig({ - table: { - exportConfig: { - types: ['csv', 'html', 'xml', 'txt'] - }, - scrollY: { - mode: 'wheel' - } - }, - translate: (key: any) => key && key.indexOf('app.') > -1 ? i18n.global.t(key) : key, - i18n: (key: any, args?: any) => i18n.global.t(key, args) -}) diff --git a/examples/plugins/table/validators.ts b/examples/plugins/table/validators.ts deleted file mode 100644 index 8b36e65007..0000000000 --- a/examples/plugins/table/validators.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { VXETable } from '../../../packages/all' - -// 自定义全局的格式化处理函数 -VXETable.validators.mixin({ - mobile: { - cellValidatorMethod ({ cellValue }) { - if (!cellValue) { - return new Error('手机号不正确') - } - } - } -}) diff --git a/examples/plugins/utils.ts b/examples/plugins/utils.ts deleted file mode 100644 index 5e95136bd1..0000000000 --- a/examples/plugins/utils.ts +++ /dev/null @@ -1,9 +0,0 @@ -import XEUtils from 'xe-utils' - -declare global { - interface Window { - XEUtils: typeof XEUtils; - } -} - -window.XEUtils = XEUtils diff --git a/examples/router/index.ts b/examples/router/index.ts index 76cf029ca7..d5e17894cd 100644 --- a/examples/router/index.ts +++ b/examples/router/index.ts @@ -1,274 +1,6 @@ import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router' -import StartUpgrade from '../views/start/Upgrade.vue' -import StartInstall from '../views/start/Install.vue' -import StartQuick from '../views/start/Quick.vue' -import StartUse from '../views/start/Use.vue' -import StartIcons from '../views/start/Icons.vue' -import StartGlobal from '../views/start/Global.vue' -import StartTheme from '../views/start/Theme.vue' -import StartI18n from '../views/start/I18n.vue' - -import RendererAPI from '../views/table/renderer/API.vue' -import RendererFilter from '../views/table/renderer/Filter.vue' -import RendererDefault from '../views/table/renderer/Default.vue' -import RendererEdit from '../views/table/renderer/Edit.vue' -import RendererExpand from '../views/table/renderer/Expand.vue' -import RendererToolbar from '../views/table/renderer/Toolbar.vue' -import RendererForm from '../views/table/renderer/Form.vue' -import RendererEmpty from '../views/table/renderer/Empty.vue' - -import CommandsAPI from '../views/table/commands/API.vue' -import MenusAPI from '../views/table/menus/API.vue' -import InterceptorAPI from '../views/table/interceptor/API.vue' -import FormatsAPI from '../views/table/formats/API.vue' - -import TableBasic from '../views/table/base/Basic.vue' -import TableSize from '../views/table/base/Size.vue' -import TableAutoBreak from '../views/table/base/AutoBreak.vue' -import TableWidth from '../views/table/base/Width.vue' -import TableOverflow from '../views/table/base/Overflow.vue' -import TableTooltip from '../views/table/base/Tooltip.vue' -import TableStripe from '../views/table/base/Stripe.vue' -import TableBorder from '../views/table/base/Border.vue' -import TableRound from '../views/table/base/Round.vue' -import TableStyle from '../views/table/base/Style.vue' -import TableDynamicStyle from '../views/table/base/DynamicStyle.vue' -import TableScrollStyle from '../views/table/base/ScrollStyle.vue' -import TableHeader from '../views/table/base/Header.vue' -import TableHeaderHighlight from '../views/table/base/HeaderHighlight.vue' -import TableResizable from '../views/table/base/Resizable.vue' -import TableMaxHeight from '../views/table/base/MaxHeight.vue' -import TableHeight from '../views/table/base/Height.vue' -import TableRowHeight from '../views/table/base/RowHeight.vue' -import TableAutoHeight from '../views/table/base/AutoHeight.vue' -import TableFixed from '../views/table/base/Fixed.vue' -import TableFixedFull from '../views/table/base/FixedFull.vue' -import TableGroup from '../views/table/base/Group.vue' -import TableSeq from '../views/table/base/Seq.vue' -import TableCurrent from '../views/table/base/Current.vue' -import TableRadio from '../views/table/base/Radio.vue' -import TableSelection from '../views/table/base/Selection.vue' -import TableSort from '../views/table/base/Sort.vue' -import TableFilter from '../views/table/base/Filter.vue' -import TableEmpty from '../views/table/base/Empty.vue' -import TableLoading from '../views/table/base/Loading.vue' -import TableFormat from '../views/table/base/Format.vue' -import TableData from '../views/table/base/Data.vue' -import TableHTML from '../views/table/base/HTML.vue' -import TableFull from '../views/table/base/Full.vue' - -import TableEvent from '../views/table/advanced/Event.vue' -import TableTemplate from '../views/table/advanced/Template.vue' -import TableDynamic from '../views/table/advanced/Dynamic.vue' -import TableCustomCheckbox from '../views/table/advanced/CustomCheckbox.vue' -import TableCustomRadio from '../views/table/advanced/CustomRadio.vue' -import TableSortIcon from '../views/table/advanced/SortIcon.vue' -import TableCustomSort from '../views/table/advanced/CustomSort.vue' -import TableMultiSort from '../views/table/advanced/MultiSort.vue' -import TableManualFilter from '../views/table/advanced/ManualFilter.vue' -import TableFilterIcon from '../views/table/advanced/FilterIcon.vue' -import TableSpan from '../views/table/advanced/Span.vue' -import TableSpanRow from '../views/table/advanced/SpanRow.vue' -import TableMergeCell from '../views/table/advanced/MergeCell.vue' -import TableFooter from '../views/table/advanced/Footer.vue' -import TableFooterSpan from '../views/table/advanced/FooterSpan.vue' -import TableFooterMaxHeight from '../views/table/advanced/MaxHeight.vue' -import TableImport from '../views/table/advanced/Import.vue' -import TableExport from '../views/table/advanced/Export.vue' -import TablePrint from '../views/table/advanced/Print.vue' -import TableCustomPrint from '../views/table/advanced/CustomPrint.vue' -import TableFixedType from '../views/table/advanced/FixedType.vue' -import TableMenu from '../views/table/advanced/Menu.vue' -import TableMenuPrivilege from '../views/table/advanced/MenuPrivilege.vue' -import TableExpand from '../views/table/advanced/Expand.vue' -import TableExpandIcon from '../views/table/advanced/ExpandIcon.vue' -// import TableExpandLazy from '../views/table/advanced/ExpandLazy.vue' -// import TableExpandAccordion from '../views/table/advanced/ExpandAccordion.vue' -import TableSearch from '../views/table/advanced/Search.vue' -// import TableGroupBy from '../views/table/advanced/GroupBy.vue' -import TableDetails from '../views/table/advanced/Details.vue' -// import TablePopupEdit from '../views/table/advanced/PopupEdit.vue' -import TableToolbar from '../views/table/advanced/Toolbar.vue' -import TableCustom from '../views/table/advanced/Custom.vue' -import TableCustomStorage from '../views/table/advanced/CustomStorage.vue' -import TableCustomlWidthStorage from '../views/table/advanced/CustomlWidthStorage.vue' -// import TableForm from '../views/table/advanced/Form.vue' -// import TablePage from '../views/table/advanced/Page.vue' -// import TablePageIcon from '../views/table/advanced/PageIcon.vue' -// import TableHighlight from '../views/table/advanced/Highlight.vue' -// import TableRangeSelect from '../views/table/advanced/RangeSelect.vue' -// import TableTabs from '../views/table/advanced/Tabs.vue' -import TableKeepAlives from '../views/table/advanced/KeepAlives.vue' -import TableKeepAliveTable1 from '../views/table/advanced/keepAlives/Table1.vue' -import TableKeepAliveTable2 from '../views/table/advanced/keepAlives/Table2.vue' -import TableKeepAliveTable3 from '../views/table/advanced/keepAlives/Table3.vue' - -import GridBasic from '../views/grid/Basic.vue' -import GridEvents from '../views/grid/Events.vue' -import GridGroup from '../views/grid/Group.vue' -import GridReverse from '../views/grid/Reverse.vue' -import GridTemplate from '../views/grid/Template.vue' -import GridFooter from '../views/grid/Footer.vue' -import GridPage from '../views/grid/Page.vue' -import GridFullQuery from '../views/grid/FullQuery.vue' -import GridProxy from '../views/grid/Proxy.vue' -import GridPageProxy from '../views/grid/PageProxy.vue' -// import GridConfigProxy from '../views/grid/ConfigProxy.vue' -import GridEdit from '../views/grid/Edit.vue' -import GridCellDisable from '../views/grid/CellDisable.vue' -import GridRowDisable from '../views/grid/RowDisable.vue' -import GridForm from '../views/grid/Form.vue' -import GridFormProxy from '../views/grid/FormProxy.vue' -import GridToolbar from '../views/grid/Toolbar.vue' -import GridCustomToolbar from '../views/grid/CustomToolbar.vue' -import GridToolbarIcon from '../views/grid/ToolbarIcon.vue' -import GridFullscreen from '../views/grid/Fullscreen.vue' -// import GridDynamic from '../views/grid/Dynamic.vue' -import GridMenu from '../views/grid/Menu.vue' -// import GridSpan from '../views/grid/Span.vue' -// import GridUpload from '../views/grid/Upload.vue' -// import GridTree from '../views/grid/Tree.vue' -// import GridTreeLazy from '../views/grid/TreeLazy.vue' -// import GridTreeLazyEdit from '../views/grid/TreeLazyEdit.vue' -// import GridTreeEdit from '../views/grid/TreeEdit.vue' -import GridFullEdit from '../views/grid/FullEdit.vue' -import GridKeepAlives from '../views/grid/KeepAlives.vue' -import GridKeepAliveGrid1 from '../views/grid/keepAlives/Grid1.vue' -import GridKeepAliveGrid2 from '../views/grid/keepAlives/Grid2.vue' -import GridKeepAliveGrid3 from '../views/grid/keepAlives/Grid3.vue' - -import TableTreeBasic from '../views/table/tree/Basic.vue' -import TableTreeNormal from '../views/table/tree/Normal.vue' -import TableTreeIcon from '../views/table/tree/Icon.vue' -import TableTreeAccordion from '../views/table/tree/Accordion.vue' -import TableTreeSelection from '../views/table/tree/Selection.vue' -import TableTreeRadio from '../views/table/tree/Radio.vue' -import TableTreeFixed from '../views/table/tree/Fixed.vue' -import TableTreeMaxHeight from '../views/table/tree/MaxHeight.vue' -import TableTreeFilter from '../views/table/tree/Filter.vue' -import TableTreeSort from '../views/table/tree/Sort.vue' -// import TableTreeGroupSummary from '../views/table/tree/GroupSummary.vue' -// import TableTreeGroupSummaryCount from '../views/table/tree/GroupSummaryCount.vue' -import TableTreeExpand from '../views/table/tree/Expand.vue' -import TableTreeExpandLazy from '../views/table/tree/ExpandLazy.vue' -import TableTreeCRUD from '../views/table/tree/CRUD.vue' -// import TableTreeInsert from '../views/table/tree/Insert.vue' -import TableTreeMenu from '../views/table/tree/Menu.vue' -// import TableTreeSpan from '../views/table/tree/Span.vue' -// import TableTreeHighlight from '../views/table/tree/Highlight.vue' -// import TableTreeKeyboard from '../views/table/tree/Keyboard.vue' -import TableTreeLazy from '../views/table/tree/Lazy.vue' -import TableTreeLazyMenu from '../views/table/tree/LazyMenu.vue' -import TableTreeLazyEdit from '../views/table/tree/LazyEdit.vue' -import TableTreeLine from '../views/table/tree/Line.vue' -import TableTreeEdit from '../views/table/tree/Edit.vue' -// import TableTreeEditCellValid from '../views/table/tree/CellValid.vue' -// import TableTreeEditRowValid from '../views/table/tree/RowValid.vue' -// import TableTreeEditForceCellValid from '../views/table/tree/ForceCellValid.vue' -// import TableTreeEditForceRowValid from '../views/table/tree/ForceRowValid.vue' -import TableTreeTemplate from '../views/table/tree/Template.vue' - -import TableScroll from '../views/table/scroll/Scroll.vue' -import TableScrollMode from '../views/table/scroll/Mode.vue' -import TableScrollRows from '../views/table/scroll/ScrollRows.vue' -import TableScrollFullRows from '../views/table/scroll/ScrollFullRows.vue' -import TableScrollCols from '../views/table/scroll/ScrollCols.vue' -import TableScrollFullCols from '../views/table/scroll/ScrollFullCols.vue' -import TableScrollTree from '../views/table/scroll/Tree.vue' -import TableScrollLazyTree from '../views/table/scroll/LazyTree.vue' -// import TableScrollHighlight from '../views/table/scroll/Highlight.vue' -import TableScrollKeyboard from '../views/table/scroll/Keyboard.vue' -import TableScrollMaxHeight from '../views/table/scroll/MaxHeight.vue' -import TableScrollRowHeight from '../views/table/scroll/RowHeight.vue' -import TableScrollGroup from '../views/table/scroll/Group.vue' -import TableScrollMerge from '../views/table/scroll/Merge.vue' -import TableScrollEdit from '../views/table/scroll/Edit.vue' -// import TableScrollCellValid from '../views/table/scroll/CellValid.vue' -// import TableScrollRowValid from '../views/table/scroll/RowValid.vue' -// import TableScrollForceCellValid from '../views/table/scroll/ForceCellValid.vue' -// import TableScrollForceRowValid from '../views/table/scroll/ForceRowValid.vue' -import TableScrollPartialLoad from '../views/table/scroll/PartialLoad.vue' -import TableScrollFullPartialLoad from '../views/table/scroll/FullPartialLoad.vue' -import TableScrollFooter from '../views/table/scroll/Footer.vue' -import TableScrollTemplate from '../views/table/scroll/Template.vue' -// import TableScrollTabs from '../views/table/scroll/Tabs.vue' -import TableScrollKeepAlives from '../views/table/scroll/KeepAlives.vue' -import TableScrollKeepAliveTable1 from '../views/table/scroll/keepAlives/Table1.vue' -import TableScrollKeepAliveTable2 from '../views/table/scroll/keepAlives/Table2.vue' -import TableScrollKeepAliveTable3 from '../views/table/scroll/keepAlives/Table3.vue' - -// import TableVirtualTreeBasic from '../views/table/virtual-tree/Basic.vue' -// import TableVirtualTreeNormal from '../views/table/virtual-tree/Normal.vue' -// import TableVirtualTreeRadio from '../views/table/virtual-tree/Radio.vue' -// import TableVirtualTreeCheckbox from '../views/table/virtual-tree/Checkbox.vue' -// import TableVirtualTreeIcon from '../views/table/virtual-tree/Icon.vue' -// import TableVirtualTreeFixed from '../views/table/virtual-tree/Fixed.vue' -// import TableVirtualTreeMaxHeight from '../views/table/virtual-tree/MaxHeight.vue' -// import TableVirtualTreeEdit from '../views/table/virtual-tree/Edit.vue' -// import TableVirtualTreeInsert from '../views/table/virtual-tree/Insert.vue' -// import TableVirtualTreeRemove from '../views/table/virtual-tree/Remove.vue' -// import TableVirtualTreeMenu from '../views/table/virtual-tree/Menu.vue' -// import TableVirtualTreeTemplate from '../views/table/virtual-tree/Template.vue' -// import TableVirtualTreeBig from '../views/table/virtual-tree/Big.vue' - -import TableEditPopupForm from '../views/table/edit/PopupForm.vue' -import TableEditManual from '../views/table/edit/Manual.vue' -import TableEditClick from '../views/table/edit/Click.vue' -import TableEditDBLClick from '../views/table/edit/DBLClick.vue' -import TableEditSelect from '../views/table/edit/Select.vue' -import TableAutoClearManual from '../views/table/edit/AutoClear.vue' -import TableEditCellPlaceholder from '../views/table/edit/CellPlaceholder.vue' -import TableEditInsert from '../views/table/edit/Insert.vue' -import TableEditRemove from '../views/table/edit/Remove.vue' -import TableEditRevert from '../views/table/edit/Revert.vue' -import TableEditStatus from '../views/table/edit/Status.vue' -// import TableEditCellDisable from '../views/table/edit/CellDisable.vue' -// import TableEditRowDisable from '../views/table/edit/RowDisable.vue' -// import TableEditHighlightCell from '../views/table/edit/HighlightCell.vue' -import TableEditKeyboard from '../views/table/edit/Keyboard.vue' -import TableEditKeyboardEdit from '../views/table/edit/KeyboardEdit.vue' -import TableEditCellValid from '../views/table/edit/CellValid.vue' -import TableEditRowValid from '../views/table/edit/RowValid.vue' -// import TableEditForceCellValid from '../views/table/edit/ForceCellValid.vue' -// import TableEditForceRowValid from '../views/table/edit/ForceRowValid.vue' -import TableEditFooter from '../views/table/edit/Footer.vue' -import TableEditFooterImmediately from '../views/table/edit/FooterImmediately.vue' -import TableEditExpand from '../views/table/edit/Expand.vue' -import TableEditMenu from '../views/table/edit/Menu.vue' -import TableEditSpan from '../views/table/edit/Span.vue' -import TableEditForm from '../views/table/edit/Form.vue' -import TableEditUpload from '../views/table/edit/Upload.vue' -import TableEditRealtimeSave from '../views/table/edit/RealtimeSave.vue' -import TableEditDataCount from '../views/table/edit/DataCount.vue' -import TableEditUniqueSelect from '../views/table/edit/UniqueSelect.vue' -import TableEditCascadingSelect from '../views/table/edit/CascadingSelect.vue' -import TableEditEvents from '../views/table/edit/Events.vue' -import TableEditTemplate from '../views/table/edit/Template.vue' -import TableEditFull from '../views/table/edit/Full.vue' - -import ModuleIcon from '../views/icon/Icon.vue' -import ModuleButton from '../views/button/Button.vue' -import ModuleRadio from '../views/radio/Radio.vue' -import ModuleCheckbox from '../views/checkbox/Checkbox.vue' -import ModuleInput from '../views/input/Input.vue' -import ModuleTextarea from '../views/textarea/Textarea.vue' -import ModuleSelect from '../views/select/Select.vue' -import ModulePager from '../views/pager/Pager.vue' -import ModuleModal from '../views/modal/Modal.vue' -import ModuleDrawer from '../views/drawer/Drawer.vue' -import ModuleTooltip from '../views/tooltip/Tooltip.vue' -import ModuleToolbar from '../views/toolbar/Toolbar.vue' -import ModuleForm from '../views/form/Form.vue' -import ModuleSwitch from '../views/switch/Switch.vue' -import ModuleList from '../views/list/List.vue' -import ModulePulldown from '../views/pulldown/Pulldown.vue' -import ModuleFile from '../views/file/File.vue' -import ModulePrint from '../views/print/Print.vue' - -import VXEAPI from '../views/api/API.vue' -import Donation from '../views/api/Donation.vue' -// import Run from '../views/api/Run.vue' +import StartInstall from '../views/start/StartInstall.vue' const routes: Array = [ { @@ -283,1298 +15,35 @@ const routes: Array = [ name: 'StartInstall' } }, - { - path: '/table/start/upgrade', - name: 'StartUpgrade', - component: StartUpgrade - }, { path: '/table/start/install', name: 'StartInstall', component: StartInstall }, { - path: '/table/start/quick', - name: 'StartQuick', - component: StartQuick - }, - { - path: '/table/start/use', - name: 'StartUse', - component: StartUse - }, - { - path: '/table/start/global', - name: 'StartGlobal', - component: StartGlobal - }, - { - path: '/table/start/icons', - name: 'StartIcons', - component: StartIcons - }, - { - path: '/table/start/theme', - name: 'StartTheme', - component: StartTheme - }, - { - path: '/table/start/i18n', - name: 'StartI18n', - component: StartI18n - }, - { - path: '/table/renderer/api', - name: 'RendererAPI', - component: RendererAPI - }, - { - path: '/table/renderer/filter', - name: 'RendererFilter', - component: RendererFilter - }, - { - path: '/table/renderer/default', - name: 'RendererDefault', - component: RendererDefault - }, - { - path: '/table/renderer/edit', - name: 'RendererEdit', - component: RendererEdit - }, - { - path: '/table/renderer/expand', - name: 'RendererExpand', - component: RendererExpand - }, - { - path: '/table/renderer/toolbar', - name: 'RendererToolbar', - component: RendererToolbar - }, - { - path: '/table/renderer/form', - name: 'RendererForm', - component: RendererForm - }, - { - path: '/table/renderer/empty', - name: 'RendererEmpty', - component: RendererEmpty - }, - { - path: '/table/formats/api', - name: 'FormatsAPI', - component: FormatsAPI - }, - { - path: '/table/commands/api', - name: 'CommandsAPI', - component: CommandsAPI - }, - { - path: '/table/menus/api', - name: 'MenusAPI', - component: MenusAPI - }, - { - path: '/table/interceptor/api', - name: 'InterceptorAPI', - component: InterceptorAPI - }, - { - path: '/table/base/basic', - name: 'TableBasic', - component: TableBasic - }, - { - path: '/table/base/size', - name: 'TableSize', - component: TableSize - }, - { - path: '/table/base/autoBreak', - name: 'TableAutoBreak', - component: TableAutoBreak - }, - { - path: '/table/base/width', - name: 'TableWidth', - component: TableWidth - }, - { - path: '/table/base/overflow', - name: 'TableOverflow', - component: TableOverflow - }, - { - path: '/table/base/tooltip', - name: 'TableTooltip', - component: TableTooltip - }, - { - path: '/table/base/stripe', - name: 'TableStripe', - component: TableStripe - }, - { - path: '/table/base/border', - name: 'TableBorder', - component: TableBorder - }, - { - path: '/table/base/round', - name: 'TableRound', - component: TableRound - }, - { - path: '/table/base/dynamicStyle', - name: 'TableDynamicStyle', - component: TableDynamicStyle - }, - { - path: '/table/base/style', - name: 'TableStyle', - component: TableStyle - }, - { - path: '/table/base/scrollStyle', - name: 'TableScrollStyle', - component: TableScrollStyle - }, - { - path: '/table/base/header', - name: 'TableHeader', - component: TableHeader - }, - { - path: '/table/base/highlight', - name: 'TableHeaderHighlight', - component: TableHeaderHighlight - }, - { - path: '/table/base/resizable', - name: 'TableResizable', - component: TableResizable - }, - { - path: '/table/base/maxHeight', - name: 'TableMaxHeight', - component: TableMaxHeight - }, - { - path: '/table/base/height', - name: 'TableHeight', - component: TableHeight - }, - { - path: '/table/base/rowHeight', - name: 'TableRowHeight', - component: TableRowHeight - }, - { - path: '/table/base/autoHeight', - name: 'TableAutoHeight', - component: TableAutoHeight - }, - { - path: '/table/base/fixed', - name: 'TableFixed', - component: TableFixed - }, - { - path: '/table/base/fixedFull', - name: 'TableFixedFull', - component: TableFixedFull - }, - { - path: '/table/base/group', - name: 'TableGroup', - component: TableGroup - }, - { - path: '/table/base/seq', - name: 'TableSeq', - component: TableSeq - }, - { - path: '/table/base/current', - name: 'TableCurrent', - component: TableCurrent - }, - { - path: '/table/base/radio', - name: 'TableRadio', - component: TableRadio - }, - { - path: '/table/base/selection', - name: 'TableSelection', - component: TableSelection - }, - { - path: '/table/base/sort', - name: 'TableSort', - component: TableSort - }, - { - path: '/table/base/filter', - name: 'TableFilter', - component: TableFilter - }, - { - path: '/table/base/empty', - name: 'TableEmpty', - component: TableEmpty - }, - { - path: '/table/base/loading', - name: 'TableLoading', - component: TableLoading - }, - { - path: '/table/base/format', - name: 'TableFormat', - component: TableFormat - }, - { - path: '/table/base/data', - name: 'TableData', - component: TableData - }, - { - path: '/table/base/html', - name: 'TableHTML', - component: TableHTML - }, - { - path: '/table/base/full', - name: 'TableFull', - component: TableFull - }, - { - path: '/table/advanced/event', - name: 'TableEvent', - component: TableEvent - }, - { - path: '/table/advanced/template', - name: 'TableTemplate', - component: TableTemplate - }, - { - path: '/table/advanced/dynamic', - name: 'TableDynamic', - component: TableDynamic - }, - { - path: '/table/advanced/customCheckbox', - name: 'TableCustomCheckbox', - component: TableCustomCheckbox - }, - { - path: '/table/advanced/customRadio', - name: 'TableCustomRadio', - component: TableCustomRadio - }, - { - path: '/table/advanced/sortIcon', - name: 'TableSortIcon', - component: TableSortIcon - }, - { - path: '/table/advanced/customSort', - name: 'TableCustomSort', - component: TableCustomSort - }, - { - path: '/table/advanced/multiSort', - name: 'TableMultiSort', - component: TableMultiSort - }, - { - path: '/table/advanced/manualFilter', - name: 'TableManualFilter', - component: TableManualFilter - }, - { - path: '/table/advanced/filterIcon', - name: 'TableFilterIcon', - component: TableFilterIcon - }, - { - path: '/table/advanced/span', - name: 'TableSpan', - component: TableSpan - }, - { - path: '/table/advanced/spanRow', - name: 'TableSpanRow', - component: TableSpanRow - }, - { - path: '/table/advanced/mergeCell', - name: 'TableMergeCell', - component: TableMergeCell - }, - { - path: '/table/advanced/footer', - name: 'TableFooter', - component: TableFooter - }, - { - path: '/table/advanced/footerSpan', - name: 'TableFooterSpan', - component: TableFooterSpan - }, - { - path: '/table/advanced/footerMaxHeight', - name: 'TableFooterMaxHeight', - component: TableFooterMaxHeight - }, - { - path: '/table/advanced/import', - name: 'TableImport', - component: TableImport - }, - { - path: '/table/advanced/export', - name: 'TableExport', - component: TableExport - }, - { - path: '/table/advanced/print', - name: 'TablePrint', - component: TablePrint - }, - { - path: '/table/advanced/customPrint', - name: 'TableCustomPrint', - component: TableCustomPrint - }, - { - path: '/table/advanced/fixedType', - name: 'TableFixedType', - component: TableFixedType - }, - { - path: '/table/advanced/menu', - name: 'TableMenu', - component: TableMenu - }, - { - path: '/table/advanced/menuPrivilege', - name: 'TableMenuPrivilege', - component: TableMenuPrivilege - }, - { - path: '/table/advanced/expand', - name: 'TableExpand', - component: TableExpand - }, - { - path: '/table/advanced/expandIcon', - name: 'TableExpandIcon', - component: TableExpandIcon - }, - // { - // path: '/table/advanced/expandLazy', - // name: 'TableExpandLazy', - // component: TableExpandLazy - // }, - // { - // path: '/table/advanced/expandAccordion', - // name: 'TableExpandAccordion', - // component: TableExpandAccordion - // }, - { - path: '/table/advanced/search', - name: 'TableSearch', - component: TableSearch - }, - // { - // path: '/table/advanced/groupBy', - // name: 'TableGroupBy', - // component: TableGroupBy - // }, - { - path: '/table/advanced/details', - name: 'TableDetails', - component: TableDetails - }, - // { - // path: '/table/advanced/popupEdit', - // name: 'TablePopupEdit', - // component: TablePopupEdit - // }, - { - path: '/table/advanced/toolbar', - name: 'TableToolbar', - component: TableToolbar - }, - { - path: '/table/advanced/custom', - name: 'TableCustom', - component: TableCustom - }, - { - path: '/table/advanced/customStorage', - name: 'TableCustomStorage', - component: TableCustomStorage - }, - { - path: '/table/advanced/customlWidthStorage', - name: 'TableCustomlWidthStorage', - component: TableCustomlWidthStorage - }, - // { - // path: '/table/advanced/form', - // name: 'TableForm', - // component: TableForm - // }, - // { - // path: '/table/advanced/page', - // name: 'TablePage', - // component: TablePage - // }, - // { - // path: '/table/advanced/pageIcon', - // name: 'TablePageIcon', - // component: TablePageIcon - // }, - // { - // path: '/table/advanced/highlight', - // name: 'TableHighlight', - // component: TableHighlight - // }, - // { - // path: '/table/advanced/rangeSelect', - // name: 'TableRangeSelect', - // component: TableRangeSelect - // }, - // { - // path: '/table/advanced/tabs', - // name: 'TableTabs', - // component: TableTabs - // }, - { - path: '/table/advanced/keepAlives', - component: TableKeepAlives, - children: [ - { - path: 'table1', - name: 'TableKeepAliveTable1', - component: TableKeepAliveTable1 - }, - { - path: 'table2', - name: 'TableKeepAliveTable2', - component: TableKeepAliveTable2 - }, - { - path: 'table3', - name: 'TableKeepAliveTable3', - component: TableKeepAliveTable3 - } - ] - }, - { - path: '/table/tree/basic', - name: 'TableTreeBasic', - component: TableTreeBasic - }, - { - path: '/table/tree/normal', - name: 'TableTreeNormal', - component: TableTreeNormal - }, - { - path: '/table/tree/treeIcon', - name: 'TableTreeIcon', - component: TableTreeIcon - }, - { - path: '/table/tree/accordion', - name: 'TableTreeAccordion', - component: TableTreeAccordion - }, - { - path: '/table/tree/selection', - name: 'TableTreeSelection', - component: TableTreeSelection - }, - { - path: '/table/tree/radio', - name: 'TableTreeRadio', - component: TableTreeRadio - }, - { - path: '/table/tree/fixed', - name: 'TableTreeFixed', - component: TableTreeFixed - }, - { - path: '/table/tree/maxHeight', - name: 'TableTreeMaxHeight', - component: TableTreeMaxHeight - }, - { - path: '/table/tree/filter', - name: 'TableTreeFilter', - component: TableTreeFilter - }, - { - path: '/table/tree/sort', - name: 'TableTreeSort', - component: TableTreeSort - }, - // { - // path: '/table/tree/groupSummary', - // name: 'TableTreeGroupSummary', - // component: TableTreeGroupSummary - // }, - // { - // path: '/table/tree/groupSummaryCount', - // name: 'TableTreeGroupSummaryCount', - // component: TableTreeGroupSummaryCount - // }, - { - path: '/table/tree/expand', - name: 'TableTreeExpand', - component: TableTreeExpand - }, - { - path: '/table/tree/expandLazy', - name: 'TableTreeExpandLazy', - component: TableTreeExpandLazy - }, - { - path: '/table/tree/crud', - name: 'TableTreeCRUD', - component: TableTreeCRUD - }, - // { - // path: '/table/tree/insert', - // name: 'TableTreeInsert', - // component: TableTreeInsert - // }, - { - path: '/table/tree/menu', - name: 'TableTreeMenu', - component: TableTreeMenu - }, - // { - // path: '/table/tree/span', - // name: 'TableTreeSpan', - // component: TableTreeSpan - // }, - // { - // path: '/table/tree/highlight', - // name: 'TableTreeHighlight', - // component: TableTreeHighlight - // }, - // { - // path: '/table/tree/keyboard', - // name: 'TableTreeKeyboard', - // component: TableTreeKeyboard - // }, - { - path: '/table/tree/lazy', - name: 'TableTreeLazy', - component: TableTreeLazy - }, - { - path: '/table/tree/lazyMenu', - name: 'TableTreeLazyMenu', - component: TableTreeLazyMenu - }, - { - path: '/table/tree/lazyEdit', - name: 'TableTreeLazyEdit', - component: TableTreeLazyEdit - }, - { - path: '/table/tree/line', - name: 'TableTreeLine', - component: TableTreeLine - }, - { - path: '/table/tree/edit', - name: 'TableTreeEdit', - component: TableTreeEdit - }, - // { - // path: '/table/tree/editCellValid', - // name: 'TableTreeEditCellValid', - // component: TableTreeEditCellValid - // }, - // { - // path: '/table/tree/editRowValid', - // name: 'TableTreeEditRowValid', - // component: TableTreeEditRowValid - // }, - // { - // path: '/table/tree/editForceCellValid', - // name: 'TableTreeEditForceCellValid', - // component: TableTreeEditForceCellValid - // }, - // { - // path: '/table/tree/editForceRowValid', - // name: 'TableTreeEditForceRowValid', - // component: TableTreeEditForceRowValid - // }, - { - path: '/table/tree/template', - name: 'TableTreeTemplate', - component: TableTreeTemplate - }, - // { - // path: '/table/virtualTree/basic', - // name: 'TableVirtualTreeBasic', - // component: TableVirtualTreeBasic - // }, - // { - // path: '/table/virtualTree/normal', - // name: 'TableVirtualTreeNormal', - // component: TableVirtualTreeNormal - // }, - // { - // path: '/table/virtualTree/radio', - // name: 'TableVirtualTreeRadio', - // component: TableVirtualTreeRadio - // }, - // { - // path: '/table/virtualTree/checkbox', - // name: 'TableVirtualTreeCheckbox', - // component: TableVirtualTreeCheckbox - // }, - // { - // path: '/table/virtualTree/icon', - // name: 'TableVirtualTreeIcon', - // component: TableVirtualTreeIcon - // }, - // { - // path: '/table/virtualTree/fixed', - // name: 'TableVirtualTreeFixed', - // component: TableVirtualTreeFixed - // }, - // { - // path: '/table/virtualTree/maxHeight', - // name: 'TableVirtualTreeMaxHeight', - // component: TableVirtualTreeMaxHeight - // }, - // { - // path: '/table/virtualTree/edit', - // name: 'TableVirtualTreeEdit', - // component: TableVirtualTreeEdit - // }, - // { - // path: '/table/virtualTree/insert', - // name: 'TableVirtualTreeInsert', - // component: TableVirtualTreeInsert - // }, - // { - // path: '/table/virtualTree/remove', - // name: 'TableVirtualTreeRemove', - // component: TableVirtualTreeRemove - // }, - // { - // path: '/table/virtualTree/menu', - // name: 'TableVirtualTreeMenu', - // component: TableVirtualTreeMenu - // }, - // { - // path: '/table/virtualTree/template', - // name: 'TableVirtualTreeTemplate', - // component: TableVirtualTreeTemplate - // }, - // { - // path: '/table/virtualTree/big', - // name: 'TableVirtualTreeBig', - // component: TableVirtualTreeBig - // }, - { - path: '/table/grid/basic', - name: 'GridBasic', - component: GridBasic - }, - { - path: '/table/grid/events', - name: 'GridEvents', - component: GridEvents - }, - { - path: '/table/grid/group', - name: 'GridGroup', - component: GridGroup - }, - { - path: '/table/grid/reverse', - name: 'GridReverse', - component: GridReverse - }, - { - path: '/table/grid/template', - name: 'GridTemplate', - component: GridTemplate - }, - { - path: '/table/grid/footer', - name: 'GridFooter', - component: GridFooter - }, - { - path: '/table/grid/page', - name: 'GridPage', - component: GridPage - }, - { - path: '/table/grid/proxy', - name: 'GridProxy', - component: GridProxy - }, - { - path: '/table/grid/pageProxy', - name: 'GridPageProxy', - component: GridPageProxy - }, - // { - // path: '/table/grid/configProxy', - // name: 'GridConfigProxy', - // component: GridConfigProxy - // }, - { - path: '/table/grid/edit', - name: 'GridEdit', - component: GridEdit - }, - { - path: '/table/grid/cellDisable', - name: 'GridCellDisable', - component: GridCellDisable - }, - { - path: '/table/grid/rowDisable', - name: 'GridRowDisable', - component: GridRowDisable - }, - { - path: '/table/grid/form', - name: 'GridForm', - component: GridForm - }, - { - path: '/table/grid/formProxy', - name: 'GridFormProxy', - component: GridFormProxy - }, - { - path: '/table/grid/toolbar', - name: 'GridToolbar', - component: GridToolbar - }, - { - path: '/table/grid/customToolbar', - name: 'GridCustomToolbar', - component: GridCustomToolbar - }, - { - path: '/table/grid/toolbarIcon', - name: 'GridToolbarIcon', - component: GridToolbarIcon - }, - { - path: '/table/grid/fullscreen', - name: 'GridFullscreen', - component: GridFullscreen - }, - // { - // path: '/table/grid/dynamic', - // name: 'GridDynamic', - // component: GridDynamic - // }, - { - path: '/table/grid/menu', - name: 'GridMenu', - component: GridMenu - }, - // { - // path: '/table/grid/span', - // name: 'GridSpan', - // component: GridSpan - // }, - // { - // path: '/table/grid/upload', - // name: 'GridUpload', - // component: GridUpload - // }, - // { - // path: '/table/grid/tree', - // name: 'GridTree', - // component: GridTree - // }, - // { - // path: '/table/grid/treeLazy', - // name: 'GridTreeLazy', - // component: GridTreeLazy - // }, - // { - // path: '/table/grid/treeLazyEdit', - // name: 'GridTreeLazyEdit', - // component: GridTreeLazyEdit - // }, - // { - // path: '/table/grid/treeEdit', - // name: 'GridTreeEdit', - // component: GridTreeEdit - // }, - { - path: '/table/grid/fullEdit', - name: 'GridFullEdit', - component: GridFullEdit - }, - { - path: '/table/grid/fullQuery', - name: 'GridFullQuery', - component: GridFullQuery - }, - { - path: '/table/grid/keepAlives', - component: GridKeepAlives, - children: [ - { - path: 'table1', - name: 'GridKeepAliveGrid1', - component: GridKeepAliveGrid1 - }, - { - path: 'table2', - name: 'GridKeepAliveGrid2', - component: GridKeepAliveGrid2 - }, - { - path: 'table3', - name: 'GridKeepAliveGrid3', - component: GridKeepAliveGrid3 - } - ] - }, - { - path: '/table/scroll/scroll', - name: 'TableScroll', - component: TableScroll - }, - { - path: '/table/scroll/mode', - name: 'TableScrollMode', - component: TableScrollMode - }, - { - path: '/table/scroll/rows', - name: 'TableScrollRows', - component: TableScrollRows - }, - { - path: '/table/scroll/fullRows', - name: 'TableScrollFullRows', - component: TableScrollFullRows - }, - { - path: '/table/scroll/cols', - name: 'TableScrollCols', - component: TableScrollCols - }, - { - path: '/table/scroll/fullCols', - name: 'TableScrollFullCols', - component: TableScrollFullCols - }, - { - path: '/table/scroll/tree', - name: 'TableScrollTree', - component: TableScrollTree - }, - { - path: '/table/scroll/lazyTree', - name: 'TableScrollLazyTree', - component: TableScrollLazyTree - }, - // { - // path: '/table/scroll/highlight', - // name: 'TableScrollHighlight', - // component: TableScrollHighlight - // }, - { - path: '/table/scroll/maxHeight', - name: 'TableScrollMaxHeight', - component: TableScrollMaxHeight - }, - { - path: '/table/scroll/rowHeight', - name: 'TableScrollRowHeight', - component: TableScrollRowHeight - }, - { - path: '/table/scroll/group', - name: 'TableScrollGroup', - component: TableScrollGroup - }, - { - path: '/table/scroll/merge', - name: 'TableScrollMerge', - component: TableScrollMerge - }, - { - path: '/table/scroll/keyboard', - name: 'TableScrollKeyboard', - component: TableScrollKeyboard - }, - { - path: '/table/scroll/edit', - name: 'TableScrollEdit', - component: TableScrollEdit - }, - // { - // path: '/table/scroll/cellValid', - // name: 'TableScrollCellValid', - // component: TableScrollCellValid - // }, - // { - // path: '/table/scroll/rowValid', - // name: 'TableScrollRowValid', - // component: TableScrollRowValid - // }, - // { - // path: '/table/scroll/forceCellValid', - // name: 'TableScrollForceCellValid', - // component: TableScrollForceCellValid - // }, - // { - // path: '/table/scroll/forceRowValid', - // name: 'TableScrollForceRowValid', - // component: TableScrollForceRowValid - // }, - { - path: '/table/scroll/partialLoad', - name: 'TableScrollPartialLoad', - component: TableScrollPartialLoad - }, - { - path: '/table/scroll/fullPartialLoad', - name: 'TableScrollFullPartialLoad', - component: TableScrollFullPartialLoad - }, - { - path: '/table/scroll/footer', - name: 'TableScrollFooter', - component: TableScrollFooter - }, - { - path: '/table/scroll/template', - name: 'TableScrollTemplate', - component: TableScrollTemplate - }, - // { - // path: '/table/scroll/tabs', - // name: 'TableScrollTabs', - // component: TableScrollTabs - // }, - { - path: '/table/scroll/keepAlives', - component: TableScrollKeepAlives, - children: [ - { - path: 'table1', - name: 'TableScrollKeepAliveTable1', - component: TableScrollKeepAliveTable1 - }, - { - path: 'table2', - name: 'TableScrollKeepAliveTable2', - component: TableScrollKeepAliveTable2 - }, - { - path: 'table3', - name: 'TableScrollKeepAliveTable3', - component: TableScrollKeepAliveTable3 - } - ] - }, - { - path: '/table/edit/popupForm', - name: 'TableEditPopupForm', - component: TableEditPopupForm - }, - { - path: '/table/edit/manual', - name: 'TableEditManual', - component: TableEditManual - }, - { - path: '/table/edit/click', - name: 'TableEditClick', - component: TableEditClick - }, - { - path: '/table/edit/dblclick', - name: 'TableEditDBLClick', - component: TableEditDBLClick - }, - { - path: '/table/edit/select', - name: 'TableEditSelect', - component: TableEditSelect - }, - { - path: '/table/edit/autoClear', - name: 'TableAutoClearManual', - component: TableAutoClearManual - }, - { - path: '/table/edit/cellPlaceholder', - name: 'TableEditCellPlaceholder', - component: TableEditCellPlaceholder - }, - { - path: '/table/edit/insert', - name: 'TableEditInsert', - component: TableEditInsert - }, - { - path: '/table/edit/remove', - name: 'TableEditRemove', - component: TableEditRemove - }, - { - path: '/table/edit/revert', - name: 'TableEditRevert', - component: TableEditRevert - }, - { - path: '/table/edit/status', - name: 'TableEditStatus', - component: TableEditStatus - }, - // { - // path: '/table/edit/cellDisable', - // name: 'TableEditCellDisable', - // component: TableEditCellDisable - // }, - // { - // path: '/table/edit/rowDisable', - // name: 'TableEditRowDisable', - // component: TableEditRowDisable - // }, - // { - // path: '/table/edit/highlightCell', - // name: 'TableEditHighlightCell', - // component: TableEditHighlightCell - // }, - { - path: '/table/edit/keyboard', - name: 'TableEditKeyboard', - component: TableEditKeyboard - }, - { - path: '/table/edit/keyboardEdit', - name: 'TableEditKeyboardEdit', - component: TableEditKeyboardEdit - }, - { - path: '/table/edit/cellValid', - name: 'TableEditCellValid', - component: TableEditCellValid - }, - { - path: '/table/edit/rowValid', - name: 'TableEditRowValid', - component: TableEditRowValid - }, - // { - // path: '/table/edit/forceCellValid', - // name: 'TableEditForceCellValid', - // component: TableEditForceCellValid - // }, - // { - // path: '/table/edit/forceRowValid', - // name: 'TableEditForceRowValid', - // component: TableEditForceRowValid - // }, - { - path: '/table/edit/footer', - name: 'TableEditFooter', - component: TableEditFooter - }, - { - path: '/table/edit/footerImmediately', - name: 'TableEditFooterImmediately', - component: TableEditFooterImmediately - }, - { - path: '/table/edit/expand', - name: 'TableEditExpand', - component: TableEditExpand - }, - { - path: '/table/edit/menu', - name: 'TableEditMenu', - component: TableEditMenu - }, - { - path: '/table/edit/span', - name: 'TableEditSpan', - component: TableEditSpan - }, - { - path: '/table/edit/form', - name: 'TableEditForm', - component: TableEditForm - }, - { - path: '/table/edit/upload', - name: 'TableEditUpload', - component: TableEditUpload - }, - { - path: '/table/edit/realtimeSave', - name: 'TableEditRealtimeSave', - component: TableEditRealtimeSave - }, - { - path: '/table/edit/dataCount', - name: 'TableEditDataCount', - component: TableEditDataCount - }, - { - path: '/table/edit/uniqueSelect', - name: 'TableEditUniqueSelect', - component: TableEditUniqueSelect - }, - { - path: '/table/edit/cascadingSelect', - name: 'TableEditCascadingSelect', - component: TableEditCascadingSelect - }, - { - path: '/table/edit/events', - name: 'TableEditEvents', - component: TableEditEvents - }, - { - path: '/table/edit/template', - name: 'TableEditTemplate', - component: TableEditTemplate - }, - { - path: '/table/edit/full', - name: 'TableEditFull', - component: TableEditFull - }, - { - path: '/table/module/icon', - name: 'ModuleIcon', - component: ModuleIcon - }, - { - path: '/table/module/button', - name: 'ModuleButton', - component: ModuleButton - }, - { - path: '/table/module/radio', - name: 'ModuleRadio', - component: ModuleRadio - }, - { - path: '/table/module/checkbox', - name: 'ModuleCheckbox', - component: ModuleCheckbox - }, - { - path: '/table/module/input', - name: 'ModuleInput', - component: ModuleInput - }, - { - path: '/table/module/textarea', - name: 'ModuleTextarea', - component: ModuleTextarea - }, - { - path: '/table/module/select', - name: 'ModuleSelect', - component: ModuleSelect - }, - { - path: '/table/module/pager', - name: 'ModulePager', - component: ModulePager - }, - { - path: '/table/module/modal', - name: 'ModuleModal', - component: ModuleModal - }, - { - path: '/table/module/drawer', - name: 'ModuleDrawer', - component: ModuleDrawer - }, - { - path: '/table/module/tooltip', - name: 'ModuleTooltip', - component: ModuleTooltip - }, - { - path: '/table/module/toolbar', - name: 'ModuleToolbar', - component: ModuleToolbar - }, - { - path: '/table/module/form', - name: 'ModuleForm', - component: ModuleForm - }, - { - path: '/table/module/switch', - name: 'ModuleSwitch', - component: ModuleSwitch - }, - { - path: '/table/module/list', - name: 'ModuleList', - component: ModuleList - }, - { - path: '/table/module/pulldown', - name: 'ModulePulldown', - component: ModulePulldown + path: '/component/toolbar', + name: 'ToolbarTest', + component: () => import('../views/toolbar/ToolbarTest.vue') }, { - path: '/table/module/file', - name: 'ModuleFile', - component: ModuleFile + path: '/component/table1', + name: 'TableTest1', + component: () => import('../views/table/TableTest1.vue') }, { - path: '/table/module/print', - name: 'ModulePrint', - component: ModulePrint + path: '/component/table2', + name: 'TableTest2', + component: () => import('../views/table/TableTest2.vue') }, { - path: '/donation/api', - name: 'Donation', - component: Donation + path: '/component/table3', + name: 'TableTest3', + component: () => import('../views/table/TableTest3.vue') }, { - path: '/:name/api', - name: 'VXEAPI', - component: VXEAPI - // }, - // { - // path: '/api/run', - // name: 'Run', - // component: Run + path: '/component/grid', + name: 'GridTest', + component: () => import('../views/grid/GridTest.vue') } ] diff --git a/examples/store/index.ts b/examples/store/index.ts deleted file mode 100644 index 2543feeb28..0000000000 --- a/examples/store/index.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { createStore } from 'vuex' - -export default createStore({ - state: { - showSupportQQ: false - }, - mutations: { - setSupportQQ (state, visible) { - state.showSupportQQ = !!visible - } - }, - actions: { - }, - modules: { - } -}) diff --git a/examples/style/index.scss b/examples/style/index.scss index e33f5ce2a7..5467a24d5f 100644 --- a/examples/style/index.scss +++ b/examples/style/index.scss @@ -1,2 +1,6 @@ -@import './table/style.scss'; -@import './layout.scss'; +@import './variable.scss'; + +body { + padding: 0; + margin: 0; +} \ No newline at end of file diff --git a/examples/style/layout.scss b/examples/style/layout.scss deleted file mode 100644 index 2b46f1fc71..0000000000 --- a/examples/style/layout.scss +++ /dev/null @@ -1,599 +0,0 @@ -@import './variable.scss'; - -body { - margin: 0; - padding: 0; - color: #000; - font-size: 14px; - font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,\\5FAE\8F6F\96C5\9ED1,Arial,sans-serif; - &.qingmingjie { - filter: grayscale(100%); - } - * { - box-sizing: border-box; - } - ul { - list-style: none; - padding: 0; - } - .link { - cursor: pointer; - color: $themeColor; - text-decoration: none; - &:hover { - text-decoration: underline; - } - } - p { - margin: 14px 0; - font-size: 14px; - } -} -.due-to-stop { - color: red; -} -.end-of-life { - color: #c0c4cc; - text-decoration: line-through; -} -.red { - color: red; -} -.green { - color: green; -} -.orange { - color: orange; -} -html, -body, -#app, -.app-container { - height: 100%; - overflow: hidden; -} -#app, -.app-container { - display: flex; - flex-direction: column; -} -.upgrade { - text-align: right; - .link { - margin-left: 20px; - } -} -.content { - h2 { - margin: 30px 0 0.8em; - padding-bottom: 0.7em; - border-bottom: 1px solid #ddd; - } - p { - &.tip { - border-left: 4px solid $themeColor; - padding: 12px 24px 12px 30px; - margin: 2em 0; - background-color: #f8f8f8; - } - &.warn { - border-left: 4px solid red; - padding: 12px 24px 12px 30px; - margin: 2em 0; - background-color: #f8f8f8; - } - } -} - -.page-header { - flex-shrink: 0; - height: 48px; - padding: 0 20px; - box-sizing: border-box; - border-bottom: 1px solid #dcdfe6; - box-shadow: -2px 2px 6px rgba(0, 0, 0, 0.12); - display: flex; - &:after { - content: ""; - display: block; - clear: both; - visibility: hidden; - } - .logo { - float: left; - width: 30px; - height: 30px; - margin: 12px 4px 0 0; - border-radius: 50%; - } - .title { - padding: 0 0.4em; - font-weight: 700; - } - .left { - display: flex; - align-items: center; - flex-shrink: 0; - font-size: 22px; - a { - color: $themeColor; - text-decoration: none; - cursor: pointer; - img { - vertical-align: middle; - } - } - } - .main { - display: flex; - flex-shrink: 0; - align-items: center; - padding: 0 100px; - .api-search { - position: relative; - } - .search-list { - position: absolute; - top: 40px; - left: 0; - width: 400px; - z-index: 99; - padding: 10px; - border-radius: 4px; - border: 1px solid #444; - background-color: #fff; - } - } - .right { - display: flex; - flex-grow: 1; - align-items: center; - text-align: right; - & > .content { - width: 100%; - text-align: right; - & > select, - & > input { - height: 24px; - } - } - } - .performance { - margin-right: 15px; - } - .locale-switch, - .version-switch { - margin-left: 10px; - margin-right: 15px; - } - .locale-switch { - width: 70px; - } - .version-switch { - width: 160px; - } - .donation, - .support { - padding: 3px 15px; - border-radius: 15px; - user-select: none; - } - .donation { - color: #fff; - background-color: green; - } - .support { - position: relative; - color: #333; - margin-left: 10px; - background-color: #f6ca9d; - &.is-disabled { - color: #666; - background-color: #d6cabd; - cursor: no-drop; - &:after { - display: none; - } - } - &:after { - content: ""; - position: absolute; - top: -2px; - right: -2px; - width: 10px; - height: 10px; - border-radius: 50%; - background-color: red; - } - } - .desc { - font-size: 14px; - color: #333; - } -} -.page-container { - display: flex; - flex-grow: 1; - border-bottom: 1px solid #dcdfe6; - overflow: hidden; - > .aside { - position: relative; - display: flex; - flex-direction: column; - width: 0; - flex-shrink: 0; - user-select: none; - padding-top: 10px; - border-right: 1px solid #dcdfe6; - overflow: hidden; - transition: width 0.3s; - &.visible { - width: 300px; - } - ul { - padding: 0; - margin: 0; - } - & > .header { - flex-shrink: 0; - text-align: center; - width: 300px; - .version-list { - font-size: 12px; - margin-bottom: 10px; - & > .title { - font-weight: 700; - margin: 0 6px; - } - .stable-select { - width: 74px; - } - .latest-select { - width: 105px; - } - } - .search-input { - height: 34px; - margin-bottom: 10px; - width: 180px; - } - } - & > .body { - width: 300px; - flex-grow: 1; - overflow-y: scroll; - overflow-x: hidden; - padding: 0 0 15px 20px; - .sponsors { - margin-bottom: 10px; - .title { - color: #4f5959; - } - } - } - .search-nodata { - text-align: center; - padding: 20px 0; - } - .nav-menu { - color: #333; - text-decoration: none; - font-size: 17px; - margin: 0; - padding: 0; - .nav-link { - display: block; - height: 40px; - line-height: 40px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - color: #111; - &.active { - font-weight: 700; - } - &.disabled { - color: #c0c4cc; - cursor: not-allowed; - } - } - .expand { - .nav-link-icon { - transform: rotate(90deg); - } - } - .nav-link-icon { - display: inline-block; - margin-right: 5px; - transition: transform 0.2s ease-in-out; - } - } - .nav-child-menu { - font-size: 15px; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - font-weight: 400; - > li { - padding-left: 22px; - } - .nav-link { - display: block; - height: 30px; - line-height: 30px; - &.router-link-active, - &:hover { - color: $themeColor; - } - &.router-link-active { - font-size: 16px; - font-weight: 700; - } - &.disabled { - color: #c0c4cc; - cursor: not-allowed; - } - } - } - .nav-link { - color: #444; - cursor: pointer; - text-decoration: none; - } - .is-warn { - .nav-link { - font-size: 15px; - font-weight: 700; - color: red; - &.router-link-active { - font-size: 16px; - color: red; - } - } - } - .is-donation { - .nav-link { - font-size: 15px; - font-weight: 700; - color: green; - &.router-link-active { - font-size: 16px; - color: green; - } - } - } - .is-bad { - .nav-link { - color: #f56c6c; - text-decoration: line-through; - &:hover, - &.router-link-active { - color: #f14444; - text-decoration: line-through; - } - } - } - } - > .oper-wrapper { - position: relative; - width: 16px; - .oper-btn { - position: absolute; - left: 0; - top: 50%; - height: 60px; - user-select: none; - padding: 0; - cursor: pointer; - border: 1px solid #e4e4e4; - background: #ffffff; - &:active { - outline: 0; - } - } - } - > .body { - display: flex; - position: relative; - flex-grow: 1; - overflow: hidden; - & > .content { - width: 100%; - flex-flow: 1; - position: relative; - margin: 0 auto; - padding: 15px 25px 25px 25px; - overflow: auto; - &:not(.full) { - padding: 15px 10% 25px 10%; - min-width: 800px; - } - } - .full { - .todemo { - display: none; - } - } - .todemo { - position: absolute; - top: -30px; - right: 30px; - font-size: 16px; - font-weight: 700; - i { - margin-right: 2px; - } - } - } -} - -.btn { - outline: 0; - margin: 0 10px 10px 0; - padding: 4px 8px; - border-radius: 4px; - border: 1px solid #dcdfe6; - color: #606266; - background-color: #fff; - cursor: pointer; - &:active { - border-color: $themeColor; - } -} - -.demo-code { - cursor: pointer; - font-size: 15px; - color: $themeColor; - font-weight: bold; - text-align: center; - user-select: none; - &:before { - content: ">> "; - } - &:hover { - text-decoration: underline; - } - &+pre { - display: none; - &.is-show { - display: block; - } - } -} - -.search-input { - width: 300px; -} - -.keyword-lighten { - color: #000; - background-color: #FFFF00; -} - -.api-table { - .vxe-body--row { - .vxe-body--column { - &.api-abandoned { - color: #70541C; - background-color: #FFFBE5; - .compatibility { - background-color: #70541C; - } - } - &.api-disabled { - cursor: no-drop; - color: #cb2431; - background-color: #fbb1b1; - .compatibility { - background-color: #cb2431; - } - } - &.api-pro { - color: #409eff; - font-weight: 700; - } - } - } - .disabled-line-through { - text-decoration: line-through; - } - .pro, - .compatibility { - border-radius: 10px; - padding: 2px 8px; - color: #fff; - font-size: 12px; - } - .pro { - color: #333; - background-color: #f6ca9d; - } - .compatibility { - background-color: #1081C2; - } -} - -.support-declare { - padding: 10px 0 10px 15px; -} -.support-question { - padding-left: 20px; - & > li { - line-height: 24px; - } -} -.support-help-icon { - cursor: help; -} -.support-group { - width: 300px; - margin: 20px auto 15px auto; - text-align: center; - border: 1px solid #ddd; - border-radius: 4px; -} -.support-group-item { - border-right: 1px solid #ddd; - padding: 15px 0 20px 0; - &:last-child { - border-right: 0; - } -} -.support-name { - font-size: 16px; - font-weight: 700; - line-height: 32px; -} -.support-price { - line-height: 36px; - font-size: 20px; - font-weight: 700; - color: #ff6700; -} -.support-original-price { - font-weight: normal; - padding-left: 10px; - text-decoration: line-through; -} -.support-btn { - width: 80%; -} -.support-describe { - margin: 0; - padding: 5px; - list-style: none; - text-align: center; - & > li { - padding: 0; - } -} -.support-pay-step { - text-align: center; - & > .title { - font-size: 16px; - font-weight: 700; - color: red; - } -} -.price-help-icon { - font-size: 14px; - color: #606266; - margin-left: 5px; - cursor: help; -} -.template-name { - font-size: 16px; - font-weight: 700; - line-height: 32px; -} -.template-describe { - margin: 0; - padding: 5px; - list-style: none; - text-align: left; - font-size: 12px; - & > li { - padding: 0 5px 0 20px; - } -} diff --git a/examples/style/table/style.scss b/examples/style/table/style.scss deleted file mode 100644 index eaf6e10168..0000000000 --- a/examples/style/table/style.scss +++ /dev/null @@ -1,3 +0,0 @@ -@import '../../../styles/variable.scss'; -@import './variable.scss'; -@import '../../../styles/modules.scss'; diff --git a/examples/style/table/variable.scss b/examples/style/table/variable.scss deleted file mode 100644 index 05c524367d..0000000000 --- a/examples/style/table/variable.scss +++ /dev/null @@ -1,5 +0,0 @@ -@import '../variable.scss'; - -// 修改样式变量 -$vxe-font-color: #606266; -$vxe-primary-color: $themeColor; \ No newline at end of file diff --git a/examples/style/variable.scss b/examples/style/variable.scss index dc5629d54b..f96de78bc8 100644 --- a/examples/style/variable.scss +++ b/examples/style/variable.scss @@ -1,3 +1,2 @@ // 主题色 $themeColor: #409eff; -$vxe-toolbar-height-default: auto; diff --git a/examples/views/api/API.vue b/examples/views/api/API.vue deleted file mode 100644 index 34303ee744..0000000000 --- a/examples/views/api/API.vue +++ /dev/null @@ -1,507 +0,0 @@ - - - - - diff --git a/examples/views/api/Donation.vue b/examples/views/api/Donation.vue deleted file mode 100644 index 3af3a5846a..0000000000 --- a/examples/views/api/Donation.vue +++ /dev/null @@ -1,84 +0,0 @@ - - - - - diff --git a/examples/views/button/Button.vue b/examples/views/button/Button.vue deleted file mode 100644 index 318e7ba212..0000000000 --- a/examples/views/button/Button.vue +++ /dev/null @@ -1,519 +0,0 @@ - - - - - diff --git a/examples/views/checkbox/Checkbox.vue b/examples/views/checkbox/Checkbox.vue deleted file mode 100644 index 8256588eb1..0000000000 --- a/examples/views/checkbox/Checkbox.vue +++ /dev/null @@ -1,148 +0,0 @@ - - - diff --git a/examples/views/drawer/Drawer.vue b/examples/views/drawer/Drawer.vue deleted file mode 100644 index 7906039258..0000000000 --- a/examples/views/drawer/Drawer.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - diff --git a/examples/views/file/File.vue b/examples/views/file/File.vue deleted file mode 100644 index dcf8c594ea..0000000000 --- a/examples/views/file/File.vue +++ /dev/null @@ -1,186 +0,0 @@ - - - diff --git a/examples/views/form/Form.vue b/examples/views/form/Form.vue deleted file mode 100644 index 5be9b21029..0000000000 --- a/examples/views/form/Form.vue +++ /dev/null @@ -1,416 +0,0 @@ - - - diff --git a/examples/views/grid/Basic.vue b/examples/views/grid/Basic.vue deleted file mode 100644 index 44f1930486..0000000000 --- a/examples/views/grid/Basic.vue +++ /dev/null @@ -1,203 +0,0 @@ - - - diff --git a/examples/views/grid/CellDisable.vue b/examples/views/grid/CellDisable.vue deleted file mode 100644 index dd9ccaf914..0000000000 --- a/examples/views/grid/CellDisable.vue +++ /dev/null @@ -1,208 +0,0 @@ - - - diff --git a/examples/views/grid/CustomToolbar.vue b/examples/views/grid/CustomToolbar.vue deleted file mode 100644 index ec9d41ee9b..0000000000 --- a/examples/views/grid/CustomToolbar.vue +++ /dev/null @@ -1,168 +0,0 @@ - - - diff --git a/examples/views/grid/Edit.vue b/examples/views/grid/Edit.vue deleted file mode 100644 index 1a8238e5ca..0000000000 --- a/examples/views/grid/Edit.vue +++ /dev/null @@ -1,303 +0,0 @@ - - - diff --git a/examples/views/grid/Events.vue b/examples/views/grid/Events.vue deleted file mode 100644 index 12ee8cc298..0000000000 --- a/examples/views/grid/Events.vue +++ /dev/null @@ -1,329 +0,0 @@ - - - diff --git a/examples/views/grid/Footer.vue b/examples/views/grid/Footer.vue deleted file mode 100644 index c4533d68df..0000000000 --- a/examples/views/grid/Footer.vue +++ /dev/null @@ -1,184 +0,0 @@ - - - diff --git a/examples/views/grid/Form.vue b/examples/views/grid/Form.vue deleted file mode 100644 index 06150d1440..0000000000 --- a/examples/views/grid/Form.vue +++ /dev/null @@ -1,186 +0,0 @@ - - - diff --git a/examples/views/grid/FormProxy.vue b/examples/views/grid/FormProxy.vue deleted file mode 100644 index 26ff4fa703..0000000000 --- a/examples/views/grid/FormProxy.vue +++ /dev/null @@ -1,195 +0,0 @@ - - - diff --git a/examples/views/grid/FullEdit.vue b/examples/views/grid/FullEdit.vue deleted file mode 100644 index 8a6944511a..0000000000 --- a/examples/views/grid/FullEdit.vue +++ /dev/null @@ -1,610 +0,0 @@ - - - diff --git a/examples/views/grid/FullQuery.vue b/examples/views/grid/FullQuery.vue deleted file mode 100644 index bc6b865fe0..0000000000 --- a/examples/views/grid/FullQuery.vue +++ /dev/null @@ -1,376 +0,0 @@ - - - diff --git a/examples/views/grid/Fullscreen.vue b/examples/views/grid/Fullscreen.vue deleted file mode 100644 index 7c8af1b2ad..0000000000 --- a/examples/views/grid/Fullscreen.vue +++ /dev/null @@ -1,275 +0,0 @@ - - - diff --git a/examples/views/grid/GridTest.vue b/examples/views/grid/GridTest.vue new file mode 100644 index 0000000000..96d2cb1f30 --- /dev/null +++ b/examples/views/grid/GridTest.vue @@ -0,0 +1,295 @@ + + + diff --git a/examples/views/grid/Group.vue b/examples/views/grid/Group.vue deleted file mode 100644 index aa079989ab..0000000000 --- a/examples/views/grid/Group.vue +++ /dev/null @@ -1,114 +0,0 @@ - - - diff --git a/examples/views/grid/KeepAlives.vue b/examples/views/grid/KeepAlives.vue deleted file mode 100644 index 694b2da193..0000000000 --- a/examples/views/grid/KeepAlives.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - - - diff --git a/examples/views/grid/Menu.vue b/examples/views/grid/Menu.vue deleted file mode 100644 index 2593a2d867..0000000000 --- a/examples/views/grid/Menu.vue +++ /dev/null @@ -1,305 +0,0 @@ - - - diff --git a/examples/views/grid/Page.vue b/examples/views/grid/Page.vue deleted file mode 100644 index c7c3367006..0000000000 --- a/examples/views/grid/Page.vue +++ /dev/null @@ -1,183 +0,0 @@ - - - diff --git a/examples/views/grid/PageProxy.vue b/examples/views/grid/PageProxy.vue deleted file mode 100644 index fbc3df11c3..0000000000 --- a/examples/views/grid/PageProxy.vue +++ /dev/null @@ -1,165 +0,0 @@ - - - diff --git a/examples/views/grid/Proxy.vue b/examples/views/grid/Proxy.vue deleted file mode 100644 index b6f4735846..0000000000 --- a/examples/views/grid/Proxy.vue +++ /dev/null @@ -1,124 +0,0 @@ - - - diff --git a/examples/views/grid/Reverse.vue b/examples/views/grid/Reverse.vue deleted file mode 100644 index 972fde483c..0000000000 --- a/examples/views/grid/Reverse.vue +++ /dev/null @@ -1,251 +0,0 @@ - - - - - diff --git a/examples/views/grid/RowDisable.vue b/examples/views/grid/RowDisable.vue deleted file mode 100644 index 4d44a0a11c..0000000000 --- a/examples/views/grid/RowDisable.vue +++ /dev/null @@ -1,239 +0,0 @@ - - - diff --git a/examples/views/grid/Span.vue b/examples/views/grid/Span.vue deleted file mode 100644 index 7b8b46cb04..0000000000 --- a/examples/views/grid/Span.vue +++ /dev/null @@ -1,3 +0,0 @@ - diff --git a/examples/views/grid/Template.vue b/examples/views/grid/Template.vue deleted file mode 100644 index f126135304..0000000000 --- a/examples/views/grid/Template.vue +++ /dev/null @@ -1,822 +0,0 @@ - - - - - diff --git a/examples/views/grid/Toolbar.vue b/examples/views/grid/Toolbar.vue deleted file mode 100644 index 41e44ded57..0000000000 --- a/examples/views/grid/Toolbar.vue +++ /dev/null @@ -1,253 +0,0 @@ - - - diff --git a/examples/views/grid/ToolbarIcon.vue b/examples/views/grid/ToolbarIcon.vue deleted file mode 100644 index da6d58b5bf..0000000000 --- a/examples/views/grid/ToolbarIcon.vue +++ /dev/null @@ -1,258 +0,0 @@ - - - diff --git a/examples/views/grid/keepAlives/Grid1.vue b/examples/views/grid/keepAlives/Grid1.vue deleted file mode 100644 index cf8855d988..0000000000 --- a/examples/views/grid/keepAlives/Grid1.vue +++ /dev/null @@ -1,52 +0,0 @@ - - - diff --git a/examples/views/grid/keepAlives/Grid2.vue b/examples/views/grid/keepAlives/Grid2.vue deleted file mode 100644 index 219264d6c4..0000000000 --- a/examples/views/grid/keepAlives/Grid2.vue +++ /dev/null @@ -1,49 +0,0 @@ - - - diff --git a/examples/views/grid/keepAlives/Grid3.vue b/examples/views/grid/keepAlives/Grid3.vue deleted file mode 100644 index 1bc77a35dc..0000000000 --- a/examples/views/grid/keepAlives/Grid3.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - diff --git a/examples/views/icon/Icon.vue b/examples/views/icon/Icon.vue deleted file mode 100644 index c19e1f2f6f..0000000000 --- a/examples/views/icon/Icon.vue +++ /dev/null @@ -1,74 +0,0 @@ - - - - - diff --git a/examples/views/input/Input.vue b/examples/views/input/Input.vue deleted file mode 100644 index 717f7c8a6a..0000000000 --- a/examples/views/input/Input.vue +++ /dev/null @@ -1,588 +0,0 @@ - - - - - diff --git a/examples/views/list/List.vue b/examples/views/list/List.vue deleted file mode 100644 index 7e0b2e74fe..0000000000 --- a/examples/views/list/List.vue +++ /dev/null @@ -1,352 +0,0 @@ - - - - - diff --git a/examples/views/modal/Modal.vue b/examples/views/modal/Modal.vue deleted file mode 100644 index 2663249529..0000000000 --- a/examples/views/modal/Modal.vue +++ /dev/null @@ -1,636 +0,0 @@ - - - diff --git a/examples/views/pager/Pager.vue b/examples/views/pager/Pager.vue deleted file mode 100644 index 5e5b11446a..0000000000 --- a/examples/views/pager/Pager.vue +++ /dev/null @@ -1,316 +0,0 @@ - - - diff --git a/examples/views/print/Print.vue b/examples/views/print/Print.vue deleted file mode 100644 index 4aa12de98d..0000000000 --- a/examples/views/print/Print.vue +++ /dev/null @@ -1,959 +0,0 @@ - - - diff --git a/examples/views/pulldown/Pulldown.vue b/examples/views/pulldown/Pulldown.vue deleted file mode 100644 index f1da615354..0000000000 --- a/examples/views/pulldown/Pulldown.vue +++ /dev/null @@ -1,606 +0,0 @@ - - - - - diff --git a/examples/views/radio/Radio.vue b/examples/views/radio/Radio.vue deleted file mode 100644 index e999aaef0c..0000000000 --- a/examples/views/radio/Radio.vue +++ /dev/null @@ -1,180 +0,0 @@ - - - diff --git a/examples/views/select/Select.vue b/examples/views/select/Select.vue deleted file mode 100644 index 413ed3ab83..0000000000 --- a/examples/views/select/Select.vue +++ /dev/null @@ -1,613 +0,0 @@ - - - diff --git a/examples/views/start/Global.vue b/examples/views/start/Global.vue deleted file mode 100644 index d09632614b..0000000000 --- a/examples/views/start/Global.vue +++ /dev/null @@ -1,215 +0,0 @@ - - - diff --git a/examples/views/start/I18n.vue b/examples/views/start/I18n.vue deleted file mode 100644 index 248643d64b..0000000000 --- a/examples/views/start/I18n.vue +++ /dev/null @@ -1,108 +0,0 @@ - - - - - diff --git a/examples/views/start/Icons.vue b/examples/views/start/Icons.vue deleted file mode 100644 index df0dd00314..0000000000 --- a/examples/views/start/Icons.vue +++ /dev/null @@ -1,84 +0,0 @@ - diff --git a/examples/views/start/Install.vue b/examples/views/start/Install.vue deleted file mode 100644 index f2c8983f63..0000000000 --- a/examples/views/start/Install.vue +++ /dev/null @@ -1,74 +0,0 @@ - - - diff --git a/examples/views/start/Quick.vue b/examples/views/start/Quick.vue deleted file mode 100644 index dcb9fe88a7..0000000000 --- a/examples/views/start/Quick.vue +++ /dev/null @@ -1,345 +0,0 @@ - - - diff --git a/examples/views/start/StartInstall.vue b/examples/views/start/StartInstall.vue new file mode 100644 index 0000000000..5a9a64752f --- /dev/null +++ b/examples/views/start/StartInstall.vue @@ -0,0 +1,55 @@ + + + diff --git a/examples/views/start/Theme.vue b/examples/views/start/Theme.vue deleted file mode 100644 index c716ef94be..0000000000 --- a/examples/views/start/Theme.vue +++ /dev/null @@ -1,61 +0,0 @@ - diff --git a/examples/views/start/Upgrade.vue b/examples/views/start/Upgrade.vue deleted file mode 100644 index 0e1befb5bb..0000000000 --- a/examples/views/start/Upgrade.vue +++ /dev/null @@ -1,72 +0,0 @@ - - - diff --git a/examples/views/start/Use.vue b/examples/views/start/Use.vue deleted file mode 100644 index a72c475f08..0000000000 --- a/examples/views/start/Use.vue +++ /dev/null @@ -1,264 +0,0 @@ - diff --git a/examples/views/switch/Switch.vue b/examples/views/switch/Switch.vue deleted file mode 100644 index ab5c7dcffe..0000000000 --- a/examples/views/switch/Switch.vue +++ /dev/null @@ -1,185 +0,0 @@ - - - - - diff --git a/examples/views/table/TableTest1.vue b/examples/views/table/TableTest1.vue new file mode 100644 index 0000000000..eadae6d01f --- /dev/null +++ b/examples/views/table/TableTest1.vue @@ -0,0 +1,98 @@ + + + diff --git a/examples/views/table/TableTest2.vue b/examples/views/table/TableTest2.vue new file mode 100644 index 0000000000..d70021b1d4 --- /dev/null +++ b/examples/views/table/TableTest2.vue @@ -0,0 +1,125 @@ + + + diff --git a/examples/views/table/TableTest3.vue b/examples/views/table/TableTest3.vue new file mode 100644 index 0000000000..49b8aa54a0 --- /dev/null +++ b/examples/views/table/TableTest3.vue @@ -0,0 +1,128 @@ + + + diff --git a/examples/views/table/advanced/Custom.vue b/examples/views/table/advanced/Custom.vue deleted file mode 100644 index ccd0f77c8a..0000000000 --- a/examples/views/table/advanced/Custom.vue +++ /dev/null @@ -1,536 +0,0 @@ - - - diff --git a/examples/views/table/advanced/CustomCheckbox.vue b/examples/views/table/advanced/CustomCheckbox.vue deleted file mode 100644 index 2fb5d62a0e..0000000000 --- a/examples/views/table/advanced/CustomCheckbox.vue +++ /dev/null @@ -1,132 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/CustomPrint.vue b/examples/views/table/advanced/CustomPrint.vue deleted file mode 100644 index 488ab0cfa6..0000000000 --- a/examples/views/table/advanced/CustomPrint.vue +++ /dev/null @@ -1,802 +0,0 @@ - - - diff --git a/examples/views/table/advanced/CustomRadio.vue b/examples/views/table/advanced/CustomRadio.vue deleted file mode 100644 index 293a49dcce..0000000000 --- a/examples/views/table/advanced/CustomRadio.vue +++ /dev/null @@ -1,118 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/CustomSort.vue b/examples/views/table/advanced/CustomSort.vue deleted file mode 100644 index 58c1daac18..0000000000 --- a/examples/views/table/advanced/CustomSort.vue +++ /dev/null @@ -1,118 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/CustomStorage.vue b/examples/views/table/advanced/CustomStorage.vue deleted file mode 100644 index 3a2d5d1497..0000000000 --- a/examples/views/table/advanced/CustomStorage.vue +++ /dev/null @@ -1,142 +0,0 @@ - - - diff --git a/examples/views/table/advanced/CustomlWidthStorage.vue b/examples/views/table/advanced/CustomlWidthStorage.vue deleted file mode 100644 index c2b327f950..0000000000 --- a/examples/views/table/advanced/CustomlWidthStorage.vue +++ /dev/null @@ -1,181 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Details.vue b/examples/views/table/advanced/Details.vue deleted file mode 100644 index 9d341d69db..0000000000 --- a/examples/views/table/advanced/Details.vue +++ /dev/null @@ -1,154 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Dynamic.vue b/examples/views/table/advanced/Dynamic.vue deleted file mode 100644 index ef446bee6d..0000000000 --- a/examples/views/table/advanced/Dynamic.vue +++ /dev/null @@ -1,254 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Event.vue b/examples/views/table/advanced/Event.vue deleted file mode 100644 index 0a23a6811d..0000000000 --- a/examples/views/table/advanced/Event.vue +++ /dev/null @@ -1,245 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Expand.vue b/examples/views/table/advanced/Expand.vue deleted file mode 100644 index bad2dac1dd..0000000000 --- a/examples/views/table/advanced/Expand.vue +++ /dev/null @@ -1,529 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/ExpandIcon.vue b/examples/views/table/advanced/ExpandIcon.vue deleted file mode 100644 index a9339ecba9..0000000000 --- a/examples/views/table/advanced/ExpandIcon.vue +++ /dev/null @@ -1,511 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/Export.vue b/examples/views/table/advanced/Export.vue deleted file mode 100644 index 97133cdfd9..0000000000 --- a/examples/views/table/advanced/Export.vue +++ /dev/null @@ -1,786 +0,0 @@ - - - diff --git a/examples/views/table/advanced/FilterIcon.vue b/examples/views/table/advanced/FilterIcon.vue deleted file mode 100644 index 5650bb5ee7..0000000000 --- a/examples/views/table/advanced/FilterIcon.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/examples/views/table/advanced/FixedType.vue b/examples/views/table/advanced/FixedType.vue deleted file mode 100644 index 6d12f6330e..0000000000 --- a/examples/views/table/advanced/FixedType.vue +++ /dev/null @@ -1,150 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Footer.vue b/examples/views/table/advanced/Footer.vue deleted file mode 100644 index ad48fe8138..0000000000 --- a/examples/views/table/advanced/Footer.vue +++ /dev/null @@ -1,212 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/FooterSpan.vue b/examples/views/table/advanced/FooterSpan.vue deleted file mode 100644 index 860819bf59..0000000000 --- a/examples/views/table/advanced/FooterSpan.vue +++ /dev/null @@ -1,505 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Import.vue b/examples/views/table/advanced/Import.vue deleted file mode 100644 index 3492771278..0000000000 --- a/examples/views/table/advanced/Import.vue +++ /dev/null @@ -1,180 +0,0 @@ - - - diff --git a/examples/views/table/advanced/KeepAlives.vue b/examples/views/table/advanced/KeepAlives.vue deleted file mode 100644 index ab2b7d8387..0000000000 --- a/examples/views/table/advanced/KeepAlives.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/ManualFilter.vue b/examples/views/table/advanced/ManualFilter.vue deleted file mode 100644 index 9ab5d948b3..0000000000 --- a/examples/views/table/advanced/ManualFilter.vue +++ /dev/null @@ -1,199 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/MaxHeight.vue b/examples/views/table/advanced/MaxHeight.vue deleted file mode 100644 index f0f4cd20c2..0000000000 --- a/examples/views/table/advanced/MaxHeight.vue +++ /dev/null @@ -1,338 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Menu.vue b/examples/views/table/advanced/Menu.vue deleted file mode 100644 index 0804e00b39..0000000000 --- a/examples/views/table/advanced/Menu.vue +++ /dev/null @@ -1,315 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/MenuPrivilege.vue b/examples/views/table/advanced/MenuPrivilege.vue deleted file mode 100644 index a22044009e..0000000000 --- a/examples/views/table/advanced/MenuPrivilege.vue +++ /dev/null @@ -1,375 +0,0 @@ - - - diff --git a/examples/views/table/advanced/MergeCell.vue b/examples/views/table/advanced/MergeCell.vue deleted file mode 100644 index 16e987572c..0000000000 --- a/examples/views/table/advanced/MergeCell.vue +++ /dev/null @@ -1,417 +0,0 @@ - - - diff --git a/examples/views/table/advanced/MultiSort.vue b/examples/views/table/advanced/MultiSort.vue deleted file mode 100644 index c430906df9..0000000000 --- a/examples/views/table/advanced/MultiSort.vue +++ /dev/null @@ -1,138 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Print.vue b/examples/views/table/advanced/Print.vue deleted file mode 100644 index 2907b47d25..0000000000 --- a/examples/views/table/advanced/Print.vue +++ /dev/null @@ -1,297 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Search.vue b/examples/views/table/advanced/Search.vue deleted file mode 100644 index 8d249279e0..0000000000 --- a/examples/views/table/advanced/Search.vue +++ /dev/null @@ -1,373 +0,0 @@ - - - diff --git a/examples/views/table/advanced/SortIcon.vue b/examples/views/table/advanced/SortIcon.vue deleted file mode 100644 index 988134ac1a..0000000000 --- a/examples/views/table/advanced/SortIcon.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Span.vue b/examples/views/table/advanced/Span.vue deleted file mode 100644 index 0beef80399..0000000000 --- a/examples/views/table/advanced/Span.vue +++ /dev/null @@ -1,181 +0,0 @@ - - - diff --git a/examples/views/table/advanced/SpanRow.vue b/examples/views/table/advanced/SpanRow.vue deleted file mode 100644 index 6ef9e6be83..0000000000 --- a/examples/views/table/advanced/SpanRow.vue +++ /dev/null @@ -1,394 +0,0 @@ - - - diff --git a/examples/views/table/advanced/Template.vue b/examples/views/table/advanced/Template.vue deleted file mode 100644 index ec47f44be3..0000000000 --- a/examples/views/table/advanced/Template.vue +++ /dev/null @@ -1,306 +0,0 @@ - - - - - diff --git a/examples/views/table/advanced/Toolbar.vue b/examples/views/table/advanced/Toolbar.vue deleted file mode 100644 index e036b5419d..0000000000 --- a/examples/views/table/advanced/Toolbar.vue +++ /dev/null @@ -1,175 +0,0 @@ - - - diff --git a/examples/views/table/advanced/keepAlives/Table1.vue b/examples/views/table/advanced/keepAlives/Table1.vue deleted file mode 100644 index 45216ce171..0000000000 --- a/examples/views/table/advanced/keepAlives/Table1.vue +++ /dev/null @@ -1,50 +0,0 @@ - - - diff --git a/examples/views/table/advanced/keepAlives/Table2.vue b/examples/views/table/advanced/keepAlives/Table2.vue deleted file mode 100644 index 86aed68b4f..0000000000 --- a/examples/views/table/advanced/keepAlives/Table2.vue +++ /dev/null @@ -1,47 +0,0 @@ - - - diff --git a/examples/views/table/advanced/keepAlives/Table3.vue b/examples/views/table/advanced/keepAlives/Table3.vue deleted file mode 100644 index 9c4e365e41..0000000000 --- a/examples/views/table/advanced/keepAlives/Table3.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - diff --git a/examples/views/table/base/AutoBreak.vue b/examples/views/table/base/AutoBreak.vue deleted file mode 100644 index 1e2bf02c1f..0000000000 --- a/examples/views/table/base/AutoBreak.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/examples/views/table/base/AutoHeight.vue b/examples/views/table/base/AutoHeight.vue deleted file mode 100644 index 2be99d6bd8..0000000000 --- a/examples/views/table/base/AutoHeight.vue +++ /dev/null @@ -1,369 +0,0 @@ - - - diff --git a/examples/views/table/base/Basic.vue b/examples/views/table/base/Basic.vue deleted file mode 100644 index bd7a5aa2ce..0000000000 --- a/examples/views/table/base/Basic.vue +++ /dev/null @@ -1,134 +0,0 @@ - - - diff --git a/examples/views/table/base/Border.vue b/examples/views/table/base/Border.vue deleted file mode 100644 index e922aa45f5..0000000000 --- a/examples/views/table/base/Border.vue +++ /dev/null @@ -1,298 +0,0 @@ - - - diff --git a/examples/views/table/base/Current.vue b/examples/views/table/base/Current.vue deleted file mode 100644 index 172db8c1d1..0000000000 --- a/examples/views/table/base/Current.vue +++ /dev/null @@ -1,65 +0,0 @@ - - - diff --git a/examples/views/table/base/Data.vue b/examples/views/table/base/Data.vue deleted file mode 100644 index 3b2af28d41..0000000000 --- a/examples/views/table/base/Data.vue +++ /dev/null @@ -1,242 +0,0 @@ - - - diff --git a/examples/views/table/base/DynamicStyle.vue b/examples/views/table/base/DynamicStyle.vue deleted file mode 100644 index 33151743d1..0000000000 --- a/examples/views/table/base/DynamicStyle.vue +++ /dev/null @@ -1,159 +0,0 @@ - - - diff --git a/examples/views/table/base/Empty.vue b/examples/views/table/base/Empty.vue deleted file mode 100644 index bf63a42c00..0000000000 --- a/examples/views/table/base/Empty.vue +++ /dev/null @@ -1,220 +0,0 @@ - - - diff --git a/examples/views/table/base/Filter.vue b/examples/views/table/base/Filter.vue deleted file mode 100644 index 9afbb3e8d0..0000000000 --- a/examples/views/table/base/Filter.vue +++ /dev/null @@ -1,151 +0,0 @@ - - - diff --git a/examples/views/table/base/Fixed.vue b/examples/views/table/base/Fixed.vue deleted file mode 100644 index fcf5ec9cd6..0000000000 --- a/examples/views/table/base/Fixed.vue +++ /dev/null @@ -1,135 +0,0 @@ - - - diff --git a/examples/views/table/base/FixedFull.vue b/examples/views/table/base/FixedFull.vue deleted file mode 100644 index 5cab1662a5..0000000000 --- a/examples/views/table/base/FixedFull.vue +++ /dev/null @@ -1,461 +0,0 @@ - - - diff --git a/examples/views/table/base/Format.vue b/examples/views/table/base/Format.vue deleted file mode 100644 index 11f94b422a..0000000000 --- a/examples/views/table/base/Format.vue +++ /dev/null @@ -1,254 +0,0 @@ - - - diff --git a/examples/views/table/base/Full.vue b/examples/views/table/base/Full.vue deleted file mode 100644 index 7284160912..0000000000 --- a/examples/views/table/base/Full.vue +++ /dev/null @@ -1,104 +0,0 @@ - - - diff --git a/examples/views/table/base/Group.vue b/examples/views/table/base/Group.vue deleted file mode 100644 index ba23926e2d..0000000000 --- a/examples/views/table/base/Group.vue +++ /dev/null @@ -1,261 +0,0 @@ - - - diff --git a/examples/views/table/base/HTML.vue b/examples/views/table/base/HTML.vue deleted file mode 100644 index 36ccb2435b..0000000000 --- a/examples/views/table/base/HTML.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/examples/views/table/base/Header.vue b/examples/views/table/base/Header.vue deleted file mode 100644 index 75a277c906..0000000000 --- a/examples/views/table/base/Header.vue +++ /dev/null @@ -1,168 +0,0 @@ - - - diff --git a/examples/views/table/base/HeaderHighlight.vue b/examples/views/table/base/HeaderHighlight.vue deleted file mode 100644 index 542e31b41c..0000000000 --- a/examples/views/table/base/HeaderHighlight.vue +++ /dev/null @@ -1,164 +0,0 @@ - - - diff --git a/examples/views/table/base/Height.vue b/examples/views/table/base/Height.vue deleted file mode 100644 index 0b852f40ca..0000000000 --- a/examples/views/table/base/Height.vue +++ /dev/null @@ -1,108 +0,0 @@ - - - diff --git a/examples/views/table/base/Loading.vue b/examples/views/table/base/Loading.vue deleted file mode 100644 index 974bfc7061..0000000000 --- a/examples/views/table/base/Loading.vue +++ /dev/null @@ -1,194 +0,0 @@ - - - diff --git a/examples/views/table/base/MaxHeight.vue b/examples/views/table/base/MaxHeight.vue deleted file mode 100644 index 85a95381ad..0000000000 --- a/examples/views/table/base/MaxHeight.vue +++ /dev/null @@ -1,235 +0,0 @@ - - - diff --git a/examples/views/table/base/Overflow.vue b/examples/views/table/base/Overflow.vue deleted file mode 100644 index cad53d3c6d..0000000000 --- a/examples/views/table/base/Overflow.vue +++ /dev/null @@ -1,294 +0,0 @@ - - - diff --git a/examples/views/table/base/Radio.vue b/examples/views/table/base/Radio.vue deleted file mode 100644 index 61ae2a16f3..0000000000 --- a/examples/views/table/base/Radio.vue +++ /dev/null @@ -1,589 +0,0 @@ - - - diff --git a/examples/views/table/base/Resizable.vue b/examples/views/table/base/Resizable.vue deleted file mode 100644 index 290150ca19..0000000000 --- a/examples/views/table/base/Resizable.vue +++ /dev/null @@ -1,486 +0,0 @@ - - - diff --git a/examples/views/table/base/Round.vue b/examples/views/table/base/Round.vue deleted file mode 100644 index 6e3eb134bc..0000000000 --- a/examples/views/table/base/Round.vue +++ /dev/null @@ -1,86 +0,0 @@ - - - diff --git a/examples/views/table/base/RowHeight.vue b/examples/views/table/base/RowHeight.vue deleted file mode 100644 index 2b1573391e..0000000000 --- a/examples/views/table/base/RowHeight.vue +++ /dev/null @@ -1,128 +0,0 @@ - - - - - diff --git a/examples/views/table/base/ScrollStyle.vue b/examples/views/table/base/ScrollStyle.vue deleted file mode 100644 index 1e9a032ac4..0000000000 --- a/examples/views/table/base/ScrollStyle.vue +++ /dev/null @@ -1,203 +0,0 @@ - - - - - diff --git a/examples/views/table/base/Selection.vue b/examples/views/table/base/Selection.vue deleted file mode 100644 index cf948d22cb..0000000000 --- a/examples/views/table/base/Selection.vue +++ /dev/null @@ -1,715 +0,0 @@ - - - diff --git a/examples/views/table/base/Seq.vue b/examples/views/table/base/Seq.vue deleted file mode 100644 index c149b1c540..0000000000 --- a/examples/views/table/base/Seq.vue +++ /dev/null @@ -1,235 +0,0 @@ - - - diff --git a/examples/views/table/base/Size.vue b/examples/views/table/base/Size.vue deleted file mode 100644 index ba98be9b41..0000000000 --- a/examples/views/table/base/Size.vue +++ /dev/null @@ -1,397 +0,0 @@ - - - diff --git a/examples/views/table/base/Sort.vue b/examples/views/table/base/Sort.vue deleted file mode 100644 index f1ced04ec8..0000000000 --- a/examples/views/table/base/Sort.vue +++ /dev/null @@ -1,601 +0,0 @@ - - - diff --git a/examples/views/table/base/Stripe.vue b/examples/views/table/base/Stripe.vue deleted file mode 100644 index 3855dcc614..0000000000 --- a/examples/views/table/base/Stripe.vue +++ /dev/null @@ -1,136 +0,0 @@ - - - diff --git a/examples/views/table/base/Style.vue b/examples/views/table/base/Style.vue deleted file mode 100644 index f2007151d8..0000000000 --- a/examples/views/table/base/Style.vue +++ /dev/null @@ -1,336 +0,0 @@ - - - - - diff --git a/examples/views/table/base/Tooltip.vue b/examples/views/table/base/Tooltip.vue deleted file mode 100644 index 2c4572bca7..0000000000 --- a/examples/views/table/base/Tooltip.vue +++ /dev/null @@ -1,179 +0,0 @@ - - - diff --git a/examples/views/table/base/Width.vue b/examples/views/table/base/Width.vue deleted file mode 100644 index 0e62ef2bc6..0000000000 --- a/examples/views/table/base/Width.vue +++ /dev/null @@ -1,291 +0,0 @@ - - - diff --git a/examples/views/table/commands/API.vue b/examples/views/table/commands/API.vue deleted file mode 100644 index 53089827b5..0000000000 --- a/examples/views/table/commands/API.vue +++ /dev/null @@ -1,108 +0,0 @@ - - - diff --git a/examples/views/table/edit/AutoClear.vue b/examples/views/table/edit/AutoClear.vue deleted file mode 100644 index 6aa0b39ef1..0000000000 --- a/examples/views/table/edit/AutoClear.vue +++ /dev/null @@ -1,204 +0,0 @@ - - - diff --git a/examples/views/table/edit/CascadingSelect.vue b/examples/views/table/edit/CascadingSelect.vue deleted file mode 100644 index a6c49d9b48..0000000000 --- a/examples/views/table/edit/CascadingSelect.vue +++ /dev/null @@ -1,235 +0,0 @@ - - - diff --git a/examples/views/table/edit/CellPlaceholder.vue b/examples/views/table/edit/CellPlaceholder.vue deleted file mode 100644 index f61c63ec1e..0000000000 --- a/examples/views/table/edit/CellPlaceholder.vue +++ /dev/null @@ -1,107 +0,0 @@ - - - diff --git a/examples/views/table/edit/CellValid.vue b/examples/views/table/edit/CellValid.vue deleted file mode 100644 index 99205deabb..0000000000 --- a/examples/views/table/edit/CellValid.vue +++ /dev/null @@ -1,456 +0,0 @@ - - - diff --git a/examples/views/table/edit/Click.vue b/examples/views/table/edit/Click.vue deleted file mode 100644 index 88bcb21fc6..0000000000 --- a/examples/views/table/edit/Click.vue +++ /dev/null @@ -1,186 +0,0 @@ - - - diff --git a/examples/views/table/edit/DBLClick.vue b/examples/views/table/edit/DBLClick.vue deleted file mode 100644 index 609627d53e..0000000000 --- a/examples/views/table/edit/DBLClick.vue +++ /dev/null @@ -1,186 +0,0 @@ - - - diff --git a/examples/views/table/edit/DataCount.vue b/examples/views/table/edit/DataCount.vue deleted file mode 100644 index 0e62bc2b6f..0000000000 --- a/examples/views/table/edit/DataCount.vue +++ /dev/null @@ -1,171 +0,0 @@ - - - diff --git a/examples/views/table/edit/Events.vue b/examples/views/table/edit/Events.vue deleted file mode 100644 index 35e40c1d00..0000000000 --- a/examples/views/table/edit/Events.vue +++ /dev/null @@ -1,93 +0,0 @@ - - - diff --git a/examples/views/table/edit/Expand.vue b/examples/views/table/edit/Expand.vue deleted file mode 100644 index 5ef4019ffc..0000000000 --- a/examples/views/table/edit/Expand.vue +++ /dev/null @@ -1,166 +0,0 @@ - - - - - diff --git a/examples/views/table/edit/Footer.vue b/examples/views/table/edit/Footer.vue deleted file mode 100644 index 5870183147..0000000000 --- a/examples/views/table/edit/Footer.vue +++ /dev/null @@ -1,291 +0,0 @@ - - - - - diff --git a/examples/views/table/edit/FooterImmediately.vue b/examples/views/table/edit/FooterImmediately.vue deleted file mode 100644 index 098e4f64cb..0000000000 --- a/examples/views/table/edit/FooterImmediately.vue +++ /dev/null @@ -1,338 +0,0 @@ - - - - - diff --git a/examples/views/table/edit/Form.vue b/examples/views/table/edit/Form.vue deleted file mode 100644 index d15466fcf0..0000000000 --- a/examples/views/table/edit/Form.vue +++ /dev/null @@ -1,176 +0,0 @@ - - - diff --git a/examples/views/table/edit/Full.vue b/examples/views/table/edit/Full.vue deleted file mode 100644 index 5951e6dadc..0000000000 --- a/examples/views/table/edit/Full.vue +++ /dev/null @@ -1,370 +0,0 @@ - - - diff --git a/examples/views/table/edit/Insert.vue b/examples/views/table/edit/Insert.vue deleted file mode 100644 index 975a061491..0000000000 --- a/examples/views/table/edit/Insert.vue +++ /dev/null @@ -1,200 +0,0 @@ - - - diff --git a/examples/views/table/edit/Keyboard.vue b/examples/views/table/edit/Keyboard.vue deleted file mode 100644 index e795a3aed9..0000000000 --- a/examples/views/table/edit/Keyboard.vue +++ /dev/null @@ -1,249 +0,0 @@ - - - diff --git a/examples/views/table/edit/KeyboardEdit.vue b/examples/views/table/edit/KeyboardEdit.vue deleted file mode 100644 index bc63410fbd..0000000000 --- a/examples/views/table/edit/KeyboardEdit.vue +++ /dev/null @@ -1,195 +0,0 @@ - - - diff --git a/examples/views/table/edit/Manual.vue b/examples/views/table/edit/Manual.vue deleted file mode 100644 index d3185e3978..0000000000 --- a/examples/views/table/edit/Manual.vue +++ /dev/null @@ -1,208 +0,0 @@ - - - diff --git a/examples/views/table/edit/Menu.vue b/examples/views/table/edit/Menu.vue deleted file mode 100644 index eae58aa1cf..0000000000 --- a/examples/views/table/edit/Menu.vue +++ /dev/null @@ -1,319 +0,0 @@ - - - diff --git a/examples/views/table/edit/PopupForm.vue b/examples/views/table/edit/PopupForm.vue deleted file mode 100644 index 241522dbe5..0000000000 --- a/examples/views/table/edit/PopupForm.vue +++ /dev/null @@ -1,408 +0,0 @@ - - - diff --git a/examples/views/table/edit/RealtimeSave.vue b/examples/views/table/edit/RealtimeSave.vue deleted file mode 100644 index eff94298cd..0000000000 --- a/examples/views/table/edit/RealtimeSave.vue +++ /dev/null @@ -1,151 +0,0 @@ - - - diff --git a/examples/views/table/edit/Remove.vue b/examples/views/table/edit/Remove.vue deleted file mode 100644 index 6da7a5f1d2..0000000000 --- a/examples/views/table/edit/Remove.vue +++ /dev/null @@ -1,199 +0,0 @@ - - - diff --git a/examples/views/table/edit/Revert.vue b/examples/views/table/edit/Revert.vue deleted file mode 100644 index 95758c0697..0000000000 --- a/examples/views/table/edit/Revert.vue +++ /dev/null @@ -1,212 +0,0 @@ - - - diff --git a/examples/views/table/edit/RowValid.vue b/examples/views/table/edit/RowValid.vue deleted file mode 100644 index 4f00c532e8..0000000000 --- a/examples/views/table/edit/RowValid.vue +++ /dev/null @@ -1,406 +0,0 @@ - - - diff --git a/examples/views/table/edit/Select.vue b/examples/views/table/edit/Select.vue deleted file mode 100644 index 1a6e6c38e5..0000000000 --- a/examples/views/table/edit/Select.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - diff --git a/examples/views/table/edit/Span.vue b/examples/views/table/edit/Span.vue deleted file mode 100644 index 054a6417cb..0000000000 --- a/examples/views/table/edit/Span.vue +++ /dev/null @@ -1,249 +0,0 @@ - - - diff --git a/examples/views/table/edit/Status.vue b/examples/views/table/edit/Status.vue deleted file mode 100644 index 36724dcaf0..0000000000 --- a/examples/views/table/edit/Status.vue +++ /dev/null @@ -1,305 +0,0 @@ - - - diff --git a/examples/views/table/edit/Template.vue b/examples/views/table/edit/Template.vue deleted file mode 100644 index 44d35c0be7..0000000000 --- a/examples/views/table/edit/Template.vue +++ /dev/null @@ -1,417 +0,0 @@ - - - - - diff --git a/examples/views/table/edit/UniqueSelect.vue b/examples/views/table/edit/UniqueSelect.vue deleted file mode 100644 index 22ea64d8cc..0000000000 --- a/examples/views/table/edit/UniqueSelect.vue +++ /dev/null @@ -1,189 +0,0 @@ - - - diff --git a/examples/views/table/edit/Upload.vue b/examples/views/table/edit/Upload.vue deleted file mode 100644 index 2c22892b21..0000000000 --- a/examples/views/table/edit/Upload.vue +++ /dev/null @@ -1,165 +0,0 @@ - - - diff --git a/examples/views/table/formats/API.vue b/examples/views/table/formats/API.vue deleted file mode 100644 index 7f60cf2ac6..0000000000 --- a/examples/views/table/formats/API.vue +++ /dev/null @@ -1,103 +0,0 @@ - - - diff --git a/examples/views/table/interceptor/API.vue b/examples/views/table/interceptor/API.vue deleted file mode 100644 index c98be2e490..0000000000 --- a/examples/views/table/interceptor/API.vue +++ /dev/null @@ -1,222 +0,0 @@ - - - diff --git a/examples/views/table/menus/API.vue b/examples/views/table/menus/API.vue deleted file mode 100644 index d4969032da..0000000000 --- a/examples/views/table/menus/API.vue +++ /dev/null @@ -1,110 +0,0 @@ - - - diff --git a/examples/views/table/renderer/API.vue b/examples/views/table/renderer/API.vue deleted file mode 100644 index 46b3cdc02c..0000000000 --- a/examples/views/table/renderer/API.vue +++ /dev/null @@ -1,141 +0,0 @@ - - - diff --git a/examples/views/table/renderer/Default.vue b/examples/views/table/renderer/Default.vue deleted file mode 100644 index f0ce38b3ca..0000000000 --- a/examples/views/table/renderer/Default.vue +++ /dev/null @@ -1,117 +0,0 @@ - - - diff --git a/examples/views/table/renderer/Edit.vue b/examples/views/table/renderer/Edit.vue deleted file mode 100644 index 1b5a4bbab4..0000000000 --- a/examples/views/table/renderer/Edit.vue +++ /dev/null @@ -1,121 +0,0 @@ - - - diff --git a/examples/views/table/renderer/Empty.vue b/examples/views/table/renderer/Empty.vue deleted file mode 100644 index c371ff5bde..0000000000 --- a/examples/views/table/renderer/Empty.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - diff --git a/examples/views/table/renderer/Expand.vue b/examples/views/table/renderer/Expand.vue deleted file mode 100644 index 953c0f421f..0000000000 --- a/examples/views/table/renderer/Expand.vue +++ /dev/null @@ -1,117 +0,0 @@ - - - diff --git a/examples/views/table/renderer/Filter.vue b/examples/views/table/renderer/Filter.vue deleted file mode 100644 index bfef79d7b4..0000000000 --- a/examples/views/table/renderer/Filter.vue +++ /dev/null @@ -1,70 +0,0 @@ - - - diff --git a/examples/views/table/renderer/Form.vue b/examples/views/table/renderer/Form.vue deleted file mode 100644 index 5766a2246a..0000000000 --- a/examples/views/table/renderer/Form.vue +++ /dev/null @@ -1,162 +0,0 @@ - - - diff --git a/examples/views/table/renderer/Toolbar.vue b/examples/views/table/renderer/Toolbar.vue deleted file mode 100644 index 53028d698e..0000000000 --- a/examples/views/table/renderer/Toolbar.vue +++ /dev/null @@ -1,208 +0,0 @@ - - - diff --git a/examples/views/table/scroll/Edit.vue b/examples/views/table/scroll/Edit.vue deleted file mode 100644 index 795d233f7e..0000000000 --- a/examples/views/table/scroll/Edit.vue +++ /dev/null @@ -1,342 +0,0 @@ - - - diff --git a/examples/views/table/scroll/Footer.vue b/examples/views/table/scroll/Footer.vue deleted file mode 100644 index 9bb4976a3e..0000000000 --- a/examples/views/table/scroll/Footer.vue +++ /dev/null @@ -1,257 +0,0 @@ - - - diff --git a/examples/views/table/scroll/FullPartialLoad.vue b/examples/views/table/scroll/FullPartialLoad.vue deleted file mode 100644 index 90f1595706..0000000000 --- a/examples/views/table/scroll/FullPartialLoad.vue +++ /dev/null @@ -1,373 +0,0 @@ - - - diff --git a/examples/views/table/scroll/Group.vue b/examples/views/table/scroll/Group.vue deleted file mode 100644 index 477380923e..0000000000 --- a/examples/views/table/scroll/Group.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - diff --git a/examples/views/table/scroll/KeepAlives.vue b/examples/views/table/scroll/KeepAlives.vue deleted file mode 100644 index f126cc5276..0000000000 --- a/examples/views/table/scroll/KeepAlives.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - - - diff --git a/examples/views/table/scroll/Keyboard.vue b/examples/views/table/scroll/Keyboard.vue deleted file mode 100644 index 0bcc95a616..0000000000 --- a/examples/views/table/scroll/Keyboard.vue +++ /dev/null @@ -1,495 +0,0 @@ - - - diff --git a/examples/views/table/scroll/LazyTree.vue b/examples/views/table/scroll/LazyTree.vue deleted file mode 100644 index e85ff3a0f2..0000000000 --- a/examples/views/table/scroll/LazyTree.vue +++ /dev/null @@ -1,257 +0,0 @@ - - - diff --git a/examples/views/table/scroll/MaxHeight.vue b/examples/views/table/scroll/MaxHeight.vue deleted file mode 100644 index 84cfd2f152..0000000000 --- a/examples/views/table/scroll/MaxHeight.vue +++ /dev/null @@ -1,281 +0,0 @@ - - - diff --git a/examples/views/table/scroll/Merge.vue b/examples/views/table/scroll/Merge.vue deleted file mode 100644 index 5388f26d0b..0000000000 --- a/examples/views/table/scroll/Merge.vue +++ /dev/null @@ -1,243 +0,0 @@ - - - diff --git a/examples/views/table/scroll/Mode.vue b/examples/views/table/scroll/Mode.vue deleted file mode 100644 index 0fae9e8d04..0000000000 --- a/examples/views/table/scroll/Mode.vue +++ /dev/null @@ -1,289 +0,0 @@ - - - diff --git a/examples/views/table/scroll/PartialLoad.vue b/examples/views/table/scroll/PartialLoad.vue deleted file mode 100644 index 70a9989e66..0000000000 --- a/examples/views/table/scroll/PartialLoad.vue +++ /dev/null @@ -1,189 +0,0 @@ - - - diff --git a/examples/views/table/scroll/RowHeight.vue b/examples/views/table/scroll/RowHeight.vue deleted file mode 100644 index 75b7ee6d69..0000000000 --- a/examples/views/table/scroll/RowHeight.vue +++ /dev/null @@ -1,182 +0,0 @@ - - - - - diff --git a/examples/views/table/scroll/Scroll.vue b/examples/views/table/scroll/Scroll.vue deleted file mode 100644 index 2be5ec6403..0000000000 --- a/examples/views/table/scroll/Scroll.vue +++ /dev/null @@ -1,329 +0,0 @@ - - - diff --git a/examples/views/table/scroll/ScrollCols.vue b/examples/views/table/scroll/ScrollCols.vue deleted file mode 100644 index 8d85793c9b..0000000000 --- a/examples/views/table/scroll/ScrollCols.vue +++ /dev/null @@ -1,378 +0,0 @@ - - - diff --git a/examples/views/table/scroll/ScrollFullCols.vue b/examples/views/table/scroll/ScrollFullCols.vue deleted file mode 100644 index be913b2cfc..0000000000 --- a/examples/views/table/scroll/ScrollFullCols.vue +++ /dev/null @@ -1,395 +0,0 @@ - - - diff --git a/examples/views/table/scroll/ScrollFullRows.vue b/examples/views/table/scroll/ScrollFullRows.vue deleted file mode 100644 index 9a78cd5463..0000000000 --- a/examples/views/table/scroll/ScrollFullRows.vue +++ /dev/null @@ -1,311 +0,0 @@ - - - diff --git a/examples/views/table/scroll/ScrollRows.vue b/examples/views/table/scroll/ScrollRows.vue deleted file mode 100644 index 8e089a614c..0000000000 --- a/examples/views/table/scroll/ScrollRows.vue +++ /dev/null @@ -1,269 +0,0 @@ - - - diff --git a/examples/views/table/scroll/Template.vue b/examples/views/table/scroll/Template.vue deleted file mode 100644 index 92e38be4e5..0000000000 --- a/examples/views/table/scroll/Template.vue +++ /dev/null @@ -1,428 +0,0 @@ - - - - - diff --git a/examples/views/table/scroll/Tree.vue b/examples/views/table/scroll/Tree.vue deleted file mode 100644 index 1ad110a9bf..0000000000 --- a/examples/views/table/scroll/Tree.vue +++ /dev/null @@ -1,368 +0,0 @@ - - - diff --git a/examples/views/table/scroll/keepAlives/Table1.vue b/examples/views/table/scroll/keepAlives/Table1.vue deleted file mode 100644 index 4cd65d8630..0000000000 --- a/examples/views/table/scroll/keepAlives/Table1.vue +++ /dev/null @@ -1,65 +0,0 @@ - - - diff --git a/examples/views/table/scroll/keepAlives/Table2.vue b/examples/views/table/scroll/keepAlives/Table2.vue deleted file mode 100644 index 50048722fb..0000000000 --- a/examples/views/table/scroll/keepAlives/Table2.vue +++ /dev/null @@ -1,66 +0,0 @@ - - - diff --git a/examples/views/table/scroll/keepAlives/Table3.vue b/examples/views/table/scroll/keepAlives/Table3.vue deleted file mode 100644 index e7c991d9df..0000000000 --- a/examples/views/table/scroll/keepAlives/Table3.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - diff --git a/examples/views/table/tree/Accordion.vue b/examples/views/table/tree/Accordion.vue deleted file mode 100644 index dfd782ccef..0000000000 --- a/examples/views/table/tree/Accordion.vue +++ /dev/null @@ -1,106 +0,0 @@ - - - diff --git a/examples/views/table/tree/Basic.vue b/examples/views/table/tree/Basic.vue deleted file mode 100644 index 0971c12b4c..0000000000 --- a/examples/views/table/tree/Basic.vue +++ /dev/null @@ -1,370 +0,0 @@ - - - diff --git a/examples/views/table/tree/CRUD.vue b/examples/views/table/tree/CRUD.vue deleted file mode 100644 index 996c37f8b3..0000000000 --- a/examples/views/table/tree/CRUD.vue +++ /dev/null @@ -1,417 +0,0 @@ - - - diff --git a/examples/views/table/tree/Edit.vue b/examples/views/table/tree/Edit.vue deleted file mode 100644 index c4db5b64db..0000000000 --- a/examples/views/table/tree/Edit.vue +++ /dev/null @@ -1,132 +0,0 @@ - - - diff --git a/examples/views/table/tree/Expand.vue b/examples/views/table/tree/Expand.vue deleted file mode 100644 index 7de30b8001..0000000000 --- a/examples/views/table/tree/Expand.vue +++ /dev/null @@ -1,160 +0,0 @@ - - - - - diff --git a/examples/views/table/tree/ExpandLazy.vue b/examples/views/table/tree/ExpandLazy.vue deleted file mode 100644 index 9df8884ae8..0000000000 --- a/examples/views/table/tree/ExpandLazy.vue +++ /dev/null @@ -1,198 +0,0 @@ - - - - - diff --git a/examples/views/table/tree/Filter.vue b/examples/views/table/tree/Filter.vue deleted file mode 100644 index 767e9b22e1..0000000000 --- a/examples/views/table/tree/Filter.vue +++ /dev/null @@ -1,77 +0,0 @@ - - - diff --git a/examples/views/table/tree/Fixed.vue b/examples/views/table/tree/Fixed.vue deleted file mode 100644 index a88b92c7bf..0000000000 --- a/examples/views/table/tree/Fixed.vue +++ /dev/null @@ -1,134 +0,0 @@ - - - diff --git a/examples/views/table/tree/Icon.vue b/examples/views/table/tree/Icon.vue deleted file mode 100644 index c22e08d263..0000000000 --- a/examples/views/table/tree/Icon.vue +++ /dev/null @@ -1,427 +0,0 @@ - - - - - diff --git a/examples/views/table/tree/Lazy.vue b/examples/views/table/tree/Lazy.vue deleted file mode 100644 index 1fee7d39da..0000000000 --- a/examples/views/table/tree/Lazy.vue +++ /dev/null @@ -1,262 +0,0 @@ - - - diff --git a/examples/views/table/tree/LazyEdit.vue b/examples/views/table/tree/LazyEdit.vue deleted file mode 100644 index eb1d966ebd..0000000000 --- a/examples/views/table/tree/LazyEdit.vue +++ /dev/null @@ -1,159 +0,0 @@ - - - diff --git a/examples/views/table/tree/LazyMenu.vue b/examples/views/table/tree/LazyMenu.vue deleted file mode 100644 index 0f35ff9ea0..0000000000 --- a/examples/views/table/tree/LazyMenu.vue +++ /dev/null @@ -1,229 +0,0 @@ - - - diff --git a/examples/views/table/tree/Line.vue b/examples/views/table/tree/Line.vue deleted file mode 100644 index 1821594da2..0000000000 --- a/examples/views/table/tree/Line.vue +++ /dev/null @@ -1,250 +0,0 @@ - - - - - diff --git a/examples/views/table/tree/MaxHeight.vue b/examples/views/table/tree/MaxHeight.vue deleted file mode 100644 index 38dce45f8a..0000000000 --- a/examples/views/table/tree/MaxHeight.vue +++ /dev/null @@ -1,120 +0,0 @@ - - - diff --git a/examples/views/table/tree/Menu.vue b/examples/views/table/tree/Menu.vue deleted file mode 100644 index 51b3492445..0000000000 --- a/examples/views/table/tree/Menu.vue +++ /dev/null @@ -1,262 +0,0 @@ - - - diff --git a/examples/views/table/tree/Normal.vue b/examples/views/table/tree/Normal.vue deleted file mode 100644 index b05c9d454e..0000000000 --- a/examples/views/table/tree/Normal.vue +++ /dev/null @@ -1,437 +0,0 @@ - - - - - diff --git a/examples/views/table/tree/Radio.vue b/examples/views/table/tree/Radio.vue deleted file mode 100644 index 2b2674c904..0000000000 --- a/examples/views/table/tree/Radio.vue +++ /dev/null @@ -1,332 +0,0 @@ - - - diff --git a/examples/views/table/tree/Selection.vue b/examples/views/table/tree/Selection.vue deleted file mode 100644 index 6e3ce310ee..0000000000 --- a/examples/views/table/tree/Selection.vue +++ /dev/null @@ -1,313 +0,0 @@ - - - diff --git a/examples/views/table/tree/Sort.vue b/examples/views/table/tree/Sort.vue deleted file mode 100644 index 380d07e183..0000000000 --- a/examples/views/table/tree/Sort.vue +++ /dev/null @@ -1,96 +0,0 @@ - - - diff --git a/examples/views/table/tree/Template.vue b/examples/views/table/tree/Template.vue deleted file mode 100644 index ae5edbc3f7..0000000000 --- a/examples/views/table/tree/Template.vue +++ /dev/null @@ -1,180 +0,0 @@ - - - diff --git a/examples/views/textarea/Textarea.vue b/examples/views/textarea/Textarea.vue deleted file mode 100644 index f88c556d03..0000000000 --- a/examples/views/textarea/Textarea.vue +++ /dev/null @@ -1,118 +0,0 @@ - - - diff --git a/examples/views/toolbar/Toolbar.vue b/examples/views/toolbar/Toolbar.vue deleted file mode 100644 index e50bb258d1..0000000000 --- a/examples/views/toolbar/Toolbar.vue +++ /dev/null @@ -1,159 +0,0 @@ - - - - - diff --git a/examples/views/toolbar/ToolbarTest.vue b/examples/views/toolbar/ToolbarTest.vue new file mode 100644 index 0000000000..3857af47a1 --- /dev/null +++ b/examples/views/toolbar/ToolbarTest.vue @@ -0,0 +1,21 @@ + + + diff --git a/examples/views/tooltip/Tooltip.vue b/examples/views/tooltip/Tooltip.vue deleted file mode 100644 index 9842eb7d86..0000000000 --- a/examples/views/tooltip/Tooltip.vue +++ /dev/null @@ -1,85 +0,0 @@ - - - diff --git a/gulpfile.js b/gulpfile.js index dd7f84f876..318e4f882e 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -1,4 +1,5 @@ const fs = require('fs') +const path = require('path') const gulp = require('gulp') const XEUtils = require('xe-utils') const del = require('del') @@ -22,48 +23,19 @@ const tsSettings = { target: 'es2016' } -const coreName = 'v-x-e-table' +const exportModuleName = 'VXETable' +const esmOutDir = 'es' +const commOutDir = 'lib' -const moduleList = [ - 'filter', - 'menu', - 'edit', - 'export', - 'keyboard', - 'validator', - 'custom' -] +const coreName = 'ui' +const oldCoreName = 'v-x-e-table' const componentList = [ - 'icon', - 'loading', + 'table', 'column', 'colgroup', 'toolbar', - 'grid', - 'pager', - 'checkbox', - 'checkbox-group', - 'radio', - 'radio-group', - 'radio-button', - 'input', - 'textarea', - 'button', - 'button-group', - 'modal', - 'drawer', - 'tooltip', - 'form', - 'form-item', - 'form-gather', - 'select', - 'optgroup', - 'option', - 'switch', - 'list', - 'pulldown', - 'table' + 'grid' ] const languages = [ @@ -80,96 +52,98 @@ const languages = [ const styleCode = 'require(\'./style.css\')' +const delDir = (directory) => { + if (fs.existsSync(directory)) { + fs.readdirSync(directory).forEach(file => { + const currentPath = path.join(directory, file) + if (fs.lstatSync(currentPath).isDirectory()) { + delDir(currentPath) + } else { + fs.unlinkSync(currentPath) + } + }) + fs.rmdirSync(directory) + } +} + function toExportName (name) { const str = XEUtils.camelCase(name) - return `${str.slice(0, 1).toUpperCase()}${str.slice(1)}` + return name === 'ui' ? 'UI' : `${str.slice(0, 1).toUpperCase()}${str.slice(1)}` } -gulp.task('build_modules', () => { - moduleList.forEach(name => { - const exportName = `VxeModule${toExportName(name)}` - const esCode = `import ${exportName} from '../${name}'\nexport * from '../${name}'\nexport default ${exportName}` - fs.mkdirSync(`packages_temp/vxe-table-${name}-module`) - fs.writeFileSync(`packages_temp/vxe-table-${name}-module/index.ts`, esCode) - fs.writeFileSync(`packages_temp/vxe-table-${name}-module/index.d.ts`, fs.readFileSync(`packages_temp/${name}/index.d.ts`, 'utf-8')) - }) - componentList.forEach(name => { +gulp.task('build_escode', function () { + [coreName, oldCoreName, ...componentList].forEach(name => { const exportName = `Vxe${toExportName(name)}` const esCode = `import ${exportName} from '../${name}'\nexport * from '../${name}'\nexport default ${exportName}` fs.mkdirSync(`packages_temp/vxe-${name}`) fs.writeFileSync(`packages_temp/vxe-${name}/index.ts`, esCode) - fs.writeFileSync(`packages_temp/vxe-${name}/index.d.ts`, fs.readFileSync(`packages_temp/${name}/index.d.ts`, 'utf-8')) }) + return gulp.src([ + 'packages_temp/**.ts', + 'packages_temp/**/*.ts', + '!packages_temp/index.ts' + ]) + .pipe(replace('process.env.VUE_APP_VXE_VERSION', `"${pack.version}"`)) + .pipe(replace('process.env.VUE_APP_VXE_ENV', 'process.env.NODE_ENV')) + .pipe(ts(tsSettings)) + .pipe(gulp.dest(esmOutDir)) +}) - return gulp.src('packages_temp/**/*.ts') - .pipe(replace('process.env.VUE_APP_VXE_TABLE_VERSION', `"${pack.version}"`)) - .pipe(replace('process.env.VUE_APP_VXE_TABLE_ENV', 'process.env.NODE_ENV')) +gulp.task('build_esjs', gulp.series('build_escode', function () { + return gulp.src([ + 'packages_temp/index.ts' + ]) + .pipe(replace('process.env.VUE_APP_VXE_VERSION', `"${pack.version}"`)) + .pipe(replace('process.env.VUE_APP_VXE_ENV', 'process.env.NODE_ENV')) + .pipe(ts(tsSettings)) + .pipe(rename({ + basename: 'index', + extname: '.esm.js' + })) + .pipe(gulp.dest(esmOutDir)) +})) + +gulp.task('build_es_all', gulp.series('build_esjs')) + +gulp.task('build_commoncode', function () { + return gulp.src([ + 'packages_temp/**.ts', + 'packages_temp/**/*.ts', + '!packages_temp/index.ts' + ]) + .pipe(replace('process.env.VUE_APP_VXE_VERSION', `"${pack.version}"`)) + .pipe(replace('process.env.VUE_APP_VXE_ENV', 'process.env.NODE_ENV')) .pipe(ts(tsSettings)) - .pipe(gulp.dest('es')) .pipe(babel({ - presets: [ - '@babel/env' - ], - plugins: [] + presets: ['@babel/env'] })) - .pipe(gulp.dest('lib')) + .pipe(gulp.dest(commOutDir)) .pipe(uglify()) .pipe(rename({ suffix: '.min', extname: '.js' })) - .pipe(gulp.dest('lib')) + .pipe(gulp.dest(commOutDir)) }) -gulp.task('build_i18n', () => { - languages.forEach(code => { - fs.writeFileSync(`lib/locale/lang/${code}.d.ts`, 'declare const langMsgs: { [key: string]: any }\nexport default langMsgs') - fs.writeFileSync(`es/locale/lang/${code}.d.ts`, 'declare const langMsgs: { [key: string]: any }\nexport default langMsgs') - }) - const rest = languages.map(code => { - const name = XEUtils.camelCase(code).replace(/^[a-z]/, firstChat => firstChat.toUpperCase()) - const isZHTC = ['zh-HK', 'zh-MO', 'zh-TW'].includes(code) - return gulp.src(`packages_temp/locale/lang/${isZHTC ? 'zh-TC' : code}.ts`) - .pipe(ts(tsSettings)) - .pipe(babel({ - moduleId: `vxe-table-lang.${code}`, - presets: ['@babel/env'], - plugins: [ - ['@babel/transform-modules-umd', { - globals: { - [`vxe-table-language.${code}`]: `VXETableLang${name}` - }, - exactGlobals: true - }] - ] - })) - .pipe(rename({ - basename: code, - suffix: '.umd', - extname: '.js' - })) - .pipe(gulp.dest('lib/locale/lang')) - .pipe(uglify()) - .pipe(rename({ - basename: code, - suffix: '.min', - extname: '.js' - })) - .pipe(gulp.dest('lib/locale/lang')) - }) - return merge(...rest) -}) - -gulp.task('copy_pack', () => { - return gulp.src('packages/**') - .pipe(gulp.dest('packages_temp')) -}) +gulp.task('build_commonjs', gulp.series('build_commoncode', function () { + return gulp.src([ + 'packages_temp/index.ts' + ]) + .pipe(replace('process.env.VUE_APP_VXE_VERSION', `"${pack.version}"`)) + .pipe(replace('process.env.VUE_APP_VXE_ENV', 'process.env.NODE_ENV')) + .pipe(ts(tsSettings)) + .pipe(babel({ + presets: ['@babel/env'] + })) + .pipe(rename({ + basename: 'index', + extname: '.common.js' + })) + .pipe(gulp.dest(commOutDir)) +})) -gulp.task('copy_ts', () => { - return gulp.src('packages_temp/**/*.d.ts') - .pipe(gulp.dest('es')) - .pipe(gulp.dest('lib')) -}) +gulp.task('build_common_all', gulp.series('build_commonjs')) // eslint-disable-next-line no-control-regex const unicodeRE = /[^\x00-\xff]/g @@ -183,38 +157,36 @@ function toCSSUnicode (css) { }) } -gulp.task('build_lib', () => { +gulp.task('build_umdcss', () => { const styleStr = fs.readFileSync('lib_temp/index.css', 'utf-8') fs.writeFileSync('lib_temp/index.css', toCSSUnicode(styleStr)) - return merge( - gulp.src('es/index.common.js') - .pipe(rename({ - basename: 'index', - suffix: '.esm', - extname: '.js' - })) - .pipe(gulp.dest('es')), - gulp.src('lib_temp/index.umd.js') - .pipe(gulp.dest('lib')), - gulp.src('lib_temp/index.umd.min.js') - .pipe(gulp.dest('lib')), - gulp.src('lib_temp/index.css') - .pipe(rename({ - basename: 'style', - extname: '.css' - })) - .pipe(gulp.dest('es')) - .pipe(gulp.dest('lib')) - .pipe(rename({ - basename: 'style', - suffix: '.min', - extname: '.css' - })) - .pipe(gulp.dest('es')) - .pipe(gulp.dest('lib')) - ) + return gulp.src('lib_temp/index.css') + .pipe(rename({ + basename: 'style' + })) + .pipe(gulp.dest('es')) + .pipe(gulp.dest('lib')) + .pipe(rename({ + suffix: '.min', + extname: '.css' + })) + .pipe(gulp.dest('es')) + .pipe(gulp.dest('lib')) +}) + +gulp.task('build_umdjs', () => { + return gulp.src('lib_temp/index.umd.js') + .pipe(gulp.dest('lib')) + .pipe(uglify()) + .pipe(rename({ + basename: 'index', + extname: '.umd.min.js' + })) + .pipe(gulp.dest('lib')) }) +gulp.task('build_umd_all', gulp.parallel('build_umdjs', 'build_umdcss')) + gulp.task('build_icon', () => { const timeNow = Date.now() return merge( @@ -243,8 +215,7 @@ gulp.task('build_icon', () => { }) function buildStyle (name, dirName) { - return gulp.src(`styles/${name}.scss`) - .pipe(replace(/(\/\*\*Variable\*\*\/)/, '@import \'./variable.scss\';\n')) + return gulp.src(`styles/components/${name}.scss`) .pipe(sass()) .pipe(prefixer({ borwsers: ['last 1 version', '> 1%', 'not ie <= 8'], @@ -256,10 +227,6 @@ function buildStyle (name, dirName) { extname: '.css' })) .pipe(gulp.dest(`es/${dirName}`)) - .pipe(rename({ - basename: 'style', - extname: '.css' - })) .pipe(gulp.dest(`lib/${dirName}/style`)) .pipe(cleanCSS()) .pipe(rename({ @@ -267,43 +234,80 @@ function buildStyle (name, dirName) { suffix: '.min', extname: '.css' })) + .pipe(gulp.dest(`es/${dirName}`)) .pipe(gulp.dest(`lib/${dirName}/style`)) } -gulp.task('build_style', () => { - const rest = [coreName, ...moduleList, ...componentList].map(name => { - return buildStyle(name, name) +gulp.task('build_single_style', () => { + const rest = []; + [coreName, oldCoreName, ...componentList].forEach(name => { + rest.push(buildStyle(name, name)) + rest.push(buildStyle(name, `vxe-${name}`)) }) - moduleList.forEach(name => { - rest.push(buildStyle(name, `vxe-table-${name}-module`)) + return merge(...rest) +}) + +gulp.task('build_i18n', () => { + languages.forEach(code => { + fs.writeFileSync(`lib/locale/lang/${code}.d.ts`, 'declare const langMsgs: { [key: string]: any }\nexport default langMsgs') + fs.writeFileSync(`es/locale/lang/${code}.d.ts`, 'declare const langMsgs: { [key: string]: any }\nexport default langMsgs') }) - componentList.forEach(name => { - rest.push(buildStyle(name, `vxe-${name}`)) + const rest = languages.map(code => { + const name = XEUtils.camelCase(code).replace(/^[a-z]/, firstChat => firstChat.toUpperCase()) + const isZHTC = ['zh-HK', 'zh-MO', 'zh-TW'].includes(code) + return gulp.src(`packages_temp/locale/lang/${isZHTC ? 'zh-TC' : code}.ts`) + .pipe(ts(tsSettings)) + .pipe(babel({ + moduleId: `vxe-table-lang.${code}`, + presets: ['@babel/env'], + plugins: [ + ['@babel/transform-modules-umd', { + globals: { + [`vxe-table-language.${code}`]: `VXETableLang${name}` + }, + exactGlobals: true + }] + ] + })) + .pipe(rename({ + basename: code, + suffix: '.umd', + extname: '.js' + })) + .pipe(gulp.dest('lib/locale/lang')) + .pipe(uglify()) + .pipe(rename({ + basename: code, + suffix: '.min', + extname: '.js' + })) + .pipe(gulp.dest('lib/locale/lang')) }) return merge(...rest) }) -gulp.task('build_clean', () => { - return del(['lib', 'es']) +gulp.task('copy_pack', () => { + return gulp.src('packages/**') + .pipe(gulp.dest('packages_temp')) +}) + +gulp.task('clear', () => { + return del([ + commOutDir, + esmOutDir, + 'packages_temp' + ]) }) -gulp.task('build', gulp.series('build_clean', 'copy_pack', 'build_modules', 'build_i18n', 'copy_ts', 'build_style', 'build_icon', 'build_lib', () => { - [coreName].forEach(name => { - fs.writeFileSync(`lib/${name}/style/index.js`, styleCode) - }) - moduleList.forEach(name => { - fs.writeFileSync(`lib/${name}/style/index.js`, styleCode) - fs.writeFileSync(`lib/vxe-table-${name}-module/style/index.js`, styleCode) - }) - componentList.forEach(name => { +gulp.task('build_all', gulp.parallel('build_es_all', 'build_common_all', 'build_umd_all')) + +gulp.task('build', gulp.series('clear', 'copy_pack', 'build_all', 'build_i18n', 'build_single_style', () => { + [coreName, oldCoreName, ...componentList].forEach(name => { fs.writeFileSync(`lib/${name}/style/index.js`, styleCode) fs.writeFileSync(`lib/vxe-${name}/style/index.js`, styleCode) }) return del([ 'lib_temp', - 'packages_temp', - 'lib/index.esm.js', - 'lib/index.esm.min.js', - 'es/index.common.js' + 'packages_temp' ]) })) diff --git a/helper/vetur/attributes.json b/helper/vetur/attributes.json index 4161bad755..ba85615003 100644 --- a/helper/vetur/attributes.json +++ b/helper/vetur/attributes.json @@ -1,1970 +1 @@ -{ - "vxe-icon/name": { - "type": "string", - "description": "图标名称" - }, - "vxe-icon/status": { - "type": "string", - "description": "状态颜色" - }, - "vxe-icon/roll": { - "type": "boolean", - "description": "旋转动画" - }, - "vxe-table/id": { - "type": "string", - "description": "唯一标识（被某些特定的功能所依赖）" - }, - "vxe-table/data": { - "type": "any[]", - "description": "表格数据（与 loadData 行为一致，更新数据是不会重置状态）" - }, - "vxe-table/height": { - "type": "number | string", - "description": "表格的高度；支持铺满父容器或者固定高度，如果设置 auto 为铺满父容器（如果设置为 auto，则必须确保存在父节点且不允许存在相邻元素）" - }, - "vxe-table/min-height": { - "type": "number | string", - "description": "表格最小高度" - }, - "vxe-table/max-height": { - "type": "number | string", - "description": "表格的最大高度" - }, - "vxe-table/auto-resize": { - "type": "boolean", - "description": "自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到）" - }, - "vxe-table/sync-resize": { - "type": "boolean | string | number", - "description": "自动跟随某个属性的变化去重新计算表格，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换时可能会用到）" - }, - "vxe-table/resizable": { - "type": "boolean", - "description": "已废弃，被 column-config.resizable 替换" - }, - "vxe-table/stripe": { - "type": "boolean", - "description": "是否带有斑马纹（需要注意的是，在可编辑表格场景下，临时插入的数据不会有斑马纹样式）" - }, - "vxe-table/border": { - "type": "boolean | string", - "description": "是否带有边框" - }, - "vxe-table/round": { - "type": "boolean", - "description": "是否为圆角边框" - }, - "vxe-table/size": { - "type": "string", - "description": "表格的尺寸" - }, - "vxe-table/loading": { - "type": "boolean", - "description": "表格是否显示加载中" - }, - "vxe-table/align": { - "type": "string", - "description": "所有的列对齐方式" - }, - "vxe-table/header-align": { - "type": "string", - "description": "所有的表头列的对齐方式" - }, - "vxe-table/footer-align": { - "type": "string", - "description": "所有的表尾列的对齐方式" - }, - "vxe-table/show-header": { - "type": "boolean", - "description": "是否显示表头" - }, - "vxe-table/highlight-current-row": { - "type": "boolean", - "description": "已废弃，被 row-config.isCurrent 替换" - }, - "vxe-table/highlight-hover-row": { - "type": "boolean", - "description": "已废弃，被 row-config.isHover 替换" - }, - "vxe-table/highlight-current-column": { - "type": "boolean", - "description": "已废弃，被 column-config.isCurrent 替换" - }, - "vxe-table/highlight-hover-column": { - "type": "boolean", - "description": "已废弃，被 column-config.isHover 替换" - }, - "vxe-table/row-class-name": { - "type": "string | (({ row, rowindex, $rowindex }) => any)", - "description": "给行附加 className" - }, - "vxe-table/cell-class-name": { - "type": "string | (({ row, rowindex, $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给单元格附加 className" - }, - "vxe-table/header-row-class-name": { - "type": "string | (({ $rowindex }) => any)", - "description": "给表头的行附加 className" - }, - "vxe-table/header-cell-class-name": { - "type": "string | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表头的单元格附加 className" - }, - "vxe-table/footer-row-class-name": { - "type": "string | (({ $rowindex }) => any)", - "description": "给表尾的行附加 className" - }, - "vxe-table/footer-cell-class-name": { - "type": "string | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表尾的单元格附加 className" - }, - "vxe-table/cell-style": { - "type": "any | (({ row, rowindex, $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给单元格附加样式" - }, - "vxe-table/header-cell-style": { - "type": "any | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表头单元格附加样式" - }, - "vxe-table/footer-cell-style": { - "type": "any | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表尾单元格附加样式" - }, - "vxe-table/row-style": { - "type": "any | (({ row, rowindex, $rowindex }) => any)", - "description": "给行附加样式，也可以是函数" - }, - "vxe-table/header-row-style": { - "type": "any | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表头行附加样式" - }, - "vxe-table/footer-row-style": { - "type": "any | (({ $rowindex }) => any)", - "description": "给表尾行附加样式" - }, - "vxe-table/show-footer": { - "type": "boolean", - "description": "是否显示表尾" - }, - "vxe-table/footer-data": { - "type": "any[]", - "description": "表尾数据" - }, - "vxe-table/footer-method": { - "type": "({ columns, data }) => any[][]", - "description": "表尾的数据获取方法，返回一个二维数组" - }, - "vxe-table/merge-cells": { - "type": "array<{ row: number, col: number, rowspan: number, colspan: number }>", - "description": "临时合并指定的单元格 (不能用于展开行，不建议用于固定列、树形结构)" - }, - "vxe-table/merge-footer-items": { - "type": "array<{ row: number, col: number, rowspan: number, colspan: number }>", - "description": "临时合并表尾 (不能用于展开行，不建议用于固定列、树形结构)" - }, - "vxe-table/span-method": { - "type": "({ row, rowindex, $rowindex, _rowindex, column, columnindex, $columnindex, _columnindex, data }) => { rowspan: number, colspan: number}", - "description": "自定义合并函数，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)" - }, - "vxe-table/footer-span-method": { - "type": "({ $rowindex, column, columnindex, $columnindex, _columnindex, data }) => { rowspan: number, colspan: number}", - "description": "表尾合并行或列，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)" - }, - "vxe-table/show-overflow": { - "type": "boolean | string", - "description": "设置所有内容过长时显示为省略号（如果是固定列建议设置该值，提升渲染速度）" - }, - "vxe-table/show-header-overflow": { - "type": "boolean | string", - "description": "设置表头所有内容过长时显示为省略号" - }, - "vxe-table/show-footer-overflow": { - "type": "boolean | string", - "description": "设置表尾所有内容过长时显示为省略号" - }, - "vxe-table/column-key": { - "type": "boolean", - "description": "已废弃，被 column-config.useKey 替换" - }, - "vxe-table/row-key": { - "type": "boolean", - "description": "已废弃，被 row-config.useKey 替换" - }, - "vxe-table/row-id": { - "type": "string", - "description": "已废弃，被 row-config.keyField 替换" - }, - "vxe-table/keep-source": { - "type": "boolean", - "description": "保持原始值的状态，被某些功能所依赖，比如编辑状态、还原数据等（开启后影响性能，具体取决于数据量）" - }, - "vxe-table/column-config": { - "type": "any", - "description": "列配置信息" - }, - "vxe-table/row-config": { - "type": "any", - "description": "行配置信息" - }, - "vxe-table/resize-config": { - "type": "object", - "description": "响应式布局配置项" - }, - "vxe-table/resizable-config": { - "type": "object", - "description": "列宽拖动配置项" - }, - "vxe-table/seq-config": { - "type": "any", - "description": "序号配置项" - }, - "vxe-table/sort-config": { - "type": "any", - "description": "排序配置项" - }, - "vxe-table/filter-config": { - "type": "any", - "description": "筛选配置项" - }, - "vxe-table/export-config": { - "type": "any", - "description": "导出配置项" - }, - "vxe-table/import-config": { - "type": "any", - "description": "导入配置项" - }, - "vxe-table/print-config": { - "type": "any", - "description": "打印配置项" - }, - "vxe-table/radio-config": { - "type": "any", - "description": "单选框配置项" - }, - "vxe-table/checkbox-config": { - "type": "any", - "description": "复选框配置项" - }, - "vxe-table/tooltip-config": { - "type": "any", - "description": "tooltip 配置项" - }, - "vxe-table/expand-config": { - "type": "any", - "description": "展开行配置项（不支持虚拟滚动）" - }, - "vxe-table/tree-config": { - "type": "any", - "description": "树形结构配置项" - }, - "vxe-table/menu-config": { - "type": "any", - "description": "右键菜单配置项" - }, - "vxe-table/clip-config": { - "type": "any", - "description": "复制/粘贴配置项" - }, - "vxe-table/fnr-config": { - "type": "any", - "description": "查找/替换配置项" - }, - "vxe-table/mouse-config": { - "type": "any", - "description": "鼠标配置项" - }, - "vxe-table/area-config": { - "type": "any", - "description": "区域选取配置项" - }, - "vxe-table/keyboard-config": { - "type": "any", - "description": "按键配置项" - }, - "vxe-table/edit-config": { - "type": "any", - "description": "可编辑配置项" - }, - "vxe-table/valid-config": { - "type": "any", - "description": "校验配置项" - }, - "vxe-table/edit-rules": { - "type": "{ [field: string]: vxetabledefines.validatorrule[] }", - "description": "校验规则配置项" - }, - "vxe-table/empty-text": { - "type": "string", - "description": "空数据时显示的内容" - }, - "vxe-table/empty-render": { - "type": "any", - "description": "空内容渲染配置项，empty-render 的优先级大于 empty-text" - }, - "vxe-table/loading-config": { - "type": "any", - "description": "加载中配置项" - }, - "vxe-table/custom-config": { - "type": "any", - "description": "个性化信息配置项" - }, - "vxe-table/scroll-x": { - "type": "any", - "description": "横向虚拟滚动配置（不支持展开行）" - }, - "vxe-table/scroll-y": { - "type": "any", - "description": "纵向虚拟滚动配置（不支持展开行）" - }, - "vxe-table/params": { - "type": "any", - "description": "自定义参数（可以用来存放一些自定义的数据）" - }, - "vxe-colgroup/field": { - "type": "string", - "description": "列字段名（注：属性层级越深，渲染性能就越差，例如：aa.bb.cc.dd.ee）" - }, - "vxe-colgroup/title": { - "type": "string", - "description": "列标题（支持开启国际化）" - }, - "vxe-colgroup/width": { - "type": "number | string", - "description": "列宽度（如果为空则均匀分配剩余宽度，如果全部列固定了，可能会存在宽屏下不会铺满，可以配合 \"%\" 或者 \"min-width\" 布局）" - }, - "vxe-colgroup/min-width": { - "type": "number | string", - "description": "最小列宽度；会自动将剩余空间按比例分配" - }, - "vxe-colgroup/resizable": { - "type": "boolean", - "description": "列是否允许拖动列宽调整大小" - }, - "vxe-colgroup/visible": { - "type": "boolean", - "description": "默认是否显示" - }, - "vxe-colgroup/fixed": { - "type": "string", - "description": "将列固定在左侧或者右侧（注意：固定列应该放在左右两侧的位置）" - }, - "vxe-colgroup/align": { - "type": "string", - "description": "列对齐方式" - }, - "vxe-colgroup/header-align": { - "type": "string", - "description": "表头列的对齐方式" - }, - "vxe-colgroup/show-overflow": { - "type": "string | boolean", - "description": "当内容过长时显示为省略号" - }, - "vxe-colgroup/show-header-overflow": { - "type": "string | boolean", - "description": "当表头内容过长时显示为省略号" - }, - "vxe-colgroup/header-class-name": { - "type": "string | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表头的单元格附加 className" - }, - "vxe-column/type": { - "type": "string", - "description": "列的类型（部分功能需要设置 column-config.useKey" - }, - "vxe-column/field": { - "type": "string", - "description": "列字段名（注：属性层级越深，渲染性能就越差，例如：aa.bb.cc.dd.ee）" - }, - "vxe-column/title": { - "type": "string", - "description": "列标题（支持开启国际化）" - }, - "vxe-column/width": { - "type": "number | string", - "description": "列宽度（如果为空则均匀分配剩余宽度，如果全部列固定了，可能会存在宽屏下不会铺满，可以配合 \"%\" 或者 \"min-width\" 布局）" - }, - "vxe-column/min-width": { - "type": "number | string", - "description": "最小列宽度；会自动将剩余空间按比例分配" - }, - "vxe-column/resizable": { - "type": "boolean", - "description": "列是否允许拖动列宽调整大小" - }, - "vxe-column/visible": { - "type": "boolean", - "description": "默认是否显示" - }, - "vxe-column/fixed": { - "type": "string", - "description": "将列固定在左侧或者右侧（注意：固定列应该放在左右两侧的位置）" - }, - "vxe-column/align": { - "type": "string", - "description": "列对齐方式" - }, - "vxe-column/header-align": { - "type": "string", - "description": "表头列的对齐方式" - }, - "vxe-column/footer-align": { - "type": "string", - "description": "表尾列的对齐方式" - }, - "vxe-column/show-overflow": { - "type": "string | boolean", - "description": "当内容过长时显示为省略号" - }, - "vxe-column/show-header-overflow": { - "type": "string | boolean", - "description": "当表头内容过长时显示为省略号" - }, - "vxe-column/show-footer-overflow": { - "type": "boolean | string", - "description": "当表尾内容过长时显示为省略号" - }, - "vxe-column/class-name": { - "type": "string | (({row, rowindex, $rowindex, column, columnindex, $columnindex}) => any)", - "description": "给单元格附加 className" - }, - "vxe-column/header-class-name": { - "type": "string | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表头的单元格附加 className" - }, - "vxe-column/footer-class-name": { - "type": "string | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表尾的单元格附加 className" - }, - "vxe-column/formatter": { - "type": "(({ cellvalue, row, column }) => string) | any[] | string", - "description": "格式化显示内容" - }, - "vxe-column/sortable": { - "type": "boolean", - "description": "数据排序，是否允许列排序" - }, - "vxe-column/sort-by": { - "type": "string | (({ row, column }) => string | number)", - "description": "数据排序，只对 sortable 有效，指定排序的字段（当值 formatter 格式化后，可以设置该字段，使用值进行排序）" - }, - "vxe-column/sort-type": { - "type": "string", - "description": "数据排序，排序的字段类型，比如字符串转数值等" - }, - "vxe-column/filters": { - "type": "any[]", - "description": "数据筛选，配置筛选条件（注：筛选只能用于列表，如果是树结构则过滤根节点）" - }, - "vxe-column/filter-multiple": { - "type": "boolean", - "description": "数据筛选，只对 filters 有效，筛选是否允许多选" - }, - "vxe-column/filter-method": { - "type": "({ value, option, cellvalue, row, column }) => boolean", - "description": "数据筛选，只对 filters 有效，列的筛选方法，该方法的返回值用来决定该行是否显示" - }, - "vxe-column/filter-reset-method": { - "type": "({ options, column }) => void", - "description": "数据筛选，只对 filters 有效，自定义筛选重置方法" - }, - "vxe-column/filter-recover-method": { - "type": "({ option, column }) => void", - "description": "数据筛选，只对 filters 有效，自定义筛选复原方法（使用自定义筛选时可能会用到）" - }, - "vxe-column/filter-render": { - "type": "any", - "description": "数据筛选，筛选渲染器配置项" - }, - "vxe-column/header-export-method": { - "type": "({ column, options }) => string", - "description": "自定义表头单元格数据导出方法，返回自定义的标题" - }, - "vxe-column/export-method": { - "type": "({ row, column, options }) => string", - "description": "自定义单元格数据导出方法，返回自定义的值" - }, - "vxe-column/footer-export-method": { - "type": "({ items, _columnindex, options }) => string", - "description": "自定义表尾单元格数据导出方法，返回自定义的值" - }, - "vxe-column/title-help": { - "type": "any", - "description": "即将废弃，请使用 title.prefix" - }, - "vxe-column/title-prefix": { - "type": "any", - "description": "标题前缀图标配置项" - }, - "vxe-column/title-suffix": { - "type": "any", - "description": "标题后缀图标配置项" - }, - "vxe-column/cell-type": { - "type": "string", - "description": "只对特定功能有效，单元格值类型（例如：导出数据类型设置）" - }, - "vxe-column/cell-render": { - "type": "any", - "description": "默认的渲染器配置项" - }, - "vxe-column/edit-render": { - "type": "any", - "description": "可编辑渲染器配置项" - }, - "vxe-column/content-render": { - "type": "any", - "description": "内容渲染配置项" - }, - "vxe-column/tree-node": { - "type": "boolean", - "description": "只对 tree-config 配置时有效，指定为树节点" - }, - "vxe-column/params": { - "type": "any", - "description": "额外的参数（可以用来存放一些私有参数）" - }, - "vxe-column/col-id": { - "type": "string | number", - "description": "自定义列的唯一主键（注：列主键必须确保唯一，操作不正确将导致出现问题）" - }, - "vxe-grid/id": { - "type": "string", - "description": "唯一标识（被某些特定的功能所依赖）" - }, - "vxe-grid/columns": { - "type": "array", - "description": "列配置" - }, - "vxe-grid/data": { - "type": "any[]", - "description": "表格数据（与 loadData 行为一致，更新数据是不会重置状态）" - }, - "vxe-grid/height": { - "type": "number | string", - "description": "表格的高度；支持铺满父容器或者固定高度，如果设置 auto 为铺满父容器（如果设置为 auto，则必须确保存在父节点且不允许存在相邻元素）" - }, - "vxe-grid/min-height": { - "type": "number | string", - "description": "表格最小高度" - }, - "vxe-grid/max-height": { - "type": "number | string", - "description": "表格的最大高度" - }, - "vxe-grid/auto-resize": { - "type": "boolean", - "description": "自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到）" - }, - "vxe-grid/sync-resize": { - "type": "boolean | string | number", - "description": "自动跟随某个属性的变化去重新计算表格，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换时可能会用到）" - }, - "vxe-grid/resizable": { - "type": "boolean", - "description": "已废弃，被 column-config.resizable 替换" - }, - "vxe-grid/stripe": { - "type": "boolean", - "description": "是否带有斑马纹（需要注意的是，在可编辑表格场景下，临时插入的数据不会有斑马纹样式）" - }, - "vxe-grid/border": { - "type": "boolean | string", - "description": "是否带有边框" - }, - "vxe-grid/round": { - "type": "boolean", - "description": "是否为圆角边框" - }, - "vxe-grid/size": { - "type": "string", - "description": "表格的尺寸" - }, - "vxe-grid/loading": { - "type": "boolean", - "description": "表格是否显示加载中" - }, - "vxe-grid/align": { - "type": "string", - "description": "所有的列对齐方式" - }, - "vxe-grid/header-align": { - "type": "string", - "description": "所有的表头列的对齐方式" - }, - "vxe-grid/footer-align": { - "type": "string", - "description": "所有的表尾列的对齐方式" - }, - "vxe-grid/show-header": { - "type": "boolean", - "description": "是否显示表头" - }, - "vxe-grid/highlight-current-row": { - "type": "boolean", - "description": "已废弃，被 row-config.isCurrent 替换" - }, - "vxe-grid/highlight-hover-row": { - "type": "boolean", - "description": "已废弃，被 row-config.isHover 替换" - }, - "vxe-grid/highlight-current-column": { - "type": "boolean", - "description": "已废弃，被 column-config.isCurrent 替换" - }, - "vxe-grid/highlight-hover-column": { - "type": "boolean", - "description": "已废弃，被 column-config.isHover 替换" - }, - "vxe-grid/row-class-name": { - "type": "string | (({ row, rowindex, $rowindex }) => any)", - "description": "给行附加 className" - }, - "vxe-grid/cell-class-name": { - "type": "string | (({ row, rowindex, $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给单元格附加 className" - }, - "vxe-grid/header-row-class-name": { - "type": "string | (({ $rowindex }) => any)", - "description": "给表头的行附加 className" - }, - "vxe-grid/header-cell-class-name": { - "type": "string | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表头的单元格附加 className" - }, - "vxe-grid/footer-row-class-name": { - "type": "string | (({ $rowindex }) => any)", - "description": "给表尾的行附加 className" - }, - "vxe-grid/footer-cell-class-name": { - "type": "string | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表尾的单元格附加 className" - }, - "vxe-grid/cell-style": { - "type": "any | (({ row, rowindex, $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给单元格附加样式" - }, - "vxe-grid/header-cell-style": { - "type": "any | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表头单元格附加样式" - }, - "vxe-grid/footer-cell-style": { - "type": "any | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表尾单元格附加样式" - }, - "vxe-grid/row-style": { - "type": "any | (({ row, rowindex, $rowindex }) => any)", - "description": "给行附加样式，也可以是函数" - }, - "vxe-grid/header-row-style": { - "type": "any | (({ $rowindex, column, columnindex, $columnindex }) => any)", - "description": "给表头行附加样式" - }, - "vxe-grid/footer-row-style": { - "type": "any | (({ $rowindex }) => any)", - "description": "给表尾行附加样式" - }, - "vxe-grid/show-footer": { - "type": "boolean", - "description": "是否显示表尾" - }, - "vxe-grid/footer-data": { - "type": "any[]", - "description": "表尾数据" - }, - "vxe-grid/footer-method": { - "type": "({ columns, data }) => any[][]", - "description": "表尾的数据获取方法，返回一个二维数组" - }, - "vxe-grid/merge-cells": { - "type": "array<{ row: number, col: number, rowspan: number, colspan: number }>", - "description": "临时合并指定的单元格 (不能用于展开行，不建议用于固定列、树形结构)" - }, - "vxe-grid/merge-footer-items": { - "type": "array<{ row: number, col: number, rowspan: number, colspan: number }>", - "description": "临时合并表尾 (不能用于展开行，不建议用于固定列、树形结构)" - }, - "vxe-grid/span-method": { - "type": "({ row, rowindex, $rowindex, _rowindex, column, columnindex, $columnindex, _columnindex, data }) => { rowspan: number, colspan: number}", - "description": "自定义合并函数，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)" - }, - "vxe-grid/footer-span-method": { - "type": "({ $rowindex, column, columnindex, $columnindex, _columnindex, data }) => { rowspan: number, colspan: number}", - "description": "表尾合并行或列，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)" - }, - "vxe-grid/show-overflow": { - "type": "boolean | string", - "description": "设置所有内容过长时显示为省略号（如果是固定列建议设置该值，提升渲染速度）" - }, - "vxe-grid/show-header-overflow": { - "type": "boolean | string", - "description": "设置表头所有内容过长时显示为省略号" - }, - "vxe-grid/show-footer-overflow": { - "type": "boolean | string", - "description": "设置表尾所有内容过长时显示为省略号" - }, - "vxe-grid/column-key": { - "type": "boolean", - "description": "已废弃，被 column-config.useKey 替换" - }, - "vxe-grid/row-key": { - "type": "boolean", - "description": "已废弃，被 row-config.useKey 替换" - }, - "vxe-grid/row-id": { - "type": "string", - "description": "已废弃，被 row-config.keyField 替换" - }, - "vxe-grid/keep-source": { - "type": "boolean", - "description": "保持原始值的状态，被某些功能所依赖，比如编辑状态、还原数据等（开启后影响性能，具体取决于数据量）" - }, - "vxe-grid/column-config": { - "type": "any", - "description": "列配置信息" - }, - "vxe-grid/row-config": { - "type": "any", - "description": "行配置信息" - }, - "vxe-grid/resize-config": { - "type": "object", - "description": "响应式布局配置项" - }, - "vxe-grid/resizable-config": { - "type": "object", - "description": "列宽拖动配置项" - }, - "vxe-grid/seq-config": { - "type": "any", - "description": "序号配置项" - }, - "vxe-grid/sort-config": { - "type": "any", - "description": "排序配置项" - }, - "vxe-grid/filter-config": { - "type": "any", - "description": "筛选配置项" - }, - "vxe-grid/export-config": { - "type": "any", - "description": "导出配置项" - }, - "vxe-grid/import-config": { - "type": "any", - "description": "导入配置项" - }, - "vxe-grid/print-config": { - "type": "any", - "description": "打印配置项" - }, - "vxe-grid/radio-config": { - "type": "any", - "description": "单选框配置项" - }, - "vxe-grid/checkbox-config": { - "type": "any", - "description": "复选框配置项" - }, - "vxe-grid/tooltip-config": { - "type": "any", - "description": "tooltip 配置项" - }, - "vxe-grid/expand-config": { - "type": "any", - "description": "展开行配置项（不支持虚拟滚动）" - }, - "vxe-grid/tree-config": { - "type": "any", - "description": "树形结构配置项" - }, - "vxe-grid/menu-config": { - "type": "any", - "description": "右键菜单配置项" - }, - "vxe-grid/clip-config": { - "type": "any", - "description": "复制/粘贴配置项" - }, - "vxe-grid/fnr-config": { - "type": "any", - "description": "查找/替换配置项" - }, - "vxe-grid/mouse-config": { - "type": "any", - "description": "鼠标配置项" - }, - "vxe-grid/area-config": { - "type": "any", - "description": "区域选取配置项" - }, - "vxe-grid/keyboard-config": { - "type": "any", - "description": "按键配置项" - }, - "vxe-grid/edit-config": { - "type": "any", - "description": "可编辑配置项" - }, - "vxe-grid/valid-config": { - "type": "any", - "description": "校验配置项" - }, - "vxe-grid/edit-rules": { - "type": "{ [field: string]: vxetabledefines.validatorrule[] }", - "description": "校验规则配置项" - }, - "vxe-grid/empty-text": { - "type": "string", - "description": "空数据时显示的内容" - }, - "vxe-grid/empty-render": { - "type": "any", - "description": "空内容渲染配置项，empty-render 的优先级大于 empty-text" - }, - "vxe-grid/loading-config": { - "type": "any", - "description": "加载中配置项" - }, - "vxe-grid/custom-config": { - "type": "any", - "description": "个性化信息配置项" - }, - "vxe-grid/scroll-x": { - "type": "any", - "description": "横向虚拟滚动配置（不支持展开行）" - }, - "vxe-grid/scroll-y": { - "type": "any", - "description": "纵向虚拟滚动配置（不支持展开行）" - }, - "vxe-grid/params": { - "type": "any", - "description": "自定义参数（可以用来存放一些自定义的数据）" - }, - "vxe-grid/form-config": { - "type": "any", - "description": "表单配置项" - }, - "vxe-grid/toolbar-config": { - "type": "any", - "description": "工具栏配置" - }, - "vxe-grid/pager-config": { - "type": "any", - "description": "分页配置项" - }, - "vxe-grid/proxy-config": { - "type": "any", - "description": "数据代理配置项（基于 Promise API）" - }, - "vxe-grid/zoom-config": { - "type": "any", - "description": "缩放配置项" - }, - "vxe-grid/layouts": { - "type": "string[]", - "description": "自定义布局" - }, - "vxe-toolbar/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-toolbar/loading": { - "type": "boolean", - "description": "是否加载中" - }, - "vxe-toolbar/perfect": { - "type": "boolean", - "description": "配套的样式" - }, - "vxe-toolbar/class-name": { - "type": "string | (({}) => string)", - "description": "给工具栏 className" - }, - "vxe-toolbar/import": { - "type": "boolean | object", - "description": "导入按钮配置（需要设置 \"import-config\"）" - }, - "vxe-toolbar/export": { - "type": "boolean | object", - "description": "导出按钮配置（需要设置 \"export-config\"）" - }, - "vxe-toolbar/print": { - "type": "boolean | object", - "description": "打印按钮配置" - }, - "vxe-toolbar/refresh": { - "type": "boolean | object", - "description": "刷新按钮配置" - }, - "vxe-toolbar/custom": { - "type": "boolean | object", - "description": "自定义列配置" - }, - "vxe-toolbar/buttons": { - "type": "any[]", - "description": "左侧按钮列表" - }, - "vxe-toolbar/tools": { - "type": "any[]", - "description": "右侧工具列表" - }, - "vxe-pager/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-pager/loading": { - "type": "boolean", - "description": "是否加载中" - }, - "vxe-pager/layouts": { - "type": "string[]", - "description": "自定义布局" - }, - "vxe-pager/current-page": { - "type": "number", - "description": "当前页" - }, - "vxe-pager/page-size": { - "type": "number", - "description": "每页大小" - }, - "vxe-pager/total": { - "type": "number", - "description": "总条数" - }, - "vxe-pager/pager-count": { - "type": "number", - "description": "显示页码按钮的数量" - }, - "vxe-pager/page-sizes": { - "type": "number[] | array<{label: string, value: number}>", - "description": "每页大小选项列表" - }, - "vxe-pager/align": { - "type": "string", - "description": "对齐方式" - }, - "vxe-pager/border": { - "type": "boolean", - "description": "带边框" - }, - "vxe-pager/background": { - "type": "boolean", - "description": "带背景颜色" - }, - "vxe-pager/perfect": { - "type": "boolean", - "description": "配套的样式" - }, - "vxe-pager/class-name": { - "type": "string, ({}) => string", - "description": "给分页附加 className" - }, - "vxe-pager/auto-hidden": { - "type": "boolean", - "description": "当只有一页时自动隐藏" - }, - "vxe-pager/icon-prev-page": { - "type": "string", - "description": "自定义上一页图标" - }, - "vxe-pager/icon-jump-prev": { - "type": "string", - "description": "自定义向上跳页图标" - }, - "vxe-pager/icon-jump-next": { - "type": "string", - "description": "自定义向下跳页图标" - }, - "vxe-pager/iconnext-page": { - "type": "string", - "description": "自定义下一页图标" - }, - "vxe-pager/icon-jump-more": { - "type": "string", - "description": "自定义跳页显示图标" - }, - "vxe-radio/model-value": { - "type": "any", - "description": "v-model 绑定值" - }, - "vxe-radio/label": { - "type": "string", - "description": "值" - }, - "vxe-radio/content": { - "type": "string", - "description": "内容（支持开启国际化）" - }, - "vxe-radio/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-radio/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-radio/strict": { - "type": "boolean", - "description": "严格模式，选中后不能取消" - }, - "vxe-radio/name": { - "type": "string", - "description": "原生 name 属性" - }, - "vxe-radio-group/model-value": { - "type": "any[]", - "description": "v-model 绑定值" - }, - "vxe-radio-group/type": { - "type": "string", - "description": "按钮类型" - }, - "vxe-radio-group/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-radio-group/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-radio-group/strict": { - "type": "boolean", - "description": "严格模式，选中后不能取消" - }, - "vxe-radio-group/options": { - "type": "{ value, label, disabled }[]", - "description": "选项列表" - }, - "vxe-radio-group/option-props": { - "type": "any", - "description": "选项属性参数配置" - }, - "vxe-radio-button/model-value": { - "type": "any", - "description": "v-model 绑定值" - }, - "vxe-radio-button/label": { - "type": "string | number", - "description": "绑定值" - }, - "vxe-radio-button/content": { - "type": "string | number", - "description": "显示内容" - }, - "vxe-radio-button/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-radio-button/strict": { - "type": "boolean", - "description": "严格模式，选中后不能取消" - }, - "vxe-checkbox/model-value": { - "type": "string | number | boolean", - "description": "v-model 绑定值" - }, - "vxe-checkbox/label": { - "type": "string", - "description": "只对 checkbox-group 有效，值" - }, - "vxe-checkbox/content": { - "type": "string", - "description": "内容（支持开启国际化）" - }, - "vxe-checkbox/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-checkbox/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-checkbox/title": { - "type": "string", - "description": "标题" - }, - "vxe-checkbox/indeterminate": { - "type": "boolean", - "description": "是否不确定状态" - }, - "vxe-checkbox/checked-value": { - "type": "string | number | boolean", - "description": "选中时的值" - }, - "vxe-checkbox/unchecked-value": { - "type": "string | number | boolean", - "description": "未选中时的值" - }, - "vxe-checkbox-group/model-value": { - "type": "any[]", - "description": "v-model 绑定值" - }, - "vxe-checkbox-group/max": { - "type": "string, number", - "description": "限制最大可选数量，默认无限制" - }, - "vxe-checkbox-group/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-checkbox-group/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-checkbox-group/options": { - "type": "{ value, label, disabled }[]", - "description": "选项列表" - }, - "vxe-checkbox-group/option-props": { - "type": "any", - "description": "选项属性参数配置" - }, - "vxe-switch/model-value": { - "type": "string | number | boolean", - "description": "v-model 绑定值" - }, - "vxe-switch/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-switch/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-switch/open-label": { - "type": "string", - "description": "打开时显示的文字" - }, - "vxe-switch/close-label": { - "type": "string", - "description": "关闭时显示的文字" - }, - "vxe-switch/open-value": { - "type": "string | number | boolean", - "description": "打开时的值" - }, - "vxe-switch/close-value": { - "type": "string | number | boolean", - "description": "关闭时的值" - }, - "vxe-switch/open-icon": { - "type": "string", - "description": "打开时的图标" - }, - "vxe-switch/close-icon": { - "type": "string", - "description": "关闭时的图标" - }, - "vxe-input/model-value": { - "type": "any", - "description": "v-model 绑定值" - }, - "vxe-input/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-input/type": { - "type": "string", - "description": "渲染类型" - }, - "vxe-input/name": { - "type": "string", - "description": "原生 name 属性" - }, - "vxe-input/form": { - "type": "string", - "description": "原生 form 属性" - }, - "vxe-input/clearable": { - "type": "boolean", - "description": "当有值时，是否在右侧显示清除按钮" - }, - "vxe-input/placeholder": { - "type": "string", - "description": "当值为空时，显示的占位符" - }, - "vxe-input/autocomplete": { - "type": "string", - "description": "原生 autocomplete 属性" - }, - "vxe-input/maxlength": { - "type": "string | number", - "description": "原生 maxlength 属性" - }, - "vxe-input/multiple": { - "type": "boolean", - "description": "只对 type=date|week|month|quarter|year 有效，是否启用多选" - }, - "vxe-input/readonly": { - "type": "boolean", - "description": "是否只读" - }, - "vxe-input/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-input/class-name": { - "type": "string", - "description": "附加 className" - }, - "vxe-input/prefix-icon": { - "type": "string", - "description": "头部图标" - }, - "vxe-input/suffix-icon": { - "type": "string", - "description": "尾部图标" - }, - "vxe-input/min": { - "type": "string | number", - "description": "只对 type=number|integer|float 有效，最小值" - }, - "vxe-input/max": { - "type": "string | number", - "description": "只对 type=number|integer|float 有效，最大值" - }, - "vxe-input/step": { - "type": "number | string", - "description": "只对 type=number|integer|float 有效，数字间隔" - }, - "vxe-input/digits": { - "type": "number | string", - "description": "只对 type=float 有效，小数位数" - }, - "vxe-input/align": { - "type": "string", - "description": "内容对齐方式" - }, - "vxe-input/exponential": { - "type": "boolean", - "description": "只对 type=number|integer|float 有效，数值是否允许输入科学计数" - }, - "vxe-input/controls": { - "type": "boolean", - "description": "只对 type=number|integer|float 有效，是否显示控制按钮" - }, - "vxe-input/show-word-count": { - "type": "boolean", - "description": "只对 type=text|search 有效，是否显示字数统计" - }, - "vxe-input/count-method": { - "type": "boolean", - "description": "只对 showWordCount 有效，自定义字数计算方法" - }, - "vxe-input/start-date": { - "type": "number | string | date", - "description": "只对 type=date|datetime|week|month|quarter|year 有效，设置面板起始日期" - }, - "vxe-input/end-date": { - "type": "number | string | date", - "description": "只对 type=date|datetime|week|month|quarter|year 有效，设置面板结束日期" - }, - "vxe-input/start-week": { - "type": "number | string", - "description": "即将废弃，请使用 start-day" - }, - "vxe-input/start-day": { - "type": "number | string", - "description": "设置每周的起始日期是星期几" - }, - "vxe-input/select-day": { - "type": "number | string", - "description": "只对 type=week 有效，设置周视图选中后返回星期几" - }, - "vxe-input/label-format": { - "type": "string", - "description": "只对 type=date|datetime|week|month|quarter|year 有效，输入框中显示的日期格式" - }, - "vxe-input/value-format": { - "type": "string", - "description": "只对 type=date|datetime|week|month|quarter|year 有效，绑定值的返回格式，默认返回 Date 类型，如果指定格式则返回字符串" - }, - "vxe-input/editable": { - "type": "boolean", - "description": "只对 type=date|time|datetime|week|month|quarter|year 有效，文本框是否允许输入" - }, - "vxe-input/disabled-method": { - "type": "({ date, viewtype }) => boolean", - "description": "只对 type=date|datetime|week|month|quarter|year 有效，该方法的返回值用来决定该日期是否允许选中" - }, - "vxe-input/festival-method": { - "type": "({ date, viewtype }) => any", - "description": "只对 type=date|datetime|week|month|quarter|year 有效，该方法用于返回对应日期显示的节日" - }, - "vxe-input/transfer": { - "type": "boolean", - "description": "只对 type=date|time|datetime|week|month|quarter|year 有效，是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）" - }, - "vxe-select/model-value": { - "type": "any", - "description": "v-model 绑定值" - }, - "vxe-select/max": { - "type": "string, number", - "description": "限制最大可选数量，默认无限制" - }, - "vxe-select/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-select/multiple": { - "type": "boolean", - "description": "是否多选" - }, - "vxe-select/multi-char-overflow": { - "type": "number, string", - "description": "只对 multiple 有效，设置多选中每个选项显示值的最大字符数，如果超出显示省略号；如果为 -1 则关闭" - }, - "vxe-select/clearable": { - "type": "boolean", - "description": "当有值时，是否在右侧显示清除按钮" - }, - "vxe-select/placeholder": { - "type": "string", - "description": "空值显示的占位符" - }, - "vxe-select/class-name": { - "type": "string | (({}) => string)", - "description": "给选择器附加 className" - }, - "vxe-select/popup-class-name": { - "type": "string | (({}) => string)", - "description": "给下拉容器附加 className" - }, - "vxe-select/visible": { - "type": "boolean", - "description": "是否显示" - }, - "vxe-select/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-select/prefix-icon": { - "type": "string", - "description": "头部图标" - }, - "vxe-select/placement": { - "type": "string", - "description": "固定显示下拉面板的方向" - }, - "vxe-select/options": { - "type": "any[]", - "description": "下拉选项列表" - }, - "vxe-select/option-props": { - "type": "any", - "description": "下拉选项属性参数配置" - }, - "vxe-select/option-groups": { - "type": "any[]", - "description": "下拉分组选项列表" - }, - "vxe-select/option-group-props": { - "type": "any", - "description": "下拉分组选项属性参数配置" - }, - "vxe-select/option-config": { - "type": "any", - "description": "选项配置信息" - }, - "vxe-select/option-id": { - "type": "string", - "description": "已废弃，被 option-config.keyField 替换" - }, - "vxe-select/option-key": { - "type": "boolean", - "description": "已废弃，被 option-config.useKey 替换" - }, - "vxe-select/filterable": { - "type": "boolean", - "description": "是否启用下拉过滤功能" - }, - "vxe-select/filter-method": { - "type": "({ searchvalue, option, group }) => boolean", - "description": "只对 filterable 有效，自定义过滤方法" - }, - "vxe-select/transfer": { - "type": "boolean", - "description": "是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）" - }, - "vxe-optgroup/label": { - "type": "string | number | boolean", - "description": "显示内容" - }, - "vxe-optgroup/visible": { - "type": "boolean", - "description": "是否显示" - }, - "vxe-optgroup/class-name": { - "type": "string | ((params: { option }) => string)", - "description": "附加 className" - }, - "vxe-optgroup/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-option/value": { - "type": "any", - "description": "v-model 绑定值" - }, - "vxe-option/label": { - "type": "string | number | boolean", - "description": "显示内容" - }, - "vxe-option/visible": { - "type": "boolean", - "description": "是否显示" - }, - "vxe-option/class-name": { - "type": "string | ((params: { option }) => string)", - "description": "附加 className" - }, - "vxe-option/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-button/content": { - "type": "string", - "description": "内容（支持开启国际化）" - }, - "vxe-button/mode": { - "type": "string", - "description": "按钮模式,支持文本和按钮" - }, - "vxe-button/title": { - "type": "string", - "description": "标题" - }, - "vxe-button/type": { - "type": "string", - "description": "原生按钮类型" - }, - "vxe-button/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-button/name": { - "type": "string | number", - "description": "用来标识这一项" - }, - "vxe-button/icon": { - "type": "string", - "description": "前缀图标" - }, - "vxe-button/round": { - "type": "boolean", - "description": "圆角边框" - }, - "vxe-button/circle": { - "type": "boolean", - "description": "圆角按钮" - }, - "vxe-button/status": { - "type": "string", - "description": "按钮的图标" - }, - "vxe-button/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-button/class-name": { - "type": "string | (({}) => string)", - "description": "给展示容器附加 className" - }, - "vxe-button/popup-class-name": { - "type": "string | (({}) => string)", - "description": "给下拉容器附加 className" - }, - "vxe-button/loading": { - "type": "boolean", - "description": "是否加载中" - }, - "vxe-button/placement": { - "type": "string", - "description": "固定显示下拉面板的方向" - }, - "vxe-button/destroy-on-close": { - "type": "boolean", - "description": "在下拉容器关闭时销毁内容" - }, - "vxe-button/transfer": { - "type": "boolean", - "description": "是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）" - }, - "vxe-button-group/mode": { - "type": "string", - "description": "按钮模式,支持文本和按钮" - }, - "vxe-button-group/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-button-group/status": { - "type": "string", - "description": "按钮的图标" - }, - "vxe-button-group/round": { - "type": "boolean", - "description": "圆角边框" - }, - "vxe-button-group/circle": { - "type": "boolean", - "description": "圆角按钮" - }, - "vxe-button-group/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-button-group/class-name": { - "type": "string | (({}) => string)", - "description": "给展示容器附加 className" - }, - "vxe-button-group/options": { - "type": "array", - "description": "按钮列表" - }, - "vxe-tooltip/model-value": { - "type": "boolean", - "description": "是否显示" - }, - "vxe-tooltip/content": { - "type": "string | number", - "description": "显示内容" - }, - "vxe-tooltip/trigger": { - "type": "string", - "description": "触发方式" - }, - "vxe-tooltip/theme": { - "type": "string", - "description": "主题样式" - }, - "vxe-tooltip/popup-class-name": { - "type": "string | (({}) => string)", - "description": "给下拉容器附加 className" - }, - "vxe-tooltip/z-index": { - "type": "number", - "description": "自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）" - }, - "vxe-tooltip/is-arrow": { - "type": "boolean", - "description": "是否显示箭头" - }, - "vxe-tooltip/enterable": { - "type": "boolean", - "description": "鼠标是否可进入到 tooltip 中" - }, - "vxe-tooltip/enter-delay": { - "type": "number", - "description": "鼠标移入后延时多少才显示 tooltip" - }, - "vxe-tooltip/leavedelay": { - "type": "number", - "description": "鼠标移出后延时多少才隐藏 tooltip" - }, - "vxe-modal/model-value": { - "type": "any", - "description": "v-model 绑定值" - }, - "vxe-modal/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-modal/loading": { - "type": "boolean", - "description": "是否加载中" - }, - "vxe-modal/id": { - "type": "string", - "description": "设置唯一的 id（对于 Message 防止重复弹出 或 Storage 拖动状态保存等场景可能会用到）" - }, - "vxe-modal/title": { - "type": "string", - "description": "窗口的标题（支持开启国际化）" - }, - "vxe-modal/type": { - "type": "string", - "description": "窗口类型" - }, - "vxe-modal/status": { - "type": "string", - "description": "confirm" - }, - "vxe-modal/class-name": { - "type": "string", - "description": "给窗口附加 className" - }, - "vxe-modal/icon-status": { - "type": "string", - "description": "自定义状态图标" - }, - "vxe-modal/content": { - "type": "string", - "description": "显示的文本（支持开启国际化）" - }, - "vxe-modal/message": { - "type": "string", - "description": "请使用 content" - }, - "vxe-modal/cancel-button-text": { - "type": "string", - "description": "只对 type=confirm 有效，取消按钮的文本内容" - }, - "vxe-modal/confirm-button-text": { - "type": "string", - "description": "只对 type=alert|confirm 有效，确定按钮的文本内容" - }, - "vxe-modal/show-header": { - "type": "boolean", - "description": "是否显示头部" - }, - "vxe-modal/show-footer": { - "type": "boolean", - "description": "是否显示底部" - }, - "vxe-modal/lock-view": { - "type": "boolean", - "description": "是否锁住页面，不允许窗口之外的任何操作" - }, - "vxe-modal/lock-scroll": { - "type": "boolean", - "description": "是否锁住滚动条，不允许页面滚动" - }, - "vxe-modal/mask": { - "type": "boolean", - "description": "是否显示遮罩层" - }, - "vxe-modal/mask-closable": { - "type": "boolean", - "description": "是否允许点击遮罩层关闭窗口" - }, - "vxe-modal/esc-closable": { - "type": "boolean", - "description": "是否允许按 Esc 键关闭窗口" - }, - "vxe-modal/show-zoom": { - "type": "boolean", - "description": "标题是否标显示最大化与还原按钮" - }, - "vxe-modal/show-close": { - "type": "boolean", - "description": "是否显示关闭按钮" - }, - "vxe-modal/resize": { - "type": "boolean", - "description": "是否允许窗口边缘拖动调整窗口大小" - }, - "vxe-modal/margin-size": { - "type": "number", - "description": "只对 resize 启用后有效，用于设置可拖动界限范围，如果为负数则允许拖动超出屏幕边界" - }, - "vxe-modal/duration": { - "type": "number | string", - "description": "只对 type=message 有效，自动关闭的延时，如果为 -1 禁用自动关闭" - }, - "vxe-modal/width": { - "type": "number | string", - "description": "窗口的宽度" - }, - "vxe-modal/height": { - "type": "number | string", - "description": "窗口的高度" - }, - "vxe-modal/min-width": { - "type": "number | string", - "description": "窗口的最小宽度" - }, - "vxe-modal/min-height": { - "type": "number | string", - "description": "窗口的最小高度" - }, - "vxe-modal/top": { - "type": "number | string", - "description": "只对 type=message 有效，消息距离顶部的位置" - }, - "vxe-modal/position": { - "type": "any", - "description": "只对 type=modal 有效，窗口的默认位置，可以设置为 center 居中显示" - }, - "vxe-modal/z-index": { - "type": "number", - "description": "自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）" - }, - "vxe-modal/show-title-overflow": { - "type": "boolean", - "description": "设置标题内容过长时显示为省略号" - }, - "vxe-modal/transfer": { - "type": "boolean", - "description": "是否将弹框容器插入于 body 内" - }, - "vxe-modal/fullscreen": { - "type": "boolean", - "description": "窗口打开时自动最大化显示" - }, - "vxe-modal/draggable": { - "type": "boolean", - "description": "是否启用窗口拖动" - }, - "vxe-modal/dblclick-zoom": { - "type": "boolean", - "description": "只对 type=modal 有效，是否允许通过双击头部放大或还原窗口" - }, - "vxe-modal/remember": { - "type": "boolean", - "description": "记忆功能，会记住最后操作状态，再次打开窗口时还原窗口状态" - }, - "vxe-modal/destroy-on-close": { - "type": "boolean", - "description": "在窗口关闭时销毁内容" - }, - "vxe-modal/storage": { - "type": "boolean", - "description": "是否启用 localStorage 本地保存，会将窗口拖动的状态保存到本地（需要有 id）" - }, - "vxe-modal/before-hide-method": { - "type": "({ type }) => error | promise", - "description": "在窗口隐藏之前执行，可以返回 Error 阻止关闭，支持异步" - }, - "vxe-form/data": { - "type": "any", - "description": "表单数据" - }, - "vxe-form/loading": { - "type": "boolean", - "description": "是否加载中" - }, - "vxe-form/span": { - "type": "string | number", - "description": "所有项的栅格占据的列数（共 24 分栏）" - }, - "vxe-form/align": { - "type": "string", - "description": "所有项的内容对齐方式" - }, - "vxe-form/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-form/title-align": { - "type": "string", - "description": "所有项的标题对齐方式" - }, - "vxe-form/title-width": { - "type": "string | number", - "description": "所有项的标题宽度" - }, - "vxe-form/title-colon": { - "type": "boolean", - "description": "是否显示标题冒号" - }, - "vxe-form/title-asterisk": { - "type": "boolean", - "description": "是否显示必填字段的红色星号" - }, - "vxe-form/title-overflow": { - "type": "string | boolean", - "description": "所有设置标题内容过长时显示为省略号" - }, - "vxe-form/vertical": { - "type": "boolean", - "description": "所有项使用垂直布局" - }, - "vxe-form/class-name": { - "type": "string, ({ data }) => string", - "description": "给表单附加 className" - }, - "vxe-form/collapse-status": { - "type": "boolean", - "description": "v-model 绑定值，折叠状态" - }, - "vxe-form/custom-layout": { - "type": "boolean", - "description": "是否使用自定义布局" - }, - "vxe-form/items": { - "type": "any[]", - "description": "项列表" - }, - "vxe-form/rules": { - "type": "{ [field: string]: vxeformdefines.formrule[] }", - "description": "校验规则配置项" - }, - "vxe-form/prevent-submit": { - "type": "boolean", - "description": "是否禁用默认的回车提交方式，禁用后配合 validate() 方法可以更加自由的控制提交逻辑" - }, - "vxe-form/valid-config": { - "type": "any", - "description": "检验配置项" - }, - "vxe-form-item/field": { - "type": "string", - "description": "字段名" - }, - "vxe-form-item/title": { - "type": "string", - "description": "标题（支持开启国际化）" - }, - "vxe-form-item/span": { - "type": "string | number", - "description": "栅格占据的列数（共 24 分栏）" - }, - "vxe-form-item/align": { - "type": "string", - "description": "内容对齐方式" - }, - "vxe-form-item/title-align": { - "type": "string", - "description": "标题对齐方式" - }, - "vxe-form-item/title-width": { - "type": "string | number", - "description": "标题宽度" - }, - "vxe-form-item/title-colon": { - "type": "boolean", - "description": "是否显示标题冒号" - }, - "vxe-form-item/title-asterisk": { - "type": "boolean", - "description": "是否显示必填字段的红色星号" - }, - "vxe-form-item/title-overflow": { - "type": "string | boolean", - "description": "标题内容过长时显示为省略号" - }, - "vxe-form-item/show-title": { - "type": "boolean", - "description": "是否显示标题" - }, - "vxe-form-item/vertical": { - "type": "boolean", - "description": "使用垂直布局" - }, - "vxe-form-item/class-name": { - "type": "string, ({ field, data }) => string", - "description": "给表单项附加 className" - }, - "vxe-form-item/content-class-name": { - "type": "string, ({ field, data }) => string", - "description": "给表单项内容附加 className" - }, - "vxe-form-item/content-style": { - "type": "{ [name: string]: string }, ({ field, data }) => string", - "description": "给表单项内容附加样式" - }, - "vxe-form-item/visible": { - "type": "boolean", - "description": "默认是否显示" - }, - "vxe-form-item/visible-method": { - "type": "({ data }) => boolean", - "description": "该方法的返回值用来决定该项是否显示" - }, - "vxe-form-item/folding": { - "type": "boolean", - "description": "默认收起" - }, - "vxe-form-item/collapse-node": { - "type": "boolean", - "description": "折叠节点" - }, - "vxe-form-item/title-prefix": { - "type": "any", - "description": "前缀配置项" - }, - "vxe-form-item/title-suffix": { - "type": "any", - "description": "后缀配置项" - }, - "vxe-form-item/reset-value": { - "type": "any", - "description": "重置时的默认值" - }, - "vxe-form-item/item-render": { - "type": "any", - "description": "项渲染器配置项" - }, - "vxe-form-gather/span": { - "type": "string | number", - "description": "栅格占据的列数（共 24 分栏）" - }, - "vxe-form-gather/class-name": { - "type": "string, ({ field, data }) => string", - "description": "给表单项附加 className" - }, - "vxe-list/data": { - "type": "any[]", - "description": "列表数据" - }, - "vxe-list/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-list/loading": { - "type": "boolean", - "description": "是否加载中" - }, - "vxe-list/height": { - "type": "number | string", - "description": "列表高度" - }, - "vxe-list/class-name": { - "type": "string", - "description": "附加 className" - }, - "vxe-list/auto-resize": { - "type": "boolean", - "description": "自动监听父元素的变化去重新计算列表（对于父元素可能存在动态变化的场景可能会用到）" - }, - "vxe-list/sync-resize": { - "type": "boolean | string | number", - "description": "自动跟随某个属性的变化去重新计算列表，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换的场景可能会用到）" - }, - "vxe-list/scroll-y": { - "type": "any", - "description": "纵向虚拟滚动配置" - }, - "vxe-pulldown/model-value": { - "type": "boolean", - "description": "v-model 绑定值" - }, - "vxe-pulldown/size": { - "type": "string", - "description": "尺寸" - }, - "vxe-pulldown/class-name": { - "type": "string | (({}) => string)", - "description": "给展示容器附加 className" - }, - "vxe-pulldown/popup-class-name": { - "type": "string | (({}) => string)", - "description": "给下拉容器附加 className" - }, - "vxe-pulldown/disabled": { - "type": "boolean", - "description": "是否禁用" - }, - "vxe-pulldown/placement": { - "type": "string", - "description": "固定显示下拉面板的方向" - }, - "vxe-pulldown/destroy-on-close": { - "type": "boolean", - "description": "在下拉容器关闭时销毁内容" - }, - "vxe-pulldown/transfer": { - "type": "boolean", - "description": "是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true）" - } -} \ No newline at end of file +{"vxe-table/id":{"type":"string","description":"唯一标识（被某些特定的功能所依赖）"},"vxe-table/data":{"type":"any[]","description":"表格数据（与 loadData 行为一致，更新数据是不会重置状态）"},"vxe-table/height":{"type":"number | string","description":"表格的高度；支持铺满父容器或者固定高度，如果设置 auto 为铺满父容器（如果设置为 auto，则必须确保存在父节点且不允许存在相邻元素）"},"vxe-table/min-height":{"type":"number | string","description":"表格最小高度"},"vxe-table/max-height":{"type":"number | string","description":"表格的最大高度"},"vxe-table/auto-resize":{"type":"boolean","description":"自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到）"},"vxe-table/sync-resize":{"type":"boolean | string | number","description":"自动跟随某个属性的变化去重新计算表格，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换时可能会用到）"},"vxe-table/resizable":{"type":"boolean","description":"已废弃，被 column-config.resizable 替换"},"vxe-table/stripe":{"type":"boolean","description":"是否带有斑马纹（需要注意的是，在可编辑表格场景下，临时插入的数据不会有斑马纹样式）"},"vxe-table/border":{"type":"boolean | string","description":"是否带有边框"},"vxe-table/round":{"type":"boolean","description":"是否为圆角边框"},"vxe-table/size":{"type":"string","description":"表格的尺寸"},"vxe-table/loading":{"type":"boolean","description":"表格是否显示加载中"},"vxe-table/align":{"type":"string","description":"所有的列对齐方式"},"vxe-table/header-align":{"type":"string","description":"所有的表头列的对齐方式"},"vxe-table/footer-align":{"type":"string","description":"所有的表尾列的对齐方式"},"vxe-table/show-header":{"type":"boolean","description":"是否显示表头"},"vxe-table/highlight-current-row":{"type":"boolean","description":"已废弃，被 row-config.isCurrent 替换"},"vxe-table/highlight-hover-row":{"type":"boolean","description":"已废弃，被 row-config.isHover 替换"},"vxe-table/highlight-current-column":{"type":"boolean","description":"已废弃，被 column-config.isCurrent 替换"},"vxe-table/highlight-hover-column":{"type":"boolean","description":"已废弃，被 column-config.isHover 替换"},"vxe-table/row-class-name":{"type":"string | (({ row, rowindex, $rowindex }) => any)","description":"给行附加 className"},"vxe-table/cell-class-name":{"type":"string | (({ row, rowindex, $rowindex, column, columnindex, $columnindex }) => any)","description":"给单元格附加 className"},"vxe-table/header-row-class-name":{"type":"string | (({ $rowindex }) => any)","description":"给表头的行附加 className"},"vxe-table/header-cell-class-name":{"type":"string | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表头的单元格附加 className"},"vxe-table/footer-row-class-name":{"type":"string | (({ $rowindex }) => any)","description":"给表尾的行附加 className"},"vxe-table/footer-cell-class-name":{"type":"string | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表尾的单元格附加 className"},"vxe-table/cell-style":{"type":"any | (({ row, rowindex, $rowindex, column, columnindex, $columnindex }) => any)","description":"给单元格附加样式"},"vxe-table/header-cell-style":{"type":"any | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表头单元格附加样式"},"vxe-table/footer-cell-style":{"type":"any | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表尾单元格附加样式"},"vxe-table/row-style":{"type":"any | (({ row, rowindex, $rowindex }) => any)","description":"给行附加样式，也可以是函数"},"vxe-table/header-row-style":{"type":"any | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表头行附加样式"},"vxe-table/footer-row-style":{"type":"any | (({ $rowindex }) => any)","description":"给表尾行附加样式"},"vxe-table/show-footer":{"type":"boolean","description":"是否显示表尾"},"vxe-table/footer-data":{"type":"any[]","description":"表尾数据"},"vxe-table/footer-method":{"type":"({ columns, data }) => any[][]","description":"表尾的数据获取方法，返回一个二维数组"},"vxe-table/merge-cells":{"type":"array<{ row: number, col: number, rowspan: number, colspan: number }>","description":"临时合并指定的单元格 (不能用于展开行，不建议用于固定列、树形结构)"},"vxe-table/merge-footer-items":{"type":"array<{ row: number, col: number, rowspan: number, colspan: number }>","description":"临时合并表尾 (不能用于展开行，不建议用于固定列、树形结构)"},"vxe-table/span-method":{"type":"({ row, rowindex, $rowindex, _rowindex, column, columnindex, $columnindex, _columnindex, data }) => { rowspan: number, colspan: number}","description":"自定义合并函数，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)"},"vxe-table/footer-span-method":{"type":"({ $rowindex, column, columnindex, $columnindex, _columnindex, data }) => { rowspan: number, colspan: number}","description":"表尾合并行或列，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)"},"vxe-table/show-overflow":{"type":"boolean | string","description":"设置所有内容过长时显示为省略号（如果是固定列建议设置该值，提升渲染速度）"},"vxe-table/show-header-overflow":{"type":"boolean | string","description":"设置表头所有内容过长时显示为省略号"},"vxe-table/show-footer-overflow":{"type":"boolean | string","description":"设置表尾所有内容过长时显示为省略号"},"vxe-table/column-key":{"type":"boolean","description":"已废弃，被 column-config.useKey 替换"},"vxe-table/row-key":{"type":"boolean","description":"已废弃，被 row-config.useKey 替换"},"vxe-table/row-id":{"type":"string","description":"已废弃，被 row-config.keyField 替换"},"vxe-table/keep-source":{"type":"boolean","description":"保持原始值的状态，被某些功能所依赖，比如编辑状态、还原数据等（开启后影响性能，具体取决于数据量）"},"vxe-table/column-config":{"type":"any","description":"列配置信息"},"vxe-table/row-config":{"type":"any","description":"行配置信息"},"vxe-table/resize-config":{"type":"object","description":"响应式布局配置项"},"vxe-table/resizable-config":{"type":"object","description":"列宽拖动配置项"},"vxe-table/seq-config":{"type":"any","description":"序号配置项"},"vxe-table/sort-config":{"type":"any","description":"排序配置项"},"vxe-table/filter-config":{"type":"any","description":"筛选配置项"},"vxe-table/export-config":{"type":"any","description":"导出配置项"},"vxe-table/import-config":{"type":"any","description":"导入配置项"},"vxe-table/print-config":{"type":"any","description":"打印配置项"},"vxe-table/radio-config":{"type":"any","description":"单选框配置项"},"vxe-table/checkbox-config":{"type":"any","description":"复选框配置项"},"vxe-table/tooltip-config":{"type":"any","description":"tooltip 配置项"},"vxe-table/expand-config":{"type":"any","description":"展开行配置项（不支持虚拟滚动）"},"vxe-table/tree-config":{"type":"any","description":"树形结构配置项"},"vxe-table/menu-config":{"type":"any","description":"右键菜单配置项"},"vxe-table/clip-config":{"type":"any","description":"复制/粘贴配置项"},"vxe-table/fnr-config":{"type":"any","description":"查找/替换配置项"},"vxe-table/mouse-config":{"type":"any","description":"鼠标配置项"},"vxe-table/area-config":{"type":"any","description":"区域选取配置项"},"vxe-table/keyboard-config":{"type":"any","description":"按键配置项"},"vxe-table/edit-config":{"type":"any","description":"可编辑配置项"},"vxe-table/valid-config":{"type":"any","description":"校验配置项"},"vxe-table/edit-rules":{"type":"{ [field: string]: vxetabledefines.validatorrule[] }","description":"校验规则配置项"},"vxe-table/empty-text":{"type":"string","description":"空数据时显示的内容"},"vxe-table/empty-render":{"type":"any","description":"空内容渲染配置项，empty-render 的优先级大于 empty-text"},"vxe-table/loading-config":{"type":"any","description":"加载中配置项"},"vxe-table/custom-config":{"type":"any","description":"个性化信息配置项"},"vxe-table/scroll-x":{"type":"any","description":"横向虚拟滚动配置（不支持展开行）"},"vxe-table/scroll-y":{"type":"any","description":"纵向虚拟滚动配置（不支持展开行）"},"vxe-table/params":{"type":"any","description":"自定义参数（可以用来存放一些自定义的数据）"},"vxe-colgroup/field":{"type":"string","description":"列字段名（注：属性层级越深，渲染性能就越差，例如：aa.bb.cc.dd.ee）"},"vxe-colgroup/title":{"type":"string","description":"列标题（支持开启国际化）"},"vxe-colgroup/width":{"type":"number | string","description":"列宽度（如果为空则均匀分配剩余宽度，如果全部列固定了，可能会存在宽屏下不会铺满，可以配合 \"%\" 或者 \"min-width\" 布局）"},"vxe-colgroup/min-width":{"type":"number | string","description":"最小列宽度；会自动将剩余空间按比例分配"},"vxe-colgroup/resizable":{"type":"boolean","description":"列是否允许拖动列宽调整大小"},"vxe-colgroup/visible":{"type":"boolean","description":"默认是否显示"},"vxe-colgroup/fixed":{"type":"string","description":"将列固定在左侧或者右侧（注意：固定列应该放在左右两侧的位置）"},"vxe-colgroup/align":{"type":"string","description":"列对齐方式"},"vxe-colgroup/header-align":{"type":"string","description":"表头列的对齐方式"},"vxe-colgroup/show-overflow":{"type":"string | boolean","description":"当内容过长时显示为省略号"},"vxe-colgroup/show-header-overflow":{"type":"string | boolean","description":"当表头内容过长时显示为省略号"},"vxe-colgroup/header-class-name":{"type":"string | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表头的单元格附加 className"},"vxe-column/type":{"type":"string","description":"列的类型（部分功能需要设置 column-config.useKey | row-config.useKey）"},"vxe-column/field":{"type":"string","description":"列字段名（注：属性层级越深，渲染性能就越差，例如：aa.bb.cc.dd.ee）"},"vxe-column/title":{"type":"string","description":"列标题（支持开启国际化）"},"vxe-column/width":{"type":"number | string","description":"列宽度（如果为空则均匀分配剩余宽度，如果全部列固定了，可能会存在宽屏下不会铺满，可以配合 \"%\" 或者 \"min-width\" 布局）"},"vxe-column/min-width":{"type":"number | string","description":"最小列宽度；会自动将剩余空间按比例分配"},"vxe-column/resizable":{"type":"boolean","description":"列是否允许拖动列宽调整大小"},"vxe-column/visible":{"type":"boolean","description":"默认是否显示"},"vxe-column/fixed":{"type":"string","description":"将列固定在左侧或者右侧（注意：固定列应该放在左右两侧的位置）"},"vxe-column/align":{"type":"string","description":"列对齐方式"},"vxe-column/header-align":{"type":"string","description":"表头列的对齐方式"},"vxe-column/footer-align":{"type":"string","description":"表尾列的对齐方式"},"vxe-column/show-overflow":{"type":"string | boolean","description":"当内容过长时显示为省略号"},"vxe-column/show-header-overflow":{"type":"string | boolean","description":"当表头内容过长时显示为省略号"},"vxe-column/show-footer-overflow":{"type":"boolean | string","description":"当表尾内容过长时显示为省略号"},"vxe-column/class-name":{"type":"string | (({row, rowindex, $rowindex, column, columnindex, $columnindex}) => any)","description":"给单元格附加 className"},"vxe-column/header-class-name":{"type":"string | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表头的单元格附加 className"},"vxe-column/footer-class-name":{"type":"string | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表尾的单元格附加 className"},"vxe-column/formatter":{"type":"(({ cellvalue, row, column }) => string) | any[] | string","description":"格式化显示内容"},"vxe-column/sortable":{"type":"boolean","description":"数据排序，是否允许列排序"},"vxe-column/sort-by":{"type":"string | (({ row, column }) => string | number)","description":"数据排序，只对 sortable 有效，指定排序的字段（当值 formatter 格式化后，可以设置该字段，使用值进行排序）"},"vxe-column/sort-type":{"type":"string","description":"数据排序，排序的字段类型，比如字符串转数值等"},"vxe-column/filters":{"type":"any[]","description":"数据筛选，配置筛选条件（注：筛选只能用于列表，如果是树结构则过滤根节点）"},"vxe-column/filter-multiple":{"type":"boolean","description":"数据筛选，只对 filters 有效，筛选是否允许多选"},"vxe-column/filter-method":{"type":"({ value, option, cellvalue, row, column }) => boolean","description":"数据筛选，只对 filters 有效，列的筛选方法，该方法的返回值用来决定该行是否显示"},"vxe-column/filter-reset-method":{"type":"({ options, column }) => void","description":"数据筛选，只对 filters 有效，自定义筛选重置方法"},"vxe-column/filter-recover-method":{"type":"({ option, column }) => void","description":"数据筛选，只对 filters 有效，自定义筛选复原方法（使用自定义筛选时可能会用到）"},"vxe-column/filter-render":{"type":"any","description":"数据筛选，筛选渲染器配置项"},"vxe-column/header-export-method":{"type":"({ column, options }) => string","description":"自定义表头单元格数据导出方法，返回自定义的标题"},"vxe-column/export-method":{"type":"({ row, column, options }) => string","description":"自定义单元格数据导出方法，返回自定义的值"},"vxe-column/footer-export-method":{"type":"({ items, _columnindex, options }) => string","description":"自定义表尾单元格数据导出方法，返回自定义的值"},"vxe-column/title-help":{"type":"any","description":"即将废弃，请使用 title.prefix"},"vxe-column/title-prefix":{"type":"any","description":"标题前缀图标配置项"},"vxe-column/title-suffix":{"type":"any","description":"标题后缀图标配置项"},"vxe-column/cell-type":{"type":"string","description":"只对特定功能有效，单元格值类型（例如：导出数据类型设置）"},"vxe-column/cell-render":{"type":"any","description":"默认的渲染器配置项"},"vxe-column/edit-render":{"type":"any","description":"可编辑渲染器配置项"},"vxe-column/content-render":{"type":"any","description":"内容渲染配置项"},"vxe-column/tree-node":{"type":"boolean","description":"只对 tree-config 配置时有效，指定为树节点"},"vxe-column/params":{"type":"any","description":"额外的参数（可以用来存放一些私有参数）"},"vxe-column/col-id":{"type":"string | number","description":"自定义列的唯一主键（注：列主键必须确保唯一，操作不正确将导致出现问题）"},"vxe-grid/id":{"type":"string","description":"唯一标识（被某些特定的功能所依赖）"},"vxe-grid/columns":{"type":"array","description":"列配置"},"vxe-grid/data":{"type":"any[]","description":"表格数据（与 loadData 行为一致，更新数据是不会重置状态）"},"vxe-grid/height":{"type":"number | string","description":"表格的高度；支持铺满父容器或者固定高度，如果设置 auto 为铺满父容器（如果设置为 auto，则必须确保存在父节点且不允许存在相邻元素）"},"vxe-grid/min-height":{"type":"number | string","description":"表格最小高度"},"vxe-grid/max-height":{"type":"number | string","description":"表格的最大高度"},"vxe-grid/auto-resize":{"type":"boolean","description":"自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到）"},"vxe-grid/sync-resize":{"type":"boolean | string | number","description":"自动跟随某个属性的变化去重新计算表格，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换时可能会用到）"},"vxe-grid/resizable":{"type":"boolean","description":"已废弃，被 column-config.resizable 替换"},"vxe-grid/stripe":{"type":"boolean","description":"是否带有斑马纹（需要注意的是，在可编辑表格场景下，临时插入的数据不会有斑马纹样式）"},"vxe-grid/border":{"type":"boolean | string","description":"是否带有边框"},"vxe-grid/round":{"type":"boolean","description":"是否为圆角边框"},"vxe-grid/size":{"type":"string","description":"表格的尺寸"},"vxe-grid/loading":{"type":"boolean","description":"表格是否显示加载中"},"vxe-grid/align":{"type":"string","description":"所有的列对齐方式"},"vxe-grid/header-align":{"type":"string","description":"所有的表头列的对齐方式"},"vxe-grid/footer-align":{"type":"string","description":"所有的表尾列的对齐方式"},"vxe-grid/show-header":{"type":"boolean","description":"是否显示表头"},"vxe-grid/highlight-current-row":{"type":"boolean","description":"已废弃，被 row-config.isCurrent 替换"},"vxe-grid/highlight-hover-row":{"type":"boolean","description":"已废弃，被 row-config.isHover 替换"},"vxe-grid/highlight-current-column":{"type":"boolean","description":"已废弃，被 column-config.isCurrent 替换"},"vxe-grid/highlight-hover-column":{"type":"boolean","description":"已废弃，被 column-config.isHover 替换"},"vxe-grid/row-class-name":{"type":"string | (({ row, rowindex, $rowindex }) => any)","description":"给行附加 className"},"vxe-grid/cell-class-name":{"type":"string | (({ row, rowindex, $rowindex, column, columnindex, $columnindex }) => any)","description":"给单元格附加 className"},"vxe-grid/header-row-class-name":{"type":"string | (({ $rowindex }) => any)","description":"给表头的行附加 className"},"vxe-grid/header-cell-class-name":{"type":"string | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表头的单元格附加 className"},"vxe-grid/footer-row-class-name":{"type":"string | (({ $rowindex }) => any)","description":"给表尾的行附加 className"},"vxe-grid/footer-cell-class-name":{"type":"string | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表尾的单元格附加 className"},"vxe-grid/cell-style":{"type":"any | (({ row, rowindex, $rowindex, column, columnindex, $columnindex }) => any)","description":"给单元格附加样式"},"vxe-grid/header-cell-style":{"type":"any | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表头单元格附加样式"},"vxe-grid/footer-cell-style":{"type":"any | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表尾单元格附加样式"},"vxe-grid/row-style":{"type":"any | (({ row, rowindex, $rowindex }) => any)","description":"给行附加样式，也可以是函数"},"vxe-grid/header-row-style":{"type":"any | (({ $rowindex, column, columnindex, $columnindex }) => any)","description":"给表头行附加样式"},"vxe-grid/footer-row-style":{"type":"any | (({ $rowindex }) => any)","description":"给表尾行附加样式"},"vxe-grid/show-footer":{"type":"boolean","description":"是否显示表尾"},"vxe-grid/footer-data":{"type":"any[]","description":"表尾数据"},"vxe-grid/footer-method":{"type":"({ columns, data }) => any[][]","description":"表尾的数据获取方法，返回一个二维数组"},"vxe-grid/merge-cells":{"type":"array<{ row: number, col: number, rowspan: number, colspan: number }>","description":"临时合并指定的单元格 (不能用于展开行，不建议用于固定列、树形结构)"},"vxe-grid/merge-footer-items":{"type":"array<{ row: number, col: number, rowspan: number, colspan: number }>","description":"临时合并表尾 (不能用于展开行，不建议用于固定列、树形结构)"},"vxe-grid/span-method":{"type":"({ row, rowindex, $rowindex, _rowindex, column, columnindex, $columnindex, _columnindex, data }) => { rowspan: number, colspan: number}","description":"自定义合并函数，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)"},"vxe-grid/footer-span-method":{"type":"({ $rowindex, column, columnindex, $columnindex, _columnindex, data }) => { rowspan: number, colspan: number}","description":"表尾合并行或列，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构)"},"vxe-grid/show-overflow":{"type":"boolean | string","description":"设置所有内容过长时显示为省略号（如果是固定列建议设置该值，提升渲染速度）"},"vxe-grid/show-header-overflow":{"type":"boolean | string","description":"设置表头所有内容过长时显示为省略号"},"vxe-grid/show-footer-overflow":{"type":"boolean | string","description":"设置表尾所有内容过长时显示为省略号"},"vxe-grid/column-key":{"type":"boolean","description":"已废弃，被 column-config.useKey 替换"},"vxe-grid/row-key":{"type":"boolean","description":"已废弃，被 row-config.useKey 替换"},"vxe-grid/row-id":{"type":"string","description":"已废弃，被 row-config.keyField 替换"},"vxe-grid/keep-source":{"type":"boolean","description":"保持原始值的状态，被某些功能所依赖，比如编辑状态、还原数据等（开启后影响性能，具体取决于数据量）"},"vxe-grid/column-config":{"type":"any","description":"列配置信息"},"vxe-grid/row-config":{"type":"any","description":"行配置信息"},"vxe-grid/resize-config":{"type":"object","description":"响应式布局配置项"},"vxe-grid/resizable-config":{"type":"object","description":"列宽拖动配置项"},"vxe-grid/seq-config":{"type":"any","description":"序号配置项"},"vxe-grid/sort-config":{"type":"any","description":"排序配置项"},"vxe-grid/filter-config":{"type":"any","description":"筛选配置项"},"vxe-grid/export-config":{"type":"any","description":"导出配置项"},"vxe-grid/import-config":{"type":"any","description":"导入配置项"},"vxe-grid/print-config":{"type":"any","description":"打印配置项"},"vxe-grid/radio-config":{"type":"any","description":"单选框配置项"},"vxe-grid/checkbox-config":{"type":"any","description":"复选框配置项"},"vxe-grid/tooltip-config":{"type":"any","description":"tooltip 配置项"},"vxe-grid/expand-config":{"type":"any","description":"展开行配置项（不支持虚拟滚动）"},"vxe-grid/tree-config":{"type":"any","description":"树形结构配置项"},"vxe-grid/menu-config":{"type":"any","description":"右键菜单配置项"},"vxe-grid/clip-config":{"type":"any","description":"复制/粘贴配置项"},"vxe-grid/fnr-config":{"type":"any","description":"查找/替换配置项"},"vxe-grid/mouse-config":{"type":"any","description":"鼠标配置项"},"vxe-grid/area-config":{"type":"any","description":"区域选取配置项"},"vxe-grid/keyboard-config":{"type":"any","description":"按键配置项"},"vxe-grid/edit-config":{"type":"any","description":"可编辑配置项"},"vxe-grid/valid-config":{"type":"any","description":"校验配置项"},"vxe-grid/edit-rules":{"type":"{ [field: string]: vxetabledefines.validatorrule[] }","description":"校验规则配置项"},"vxe-grid/empty-text":{"type":"string","description":"空数据时显示的内容"},"vxe-grid/empty-render":{"type":"any","description":"空内容渲染配置项，empty-render 的优先级大于 empty-text"},"vxe-grid/loading-config":{"type":"any","description":"加载中配置项"},"vxe-grid/custom-config":{"type":"any","description":"个性化信息配置项"},"vxe-grid/scroll-x":{"type":"any","description":"横向虚拟滚动配置（不支持展开行）"},"vxe-grid/scroll-y":{"type":"any","description":"纵向虚拟滚动配置（不支持展开行）"},"vxe-grid/params":{"type":"any","description":"自定义参数（可以用来存放一些自定义的数据）"},"vxe-grid/form-config":{"type":"any","description":"表单配置项"},"vxe-grid/toolbar-config":{"type":"any","description":"工具栏配置"},"vxe-grid/pager-config":{"type":"any","description":"分页配置项"},"vxe-grid/proxy-config":{"type":"any","description":"数据代理配置项（基于 Promise API）"},"vxe-grid/zoom-config":{"type":"any","description":"缩放配置项"},"vxe-grid/layouts":{"type":"string[]","description":"自定义布局"},"vxe-toolbar/size":{"type":"string","description":"尺寸"},"vxe-toolbar/loading":{"type":"boolean","description":"是否加载中"},"vxe-toolbar/class-name":{"type":"string | (({}) => string)","description":"给工具栏 className"},"vxe-toolbar/import":{"type":"boolean | object","description":"导入按钮配置（需要设置 \"import-config\"）"},"vxe-toolbar/export":{"type":"boolean | object","description":"导出按钮配置（需要设置 \"export-config\"）"},"vxe-toolbar/print":{"type":"boolean | object","description":"打印按钮配置"},"vxe-toolbar/refresh":{"type":"boolean | object","description":"刷新按钮配置"},"vxe-toolbar/custom":{"type":"boolean | object","description":"自定义列配置"},"vxe-toolbar/buttons":{"type":"any[]","description":"左侧按钮列表"},"vxe-toolbar/tools":{"type":"any[]","description":"右侧工具列表"}} \ No newline at end of file diff --git a/helper/vetur/tags.json b/helper/vetur/tags.json index b9760ee4ea..0b2ae0b4d2 100644 --- a/helper/vetur/tags.json +++ b/helper/vetur/tags.json @@ -1,649 +1 @@ -{ - "vxe-icon": { - "attributes": [ - "name", - "status", - "roll" - ], - "description": "图标" - }, - "vxe-table": { - "attributes": [ - "id", - "data", - "height", - "min-height", - "max-height", - "auto-resize", - "sync-resize", - "resizable", - "stripe", - "border", - "round", - "size", - "loading", - "align", - "header-align", - "footer-align", - "show-header", - "highlight-current-row", - "highlight-hover-row", - "highlight-current-column", - "highlight-hover-column", - "row-class-name", - "cell-class-name", - "header-row-class-name", - "header-cell-class-name", - "footer-row-class-name", - "footer-cell-class-name", - "cell-style", - "header-cell-style", - "footer-cell-style", - "row-style", - "header-row-style", - "footer-row-style", - "show-footer", - "footer-data", - "footer-method", - "merge-cells", - "merge-footer-items", - "span-method", - "footer-span-method", - "show-overflow", - "show-header-overflow", - "show-footer-overflow", - "column-key", - "row-key", - "row-id", - "keep-source", - "column-config", - "row-config", - "resize-config", - "resizable-config", - "seq-config", - "sort-config", - "filter-config", - "export-config", - "import-config", - "print-config", - "radio-config", - "checkbox-config", - "tooltip-config", - "expand-config", - "tree-config", - "menu-config", - "clip-config", - "fnr-config", - "mouse-config", - "area-config", - "keyboard-config", - "edit-config", - "valid-config", - "edit-rules", - "empty-text", - "empty-render", - "loading-config", - "custom-config", - "scroll-x", - "scroll-y", - "params" - ], - "subtags": [ - "vxe-colgroup", - "vxe-column" - ], - "description": "基础表格" - }, - "vxe-colgroup": { - "attributes": [ - "field", - "title", - "width", - "min-width", - "resizable", - "visible", - "fixed", - "align", - "header-align", - "show-overflow", - "show-header-overflow", - "header-class-name" - ], - "subtags": [ - "vxe-column" - ], - "description": "基础表格 - 分组列" - }, - "vxe-column": { - "attributes": [ - "type", - "field", - "title", - "width", - "min-width", - "resizable", - "visible", - "fixed", - "align", - "header-align", - "footer-align", - "show-overflow", - "show-header-overflow", - "show-footer-overflow", - "class-name", - "header-class-name", - "footer-class-name", - "formatter", - "sortable", - "sort-by", - "sort-type", - "filters", - "filter-multiple", - "filter-method", - "filter-reset-method", - "filter-recover-method", - "filter-render", - "header-export-method", - "export-method", - "footer-export-method", - "title-help", - "title-prefix", - "title-suffix", - "cell-type", - "cell-render", - "edit-render", - "content-render", - "tree-node", - "params", - "col-id" - ], - "description": "基础表格 - 列" - }, - "vxe-grid": { - "attributes": [ - "id", - "columns", - "data", - "height", - "min-height", - "max-height", - "auto-resize", - "sync-resize", - "resizable", - "stripe", - "border", - "round", - "size", - "loading", - "align", - "header-align", - "footer-align", - "show-header", - "highlight-current-row", - "highlight-hover-row", - "highlight-current-column", - "highlight-hover-column", - "row-class-name", - "cell-class-name", - "header-row-class-name", - "header-cell-class-name", - "footer-row-class-name", - "footer-cell-class-name", - "cell-style", - "header-cell-style", - "footer-cell-style", - "row-style", - "header-row-style", - "footer-row-style", - "show-footer", - "footer-data", - "footer-method", - "merge-cells", - "merge-footer-items", - "span-method", - "footer-span-method", - "show-overflow", - "show-header-overflow", - "show-footer-overflow", - "column-key", - "row-key", - "row-id", - "keep-source", - "column-config", - "row-config", - "resize-config", - "resizable-config", - "seq-config", - "sort-config", - "filter-config", - "export-config", - "import-config", - "print-config", - "radio-config", - "checkbox-config", - "tooltip-config", - "expand-config", - "tree-config", - "menu-config", - "clip-config", - "fnr-config", - "mouse-config", - "area-config", - "keyboard-config", - "edit-config", - "valid-config", - "edit-rules", - "empty-text", - "empty-render", - "loading-config", - "custom-config", - "scroll-x", - "scroll-y", - "params", - "form-config", - "toolbar-config", - "pager-config", - "proxy-config", - "zoom-config", - "layouts" - ], - "description": "配置式表格" - }, - "vxe-toolbar": { - "attributes": [ - "size", - "loading", - "perfect", - "class-name", - "import", - "export", - "print", - "refresh", - "custom", - "buttons", - "tools" - ], - "description": "工具栏" - }, - "vxe-pager": { - "attributes": [ - "size", - "loading", - "layouts", - "current-page", - "page-size", - "total", - "pager-count", - "page-sizes", - "align", - "border", - "background", - "perfect", - "class-name", - "auto-hidden", - "icon-prev-page", - "icon-jump-prev", - "icon-jump-next", - "iconnext-page", - "icon-jump-more" - ], - "description": "分页" - }, - "vxe-radio": { - "attributes": [ - "model-value", - "label", - "content", - "size", - "disabled", - "strict", - "name" - ], - "description": "单选框" - }, - "vxe-radio-group": { - "attributes": [ - "model-value", - "type", - "size", - "type", - "disabled", - "strict", - "options", - "option-props" - ], - "subtags": [ - "vxe-radio", - "vxe-radio-button" - ], - "description": "单选组" - }, - "vxe-radio-button": { - "attributes": [ - "model-value", - "label", - "content", - "disabled", - "strict" - ], - "description": "单选按钮" - }, - "vxe-checkbox": { - "attributes": [ - "model-value", - "label", - "content", - "size", - "disabled", - "title", - "indeterminate", - "checked-value", - "unchecked-value" - ], - "description": "复选框" - }, - "vxe-checkbox-group": { - "attributes": [ - "model-value", - "max", - "size", - "disabled", - "options", - "option-props" - ], - "subtags": [ - "vxe-checkbox" - ], - "description": "复选组" - }, - "vxe-switch": { - "attributes": [ - "model-value", - "disabled", - "size", - "open-label", - "close-label", - "open-value", - "close-value", - "open-icon", - "close-icon" - ], - "description": "开关按钮" - }, - "vxe-input": { - "attributes": [ - "model-value", - "size", - "type", - "name", - "form", - "clearable", - "placeholder", - "autocomplete", - "maxlength", - "multiple", - "readonly", - "disabled", - "class-name", - "prefix-icon", - "suffix-icon", - "min", - "max", - "step", - "digits", - "align", - "exponential", - "controls", - "show-word-count", - "count-method", - "start-date", - "end-date", - "start-week", - "start-day", - "select-day", - "label-format", - "value-format", - "editable", - "disabled-method", - "festival-method", - "transfer" - ], - "description": "输入框" - }, - "vxe-select": { - "attributes": [ - "model-value", - "max", - "size", - "multiple", - "multi-char-overflow", - "clearable", - "placeholder", - "class-name", - "popup-class-name", - "visible", - "disabled", - "prefix-icon", - "placement", - "options", - "option-props", - "option-groups", - "option-group-props", - "option-config", - "option-id", - "option-key", - "filterable", - "filter-method", - "transfer" - ], - "subtags": [ - "vxe-optgroup", - "vxe-option" - ], - "description": "下拉框" - }, - "vxe-optgroup": { - "attributes": [ - "label", - "visible", - "class-name", - "disabled" - ], - "subtags": [ - "vxe-option" - ], - "description": "下拉框 - 分组" - }, - "vxe-option": { - "attributes": [ - "value", - "label", - "visible", - "class-name", - "disabled" - ], - "description": "下拉框 - 选项" - }, - "vxe-button": { - "attributes": [ - "content", - "mode", - "title", - "type", - "size", - "name", - "icon", - "round", - "circle", - "status", - "disabled", - "class-name", - "popup-class-name", - "loading", - "placement", - "destroy-on-close", - "transfer" - ], - "description": "按钮" - }, - "vxe-button-group": { - "attributes": [ - "mode", - "size", - "status", - "round", - "circle", - "disabled", - "class-name", - "options" - ], - "description": "按钮组" - }, - "vxe-tooltip": { - "attributes": [ - "model-value", - "content", - "trigger", - "theme", - "popup-class-name", - "z-index", - "is-arrow", - "enterable", - "enter-delay", - "leavedelay" - ], - "description": "工具提示" - }, - "vxe-modal": { - "attributes": [ - "model-value", - "size", - "loading", - "id", - "title", - "type", - "status", - "class-name", - "icon-status", - "content", - "message", - "cancel-button-text", - "confirm-button-text", - "show-header", - "show-footer", - "lock-view", - "lock-scroll", - "mask", - "mask-closable", - "esc-closable", - "show-zoom", - "show-close", - "resize", - "margin-size", - "duration", - "width", - "height", - "min-width", - "min-height", - "top", - "position", - "z-index", - "show-title-overflow", - "transfer", - "fullscreen", - "draggable", - "dblclick-zoom", - "remember", - "destroy-on-close", - "storage", - "before-hide-method" - ], - "description": "弹窗" - }, - "vxe-form": { - "attributes": [ - "data", - "loading", - "span", - "align", - "size", - "title-align", - "title-width", - "title-colon", - "title-asterisk", - "title-overflow", - "vertical", - "class-name", - "collapse-status", - "custom-layout", - "items", - "rules", - "prevent-submit", - "valid-config" - ], - "subtags": [ - "vxe-form-item" - ], - "description": "表单" - }, - "vxe-form-item": { - "attributes": [ - "field", - "title", - "span", - "align", - "title-align", - "title-width", - "title-colon", - "title-asterisk", - "title-overflow", - "show-title", - "vertical", - "class-name", - "content-class-name", - "content-style", - "visible", - "visible-method", - "folding", - "collapse-node", - "title-prefix", - "title-suffix", - "reset-value", - "item-render" - ], - "description": "表单 - 项" - }, - "vxe-form-gather": { - "attributes": [ - "span", - "class-name" - ], - "description": "表单 - 项集合" - }, - "vxe-list": { - "attributes": [ - "data", - "size", - "loading", - "height", - "class-name", - "auto-resize", - "sync-resize", - "scroll-y" - ], - "description": "列表" - }, - "vxe-pulldown": { - "attributes": [ - "model-value", - "size", - "class-name", - "popup-class-name", - "disabled", - "placement", - "destroy-on-close", - "transfer" - ], - "description": "下拉容器" - } -} \ No newline at end of file +{"vxe-table":{"attributes":["id","data","height","min-height","max-height","auto-resize","sync-resize","resizable","stripe","border","round","size","loading","align","header-align","footer-align","show-header","highlight-current-row","highlight-hover-row","highlight-current-column","highlight-hover-column","row-class-name","cell-class-name","header-row-class-name","header-cell-class-name","footer-row-class-name","footer-cell-class-name","cell-style","header-cell-style","footer-cell-style","row-style","header-row-style","footer-row-style","show-footer","footer-data","footer-method","merge-cells","merge-footer-items","span-method","footer-span-method","show-overflow","show-header-overflow","show-footer-overflow","column-key","row-key","row-id","keep-source","column-config","row-config","resize-config","resizable-config","seq-config","sort-config","filter-config","export-config","import-config","print-config","radio-config","checkbox-config","tooltip-config","expand-config","tree-config","menu-config","clip-config","fnr-config","mouse-config","area-config","keyboard-config","edit-config","valid-config","edit-rules","empty-text","empty-render","loading-config","custom-config","scroll-x","scroll-y","params"],"subtags":["vxe-colgroup","vxe-column"],"description":"基础表格"},"vxe-colgroup":{"attributes":["field","title","width","min-width","resizable","visible","fixed","align","header-align","show-overflow","show-header-overflow","header-class-name"],"subtags":["vxe-column"],"description":"基础表格 - 分组列"},"vxe-column":{"attributes":["type","field","title","width","min-width","resizable","visible","fixed","align","header-align","footer-align","show-overflow","show-header-overflow","show-footer-overflow","class-name","header-class-name","footer-class-name","formatter","sortable","sort-by","sort-type","filters","filter-multiple","filter-method","filter-reset-method","filter-recover-method","filter-render","header-export-method","export-method","footer-export-method","title-help","title-prefix","title-suffix","cell-type","cell-render","edit-render","content-render","tree-node","params","col-id"],"description":"基础表格 - 列"},"vxe-grid":{"attributes":["id","columns","data","height","min-height","max-height","auto-resize","sync-resize","resizable","stripe","border","round","size","loading","align","header-align","footer-align","show-header","highlight-current-row","highlight-hover-row","highlight-current-column","highlight-hover-column","row-class-name","cell-class-name","header-row-class-name","header-cell-class-name","footer-row-class-name","footer-cell-class-name","cell-style","header-cell-style","footer-cell-style","row-style","header-row-style","footer-row-style","show-footer","footer-data","footer-method","merge-cells","merge-footer-items","span-method","footer-span-method","show-overflow","show-header-overflow","show-footer-overflow","column-key","row-key","row-id","keep-source","column-config","row-config","resize-config","resizable-config","seq-config","sort-config","filter-config","export-config","import-config","print-config","radio-config","checkbox-config","tooltip-config","expand-config","tree-config","menu-config","clip-config","fnr-config","mouse-config","area-config","keyboard-config","edit-config","valid-config","edit-rules","empty-text","empty-render","loading-config","custom-config","scroll-x","scroll-y","params","form-config","toolbar-config","pager-config","proxy-config","zoom-config","layouts"],"description":"配置式表格"},"vxe-toolbar":{"attributes":["size","loading","class-name","import","export","print","refresh","custom","buttons","tools"],"description":"工具栏"}} \ No newline at end of file diff --git a/index.ts b/index.ts index 7babc1c934..58ce288d26 100644 --- a/index.ts +++ b/index.ts @@ -1,5 +1,5 @@ -import * as VXETableExport from './packages/all' -import './styles/index.scss' +import * as VxeTableExport from './packages/components' +import './styles/all.scss' -export * from './packages/all' -export default VXETableExport +export * from './packages/components' +export default VxeTableExport diff --git a/package.json b/package.json index 12351a97be..91d81a3bd3 100644 --- a/package.json +++ b/package.json @@ -13,13 +13,13 @@ "format": "eslint --fix examples/**/*.{js,ts,vue}" }, "files": [ - "es", "lib", + "es", + "src", + "helper", "types", - "packages", "styles", - "helper", - "scripts", + "packages", "CHANGELOG.md" ], "main": "lib/index.common.js", @@ -28,10 +28,6 @@ "jsdelivr": "lib/index.umd.js", "style": "lib/style.css", "typings": "types/index.d.ts", - "dependencies": { - "dom-zindex": "^1.0.2", - "xe-utils": "^3.5.26" - }, "devDependencies": { "@types/resize-observer-browser": "^0.1.11", "@typescript-eslint/eslint-plugin": "^6.21.0", @@ -66,13 +62,9 @@ "sass": "^1.75.0", "sass-loader": "^14.2.0", "typescript": "~4.5.5", - "vue": "3.3.13", - "vue-i18n": "^9.13.1", - "vue-router": "^4.3.2", - "vuex": "^4.1.0" - }, - "peerDependencies": { - "vue": "^3.2.28" + "vxe-pc-ui": "^4.0.0", + "vue": "3.4.27", + "vue-router": "^4.3.2" }, "vetur": { "tags": "helper/vetur/tags.json", @@ -83,10 +75,9 @@ "url": "git+https://github.com/WHIPLASHCZ/vxe-table-fix-checkbox.git" }, "keywords": [ - "vxe-table", - "vxe-grid", - "vue table", - "vue grid" + "vxe", + "vxe-ui", + "vxe-table" ], "author": { "name": "Xu Liangzhan", @@ -95,6 +86,5 @@ "license": "MIT", "bugs": { "url": "https://github.com/x-extends/vxe-table/issues" - }, - "homepage": "https://vxetable.cn/" + } } diff --git a/packages/all.ts b/packages/all.ts deleted file mode 100644 index 9cbc79735e..0000000000 --- a/packages/all.ts +++ /dev/null @@ -1,144 +0,0 @@ -import { App } from 'vue' -import XEUtils from 'xe-utils' -import { setConfig } from './v-x-e-table' -import { setTheme } from './v-x-e-table/src/theme' - -import { VxeTableFilterModule } from './filter' -import { VxeTableMenuModule } from './menu' -import { VxeTableEditModule } from './edit' -import { VxeTableExportModule } from './export' -import { VxeTableKeyboardModule } from './keyboard' -import { VxeTableValidatorModule } from './validator' -import { VxeTableCustomModule } from './custom' - -import { VxeIcon } from './icon' -import { VxeColumn } from './column' -import { VxeColgroup } from './colgroup' -import { VxeGrid } from './grid' -import { VxeToolbar } from './toolbar' -import { VxePager } from './pager' -import { VxeCheckbox } from './checkbox' -import { VxeCheckboxGroup } from './checkbox-group' -import { VxeRadio } from './radio' -import { VxeRadioGroup } from './radio-group' -import { VxeRadioButton } from './radio-button' -import { VxeInput } from './input' -import { VxeTextarea } from './textarea' -import { VxeButton } from './button' -import { VxeButtonGroup } from './button-group' -import { VxeModal } from './modal' -import { VxeDrawer } from './drawer' -import { VxeTooltip } from './tooltip' -import { VxeForm } from './form' -import { VxeFormItem } from './form-item' -import { VxeFormGather } from './form-gather' -import { VxeSelect } from './select' -import { VxeOptgroup } from './optgroup' -import { VxeOption } from './option' -import { VxeSwitch } from './switch' -import { VxeList } from './list' -import { VxePulldown } from './pulldown' -import { VxeTable } from './table' - -import zhCN from './locale/lang/zh-CN' - -// 按需加载的组件 -const components = [ - // 功能模块 - VxeTableFilterModule, - VxeTableMenuModule, - VxeTableEditModule, - VxeTableExportModule, - VxeTableKeyboardModule, - VxeTableValidatorModule, - VxeTableCustomModule, - - // 可选组件 - VxeIcon, - VxeColumn, - VxeColgroup, - VxeGrid, - VxeToolbar, - VxePager, - VxeCheckbox, - VxeCheckboxGroup, - VxeRadio, - VxeRadioGroup, - VxeRadioButton, - VxeInput, - VxeTextarea, - VxeButton, - VxeButtonGroup, - VxeModal, - VxeDrawer, - VxeTooltip, - VxeForm, - VxeFormItem, - VxeFormGather, - VxeSelect, - VxeOptgroup, - VxeOption, - VxeSwitch, - VxeList, - VxePulldown, - - // 核心 - VxeTable -] - -// 默认中文 -setConfig({ - i18n: (key: string, args: any) => XEUtils.toFormatString(XEUtils.get(zhCN, key), args) -}) - -// 默认安装 -export function install (app: App, options: any) { - if (XEUtils.isPlainObject(options)) { - setConfig(options) - if ((options as any).theme) { - setTheme(options) - } - } - components.forEach(component => component.install(app)) -} - -export * from './v-x-e-table' - -// Table module -export * from './filter' -export * from './menu' -export * from './edit' -export * from './export' -export * from './keyboard' -export * from './validator' -export * from './custom' - -// Components -export * from './icon' -export * from './table' -export * from './column' -export * from './colgroup' -export * from './grid' -export * from './toolbar' -export * from './pager' -export * from './checkbox' -export * from './checkbox-group' -export * from './radio' -export * from './radio-group' -export * from './radio-button' -export * from './input' -export * from './textarea' -export * from './button' -export * from './button-group' -export * from './modal' -export * from './drawer' -export * from './tooltip' -export * from './form' -export * from './form-item' -export * from './form-gather' -export * from './select' -export * from './optgroup' -export * from './option' -export * from './switch' -export * from './list' -export * from './pulldown' diff --git a/packages/button-group/index.d.ts b/packages/button-group/index.d.ts deleted file mode 100644 index 41563babe4..0000000000 --- a/packages/button-group/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeButtonGroup } from '../../types/button-group' - -export * from '../../types/button-group' -export default VxeButtonGroup diff --git a/packages/button-group/index.ts b/packages/button-group/index.ts deleted file mode 100644 index ef0f08ba06..0000000000 --- a/packages/button-group/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeButtonGroupComponent from '../button/src/group' -import { dynamicApp } from '../dynamics' - -export const VxeButtonGroup = Object.assign(VxeButtonGroupComponent, { - install (app: App) { - app.component(VxeButtonGroupComponent.name, VxeButtonGroupComponent) - } -}) - -export const ButtonGroup = VxeButtonGroup - -dynamicApp.component(VxeButtonGroupComponent.name, VxeButtonGroupComponent) - -export default VxeButtonGroup diff --git a/packages/button/index.d.ts b/packages/button/index.d.ts deleted file mode 100644 index 636eeb8c04..0000000000 --- a/packages/button/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeButton } from '../../types/button' - -export * from '../../types/button' -export default VxeButton diff --git a/packages/button/index.ts b/packages/button/index.ts deleted file mode 100644 index c957f5779e..0000000000 --- a/packages/button/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeButtonComponent from './src/button' -import { dynamicApp } from '../dynamics' - -export const VxeButton = Object.assign(VxeButtonComponent, { - install (app: App) { - app.component(VxeButtonComponent.name, VxeButtonComponent) - } -}) - -export const Button = VxeButton - -dynamicApp.component(VxeButtonComponent.name, VxeButtonComponent) - -export default VxeButton diff --git a/packages/button/src/button.ts b/packages/button/src/button.ts deleted file mode 100644 index f4c17a1039..0000000000 --- a/packages/button/src/button.ts +++ /dev/null @@ -1,523 +0,0 @@ -import { defineComponent, h, ref, Ref, computed, Teleport, VNode, onUnmounted, reactive, nextTick, PropType, onMounted, inject } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' -import { getAbsolutePos, getEventTargetNode } from '../../tools/dom' -import { getFuncText, getLastZIndex, nextZIndex } from '../../tools/utils' -import { GlobalEvent } from '../../tools/event' -// import { warnLog } from '../../tools/log' - -import { VxeButtonConstructor, VxeButtonPropTypes, VxeButtonEmits, ButtonReactData, ButtonMethods, ButtonPrivateRef, ButtonInternalData, VxeButtonGroupConstructor, VxeButtonGroupPrivateMethods } from '../../../types/all' - -export default defineComponent({ - name: 'VxeButton', - props: { - /** - * 按钮类型 - */ - type: String as PropType, - mode: String as PropType, - className: [String, Function] as PropType, - popupClassName: [String, Function] as PropType, - /** - * 按钮尺寸 - */ - size: { type: String as PropType, default: () => GlobalConfig.button.size || GlobalConfig.size }, - /** - * 用来标识这一项 - */ - name: [String, Number] as PropType, - /** - * 按钮内容 - */ - content: String as PropType, - /** - * 固定显示下拉面板的方向 - */ - placement: String as PropType, - /** - * 按钮状态 - */ - status: String as PropType, - /** - * 标题 - */ - title: String as PropType, - /** - * 按钮的图标 - */ - icon: String as PropType, - /** - * 圆角边框 - */ - round: Boolean as PropType, - /** - * 圆角按钮 - */ - circle: Boolean as PropType, - /** - * 是否禁用 - */ - disabled: Boolean as PropType, - /** - * 是否加载中 - */ - loading: Boolean as PropType, - /** - * 在下拉面板关闭时销毁内容 - */ - destroyOnClose: Boolean as PropType, - /** - * 是否将弹框容器插入于 body 内 - */ - transfer: { type: Boolean as PropType, default: () => GlobalConfig.button.transfer } - }, - emits: [ - 'click', - 'mouseenter', - 'mouseleave', - 'dropdown-click' - ] as VxeButtonEmits, - setup (props, context) { - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - inited: false, - showPanel: false, - animatVisible: false, - panelIndex: 0, - panelStyle: {}, - panelPlacement: '' - }) - - const internalData: ButtonInternalData = { - showTime: null - } - - const refElem = ref() as Ref - const refButton = ref() as Ref - const refBtnPanel = ref() as Ref - - const refMaps: ButtonPrivateRef = { - refElem - } - - const $xebutton = { - xID, - props, - context, - reactData, - internalData, - getRefMaps: () => refMaps - } as unknown as VxeButtonConstructor - - const $xebuttonggroup = inject('$xebuttongroup', null as (VxeButtonGroupConstructor & VxeButtonGroupPrivateMethods) | null) - - let buttonMethods = {} as ButtonMethods - - const computeIsFormBtn = computed(() => { - const { type } = props - if (type) { - return ['submit', 'reset', 'button'].indexOf(type) > -1 - } - return false - }) - - const computeBtnMode = computed(() => { - const { type, mode } = props - if (mode === 'text' || type === 'text' || ($xebuttonggroup && $xebuttonggroup.props.mode === 'text')) { - return 'text' - } - return 'button' - }) - - const computeBtnStatus = computed(() => { - const { status } = props - if (status) { - return status - } - if ($xebuttonggroup) { - return $xebuttonggroup.props.status - } - return '' - }) - - const computeBtnRound = computed(() => { - const { round } = props - if (round) { - return round - } - if ($xebuttonggroup) { - return $xebuttonggroup.props.round - } - return false - }) - - const computeBtnCircle = computed(() => { - const { circle } = props - if (circle) { - return circle - } - if ($xebuttonggroup) { - return $xebuttonggroup.props.circle - } - return false - }) - - const updateZindex = () => { - if (reactData.panelIndex < getLastZIndex()) { - reactData.panelIndex = nextZIndex() - } - } - - const updatePlacement = () => { - return nextTick().then(() => { - const { transfer, placement } = props - const { panelIndex } = reactData - const targetElem = refButton.value - const panelElem = refBtnPanel.value - if (panelElem && targetElem) { - const targetHeight = targetElem.offsetHeight - const targetWidth = targetElem.offsetWidth - const panelHeight = panelElem.offsetHeight - const panelWidth = panelElem.offsetWidth - const marginSize = 5 - const panelStyle: { [key: string]: string | number } = { - zIndex: panelIndex - } - const { top, left, boundingTop, visibleHeight, visibleWidth } = getAbsolutePos(targetElem) - let panelPlacement = 'bottom' - if (transfer) { - let btnLeft = left + targetWidth - panelWidth - let btnTop = top + targetHeight - if (placement === 'top') { - panelPlacement = 'top' - btnTop = top - panelHeight - } else if (!placement) { - // 如果下面不够放，则向上 - if (boundingTop + targetHeight + panelHeight + marginSize > visibleHeight) { - panelPlacement = 'top' - btnTop = top - panelHeight - } - // 如果上面不够放，则向下（优先） - if (btnTop < marginSize) { - panelPlacement = 'bottom' - btnTop = top + targetHeight - } - } - // 如果溢出右边 - if (btnLeft + panelWidth + marginSize > visibleWidth) { - btnLeft -= btnLeft + panelWidth + marginSize - visibleWidth - } - // 如果溢出左边 - if (btnLeft < marginSize) { - btnLeft = marginSize - } - Object.assign(panelStyle, { - left: `${btnLeft}px`, - right: 'auto', - top: `${btnTop}px`, - minWidth: `${targetWidth}px` - }) - } else { - if (placement === 'top') { - panelPlacement = 'top' - panelStyle.bottom = `${targetHeight}px` - } else if (!placement) { - // 如果下面不够放，则向上 - if (boundingTop + targetHeight + panelHeight > visibleHeight) { - // 如果上面不够放，则向下（优先） - if (boundingTop - targetHeight - panelHeight > marginSize) { - panelPlacement = 'top' - panelStyle.bottom = `${targetHeight}px` - } - } - } - } - reactData.panelStyle = panelStyle - reactData.panelPlacement = panelPlacement - return nextTick() - } - }) - } - - const clickEvent = (evnt: Event) => { - if ($xebuttonggroup) { - $xebuttonggroup.handleClick({ name: props.name as string }, evnt) - } else { - buttonMethods.dispatchEvent('click', { $event: evnt }, evnt) - } - } - - const mousedownDropdownEvent = (evnt: MouseEvent) => { - const isLeftBtn = evnt.button === 0 - if (isLeftBtn) { - evnt.stopPropagation() - } - } - - const clickDropdownEvent = (evnt: Event) => { - const dropdownElem = evnt.currentTarget - const panelElem = refBtnPanel.value - const { flag, targetElem } = getEventTargetNode(evnt, dropdownElem, 'vxe-button') - if (flag) { - if (panelElem) { - panelElem.dataset.active = 'N' - } - reactData.showPanel = false - setTimeout(() => { - if (!panelElem || panelElem.dataset.active !== 'Y') { - reactData.animatVisible = false - } - }, 350) - buttonMethods.dispatchEvent('dropdown-click', { name: targetElem.getAttribute('name'), $event: evnt }, evnt) - } - } - - const mouseenterDropdownEvent = () => { - const panelElem = refBtnPanel.value - if (panelElem) { - panelElem.dataset.active = 'Y' - reactData.animatVisible = true - setTimeout(() => { - if (panelElem.dataset.active === 'Y') { - reactData.showPanel = true - updateZindex() - updatePlacement() - setTimeout(() => { - if (reactData.showPanel) { - updatePlacement() - } - }, 50) - } - }, 20) - } - } - - const mouseenterTargetEvent = (evnt: MouseEvent) => { - const panelElem = refBtnPanel.value - if (panelElem) { - panelElem.dataset.active = 'Y' - if (!reactData.inited) { - reactData.inited = true - } - internalData.showTime = setTimeout(() => { - if (panelElem.dataset.active === 'Y') { - mouseenterDropdownEvent() - } else { - reactData.animatVisible = false - } - }, 250) - } - mouseenterEvent(evnt) - } - - const mouseleaveTargetEvent = (evnt: MouseEvent) => { - closePanel() - mouseleaveEvent(evnt) - } - - const mouseenterEvent = (evnt: MouseEvent) => { - emit('mouseenter', { $event: evnt }) - } - - const mouseleaveEvent = (evnt: MouseEvent) => { - emit('mouseleave', { $event: evnt }) - } - - const closePanel = () => { - const panelElem = refBtnPanel.value - clearTimeout(internalData.showTime) - if (panelElem) { - panelElem.dataset.active = 'N' - setTimeout(() => { - if (panelElem.dataset.active !== 'Y') { - reactData.showPanel = false - setTimeout(() => { - if (panelElem.dataset.active !== 'Y') { - reactData.animatVisible = false - } - }, 350) - } - }, 100) - } else { - reactData.animatVisible = false - reactData.showPanel = false - } - } - - const mouseleaveDropdownEvent = () => { - closePanel() - } - - const renderContent = () => { - const { content, icon, loading } = props - const contVNs: VNode[] = [] - if (loading) { - contVNs.push( - h('i', { - class: ['vxe-button--loading-icon', GlobalConfig.icon.BUTTON_LOADING] - }) - ) - } else if (slots.icon) { - contVNs.push( - h('span', { - class: 'vxe-button--custom-icon' - }, slots.icon({})) - ) - } else if (icon) { - contVNs.push( - h('i', { - class: ['vxe-button--icon', icon] - }) - ) - } - if (slots.default) { - contVNs.push( - h('span', { - class: 'vxe-button--content' - }, slots.default({})) - ) - } else if (content) { - contVNs.push( - h('span', { - class: 'vxe-button--content' - }, getFuncText(content)) - ) - } - return contVNs - } - - buttonMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $button: $xebutton, $event: evnt }, params)) - }, - focus () { - const btnElem = refButton.value - btnElem.focus() - return nextTick() - }, - blur () { - const btnElem = refButton.value - btnElem.blur() - return nextTick() - } - } - - Object.assign($xebutton, buttonMethods) - - onMounted(() => { - // if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - // if (props.type === 'text') { - // warnLog('vxe.error.delProp', ['type=text', 'mode=text']) - // } - // } - - GlobalEvent.on($xebutton, 'mousewheel', (evnt: Event) => { - const panelElem = refBtnPanel.value - if (reactData.showPanel && !getEventTargetNode(evnt, panelElem).flag) { - closePanel() - } - }) - }) - - onUnmounted(() => { - GlobalEvent.off($xebutton, 'mousewheel') - }) - - const renderVN = () => { - const { className, popupClassName, transfer, title, type, destroyOnClose, name, disabled, loading } = props - const { inited, showPanel } = reactData - const isFormBtn = computeIsFormBtn.value - const btnMode = computeBtnMode.value - const btnStatus = computeBtnStatus.value - const btnRound = computeBtnRound.value - const btnCircle = computeBtnCircle.value - const vSize = computeSize.value - if (slots.dropdowns) { - return h('div', { - ref: refElem, - class: ['vxe-button--dropdown', className ? (XEUtils.isFunction(className) ? className({ $button: $xebutton }) : className) : '', { - [`size--${vSize}`]: vSize, - 'is--active': showPanel - }] - }, [ - h('button', { - ref: refButton, - class: ['vxe-button', `type--${btnMode}`, { - [`size--${vSize}`]: vSize, - [`theme--${btnStatus}`]: btnStatus, - 'is--round': btnRound, - 'is--circle': btnCircle, - 'is--disabled': disabled || loading, - 'is--loading': loading - }], - title, - name, - type: isFormBtn ? type : 'button', - disabled: disabled || loading, - onMouseenter: mouseenterTargetEvent, - onMouseleave: mouseleaveTargetEvent, - onClick: clickEvent - }, renderContent().concat([ - h('i', { - class: `vxe-button--dropdown-arrow ${GlobalConfig.icon.BUTTON_DROPDOWN}` - }) - ])), - h(Teleport, { - to: 'body', - disabled: transfer ? !inited : true - }, [ - h('div', { - ref: refBtnPanel, - class: ['vxe-button--dropdown-panel', popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $button: $xebutton }) : popupClassName) : '', { - [`size--${vSize}`]: vSize, - 'animat--leave': reactData.animatVisible, - 'animat--enter': showPanel - }], - placement: reactData.panelPlacement, - style: reactData.panelStyle - }, inited ? [ - h('div', { - class: 'vxe-button--dropdown-wrapper', - onMousedown: mousedownDropdownEvent, - onClick: clickDropdownEvent, - onMouseenter: mouseenterDropdownEvent, - onMouseleave: mouseleaveDropdownEvent - }, destroyOnClose && !showPanel ? [] : slots.dropdowns({})) - ] : []) - ]) - ]) - } - return h('button', { - ref: refButton, - class: ['vxe-button', `type--${btnMode}`, className ? (XEUtils.isFunction(className) ? className({ $button: $xebutton }) : className) : '', { - [`size--${vSize}`]: vSize, - [`theme--${btnStatus}`]: btnStatus, - 'is--round': btnRound, - 'is--circle': btnCircle, - 'is--disabled': disabled || loading, - 'is--loading': loading - }], - title, - name, - type: isFormBtn ? type : 'button', - disabled: disabled || loading, - onClick: clickEvent, - onMouseenter: mouseenterEvent, - onMouseleave: mouseleaveEvent - }, renderContent()) - } - - $xebutton.renderVN = renderVN - - return $xebutton - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/button/src/group.ts b/packages/button/src/group.ts deleted file mode 100644 index fe42f259c1..0000000000 --- a/packages/button/src/group.ts +++ /dev/null @@ -1,77 +0,0 @@ -import { defineComponent, h, provide, PropType } from 'vue' -import GlobalConfig from '../../v-x-e-table/src/conf' -import XEUtils from 'xe-utils' -import VxeButtonComponent from './button' -import { useSize } from '../../hooks/size' - -import { VxeButtonGroupPropTypes, VxeButtonGroupEmits, VxeButtonGroupConstructor, VxeButtonGroupPrivateMethods, ButtonGroupMethods, ButtonPrivateComputed, ButtonGroupPrivateMethods } from '../../../types/all' - -export default defineComponent({ - name: 'VxeButtonGroup', - props: { - options: Array as PropType, - mode: String as PropType, - status: String as PropType, - round: Boolean as PropType, - circle: Boolean as PropType, - className: [String, Function] as PropType, - disabled: Boolean as PropType, - size: { type: String as PropType, default: () => GlobalConfig.buttonGroup.size || GlobalConfig.size } - }, - emits: [ - 'click' - ] as VxeButtonGroupEmits, - setup (props, context) { - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeMaps: ButtonPrivateComputed = {} - - const $xebuttongroup = { - xID, - props, - context, - - getComputeMaps: () => computeMaps - } as unknown as VxeButtonGroupConstructor & VxeButtonGroupPrivateMethods - - useSize(props) - - const buttonGroupMethods: ButtonGroupMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $buttonGroup: $xebuttongroup, $event: evnt }, params)) - } - } - - const buttonGroupPrivateMethods: ButtonGroupPrivateMethods = { - handleClick (params, evnt) { - const { options } = props - const { name } = params - const option = options ? options.find(item => item.name === name) : null - buttonGroupMethods.dispatchEvent('click', { ...params, option }, evnt) - } - } - - Object.assign($xebuttongroup, buttonGroupMethods, buttonGroupPrivateMethods) - - const renderVN = () => { - const { className, options } = props - const defaultSlot = slots.default - return h('div', { - class: ['vxe-button-group', className ? (XEUtils.isFunction(className) ? className({ $buttonGroup: $xebuttongroup }) : className) : ''] - }, defaultSlot ? defaultSlot({}) : (options ? options.map((item, index) => { - return h(VxeButtonComponent, { - key: index, - ...item - }) - }) : [])) - } - - $xebuttongroup.renderVN = renderVN - - provide('$xebuttongroup', $xebuttongroup) - - return renderVN - } -}) diff --git a/packages/checkbox-group/index.d.ts b/packages/checkbox-group/index.d.ts deleted file mode 100644 index 54f651f2a9..0000000000 --- a/packages/checkbox-group/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeCheckboxGroup } from '../../types/checkbox-group' - -export * from '../../types/checkbox-group' -export default VxeCheckboxGroup diff --git a/packages/checkbox-group/index.ts b/packages/checkbox-group/index.ts deleted file mode 100644 index e150bf68ae..0000000000 --- a/packages/checkbox-group/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeCheckboxGroupComponent from '../checkbox/src/group' -import { dynamicApp } from '../dynamics' - -export const VxeCheckboxGroup = Object.assign(VxeCheckboxGroupComponent, { - install (app: App) { - app.component(VxeCheckboxGroupComponent.name, VxeCheckboxGroupComponent) - } -}) - -export const CheckboxGroup = VxeCheckboxGroup - -dynamicApp.component(VxeCheckboxGroupComponent.name, VxeCheckboxGroupComponent) - -export default VxeCheckboxGroup diff --git a/packages/checkbox/index.d.ts b/packages/checkbox/index.d.ts deleted file mode 100644 index 1bd426921a..0000000000 --- a/packages/checkbox/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeCheckbox } from '../../types/checkbox' - -export * from '../../types/checkbox' -export default VxeCheckbox diff --git a/packages/checkbox/index.ts b/packages/checkbox/index.ts deleted file mode 100644 index 21bec87e15..0000000000 --- a/packages/checkbox/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeCheckboxComponent from './src/checkbox' -import { dynamicApp } from '../dynamics' - -export const VxeCheckbox = Object.assign(VxeCheckboxComponent, { - install (app: App) { - app.component(VxeCheckboxComponent.name, VxeCheckboxComponent) - } -}) - -export const Checkbox = VxeCheckbox - -dynamicApp.component(VxeCheckboxComponent.name, VxeCheckboxComponent) - -export default VxeCheckbox diff --git a/packages/checkbox/src/checkbox.ts b/packages/checkbox/src/checkbox.ts deleted file mode 100644 index 0a7d264447..0000000000 --- a/packages/checkbox/src/checkbox.ts +++ /dev/null @@ -1,131 +0,0 @@ -import { defineComponent, h, computed, inject, PropType } from 'vue' -import XEUtils from 'xe-utils' -import { getFuncText } from '../../tools/utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' - -import { VxeCheckboxConstructor, VxeCheckboxGroupConstructor, VxeCheckboxEmits, VxeCheckboxGroupPrivateMethods, CheckboxMethods, VxeCheckboxPropTypes, VxeFormConstructor, VxeFormPrivateMethods, VxeFormDefines } from '../../../types/all' - -export default defineComponent({ - name: 'VxeCheckbox', - props: { - modelValue: [String, Number, Boolean] as PropType, - label: { type: [String, Number] as PropType, default: null }, - indeterminate: Boolean as PropType, - title: [String, Number] as PropType, - checkedValue: { type: [String, Number, Boolean] as PropType, default: true }, - uncheckedValue: { type: [String, Number, Boolean] as PropType, default: false }, - content: [String, Number] as PropType, - disabled: Boolean as PropType, - size: { type: String as PropType, default: () => GlobalConfig.checkbox.size || GlobalConfig.size } - }, - emits: [ - 'update:modelValue', - 'change' - ] as VxeCheckboxEmits, - setup (props, context) { - const { slots, emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const $xecheckbox = { - xID, - props, - context - } as unknown as VxeCheckboxConstructor - - let checkboxMethods = {} as CheckboxMethods - - const computeSize = useSize(props) - - const $xecheckboxgroup = inject('$xecheckboxgroup', null as (VxeCheckboxGroupConstructor & VxeCheckboxGroupPrivateMethods) | null) - - const computeIsChecked = computed(() => { - if ($xecheckboxgroup) { - return XEUtils.includes($xecheckboxgroup.props.modelValue, props.label) - } - return props.modelValue === props.checkedValue - }) - - const computeIsDisabled = computed(() => { - if (props.disabled) { - return true - } - if ($xecheckboxgroup) { - const { props: groupProps } = $xecheckboxgroup - const { computeIsMaximize } = $xecheckboxgroup.getComputeMaps() - const isMaximize = computeIsMaximize.value - const isChecked = computeIsChecked.value - return groupProps.disabled || (isMaximize && !isChecked) - } - return false - }) - - const changeEvent = (evnt: Event & { target: { checked: boolean } }) => { - const { checkedValue, uncheckedValue } = props - const isDisabled = computeIsDisabled.value - if (!isDisabled) { - const checked = evnt.target.checked - const value = checked ? checkedValue : uncheckedValue - const params = { checked, value, label: props.label } - if ($xecheckboxgroup) { - $xecheckboxgroup.handleChecked(params, evnt) - } else { - emit('update:modelValue', value) - checkboxMethods.dispatchEvent('change', params, evnt) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, value) - } - } - } - } - - checkboxMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $checkbox: $xecheckbox, $event: evnt }, params)) - } - } - - Object.assign($xecheckbox, checkboxMethods) - - const renderVN = () => { - const vSize = computeSize.value - const isDisabled = computeIsDisabled.value - const isChecked = computeIsChecked.value - const indeterminate = props.indeterminate - return h('label', { - class: ['vxe-checkbox', { - [`size--${vSize}`]: vSize, - 'is--indeterminate': indeterminate, - 'is--disabled': isDisabled, - 'is--checked': isChecked - }], - title: props.title - }, [ - h('input', { - class: 'vxe-checkbox--input', - type: 'checkbox', - disabled: isDisabled, - checked: isChecked, - onChange: changeEvent - }), - h('span', { - class: ['vxe-checkbox--icon', indeterminate ? 'vxe-icon-checkbox-indeterminate' : (isChecked ? 'vxe-icon-checkbox-checked' : 'vxe-icon-checkbox-unchecked')] - }), - h('span', { - class: 'vxe-checkbox--label' - }, slots.default ? slots.default({}) : getFuncText(props.content)) - ]) - } - - $xecheckbox.renderVN = renderVN - - return $xecheckbox - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/checkbox/src/group.ts b/packages/checkbox/src/group.ts deleted file mode 100644 index bbbca6366f..0000000000 --- a/packages/checkbox/src/group.ts +++ /dev/null @@ -1,123 +0,0 @@ -import { defineComponent, h, provide, PropType, computed, inject } from 'vue' -import GlobalConfig from '../../v-x-e-table/src/conf' -import XEUtils from 'xe-utils' -import VxeCheckboxComponent from './checkbox' -import { useSize } from '../../hooks/size' - -import { VxeCheckboxGroupConstructor, VxeCheckboxGroupEmits, VxeCheckboxGroupPrivateMethods, CheckboxGroupPrivateMethods, CheckboxPrivateComputed, CheckboxGroupMethods, VxeCheckboxGroupPropTypes, VxeFormConstructor, VxeFormPrivateMethods, VxeFormDefines } from '../../../types/all' - -export default defineComponent({ - name: 'VxeCheckboxGroup', - props: { - modelValue: Array as PropType, - options: Array as PropType, - optionProps: Object as PropType, - disabled: Boolean as PropType, - max: { type: [String, Number] as PropType, default: null }, - size: { type: String as PropType, default: () => GlobalConfig.checkboxGroup.size || GlobalConfig.size } - }, - emits: [ - 'update:modelValue', - 'change' - ] as VxeCheckboxGroupEmits, - setup (props, context) { - const { slots, emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const computeIsMaximize = computed(() => { - const { modelValue, max } = props - if (max) { - return (modelValue ? modelValue.length : 0) >= XEUtils.toNumber(max) - } - return false - }) - - const computePropsOpts = computed(() => { - return props.optionProps || {} - }) - - const computeLabelField = computed(() => { - const propsOpts = computePropsOpts.value - return propsOpts.label || 'label' - }) - - const computeValueField = computed(() => { - const propsOpts = computePropsOpts.value - return propsOpts.value || 'value' - }) - - const computeDisabledField = computed(() => { - const propsOpts = computePropsOpts.value - return propsOpts.disabled || 'disabled' - }) - - const computeMaps: CheckboxPrivateComputed = { - computeIsMaximize - } - - const $xecheckboxgroup = { - xID, - props, - context, - - getComputeMaps: () => computeMaps - } as unknown as VxeCheckboxGroupConstructor & VxeCheckboxGroupPrivateMethods - - useSize(props) - - const checkboxGroupMethods: CheckboxGroupMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $checkboxGroup: $xecheckboxgroup, $event: evnt }, params)) - } - } - - const checkboxGroupPrivateMethods: CheckboxGroupPrivateMethods = { - handleChecked (params, evnt) { - const { checked, label } = params - const checklist = props.modelValue || [] - const checkIndex = checklist.indexOf(label) - if (checked) { - if (checkIndex === -1) { - checklist.push(label) - } - } else { - checklist.splice(checkIndex, 1) - } - emit('update:modelValue', checklist) - $xecheckboxgroup.dispatchEvent('change', Object.assign({ checklist }, params), evnt) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, checklist) - } - } - } - - Object.assign($xecheckboxgroup, checkboxGroupMethods, checkboxGroupPrivateMethods) - - const renderVN = () => { - const { options } = props - const defaultSlot = slots.default - const valueField = computeValueField.value as 'value' - const labelField = computeLabelField.value as 'label' - const disabledField = computeDisabledField.value as 'disabled' - return h('div', { - class: 'vxe-checkbox-group' - }, defaultSlot ? defaultSlot({}) : (options ? options.map(item => { - return h(VxeCheckboxComponent, { - label: item[valueField], - content: item[labelField], - disabled: item[disabledField] - }) - }) : [])) - } - - $xecheckboxgroup.renderVN = renderVN - - provide('$xecheckboxgroup', $xecheckboxgroup) - - return renderVN - } -}) diff --git a/packages/colgroup/index.d.ts b/packages/colgroup/index.d.ts deleted file mode 100644 index cd23d713ba..0000000000 --- a/packages/colgroup/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeColgroup } from '../../types/colgroup' - -export * from '../../types/colgroup' -export default VxeColgroup diff --git a/packages/colgroup/index.ts b/packages/colgroup/index.ts index dd5b576acb..4bad3b5c29 100644 --- a/packages/colgroup/index.ts +++ b/packages/colgroup/index.ts @@ -1,19 +1,20 @@ import { App } from 'vue' -import VxeTableColgroupComponent from '../table/src/group' -import { dynamicApp } from '../dynamics' +import { VxeUI } from '../ui' +import VxeColgroupComponent from '../table/src/group' -export const VxeColgroup = Object.assign(VxeTableColgroupComponent, { +export const VxeColgroup = Object.assign({}, VxeColgroupComponent, { install (app: App) { - app.component(VxeTableColgroupComponent.name, VxeTableColgroupComponent) + app.component(VxeColgroupComponent.name as string, VxeColgroupComponent) // 兼容旧用法 - app.component('VxeTableColgroup', VxeTableColgroupComponent) + app.component('VxeTableColgroup', VxeColgroupComponent) } }) -export const Colgroup = VxeColgroup - -dynamicApp.component(VxeTableColgroupComponent.name, VxeTableColgroupComponent) -// 兼容旧用法 -dynamicApp.component('VxeTableColgroup', VxeTableColgroupComponent) +if (VxeUI.dynamicApp) { + VxeUI.dynamicApp.component(VxeColgroupComponent.name as string, VxeColgroupComponent) + // 兼容旧用法 + VxeUI.dynamicApp.component('VxeTableColgroup', VxeColgroupComponent) +} +export const Colgroup = VxeColgroup export default VxeColgroup diff --git a/packages/column/index.d.ts b/packages/column/index.d.ts deleted file mode 100644 index 7f0a6bcf45..0000000000 --- a/packages/column/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeColumn } from '../../types/column' - -export * from '../../types/column' -export default VxeColumn diff --git a/packages/column/index.ts b/packages/column/index.ts index 243155f859..1fb5de5278 100644 --- a/packages/column/index.ts +++ b/packages/column/index.ts @@ -1,19 +1,20 @@ import { App } from 'vue' -import VxeTableColumnComponent from '../table/src/column' -import { dynamicApp } from '../dynamics' +import { VxeUI } from '../ui' +import VxeColumnComponent from '../table/src/column' -export const VxeColumn = Object.assign(VxeTableColumnComponent, { +export const VxeColumn = Object.assign({}, VxeColumnComponent, { install (app: App) { - app.component(VxeTableColumnComponent.name, VxeTableColumnComponent) + app.component(VxeColumnComponent.name as string, VxeColumnComponent) // 兼容旧用法 - app.component('VxeTableColumn', VxeTableColumnComponent) + app.component('VxeTableColumn', VxeColumnComponent) } }) -export const Column = VxeColumn - -dynamicApp.component(VxeTableColumnComponent.name, VxeTableColumnComponent) -// 兼容旧用法 -dynamicApp.component('VxeTableColumn', VxeTableColumnComponent) +if (VxeUI.dynamicApp) { + VxeUI.dynamicApp.component(VxeColumnComponent.name as string, VxeColumnComponent) + // 兼容旧用法 + VxeUI.dynamicApp.component('VxeTableColumn', VxeColumnComponent) +} +export const Column = VxeColumn export default VxeColumn diff --git a/packages/components.ts b/packages/components.ts new file mode 100644 index 0000000000..0faaf6b4e5 --- /dev/null +++ b/packages/components.ts @@ -0,0 +1,36 @@ +import { App } from 'vue' +import VxeUIExport, { VxeUI } from 'vxe-pc-ui' + +import { VxeColumn } from './column' +import { VxeColgroup } from './colgroup' +import { VxeGrid } from './grid' +import { VxeTable } from './table' +import { VxeToolbar } from './toolbar' + +import type { VxeGlobalConfig } from '../types' + +const components = [ + VxeColumn, + VxeColgroup, + VxeGrid, + VxeTable, + VxeToolbar +] + +// 默认安装 +export function install (app: App, options?: VxeGlobalConfig) { + VxeUI.setConfig(options) + components.forEach(component => component.install(app)) +} + +export const modal = VxeUIExport.drawer +export const drawer = VxeUIExport.drawer + +export * from './ui' + +// Components +export * from './table' +export * from './column' +export * from './colgroup' +export * from './grid' +export * from './toolbar' diff --git a/packages/custom/index.d.ts b/packages/custom/index.d.ts deleted file mode 100644 index 33ec874cf7..0000000000 --- a/packages/custom/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTableCustomModule } from '../../types/module/custom' - -export * from '../../types/module/custom' -export default VxeTableCustomModule diff --git a/packages/custom/index.ts b/packages/custom/index.ts deleted file mode 100644 index 9feae7d9e4..0000000000 --- a/packages/custom/index.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { App } from 'vue' -import { VXETable } from '../v-x-e-table' -import PanelComponent from './src/panel' -import customHook from './src/hook' -import { dynamicApp } from '../dynamics' - -export const VxeTableCustomModule = { - Panel: PanelComponent, - install (app: App) { - VXETable.hooks.add('$tableCustom', customHook) - app.component(PanelComponent.name, PanelComponent) - } -} - -export const Custom = VxeTableCustomModule - -dynamicApp.component(PanelComponent.name, PanelComponent) - -export default VxeTableCustomModule diff --git a/packages/custom/src/panel.ts b/packages/custom/src/panel.ts deleted file mode 100644 index 6eb422dfb3..0000000000 --- a/packages/custom/src/panel.ts +++ /dev/null @@ -1,599 +0,0 @@ -import { defineComponent, h, inject, ref, Ref, VNode, PropType, ComponentOptions, TransitionGroup } from 'vue' -import { VXETable } from '../../v-x-e-table' -import { formatText } from '../../tools/utils' -import { addClass, removeClass } from '../../tools/dom' -import GlobalConfig from '../../v-x-e-table/src/conf' -import VxeModalComponent from '../../modal/src/modal' -import VxeButtonComponent from '../../button/src/button' -import VxeRadioGroupComponent from '../../radio/src/group' -import VxeTooltipComponent from '../../tooltip/src/tooltip' -import XEUtils from 'xe-utils' - -import { VxeTableDefines, VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeTableCustomStoreObj, VxeColumnPropTypes } from '../../../types/all' - -export default defineComponent({ - name: 'VxeTableCustomPanel', - props: { - customStore: { - type: Object as PropType, - default: () => ({}) - } - }, - setup (props) { - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) - - const { reactData } = $xetable - const { computeCustomOpts, computeColumnOpts, computeIsMaxFixedColumn } = $xetable.getComputeMaps() - - const refElem = ref() as Ref - const bodyElemRef = ref() as Ref - const dragHintElemRef = ref() as Ref - - const dragColumn = ref() - - let prevDropTrEl: any - - const handleWrapperMouseenterEvent = (evnt: Event) => { - const { customStore } = props - customStore.activeWrapper = true - $xetable.customOpenEvent(evnt) - } - - const handleWrapperMouseleaveEvent = (evnt: Event) => { - const { customStore } = props - customStore.activeWrapper = false - setTimeout(() => { - if (!customStore.activeBtn && !customStore.activeWrapper) { - $xetable.customColseEvent(evnt) - } - }, 300) - } - - const confirmCustomEvent = (evnt: Event) => { - updateColumnSort() - $xetable.closeCustom() - $xetable.emitCustomEvent('confirm', evnt) - } - - const cancelCustomEvent = (evnt: Event) => { - $xetable.closeCustom() - $xetable.emitCustomEvent('cancel', evnt) - } - - const resetCustomEvent = (evnt: Event) => { - $xetable.resetColumn(true) - $xetable.closeCustom() - $xetable.emitCustomEvent('reset', evnt) - } - - const resetPopupCustomEvent = (evnt: Event) => { - if (VXETable.modal) { - VXETable.modal.confirm({ - content: GlobalConfig.i18n('vxe.custom.cstmConfirmRestore'), - className: 'vxe-table--ignore-clear', - escClosable: true - }).then(type => { - if (type === 'confirm') { - resetCustomEvent(evnt) - } - }) - } else { - resetCustomEvent(evnt) - } - } - - const handleOptionCheck = (column: VxeTableDefines.ColumnInfo) => { - const { customColumnList } = reactData - const matchObj = XEUtils.findTree(customColumnList, item => item === column) - if (matchObj && matchObj.parent) { - const { parent } = matchObj - if (parent.children && parent.children.length) { - parent.visible = parent.children.every((column) => column.visible) - parent.halfVisible = !parent.visible && parent.children.some((column) => column.visible || column.halfVisible) - handleOptionCheck(parent) - } - } - } - - const changeCheckboxOption = (column: VxeTableDefines.ColumnInfo) => { - const isChecked = !column.visible - const customOpts = computeCustomOpts.value - XEUtils.eachTree([column], (item) => { - item.visible = isChecked - item.halfVisible = false - }) - handleOptionCheck(column) - if (customOpts.immediate) { - $xetable.handleCustom() - } - $xetable.checkCustomStatus() - } - - const changeFixedOption = (column: VxeTableDefines.ColumnInfo, colFixed: VxeColumnPropTypes.Fixed) => { - const isMaxFixedColumn = computeIsMaxFixedColumn.value - if (column.fixed === colFixed) { - $xetable.clearColumnFixed(column) - } else { - if (!isMaxFixedColumn || column.fixed) { - $xetable.setColumnFixed(column, colFixed) - } - } - } - - const changePopupFixedOption = (column: VxeTableDefines.ColumnInfo) => { - const isMaxFixedColumn = computeIsMaxFixedColumn.value - if (!isMaxFixedColumn) { - $xetable.setColumnFixed(column, column.fixed) - } - } - - const allCustomEvent = () => { - const { customStore } = props - const { customColumnList } = reactData - const customOpts = computeCustomOpts.value - const { checkMethod } = customOpts - const isAll = !customStore.isAll - XEUtils.eachTree(customColumnList, (column) => { - if (!checkMethod || checkMethod({ column })) { - column.visible = isAll - column.halfVisible = false - } - }) - customStore.isAll = isAll - $xetable.checkCustomStatus() - } - - const sortMousedownEvent = (evnt: DragEvent) => { - const btnEl = evnt.currentTarget as HTMLElement - const tdEl = btnEl.parentNode as HTMLElement - const trEl = tdEl.parentNode as HTMLElement - const colid = trEl.getAttribute('colid') - const column = $xetable.getColumnById(colid) - trEl.draggable = true - dragColumn.value = column - addClass(trEl, 'active--drag-origin') - } - - const sortMouseupEvent = (evnt: DragEvent) => { - const btnEl = evnt.currentTarget as HTMLElement - const tdEl = btnEl.parentNode as HTMLElement - const trEl = tdEl.parentNode as HTMLElement - const dragHintEl = dragHintElemRef.value - trEl.draggable = false - dragColumn.value = null - removeClass(trEl, 'active--drag-origin') - if (dragHintEl) { - dragHintEl.style.display = '' - } - } - - const sortDragstartEvent = (evnt: DragEvent) => { - const img = new Image() - if (evnt.dataTransfer) { - evnt.dataTransfer.setDragImage(img, 0, 0) - } - } - - const updateColumnSort = () => { - const { customColumnList } = reactData - // 更新顺序 - customColumnList.forEach((column, index) => { - const sortIndex = index + 1 - column.renderSortNumber = sortIndex - }) - } - - const sortDragendEvent = (evnt: DragEvent) => { - const { customColumnList } = reactData - const trEl = evnt.currentTarget as HTMLElement - const dragHintEl = dragHintElemRef.value - if (prevDropTrEl) { - // 判断是否有拖动 - if (prevDropTrEl !== trEl) { - const dragOffset = prevDropTrEl.getAttribute('drag-pos') - const colid = trEl.getAttribute('colid') - const column = $xetable.getColumnById(colid) - if (!column) { - return - } - const cIndex = XEUtils.findIndexOf(customColumnList, item => item.id === column.id) - const targetColid = prevDropTrEl.getAttribute('colid') - const targetColumn = $xetable.getColumnById(targetColid) - if (!targetColumn) { - return - } - // 移出源位置 - customColumnList.splice(cIndex, 1) - const tcIndex = XEUtils.findIndexOf(customColumnList, item => item.id === targetColumn.id) - // 插新位置 - customColumnList.splice(tcIndex + (dragOffset === 'bottom' ? 1 : 0), 0, column) - } - prevDropTrEl.draggable = false - prevDropTrEl.removeAttribute('drag-pos') - removeClass(prevDropTrEl, 'active--drag-target') - } - dragColumn.value = null - trEl.draggable = false - trEl.removeAttribute('drag-pos') - if (dragHintEl) { - dragHintEl.style.display = '' - } - removeClass(trEl, 'active--drag-target') - removeClass(trEl, 'active--drag-origin') - // 更新顺序 - updateColumnSort() - } - - const sortDragoverEvent = (evnt: DragEvent) => { - const trEl = evnt.currentTarget as HTMLElement - if (prevDropTrEl !== trEl) { - removeClass(prevDropTrEl, 'active--drag-target') - } - const colid = trEl.getAttribute('colid') - const column = $xetable.getColumnById(colid) - // 是否移入有效元行 - if (column && column.level === 1) { - evnt.preventDefault() - const offsetY = evnt.clientY - trEl.getBoundingClientRect().y - const dragOffset = offsetY < trEl.clientHeight / 2 ? 'top' : 'bottom' - addClass(trEl, 'active--drag-target') - trEl.setAttribute('drag-pos', dragOffset) - prevDropTrEl = trEl - } - updateDropHint(evnt) - } - - const updateDropHint = (evnt: DragEvent) => { - const dragHintEl = dragHintElemRef.value - const bodyEl = bodyElemRef.value - if (!bodyEl) { - return - } - if (dragHintEl) { - const wrapperEl = bodyEl.parentNode as HTMLElement - const wrapperRect = wrapperEl.getBoundingClientRect() - dragHintEl.style.display = 'block' - dragHintEl.style.top = `${Math.min(wrapperEl.clientHeight - wrapperEl.scrollTop - dragHintEl.clientHeight, evnt.clientY - wrapperRect.y)}px` - dragHintEl.style.left = `${Math.min(wrapperEl.clientWidth - wrapperEl.scrollLeft - dragHintEl.clientWidth - 16, evnt.clientX - wrapperRect.x)}px` - } - } - - const renderSimplePanel = () => { - const { customStore } = props - const { customColumnList } = reactData - const customOpts = computeCustomOpts.value - const { maxHeight } = customStore - const { checkMethod, visibleMethod, trigger } = customOpts - const isMaxFixedColumn = computeIsMaxFixedColumn.value - const colVNs: VNode[] = [] - const customWrapperOns: any = {} - // hover 触发 - if (trigger === 'hover') { - customWrapperOns.onMouseenter = handleWrapperMouseenterEvent - customWrapperOns.onMouseleave = handleWrapperMouseleaveEvent - } - XEUtils.eachTree(customColumnList, (column, index, items, path, parent) => { - const isVisible = visibleMethod ? visibleMethod({ column }) : true - if (isVisible) { - const isChecked = column.visible - const isIndeterminate = column.halfVisible - const isColGroup = column.children && column.children.length - const colTitle = formatText(column.getTitle(), 1) - const isDisabled = checkMethod ? !checkMethod({ column }) : false - colVNs.push( - h('li', { - key: column.id, - class: ['vxe-table-custom--option', `level--${column.level}`, { - 'is--group': isColGroup - }] - }, [ - h('div', { - title: colTitle, - class: ['vxe-table-custom--checkbox-option', { - 'is--checked': isChecked, - 'is--indeterminate': isIndeterminate, - 'is--disabled': isDisabled - }], - onClick: () => { - if (!isDisabled) { - changeCheckboxOption(column) - } - } - }, [ - h('span', { - class: ['vxe-checkbox--icon', isIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] - }), - h('span', { - class: 'vxe-checkbox--label' - }, colTitle) - ]), - !parent && customOpts.allowFixed ? h('div', { - class: 'vxe-table-custom--fixed-option' - }, [ - h('span', { - class: ['vxe-table-custom--fixed-left-option', column.fixed === 'left' ? GlobalConfig.icon.TOOLBAR_TOOLS_FIXED_LEFT_ACTIVED : GlobalConfig.icon.TOOLBAR_TOOLS_FIXED_LEFT, { - 'is--checked': column.fixed === 'left', - 'is--disabled': isMaxFixedColumn && !column.fixed - }], - title: GlobalConfig.i18n(column.fixed === 'left' ? 'vxe.toolbar.cancelFixed' : 'vxe.toolbar.fixedLeft'), - onClick: () => { - changeFixedOption(column, 'left') - } - }), - h('span', { - class: ['vxe-table-custom--fixed-right-option', column.fixed === 'right' ? GlobalConfig.icon.TOOLBAR_TOOLS_FIXED_RIGHT_ACTIVED : GlobalConfig.icon.TOOLBAR_TOOLS_FIXED_RIGHT, { - 'is--checked': column.fixed === 'right', - 'is--disabled': isMaxFixedColumn && !column.fixed - }], - title: GlobalConfig.i18n(column.fixed === 'right' ? 'vxe.toolbar.cancelFixed' : 'vxe.toolbar.fixedRight'), - onClick: () => { - changeFixedOption(column, 'right') - } - }) - ]) : null - ]) - ) - } - }) - const isAllChecked = customStore.isAll - const isAllIndeterminate = customStore.isIndeterminate - return h('div', { - ref: refElem, - key: 'simple', - class: ['vxe-table-custom-wrapper', { - 'is--active': customStore.visible - }] - }, [ - h('ul', { - class: 'vxe-table-custom--header' - }, [ - h('li', { - class: 'vxe-table-custom--option' - }, [ - h('div', { - class: ['vxe-table-custom--checkbox-option', { - 'is--checked': isAllChecked, - 'is--indeterminate': isAllIndeterminate - }], - title: GlobalConfig.i18n('vxe.table.allTitle'), - onClick: allCustomEvent - }, [ - h('span', { - class: ['vxe-checkbox--icon', isAllIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] - }), - h('span', { - class: 'vxe-checkbox--label' - }, GlobalConfig.i18n('vxe.toolbar.customAll')) - ]) - ]) - ]), - h('ul', { - class: 'vxe-table-custom--body', - style: maxHeight ? { - maxHeight: `${maxHeight}px` - } : {}, - ...customWrapperOns - }, colVNs), - customOpts.showFooter ? h('div', { - class: 'vxe-table-custom--footer' - }, [ - h('button', { - class: 'btn--reset', - onClick: resetCustomEvent - }, customOpts.resetButtonText || GlobalConfig.i18n('vxe.toolbar.customRestore')), - h('button', { - class: 'btn--confirm', - onClick: confirmCustomEvent - }, customOpts.confirmButtonText || GlobalConfig.i18n('vxe.toolbar.customConfirm')) - ]) : null - ]) - } - - const renderPopupPanel = () => { - const { customStore } = props - const { customColumnList } = reactData - const customOpts = computeCustomOpts.value - const { checkMethod, visibleMethod } = customOpts - const columnOpts = computeColumnOpts.value - const isMaxFixedColumn = computeIsMaxFixedColumn.value - const trVNs: VNode[] = [] - XEUtils.eachTree(customColumnList, (column, index, items, path, parent) => { - const isVisible = visibleMethod ? visibleMethod({ column }) : true - if (isVisible) { - const isChecked = column.visible - const isIndeterminate = column.halfVisible - const colTitle = formatText(column.getTitle(), 1) - const isColGroup = column.children && column.children.length - const isDisabled = checkMethod ? !checkMethod({ column }) : false - trVNs.push( - h('tr', { - key: column.id, - colid: column.id, - class: [`vxe-table-custom-popup--row level--${column.level}`, { - 'is--group': isColGroup - }], - onDragstart: sortDragstartEvent, - onDragend: sortDragendEvent, - onDragover: sortDragoverEvent - }, [ - h('td', { - class: 'vxe-table-custom-popup--column-item col--sort' - }, [ - column.level === 1 ? h('span', { - class: 'vxe-table-custom-popup--column-sort-btn', - onMousedown: sortMousedownEvent, - onMouseup: sortMouseupEvent - }, [ - h('i', { - class: 'vxe-icon-sort' - }) - ]) : null - ]), - h('td', { - class: 'vxe-table-custom-popup--column-item col--name' - }, [ - h('div', { - class: 'vxe-table-custom-popup--name', - title: colTitle - }, colTitle) - ]), - h('td', { - class: 'vxe-table-custom-popup--column-item col--visible' - }, [ - h('div', { - class: ['vxe-table-custom--checkbox-option', { - 'is--checked': isChecked, - 'is--indeterminate': isIndeterminate, - 'is--disabled': isDisabled - }], - onClick: () => { - if (!isDisabled) { - changeCheckboxOption(column) - } - } - }, [ - h('span', { - class: ['vxe-checkbox--icon', isIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] - }) - ]) - ]), - h('td', { - class: 'vxe-table-custom-popup--column-item col--fixed' - }, [ - !parent && customOpts.allowFixed ? h(VxeRadioGroupComponent, { - modelValue: column.fixed || '', - type: 'button', - size: 'mini', - options: [ - { label: GlobalConfig.i18n('vxe.custom.setting.fixedLeft'), value: 'left', disabled: isMaxFixedColumn }, - { label: GlobalConfig.i18n('vxe.custom.setting.fixedUnset'), value: '' }, - { label: GlobalConfig.i18n('vxe.custom.setting.fixedRight'), value: 'right', disabled: isMaxFixedColumn } - ], - 'onUpdate:modelValue' (value: any) { - column.fixed = value - }, - onChange () { - changePopupFixedOption(column) - } - }) : null - ]) - ]) - ) - } - }) - return h(VxeModalComponent as ComponentOptions, { - key: 'popup', - className: 'vxe-table-custom-popup-wrapper vxe-table--ignore-clear', - modelValue: customStore.visible, - title: GlobalConfig.i18n('vxe.custom.cstmTitle'), - width: '40vw', - minWidth: 520, - height: '50vh', - minHeight: 300, - mask: true, - lockView: true, - showFooter: true, - resize: true, - escClosable: true, - destroyOnClose: true, - 'onUpdate:modelValue' (value: any) { - customStore.visible = value - } - }, { - default: () => { - return h('div', { - ref: bodyElemRef, - class: 'vxe-table-custom-popup--body' - }, [ - h('div', { - class: 'vxe-table-custom-popup--table-wrapper' - }, [ - h('table', {}, [ - h('colgroup', {}, [ - h('col', { - style: { - width: '80px' - } - }), - h('col', {}), - h('col', { - style: { - width: '80px' - } - }), - h('col', { - style: { - width: '200px' - } - }) - ]), - h('thead', {}, [ - h('tr', {}, [ - h('th', {}, [ - h('span', { - class: 'vxe-table-custom-popup--table-sort-help-title' - }, GlobalConfig.i18n('vxe.custom.setting.colSort')), - h(VxeTooltipComponent, { - enterable: true, - content: GlobalConfig.i18n('vxe.custom.setting.sortHelpTip') - }, { - default: () => { - return h('i', { - class: 'vxe-table-custom-popup--table-sort-help-icon vxe-icon-question-circle-fill' - }) - } - }) - ]), - h('th', {}, GlobalConfig.i18n('vxe.custom.setting.colTitle')), - h('th', {}, GlobalConfig.i18n('vxe.custom.setting.colVisible')), - h('th', {}, GlobalConfig.i18n('vxe.custom.setting.colFixed', [columnOpts.maxFixedSize || 0])) - ]) - ]), - h(TransitionGroup, { - class: 'vxe-table-custom--body', - tag: 'tbody', - name: 'vxe-table-custom--list' - }, { - default: () => trVNs - }) - ]) - ]), - h('div', { - ref: dragHintElemRef, - class: 'vxe-table-custom-popup--drag-hint' - }, GlobalConfig.i18n('vxe.custom.cstmDragTarget', [dragColumn.value ? dragColumn.value.getTitle() : ''])) - ]) - }, - footer: () => { - return h('div', { - class: 'vxe-table-custom-popup--footer' - }, [ - h(VxeButtonComponent, { - content: customOpts.resetButtonText || GlobalConfig.i18n('vxe.custom.cstmRestore'), - onClick: resetPopupCustomEvent - }), - h(VxeButtonComponent, { - content: customOpts.resetButtonText || GlobalConfig.i18n('vxe.custom.cstmCancel'), - onClick: cancelCustomEvent - }), - h(VxeButtonComponent, { - status: 'primary', - content: customOpts.confirmButtonText || GlobalConfig.i18n('vxe.custom.cstmConfirm'), - onClick: confirmCustomEvent - }) - ]) - } - }) - } - - const renderVN = () => { - const customOpts = computeCustomOpts.value - if (customOpts.mode === 'popup') { - return renderPopupPanel() - } - return renderSimplePanel() - } - - return renderVN - } -}) diff --git a/packages/drawer/index.d.ts b/packages/drawer/index.d.ts deleted file mode 100644 index 30626eb53c..0000000000 --- a/packages/drawer/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeDrawer } from '../../types/drawer' - -export * from '../../types/drawer' -export default VxeDrawer diff --git a/packages/drawer/index.ts b/packages/drawer/index.ts deleted file mode 100644 index 80e4055396..0000000000 --- a/packages/drawer/index.ts +++ /dev/null @@ -1,73 +0,0 @@ -import { App } from 'vue' -import XEUtils from 'xe-utils' -import VxeDrawerComponent, { allActiveDrawers } from './src/modal' -import { VXETable } from '../v-x-e-table' -import { dynamicApp, dynamicStore, checkDynamic } from '../dynamics' - -import { VxeDrawerPropTypes, DrawerEventTypes, VxeDrawerDefines } from '../../types' - -function openDrawer (options: VxeDrawerDefines.DrawerOptions): Promise { - // 使用动态组件渲染动态弹框 - checkDynamic() - return new Promise(resolve => { - if (options && options.id && allActiveDrawers.some(comp => comp.props.id === options.id)) { - resolve('exist') - } else { - const _onHide = options.onHide - const drawerOpts = Object.assign(options, { - key: XEUtils.uniqueId(), - modelValue: true, - onHide (params) { - const drawerList = dynamicStore.drawers - if (_onHide) { - _onHide(params) - } - dynamicStore.drawers = drawerList.filter(item => item.key !== drawerOpts.key) - resolve(params.type) - } - } as VxeDrawerDefines.DrawerOptions) - dynamicStore.drawers.push(drawerOpts) - } - }) -} - -function getDrawer (id: VxeDrawerPropTypes.ID) { - return XEUtils.find(allActiveDrawers, $drawer => $drawer.props.id === id) -} - -/** - * 全局关闭动态的活动窗口（只能用于关闭动态的创建的活动窗口） - * 如果传 id 则关闭指定的窗口 - * 如果不传则关闭所有窗口 - */ -function closeDrawer (id?: VxeDrawerPropTypes.ID) { - const drawers = id ? [getDrawer(id)] : allActiveDrawers - const restPromises: any[] = [] - drawers.forEach($drawer => { - if ($drawer) { - restPromises.push($drawer.close()) - } - }) - return Promise.all(restPromises) -} - -const DrawerController = { - get: getDrawer, - close: closeDrawer, - open: openDrawer -} - -export const drawer = DrawerController - -export const VxeDrawer = Object.assign(VxeDrawerComponent, { - install: function (app: App) { - app.component(VxeDrawerComponent.name as string, VxeDrawerComponent) - VXETable.drawer = DrawerController - } -}) - -dynamicApp.component(VxeDrawerComponent.name as string, VxeDrawerComponent) - -export const Drawer = VxeDrawer - -export default VxeDrawer diff --git a/packages/drawer/src/modal.ts b/packages/drawer/src/modal.ts deleted file mode 100644 index 9c52c619d4..0000000000 --- a/packages/drawer/src/modal.ts +++ /dev/null @@ -1,429 +0,0 @@ -import { defineComponent, h, Teleport, ref, Ref, reactive, nextTick, watch, PropType, VNode, onMounted, onUnmounted } from 'vue' -import XEUtils from 'xe-utils' -import { useSize } from '../../hooks/size' -import { getLastZIndex, nextZIndex, getFuncText } from '../../tools/utils' -import { GlobalEvent, hasEventKey, EVENT_KEYS } from '../../tools/event' -import GlobalConfig from '../../v-x-e-table/src/conf' -import VxeButtonComponent from '../../button/src/button' -import VxeLoadingComponent from '../../loading/index' -import { getSlotVNs } from '../../tools/vn' - -import { VxeDrawerPropTypes, DrawerReactData, VxeDrawerEmits, DrawerPrivateRef, DrawerMethods, DrawerPrivateMethods, VxeDrawerPrivateComputed, VxeDrawerConstructor, VxeDrawerPrivateMethods, VxeButtonInstance, DrawerEventTypes } from '../../../types' - -export const allActiveDrawers: VxeDrawerConstructor[] = [] - -export default defineComponent({ - name: 'VxeDrawer', - props: { - modelValue: Boolean as PropType, - id: String as PropType, - title: String as PropType, - loading: { type: Boolean as PropType, default: null }, - className: String as PropType, - position: [String, Object] as PropType, - lockView: { type: Boolean as PropType, default: () => GlobalConfig.drawer.lockView }, - lockScroll: Boolean as PropType, - mask: { type: Boolean as PropType, default: () => GlobalConfig.drawer.mask }, - maskClosable: { type: Boolean as PropType, default: () => GlobalConfig.drawer.maskClosable }, - escClosable: { type: Boolean as PropType, default: () => GlobalConfig.drawer.escClosable }, - showHeader: { type: Boolean as PropType, default: () => GlobalConfig.drawer.showHeader }, - showFooter: { type: Boolean as PropType, default: () => GlobalConfig.drawer.showFooter }, - showClose: { type: Boolean as PropType, default: () => GlobalConfig.drawer.showClose }, - content: [Number, String] as PropType, - showCancelButton: { type: Boolean as PropType, default: null }, - cancelButtonText: { type: String as PropType, default: () => GlobalConfig.drawer.cancelButtonText }, - showConfirmButton: { type: Boolean as PropType, default: () => GlobalConfig.drawer.showConfirmButton }, - confirmButtonText: { type: String as PropType, default: () => GlobalConfig.drawer.confirmButtonText }, - destroyOnClose: { type: Boolean as PropType, default: () => GlobalConfig.drawer.destroyOnClose }, - showTitleOverflow: { type: Boolean as PropType, default: () => GlobalConfig.drawer.showTitleOverflow }, - width: [Number, String] as PropType, - height: [Number, String] as PropType, - zIndex: Number as PropType, - transfer: { type: Boolean as PropType, default: () => GlobalConfig.drawer.transfer }, - size: { type: String as PropType, default: () => GlobalConfig.drawer.size || GlobalConfig.size }, - beforeHideMethod: { type: Function as PropType, default: () => GlobalConfig.drawer.beforeHideMethod }, - slots: Number as PropType - }, - emits: [ - 'update:modelValue', - 'show', - 'hide', - 'before-hide', - 'close', - 'confirm', - 'cancel' - ] as VxeDrawerEmits, - setup (props, context) { - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const refElem = ref() - const refDrawerBox = ref() as Ref - const refConfirmBtn = ref() - const refCancelBtn = ref() - - const reactData = reactive({ - inited: false, - visible: false, - contentVisible: false, - drawerZIndex: 0, - firstOpen: true - }) - - const refMaps: DrawerPrivateRef = { - refElem - } - - const computeMaps: VxeDrawerPrivateComputed = { - } - - const $xeDrawer = { - xID, - props, - context, - reactData, - - getRefMaps: () => refMaps, - getComputeMaps: () => computeMaps - } as unknown as VxeDrawerConstructor & VxeDrawerPrivateMethods - - const getBox = () => { - const boxElem = refDrawerBox.value - return boxElem - } - - const recalculate = () => { - const { width, height } = props - const boxElem = getBox() - boxElem.style.width = `${width ? (isNaN(width as number) ? width : `${width}px`) : ''}` - boxElem.style.height = `${height ? (isNaN(height as number) ? height : `${height}px`) : ''}` - return nextTick() - } - - const updateZindex = () => { - const { zIndex } = props - const { drawerZIndex } = reactData - if (zIndex) { - reactData.drawerZIndex = zIndex - } else if (drawerZIndex < getLastZIndex()) { - reactData.drawerZIndex = nextZIndex() - } - } - - const updatePosition = () => { - return nextTick().then(() => { - }) - } - - const closeDrawer = (type: DrawerEventTypes) => { - const { beforeHideMethod } = props - const { visible } = reactData - const params = { type } - if (visible) { - Promise.resolve(beforeHideMethod ? beforeHideMethod(params) : null).then((rest) => { - if (!XEUtils.isError(rest)) { - reactData.contentVisible = false - XEUtils.remove(allActiveDrawers, item => item === $xeDrawer) - drawerMethods.dispatchEvent('before-hide', params) - setTimeout(() => { - reactData.visible = false - emit('update:modelValue', false) - drawerMethods.dispatchEvent('hide', params) - }, 200) - } - }).catch(e => e) - } - return nextTick() - } - - const closeEvent = (evnt: Event) => { - const type = 'close' - drawerMethods.dispatchEvent(type, { type }, evnt) - closeDrawer(type) - } - - const confirmEvent = (evnt: Event) => { - const type = 'confirm' - drawerMethods.dispatchEvent(type, { type }, evnt) - closeDrawer(type) - } - - const cancelEvent = (evnt: Event) => { - const type = 'cancel' - drawerMethods.dispatchEvent(type, { type }, evnt) - closeDrawer(type) - } - - const openDrawer = () => { - const { showFooter } = props - const { inited, visible } = reactData - if (!inited) { - reactData.inited = true - } - if (!visible) { - recalculate() - reactData.visible = true - reactData.contentVisible = false - updateZindex() - allActiveDrawers.push($xeDrawer) - setTimeout(() => { - reactData.contentVisible = true - nextTick(() => { - if (showFooter) { - const confirmBtn = refConfirmBtn.value - const cancelBtn = refCancelBtn.value - const operBtn = confirmBtn || cancelBtn - if (operBtn) { - operBtn.focus() - } - } - const type = '' - const params = { type } - emit('update:modelValue', true) - drawerMethods.dispatchEvent('show', params) - }) - }, 10) - nextTick(() => { - const { firstOpen } = reactData - if (firstOpen) { - updatePosition().then(() => { - setTimeout(() => updatePosition(), 20) - }) - } - if (firstOpen) { - reactData.firstOpen = false - } - }) - } - return nextTick() - } - - const drawerMethods: DrawerMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $drawer: $xeDrawer, $event: evnt }, params)) - }, - open: openDrawer, - close () { - return closeDrawer('close') - }, - getBox - } - - const selfClickEvent = (evnt: Event) => { - const el = refElem.value - if (props.maskClosable && evnt.target === el) { - const type = 'mask' - closeDrawer(type) - } - } - - const handleGlobalKeydownEvent = (evnt: KeyboardEvent) => { - const isEsc = hasEventKey(evnt, EVENT_KEYS.ESCAPE) - if (isEsc) { - const lastDrawer = XEUtils.max(allActiveDrawers, (item) => item.reactData.drawerZIndex) - // 多个时，只关掉最上层的窗口 - if (lastDrawer) { - setTimeout(() => { - if (lastDrawer === $xeDrawer && (lastDrawer as VxeDrawerConstructor).props.escClosable) { - closeDrawer('exit') - } - }, 10) - } - } - } - - const boxMousedownEvent = () => { - const { drawerZIndex } = reactData - if (allActiveDrawers.some(comp => comp.reactData.visible && comp.reactData.drawerZIndex > drawerZIndex)) { - updateZindex() - } - } - - const formDesignPrivateMethods: DrawerPrivateMethods = {} - - Object.assign($xeDrawer, drawerMethods, formDesignPrivateMethods) - - const renderTitles = () => { - const { slots: propSlots = {}, showClose, title } = props - const titleSlot = slots.title || propSlots.title - const cornerSlot = slots.corner || propSlots.corner - const titVNs = [ - h('div', { - class: 'vxe-drawer--header-title' - }, titleSlot ? getSlotVNs(titleSlot({ $drawer: $xeDrawer })) : (title ? getFuncText(title) : GlobalConfig.i18n('vxe.alert.title'))) - ] - const rightVNs = [] - if (cornerSlot) { - rightVNs.push( - h('span', { - class: 'vxe-drawer--corner-wrapper' - }, getSlotVNs(cornerSlot({ $drawer: $xeDrawer }))) - ) - } - if (showClose) { - rightVNs.push( - h('i', { - class: ['vxe-drawer--close-btn', 'trigger--btn', GlobalConfig.icon.MODAL_CLOSE], - title: GlobalConfig.i18n('vxe.drawer.close'), - onClick: closeEvent - }) - ) - } - titVNs.push( - h('div', { - class: 'vxe-drawer--header-right' - }, rightVNs) - ) - return titVNs - } - - const renderHeader = () => { - const { slots: propSlots = {}, showTitleOverflow } = props - const headerSlot = slots.header || propSlots.header - const headVNs: VNode[] = [] - if (props.showHeader) { - headVNs.push( - h('div', { - class: ['vxe-drawer--header', { - 'is--ellipsis': showTitleOverflow - }] - }, headerSlot - ? (!reactData.inited || (props.destroyOnClose && !reactData.visible) ? [] : getSlotVNs(headerSlot({ $drawer: $xeDrawer }))) - : renderTitles()) - ) - } - return headVNs - } - - const renderBody = () => { - const { slots: propSlots = {}, content } = props - const defaultSlot = slots.default || propSlots.default - return [ - h('div', { - class: 'vxe-drawer--body' - }, [ - h('div', { - class: 'vxe-drawer--content' - }, defaultSlot ? (!reactData.inited || (props.destroyOnClose && !reactData.visible) ? [] : getSlotVNs(defaultSlot({ $drawer: $xeDrawer }))) as VNode[] : getFuncText(content)), - h(VxeLoadingComponent, { - class: 'vxe-drawer--loading', - modelValue: props.loading - }) - ]) - ] - } - - const renderBtns = () => { - const { showCancelButton, showConfirmButton } = props - const btnVNs = [] - if (showCancelButton) { - btnVNs.push( - h(VxeButtonComponent, { - key: 1, - ref: refCancelBtn, - content: props.cancelButtonText || GlobalConfig.i18n('vxe.button.cancel'), - onClick: cancelEvent - }) - ) - } - if (showConfirmButton) { - btnVNs.push( - h(VxeButtonComponent, { - key: 2, - ref: refConfirmBtn, - status: 'primary', - content: props.confirmButtonText || GlobalConfig.i18n('vxe.button.confirm'), - onClick: confirmEvent - }) - ) - } - return btnVNs - } - - const renderFooter = () => { - const { slots: propSlots = {} } = props - const footerSlot = slots.footer || propSlots.footer - const footVNs: VNode[] = [] - if (props.showFooter) { - footVNs.push( - h('div', { - class: 'vxe-drawer--footer' - }, footerSlot - ? (!reactData.inited || (props.destroyOnClose && !reactData.visible) ? [] : getSlotVNs(footerSlot({ $drawer: $xeDrawer }))) - : renderBtns()) - ) - } - return footVNs - } - - const renderVN = () => { - const { className, position, loading, lockScroll, lockView, mask } = props - const { inited, contentVisible, visible } = reactData - const vSize = computeSize.value - return h(Teleport, { - to: 'body', - disabled: props.transfer ? !inited : true - }, [ - h('div', { - ref: refElem, - class: ['vxe-drawer--wrapper', `pos--${position}`, className || '', { - [`size--${vSize}`]: vSize, - 'lock--scroll': lockScroll, - 'lock--view': lockView, - 'is--mask': mask, - 'is--visible': contentVisible, - 'is--active': visible, - 'is--loading': loading - }], - style: { - zIndex: reactData.drawerZIndex - }, - onClick: selfClickEvent - }, [ - h('div', { - ref: refDrawerBox, - class: 'vxe-drawer--box', - onMousedown: boxMousedownEvent - }, renderHeader().concat(renderBody(), renderFooter())) - ]) - ]) - } - - $xeDrawer.renderVN = renderVN - - watch(() => props.width, recalculate) - watch(() => props.height, recalculate) - - watch(() => props.modelValue, (value) => { - if (value) { - openDrawer() - } else { - closeDrawer('model') - } - }) - - onMounted(() => { - nextTick(() => { - if (props.modelValue) { - openDrawer() - } - recalculate() - }) - if (props.escClosable) { - GlobalEvent.on($xeDrawer, 'keydown', handleGlobalKeydownEvent) - } - }) - - onUnmounted(() => { - GlobalEvent.off($xeDrawer, 'keydown') - }) - - return $xeDrawer - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/dynamics/index.ts b/packages/dynamics/index.ts deleted file mode 100644 index 6702c37311..0000000000 --- a/packages/dynamics/index.ts +++ /dev/null @@ -1,44 +0,0 @@ -import { defineComponent, h, createApp, resolveComponent, reactive, ComponentOptions, createCommentVNode } from 'vue' - -import { VxeModalDefines, VxeDrawerDefines } from '../../types/all' - -let dynamicContainerElem: HTMLElement - -export const dynamicStore = reactive({ - modals: [] as VxeModalDefines.ModalOptions[], - drawers: [] as VxeDrawerDefines.DrawerOptions[] -}) - -/** - * 动态组件 - */ -const VxeDynamics = defineComponent({ - setup () { - return () => { - const { modals, drawers } = dynamicStore - return [ - modals.length - ? h('div', { - class: 'vxe-dynamics--modal' - }, modals.map((item) => h(resolveComponent('vxe-modal') as ComponentOptions, item))) - : createCommentVNode(), - drawers.length - ? h('div', { - class: 'vxe-dynamics--drawer' - }, drawers.map((item) => h(resolveComponent('vxe-drawer') as ComponentOptions, item))) - : createCommentVNode() - ] - } - } -}) - -export const dynamicApp = createApp(VxeDynamics) - -export function checkDynamic () { - if (!dynamicContainerElem) { - dynamicContainerElem = document.createElement('div') - dynamicContainerElem.className = 'vxe-dynamics' - document.body.appendChild(dynamicContainerElem) - dynamicApp.mount(dynamicContainerElem) - } -} diff --git a/packages/edit/index.d.ts b/packages/edit/index.d.ts deleted file mode 100644 index 695bcb0afc..0000000000 --- a/packages/edit/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTableEditModule } from '../../types/module/edit' - -export * from '../../types/module/edit' -export default VxeTableEditModule diff --git a/packages/edit/index.ts b/packages/edit/index.ts deleted file mode 100644 index 73ce9d917d..0000000000 --- a/packages/edit/index.ts +++ /dev/null @@ -1,12 +0,0 @@ -import editHook from './src/hook' -import { VXETable } from '../v-x-e-table' - -export const VxeTableEditModule = { - install (): void { - VXETable.hooks.add('$tableEdit', editHook) - } -} - -export const Edit = VxeTableEditModule - -export default VxeTableEditModule diff --git a/packages/export/index.d.ts b/packages/export/index.d.ts deleted file mode 100644 index 4c29cd966e..0000000000 --- a/packages/export/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTableExportModule } from '../../types/module/export' - -export * from '../../types/module/export' -export default VxeTableExportModule diff --git a/packages/export/index.ts b/packages/export/index.ts deleted file mode 100644 index 5ba881b4d9..0000000000 --- a/packages/export/index.ts +++ /dev/null @@ -1,48 +0,0 @@ -import { App } from 'vue' -import { VXETable } from '../v-x-e-table' -import ExportPanelComponent from './src/export-panel' -import ImportPanelComponent from './src/import-panel' -import exportHook from './src/hook' -import { saveLocalFile as saveFile, readLocalFile as readFile, handlePrint } from './src/util' -import { dynamicApp } from '../dynamics' - -import { PrintFunction } from '../../types/all' - -export { saveFile, readFile } - -export const print: PrintFunction = (options) => { - const opts = Object.assign({}, options, { - type: 'html' - }) - handlePrint(null, opts, opts.content) -} - -export const VxeTableExportModule = { - ExportPanel: ExportPanelComponent, - ImportPanel: ImportPanelComponent, - install (app: App) { - VXETable.saveFile = saveFile - VXETable.readFile = readFile - VXETable.print = print - VXETable.setConfig({ - export: { - types: { - csv: 0, - html: 0, - xml: 0, - txt: 0 - } - } - }) - VXETable.hooks.add('$tableExport', exportHook) - app.component(ExportPanelComponent.name, ExportPanelComponent) - app.component(ImportPanelComponent.name, ImportPanelComponent) - } -} - -export const Export = VxeTableExportModule - -dynamicApp.component(ExportPanelComponent.name, ExportPanelComponent) -dynamicApp.component(ImportPanelComponent.name, ImportPanelComponent) - -export default VxeTableExportModule diff --git a/packages/export/src/util.ts b/packages/export/src/util.ts deleted file mode 100644 index 55def58b1c..0000000000 --- a/packages/export/src/util.ts +++ /dev/null @@ -1,180 +0,0 @@ -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' -import { browse } from '../../tools/dom' -import { parseFile } from '../../tools/utils' -import { errLog, getLog } from '../../tools/log' - -import { VxeTablePropTypes, SaveFileFunction, ReadFileFunction, VxeTableConstructor } from '../../../types/all' - -// 导入 -let fileForm: any -let fileInput: any - -// 打印 -let printFrame: any - -// 默认导出或打印的 HTML 样式 -const defaultHtmlStyle = 'body{margin:0;padding: 0 1px;color:#333333;font-size:14px;font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu}body *{-webkit-box-sizing:border-box;box-sizing:border-box}.vxe-table{border-collapse:collapse;text-align:left;border-spacing:0}.vxe-table:not(.is--print){table-layout:fixed}.vxe-table,.vxe-table th,.vxe-table td,.vxe-table td{border-color:#D0D0D0;border-style:solid;border-width:0}.vxe-table.is--print{width:100%}.border--default,.border--full,.border--outer{border-top-width:1px}.border--default,.border--full,.border--outer{border-left-width:1px}.border--outer,.border--default th,.border--default td,.border--full th,.border--full td,.border--outer th,.border--inner th,.border--inner td{border-bottom-width:1px}.border--default,.border--outer,.border--full th,.border--full td{border-right-width:1px}.border--default th,.border--full th,.border--outer th{background-color:#f8f8f9}.vxe-table td>div,.vxe-table th>div{padding:.5em .4em}.col--center{text-align:center}.col--right{text-align:right}.vxe-table:not(.is--print) .col--ellipsis>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.vxe-table--tree-node{text-align:left}.vxe-table--tree-node-wrapper{position:relative}.vxe-table--tree-icon-wrapper{position:absolute;top:50%;width:1em;height:1em;text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.vxe-table--tree-unfold-icon,.vxe-table--tree-fold-icon{position:absolute;width:0;height:0;border-style:solid;border-width:.5em;border-right-color:transparent;border-bottom-color:transparent}.vxe-table--tree-unfold-icon{left:.3em;top:0;border-left-color:#939599;border-top-color:transparent}.vxe-table--tree-fold-icon{left:0;top:.3em;border-left-color:transparent;border-top-color:#939599}.vxe-table--tree-cell{display:block;padding-left:1.5em}.vxe-table input[type="checkbox"]{margin:0}.vxe-table input[type="checkbox"],.vxe-table input[type="radio"],.vxe-table input[type="checkbox"]+span,.vxe-table input[type="radio"]+span{vertical-align:middle;padding-left:0.4em}' - -export function createFrame (): HTMLIFrameElement { - const frame = document.createElement('iframe') - frame.className = 'vxe-table--print-frame' - return frame -} - -export function getExportBlobByContent (content: string, options: { type: string }) { - return new Blob([content], { type: `text/${options.type};charset=utf-8;` }) -} - -export function createHtmlPage (opts: VxeTablePropTypes.PrintConfig, content: string): string { - const { style } = opts - return [ - '', - '', - '', - `${opts.sheetName}`, - '', - ``, - style ? `` : '', - '', - `${content}`, - '' - ].join('') -} - -/** - * 读取本地文件 - * @param {*} options 参数 - */ -export const readLocalFile: ReadFileFunction = (options) => { - const opts = Object.assign({}, options) - if (!fileForm) { - fileForm = document.createElement('form') - fileInput = document.createElement('input') - fileForm.className = 'vxe-table--file-form' - fileInput.name = 'file' - fileInput.type = 'file' - fileForm.appendChild(fileInput) - document.body.appendChild(fileForm) - } - return new Promise((resolve, reject) => { - const types = opts.types || [] - const isAllType = !types.length || types.some((type: any) => type === '*') - fileInput.multiple = !!opts.multiple - fileInput.accept = isAllType ? '' : `.${types.join(', .')}` - fileInput.onchange = (evnt: any) => { - const { files } = evnt.target - const file = files[0] - let errType = '' - // 校验类型 - if (!isAllType) { - for (let fIndex = 0; fIndex < files.length; fIndex++) { - const { type } = parseFile(files[fIndex]) - if (!XEUtils.includes(types, type)) { - errType = type - break - } - } - } - if (!errType) { - resolve({ status: true, files, file }) - } else { - if (opts.message !== false) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } - } - VXETable.modal.message({ content: GlobalConfig.i18n('vxe.error.notType', [errType]), status: 'error' }) - } - const params = { status: false, files, file } - reject(params) - } - } - fileForm.reset() - fileInput.click() - }) -} - -function removePrintFrame () { - if (printFrame) { - if (printFrame.parentNode) { - try { - printFrame.contentDocument.write('') - } catch (e) {} - printFrame.parentNode.removeChild(printFrame) - } - printFrame = null - } -} - -function appendPrintFrame () { - if (!printFrame.parentNode) { - document.body.appendChild(printFrame) - } -} - -function afterPrintEvent () { - requestAnimationFrame(removePrintFrame) -} - -export function handlePrint ($xetable: VxeTableConstructor | null, opts: VxeTablePropTypes.PrintConfig & { type: string }, content = ''): void { - const { beforePrintMethod } = opts - if (beforePrintMethod) { - content = beforePrintMethod({ content, options: opts, $table: $xetable }) || '' - } - content = createHtmlPage(opts, content) - const blob = getExportBlobByContent(content, opts) - if (browse.msie) { - removePrintFrame() - printFrame = createFrame() - appendPrintFrame() - printFrame.contentDocument.write(content) - printFrame.contentDocument.execCommand('print') - } else { - if (!printFrame) { - printFrame = createFrame() - printFrame.onload = (evnt: any) => { - if (evnt.target.src) { - evnt.target.contentWindow.onafterprint = afterPrintEvent - evnt.target.contentWindow.print() - } - } - } - appendPrintFrame() - printFrame.src = URL.createObjectURL(blob) - } -} - -/** - * 保存文件到本地 - * @param {*} options 参数 - */ -export const saveLocalFile: SaveFileFunction = (options) => { - const { filename, type, content } = options - const name = `${filename}.${type}` - if (window.Blob) { - const blob = content instanceof Blob ? content : getExportBlobByContent(XEUtils.toValueString(content), options) - if ((navigator as any).msSaveBlob) { - (navigator as any).msSaveBlob(blob, name) - } else { - const url = URL.createObjectURL(blob) - const linkElem = document.createElement('a') - linkElem.target = '_blank' - linkElem.download = name - linkElem.href = url - document.body.appendChild(linkElem) - linkElem.click() - requestAnimationFrame(() => { - if (linkElem.parentNode) { - linkElem.parentNode.removeChild(linkElem) - } - URL.revokeObjectURL(url) - }) - } - return Promise.resolve() - } - return Promise.reject(new Error(getLog('vxe.error.notExp'))) -} diff --git a/packages/filter/index.d.ts b/packages/filter/index.d.ts deleted file mode 100644 index 9e5c036c5f..0000000000 --- a/packages/filter/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTableFilterModule } from '../../types/module/filter' - -export * from '../../types/module/filter' -export default VxeTableFilterModule diff --git a/packages/filter/index.ts b/packages/filter/index.ts deleted file mode 100644 index 6d93ed1b44..0000000000 --- a/packages/filter/index.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { App } from 'vue' -import { VXETable } from '../v-x-e-table' -import PanelComponent from './src/panel' -import filterHook from './src/hook' -import { dynamicApp } from '../dynamics' - -export const VxeTableFilterModule = { - Panel: PanelComponent, - install (app: App) { - VXETable.hooks.add('$tableFilter', filterHook) - app.component(PanelComponent.name, PanelComponent) - } -} - -export const Filter = VxeTableFilterModule - -dynamicApp.component(PanelComponent.name, PanelComponent) - -export default VxeTableFilterModule diff --git a/packages/form-gather/index.d.ts b/packages/form-gather/index.d.ts deleted file mode 100644 index 8711426605..0000000000 --- a/packages/form-gather/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeFormGather } from '../../types/form-gather' - -export * from '../../types/form-gather' -export default VxeFormGather diff --git a/packages/form-gather/index.ts b/packages/form-gather/index.ts deleted file mode 100644 index 4e3e831ad3..0000000000 --- a/packages/form-gather/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeFormGatherComponent from '../form/src/form-gather' -import { dynamicApp } from '../dynamics' - -export const VxeFormGather = Object.assign(VxeFormGatherComponent, { - install (app: App) { - app.component(VxeFormGatherComponent.name, VxeFormGatherComponent) - } -}) - -export const FormGather = VxeFormGather - -dynamicApp.component(VxeFormGatherComponent.name, VxeFormGatherComponent) - -export default VxeFormGather diff --git a/packages/form-item/index.d.ts b/packages/form-item/index.d.ts deleted file mode 100644 index ee0b508e37..0000000000 --- a/packages/form-item/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeFormItem } from '../../types/form-item' - -export * from '../../types/form-item' -export default VxeFormItem diff --git a/packages/form-item/index.ts b/packages/form-item/index.ts deleted file mode 100644 index 86cf070b12..0000000000 --- a/packages/form-item/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeFormItemComponent from '../form/src/form-item' -import { dynamicApp } from '../dynamics' - -export const VxeFormItem = Object.assign(VxeFormItemComponent, { - install (app: App) { - app.component(VxeFormItemComponent.name, VxeFormItemComponent) - } -}) - -export const FormItem = VxeFormItem - -dynamicApp.component(VxeFormItemComponent.name, VxeFormItemComponent) - -export default VxeFormItem diff --git a/packages/form/index.d.ts b/packages/form/index.d.ts deleted file mode 100644 index 2b38e3aac3..0000000000 --- a/packages/form/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeForm } from '../../types/form' - -export * from '../../types/form' -export default VxeForm diff --git a/packages/form/index.ts b/packages/form/index.ts deleted file mode 100644 index 669ce4008c..0000000000 --- a/packages/form/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeFormComponent from './src/form' -import { dynamicApp } from '../dynamics' - -export const VxeForm = Object.assign(VxeFormComponent, { - install (app: App) { - app.component(VxeFormComponent.name, VxeFormComponent) - } -}) - -export const Form = VxeForm - -dynamicApp.component(VxeFormComponent.name, VxeFormComponent) - -export default VxeForm diff --git a/packages/form/src/form-config-item.ts b/packages/form/src/form-config-item.ts deleted file mode 100644 index 88dd5c5e27..0000000000 --- a/packages/form/src/form-config-item.ts +++ /dev/null @@ -1,182 +0,0 @@ -import { defineComponent, h, inject, provide, PropType, createCommentVNode } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' -import { getFuncText, isEnableConf } from '../../tools/utils' -import { getSlotVNs } from '../../tools/vn' -import { renderTitle } from './render' -import { isActivetem } from './util' - -import { VxeFormConstructor, VxeFormDefines, VxeFormPrivateMethods, SlotVNodeType } from '../../../types/all' - -const VxeFormConfigItem = defineComponent({ - name: 'VxeFormConfigItem', - props: { - itemConfig: Object as PropType - }, - setup (props) { - const $xeform = inject('$xeform', {} as VxeFormConstructor & VxeFormPrivateMethods) - const xeformiteminfo = { itemConfig: props.itemConfig } - - provide('$xeformiteminfo', xeformiteminfo) - provide('$xeformgather', null) - - const renderVN = () => { - const { reactData } = $xeform - const { data, rules, span: allSpan, align: allAlign, titleAlign: allTitleAlign, titleWidth: allTitleWidth, titleColon: allTitleColon, titleAsterisk: allTitleAsterisk, titleOverflow: allTitleOverflow, vertical: allVertical } = $xeform.props - const { computeValidOpts } = $xeform.getComputeMaps() - const item = props.itemConfig as VxeFormDefines.ItemInfo - const { collapseAll } = reactData - const validOpts = computeValidOpts.value - const { slots, title, visible, folding, field, collapseNode, itemRender, showError, errRule, className, titleOverflow, vertical, children, showTitle, contentClassName, contentStyle, titleClassName, titleStyle } = item - const compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null - const itemClassName = compConf ? compConf.itemClassName : '' - const itemStyle = compConf ? compConf.itemStyle : null - const itemContentClassName = compConf ? compConf.itemContentClassName : '' - const itemContentStyle = compConf ? compConf.itemContentStyle : null - const itemTitleClassName = compConf ? compConf.itemTitleClassName : '' - const itemTitleStyle = compConf ? compConf.itemTitleStyle : null - const defaultSlot = slots ? slots.default : null - const titleSlot = slots ? slots.title : null - const span = item.span || allSpan - const align = item.align || allAlign - const titleAlign = XEUtils.eqNull(item.titleAlign) ? allTitleAlign : item.titleAlign - const titleWidth = XEUtils.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth - const titleColon = XEUtils.eqNull(item.titleColon) ? allTitleColon : item.titleColon - const titleAsterisk = XEUtils.eqNull(item.titleAsterisk) ? allTitleAsterisk : item.titleAsterisk - const itemOverflow = (XEUtils.isUndefined(titleOverflow) || XEUtils.isNull(titleOverflow)) ? allTitleOverflow : titleOverflow - const itemVertical = (XEUtils.isUndefined(vertical) || XEUtils.isNull(vertical)) ? allVertical : vertical - const ovEllipsis = itemOverflow === 'ellipsis' - const ovTitle = itemOverflow === 'title' - const ovTooltip = itemOverflow === true || itemOverflow === 'tooltip' - const hasEllipsis = ovTitle || ovTooltip || ovEllipsis - const params = { data, field, property: field, item, $form: $xeform, $grid: $xeform.xegrid } - if (visible === false) { - return createCommentVNode() - } - let isRequired = false - if (rules) { - const itemRules = rules[field] - if (itemRules) { - isRequired = itemRules.some((rule) => rule.required) - } - } - // 如果为项集合 - const isGather = children && children.length > 0 - if (isGather) { - const childVNs = children.map((childItem, index) => { - return h(VxeFormConfigItem, { - key: index, - itemConfig: childItem - }) - }) - return childVNs.length ? h('div', { - class: ['vxe-form--gather vxe-form--item-row', item.id, span ? `vxe-form--item-col_${span} is--span` : '', className ? (XEUtils.isFunction(className) ? className(params) : className) : ''] - }, childVNs) : createCommentVNode() - } - let contentVNs: SlotVNodeType[] = [] - if (defaultSlot) { - contentVNs = $xeform.callSlot(defaultSlot, params) - } else if (compConf && compConf.renderItemContent) { - contentVNs = getSlotVNs(compConf.renderItemContent(itemRender, params)) - } else if (field) { - contentVNs = [XEUtils.toValueString(XEUtils.get(data, field))] - } - if (collapseNode) { - contentVNs.push( - h('div', { - class: 'vxe-form--item-trigger-node', - onClick: $xeform.toggleCollapseEvent - }, [ - h('span', { - class: 'vxe-form--item-trigger-text' - }, collapseAll ? GlobalConfig.i18n('vxe.form.unfolding') : GlobalConfig.i18n('vxe.form.folding')), - h('i', { - class: ['vxe-form--item-trigger-icon', collapseAll ? GlobalConfig.icon.FORM_FOLDING : GlobalConfig.icon.FORM_UNFOLDING] - }) - ]) - ) - } - if (errRule && validOpts.showMessage) { - contentVNs.push( - h('div', { - class: 'vxe-form--item-valid', - style: errRule.maxWidth ? { - width: `${errRule.maxWidth}px` - } : null - }, errRule.content) - ) - } - const ons = ovTooltip ? { - onMouseenter (evnt: MouseEvent) { - $xeform.triggerTitleTipEvent(evnt, params) - }, - onMouseleave: $xeform.handleTitleTipLeaveEvent - } : {} - return h('div', { - class: [ - 'vxe-form--item', - item.id, - span ? `vxe-form--item-col_${span} is--span` : '', - className ? (XEUtils.isFunction(className) ? className(params) : className) : '', - itemClassName ? (XEUtils.isFunction(itemClassName) ? itemClassName(params) : itemClassName) : '', - { - 'is--title': title, - 'is--colon': titleColon, - 'is--vertical': itemVertical, - 'is--asterisk': titleAsterisk, - 'is--required': isRequired, - 'is--hidden': folding && collapseAll, - 'is--active': isActivetem($xeform, item), - 'is--error': showError - } - ], - style: XEUtils.isFunction(itemStyle) ? itemStyle(params) : itemStyle - }, [ - h('div', { - class: 'vxe-form--item-inner' - }, [ - (showTitle !== false) && (title || titleSlot) ? h('div', { - class: [ - 'vxe-form--item-title', - titleAlign ? `align--${titleAlign}` : '', - hasEllipsis ? 'is--ellipsis' : '', - itemTitleClassName ? (XEUtils.isFunction(itemTitleClassName) ? itemTitleClassName(params) : itemTitleClassName) : '', - titleClassName ? (XEUtils.isFunction(titleClassName) ? titleClassName(params) : titleClassName) : '' - ], - style: Object.assign( - {}, - XEUtils.isFunction(itemTitleStyle) ? itemTitleStyle(params) : itemTitleStyle, - XEUtils.isFunction(titleStyle) ? titleStyle(params) : titleStyle, - titleWidth ? { - width: isNaN(titleWidth as number) ? titleWidth : `${titleWidth}px` - } : null - ), - title: ovTitle ? getFuncText(title) : null, - ...ons - }, renderTitle($xeform, item)) : null, - h('div', { - class: [ - 'vxe-form--item-content', - align ? `align--${align}` : '', - itemContentClassName ? (XEUtils.isFunction(itemContentClassName) ? itemContentClassName(params) : itemContentClassName) : '', - contentClassName ? (XEUtils.isFunction(contentClassName) ? contentClassName(params) : contentClassName) : '' - ], - style: Object.assign({}, XEUtils.isFunction(itemContentStyle) ? itemContentStyle(params) : itemContentStyle, XEUtils.isFunction(contentStyle) ? contentStyle(params) : contentStyle) - }, contentVNs) - ]) - ]) - } - - const $xeformconfigitem = { - renderVN - } - - return $xeformconfigitem - }, - render () { - return this.renderVN() - } -}) - -export default VxeFormConfigItem diff --git a/packages/form/src/form-gather.ts b/packages/form/src/form-gather.ts deleted file mode 100644 index 29c022b04d..0000000000 --- a/packages/form/src/form-gather.ts +++ /dev/null @@ -1,53 +0,0 @@ -import { defineComponent, h, onUnmounted, inject, ref, Ref, reactive, onMounted, provide } from 'vue' -import { createItem, watchItem, destroyItem, assemItem, XEFormItemProvide } from './util' -import { formItemProps } from './form-item' -import XEUtils from 'xe-utils' - -import { VxeFormConstructor, VxeFormPrivateMethods } from '../../../types/all' - -export default defineComponent({ - name: 'VxeFormGather', - props: formItemProps, - setup (props, { slots }) { - const refElem = ref() as Ref - const $xeform = inject('$xeform', {} as VxeFormConstructor & VxeFormPrivateMethods) - const formGather = inject('$xeformgather', null as XEFormItemProvide | null) - const defaultSlot = slots.default - const formItem = reactive(createItem($xeform, props)) - const xeformitem: XEFormItemProvide = { formItem } - const xeformiteminfo = { itemConfig: formItem } - formItem.children = [] - - provide('$xeformiteminfo', xeformiteminfo) - provide('$xeformgather', xeformitem) - provide('$xeformitem', null) - - watchItem(props, formItem) - - onMounted(() => { - assemItem($xeform, refElem.value, formItem, formGather) - }) - - onUnmounted(() => { - destroyItem($xeform, formItem) - }) - - const renderVN = () => { - const { className, field } = props - const span = props.span || ($xeform ? $xeform.props.span : null) - return h('div', { - ref: refElem, - class: ['vxe-form--gather vxe-form--item-row', formItem.id, span ? `vxe-form--item-col_${span} is--span` : '', className ? (XEUtils.isFunction(className) ? className({ $form: $xeform, data: $xeform ? $xeform.props.data : {}, item: formItem as any, field: field as string, property: field as string }) : className) : ''] - }, defaultSlot ? defaultSlot() : []) - } - - const $xeformgather = { - renderVN - } - - return $xeformgather - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/form/src/form-item.ts b/packages/form/src/form-item.ts deleted file mode 100644 index 8305793375..0000000000 --- a/packages/form/src/form-item.ts +++ /dev/null @@ -1,241 +0,0 @@ -import { defineComponent, h, onUnmounted, inject, ref, Ref, provide, onMounted, PropType, createCommentVNode, reactive } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' -import { getFuncText, isEnableConf } from '../../tools/utils' -import { getSlotVNs } from '../../tools/vn' -import { createItem, watchItem, destroyItem, assemItem, XEFormItemProvide, isActivetem } from './util' -import { renderTitle } from './render' - -import { SlotVNodeType, VxeFormConstructor, VxeFormDefines, VxeFormItemPropTypes, VxeFormPrivateMethods } from '../../../types/all' - -export const formItemProps = { - title: String as PropType, - field: String as PropType, - span: [String, Number] as PropType, - align: String as PropType, - titleAlign: { - type: String as PropType, - default: null - }, - titleWidth: { - type: [String, Number] as PropType, - default: null - }, - titleColon: { - type: Boolean as PropType, - default: null - }, - titleAsterisk: { - type: Boolean as PropType, - default: null - }, - showTitle: { - type: Boolean as PropType, - default: true - }, - vertical: { - type: Boolean as PropType, - default: null - }, - className: [String, Function] as PropType, - contentClassName: [String, Function] as PropType, - contentStyle: [Object, Function] as PropType, - titleClassName: [String, Function] as PropType, - titleStyle: [Object, Function] as PropType, - titleOverflow: { - type: [Boolean, String] as PropType, - default: null - }, - titlePrefix: Object as PropType, - titleSuffix: Object as PropType, - resetValue: { default: null }, - visibleMethod: Function as PropType, - visible: { type: Boolean as PropType, default: null }, - folding: Boolean as PropType, - collapseNode: Boolean as PropType, - itemRender: Object as PropType, - rules: Array as PropType -} - -export default defineComponent({ - name: 'VxeFormItem', - props: formItemProps, - setup (props, { slots }) { - const refElem = ref() as Ref - const $xeform = inject('$xeform', {} as VxeFormConstructor & VxeFormPrivateMethods) - const formGather = inject('$xeformgather', null as XEFormItemProvide | null) - const formItem = reactive(createItem($xeform, props)) - const xeformitem: XEFormItemProvide = { formItem } - const xeformiteminfo = { itemConfig: formItem } - formItem.slots = slots - - provide('$xeformiteminfo', xeformiteminfo) - provide('$xeformitem', xeformitem) - provide('$xeformgather', null) - - watchItem(props, formItem) - - onMounted(() => { - assemItem($xeform, refElem.value, formItem, formGather) - }) - - onUnmounted(() => { - destroyItem($xeform, formItem) - }) - - const renderItem = ($xeform: VxeFormConstructor & VxeFormPrivateMethods, item: VxeFormDefines.ItemInfo) => { - const { props, reactData } = $xeform - const { data, rules, titleAlign: allTitleAlign, titleWidth: allTitleWidth, titleColon: allTitleColon, titleAsterisk: allTitleAsterisk, titleOverflow: allTitleOverflow, vertical: allVertical } = props - const { collapseAll } = reactData - const { computeValidOpts } = $xeform.getComputeMaps() - const validOpts = computeValidOpts.value - const { slots, title, visible, folding, field, collapseNode, itemRender, showError, errRule, className, titleOverflow, vertical, showTitle, contentClassName, contentStyle, titleClassName, titleStyle } = item - const compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null - const itemClassName = compConf ? compConf.itemClassName : '' - const itemStyle = compConf ? compConf.itemStyle : null - const itemContentClassName = compConf ? compConf.itemContentClassName : '' - const itemContentStyle = compConf ? compConf.itemContentStyle : null - const itemTitleClassName = compConf ? compConf.itemTitleClassName : '' - const itemTitleStyle = compConf ? compConf.itemTitleStyle : null - const defaultSlot = slots ? slots.default : null - const titleSlot = slots ? slots.title : null - const span = item.span || props.span - const align = item.align || props.align - const titleAlign = XEUtils.eqNull(item.titleAlign) ? allTitleAlign : item.titleAlign - const titleWidth = XEUtils.eqNull(item.titleWidth) ? allTitleWidth : item.titleWidth - const titleColon = XEUtils.eqNull(item.titleColon) ? allTitleColon : item.titleColon - const titleAsterisk = XEUtils.eqNull(item.titleAsterisk) ? allTitleAsterisk : item.titleAsterisk - const itemOverflow = (XEUtils.isUndefined(titleOverflow) || XEUtils.isNull(titleOverflow)) ? allTitleOverflow : titleOverflow - const itemVertical = (XEUtils.isUndefined(vertical) || XEUtils.isNull(vertical)) ? allVertical : vertical - const ovEllipsis = itemOverflow === 'ellipsis' - const ovTitle = itemOverflow === 'title' - const ovTooltip = itemOverflow === true || itemOverflow === 'tooltip' - const hasEllipsis = ovTitle || ovTooltip || ovEllipsis - const params = { data, field, property: field, item, $form: $xeform, $grid: $xeform.xegrid } - let isRequired = false - if (visible === false) { - return createCommentVNode() - } - if (rules) { - const itemRules = rules[field] - if (itemRules) { - isRequired = itemRules.some((rule) => rule.required) - } - } - let contentVNs: SlotVNodeType[] = [] - if (defaultSlot) { - contentVNs = $xeform.callSlot(defaultSlot, params) - } else if (compConf && compConf.renderItemContent) { - contentVNs = getSlotVNs(compConf.renderItemContent(itemRender, params)) - } else if (field) { - contentVNs = [`${XEUtils.get(data, field)}`] - } - if (collapseNode) { - contentVNs.push( - h('div', { - class: 'vxe-form--item-trigger-node', - onClick: $xeform.toggleCollapseEvent - }, [ - h('span', { - class: 'vxe-form--item-trigger-text' - }, collapseAll ? GlobalConfig.i18n('vxe.form.unfolding') : GlobalConfig.i18n('vxe.form.folding')), - h('i', { - class: ['vxe-form--item-trigger-icon', collapseAll ? GlobalConfig.icon.FORM_FOLDING : GlobalConfig.icon.FORM_UNFOLDING] - }) - ]) - ) - } - if (errRule && validOpts.showMessage) { - contentVNs.push( - h('div', { - class: 'vxe-form--item-valid', - style: errRule.maxWidth ? { - width: `${errRule.maxWidth}px` - } : null - }, errRule.message) - ) - } - const ons = ovTooltip ? { - onMouseenter (evnt: MouseEvent) { - $xeform.triggerTitleTipEvent(evnt, params) - }, - onMouseleave: $xeform.handleTitleTipLeaveEvent - } : {} - return h('div', { - ref: refElem, - class: [ - 'vxe-form--item', - item.id, - span ? `vxe-form--item-col--${span} is--span` : '', - className ? (XEUtils.isFunction(className) ? className(params) : className) : '', - itemClassName ? (XEUtils.isFunction(itemClassName) ? itemClassName(params) : itemClassName) : '', - { - 'is--title': title, - 'is--colon': titleColon, - 'is--vertical': itemVertical, - 'is--asterisk': titleAsterisk, - 'is--required': isRequired, - 'is--hidden': folding && collapseAll, - 'is--active': isActivetem($xeform, item), - 'is--error': showError - } - ], - style: XEUtils.isFunction(itemStyle) ? itemStyle(params) : itemStyle - }, [ - h('div', { - class: 'vxe-form--item-inner' - }, [ - (showTitle !== false) && (title || titleSlot) ? h('div', { - class: [ - 'vxe-form--item-title', - titleAlign ? `align--${titleAlign}` : '', - hasEllipsis ? 'is--ellipsis' : '', - itemTitleClassName ? (XEUtils.isFunction(itemTitleClassName) ? itemTitleClassName(params) : itemTitleClassName) : '', - titleClassName ? (XEUtils.isFunction(titleClassName) ? titleClassName(params) : titleClassName) : '' - ], - style: Object.assign( - {}, - XEUtils.isFunction(itemTitleStyle) ? itemTitleStyle(params) : itemTitleStyle, - XEUtils.isFunction(titleStyle) ? titleStyle(params) : titleStyle, - titleWidth ? { - width: isNaN(titleWidth as number) ? titleWidth : `${titleWidth}px` - } : null - ), - title: ovTitle ? getFuncText(title) : null, - ...ons - }, renderTitle($xeform, item)) : null, - h('div', { - class: [ - 'vxe-form--item-content', - align ? `align--${align}` : '', - itemContentClassName ? (XEUtils.isFunction(itemContentClassName) ? itemContentClassName(params) : itemContentClassName) : '', - contentClassName ? (XEUtils.isFunction(contentClassName) ? contentClassName(params) : contentClassName) : '' - ], - style: Object.assign( - {}, - XEUtils.isFunction(itemContentStyle) ? itemContentStyle(params) : itemContentStyle, - XEUtils.isFunction(contentStyle) ? contentStyle(params) : contentStyle - ) - }, contentVNs) - ]) - ]) - } - - const renderVN = () => { - const formProps = $xeform ? $xeform.props : null - return formProps && formProps.customLayout ? renderItem($xeform, formItem as unknown as VxeFormDefines.ItemInfo) : h('div', { - ref: refElem - }) - } - - const $xeformitem = { - renderVN - } - - return $xeformitem - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/form/src/form.ts b/packages/form/src/form.ts deleted file mode 100644 index 2943d59c91..0000000000 --- a/packages/form/src/form.ts +++ /dev/null @@ -1,713 +0,0 @@ -import { defineComponent, h, ref, Ref, createCommentVNode, provide, computed, inject, reactive, watch, nextTick, PropType, onMounted } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' -import { getFuncText, isEnableConf, eqEmptyValue } from '../../tools/utils' -import { errLog, warnLog } from '../../tools/log' -import { scrollToView } from '../../tools/dom' -import { createItem, handleFieldOrItem, isHiddenItem, isActivetem } from './util' -import { useSize } from '../../hooks/size' -import VxeTooltipComponent from '../../tooltip' -import VxeFormConfigItem from './form-config-item' -import VxeLoading from '../../loading/index' -import { getSlotVNs } from '../../tools/vn' - -import { VxeFormConstructor, VxeFormPropTypes, VxeFormEmits, FormReactData, FormMethods, FormPrivateRef, VxeFormPrivateMethods, VxeFormDefines, VxeFormItemPropTypes, VxeTooltipInstance, FormInternalData, VxeFormPrivateComputed, VxeGridConstructor, VxeGridPrivateMethods } from '../../../types/all' - -class Rule { - constructor (rule: any) { - Object.assign(this, { - $options: rule, - required: rule.required, - min: rule.min, - max: rule.min, - type: rule.type, - pattern: rule.pattern, - validator: rule.validator, - trigger: rule.trigger, - maxWidth: rule.maxWidth - }) - } - - get content () { - return getFuncText(this.$options.content || this.$options.message) - } - - get message () { - return this.content - } - - [key: string]: any -} - -const validErrorRuleValue = (rule: VxeFormDefines.FormRule, val: any) => { - const { type, min, max, pattern } = rule - const isNumType = type === 'number' - const numVal = isNumType ? XEUtils.toNumber(val) : XEUtils.getSize(val) - // 判断数值 - if (isNumType && isNaN(val)) { - return true - } - // 如果存在 min，判断最小值 - if (!XEUtils.eqNull(min) && numVal < XEUtils.toNumber(min)) { - return true - } - // 如果存在 max，判断最大值 - if (!XEUtils.eqNull(max) && numVal > XEUtils.toNumber(max)) { - return true - } - // 如果存在 pattern，正则校验 - if (pattern && !(XEUtils.isRegExp(pattern) ? pattern : new RegExp(pattern)).test(val)) { - return true - } - return false -} - -function getResetValue (value: any, resetValue: any) { - if (XEUtils.isArray(value)) { - resetValue = [] - } - return resetValue -} - -export default defineComponent({ - name: 'VxeForm', - props: { - collapseStatus: { type: Boolean as PropType, default: true }, - loading: Boolean as PropType, - data: Object as PropType, - size: { type: String as PropType, default: () => GlobalConfig.form.size || GlobalConfig.size }, - span: { type: [String, Number] as PropType, default: () => GlobalConfig.form.span }, - align: { type: String as PropType, default: () => GlobalConfig.form.align }, - titleAlign: { type: String as PropType, default: () => GlobalConfig.form.titleAlign }, - titleWidth: { type: [String, Number] as PropType, default: () => GlobalConfig.form.titleWidth }, - titleColon: { type: Boolean as PropType, default: () => GlobalConfig.form.titleColon }, - titleAsterisk: { type: Boolean as PropType, default: () => GlobalConfig.form.titleAsterisk }, - titleOverflow: { type: [Boolean, String] as PropType, default: null }, - vertical: { - type: Boolean as PropType, - default: null - }, - className: [String, Function] as PropType, - readonly: Boolean as PropType, - items: Array as PropType, - rules: Object as PropType, - preventSubmit: { type: Boolean as PropType, default: () => GlobalConfig.form.preventSubmit }, - validConfig: Object as PropType, - tooltipConfig: Object as PropType, - customLayout: { type: Boolean as PropType, default: () => GlobalConfig.form.customLayout } - }, - emits: [ - 'update:collapseStatus', - 'collapse', - 'toggle-collapse', - 'submit', - 'submit-invalid', - 'reset' - ] as VxeFormEmits, - setup (props, context) { - const hasUseTooltip = VXETable.tooltip - - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - collapseAll: props.collapseStatus, - staticItems: [], - formItems: [] - }) - - const internalData = reactive({ - tooltipTimeout: null, - tooltipStore: { - item: null, - visible: false - } - }) - - const $xegrid = inject<(VxeGridConstructor & VxeGridPrivateMethods) | null>('$xegrid', null) - - const refElem = ref() as Ref - const refTooltip = ref() as Ref - - let formMethods = {} as FormMethods - - const computeValidOpts = computed(() => { - return Object.assign({}, GlobalConfig.form.validConfig, props.validConfig) - }) - - const computeTooltipOpts = computed(() => { - return Object.assign({}, GlobalConfig.tooltip, GlobalConfig.form.tooltipConfig, props.tooltipConfig) - }) - - const refMaps: FormPrivateRef = { - refElem - } - - const computeMaps: VxeFormPrivateComputed = { - computeSize, - computeValidOpts, - computeTooltipOpts - } - - const $xeform = { - xID, - props, - context, - reactData, - - xegrid: $xegrid, - getRefMaps: () => refMaps, - getComputeMaps: () => computeMaps - } as unknown as VxeFormConstructor & VxeFormPrivateMethods - - const callSlot = (slotFunc: ((params: any) => any) | string | null, params: any) => { - if (slotFunc) { - if (XEUtils.isString(slotFunc)) { - slotFunc = slots[slotFunc] || null - } - if (XEUtils.isFunction(slotFunc)) { - return getSlotVNs(slotFunc(params)) - } - } - return [] - } - - const loadItem = (list: VxeFormPropTypes.Items) => { - if (list.length) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - list.forEach((item) => { - if (item.slots) { - XEUtils.each(item.slots, (func) => { - if (!XEUtils.isFunction(func)) { - if (!slots[func]) { - errLog('vxe.error.notSlot', [func]) - } - } - }) - } - }) - } - } - reactData.staticItems = XEUtils.mapTree(list, item => createItem($xeform, item), { children: 'children' }) - return nextTick() - } - - const getItems = () => { - const itemList: VxeFormDefines.ItemInfo[] = [] - XEUtils.eachTree(reactData.formItems, item => { - itemList.push(item) - }, { children: 'children' }) - return itemList - } - - const getItemByField = (field: string) => { - const rest = XEUtils.findTree(reactData.formItems, item => item.field === field, { children: 'children' }) - return rest ? rest.item : null - } - - const getCollapseStatus = () => { - return reactData.collapseAll - } - - const toggleCollapse = () => { - const status = !getCollapseStatus() - reactData.collapseAll = status - emit('update:collapseStatus', status) - return nextTick() - } - - const toggleCollapseEvent = (evnt: Event) => { - toggleCollapse() - const status = getCollapseStatus() - formMethods.dispatchEvent('toggle-collapse', { status, collapse: status, data: props.data }, evnt) - formMethods.dispatchEvent('collapse', { status, collapse: status, data: props.data }, evnt) - } - - const clearValidate = (fieldOrItem?: VxeFormItemPropTypes.Field | VxeFormItemPropTypes.Field[] | VxeFormDefines.ItemInfo | VxeFormDefines.ItemInfo[]) => { - if (fieldOrItem) { - let fields: any = fieldOrItem - if (!XEUtils.isArray(fieldOrItem)) { - fields = [fieldOrItem] - } - fields.forEach((field: any) => { - if (field) { - const item = handleFieldOrItem($xeform, field) - if (item) { - item.showError = false - } - } - }) - } else { - getItems().forEach((item) => { - item.showError = false - }) - } - return nextTick() - } - - const reset = () => { - const { data } = props - const itemList = getItems() - if (data) { - itemList.forEach((item) => { - const { field, resetValue, itemRender } = item - if (isEnableConf(itemRender)) { - const compConf = VXETable.renderer.get(itemRender.name) - if (compConf && compConf.itemResetMethod) { - compConf.itemResetMethod({ data, field, property: field, item, $form: $xeform, $grid: $xeform.xegrid }) - } else if (field) { - XEUtils.set(data, field, resetValue === null ? getResetValue(XEUtils.get(data, field), undefined) : XEUtils.clone(resetValue, true)) - } - } - }) - } - return clearValidate() - } - - const resetEvent = (evnt: Event) => { - evnt.preventDefault() - reset() - formMethods.dispatchEvent('reset', { data: props.data }, evnt) - } - - const handleFocus = (fields: string[]) => { - const el = refElem.value - for (let i = 0; i < fields.length; i++) { - const property = fields[i] - const item = getItemByField(property) - if (item && isEnableConf(item.itemRender)) { - const { itemRender } = item - const compConf = VXETable.renderer.get(itemRender.name) - let inputElem: HTMLInputElement | null = null - // 定位到第一个 - if (!i) { - scrollToView(el.querySelector(`.${item.id}`)) - } - // 如果指定了聚焦 class - if (itemRender.autofocus) { - inputElem = el.querySelector(`.${item.id} ${itemRender.autofocus}`) as HTMLInputElement - } - // 渲染器的聚焦处理 - if (!inputElem && compConf && compConf.autofocus) { - inputElem = el.querySelector(`.${item.id} ${compConf.autofocus}`) as HTMLInputElement - } - if (inputElem) { - inputElem.focus() - break - } - } - } - } - - /** - * 校验数据 - * 按表格行、列顺序依次校验（同步或异步） - * 校验规则根据索引顺序依次校验，如果是异步则会等待校验完成才会继续校验下一列 - * 如果校验失败则，触发回调或者 Promise<(ErrMap 校验不通过列的信息)> - * 如果是传回调方式这返回一个 (ErrMap 校验不通过列的信息) - * - * rule 配置： - * required=Boolean 是否必填 - * min=Number 最小长度 - * max=Number 最大长度 - * validator=Function({ itemValue, rule, rules, data, property }) 自定义校验，接收一个 Promise - * trigger=change 触发方式 - */ - const validItemRules = (validType: string, fields: string | string[], val?: any): Promise => { - const { data, rules: formRules } = props - const errorMaps: VxeFormDefines.ValidateErrorMapParams = {} - if (!XEUtils.isArray(fields)) { - fields = [fields] - } - return Promise.all( - fields.map((property) => { - const errorRules: Rule[] = [] - const syncVailds: Promise[] = [] - if (property && formRules) { - const rules = XEUtils.get(formRules, property) - if (rules) { - const itemValue = XEUtils.isUndefined(val) ? XEUtils.get(data, property) : val - rules.forEach((rule) => { - const { type, trigger, required, validator } = rule - if (validType === 'all' || !trigger || validType === trigger) { - if (validator) { - const validParams = { - itemValue, - rule, - rules, - data, - field: property, - property, - $form: $xeform - } - let customValid: any - if (XEUtils.isString(validator)) { - const gvItem = VXETable.validators.get(validator) - if (gvItem) { - if (gvItem.itemValidatorMethod) { - customValid = gvItem.itemValidatorMethod(validParams) - } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - warnLog('vxe.error.notValidators', [validator]) - } - } - } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - errLog('vxe.error.notValidators', [validator]) - } - } - } else { - customValid = validator(validParams) - } - if (customValid) { - if (XEUtils.isError(customValid)) { - errorRules.push(new Rule({ type: 'custom', trigger, content: customValid.message, rule: new Rule(rule) })) - } else if (customValid.catch) { - // 如果为异步校验（注：异步校验是并发无序的） - syncVailds.push( - customValid.catch((e: any) => { - errorRules.push(new Rule({ type: 'custom', trigger, content: e ? e.message : (rule.content || rule.message), rule: new Rule(rule) })) - }) - ) - } - } - } else { - const isArrType = type === 'array' - const isArrVal = XEUtils.isArray(itemValue) - let hasEmpty = true - if (isArrType || isArrVal) { - hasEmpty = !isArrVal || !itemValue.length - } else if (XEUtils.isString(itemValue)) { - hasEmpty = eqEmptyValue(itemValue.trim()) - } else { - hasEmpty = eqEmptyValue(itemValue) - } - if (required ? (hasEmpty || validErrorRuleValue(rule, itemValue)) : (!hasEmpty && validErrorRuleValue(rule, itemValue))) { - errorRules.push(new Rule(rule)) - } - } - } - }) - } - } - return Promise.all(syncVailds).then(() => { - if (errorRules.length) { - errorMaps[property] = errorRules.map(rule => { - return { - $form: $xeform, - rule, - data, - field: property, - property - } - }) - } - }) - }) - ).then(() => { - if (!XEUtils.isEmpty(errorMaps)) { - return Promise.reject(errorMaps) - } - }) - } - - let showErrTime: number - - const beginValidate = (itemList: VxeFormDefines.ItemInfo[], type?: string, callback?: any): Promise => { - const { data, rules: formRules } = props - const validOpts = computeValidOpts.value - const validRest: any = {} - const validFields: string[] = [] - const itemValids: any[] = [] - clearTimeout(showErrTime) - if (data && formRules) { - itemList.forEach((item) => { - const { field } = item - if (field && !isHiddenItem($xeform, item) && isActivetem($xeform, item)) { - itemValids.push( - validItemRules(type || 'all', field).then(() => { - item.errRule = null - }).catch((errorMaps: VxeFormDefines.ValidateErrorMapParams) => { - const rest = errorMaps[field] - if (!validRest[field]) { - validRest[field] = [] - } - validRest[field].push(rest) - validFields.push(field) - item.errRule = rest[0].rule - return Promise.reject(rest) - }) - ) - } - }) - return Promise.all(itemValids).then(() => { - if (callback) { - callback() - } - }).catch(() => { - return new Promise((resolve) => { - showErrTime = window.setTimeout(() => { - itemList.forEach((item) => { - if (item.errRule) { - item.showError = true - } - }) - }, 20) - if (validOpts.autoPos !== false) { - nextTick(() => { - handleFocus(validFields) - }) - } - if (callback) { - callback(validRest) - resolve() - } else { - resolve(validRest) - } - }) - }) - } - if (callback) { - callback() - } - return Promise.resolve() - } - - const validate = (callback: any) => { - clearValidate() - return beginValidate(getItems(), '', callback) - } - - const validateField = (fieldOrItem: VxeFormItemPropTypes.Field | VxeFormItemPropTypes.Field[] | VxeFormDefines.ItemInfo | VxeFormDefines.ItemInfo[], callback: any) => { - let fields: any[] = [] - if (XEUtils.isArray(fieldOrItem)) { - fields = fieldOrItem - } else { - fields = [fieldOrItem] - } - return beginValidate(fields.map(field => handleFieldOrItem($xeform, field) as VxeFormDefines.ItemInfo), '', callback) - } - - const submitEvent = (evnt: Event) => { - evnt.preventDefault() - if (!props.preventSubmit) { - clearValidate() - beginValidate(getItems()).then((errMap) => { - if (errMap) { - formMethods.dispatchEvent('submit-invalid', { data: props.data, errMap }, evnt) - } else { - formMethods.dispatchEvent('submit', { data: props.data }, evnt) - } - }) - } - } - - const closeTooltip = () => { - const { tooltipStore } = internalData - const $tooltip = refTooltip.value - if (tooltipStore.visible) { - Object.assign(tooltipStore, { - item: null, - visible: false - }) - if ($tooltip) { - $tooltip.close() - } - } - return nextTick() - } - - const triggerTitleTipEvent = (evnt: MouseEvent, params: { - item: VxeFormDefines.ItemInfo; - }) => { - const { item } = params - const { tooltipStore } = internalData - const $tooltip = refTooltip.value - const overflowElem = (evnt.currentTarget as HTMLDivElement).children[0] - const content = (overflowElem.textContent || '').trim() - const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth - clearTimeout(internalData.tooltipTimeout) - if (tooltipStore.item !== item) { - closeTooltip() - } - if (content && isCellOverflow) { - Object.assign(tooltipStore, { - item, - visible: true - }) - if ($tooltip) { - $tooltip.open(overflowElem, content) - } - } - } - - const handleTitleTipLeaveEvent = () => { - const tooltipOpts = computeTooltipOpts.value - let $tooltip = refTooltip.value - if ($tooltip) { - $tooltip.setActived(false) - } - if (tooltipOpts.enterable) { - internalData.tooltipTimeout = setTimeout(() => { - $tooltip = refTooltip.value - if ($tooltip && !$tooltip.isActived()) { - closeTooltip() - } - }, tooltipOpts.leaveDelay) - } else { - closeTooltip() - } - } - - const triggerItemEvent = (evnt: Event, field: string, itemValue?: any) => { - if (field) { - return validItemRules(evnt ? (['blur'].includes(evnt.type) ? 'blur' : 'change') : 'all', field, itemValue) - .then(() => { - clearValidate(field) - }) - .catch((errorMaps: VxeFormDefines.ValidateErrorMapParams) => { - const rest = errorMaps[field] - const item = getItemByField(field) - if (rest && item) { - item.showError = true - item.errRule = rest[0].rule - } - }) - } - return nextTick() - } - - /** - * 更新项状态 - * 如果组件值 v-model 发生 change 时，调用改函数用于更新某一项编辑状态 - * 如果单元格配置了校验规则，则会进行校验 - */ - const updateStatus = (scope: any, itemValue?: any) => { - const { field } = scope - return triggerItemEvent(new Event('change'), field, itemValue) - } - - formMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $form: $xeform, $grid: $xegrid, $event: evnt }, params)) - }, - reset, - validate, - validateField, - clearValidate, - updateStatus, - toggleCollapse, - getItems, - getItemByField, - closeTooltip - } - - const formPrivateMethods: VxeFormPrivateMethods = { - callSlot, - triggerItemEvent, - toggleCollapseEvent, - triggerTitleTipEvent, - handleTitleTipLeaveEvent - } - - Object.assign($xeform, formMethods, formPrivateMethods) - - const staticItemFlag = ref(0) - watch(() => reactData.staticItems.length, () => { - staticItemFlag.value++ - }) - watch(() => reactData.staticItems, () => { - staticItemFlag.value++ - }) - watch(staticItemFlag, () => { - reactData.formItems = reactData.staticItems - }) - - const itemFlag = ref(0) - watch(() => props.items ? props.items.length : -1, () => { - itemFlag.value++ - }) - watch(() => props.items, () => { - itemFlag.value++ - }) - watch(itemFlag, () => { - loadItem(props.items || []) - }) - - watch(() => props.collapseStatus, (value) => { - reactData.collapseAll = !!value - }) - - onMounted(() => { - nextTick(() => { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (props.customLayout && props.items) { - errLog('vxe.error.errConflicts', ['custom-layout', 'items']) - } - } - loadItem(props.items || []) - }) - }) - - const renderVN = () => { - const { loading, className, data, customLayout } = props - const { formItems } = reactData - // const formItems: any[] = [] - const vSize = computeSize.value - const tooltipOpts = computeTooltipOpts.value - const defaultSlot = slots.default - return h('form', { - ref: refElem, - class: ['vxe-form', className ? (XEUtils.isFunction(className) ? className({ items: formItems, data, $form: $xeform }) : className) : '', { - [`size--${vSize}`]: vSize, - 'is--loading': loading - }], - onSubmit: submitEvent, - onReset: resetEvent - }, [ - h('div', { - class: 'vxe-form--wrapper vxe-form--item-row' - }, customLayout ? (defaultSlot ? defaultSlot({}) : []) : formItems.map((item, index) => { - return h(VxeFormConfigItem, { - key: index, - itemConfig: item - }) - })), - h('div', { - class: 'vxe-form-slots', - ref: 'hideItem' - }, customLayout ? [] : (defaultSlot ? defaultSlot({}) : [])), - /** - * 加载中 - */ - h(VxeLoading, { - class: 'vxe-form--loading', - modelValue: loading - }), - /** - * 工具提示 - */ - hasUseTooltip ? h(VxeTooltipComponent, { - ref: refTooltip, - ...tooltipOpts - }) : createCommentVNode() - ]) - } - - $xeform.renderVN = renderVN - - provide('$xeform', $xeform) - provide('$xeformgather', null) - provide('$xeformitem', null) - provide('$xeformiteminfo', null) - - return $xeform - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/form/src/itemInfo.ts b/packages/form/src/itemInfo.ts deleted file mode 100644 index e3341a9592..0000000000 --- a/packages/form/src/itemInfo.ts +++ /dev/null @@ -1,44 +0,0 @@ -import XEUtils from 'xe-utils' - -export class ItemInfo { - constructor ($xeform: any, item: any) { - Object.assign(this, { - id: XEUtils.uniqueId('item_'), - title: item.title, - field: item.field, - span: item.span, - align: item.align, - titleAlign: item.titleAlign, - titleWidth: item.titleWidth, - titleColon: item.titleColon, - titleAsterisk: item.titleAsterisk, - titlePrefix: item.titlePrefix, - titleSuffix: item.titleSuffix, - titleOverflow: item.titleOverflow, - showTitle: item.showTitle, - resetValue: item.resetValue, - visibleMethod: item.visibleMethod, - visible: item.visible, - folding: item.folding, - collapseNode: item.collapseNode, - className: item.className, - contentClassName: item.contentClassName, - contentStyle: item.contentStyle, - titleClassName: item.titleClassName, - titleStyle: item.titleStyle, - itemRender: item.itemRender, - rules: item.rules, - // 渲染属性 - showError: false, - errRule: null, - slots: item.slots, - children: [] - }) - } - - update (name: string, value: any) { - this[name] = value - } - - [key: string]: any; -} diff --git a/packages/form/src/render.ts b/packages/form/src/render.ts deleted file mode 100644 index c13289d044..0000000000 --- a/packages/form/src/render.ts +++ /dev/null @@ -1,83 +0,0 @@ -import { h } from 'vue' -import GlobalConfig from '../../v-x-e-table/src/conf' -import VxeTooltipComponent from '../../tooltip' -import { VXETable } from '../../v-x-e-table' -import { getFuncText, isEnableConf } from '../../tools/utils' -import { getSlotVNs } from '../../tools/vn' - -import { VxeFormConstructor, VxeFormDefines, VxeFormItemPropTypes, VxeFormPrivateMethods } from '../../../types/all' - -function renderPrefixIcon (titlePrefix: VxeFormItemPropTypes.TitlePrefix) { - return h('span', { - class: 'vxe-form--item-title-prefix' - }, [ - h('i', { - class: titlePrefix.icon || GlobalConfig.icon.FORM_PREFIX - }) - ]) -} - -function renderSuffixIcon (titleSuffix: VxeFormItemPropTypes.TitleSuffix) { - return h('span', { - class: 'vxe-form--item-title-suffix' - }, [ - h('i', { - class: titleSuffix.icon || GlobalConfig.icon.FORM_SUFFIX - }) - ]) -} - -export function renderTitle ($xeform: VxeFormConstructor & VxeFormPrivateMethods, item: VxeFormDefines.ItemInfo) { - const { data } = $xeform.props - const { computeTooltipOpts } = $xeform.getComputeMaps() - const { slots, field, itemRender, titlePrefix, titleSuffix } = item - const tooltipOpts = computeTooltipOpts.value - const compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null - const params = { data, field, property: field, item, $form: $xeform, $grid: $xeform.xegrid } - const titleSlot = slots ? slots.title : null - const contVNs = [] - const titVNs = [] - if (titlePrefix) { - titVNs.push( - (titlePrefix.content || titlePrefix.message) - ? h(VxeTooltipComponent, { - ...tooltipOpts, - ...titlePrefix, - content: getFuncText(titlePrefix.content || titlePrefix.message) - }, { - default: () => renderPrefixIcon(titlePrefix) - }) - : renderPrefixIcon(titlePrefix) - ) - } - titVNs.push( - h('span', { - class: 'vxe-form--item-title-label' - }, compConf && compConf.renderItemTitle ? getSlotVNs(compConf.renderItemTitle(itemRender, params)) : (titleSlot ? $xeform.callSlot(titleSlot, params) : getFuncText(item.title))) - ) - contVNs.push( - h('div', { - class: 'vxe-form--item-title-content' - }, titVNs) - ) - const fixVNs = [] - if (titleSuffix) { - fixVNs.push( - (titleSuffix.content || titleSuffix.message) - ? h(VxeTooltipComponent, { - ...tooltipOpts, - ...titleSuffix, - content: getFuncText(titleSuffix.content || titleSuffix.message) - }, { - default: () => renderSuffixIcon(titleSuffix) - }) - : renderSuffixIcon(titleSuffix) - ) - } - contVNs.push( - h('div', { - class: 'vxe-form--item-title-postfix' - }, fixVNs) - ) - return contVNs -} diff --git a/packages/form/src/util.ts b/packages/form/src/util.ts deleted file mode 100644 index bb9f7f9a53..0000000000 --- a/packages/form/src/util.ts +++ /dev/null @@ -1,79 +0,0 @@ -import { watch } from 'vue' -import { VXETable } from '../../v-x-e-table' -import XEUtils from 'xe-utils' -import { ItemInfo } from './itemInfo' -import { isEnableConf } from '../../tools/utils' - -import { VxeFormConstructor, VxeFormDefines } from '../../../types/all' - -export interface XEFormItemProvide { - formItem: ItemInfo; -} - -export function isFormItem (item: any): item is ItemInfo { - return item instanceof ItemInfo -} - -export function createItem ($xeform: VxeFormConstructor, _vm: any) { - return isFormItem(_vm) ? _vm : new ItemInfo($xeform, _vm) -} - -export function handleFieldOrItem ($xeform: VxeFormConstructor, fieldOrItem: string | VxeFormDefines.ItemInfo) { - if (fieldOrItem) { - return XEUtils.isString(fieldOrItem) ? $xeform.getItemByField(fieldOrItem) : fieldOrItem - } - return null -} - -export function isHiddenItem ($xeform: VxeFormConstructor, formItem: VxeFormDefines.ItemInfo) { - const { reactData } = $xeform - const { collapseAll } = reactData - const { folding, visible } = formItem - return visible === false || (folding && collapseAll) -} - -export function isActivetem ($xeform: VxeFormConstructor, formItem: VxeFormDefines.ItemInfo) { - let { visibleMethod, itemRender, visible, field } = formItem - if (visible === false) { - return visible - } - const compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null - if (!visibleMethod && compConf && compConf.itemVisibleMethod) { - visibleMethod = compConf.itemVisibleMethod - } - if (!visibleMethod) { - return true - } - const { data } = $xeform.props - return visibleMethod({ data, field, property: field, item: formItem, $form: $xeform, $grid: $xeform.xegrid }) -} - -export function watchItem (props: any, formItem: ItemInfo) { - Object.keys(props).forEach(name => { - watch(() => props[name], (value: any) => { - formItem.update(name, value) - }) - }) -} - -export function assemItem ($xeform: VxeFormConstructor, el: HTMLDivElement, formItem: ItemInfo, formGather: XEFormItemProvide | null) { - const { reactData } = $xeform - const { staticItems } = reactData - const parentElem = el.parentNode - const parentItem = formGather ? formGather.formItem : null - const parentItems = parentItem ? parentItem.children : staticItems - if (parentElem) { - parentItems.splice(XEUtils.arrayIndexOf(parentElem.children, el), 0, formItem) - reactData.staticItems = staticItems.slice(0) - } -} - -export function destroyItem ($xeform: VxeFormConstructor, formItem: ItemInfo) { - const { reactData } = $xeform - const { staticItems } = reactData - const index = XEUtils.findIndexOf(staticItems, item => item.id === formItem.id) - if (index > -1) { - staticItems.splice(index, 1) - } - reactData.staticItems = staticItems.slice(0) -} diff --git a/packages/grid/index.d.ts b/packages/grid/index.d.ts deleted file mode 100644 index 201f40d7b1..0000000000 --- a/packages/grid/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeGrid } from '../../types/grid' - -export * from '../../types/grid' -export default VxeGrid diff --git a/packages/grid/index.ts b/packages/grid/index.ts index 253fe371fd..c981db9910 100644 --- a/packages/grid/index.ts +++ b/packages/grid/index.ts @@ -1,15 +1,16 @@ import { App } from 'vue' +import { VxeUI } from '../ui' import VxeGridComponent from './src/grid' -import { dynamicApp } from '../dynamics' -export const VxeGrid = Object.assign(VxeGridComponent, { +export const VxeGrid = Object.assign({}, VxeGridComponent, { install (app: App) { - app.component(VxeGridComponent.name, VxeGridComponent) + app.component(VxeGridComponent.name as string, VxeGridComponent) } }) -export const Grid = VxeGrid - -dynamicApp.component(VxeGridComponent.name, VxeGridComponent) +if (VxeUI.dynamicApp) { + VxeUI.dynamicApp.component(VxeGridComponent.name as string, VxeGridComponent) +} +export const Grid = VxeGrid export default VxeGrid diff --git a/packages/grid/src/grid.ts b/packages/grid/src/grid.ts index 2a637a3466..84ac56c035 100644 --- a/packages/grid/src/grid.ts +++ b/packages/grid/src/grid.ts @@ -1,25 +1,22 @@ -import { defineComponent, h, PropType, ref, Ref, computed, provide, getCurrentInstance, reactive, onUnmounted, watch, nextTick, VNode, ComponentPublicInstance, onMounted } from 'vue' +import { defineComponent, h, PropType, ref, Ref, computed, provide, resolveComponent, reactive, onUnmounted, watch, nextTick, VNode, ComponentPublicInstance, onMounted, createCommentVNode } from 'vue' import XEUtils from 'xe-utils' -import { getLastZIndex, nextZIndex, isEnableConf } from '../../tools/utils' -import { getOffsetHeight, getPaddingTopBottomSize, getDomNode } from '../../tools/dom' -import { errLog } from '../../tools/log' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' +import { getLastZIndex, nextZIndex, isEnableConf } from '../../ui/src/utils' +import { getOffsetHeight, getPaddingTopBottomSize, getDomNode } from '../../ui/src/dom' +import { VxeUI } from '../../ui' import VxeTableComponent from '../../table' -import VxePagerComponent from '../../pager' import VxeToolbarComponent from '../../toolbar' -import VxeFormComponent from '../../form' import tableComponentProps from '../../table/src/props' import tableComponentEmits from '../../table/src/emits' -import { useSize } from '../../hooks/size' -import { GlobalEvent, hasEventKey, EVENT_KEYS } from '../../tools/event' -import { getSlotVNs } from '../../tools/vn' +import { getSlotVNs } from '../../ui/src/vn' +import { errLog } from '../../ui/src/log' -import { TableMethods, VxeGridConstructor, VxeGridEmits, GridReactData, VxeGridPropTypes, VxeToolbarPropTypes, GridMethods, GridPrivateMethods, VxeGridPrivateComputed, VxeGridPrivateMethods, VxePagerInstance, VxeToolbarInstance, GridPrivateRef, VxeFormInstance, VxeTableProps, VxeTableConstructor, VxeTableMethods, VxeTablePrivateMethods, VxeTableEvents, VxePagerEvents, VxeFormEvents, VxeTableDefines, VxeTableEventProps, VxeFormItemProps, VxeGridProps } from '../../../types/all' +import type { VxeTableMethods, VxeGridConstructor, VxeGridEmits, GridReactData, VxeGridPropTypes, VxeToolbarPropTypes, GridMethods, GridPrivateMethods, VxeGridPrivateComputed, VxeGridPrivateMethods, VxeToolbarInstance, GridPrivateRef, VxeTableProps, VxeTableConstructor, VxeTablePrivateMethods, VxeTableEvents, VxeTableDefines, VxeTableEventProps, VxeGridProps, VxePagerComponent, VxeFormComponent, VxeFormEvents, VxeFormInstance, VxePagerEvents, VxeFormItemProps, VxePagerInstance } from '../../../types' + +const { getConfig, getI18n, commands, hooks, useFns, createEvent, globalEvents, GLOBAL_EVENT_KEYS } = VxeUI const tableComponentPropKeys = Object.keys(tableComponentProps as any) -const tableComponentMethodKeys: (keyof TableMethods)[] = ['clearAll', 'syncData', 'updateData', 'loadData', 'reloadData', 'reloadRow', 'loadColumn', 'reloadColumn', 'getRowNode', 'getColumnNode', 'getRowIndex', 'getVTRowIndex', 'getVMRowIndex', 'getColumnIndex', 'getVTColumnIndex', 'getVMColumnIndex', 'createData', 'createRow', 'revertData', 'clearData', 'isInsertByRow', 'isUpdateByRow', 'getColumns', 'getColumnById', 'getColumnByField', 'getTableColumn', 'getData', 'getCheckboxRecords', 'getParentRow', 'getRowSeq', 'getRowById', 'getRowid', 'getTableData', 'setColumnFixed', 'clearColumnFixed', 'setColumnWidth', 'getColumnWidth', 'hideColumn', 'showColumn', 'resetColumn', 'refreshColumn', 'refreshScroll', 'recalculate', 'closeTooltip', 'isAllCheckboxChecked', 'isAllCheckboxIndeterminate', 'getCheckboxIndeterminateRecords', 'setCheckboxRow', 'isCheckedByCheckboxRow', 'isIndeterminateByCheckboxRow', 'toggleCheckboxRow', 'setAllCheckboxRow', 'getRadioReserveRecord', 'clearRadioReserve', 'getCheckboxReserveRecords', 'clearCheckboxReserve', 'toggleAllCheckboxRow', 'clearCheckboxRow', 'setCurrentRow', 'isCheckedByRadioRow', 'setRadioRow', 'clearCurrentRow', 'clearRadioRow', 'getCurrentRecord', 'getRadioRecord', 'getCurrentColumn', 'setCurrentColumn', 'clearCurrentColumn', 'setPendingRow', 'togglePendingRow', 'getPendingRecords', 'clearPendingRow', 'sort', 'clearSort', 'isSort', 'getSortColumns', 'closeFilter', 'isFilter', 'isActiveFilterByColumn', 'isRowExpandLoaded', 'clearRowExpandLoaded', 'reloadRowExpand', 'reloadRowExpand', 'toggleRowExpand', 'setAllRowExpand', 'setRowExpand', 'isExpandByRow', 'isRowExpandByRow', 'clearRowExpand', 'clearRowExpandReserve', 'getRowExpandRecords', 'getTreeExpandRecords', 'isTreeExpandLoaded', 'clearTreeExpandLoaded', 'reloadTreeExpand', 'reloadTreeChilds', 'toggleTreeExpand', 'setAllTreeExpand', 'setTreeExpand', 'isTreeExpandByRow', 'clearTreeExpand', 'clearTreeExpandReserve', 'getScroll', 'scrollTo', 'scrollToRow', 'scrollToColumn', 'clearScroll', 'updateFooter', 'updateStatus', 'setMergeCells', 'removeInsertRow', 'removeMergeCells', 'getMergeCells', 'clearMergeCells', 'setMergeFooterItems', 'removeMergeFooterItems', 'getMergeFooterItems', 'clearMergeFooterItems', 'openTooltip', 'focus', 'blur', 'connect'] +const tableComponentMethodKeys: (keyof VxeTableMethods)[] = ['clearAll', 'syncData', 'updateData', 'loadData', 'reloadData', 'reloadRow', 'loadColumn', 'reloadColumn', 'getRowNode', 'getColumnNode', 'getRowIndex', 'getVTRowIndex', 'getVMRowIndex', 'getColumnIndex', 'getVTColumnIndex', 'getVMColumnIndex', 'createData', 'createRow', 'revertData', 'clearData', 'isInsertByRow', 'isUpdateByRow', 'getColumns', 'getColumnById', 'getColumnByField', 'getTableColumn', 'getData', 'getCheckboxRecords', 'getParentRow', 'getRowSeq', 'getRowById', 'getRowid', 'getTableData', 'setColumnFixed', 'clearColumnFixed', 'setColumnWidth', 'getColumnWidth', 'hideColumn', 'showColumn', 'resetColumn', 'refreshColumn', 'refreshScroll', 'recalculate', 'closeTooltip', 'isAllCheckboxChecked', 'isAllCheckboxIndeterminate', 'getCheckboxIndeterminateRecords', 'setCheckboxRow', 'isCheckedByCheckboxRow', 'isIndeterminateByCheckboxRow', 'toggleCheckboxRow', 'setAllCheckboxRow', 'getRadioReserveRecord', 'clearRadioReserve', 'getCheckboxReserveRecords', 'clearCheckboxReserve', 'toggleAllCheckboxRow', 'clearCheckboxRow', 'setCurrentRow', 'isCheckedByRadioRow', 'setRadioRow', 'clearCurrentRow', 'clearRadioRow', 'getCurrentRecord', 'getRadioRecord', 'getCurrentColumn', 'setCurrentColumn', 'clearCurrentColumn', 'setPendingRow', 'togglePendingRow', 'getPendingRecords', 'clearPendingRow', 'sort', 'clearSort', 'isSort', 'getSortColumns', 'closeFilter', 'isFilter', 'isActiveFilterByColumn', 'isRowExpandLoaded', 'clearRowExpandLoaded', 'reloadRowExpand', 'reloadRowExpand', 'toggleRowExpand', 'setAllRowExpand', 'setRowExpand', 'isExpandByRow', 'isRowExpandByRow', 'clearRowExpand', 'clearRowExpandReserve', 'getRowExpandRecords', 'getTreeExpandRecords', 'isTreeExpandLoaded', 'clearTreeExpandLoaded', 'reloadTreeExpand', 'reloadTreeChilds', 'toggleTreeExpand', 'setAllTreeExpand', 'setTreeExpand', 'isTreeExpandByRow', 'clearTreeExpand', 'clearTreeExpandReserve', 'getScroll', 'scrollTo', 'scrollToRow', 'scrollToColumn', 'clearScroll', 'updateFooter', 'updateStatus', 'setMergeCells', 'removeInsertRow', 'removeMergeCells', 'getMergeCells', 'clearMergeCells', 'setMergeFooterItems', 'removeMergeFooterItems', 'getMergeFooterItems', 'clearMergeFooterItems', 'openTooltip', 'focus', 'blur', 'connect'] const gridComponentEmits: VxeGridEmits = [ ...tableComponentEmits, @@ -48,7 +45,7 @@ export default defineComponent({ toolbarConfig: Object as PropType, formConfig: Object as PropType, zoomConfig: Object as PropType, - size: { type: String as PropType, default: () => GlobalConfig.grid.size || GlobalConfig.size } + size: { type: String as PropType, default: () => getConfig().grid.size || getConfig().size } }, emits: gridComponentEmits, setup (props, context) { @@ -56,9 +53,7 @@ export default defineComponent({ const xID = XEUtils.uniqueId() - const instance = getCurrentInstance() - - const computeSize = useSize(props) + const { computeSize } = useFns.useSize(props) const reactData = reactive({ tableLoading: false, @@ -71,7 +66,7 @@ export default defineComponent({ tZindex: 0, tablePage: { total: 0, - pageSize: GlobalConfig.pager.pageSize || 10, + pageSize: getConfig().pager?.pageSize || 10, currentPage: 1, initedPages: {} } @@ -93,28 +88,28 @@ export default defineComponent({ const funcs: any = {} methodKeys.forEach(name => { funcs[name] = (...args: any[]) => { - const $xetable: any = refTable.value - if ($xetable && $xetable[name]) { - return $xetable[name](...args) + const $xeTable: any = refTable.value + if ($xeTable && $xeTable[name]) { + return $xeTable[name](...args) } } }) return funcs } - const gridExtendTableMethods = extendTableMethods(tableComponentMethodKeys) as TableMethods + const gridExtendTableMethods = extendTableMethods(tableComponentMethodKeys) as VxeTableMethods tableComponentMethodKeys.forEach(name => { gridExtendTableMethods[name] = (...args: any[]) => { - const $xetable: any = refTable.value - if ($xetable && $xetable[name]) { - return $xetable && $xetable[name](...args) + const $xeTable: any = refTable.value + if ($xeTable && $xeTable[name]) { + return $xeTable && $xeTable[name](...args) } } }) const computeProxyOpts = computed(() => { - return Object.assign({}, GlobalConfig.grid.proxyConfig, props.proxyConfig) as VxeGridPropTypes.ProxyConfig + return Object.assign({}, getConfig().grid.proxyConfig, props.proxyConfig) as VxeGridPropTypes.ProxyConfig }) const computeIsMsg = computed(() => { @@ -123,19 +118,19 @@ export default defineComponent({ }) const computePagerOpts = computed(() => { - return Object.assign({}, GlobalConfig.grid.pagerConfig, props.pagerConfig) as VxeGridPropTypes.PagerConfig + return Object.assign({}, getConfig().grid.pagerConfig, props.pagerConfig) as VxeGridPropTypes.PagerConfig }) const computeFormOpts = computed(() => { - return Object.assign({}, GlobalConfig.grid.formConfig, props.formConfig) as VxeGridPropTypes.FormOpts + return Object.assign({}, getConfig().grid.formConfig, props.formConfig) as VxeGridPropTypes.FormOpts }) const computeToolbarOpts = computed(() => { - return Object.assign({}, GlobalConfig.grid.toolbarConfig, props.toolbarConfig) as VxeGridPropTypes.ToolbarOpts + return Object.assign({}, getConfig().grid.toolbarConfig, props.toolbarConfig) as VxeGridPropTypes.ToolbarOpts }) const computeZoomOpts = computed(() => { - return Object.assign({}, GlobalConfig.grid.zoomConfig, props.zoomConfig) + return Object.assign({}, getConfig().grid.zoomConfig, props.zoomConfig) }) const computeStyles = computed(() => { @@ -167,18 +162,15 @@ export default defineComponent({ computeZoomOpts } - const $xegrid = { + const $xeGrid = { xID, props: props as VxeGridProps, context, - instance, reactData, getRefMaps: () => refMaps, getComputeMaps: () => computeMaps } as VxeGridConstructor & VxeGridPrivateMethods - let gridMethods = {} as GridMethods - const computeTableProps = computed(() => { const { seqConfig, pagerConfig, loading, editConfig, proxyConfig } = props const { isZMax, tableLoading, tablePage, tableData } = reactData @@ -210,10 +202,10 @@ export default defineComponent({ const toolbarOpts = computeToolbarOpts.value if (props.toolbarConfig && isEnableConf(toolbarOpts)) { nextTick(() => { - const $xetable = refTable.value - const $xetoolbar = refToolbar.value - if ($xetable && $xetoolbar) { - $xetable.connect($xetoolbar) + const $xeTable = refTable.value + const $xeToolbar = refToolbar.value + if ($xeTable && $xeToolbar) { + $xeTable.connect($xeToolbar) } }) } @@ -236,20 +228,16 @@ export default defineComponent({ const triggerPendingEvent = (code: string) => { const isMsg = computeIsMsg.value - const $xetable = refTable.value - const selectRecords = $xetable.getCheckboxRecords() + const $xeTable = refTable.value + const selectRecords = $xeTable.getCheckboxRecords() if (selectRecords.length) { - $xetable.togglePendingRow(selectRecords) + $xeTable.togglePendingRow(selectRecords) gridExtendTableMethods.clearCheckboxRow() } else { if (isMsg) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ id: code, content: getI18n('vxe.grid.selectOneRecord'), status: 'warning' }) } - VXETable.modal.message({ id: code, content: GlobalConfig.i18n('vxe.grid.selectOneRecord'), status: 'warning' }) } } } @@ -260,9 +248,9 @@ export default defineComponent({ const messageProp = resConfigs.message let msg if (rest && messageProp) { - msg = XEUtils.isFunction(messageProp) ? messageProp({ data: rest, $grid: $xegrid }) : XEUtils.get(rest, messageProp) + msg = XEUtils.isFunction(messageProp) ? messageProp({ data: rest, $grid: $xeGrid }) : XEUtils.get(rest, messageProp) } - return msg || GlobalConfig.i18n(defaultMsg) + return msg || getI18n(defaultMsg) } const handleDeleteRow = (code: string, alertKey: string, callback: () => void): Promise => { @@ -270,19 +258,17 @@ export default defineComponent({ const selectRecords = gridExtendTableMethods.getCheckboxRecords() if (isMsg) { if (selectRecords.length) { - return VXETable.modal.confirm({ id: `cfm_${code}`, content: GlobalConfig.i18n(alertKey), escClosable: true }).then((type) => { - if (type === 'confirm') { - return callback() - } - }) + if (VxeUI.modal) { + return VxeUI.modal.confirm({ id: `cfm_${code}`, content: getI18n(alertKey), escClosable: true }).then((type) => { + if (type === 'confirm') { + return callback() + } + }) + } } else { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ id: `msg_${code}`, content: getI18n('vxe.grid.selectOneRecord'), status: 'warning' }) } - VXETable.modal.message({ id: `msg_${code}`, content: GlobalConfig.i18n('vxe.grid.selectOneRecord'), status: 'warning' }) } } else { if (selectRecords.length) { @@ -295,22 +281,22 @@ export default defineComponent({ const pageChangeEvent: VxePagerEvents.PageChange = (params) => { const { proxyConfig } = props const { tablePage } = reactData - const { currentPage, pageSize } = params + const { $event, currentPage, pageSize } = params const proxyOpts = computeProxyOpts.value tablePage.currentPage = currentPage tablePage.pageSize = pageSize - gridMethods.dispatchEvent('page-change', params) + gridMethods.dispatchEvent('page-change', params, $event) if (proxyConfig && isEnableConf(proxyOpts)) { gridMethods.commitProxy('query').then((rest) => { - gridMethods.dispatchEvent('proxy-query', rest, params.$event) + gridMethods.dispatchEvent('proxy-query', rest, $event) }) } } const sortChangeEvent: VxeTableEvents.SortChange = (params) => { - const $xetable = refTable.value + const $xeTable = refTable.value const { proxyConfig } = props - const { computeSortOpts } = $xetable.getComputeMaps() + const { computeSortOpts } = $xeTable.getComputeMaps() const proxyOpts = computeProxyOpts.value const sortOpts = computeSortOpts.value // 如果是服务端排序 @@ -323,13 +309,13 @@ export default defineComponent({ }) } } - gridMethods.dispatchEvent('sort-change', params) + gridMethods.dispatchEvent('sort-change', params, params.$event) } const filterChangeEvent: VxeTableEvents.FilterChange = (params) => { - const $xetable = refTable.value + const $xeTable = refTable.value const { proxyConfig } = props - const { computeFilterOpts } = $xetable.getComputeMaps() + const { computeFilterOpts } = $xeTable.getComputeMaps() const proxyOpts = computeProxyOpts.value const filterOpts = computeFilterOpts.value // 如果是服务端过滤 @@ -342,7 +328,7 @@ export default defineComponent({ }) } } - gridMethods.dispatchEvent('filter-change', params) + gridMethods.dispatchEvent('filter-change', params, params.$event) } const submitFormEvent: VxeFormEvents.Submit = (params) => { @@ -353,28 +339,30 @@ export default defineComponent({ gridMethods.dispatchEvent('proxy-query', { ...rest, isReload: true }, params.$event) }) } - gridMethods.dispatchEvent('form-submit', params) + gridMethods.dispatchEvent('form-submit', params, params.$event) } const resetFormEvent: VxeFormEvents.Reset = (params) => { const { proxyConfig } = props + const { $event } = params const proxyOpts = computeProxyOpts.value if (proxyConfig && isEnableConf(proxyOpts)) { gridMethods.commitProxy('reload').then((rest) => { - gridMethods.dispatchEvent('proxy-query', { ...rest, isReload: true }, params.$event) + gridMethods.dispatchEvent('proxy-query', { ...rest, isReload: true }, $event) }) } - gridMethods.dispatchEvent('form-reset', params) + gridMethods.dispatchEvent('form-reset', params, $event) } const submitInvalidEvent: VxeFormEvents.SubmitInvalid = (params) => { - gridMethods.dispatchEvent('form-submit-invalid', params) + gridMethods.dispatchEvent('form-submit-invalid', params, params.$event) } const collapseEvent: VxeFormEvents.Collapse = (params) => { + const { $event } = params nextTick(() => gridExtendTableMethods.recalculate(true)) - gridMethods.dispatchEvent('form-toggle-collapse', params) - gridMethods.dispatchEvent('form-collapse', params) + gridMethods.dispatchEvent('form-toggle-collapse', params, $event) + gridMethods.dispatchEvent('form-collapse', params, $event) } const handleZoom = (isMax?: boolean) => { @@ -395,7 +383,7 @@ export default defineComponent({ if (slots[funcSlot]) { return slots[funcSlot] } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notSlot', [funcSlot]) } } @@ -409,16 +397,15 @@ export default defineComponent({ /** * 渲染表单 */ - const renderForms = () => { + const renderForm = () => { const { formConfig, proxyConfig } = props const { formData } = reactData const proxyOpts = computeProxyOpts.value const formOpts = computeFormOpts.value - const restVNs = [] if ((formConfig && isEnableConf(formOpts)) || slots.form) { - let slotVNs = [] + let slotVNs: VNode[] = [] if (slots.form) { - slotVNs = slots.form({ $grid: $xegrid }) + slotVNs = slots.form({ $grid: $xeGrid }) } else { if (formOpts.items) { const formSlots: { [key: string]: () => VNode[] } = {} @@ -427,7 +414,7 @@ export default defineComponent({ const beforeItem = proxyOpts.beforeItem if (proxyOpts && beforeItem) { formOpts.items.forEach((item) => { - beforeItem({ $grid: $xegrid, item }) + beforeItem({ $grid: $xeGrid, item }) }) } } @@ -442,7 +429,7 @@ export default defineComponent({ }) }) slotVNs.push( - h(VxeFormComponent, { + h(resolveComponent('vxe-form') as VxeFormComponent, { ref: refForm, ...Object.assign({}, formOpts, { data: proxyConfig && isEnableConf(proxyOpts) && proxyOpts.form ? formData : formOpts.data @@ -455,28 +442,25 @@ export default defineComponent({ ) } } - restVNs.push( - h('div', { - ref: refFormWrapper, - key: 'form', - class: 'vxe-grid--form-wrapper' - }, slotVNs) - ) + return h('div', { + ref: refFormWrapper, + key: 'form', + class: 'vxe-grid--form-wrapper' + }, slotVNs) } - return restVNs + return createCommentVNode() } /** * 渲染工具栏 */ - const renderToolbars = () => { + const renderToolbar = () => { const { toolbarConfig } = props const toolbarOpts = computeToolbarOpts.value - const restVNs = [] if ((toolbarConfig && isEnableConf(toolbarOpts)) || slots.toolbar) { - let slotVNs = [] + let slotVNs: VNode[] = [] if (slots.toolbar) { - slotVNs = slots.toolbar({ $grid: $xegrid }) + slotVNs = slots.toolbar({ $grid: $xeGrid }) } else { const toolbarOptSlots = toolbarOpts.slots let buttonsSlot: any @@ -499,79 +483,53 @@ export default defineComponent({ }, toolbarSlots) ) } - restVNs.push( - h('div', { - ref: refToolbarWrapper, - key: 'toolbar', - class: 'vxe-grid--toolbar-wrapper' - }, slotVNs) - ) + return h('div', { + ref: refToolbarWrapper, + key: 'toolbar', + class: 'vxe-grid--toolbar-wrapper' + }, slotVNs) } - return restVNs + return createCommentVNode() } /** * 渲染表格顶部区域 */ - const renderTops = () => { + const renderTop = () => { if (slots.top) { - return [ - h('div', { - ref: refTopWrapper, - key: 'top', - class: 'vxe-grid--top-wrapper' - }, slots.top({ $grid: $xegrid })) - ] + return h('div', { + ref: refTopWrapper, + key: 'top', + class: 'vxe-grid--top-wrapper' + }, slots.top({ $grid: $xeGrid })) } - return [] + return createCommentVNode() } - const defaultLayouts = ['Form', 'Toolbar', 'Top', 'Table', 'Bottom', 'Pager'] - - const renderLayout = () => { - const { layouts } = props - const vns: any[] = [] - const currLayouts = (layouts && layouts.length ? layouts : (GlobalConfig.grid.layouts || defaultLayouts)) - currLayouts.forEach(name => { - switch (name) { - case 'Form': - vns.push(renderForms()) - break - case 'Toolbar': - vns.push(renderToolbars()) - break - case 'Top': - vns.push(renderTops()) - break - case 'Table': - vns.push(renderTables()) - break - case 'Bottom': - vns.push(renderBottoms()) - break - case 'Pager': - vns.push(renderPagers()) - break - default: - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - errLog('vxe.error.notProp', [`layouts -> ${name}`]) - } - break - } - }) - return vns + const renderTableLeft = () => { + const leftSlot = slots.left + if (leftSlot) { + return h('div', { + class: 'vxe-grid--left-wrapper' + }, leftSlot({ $grid: $xeGrid })) + } + return createCommentVNode() } - const tableCompEvents: VxeTableEventProps = {} - tableComponentEmits.forEach(name => { - const type = XEUtils.camelCase(`on-${name}`) as keyof VxeTableEventProps - tableCompEvents[type] = (...args: any[]) => emit(name, ...args) - }) + const renderTableRight = () => { + const rightSlot = slots.right + if (rightSlot) { + return h('div', { + class: 'vxe-grid--right-wrapper' + }, rightSlot({ $grid: $xeGrid })) + } + return createCommentVNode() + } /** * 渲染表格 */ - const renderTables = () => { + const renderTable = () => { const { proxyConfig } = props const tableProps = computeTableProps.value const proxyOpts = computeProxyOpts.value @@ -591,15 +549,16 @@ export default defineComponent({ loading?(params: any): any } = {} if (emptySlot) { - slotObj.empty = () => emptySlot({}) + slotObj.empty = () => emptySlot({ $grid: $xeGrid }) } if (loadingSlot) { - slotObj.loading = () => loadingSlot({}) + slotObj.loading = () => loadingSlot({ $grid: $xeGrid }) } - return [ + return h('div', { + class: 'vxe-grid--table-wrapper' + }, [ h(VxeTableComponent, { ref: refTable, - key: 'table', ...tableProps, ...tableOns, onLoadTableData: (params:any) => { @@ -614,37 +573,34 @@ export default defineComponent({ } } }, slotObj) - ] + ]) } /** * 渲染表格底部区域 */ - const renderBottoms = () => { + const renderBottom = () => { if (slots.bottom) { - return [ - h('div', { - ref: refBottomWrapper, - key: 'bottom', - class: 'vxe-grid--bottom-wrapper' - }, slots.bottom({ $grid: $xegrid })) - ] + return h('div', { + ref: refBottomWrapper, + key: 'bottom', + class: 'vxe-grid--bottom-wrapper' + }, slots.bottom({ $grid: $xeGrid })) } - return [] + return createCommentVNode() } /** * 渲染分页 */ - const renderPagers = () => { + const renderPager = () => { const { proxyConfig, pagerConfig } = props const proxyOpts = computeProxyOpts.value const pagerOpts = computePagerOpts.value - const restVNs = [] if ((pagerConfig && isEnableConf(pagerOpts)) || slots.pager) { - let slotVNs = [] + let slotVNs: VNode[] = [] if (slots.pager) { - slotVNs = slots.pager({ $grid: $xegrid }) + slotVNs = slots.pager({ $grid: $xeGrid }) } else { const pagerOptSlots = pagerOpts.slots const pagerSlots: { [key: string]: () => VNode[] } = {} @@ -661,7 +617,7 @@ export default defineComponent({ } } slotVNs.push( - h(VxePagerComponent, { + h(resolveComponent('vxe-pager') as VxePagerComponent, { ref: refPager, ...pagerOpts, ...(proxyConfig && isEnableConf(proxyOpts) ? reactData.tablePage : {}), @@ -669,17 +625,66 @@ export default defineComponent({ }, pagerSlots) ) } - restVNs.push( - h('div', { - ref: refPagerWrapper, - key: 'pager', - class: 'vxe-grid--pager-wrapper' - }, slotVNs) - ) + return h('div', { + ref: refPagerWrapper, + key: 'pager', + class: 'vxe-grid--pager-wrapper' + }, slotVNs) } - return restVNs + return createCommentVNode() + } + + const defaultLayouts = ['Form', 'Toolbar', 'Top', 'Table', 'Bottom', 'Pager'] + + const renderLayout = () => { + const { layouts } = props + const vns: VNode[] = [] + const currLayouts = (layouts && layouts.length ? layouts : (getConfig().grid.layouts || defaultLayouts)) + currLayouts.forEach(name => { + switch (name) { + case 'Form': + vns.push(renderForm()) + break + case 'Toolbar': + vns.push(renderToolbar()) + break + case 'Top': + vns.push(renderTop()) + break + case 'Table': + vns.push( + h('div', { + key: 'table', + class: 'vxe-grid--table-container' + }, [ + renderTableLeft(), + renderTable(), + renderTableRight() + ]) + ) + break + case 'Bottom': + vns.push(renderBottom()) + break + case 'Pager': + vns.push(renderPager()) + break + default: + if (process.env.VUE_APP_VXE_ENV === 'development') { + errLog('vxe.error.notProp', [`layouts -> ${name}`]) + } + break + } + }) + return vns } + const tableCompEvents: VxeTableEventProps = {} + tableComponentEmits.forEach(name => { + const type = XEUtils.camelCase(`on-${name}`) as keyof VxeTableEventProps + tableCompEvents[type] = (...args: any[]) => emit(name, ...args) + }) + const initProxy = () => { const { proxyConfig, formConfig } = props const { proxyInited } = reactData @@ -691,7 +696,7 @@ export default defineComponent({ formOpts.items.forEach(item => { const { field, itemRender } = item if (field) { - let itemValue = null + let itemValue: any = null if (itemRender) { const { defaultValue } = itemRender if (XEUtils.isFunction(defaultValue)) { @@ -716,9 +721,9 @@ export default defineComponent({ } } - gridMethods = { + const gridMethods: GridMethods = { dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $grid: $xegrid, $event: evnt }, params)) + emit(type, createEvent(evnt, { $grid: $xeGrid }, params)) }, /** * 提交指令，支持 code 或 button @@ -733,7 +738,7 @@ export default defineComponent({ const toolbarOpts = computeToolbarOpts.value const { beforeQuery, afterQuery, beforeDelete, afterDelete, beforeSave, afterSave, ajax = {} } = proxyOpts const resConfigs = proxyOpts.response || proxyOpts.props || {} - const $xetable = refTable.value + const $xeTable = refTable.value let button: VxeToolbarPropTypes.ButtonConfig | null = null let code: string | null = null if (XEUtils.isString(proxyTarget)) { @@ -748,34 +753,34 @@ export default defineComponent({ const btnParams = button ? button.params : null switch (code) { case 'insert': - return $xetable.insert({}) + return $xeTable.insert({}) case 'insert_edit': - return $xetable.insert({}).then(({ row }) => $xetable.setEditRow(row)) + return $xeTable.insert({}).then(({ row }) => $xeTable.setEditRow(row)) // 已废弃 case 'insert_actived': - return $xetable.insert({}).then(({ row }) => $xetable.setEditRow(row)) + return $xeTable.insert({}).then(({ row }) => $xeTable.setEditRow(row)) // 已废弃 case 'mark_cancel': triggerPendingEvent(code) break case 'remove': - return handleDeleteRow(code, 'vxe.grid.removeSelectRecord', () => $xetable.removeCheckboxRow()) + return handleDeleteRow(code, 'vxe.grid.removeSelectRecord', () => $xeTable.removeCheckboxRow()) case 'import': - $xetable.importData(btnParams) + $xeTable.importData(btnParams) break case 'open_import': - $xetable.openImport(btnParams) + $xeTable.openImport(btnParams) break case 'export': - $xetable.exportData(btnParams) + $xeTable.exportData(btnParams) break case 'open_export': - $xetable.openExport(btnParams) + $xeTable.openExport(btnParams) break case 'reset_custom': - return $xetable.resetColumn(true) + return $xeTable.resetColumn(true) case '_init': case 'reload': case 'query': { @@ -796,7 +801,7 @@ export default defineComponent({ } if (isInited) { tablePage.initedPages = {} - const { computeSortOpts } = $xetable.getComputeMaps() + const { computeSortOpts } = $xeTable.getComputeMaps() const sortOpts = computeSortOpts.value let defaultSort = sortOpts.defaultSort // 如果使用默认排序 @@ -804,7 +809,7 @@ export default defineComponent({ if (!XEUtils.isArray(defaultSort)) { defaultSort = [defaultSort] } - sortList = defaultSort.map((item) => { + sortList = defaultSort.map((item: any) => { return { field: item.field, property: item.field, @@ -812,14 +817,14 @@ export default defineComponent({ } }) } - filterList = $xetable.getCheckedFilters() + filterList = $xeTable.getCheckedFilters() } else { if (isReload) { tablePage.initedPages = {} - $xetable.clearAll() + $xeTable.clearAll() } else { - sortList = $xetable.getSortColumns() - filterList = $xetable.getCheckedFilters() + sortList = $xeTable.getSortColumns() + filterList = $xeTable.getCheckedFilters() } } const commitParams = { @@ -827,7 +832,7 @@ export default defineComponent({ button, isInited, isReload, - $grid: $xegrid, + $grid: $xeGrid, page: pageParams, sort: sortList.length ? sortList[0] : {}, sorts: sortList, @@ -845,10 +850,10 @@ export default defineComponent({ if (rest) { if (pagerConfig && isEnableConf(pagerOpts)) { const totalProp = resConfigs.total - const total = (XEUtils.isFunction(totalProp) ? totalProp({ data: rest, $grid: $xegrid }) : XEUtils.get(rest, totalProp || 'page.total')) || 0 + const total = (XEUtils.isFunction(totalProp) ? totalProp({ data: rest, $grid: $xeGrid }) : XEUtils.get(rest, totalProp || 'page.total')) || 0 tablePage.total = XEUtils.toNumber(total) const resultProp = resConfigs.result - reactData.tableData = (XEUtils.isFunction(resultProp) ? resultProp({ data: rest, $grid: $xegrid }) : XEUtils.get(rest, resultProp || 'result')) || [] + reactData.tableData = (XEUtils.isFunction(resultProp) ? resultProp({ data: rest, $grid: $xeGrid }) : XEUtils.get(rest, resultProp || 'result')) || [] // 检验当前页码，不能超出当前最大页数 const pageCount = Math.max(Math.ceil(total / tablePage.pageSize), 1) if (tablePage.currentPage > pageCount) { @@ -856,7 +861,7 @@ export default defineComponent({ } } else { const listProp = resConfigs.list - reactData.tableData = (listProp ? (XEUtils.isFunction(listProp) ? listProp({ data: rest, $grid: $xegrid }) : XEUtils.get(rest, listProp)) : rest) || [] + reactData.tableData = (listProp ? (XEUtils.isFunction(listProp) ? listProp({ data: rest, $grid: $xeGrid }) : XEUtils.get(rest, listProp)) : rest) || [] } } else { reactData.tableData = [] @@ -870,7 +875,7 @@ export default defineComponent({ return { status: false } }) } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notFunc', ['proxy-config.ajax.query']) } } @@ -880,28 +885,24 @@ export default defineComponent({ const ajaxMethods = ajax.delete if (ajaxMethods) { const selectRecords = gridExtendTableMethods.getCheckboxRecords() - const removeRecords = selectRecords.filter(row => !$xetable.isInsertByRow(row)) + const removeRecords = selectRecords.filter(row => !$xeTable.isInsertByRow(row)) const body = { removeRecords } - const commitParams = { $grid: $xegrid, code, button, body, form: formData, options: ajaxMethods } + const commitParams = { $grid: $xeGrid, code, button, body, form: formData, options: ajaxMethods } const applyArgs = [commitParams].concat(args) if (selectRecords.length) { return handleDeleteRow(code, 'vxe.grid.deleteSelectRecord', () => { if (!removeRecords.length) { - return $xetable.remove(selectRecords) + return $xeTable.remove(selectRecords) } reactData.tableLoading = true return Promise.resolve((beforeDelete || ajaxMethods)(...applyArgs)) .then(rest => { reactData.tableLoading = false - $xetable.setPendingRow(removeRecords, false) + $xeTable.setPendingRow(removeRecords, false) if (isMsg) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ content: getRespMsg(rest, 'vxe.grid.delSuccess'), status: 'success' }) } - VXETable.modal.message({ content: getRespMsg(rest, 'vxe.grid.delSuccess'), status: 'success' }) } if (afterDelete) { afterDelete(...applyArgs) @@ -913,29 +914,22 @@ export default defineComponent({ .catch(rest => { reactData.tableLoading = false if (isMsg) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal.message) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ id: code, content: getRespMsg(rest, 'vxe.grid.operError'), status: 'error' }) } - VXETable.modal.message({ id: code, content: getRespMsg(rest, 'vxe.grid.operError'), status: 'error' }) } return { status: false } }) }) } else { if (isMsg) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ id: code, content: getI18n('vxe.grid.selectOneRecord'), status: 'warning' }) } - VXETable.modal.message({ id: code, content: GlobalConfig.i18n('vxe.grid.selectOneRecord'), status: 'warning' }) } } } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notFunc', ['proxy-config.ajax.delete']) } } @@ -944,22 +938,22 @@ export default defineComponent({ case 'save': { const ajaxMethods = ajax.save if (ajaxMethods) { - const body = $xetable.getRecordset() + const body = $xeTable.getRecordset() const { insertRecords, removeRecords, updateRecords, pendingRecords } = body - const commitParams = { $grid: $xegrid, code, button, body, form: formData, options: ajaxMethods } + const commitParams = { $grid: $xeGrid, code, button, body, form: formData, options: ajaxMethods } const applyArgs = [commitParams].concat(args) // 排除掉新增且标记为删除的数据 if (insertRecords.length) { - body.pendingRecords = pendingRecords.filter((row) => $xetable.findRowIndexOf(insertRecords, row) === -1) + body.pendingRecords = pendingRecords.filter((row) => $xeTable.findRowIndexOf(insertRecords, row) === -1) } // 排除已标记为删除的数据 if (pendingRecords.length) { - body.insertRecords = insertRecords.filter((row) => $xetable.findRowIndexOf(pendingRecords, row) === -1) + body.insertRecords = insertRecords.filter((row) => $xeTable.findRowIndexOf(pendingRecords, row) === -1) } let restPromise: Promise = Promise.resolve() if (editRules) { // 只校验新增和修改的数据 - restPromise = $xetable[validConfig && validConfig.msgMode === 'full' ? 'fullValidate' : 'validate'](body.insertRecords.concat(updateRecords)) + restPromise = $xeTable[validConfig && validConfig.msgMode === 'full' ? 'fullValidate' : 'validate'](body.insertRecords.concat(updateRecords)) } return restPromise.then((errMap) => { if (errMap) { @@ -971,15 +965,11 @@ export default defineComponent({ return Promise.resolve((beforeSave || ajaxMethods)(...applyArgs)) .then(rest => { reactData.tableLoading = false - $xetable.clearPendingRow() + $xeTable.clearPendingRow() if (isMsg) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ content: getRespMsg(rest, 'vxe.grid.saveSuccess'), status: 'success' }) } - VXETable.modal.message({ content: getRespMsg(rest, 'vxe.grid.saveSuccess'), status: 'success' }) } if (afterSave) { afterSave(...applyArgs) @@ -991,42 +981,34 @@ export default defineComponent({ .catch(rest => { reactData.tableLoading = false if (isMsg) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ id: code, content: getRespMsg(rest, 'vxe.grid.operError'), status: 'error' }) } - VXETable.modal.message({ id: code, content: getRespMsg(rest, 'vxe.grid.operError'), status: 'error' }) } return { status: false } }) } else { if (isMsg) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ id: code, content: getI18n('vxe.grid.dataUnchanged'), status: 'info' }) } - VXETable.modal.message({ id: code, content: GlobalConfig.i18n('vxe.grid.dataUnchanged'), status: 'info' }) } } }) } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notFunc', ['proxy-config.ajax.save']) } } break } default: { - const gCommandOpts = VXETable.commands.get(code) + const gCommandOpts = commands.get(code) if (gCommandOpts) { if (gCommandOpts.commandMethod) { - gCommandOpts.commandMethod({ code, button, $grid: $xegrid, $table: $xetable }, ...args) + gCommandOpts.commandMethod({ code, button, $grid: $xeGrid, $table: $xeTable }, ...args) } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notCommands', [code]) } } @@ -1061,7 +1043,7 @@ export default defineComponent({ return XEUtils.isUndefined(itemIndex) ? itemList : itemList[itemIndex] }, getProxyInfo () { - const $xetable = refTable.value + const $xeTable = refTable.value if (props.proxyConfig) { const { sortData } = reactData return { @@ -1071,7 +1053,7 @@ export default defineComponent({ sort: sortData.length ? sortData[0] : {}, sorts: sortData, pager: reactData.tablePage, - pendingRecords: $xetable ? $xetable.getPendingRecords() : [] + pendingRecords: $xeTable ? $xeTable.getPendingRecords() : [] } } return null @@ -1097,9 +1079,9 @@ export default defineComponent({ } // 检查插槽 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { (gridMethods as any).loadColumn = (columns: any[]): Promise => { - const $xetable = refTable.value + const $xeTable = refTable.value XEUtils.eachTree(columns, (column) => { if (column.slots) { XEUtils.each(column.slots, (func) => { @@ -1111,8 +1093,8 @@ export default defineComponent({ }) } }) - if ($xetable) { - return $xetable.loadColumn(columns) + if ($xeTable) { + return $xeTable.loadColumn(columns) } return nextTick() } @@ -1171,7 +1153,7 @@ export default defineComponent({ }, triggerToolbarTolEvent (tool, evnt) { gridPrivateMethods.triggerToolbarCommitEvent(tool, evnt) - gridMethods.dispatchEvent('toolbar-tool-click', { code: tool.code, tool, $event: evnt }) + gridMethods.dispatchEvent('toolbar-tool-click', { code: tool.code, tool }, evnt) }, triggerZoomEvent (evnt) { gridMethods.zoom() @@ -1179,7 +1161,7 @@ export default defineComponent({ } } - Object.assign($xegrid, gridExtendTableMethods, gridMethods, gridPrivateMethods) + Object.assign($xeGrid, gridExtendTableMethods, gridMethods, gridPrivateMethods) const columnFlag = ref(0) watch(() => props.columns ? props.columns.length : -1, () => { @@ -1189,7 +1171,7 @@ export default defineComponent({ columnFlag.value++ }) watch(columnFlag, () => { - nextTick(() => $xegrid.loadColumn(props.columns || [])) + nextTick(() => $xeGrid.loadColumn(props.columns || [])) }) watch(() => props.toolbarConfig, () => { @@ -1206,18 +1188,18 @@ export default defineComponent({ const handleGlobalKeydownEvent = (evnt: any) => { const zoomOpts = computeZoomOpts.value - const isEsc = hasEventKey(evnt, EVENT_KEYS.ESCAPE) + const isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE) if (isEsc && reactData.isZMax && zoomOpts.escRestore !== false) { gridPrivateMethods.triggerZoomEvent(evnt) } } - VXETable.hooks.forEach((options) => { + hooks.forEach((options) => { const { setupGrid } = options if (setupGrid) { - const hookRest = setupGrid($xegrid) + const hookRest = setupGrid($xeGrid) if (hookRest && XEUtils.isObject(hookRest)) { - Object.assign($xegrid, hookRest) + Object.assign($xeGrid, hookRest) } } }) @@ -1233,22 +1215,22 @@ export default defineComponent({ errLog('vxe.error.errConflicts', ['grid.data', 'grid.proxy-config']) } - // if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + // if (process.env.VUE_APP_VXE_ENV === 'development') { // if (proxyOpts.props) { // warnLog('vxe.error.delProp', ['proxy-config.props', 'proxy-config.response']) // } // } if (columns && columns.length) { - $xegrid.loadColumn(columns) + $xeGrid.loadColumn(columns) } initToolbar() }) - GlobalEvent.on($xegrid, 'keydown', handleGlobalKeydownEvent) + globalEvents.on($xeGrid, 'keydown', handleGlobalKeydownEvent) }) onUnmounted(() => { - GlobalEvent.off($xegrid, 'keydown') + globalEvents.off($xeGrid, 'keydown') }) nextTick(() => { @@ -1271,11 +1253,11 @@ export default defineComponent({ }, renderLayout()) } - $xegrid.renderVN = renderVN + $xeGrid.renderVN = renderVN - provide('$xegrid', $xegrid) + provide('$xeGrid', $xeGrid) - return $xegrid + return $xeGrid }, render () { return this.renderVN() diff --git a/packages/hooks/size.ts b/packages/hooks/size.ts deleted file mode 100644 index 1736207120..0000000000 --- a/packages/hooks/size.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { computed, inject, provide, ComputedRef } from 'vue' - -import { SizeType } from '../../types/all' - -export function useSize (props: { size?: SizeType }) { - // 组件尺寸上下文 - const xesize = inject('xesize', null as ComputedRef | null) - const computeSize = computed(() => { - return props.size || (xesize ? xesize.value : null) - }) - provide('xesize', computeSize) - - return computeSize -} diff --git a/packages/icon/index.d.ts b/packages/icon/index.d.ts deleted file mode 100644 index 9a25fc3cda..0000000000 --- a/packages/icon/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeIcon } from '../../types/icon' - -export * from '../../types/icon' -export default VxeIcon diff --git a/packages/icon/index.ts b/packages/icon/index.ts deleted file mode 100644 index bb94146f7f..0000000000 --- a/packages/icon/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeIconComponent from './src/icon' -import { dynamicApp } from '../dynamics' - -export const VxeIcon = Object.assign(VxeIconComponent, { - install (app: App) { - app.component(VxeIconComponent.name, VxeIconComponent) - } -}) - -export const Icon = VxeIcon - -dynamicApp.component(VxeIcon.name, VxeIcon) - -export default VxeIcon diff --git a/packages/icon/src/icon.ts b/packages/icon/src/icon.ts deleted file mode 100644 index b5b9fe1d76..0000000000 --- a/packages/icon/src/icon.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { defineComponent, h, PropType } from 'vue' - -import { VxeIconPropTypes, VxeIconEmits } from '../../../types/all' - -export default defineComponent({ - name: 'VxeIcon', - props: { - name: String as PropType, - roll: Boolean as PropType, - status: String as PropType - }, - emits: [ - 'click' - ] as VxeIconEmits, - setup (props, { emit }) { - const clickEvent = (evnt: KeyboardEvent) => { - emit('click', { $event: evnt }) - } - return () => { - const { name, roll, status } = props - return h('i', { - class: [`vxe-icon-${name}`, roll ? 'roll' : '', status ? [`theme--${status}`] : ''], - onClick: clickEvent - }) - } - } -}) diff --git a/packages/index.common.ts b/packages/index.common.ts deleted file mode 100644 index f86facdf9f..0000000000 --- a/packages/index.common.ts +++ /dev/null @@ -1,4 +0,0 @@ -import * as VXETableExport from './all' - -export * from './all' -export default VXETableExport diff --git a/packages/index.ts b/packages/index.ts new file mode 100644 index 0000000000..6cc8a1839c --- /dev/null +++ b/packages/index.ts @@ -0,0 +1,4 @@ +import * as VxeTableExport from './components' + +export * from './components' +export default VxeTableExport diff --git a/packages/input/index.d.ts b/packages/input/index.d.ts deleted file mode 100644 index d4e5ba5957..0000000000 --- a/packages/input/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeInput } from '../../types/input' - -export * from '../../types/input' -export default VxeInput diff --git a/packages/input/index.ts b/packages/input/index.ts deleted file mode 100644 index 5bda4e13e6..0000000000 --- a/packages/input/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeInputConstructor from './src/input' -import { dynamicApp } from '../dynamics' - -export const VxeInput = Object.assign(VxeInputConstructor, { - install (app: App) { - app.component(VxeInputConstructor.name, VxeInputConstructor) - } -}) - -export const Input = VxeInput - -dynamicApp.component(VxeInputConstructor.name, VxeInputConstructor) - -export default VxeInput diff --git a/packages/input/src/date.ts b/packages/input/src/date.ts deleted file mode 100644 index da929d7890..0000000000 --- a/packages/input/src/date.ts +++ /dev/null @@ -1,42 +0,0 @@ -import XEUtils from 'xe-utils' - -import { VxeInputPropTypes } from '../../../types/all' - -export function toStringTimeDate (str: VxeInputPropTypes.ModelValue) { - if (str) { - const rest = new Date() - let h = 0 - let m = 0 - let s = 0 - if (XEUtils.isDate(str)) { - h = str.getHours() - m = str.getMinutes() - s = str.getSeconds() - } else { - str = XEUtils.toValueString(str) - const parses = str.match(/^(\d{1,2})(:(\d{1,2}))?(:(\d{1,2}))?/) - if (parses) { - h = XEUtils.toNumber(parses[1]) - m = XEUtils.toNumber(parses[3]) - s = XEUtils.toNumber(parses[5]) - } - } - rest.setHours(h) - rest.setMinutes(m) - rest.setSeconds(s) - return rest - } - return new Date('') -} - -export function getDateQuarter (date: Date) { - const month = date.getMonth() - if (month < 3) { - return 1 - } else if (month < 6) { - return 2 - } else if (month < 9) { - return 3 - } - return 4 -} diff --git a/packages/input/src/input.ts b/packages/input/src/input.ts deleted file mode 100644 index a1ab839a53..0000000000 --- a/packages/input/src/input.ts +++ /dev/null @@ -1,2464 +0,0 @@ -import { defineComponent, h, Teleport, ref, Ref, computed, reactive, inject, nextTick, watch, onUnmounted, PropType } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' -import { getFuncText, getLastZIndex, nextZIndex } from '../../tools/utils' -import { hasClass, getAbsolutePos, getEventTargetNode } from '../../tools/dom' -import { GlobalEvent, hasEventKey, EVENT_KEYS } from '../../tools/event' -import { toStringTimeDate, getDateQuarter } from './date' -import { handleNumber, toFloatValueFixed } from './number' - -import { VNodeStyle, VxeInputConstructor, VxeInputEmits, InputReactData, InputMethods, VxeInputPropTypes, InputPrivateRef, VxeFormConstructor, VxeFormPrivateMethods, VxeFormDefines } from '../../../types/all' - -interface DateYearItem { - date: Date; - isPrev: boolean; - isCurrent: boolean; - isNow: boolean; - isNext: boolean; - year: number; -} - -interface DateMonthItem { - date: Date; - isPrev: boolean; - isCurrent: boolean; - isNow: boolean; - isNext: boolean; - month: number; -} - -interface DateQuarterItem { - date: Date; - isPrev: boolean; - isCurrent: boolean; - isNow: boolean; - isNext: boolean; - quarter: number; -} - -interface DateDayItem { - date: Date; - isWeekNumber?: boolean; - isPrev: boolean; - isCurrent: boolean; - isNow: boolean; - isNext: boolean; - label: number; -} - -interface DateHourMinuteSecondItem { - value: number; - label: string; -} - -const yearSize = 12 -const monthSize = 20 -const quarterSize = 8 - -export default defineComponent({ - name: 'VxeInput', - props: { - modelValue: [String, Number, Date] as PropType, - immediate: { type: Boolean as PropType, default: true }, - name: String as PropType, - type: { type: String as PropType, default: 'text' }, - clearable: { type: Boolean as PropType, default: () => GlobalConfig.input.clearable }, - readonly: Boolean as PropType, - disabled: Boolean as PropType, - placeholder: { - type: String as PropType, - default: () => XEUtils.eqNull(GlobalConfig.input.placeholder) ? GlobalConfig.i18n('vxe.base.pleaseInput') : GlobalConfig.input.placeholder - }, - maxlength: [String, Number] as PropType, - autocomplete: { type: String as PropType, default: 'off' }, - align: String as PropType, - form: String as PropType, - className: String as PropType, - size: { type: String as PropType, default: () => GlobalConfig.input.size || GlobalConfig.size }, - multiple: Boolean as PropType, - - // text - showWordCount: Boolean as PropType, - countMethod: Function as PropType, - - // number、integer、float - min: { type: [String, Number] as PropType, default: null }, - max: { type: [String, Number] as PropType, default: null }, - step: [String, Number] as PropType, - exponential: { type: Boolean as PropType, default: () => GlobalConfig.input.exponential }, - - // number、integer、float、password - controls: { type: Boolean as PropType, default: () => GlobalConfig.input.controls }, - - // float - digits: { type: [String, Number] as PropType, default: () => GlobalConfig.input.digits }, - - // date、week、month、quarter、year - startDate: { type: [String, Number, Date] as PropType, default: () => GlobalConfig.input.startDate }, - endDate: { type: [String, Number, Date] as PropType, default: () => GlobalConfig.input.endDate }, - minDate: [String, Number, Date] as PropType, - maxDate: [String, Number, Date] as PropType, - // 已废弃 startWeek，被 startDay 替换 - startWeek: Number as PropType, - startDay: { type: [String, Number] as PropType, default: () => GlobalConfig.input.startDay }, - labelFormat: { type: String as PropType, default: () => GlobalConfig.input.labelFormat }, - valueFormat: { type: String as PropType, default: () => GlobalConfig.input.valueFormat }, - editable: { type: Boolean as PropType, default: true }, - festivalMethod: { type: Function as PropType, default: () => GlobalConfig.input.festivalMethod }, - disabledMethod: { type: Function as PropType, default: () => GlobalConfig.input.disabledMethod }, - - // week - selectDay: { type: [String, Number] as PropType, default: () => GlobalConfig.input.selectDay }, - - prefixIcon: String as PropType, - suffixIcon: String as PropType, - placement: String as PropType, - transfer: { type: Boolean as PropType, default: () => GlobalConfig.input.transfer } - }, - emits: [ - 'update:modelValue', - 'input', - 'change', - 'keydown', - 'keyup', - 'wheel', - 'click', - 'focus', - 'blur', - 'clear', - 'search-click', - 'toggle-visible', - 'prev-number', - 'next-number', - 'prefix-click', - 'suffix-click', - 'date-prev', - 'date-today', - 'date-next' - ] as VxeInputEmits, - setup (props, context) { - const { slots, emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - inited: false, - panelIndex: 0, - showPwd: false, - visiblePanel: false, - animatVisible: false, - panelStyle: null, - panelPlacement: '', - isActivated: false, - inputValue: props.modelValue, - datetimePanelValue: null, - datePanelValue: null, - datePanelLabel: '', - datePanelType: 'day', - selectMonth: null, - currentDate: null - }) - - const refElem = ref() as Ref - const refInputTarget = ref() as Ref - const refInputPanel = ref() as Ref - const refInputTimeBody = ref() as Ref - - const refMaps: InputPrivateRef = { - refElem, - refInput: refInputTarget - } - - const $xeinput = { - xID, - props, - context, - reactData, - getRefMaps: () => refMaps - } as unknown as VxeInputConstructor - - let inputMethods = {} as InputMethods - - const parseDate = (value: VxeInputPropTypes.ModelValue, format: string) => { - const { type } = props - if (type === 'time') { - return toStringTimeDate(value) - } - return XEUtils.toStringDate(value, format) - } - - const computeIsDateTimeType = computed(() => { - const { type } = props - return type === 'time' || type === 'datetime' - }) - - const computeIsNumType = computed(() => { - return ['number', 'integer', 'float'].indexOf(props.type) > -1 - }) - - const computeInputCount = computed(() => { - return XEUtils.getSize(reactData.inputValue) - }) - - const computeIsCountError = computed(() => { - const inputCount = computeInputCount.value - return props.maxlength && inputCount > XEUtils.toNumber(props.maxlength) - }) - - const computeIsDatePickerType = computed(() => { - const isDateTimeType = computeIsDateTimeType.value - return isDateTimeType || ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1 - }) - - const computeIsPawdType = computed(() => { - return props.type === 'password' - }) - - const computeIsSearchType = computed(() => { - return props.type === 'search' - }) - - const computeDigitsValue = computed(() => { - return XEUtils.toInteger(props.digits) || 1 - }) - - const computeStepValue = computed(() => { - const { type } = props - const digitsValue = computeDigitsValue.value - const step = props.step - if (type === 'integer') { - return XEUtils.toInteger(step) || 1 - } else if (type === 'float') { - return XEUtils.toNumber(step) || (1 / Math.pow(10, digitsValue)) - } - return XEUtils.toNumber(step) || 1 - }) - - const computeIsClearable = computed(() => { - const { type } = props - const isNumType = computeIsNumType.value - const isDatePickerType = computeIsDatePickerType.value - const isPawdType = computeIsPawdType.value - return props.clearable && (isPawdType || isNumType || isDatePickerType || type === 'text' || type === 'search') - }) - - const computeDateStartTime = computed(() => { - return props.startDate ? XEUtils.toStringDate(props.startDate) : null - }) - - const computeDateEndTime = computed(() => { - return props.endDate ? XEUtils.toStringDate(props.endDate) : null - }) - - const computeSupportMultiples = computed(() => { - return ['date', 'week', 'month', 'quarter', 'year'].includes(props.type) - }) - - const computeDateListValue = computed(() => { - const { modelValue, multiple } = props - const isDatePickerType = computeIsDatePickerType.value - const dateValueFormat = computeDateValueFormat.value - if (multiple && modelValue && isDatePickerType) { - return XEUtils.toValueString(modelValue).split(',').map(item => { - const date = parseDate(item, dateValueFormat) - if (XEUtils.isValidDate(date)) { - return date - } - return null - }) - } - return [] - }) - - const computeDateMultipleValue = computed(() => { - const dateListValue = computeDateListValue.value - const dateValueFormat = computeDateValueFormat.value - return dateListValue.map(date => XEUtils.toDateString(date, dateValueFormat)) - }) - - const computeDateMultipleLabel = computed(() => { - const dateListValue = computeDateListValue.value - const dateLabelFormat = computeDateLabelFormat.value - return dateListValue.map(date => XEUtils.toDateString(date, dateLabelFormat)).join(', ') - }) - - const computeDateValueFormat = computed(() => { - const { type } = props - return type === 'time' ? 'HH:mm:ss' : (props.valueFormat || (type === 'datetime' ? 'yyyy-MM-dd HH:mm:ss' : 'yyyy-MM-dd')) - }) - - const computeDateValue = computed(() => { - const { modelValue } = props - const isDatePickerType = computeIsDatePickerType.value - const dateValueFormat = computeDateValueFormat.value - let val = null - if (modelValue && isDatePickerType) { - const date = parseDate(modelValue, dateValueFormat) - if (XEUtils.isValidDate(date)) { - val = date - } - } - return val - }) - - const computeIsDisabledPrevDateBtn = computed(() => { - const dateStartTime = computeDateStartTime.value - const { selectMonth } = reactData - if (selectMonth && dateStartTime) { - return selectMonth <= dateStartTime - } - return false - }) - - const computeIsDisabledNextDateBtn = computed(() => { - const dateEndTime = computeDateEndTime.value - const { selectMonth } = reactData - if (selectMonth && dateEndTime) { - return selectMonth >= dateEndTime - } - return false - }) - - const computeDateTimeLabel = computed(() => { - const { datetimePanelValue } = reactData - if (datetimePanelValue) { - return XEUtils.toDateString(datetimePanelValue, 'HH:mm:ss') - } - return '' - }) - - const computeDateHMSTime = computed(() => { - const dateValue = computeDateValue.value - const isDateTimeType = computeIsDateTimeType.value - return dateValue && isDateTimeType ? (dateValue.getHours() * 3600 + dateValue.getMinutes() * 60 + dateValue.getSeconds()) * 1000 : 0 - }) - - const computeDateLabelFormat = computed(() => { - const isDatePickerType = computeIsDatePickerType.value - if (isDatePickerType) { - return props.labelFormat || GlobalConfig.i18n(`vxe.input.date.labelFormat.${props.type}`) - } - return null - }) - - const computeYearList = computed(() => { - const { selectMonth, currentDate } = reactData - const years: DateYearItem[] = [] - if (selectMonth && currentDate) { - const currFullYear = currentDate.getFullYear() - const selectFullYear = selectMonth.getFullYear() - const startYearDate = new Date(selectFullYear - selectFullYear % yearSize, 0, 1) - for (let index = -4; index < yearSize + 4; index++) { - const date = XEUtils.getWhatYear(startYearDate, index, 'first') - const itemFullYear = date.getFullYear() - years.push({ - date, - isCurrent: true, - isPrev: index < 0, - isNow: currFullYear === itemFullYear, - isNext: index >= yearSize, - year: itemFullYear - }) - } - } - return years - }) - - const computeSelectDatePanelLabel = computed(() => { - const isDatePickerType = computeIsDatePickerType.value - if (isDatePickerType) { - const { datePanelType, selectMonth } = reactData - const yearList = computeYearList.value - let year = '' - let month - if (selectMonth) { - year = selectMonth.getFullYear() - month = selectMonth.getMonth() + 1 - } - if (datePanelType === 'quarter') { - return GlobalConfig.i18n('vxe.input.date.quarterLabel', [year]) - } else if (datePanelType === 'month') { - return GlobalConfig.i18n('vxe.input.date.monthLabel', [year]) - } else if (datePanelType === 'year') { - return yearList.length ? `${yearList[0].year} - ${yearList[yearList.length - 1].year}` : '' - } - return GlobalConfig.i18n('vxe.input.date.dayLabel', [year, month ? GlobalConfig.i18n(`vxe.input.date.m${month}`) : '-']) - } - return '' - }) - - const computeFirstDayOfWeek = computed(() => { - const { startDay, startWeek } = props - return XEUtils.toNumber(XEUtils.isNumber(startDay) || XEUtils.isString(startDay) ? startDay : startWeek) as VxeInputPropTypes.StartDay - }) - - const computeWeekDatas = computed(() => { - const weeks = [] - const isDatePickerType = computeIsDatePickerType.value - if (isDatePickerType) { - let sWeek = computeFirstDayOfWeek.value - weeks.push(sWeek) - for (let index = 0; index < 6; index++) { - if (sWeek >= 6) { - sWeek = 0 - } else { - sWeek++ - } - weeks.push(sWeek) - } - } - return weeks - }) - - const computeDateHeaders = computed(() => { - const isDatePickerType = computeIsDatePickerType.value - if (isDatePickerType) { - const weekDatas = computeWeekDatas.value - return weekDatas.map((day) => { - return { - value: day, - label: GlobalConfig.i18n(`vxe.input.date.weeks.w${day}`) - } - }) - } - return [] - }) - - const computeWeekHeaders = computed(() => { - const isDatePickerType = computeIsDatePickerType.value - if (isDatePickerType) { - const dateHeaders = computeDateHeaders.value - return [{ label: GlobalConfig.i18n('vxe.input.date.weeks.w') }].concat(dateHeaders) - } - return [] - }) - - const computeYearDatas = computed(() => { - const yearList = computeYearList.value - return XEUtils.chunk(yearList, 4) - }) - - const computeQuarterList = computed(() => { - const { selectMonth, currentDate } = reactData - const quarters: DateQuarterItem[] = [] - if (selectMonth && currentDate) { - const currFullYear = currentDate.getFullYear() - const currQuarter = getDateQuarter(currentDate) - const firstYear = XEUtils.getWhatYear(selectMonth, 0, 'first') - const selFullYear = firstYear.getFullYear() - for (let index = -2; index < quarterSize - 2; index++) { - const date = XEUtils.getWhatQuarter(firstYear, index) - const itemFullYear = date.getFullYear() - const itemQuarter = getDateQuarter(date) - const isPrev = itemFullYear < selFullYear - quarters.push({ - date, - isPrev, - isCurrent: itemFullYear === selFullYear, - isNow: itemFullYear === currFullYear && itemQuarter === currQuarter, - isNext: !isPrev && itemFullYear > selFullYear, - quarter: itemQuarter - }) - } - } - return quarters - }) - - const computeQuarterDatas = computed(() => { - const quarterList = computeQuarterList.value - return XEUtils.chunk(quarterList, 2) - }) - - const computeMonthList = computed(() => { - const { selectMonth, currentDate } = reactData - const months: DateMonthItem[] = [] - if (selectMonth && currentDate) { - const currFullYear = currentDate.getFullYear() - const currMonth = currentDate.getMonth() - const selFullYear = XEUtils.getWhatYear(selectMonth, 0, 'first').getFullYear() - for (let index = -4; index < monthSize - 4; index++) { - const date = XEUtils.getWhatYear(selectMonth, 0, index) - const itemFullYear = date.getFullYear() - const itemMonth = date.getMonth() - const isPrev = itemFullYear < selFullYear - months.push({ - date, - isPrev, - isCurrent: itemFullYear === selFullYear, - isNow: itemFullYear === currFullYear && itemMonth === currMonth, - isNext: !isPrev && itemFullYear > selFullYear, - month: itemMonth - }) - } - } - return months - }) - - const computeMonthDatas = computed(() => { - const monthList = computeMonthList.value - return XEUtils.chunk(monthList, 4) - }) - - const computeDayList = computed(() => { - const { selectMonth, currentDate } = reactData - const days: DateDayItem[] = [] - if (selectMonth && currentDate) { - const dateHMSTime = computeDateHMSTime.value - const weekDatas = computeWeekDatas.value - const currFullYear = currentDate.getFullYear() - const currMonth = currentDate.getMonth() - const currDate = currentDate.getDate() - const selFullYear = selectMonth.getFullYear() - const selMonth = selectMonth.getMonth() - const selDay = selectMonth.getDay() - const prevOffsetDate = -weekDatas.indexOf(selDay) - const startDayDate = new Date(XEUtils.getWhatDay(selectMonth, prevOffsetDate).getTime() + dateHMSTime) - for (let index = 0; index < 42; index++) { - const date = XEUtils.getWhatDay(startDayDate, index) - const itemFullYear = date.getFullYear() - const itemMonth = date.getMonth() - const itemDate = date.getDate() - const isPrev = date < selectMonth - days.push({ - date, - isPrev, - isCurrent: itemFullYear === selFullYear && itemMonth === selMonth, - isNow: itemFullYear === currFullYear && itemMonth === currMonth && itemDate === currDate, - isNext: !isPrev && selMonth !== itemMonth, - label: itemDate - }) - } - } - return days - }) - - const computeDayDatas = computed(() => { - const dayList = computeDayList.value - return XEUtils.chunk(dayList, 7) - }) - - const computeWeekDates = computed(() => { - const dayDatas = computeDayDatas.value - const firstDayOfWeek = computeFirstDayOfWeek.value - return dayDatas.map((list) => { - const firstItem = list[0] - const item: DateDayItem = { - date: firstItem.date, - isWeekNumber: true, - isPrev: false, - isCurrent: false, - isNow: false, - isNext: false, - label: XEUtils.getYearWeek(firstItem.date, firstDayOfWeek) - } - return [item].concat(list) - }) - }) - - const computeHourList = computed(() => { - const list: DateHourMinuteSecondItem[] = [] - const isDateTimeType = computeIsDateTimeType.value - if (isDateTimeType) { - for (let index = 0; index < 24; index++) { - list.push({ - value: index, - label: ('' + index).padStart(2, '0') - }) - } - } - return list - }) - - const computeMinuteList = computed(() => { - const list: DateHourMinuteSecondItem[] = [] - const isDateTimeType = computeIsDateTimeType.value - if (isDateTimeType) { - for (let index = 0; index < 60; index++) { - list.push({ - value: index, - label: ('' + index).padStart(2, '0') - }) - } - } - return list - }) - - const computeSecondList = computed(() => { - const minuteList = computeMinuteList.value - return minuteList - }) - - const computeInpReadonly = computed(() => { - const { type, readonly, editable, multiple } = props - return readonly || multiple || !editable || type === 'week' || type === 'quarter' - }) - - const computeInputType = computed(() => { - const { type } = props - const { showPwd } = reactData - const isNumType = computeIsNumType.value - const isDatePickerType = computeIsDatePickerType.value - const isPawdType = computeIsPawdType.value - if (isDatePickerType || isNumType || (isPawdType && showPwd) || type === 'number') { - return 'text' - } - return type - }) - - const computeInpPlaceholder = computed(() => { - const { placeholder } = props - if (placeholder) { - return getFuncText(placeholder) - } - return '' - }) - - const computeInpMaxlength = computed(() => { - const { maxlength } = props - const isNumType = computeIsNumType.value - // 数值最大长度限制 16 位，包含小数 - return isNumType && !XEUtils.toNumber(maxlength) ? 16 : maxlength - }) - - const computeInpImmediate = computed(() => { - const { type, immediate } = props - return immediate || !(type === 'text' || type === 'number' || type === 'integer' || type === 'float') - }) - - const computeNumValue = computed(() => { - const { type } = props - const { inputValue } = reactData - const isNumType = computeIsNumType.value - if (isNumType) { - return type === 'integer' ? XEUtils.toInteger(handleNumber(inputValue)) : XEUtils.toNumber(handleNumber(inputValue)) - } - return 0 - }) - - const computeIsDisabledSubtractNumber = computed(() => { - const { min } = props - const { inputValue } = reactData - const isNumType = computeIsNumType.value - const numValue = computeNumValue.value - // 当有值时再进行判断 - if ((inputValue || inputValue === 0) && isNumType && min !== null) { - return numValue <= XEUtils.toNumber(min) - } - return false - }) - - const computeIsDisabledAddNumber = computed(() => { - const { max } = props - const { inputValue } = reactData - const isNumType = computeIsNumType.value - const numValue = computeNumValue.value - // 当有值时再进行判断 - if ((inputValue || inputValue === 0) && isNumType && max !== null) { - return numValue >= XEUtils.toNumber(max) - } - return false - }) - - const getNumberValue = (val: any) => { - const { type, exponential } = props - const inpMaxlength = computeInpMaxlength.value - const digitsValue = computeDigitsValue.value - const restVal = (type === 'float' ? toFloatValueFixed(val, digitsValue) : XEUtils.toValueString(val)) - if (exponential && (val === restVal || XEUtils.toValueString(val).toLowerCase() === XEUtils.toNumber(restVal).toExponential())) { - return val - } - return restVal.slice(0, inpMaxlength) - } - - const triggerEvent = (evnt: Event & { type: 'input' | 'change' | 'keydown' | 'keyup' | 'wheel' | 'click' | 'focus' | 'blur' }) => { - const { inputValue } = reactData - inputMethods.dispatchEvent(evnt.type, { value: inputValue }, evnt) - } - - const emitModel = (value: string, evnt: Event | { type: string }) => { - reactData.inputValue = value - emit('update:modelValue', value) - inputMethods.dispatchEvent('input', { value }, evnt) - if (XEUtils.toValueString(props.modelValue) !== value) { - inputMethods.dispatchEvent('change', { value }, evnt) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, value) - } - } - } - - const emitInputEvent = (value: any, evnt: Event) => { - const isDatePickerType = computeIsDatePickerType.value - const inpImmediate = computeInpImmediate.value - reactData.inputValue = value - if (!isDatePickerType) { - if (inpImmediate) { - emitModel(value, evnt) - } else { - inputMethods.dispatchEvent('input', { value }, evnt) - } - } - } - - const inputEvent = (evnt: Event & { type: 'input' }) => { - const inputElem = evnt.target as HTMLInputElement - const value = inputElem.value - emitInputEvent(value, evnt) - } - - const changeEvent = (evnt: Event & { type: 'change' }) => { - const inpImmediate = computeInpImmediate.value - if (!inpImmediate) { - triggerEvent(evnt) - } - } - - const focusEvent = (evnt: Event & { type: 'focus' }) => { - reactData.isActivated = true - const isDatePickerType = computeIsDatePickerType.value - if (isDatePickerType) { - datePickerOpenEvent(evnt) - } - triggerEvent(evnt) - } - - const clickPrefixEvent = (evnt: Event) => { - const { disabled } = props - if (!disabled) { - const { inputValue } = reactData - inputMethods.dispatchEvent('prefix-click', { value: inputValue }, evnt) - } - } - - let hidePanelTimeout: number - - const hidePanel = (): Promise => { - return new Promise(resolve => { - reactData.visiblePanel = false - hidePanelTimeout = window.setTimeout(() => { - reactData.animatVisible = false - resolve() - }, 350) - }) - } - - const clearValueEvent = (evnt: Event, value: VxeInputPropTypes.ModelValue) => { - const { type } = props - const isNumType = computeIsNumType.value - const isDatePickerType = computeIsDatePickerType.value - if (isDatePickerType) { - hidePanel() - } - if (isNumType || ['text', 'search', 'password'].indexOf(type) > -1) { - focus() - } - inputMethods.dispatchEvent('clear', { value }, evnt) - } - - const clickSuffixEvent = (evnt: Event) => { - const { disabled } = props - if (!disabled) { - if (hasClass(evnt.currentTarget, 'is--clear')) { - emitModel('', evnt) - clearValueEvent(evnt, '') - } else { - const { inputValue } = reactData - inputMethods.dispatchEvent('suffix-click', { value: inputValue }, evnt) - } - } - } - - const dateParseValue = (value?: VxeInputPropTypes.ModelValue) => { - const { type } = props - const { valueFormat } = props - const dateLabelFormat = computeDateLabelFormat.value - const firstDayOfWeek = computeFirstDayOfWeek.value - let dValue: Date | null = null - let dLabel = '' - if (value) { - dValue = parseDate(value, valueFormat) - } - if (XEUtils.isValidDate(dValue)) { - dLabel = XEUtils.toDateString(dValue, dateLabelFormat, { firstDay: firstDayOfWeek }) - // 由于年份和第几周是冲突的行为，所以需要特殊处理，判断是否跨年 - if (dateLabelFormat && type === 'week') { - const firstWeekDate = XEUtils.getWhatWeek(dValue, 0, firstDayOfWeek, firstDayOfWeek) - if (firstWeekDate.getFullYear() < dValue.getFullYear()) { - const yyIndex = dateLabelFormat.indexOf('yyyy') - if (yyIndex > -1) { - const yyNum = Number(dLabel.substring(yyIndex, yyIndex + 4)) - if (yyNum && !isNaN(yyNum)) { - dLabel = dLabel.replace(`${yyNum}`, `${yyNum - 1}`) - } - } - } - } - } else { - dValue = null - } - reactData.datePanelValue = dValue - reactData.datePanelLabel = dLabel - } - - /** - * 值变化时处理 - */ - const changeValue = () => { - const isDatePickerType = computeIsDatePickerType.value - const { inputValue } = reactData - if (isDatePickerType) { - dateParseValue(inputValue) - reactData.inputValue = props.multiple ? computeDateMultipleLabel.value : reactData.datePanelLabel - } - } - - /** - * 检查初始值 - */ - const initValue = () => { - const { type } = props - const { inputValue } = reactData - const isDatePickerType = computeIsDatePickerType.value - const digitsValue = computeDigitsValue.value - if (isDatePickerType) { - changeValue() - } else if (type === 'float') { - if (inputValue) { - const validValue = toFloatValueFixed(inputValue, digitsValue) - if (inputValue !== validValue) { - emitModel(validValue, { type: 'init' }) - } - } - } - } - - const vaildMaxNum = (num: number | string) => { - return props.max === null || XEUtils.toNumber(num) <= XEUtils.toNumber(props.max) - } - - const vaildMinNum = (num: number | string) => { - return props.min === null || XEUtils.toNumber(num) >= XEUtils.toNumber(props.min) - } - - const dateRevert = () => { - reactData.inputValue = props.multiple ? computeDateMultipleLabel.value : reactData.datePanelLabel - } - - const dateCheckMonth = (date: Date) => { - const month = XEUtils.getWhatMonth(date, 0, 'first') - if (!XEUtils.isEqual(month, reactData.selectMonth)) { - reactData.selectMonth = month - } - } - - const dateChange = (date: Date) => { - const { modelValue, multiple } = props - const { datetimePanelValue } = reactData - const isDateTimeType = computeIsDateTimeType.value - const dateValueFormat = computeDateValueFormat.value - const firstDayOfWeek = computeFirstDayOfWeek.value - if (props.type === 'week') { - const sWeek = XEUtils.toNumber(props.selectDay) as VxeInputPropTypes.SelectDay - date = XEUtils.getWhatWeek(date, 0, sWeek, firstDayOfWeek) - } else if (isDateTimeType) { - date.setHours(datetimePanelValue.getHours()) - date.setMinutes(datetimePanelValue.getMinutes()) - date.setSeconds(datetimePanelValue.getSeconds()) - } - const inpVal = XEUtils.toDateString(date, dateValueFormat, { firstDay: firstDayOfWeek }) - dateCheckMonth(date) - if (multiple) { - // 如果为多选 - const dateMultipleValue = computeDateMultipleValue.value - if (isDateTimeType) { - // 如果是datetime特殊类型 - const dateListValue = [...computeDateListValue.value] - const datetimeRest: Date[] = [] - const eqIndex = XEUtils.findIndexOf(dateListValue, val => XEUtils.isDateSame(date, val, 'yyyyMMdd')) - if (eqIndex === -1) { - dateListValue.push(date) - } else { - dateListValue.splice(eqIndex, 1) - } - dateListValue.forEach(item => { - if (item) { - item.setHours(datetimePanelValue.getHours()) - item.setMinutes(datetimePanelValue.getMinutes()) - item.setSeconds(datetimePanelValue.getSeconds()) - datetimeRest.push(item) - } - }) - emitModel(datetimeRest.map(date => XEUtils.toDateString(date, dateValueFormat)).join(','), { type: 'update' }) - } else { - // 如果是日期类型 - if (dateMultipleValue.some(val => XEUtils.isEqual(val, inpVal))) { - emitModel(dateMultipleValue.filter(val => !XEUtils.isEqual(val, inpVal)).join(','), { type: 'update' }) - } else { - emitModel(dateMultipleValue.concat([inpVal]).join(','), { type: 'update' }) - } - } - } else { - // 如果为单选 - if (!XEUtils.isEqual(modelValue, inpVal)) { - emitModel(inpVal, { type: 'update' }) - } - } - } - - const afterCheckValue = () => { - const { type, min, max, exponential } = props - const { inputValue, datetimePanelValue } = reactData - const isNumType = computeIsNumType.value - const isDatePickerType = computeIsDatePickerType.value - const dateLabelFormat = computeDateLabelFormat.value - const inpReadonly = computeInpReadonly.value - if (!inpReadonly) { - if (isNumType) { - if (inputValue) { - let inpNumVal: number | string = type === 'integer' ? XEUtils.toInteger(handleNumber(inputValue)) : XEUtils.toNumber(handleNumber(inputValue)) - if (!vaildMinNum(inpNumVal)) { - inpNumVal = min - } else if (!vaildMaxNum(inpNumVal)) { - inpNumVal = max - } - if (exponential) { - const inpStringVal = XEUtils.toValueString(inputValue).toLowerCase() - if (inpStringVal === XEUtils.toNumber(inpNumVal).toExponential()) { - inpNumVal = inpStringVal - } - } - emitModel(getNumberValue(inpNumVal), { type: 'check' }) - } - } else if (isDatePickerType) { - if (inputValue) { - let inpDateVal: VxeInputPropTypes.ModelValue = parseDate(inputValue, dateLabelFormat as string) - if (XEUtils.isValidDate(inpDateVal)) { - if (type === 'time') { - inpDateVal = XEUtils.toDateString(inpDateVal, dateLabelFormat) - if (inputValue !== inpDateVal) { - emitModel(inpDateVal, { type: 'check' }) - } - reactData.inputValue = inpDateVal - } else { - let isChange = false - const firstDayOfWeek = computeFirstDayOfWeek.value - if (type === 'datetime') { - const dateValue = computeDateValue.value - if (inputValue !== XEUtils.toDateString(dateValue, dateLabelFormat) || inputValue !== XEUtils.toDateString(inpDateVal, dateLabelFormat)) { - isChange = true - datetimePanelValue.setHours(inpDateVal.getHours()) - datetimePanelValue.setMinutes(inpDateVal.getMinutes()) - datetimePanelValue.setSeconds(inpDateVal.getSeconds()) - } - } else { - isChange = true - } - reactData.inputValue = XEUtils.toDateString(inpDateVal, dateLabelFormat, { firstDay: firstDayOfWeek }) - if (isChange) { - dateChange(inpDateVal) - } - } - } else { - dateRevert() - } - } else { - emitModel('', { type: 'check' }) - } - } - } - } - - const blurEvent = (evnt: Event & { type: 'blur' }) => { - const { inputValue } = reactData - const inpImmediate = computeInpImmediate.value - if (!inpImmediate) { - emitModel(inputValue, evnt) - } - afterCheckValue() - if (!reactData.visiblePanel) { - reactData.isActivated = false - } - inputMethods.dispatchEvent('blur', { value: inputValue }, evnt) - } - - // 密码 - const passwordToggleEvent = (evnt: Event) => { - const { readonly, disabled } = props - const { showPwd } = reactData - if (!disabled && !readonly) { - reactData.showPwd = !showPwd - } - inputMethods.dispatchEvent('toggle-visible', { visible: reactData.showPwd }, evnt) - } - // 密码 - - // 搜索 - const searchEvent = (evnt: Event) => { - inputMethods.dispatchEvent('search-click', {}, evnt) - } - // 搜索 - - // 数值 - const numberChange = (isPlus: boolean, evnt: Event) => { - const { min, max, type } = props - const { inputValue } = reactData - const stepValue = computeStepValue.value - const numValue = type === 'integer' ? XEUtils.toInteger(handleNumber(inputValue)) : XEUtils.toNumber(handleNumber(inputValue)) - const newValue = isPlus ? XEUtils.add(numValue, stepValue) : XEUtils.subtract(numValue, stepValue) - let restNum: number | string - if (!vaildMinNum(newValue)) { - restNum = min - } else if (!vaildMaxNum(newValue)) { - restNum = max - } else { - restNum = newValue - } - emitInputEvent(getNumberValue(restNum), evnt as (Event & { type: 'input' })) - } - - let downbumTimeout: number - - const numberNextEvent = (evnt: Event) => { - const { readonly, disabled } = props - const isDisabledSubtractNumber = computeIsDisabledSubtractNumber.value - clearTimeout(downbumTimeout) - if (!disabled && !readonly && !isDisabledSubtractNumber) { - numberChange(false, evnt) - } - inputMethods.dispatchEvent('next-number', {}, evnt) - } - - const numberDownNextEvent = (evnt: Event) => { - downbumTimeout = window.setTimeout(() => { - numberNextEvent(evnt) - numberDownNextEvent(evnt) - }, 60) - } - - const numberPrevEvent = (evnt: Event) => { - const { readonly, disabled } = props - const isDisabledAddNumber = computeIsDisabledAddNumber.value - clearTimeout(downbumTimeout) - if (!disabled && !readonly && !isDisabledAddNumber) { - numberChange(true, evnt) - } - inputMethods.dispatchEvent('prev-number', {}, evnt) - } - - const numberKeydownEvent = (evnt: KeyboardEvent) => { - const isUpArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_UP) - const isDwArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_DOWN) - if (isUpArrow || isDwArrow) { - evnt.preventDefault() - if (isUpArrow) { - numberPrevEvent(evnt) - } else { - numberNextEvent(evnt) - } - } - } - - const keydownEvent = (evnt: KeyboardEvent & { type: 'keydown' }) => { - const { exponential, controls } = props - const isNumType = computeIsNumType.value - if (isNumType) { - const isCtrlKey = evnt.ctrlKey - const isShiftKey = evnt.shiftKey - const isAltKey = evnt.altKey - const keyCode = evnt.keyCode - if (!isCtrlKey && !isShiftKey && !isAltKey && (hasEventKey(evnt, EVENT_KEYS.SPACEBAR) || ((!exponential || keyCode !== 69) && (keyCode >= 65 && keyCode <= 90)) || (keyCode >= 186 && keyCode <= 188) || keyCode >= 191)) { - evnt.preventDefault() - } - if (controls) { - numberKeydownEvent(evnt) - } - } - triggerEvent(evnt) - } - - const keyupEvent = (evnt: KeyboardEvent & { type: 'keyup' }) => { - triggerEvent(evnt) - } - - // 数值 - - const numberStopDown = () => { - clearTimeout(downbumTimeout) - } - - const numberDownPrevEvent = (evnt: Event) => { - downbumTimeout = window.setTimeout(() => { - numberPrevEvent(evnt) - numberDownPrevEvent(evnt) - }, 60) - } - - const numberMousedownEvent = (evnt: MouseEvent) => { - numberStopDown() - if (evnt.button === 0) { - const isPrevNumber = hasClass(evnt.currentTarget, 'is--prev') - if (isPrevNumber) { - numberPrevEvent(evnt) - } else { - numberNextEvent(evnt) - } - downbumTimeout = window.setTimeout(() => { - if (isPrevNumber) { - numberDownPrevEvent(evnt) - } else { - numberDownNextEvent(evnt) - } - }, 500) - } - } - - const wheelEvent = (evnt: WheelEvent & { - type: 'wheel'; - wheelDelta: number; - }) => { - const isNumType = computeIsNumType.value - if (isNumType && props.controls) { - if (reactData.isActivated) { - const delta = evnt.deltaY - if (delta > 0) { - numberNextEvent(evnt) - } else if (delta < 0) { - numberPrevEvent(evnt) - } - evnt.preventDefault() - } - } - triggerEvent(evnt) - } - - // 日期 - const dateMonthHandle = (date: Date, offsetMonth: number) => { - reactData.selectMonth = XEUtils.getWhatMonth(date, offsetMonth, 'first') - } - - const dateNowHandle = () => { - const currentDate = XEUtils.getWhatDay(Date.now(), 0, 'first') - reactData.currentDate = currentDate - dateMonthHandle(currentDate, 0) - } - - const dateToggleTypeEvent = () => { - let { datePanelType } = reactData - if (datePanelType === 'month' || datePanelType === 'quarter') { - datePanelType = 'year' - } else { - datePanelType = 'month' - } - reactData.datePanelType = datePanelType - } - - const datePrevEvent = (evnt: Event) => { - const { type } = props - const { datePanelType, selectMonth } = reactData - const isDisabledPrevDateBtn = computeIsDisabledPrevDateBtn.value - if (!isDisabledPrevDateBtn) { - if (type === 'year') { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -yearSize, 'first') - } else if (type === 'month' || type === 'quarter') { - if (datePanelType === 'year') { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -yearSize, 'first') - } else { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -1, 'first') - } - } else { - if (datePanelType === 'year') { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -yearSize, 'first') - } else if (datePanelType === 'month') { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, -1, 'first') - } else { - reactData.selectMonth = XEUtils.getWhatMonth(selectMonth, -1, 'first') - } - } - inputMethods.dispatchEvent('date-prev', { type }, evnt) - } - } - - const dateTodayMonthEvent = (evnt: Event) => { - dateNowHandle() - if (!props.multiple) { - dateChange(reactData.currentDate) - hidePanel() - } - inputMethods.dispatchEvent('date-today', { type: props.type }, evnt) - } - - const dateNextEvent = (evnt: Event) => { - const { type } = props - const { datePanelType, selectMonth } = reactData - const isDisabledNextDateBtn = computeIsDisabledNextDateBtn.value - if (!isDisabledNextDateBtn) { - if (type === 'year') { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, yearSize, 'first') - } else if (type === 'month' || type === 'quarter') { - if (datePanelType === 'year') { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, yearSize, 'first') - } else { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, 1, 'first') - } - } else { - if (datePanelType === 'year') { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, yearSize, 'first') - } else if (datePanelType === 'month') { - reactData.selectMonth = XEUtils.getWhatYear(selectMonth, 1, 'first') - } else { - reactData.selectMonth = XEUtils.getWhatMonth(selectMonth, 1, 'first') - } - } - inputMethods.dispatchEvent('date-next', { type }, evnt) - } - } - - const isDateDisabled = (item: { date: Date }) => { - const { disabledMethod } = props - const { datePanelType } = reactData - return disabledMethod && disabledMethod({ type: datePanelType, viewType: datePanelType, date: item.date, $input: $xeinput }) - } - - const dateSelectItem = (date: Date) => { - const { type, multiple } = props - const { datePanelType } = reactData - if (type === 'month') { - if (datePanelType === 'year') { - reactData.datePanelType = 'month' - dateCheckMonth(date) - } else { - dateChange(date) - if (!multiple) { - hidePanel() - } - } - } else if (type === 'year') { - dateChange(date) - if (!multiple) { - hidePanel() - } - } else if (type === 'quarter') { - if (datePanelType === 'year') { - reactData.datePanelType = 'quarter' - dateCheckMonth(date) - } else { - dateChange(date) - if (!multiple) { - hidePanel() - } - } - } else { - if (datePanelType === 'month') { - reactData.datePanelType = type === 'week' ? type : 'day' - dateCheckMonth(date) - } else if (datePanelType === 'year') { - reactData.datePanelType = 'month' - dateCheckMonth(date) - } else { - dateChange(date) - if (type === 'datetime') { - // 日期带时间 - } else { - if (!multiple) { - hidePanel() - } - } - } - } - } - - const dateSelectEvent = (item: DateYearItem | DateQuarterItem | DateMonthItem | DateDayItem) => { - if (!isDateDisabled(item)) { - dateSelectItem(item.date) - } - } - - const dateMoveDay = (offsetDay: Date) => { - if (!isDateDisabled({ date: offsetDay })) { - const dayList = computeDayList.value - if (!dayList.some((item) => XEUtils.isDateSame(item.date, offsetDay, 'yyyyMMdd'))) { - dateCheckMonth(offsetDay) - } - dateParseValue(offsetDay) - } - } - - const dateMoveYear = (offsetYear: Date) => { - if (!isDateDisabled({ date: offsetYear })) { - const yearList = computeYearList.value - if (!yearList.some((item) => XEUtils.isDateSame(item.date, offsetYear, 'yyyy'))) { - dateCheckMonth(offsetYear) - } - dateParseValue(offsetYear) - } - } - - const dateMoveQuarter = (offsetQuarter: Date) => { - if (!isDateDisabled({ date: offsetQuarter })) { - const quarterList = computeQuarterList.value - if (!quarterList.some((item) => XEUtils.isDateSame(item.date, offsetQuarter, 'yyyyq'))) { - dateCheckMonth(offsetQuarter) - } - dateParseValue(offsetQuarter) - } - } - - const dateMoveMonth = (offsetMonth: Date) => { - if (!isDateDisabled({ date: offsetMonth })) { - const monthList = computeMonthList.value - if (!monthList.some((item) => XEUtils.isDateSame(item.date, offsetMonth, 'yyyyMM'))) { - dateCheckMonth(offsetMonth) - } - dateParseValue(offsetMonth) - } - } - - const dateMouseenterEvent = (item: DateYearItem | DateQuarterItem | DateMonthItem | DateDayItem) => { - if (!isDateDisabled(item)) { - const { datePanelType } = reactData - if (datePanelType === 'month') { - dateMoveMonth(item.date) - } else if (datePanelType === 'quarter') { - dateMoveQuarter(item.date) - } else if (datePanelType === 'year') { - dateMoveYear(item.date) - } else { - dateMoveDay(item.date) - } - } - } - - const updateTimePos = (liElem: Element) => { - if (liElem) { - const height = (liElem as HTMLElement).offsetHeight - const ulElem = liElem.parentNode as HTMLElement - ulElem.scrollTop = (liElem as HTMLElement).offsetTop - height * 4 - } - } - - const dateTimeChangeEvent = (evnt: Event) => { - reactData.datetimePanelValue = new Date(reactData.datetimePanelValue.getTime()) - updateTimePos(evnt.currentTarget as HTMLLIElement) - } - - const dateHourEvent = (evnt: MouseEvent, item: DateHourMinuteSecondItem) => { - reactData.datetimePanelValue.setHours(item.value) - dateTimeChangeEvent(evnt) - } - - const dateConfirmEvent = () => { - const { multiple } = props - const { datetimePanelValue } = reactData - const dateValue = computeDateValue.value - const isDateTimeType = computeIsDateTimeType.value - if (isDateTimeType) { - const dateValueFormat = computeDateValueFormat.value - if (multiple) { - // 如果为多选 - const dateMultipleValue = computeDateMultipleValue.value - if (isDateTimeType) { - // 如果是datetime特殊类型 - const dateListValue = [...computeDateListValue.value] - const datetimeRest: Date[] = [] - dateListValue.forEach(item => { - if (item) { - item.setHours(datetimePanelValue.getHours()) - item.setMinutes(datetimePanelValue.getMinutes()) - item.setSeconds(datetimePanelValue.getSeconds()) - datetimeRest.push(item) - } - }) - emitModel(datetimeRest.map(date => XEUtils.toDateString(date, dateValueFormat)).join(','), { type: 'update' }) - } else { - // 如果是日期类型 - emitModel(dateMultipleValue.join(','), { type: 'update' }) - } - } else { - dateChange(dateValue || reactData.currentDate) - } - } - hidePanel() - } - - const dateMinuteEvent = (evnt: MouseEvent, item: DateHourMinuteSecondItem) => { - reactData.datetimePanelValue.setMinutes(item.value) - dateTimeChangeEvent(evnt) - } - - const dateSecondEvent = (evnt: MouseEvent, item: DateHourMinuteSecondItem) => { - reactData.datetimePanelValue.setSeconds(item.value) - dateTimeChangeEvent(evnt) - } - - const dateOffsetEvent = (evnt: KeyboardEvent) => { - const { isActivated, datePanelValue, datePanelType } = reactData - if (isActivated) { - evnt.preventDefault() - const isLeftArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_LEFT) - const isUpArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_UP) - const isRightArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_RIGHT) - const isDwArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_DOWN) - if (datePanelType === 'year') { - let offsetYear = XEUtils.getWhatYear(datePanelValue || Date.now(), 0, 'first') - if (isLeftArrow) { - offsetYear = XEUtils.getWhatYear(offsetYear, -1) - } else if (isUpArrow) { - offsetYear = XEUtils.getWhatYear(offsetYear, -4) - } else if (isRightArrow) { - offsetYear = XEUtils.getWhatYear(offsetYear, 1) - } else if (isDwArrow) { - offsetYear = XEUtils.getWhatYear(offsetYear, 4) - } - dateMoveYear(offsetYear) - } else if (datePanelType === 'quarter') { - let offsetQuarter = XEUtils.getWhatQuarter(datePanelValue || Date.now(), 0, 'first') - if (isLeftArrow) { - offsetQuarter = XEUtils.getWhatQuarter(offsetQuarter, -1) - } else if (isUpArrow) { - offsetQuarter = XEUtils.getWhatQuarter(offsetQuarter, -2) - } else if (isRightArrow) { - offsetQuarter = XEUtils.getWhatQuarter(offsetQuarter, 1) - } else if (isDwArrow) { - offsetQuarter = XEUtils.getWhatQuarter(offsetQuarter, 2) - } - dateMoveQuarter(offsetQuarter) - } else if (datePanelType === 'month') { - let offsetMonth = XEUtils.getWhatMonth(datePanelValue || Date.now(), 0, 'first') - if (isLeftArrow) { - offsetMonth = XEUtils.getWhatMonth(offsetMonth, -1) - } else if (isUpArrow) { - offsetMonth = XEUtils.getWhatMonth(offsetMonth, -4) - } else if (isRightArrow) { - offsetMonth = XEUtils.getWhatMonth(offsetMonth, 1) - } else if (isDwArrow) { - offsetMonth = XEUtils.getWhatMonth(offsetMonth, 4) - } - dateMoveMonth(offsetMonth) - } else { - let offsetDay = datePanelValue || XEUtils.getWhatDay(Date.now(), 0, 'first') - const firstDayOfWeek = computeFirstDayOfWeek.value - if (isLeftArrow) { - offsetDay = XEUtils.getWhatDay(offsetDay, -1) - } else if (isUpArrow) { - offsetDay = XEUtils.getWhatWeek(offsetDay, -1, firstDayOfWeek) - } else if (isRightArrow) { - offsetDay = XEUtils.getWhatDay(offsetDay, 1) - } else if (isDwArrow) { - offsetDay = XEUtils.getWhatWeek(offsetDay, 1, firstDayOfWeek) - } - dateMoveDay(offsetDay) - } - } - } - - const datePgOffsetEvent = (evnt: KeyboardEvent) => { - const { isActivated } = reactData - if (isActivated) { - const isPgUp = hasEventKey(evnt, EVENT_KEYS.PAGE_UP) - evnt.preventDefault() - if (isPgUp) { - datePrevEvent(evnt) - } else { - dateNextEvent(evnt) - } - } - } - - const dateOpenPanel = () => { - const { type } = props - const isDateTimeType = computeIsDateTimeType.value - const dateValue = computeDateValue.value - if (['year', 'quarter', 'month', 'week'].indexOf(type) > -1) { - reactData.datePanelType = type as 'year' | 'quarter' | 'month' | 'week' - } else { - reactData.datePanelType = 'day' - } - reactData.currentDate = XEUtils.getWhatDay(Date.now(), 0, 'first') - if (dateValue) { - dateMonthHandle(dateValue, 0) - dateParseValue(dateValue) - } else { - dateNowHandle() - } - if (isDateTimeType) { - reactData.datetimePanelValue = reactData.datePanelValue || XEUtils.getWhatDay(Date.now(), 0, 'first') - nextTick(() => { - const timeBodyElem = refInputTimeBody.value - XEUtils.arrayEach(timeBodyElem.querySelectorAll('li.is--selected'), updateTimePos) - }) - } - } - - // 日期 - - // 弹出面板 - const updateZindex = () => { - if (reactData.panelIndex < getLastZIndex()) { - reactData.panelIndex = nextZIndex() - } - } - - const updatePlacement = () => { - return nextTick().then(() => { - const { transfer, placement } = props - const { panelIndex } = reactData - const targetElem = refInputTarget.value - const panelElem = refInputPanel.value - if (targetElem && panelElem) { - const targetHeight = targetElem.offsetHeight - const targetWidth = targetElem.offsetWidth - const panelHeight = panelElem.offsetHeight - const panelWidth = panelElem.offsetWidth - const marginSize = 5 - const panelStyle: VNodeStyle = { - zIndex: panelIndex - } - const { boundingTop, boundingLeft, visibleHeight, visibleWidth } = getAbsolutePos(targetElem) - let panelPlacement: VxeInputPropTypes.Placement = 'bottom' - console.log(getAbsolutePos(targetElem)) - if (transfer) { - let left = boundingLeft - let top = boundingTop + targetHeight - if (placement === 'top') { - panelPlacement = 'top' - top = boundingTop - panelHeight - } else if (!placement) { - // 如果下面不够放，则向上 - if (top + panelHeight + marginSize > visibleHeight) { - panelPlacement = 'top' - top = boundingTop - panelHeight - } - // 如果上面不够放，则向下（优先） - if (top < marginSize) { - panelPlacement = 'bottom' - top = boundingTop + targetHeight - } - } - // 如果溢出右边 - if (left + panelWidth + marginSize > visibleWidth) { - left -= left + panelWidth + marginSize - visibleWidth - } - // 如果溢出左边 - if (left < marginSize) { - left = marginSize - } - Object.assign(panelStyle, { - left: `${left}px`, - top: `${top}px`, - minWidth: `${targetWidth}px` - }) - } else { - if (placement === 'top') { - panelPlacement = 'top' - panelStyle.bottom = `${targetHeight}px` - } else if (!placement) { - // 如果下面不够放，则向上 - if (boundingTop + targetHeight + panelHeight > visibleHeight) { - // 如果上面不够放，则向下（优先） - if (boundingTop - targetHeight - panelHeight > marginSize) { - panelPlacement = 'top' - panelStyle.bottom = `${targetHeight}px` - } - } - } - } - reactData.panelStyle = panelStyle - reactData.panelPlacement = panelPlacement - return nextTick() - } - }) - } - - const showPanel = () => { - const { disabled } = props - const { visiblePanel } = reactData - const isDatePickerType = computeIsDatePickerType.value - if (!disabled && !visiblePanel) { - if (!reactData.inited) { - reactData.inited = true - } - clearTimeout(hidePanelTimeout) - reactData.isActivated = true - reactData.animatVisible = true - if (isDatePickerType) { - dateOpenPanel() - } - setTimeout(() => { - reactData.visiblePanel = true - }, 10) - updateZindex() - return updatePlacement() - } - return nextTick() - } - - const datePickerOpenEvent = (evnt: Event) => { - const { readonly } = props - if (!readonly) { - evnt.preventDefault() - showPanel() - } - } - - const clickEvent = (evnt: Event & { type: 'click' }) => { - triggerEvent(evnt) - } - - // 弹出面板 - - // 全局事件 - const handleGlobalMousedownEvent = (evnt: Event) => { - const { disabled } = props - const { visiblePanel, isActivated } = reactData - const isDatePickerType = computeIsDatePickerType.value - const el = refElem.value - const panelElem = refInputPanel.value - if (!disabled && isActivated) { - reactData.isActivated = getEventTargetNode(evnt, el).flag || getEventTargetNode(evnt, panelElem).flag - if (!reactData.isActivated) { - // 如果是日期类型 - if (isDatePickerType) { - if (visiblePanel) { - hidePanel() - afterCheckValue() - } - } else { - afterCheckValue() - } - } - } - } - - const handleGlobalKeydownEvent = (evnt: KeyboardEvent) => { - const { clearable, disabled } = props - const { visiblePanel } = reactData - const isDatePickerType = computeIsDatePickerType.value - if (!disabled) { - const isTab = hasEventKey(evnt, EVENT_KEYS.TAB) - const isDel = hasEventKey(evnt, EVENT_KEYS.DELETE) - const isEsc = hasEventKey(evnt, EVENT_KEYS.ESCAPE) - const isEnter = hasEventKey(evnt, EVENT_KEYS.ENTER) - const isLeftArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_LEFT) - const isUpArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_UP) - const isRightArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_RIGHT) - const isDwArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_DOWN) - const isPgUp = hasEventKey(evnt, EVENT_KEYS.PAGE_UP) - const isPgDn = hasEventKey(evnt, EVENT_KEYS.PAGE_DOWN) - const operArrow = isLeftArrow || isUpArrow || isRightArrow || isDwArrow - let isActivated = reactData.isActivated - if (isTab) { - if (isActivated) { - afterCheckValue() - } - isActivated = false - reactData.isActivated = isActivated - } else if (operArrow) { - if (isDatePickerType) { - if (isActivated) { - if (visiblePanel) { - dateOffsetEvent(evnt) - } else if (isUpArrow || isDwArrow) { - datePickerOpenEvent(evnt) - } - } - } - } else if (isEnter) { - if (isDatePickerType) { - if (visiblePanel) { - if (reactData.datePanelValue) { - dateSelectItem(reactData.datePanelValue) - } else { - hidePanel() - } - } else if (isActivated) { - datePickerOpenEvent(evnt) - } - } - } else if (isPgUp || isPgDn) { - if (isDatePickerType) { - if (isActivated) { - datePgOffsetEvent(evnt) - } - } - } - if (isTab || isEsc) { - if (visiblePanel) { - hidePanel() - } - } else if (isDel && clearable) { - if (isActivated) { - clearValueEvent(evnt, null) - } - } - } - } - - const handleGlobalMousewheelEvent = (evnt: Event) => { - const { disabled } = props - const { visiblePanel } = reactData - if (!disabled) { - if (visiblePanel) { - const panelElem = refInputPanel.value - if (getEventTargetNode(evnt, panelElem).flag) { - updatePlacement() - } else { - hidePanel() - afterCheckValue() - } - } - } - } - - const handleGlobalBlurEvent = () => { - const { isActivated, visiblePanel } = reactData - if (visiblePanel) { - hidePanel() - afterCheckValue() - } else if (isActivated) { - afterCheckValue() - } - } - - const renderDateLabel = (item: DateYearItem | DateQuarterItem | DateMonthItem | DateDayItem, label: string | number) => { - const { festivalMethod } = props - if (festivalMethod) { - const { datePanelType } = reactData - const festivalRest = festivalMethod({ type: datePanelType, viewType: datePanelType, date: item.date, $input: $xeinput }) - const festivalItem = festivalRest ? (XEUtils.isString(festivalRest) ? { label: festivalRest } : festivalRest) : {} - const extraItem = festivalItem.extra ? (XEUtils.isString(festivalItem.extra) ? { label: festivalItem.extra } : festivalItem.extra) : null - const labels = [ - h('span', { - class: ['vxe-input--date-label', { - 'is-notice': festivalItem.notice - }] - }, extraItem && extraItem.label ? [ - h('span', label), - h('span', { - class: ['vxe-input--date-label--extra', extraItem.important ? 'is-important' : '', extraItem.className], - style: extraItem.style - }, XEUtils.toValueString(extraItem.label)) - ] : label) - ] - const festivalLabel = festivalItem.label - if (festivalLabel) { - // 默认最多支持3个节日重叠 - const festivalLabels = XEUtils.toValueString(festivalLabel).split(',') - labels.push( - h('span', { - class: ['vxe-input--date-festival', festivalItem.important ? 'is-important' : '', festivalItem.className], - style: festivalItem.style - }, [ - festivalLabels.length > 1 ? h('span', { - class: ['vxe-input--date-festival--overlap', `overlap--${festivalLabels.length}`] - }, festivalLabels.map(label => h('span', label.substring(0, 3)))) : h('span', { - class: 'vxe-input--date-festival--label' - }, festivalLabels[0].substring(0, 3)) - ]) - ) - } - return labels - } - return label - } - - const renderDateDayTable = () => { - const { multiple } = props - const { datePanelType, datePanelValue } = reactData - const dateValue = computeDateValue.value - const dateHeaders = computeDateHeaders.value - const dayDatas = computeDayDatas.value - const dateListValue = computeDateListValue.value - const matchFormat = 'yyyyMMdd' - return [ - h('table', { - class: `vxe-input--date-${datePanelType}-view`, - cellspacing: 0, - cellpadding: 0, - border: 0 - }, [ - h('thead', [ - h('tr', dateHeaders.map((item) => { - return h('th', item.label) - })) - ]), - h('tbody', dayDatas.map((rows) => { - return h('tr', rows.map((item) => { - return h('td', { - class: { - 'is--prev': item.isPrev, - 'is--current': item.isCurrent, - 'is--now': item.isNow, - 'is--next': item.isNext, - 'is--disabled': isDateDisabled(item), - 'is--selected': multiple ? dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat)) : XEUtils.isDateSame(dateValue, item.date, matchFormat), - 'is--hover': XEUtils.isDateSame(datePanelValue, item.date, matchFormat) - }, - onClick: () => dateSelectEvent(item), - onMouseenter: () => dateMouseenterEvent(item) - }, renderDateLabel(item, item.label)) - })) - })) - ]) - ] - } - - const renderDateWeekTable = () => { - const { multiple } = props - const { datePanelType, datePanelValue } = reactData - const dateValue = computeDateValue.value - const weekHeaders = computeWeekHeaders.value - const weekDates = computeWeekDates.value - const dateListValue = computeDateListValue.value - const matchFormat = 'yyyyMMdd' - return [ - h('table', { - class: `vxe-input--date-${datePanelType}-view`, - cellspacing: 0, - cellpadding: 0, - border: 0 - }, [ - h('thead', [ - h('tr', weekHeaders.map((item) => { - return h('th', item.label) - })) - ]), - h('tbody', weekDates.map((rows) => { - const isSelected = multiple ? rows.some((item) => dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat))) : rows.some((item) => XEUtils.isDateSame(dateValue, item.date, matchFormat)) - const isHover = rows.some((item) => XEUtils.isDateSame(datePanelValue, item.date, matchFormat)) - return h('tr', rows.map((item) => { - return h('td', { - class: { - 'is--prev': item.isPrev, - 'is--current': item.isCurrent, - 'is--now': item.isNow, - 'is--next': item.isNext, - 'is--disabled': isDateDisabled(item), - 'is--selected': isSelected, - 'is--hover': isHover - }, - // event - onClick: () => dateSelectEvent(item), - onMouseenter: () => dateMouseenterEvent(item) - }, renderDateLabel(item, item.label)) - })) - })) - ]) - ] - } - - const renderDateMonthTable = () => { - const { multiple } = props - const { datePanelType, datePanelValue } = reactData - const dateValue = computeDateValue.value - const monthDatas = computeMonthDatas.value - const dateListValue = computeDateListValue.value - const matchFormat = 'yyyyMM' - return [ - h('table', { - class: `vxe-input--date-${datePanelType}-view`, - cellspacing: 0, - cellpadding: 0, - border: 0 - }, [ - h('tbody', monthDatas.map((rows) => { - return h('tr', rows.map((item) => { - return h('td', { - class: { - 'is--prev': item.isPrev, - 'is--current': item.isCurrent, - 'is--now': item.isNow, - 'is--next': item.isNext, - 'is--disabled': isDateDisabled(item), - 'is--selected': multiple ? dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat)) : XEUtils.isDateSame(dateValue, item.date, matchFormat), - 'is--hover': XEUtils.isDateSame(datePanelValue, item.date, matchFormat) - }, - onClick: () => dateSelectEvent(item), - onMouseenter: () => dateMouseenterEvent(item) - }, renderDateLabel(item, GlobalConfig.i18n(`vxe.input.date.months.m${item.month}`))) - })) - })) - ]) - ] - } - - const renderDateQuarterTable = () => { - const { multiple } = props - const { datePanelType, datePanelValue } = reactData - const dateValue = computeDateValue.value - const quarterDatas = computeQuarterDatas.value - const dateListValue = computeDateListValue.value - const matchFormat = 'yyyyq' - return [ - h('table', { - class: `vxe-input--date-${datePanelType}-view`, - cellspacing: 0, - cellpadding: 0, - border: 0 - }, [ - h('tbody', quarterDatas.map((rows) => { - return h('tr', rows.map((item) => { - return h('td', { - class: { - 'is--prev': item.isPrev, - 'is--current': item.isCurrent, - 'is--now': item.isNow, - 'is--next': item.isNext, - 'is--disabled': isDateDisabled(item), - 'is--selected': multiple ? dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat)) : XEUtils.isDateSame(dateValue, item.date, matchFormat), - 'is--hover': XEUtils.isDateSame(datePanelValue, item.date, matchFormat) - }, - onClick: () => dateSelectEvent(item), - onMouseenter: () => dateMouseenterEvent(item) - }, renderDateLabel(item, GlobalConfig.i18n(`vxe.input.date.quarters.q${item.quarter}`))) - })) - })) - ]) - ] - } - - const renderDateYearTable = () => { - const { multiple } = props - const { datePanelType, datePanelValue } = reactData - const dateValue = computeDateValue.value - const yearDatas = computeYearDatas.value - const dateListValue = computeDateListValue.value - const matchFormat = 'yyyy' - return [ - h('table', { - class: `vxe-input--date-${datePanelType}-view`, - cellspacing: 0, - cellpadding: 0, - border: 0 - }, [ - h('tbody', yearDatas.map((rows) => { - return h('tr', rows.map((item) => { - return h('td', { - class: { - 'is--prev': item.isPrev, - 'is--current': item.isCurrent, - 'is--now': item.isNow, - 'is--next': item.isNext, - 'is--disabled': isDateDisabled(item), - 'is--selected': multiple ? dateListValue.some(val => XEUtils.isDateSame(val, item.date, matchFormat)) : XEUtils.isDateSame(dateValue, item.date, matchFormat), - 'is--hover': XEUtils.isDateSame(datePanelValue, item.date, matchFormat) - }, - onClick: () => dateSelectEvent(item), - onMouseenter: () => dateMouseenterEvent(item) - }, renderDateLabel(item, item.year)) - })) - })) - ]) - ] - } - - const renderDateTable = () => { - const { datePanelType } = reactData - switch (datePanelType) { - case 'week' : - return renderDateWeekTable() - case 'month' : - return renderDateMonthTable() - case 'quarter' : - return renderDateQuarterTable() - case 'year' : - return renderDateYearTable() - } - return renderDateDayTable() - } - - const renderDatePanel = () => { - const { multiple } = props - const { datePanelType } = reactData - const isDisabledPrevDateBtn = computeIsDisabledPrevDateBtn.value - const isDisabledNextDateBtn = computeIsDisabledNextDateBtn.value - const selectDatePanelLabel = computeSelectDatePanelLabel.value - return [ - h('div', { - class: 'vxe-input--date-picker-header' - }, [ - h('div', { - class: 'vxe-input--date-picker-type-wrapper' - }, [ - datePanelType === 'year' ? h('span', { - class: 'vxe-input--date-picker-label' - }, selectDatePanelLabel) : h('span', { - class: 'vxe-input--date-picker-btn', - onClick: dateToggleTypeEvent - }, selectDatePanelLabel) - ]), - h('div', { - class: 'vxe-input--date-picker-btn-wrapper' - }, [ - h('span', { - class: ['vxe-input--date-picker-btn vxe-input--date-picker-prev-btn', { - 'is--disabled': isDisabledPrevDateBtn - }], - onClick: datePrevEvent - }, [ - h('i', { - class: 'vxe-icon-caret-left' - }) - ]), - h('span', { - class: 'vxe-input--date-picker-btn vxe-input--date-picker-current-btn', - onClick: dateTodayMonthEvent - }, [ - h('i', { - class: 'vxe-icon-dot' - }) - ]), - h('span', { - class: ['vxe-input--date-picker-btn vxe-input--date-picker-next-btn', { - 'is--disabled': isDisabledNextDateBtn - }], - onClick: dateNextEvent - }, [ - h('i', { - class: 'vxe-icon-caret-right' - }) - ]), - multiple && computeSupportMultiples.value ? h('span', { - class: 'vxe-input--date-picker-btn vxe-input--date-picker-confirm-btn' - }, [ - h('button', { - class: 'vxe-input--date-picker-confirm', - type: 'button', - onClick: dateConfirmEvent - }, GlobalConfig.i18n('vxe.button.confirm')) - ]) : null - ]) - ]), - h('div', { - class: 'vxe-input--date-picker-body' - }, renderDateTable()) - ] - } - - const renderTimePanel = () => { - const { datetimePanelValue } = reactData - const dateTimeLabel = computeDateTimeLabel.value - const hourList = computeHourList.value - const minuteList = computeMinuteList.value - const secondList = computeSecondList.value - return [ - h('div', { - class: 'vxe-input--time-picker-header' - }, [ - h('span', { - class: 'vxe-input--time-picker-title' - }, dateTimeLabel), - h('button', { - class: 'vxe-input--time-picker-confirm', - type: 'button', - onClick: dateConfirmEvent - }, GlobalConfig.i18n('vxe.button.confirm')) - ]), - h('div', { - ref: refInputTimeBody, - class: 'vxe-input--time-picker-body' - }, [ - h('ul', { - class: 'vxe-input--time-picker-hour-list' - }, hourList.map((item, index) => { - return h('li', { - key: index, - class: { - 'is--selected': datetimePanelValue && datetimePanelValue.getHours() === item.value - }, - onClick: (evnt: MouseEvent) => dateHourEvent(evnt, item) - }, item.label) - })), - h('ul', { - class: 'vxe-input--time-picker-minute-list' - }, minuteList.map((item, index) => { - return h('li', { - key: index, - class: { - 'is--selected': datetimePanelValue && datetimePanelValue.getMinutes() === item.value - }, - onClick: (evnt: MouseEvent) => dateMinuteEvent(evnt, item) - }, item.label) - })), - h('ul', { - class: 'vxe-input--time-picker-second-list' - }, secondList.map((item, index) => { - return h('li', { - key: index, - class: { - 'is--selected': datetimePanelValue && datetimePanelValue.getSeconds() === item.value - }, - onClick: (evnt: MouseEvent) => dateSecondEvent(evnt, item) - }, item.label) - })) - ]) - ] - } - - const renderPanel = () => { - const { type, transfer } = props - const { inited, animatVisible, visiblePanel, panelPlacement, panelStyle } = reactData - const vSize = computeSize.value - const isDatePickerType = computeIsDatePickerType.value - const renders = [] - if (isDatePickerType) { - if (type === 'datetime') { - renders.push( - h('div', { - class: 'vxe-input--panel-layout-wrapper' - }, [ - h('div', { - class: 'vxe-input--panel-left-wrapper' - }, renderDatePanel()), - h('div', { - class: 'vxe-input--panel-right-wrapper' - }, renderTimePanel()) - ]) - ) - } else if (type === 'time') { - renders.push( - h('div', { - class: 'vxe-input--panel-wrapper' - }, renderTimePanel()) - ) - } else { - renders.push( - h('div', { - class: 'vxe-input--panel-wrapper' - }, renderDatePanel()) - ) - } - return h(Teleport, { - to: 'body', - disabled: transfer ? !inited : true - }, [ - h('div', { - ref: refInputPanel, - class: ['vxe-table--ignore-clear vxe-input--panel', `type--${type}`, { - [`size--${vSize}`]: vSize, - 'is--transfer': transfer, - 'animat--leave': animatVisible, - 'animat--enter': visiblePanel - }], - placement: panelPlacement, - style: panelStyle - }, renders) - ]) - } - return null - } - - const renderNumberIcon = () => { - const isDisabledAddNumber = computeIsDisabledAddNumber.value - const isDisabledSubtractNumber = computeIsDisabledSubtractNumber.value - return h('span', { - class: 'vxe-input--number-suffix' - }, [ - h('span', { - class: ['vxe-input--number-prev is--prev', { - 'is--disabled': isDisabledAddNumber - }], - onMousedown: numberMousedownEvent, - onMouseup: numberStopDown, - onMouseleave: numberStopDown - }, [ - h('i', { - class: ['vxe-input--number-prev-icon', GlobalConfig.icon.INPUT_PREV_NUM] - }) - ]), - h('span', { - class: ['vxe-input--number-next is--next', { - 'is--disabled': isDisabledSubtractNumber - }], - onMousedown: numberMousedownEvent, - onMouseup: numberStopDown, - onMouseleave: numberStopDown - }, [ - h('i', { - class: ['vxe-input--number-next-icon', GlobalConfig.icon.INPUT_NEXT_NUM] - }) - ]) - ]) - } - - const renderDatePickerIcon = () => { - return h('span', { - class: 'vxe-input--date-picker-suffix', - onClick: datePickerOpenEvent - }, [ - h('i', { - class: ['vxe-input--date-picker-icon', GlobalConfig.icon.INPUT_DATE] - }) - ]) - } - - const renderSearchIcon = () => { - return h('span', { - class: 'vxe-input--search-suffix', - onClick: searchEvent - }, [ - h('i', { - class: ['vxe-input--search-icon', GlobalConfig.icon.INPUT_SEARCH] - }) - ]) - } - - const renderPasswordIcon = () => { - const { showPwd } = reactData - return h('span', { - class: 'vxe-input--password-suffix', - onClick: passwordToggleEvent - }, [ - h('i', { - class: ['vxe-input--password-icon', showPwd ? GlobalConfig.icon.INPUT_SHOW_PWD : GlobalConfig.icon.INPUT_PWD] - }) - ]) - } - - const rendePrefixIcon = () => { - const { prefixIcon } = props - const prefixSlot = slots.prefix - const icons = [] - if (prefixSlot) { - icons.push( - h('span', { - class: 'vxe-input--prefix-icon' - }, prefixSlot({})) - ) - } else if (prefixIcon) { - icons.push( - h('i', { - class: ['vxe-input--prefix-icon', prefixIcon] - }) - ) - } - return icons.length ? h('span', { - class: 'vxe-input--prefix', - onClick: clickPrefixEvent - }, icons) : null - } - - const renderSuffixIcon = () => { - const { disabled, suffixIcon } = props - const { inputValue } = reactData - const suffixSlot = slots.suffix - const isClearable = computeIsClearable.value - const icons = [] - if (suffixSlot) { - icons.push( - h('span', { - class: 'vxe-input--suffix-icon' - }, suffixSlot({})) - ) - } else if (suffixIcon) { - icons.push( - h('i', { - class: ['vxe-input--suffix-icon', suffixIcon] - }) - ) - } - if (isClearable) { - icons.push( - h('i', { - class: ['vxe-input--clear-icon', GlobalConfig.icon.INPUT_CLEAR] - }) - ) - } - return icons.length ? h('span', { - class: ['vxe-input--suffix', { - 'is--clear': isClearable && !disabled && !(inputValue === '' || XEUtils.eqNull(inputValue)) - }], - onClick: clickSuffixEvent - }, icons) : null - } - - const renderExtraSuffixIcon = () => { - const { controls } = props - const isNumType = computeIsNumType.value - const isDatePickerType = computeIsDatePickerType.value - const isPawdType = computeIsPawdType.value - const isSearchType = computeIsSearchType.value - let icons - if (isPawdType) { - icons = renderPasswordIcon() - } else if (isNumType) { - if (controls) { - icons = renderNumberIcon() - } - } else if (isDatePickerType) { - icons = renderDatePickerIcon() - } else if (isSearchType) { - icons = renderSearchIcon() - } - return icons ? h('span', { - class: 'vxe-input--extra-suffix' - }, [icons]) : null - } - - inputMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $input: $xeinput, $event: evnt }, params)) - }, - - focus () { - const inputElem = refInputTarget.value - reactData.isActivated = true - inputElem.focus() - return nextTick() - }, - blur () { - const inputElem = refInputTarget.value - inputElem.blur() - reactData.isActivated = false - return nextTick() - }, - select () { - const inputElem = refInputTarget.value - inputElem.select() - reactData.isActivated = false - return nextTick() - }, - showPanel, - hidePanel, - updatePlacement - } - - Object.assign($xeinput, inputMethods) - - watch(() => props.modelValue, (val) => { - reactData.inputValue = val - changeValue() - }) - - watch(() => props.type, () => { - // 切换类型是重置内置变量 - Object.assign(reactData, { - inputValue: props.modelValue, - datetimePanelValue: null, - datePanelValue: null, - datePanelLabel: '', - datePanelType: 'day', - selectMonth: null, - currentDate: null - }) - initValue() - }) - - watch(computeDateLabelFormat, () => { - const isDatePickerType = computeIsDatePickerType.value - if (isDatePickerType) { - dateParseValue(reactData.datePanelValue) - reactData.inputValue = props.multiple ? computeDateMultipleLabel.value : reactData.datePanelLabel - } - }) - - nextTick(() => { - GlobalEvent.on($xeinput, 'mousewheel', handleGlobalMousewheelEvent) - GlobalEvent.on($xeinput, 'mousedown', handleGlobalMousedownEvent) - GlobalEvent.on($xeinput, 'keydown', handleGlobalKeydownEvent) - GlobalEvent.on($xeinput, 'blur', handleGlobalBlurEvent) - }) - - onUnmounted(() => { - numberStopDown() - GlobalEvent.off($xeinput, 'mousewheel') - GlobalEvent.off($xeinput, 'mousedown') - GlobalEvent.off($xeinput, 'keydown') - GlobalEvent.off($xeinput, 'blur') - }) - - initValue() - - const renderVN = () => { - const { className, controls, type, align, showWordCount, countMethod, name, disabled, readonly, autocomplete } = props - const { inputValue, visiblePanel, isActivated } = reactData - const vSize = computeSize.value - const isCountError = computeIsCountError.value - const inputCount = computeInputCount.value - const isDatePickerType = computeIsDatePickerType.value - const inpReadonly = computeInpReadonly.value - const inpMaxlength = computeInpMaxlength.value - const inputType = computeInputType.value - const inpPlaceholder = computeInpPlaceholder.value - const childs = [] - const prefix = rendePrefixIcon() - const suffix = renderSuffixIcon() - // 前缀图标 - if (prefix) { - childs.push(prefix) - } - // 输入框 - childs.push( - h('input', { - ref: refInputTarget, - class: 'vxe-input--inner', - value: inputValue, - name, - type: inputType, - placeholder: inpPlaceholder, - maxlength: inpMaxlength, - readonly: inpReadonly, - disabled, - autocomplete, - onKeydown: keydownEvent, - onKeyup: keyupEvent, - onWheel: wheelEvent, - onClick: clickEvent, - onInput: inputEvent, - onChange: changeEvent, - onFocus: focusEvent, - onBlur: blurEvent - }) - ) - // 后缀图标 - if (suffix) { - childs.push(suffix) - } - // 特殊功能图标 - childs.push(renderExtraSuffixIcon()) - // 面板容器 - if (isDatePickerType) { - childs.push(renderPanel()) - } - let isWordCount = false - // 统计字数 - if (showWordCount && ['text', 'search'].includes(type)) { - isWordCount = true - childs.push( - h('span', { - class: ['vxe-input--count', { - 'is--error': isCountError - }] - }, countMethod ? `${countMethod({ value: inputValue })}` : `${inputCount}${inpMaxlength ? `/${inpMaxlength}` : ''}`) - ) - } - return h('div', { - ref: refElem, - class: ['vxe-input', `type--${type}`, className, { - [`size--${vSize}`]: vSize, - [`is--${align}`]: align, - 'is--controls': controls, - 'is--prefix': !!prefix, - 'is--suffix': !!suffix, - 'is--readonly': readonly, - 'is--visivle': visiblePanel, - 'is--count': isWordCount, - 'is--disabled': disabled, - 'is--active': isActivated - }] - }, childs) - } - - $xeinput.renderVN = renderVN - - return $xeinput - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/input/src/number.ts b/packages/input/src/number.ts deleted file mode 100644 index c4ff761917..0000000000 --- a/packages/input/src/number.ts +++ /dev/null @@ -1,12 +0,0 @@ -import XEUtils from 'xe-utils' - -export function handleNumber (val: string | number) { - return XEUtils.isString(val) ? val.replace(/,/g, '') : val -} - -export function toFloatValueFixed (inputValue: string | number, digitsValue: number) { - if (/^-/.test('' + inputValue)) { - return XEUtils.toFixed(XEUtils.ceil(inputValue, digitsValue), digitsValue) - } - return XEUtils.toFixed(XEUtils.floor(inputValue, digitsValue), digitsValue) -} diff --git a/packages/keyboard/index.d.ts b/packages/keyboard/index.d.ts deleted file mode 100644 index 47ed31ada6..0000000000 --- a/packages/keyboard/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTableKeyboardModule } from '../../types/module/keyboard' - -export * from '../../types/module/keyboard' -export default VxeTableKeyboardModule diff --git a/packages/keyboard/index.ts b/packages/keyboard/index.ts deleted file mode 100644 index f2ad226907..0000000000 --- a/packages/keyboard/index.ts +++ /dev/null @@ -1,12 +0,0 @@ -import keyboardHook from './src/hook' -import { VXETable } from '../v-x-e-table' - -export const VxeTableKeyboardModule = { - install () { - VXETable.hooks.add('$tableKeyboard', keyboardHook) - } -} - -export const Keyboard = VxeTableKeyboardModule - -export default VxeTableKeyboardModule diff --git a/packages/list/index.d.ts b/packages/list/index.d.ts deleted file mode 100644 index 8e348807f8..0000000000 --- a/packages/list/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeList } from '../../types/list' - -export * from '../../types/list' -export default VxeList diff --git a/packages/list/index.ts b/packages/list/index.ts deleted file mode 100644 index ddd1f987c8..0000000000 --- a/packages/list/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeListComponent from './src/list' -import { dynamicApp } from '../dynamics' - -export const VxeList = Object.assign(VxeListComponent, { - install (app: App) { - app.component(VxeListComponent.name, VxeListComponent) - } -}) - -export const List = VxeList - -dynamicApp.component(VxeListComponent.name, VxeListComponent) - -export default VxeList diff --git a/packages/list/src/list.ts b/packages/list/src/list.ts deleted file mode 100644 index 165f5816ce..0000000000 --- a/packages/list/src/list.ts +++ /dev/null @@ -1,372 +0,0 @@ -import { defineComponent, h, PropType, ref, Ref, computed, onUnmounted, watch, reactive, nextTick, onActivated } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' -import { createResizeEvent, XEResizeObserver } from '../../tools/resize' -import { browse } from '../../tools/dom' -import { GlobalEvent } from '../../tools/event' -import VxeLoading from '../../loading/index' - -import { VxeListConstructor, VxeListPropTypes, VxeListEmits, ListReactData, ListInternalData, ListMethods, ListPrivateRef, VxeListMethods } from '../../../types/all' - -export default defineComponent({ - name: 'VxeList', - props: { - data: Array as PropType, - height: [Number, String] as PropType, - maxHeight: [Number, String] as PropType, - loading: Boolean as PropType, - className: [String, Function] as PropType, - size: { type: String as PropType, default: () => GlobalConfig.list.size || GlobalConfig.size }, - autoResize: { type: Boolean as PropType, default: () => GlobalConfig.list.autoResize }, - syncResize: [Boolean, String, Number] as PropType, - scrollY: Object as PropType - }, - emits: [ - 'scroll' - ] as VxeListEmits, - setup (props, context) { - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - scrollYLoad: false, - bodyHeight: 0, - rowHeight: 0, - topSpaceHeight: 0, - items: [] - } as ListReactData) - - const refElem = ref() as Ref - const refVirtualWrapper = ref() as Ref - const refVirtualBody = ref() as Ref - - const internalData: ListInternalData = { - fullData: [], - lastScrollLeft: 0, - lastScrollTop: 0, - scrollYStore: { - startIndex: 0, - endIndex: 0, - visibleSize: 0, - offsetSize: 0, - rowHeight: 0 - } - } - - const refMaps: ListPrivateRef = { - refElem - } - - const $xelist = { - xID, - props, - context, - reactData, - internalData, - getRefMaps: () => refMaps - } as unknown as VxeListConstructor & VxeListMethods - - let listMethods = {} as ListMethods - - const computeSYOpts = computed(() => { - return Object.assign({} as { gt: number }, GlobalConfig.list.scrollY, props.scrollY) - }) - - const computeStyles = computed(() => { - const { height, maxHeight } = props - const style: { [key: string]: string | number } = {} - if (height) { - style.height = `${isNaN(height as number) ? height : `${height}px`}` - } else if (maxHeight) { - style.height = 'auto' - style.maxHeight = `${isNaN(maxHeight as number) ? maxHeight : `${maxHeight}px`}` - } - return style - }) - - const updateYSpace = () => { - const { scrollYLoad } = reactData - const { scrollYStore, fullData } = internalData - reactData.bodyHeight = scrollYLoad ? fullData.length * scrollYStore.rowHeight : 0 - reactData.topSpaceHeight = scrollYLoad ? Math.max(scrollYStore.startIndex * scrollYStore.rowHeight, 0) : 0 - } - - const handleData = () => { - const { scrollYLoad } = reactData - const { fullData, scrollYStore } = internalData - reactData.items = scrollYLoad ? fullData.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullData.slice(0) - return nextTick() - } - - const updateYData = () => { - handleData() - updateYSpace() - } - - const computeScrollLoad = () => { - return nextTick().then(() => { - const { scrollYLoad } = reactData - const { scrollYStore } = internalData - const virtualBodyElem = refVirtualBody.value - const sYOpts = computeSYOpts.value - let rowHeight = 0 - let firstItemElem: HTMLElement | undefined - if (virtualBodyElem) { - if (sYOpts.sItem) { - firstItemElem = virtualBodyElem.querySelector(sYOpts.sItem) as HTMLElement - } - if (!firstItemElem) { - firstItemElem = virtualBodyElem.children[0] as HTMLElement - } - } - if (firstItemElem) { - rowHeight = firstItemElem.offsetHeight - } - rowHeight = Math.max(20, rowHeight) - scrollYStore.rowHeight = rowHeight - // 计算 Y 逻辑 - if (scrollYLoad) { - const scrollBodyElem = refVirtualWrapper.value - const visibleYSize = Math.max(8, Math.ceil(scrollBodyElem.clientHeight / rowHeight)) - const offsetYSize = sYOpts.oSize ? XEUtils.toNumber(sYOpts.oSize) : (browse.edge ? 10 : 0) - scrollYStore.offsetSize = offsetYSize - scrollYStore.visibleSize = visibleYSize - scrollYStore.endIndex = Math.max(scrollYStore.startIndex, visibleYSize + offsetYSize, scrollYStore.endIndex) - updateYData() - } else { - updateYSpace() - } - reactData.rowHeight = rowHeight - }) - } - - /** - * 清除滚动条 - */ - const clearScroll = () => { - const scrollBodyElem = refVirtualWrapper.value - if (scrollBodyElem) { - scrollBodyElem.scrollTop = 0 - } - return nextTick() - } - - /** - * 如果有滚动条，则滚动到对应的位置 - * @param {Number} scrollLeft 左距离 - * @param {Number} scrollTop 上距离 - */ - const scrollTo = (scrollLeft: number | null, scrollTop?: number | null): Promise => { - const scrollBodyElem = refVirtualWrapper.value - if (XEUtils.isNumber(scrollLeft)) { - scrollBodyElem.scrollLeft = scrollLeft - } - if (XEUtils.isNumber(scrollTop)) { - scrollBodyElem.scrollTop = scrollTop - } - if (reactData.scrollYLoad) { - return new Promise(resolve => { - setTimeout(() => { - nextTick(() => { - resolve() - }) - }, 50) - }) - } - return nextTick() - } - - /** - * 刷新滚动条 - */ - const refreshScroll = () => { - const { lastScrollLeft, lastScrollTop } = internalData - return clearScroll().then(() => { - if (lastScrollLeft || lastScrollTop) { - internalData.lastScrollLeft = 0 - internalData.lastScrollTop = 0 - return scrollTo(lastScrollLeft, lastScrollTop) - } - }) - } - - /** - * 重新计算列表 - */ - const recalculate = () => { - const el = refElem.value - if (el.clientWidth && el.clientHeight) { - return computeScrollLoad() - } - return Promise.resolve() - } - - const loadYData = (evnt: Event) => { - const { scrollYStore } = internalData - const { startIndex, endIndex, visibleSize, offsetSize, rowHeight } = scrollYStore - const scrollBodyElem = evnt.target as HTMLDivElement - const scrollTop = scrollBodyElem.scrollTop - const toVisibleIndex = Math.floor(scrollTop / rowHeight) - const offsetStartIndex = Math.max(0, toVisibleIndex - 1 - offsetSize) - const offsetEndIndex = toVisibleIndex + visibleSize + offsetSize - if (toVisibleIndex <= startIndex || toVisibleIndex >= endIndex - visibleSize - 1) { - if (startIndex !== offsetStartIndex || endIndex !== offsetEndIndex) { - scrollYStore.startIndex = offsetStartIndex - scrollYStore.endIndex = offsetEndIndex - updateYData() - } - } - } - - const scrollEvent = (evnt: Event) => { - const scrollBodyElem = evnt.target as HTMLDivElement - const scrollTop = scrollBodyElem.scrollTop - const scrollLeft = scrollBodyElem.scrollLeft - const isX = scrollLeft !== internalData.lastScrollLeft - const isY = scrollTop !== internalData.lastScrollTop - internalData.lastScrollTop = scrollTop - internalData.lastScrollLeft = scrollLeft - if (reactData.scrollYLoad) { - loadYData(evnt) - } - listMethods.dispatchEvent('scroll', { scrollLeft, scrollTop, isX, isY }, evnt) - } - - listMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $list: $xelist, $event: evnt }, params)) - }, - /** - * 加载数据 - * @param {Array} datas 数据 - */ - loadData (datas) { - const { scrollYStore } = internalData - const sYOpts = computeSYOpts.value - const fullData = datas || [] - Object.assign(scrollYStore, { - startIndex: 0, - endIndex: 1, - visibleSize: 0 - }) - internalData.fullData = fullData - // 如果gt为0，则总是启用 - reactData.scrollYLoad = !!sYOpts.enabled && sYOpts.gt > -1 && (sYOpts.gt === 0 || sYOpts.gt <= fullData.length) - handleData() - return computeScrollLoad().then(() => { - refreshScroll() - }) - }, - /** - * 重新加载数据 - * @param {Array} datas 数据 - */ - reloadData (datas) { - clearScroll() - return listMethods.loadData(datas) - }, - recalculate, - scrollTo, - refreshScroll, - clearScroll - } - - Object.assign($xelist, listMethods) - - const dataFlag = ref(0) - watch(() => props.data ? props.data.length : -1, () => { - dataFlag.value++ - }) - watch(() => props.data, () => { - dataFlag.value++ - }) - watch(dataFlag, () => { - listMethods.loadData(props.data || []) - }) - - watch(() => props.syncResize, (value) => { - if (value) { - recalculate() - nextTick(() => setTimeout(() => recalculate())) - } - }) - - onActivated(() => { - recalculate().then(() => refreshScroll()) - }) - - let resizeObserver: XEResizeObserver - - nextTick(() => { - GlobalEvent.on($xelist, 'resize', () => { - recalculate() - }) - if (props.autoResize) { - const el = refElem.value - resizeObserver = createResizeEvent(() => recalculate()) - resizeObserver.observe(el) - } - listMethods.loadData(props.data || []) - }) - - onUnmounted(() => { - if (resizeObserver) { - resizeObserver.disconnect() - } - GlobalEvent.off($xelist, 'resize') - }) - - const renderVN = () => { - const { className, loading } = props - const { bodyHeight, topSpaceHeight, items } = reactData - const vSize = computeSize.value - const styles = computeStyles.value - return h('div', { - ref: refElem, - class: ['vxe-list', className ? (XEUtils.isFunction(className) ? className({ $list: $xelist }) : className) : '', { - [`size--${vSize}`]: vSize, - 'is--loading': loading - }] - }, [ - h('div', { - ref: refVirtualWrapper, - class: 'vxe-list--virtual-wrapper', - style: styles, - onScroll: scrollEvent - }, [ - h('div', { - class: 'vxe-list--y-space', - style: { - height: bodyHeight ? `${bodyHeight}px` : '' - } - }), - h('div', { - ref: refVirtualBody, - class: 'vxe-list--body', - style: { - marginTop: topSpaceHeight ? `${topSpaceHeight}px` : '' - } - }, slots.default ? slots.default({ items, $list: $xelist }) : []) - ]), - /** - * 加载中 - */ - h(VxeLoading, { - class: 'vxe-list--loading', - modelValue: loading - }) - ]) - } - - $xelist.renderVN = renderVN - - return $xelist - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/loading/index.d.ts b/packages/loading/index.d.ts deleted file mode 100644 index 29512e9d3d..0000000000 --- a/packages/loading/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeLoading } from '../../types/loading' - -export * from '../../types/loading' -export default VxeLoading diff --git a/packages/loading/index.ts b/packages/loading/index.ts deleted file mode 100644 index fd5981a8ad..0000000000 --- a/packages/loading/index.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { App } from 'vue' -import VxeLoadingComponent from './src/loading' - -export const VxeLoading = Object.assign(VxeLoadingComponent, { - install (app: App) { - app.component(VxeLoadingComponent.name, VxeLoadingComponent) - } -}) - -export const Loading = VxeLoading - -export default VxeLoading diff --git a/packages/loading/src/loading.ts b/packages/loading/src/loading.ts deleted file mode 100644 index a802de9c19..0000000000 --- a/packages/loading/src/loading.ts +++ /dev/null @@ -1,48 +0,0 @@ -import { defineComponent, h, computed } from 'vue' -import GlobalConfig from '../../v-x-e-table/src/conf' - -export default defineComponent({ - name: 'VxeLoading', - props: { - modelValue: Boolean, - icon: String, - text: String - }, - setup (props, { slots }) { - const computeLoadingIcon = computed(() => { - return props.icon || GlobalConfig.icon.LOADING - }) - - const computeLoadingText = computed(() => { - const loadingText = GlobalConfig.loadingText - return props.text || (loadingText === null ? loadingText : GlobalConfig.i18n('vxe.loading.text')) - }) - - return () => { - const loadingIcon = computeLoadingIcon.value - const loadingText = computeLoadingText.value - return h('div', { - class: ['vxe-loading', { - 'is--visible': props.modelValue - }] - }, slots.default ? [ - h('div', { - class: 'vxe-loading--wrapper' - }, slots.default({})) - ] : [ - h('div', { - class: 'vxe-loading--chunk' - }, [ - loadingIcon ? h('i', { - class: loadingIcon - }) : h('div', { - class: 'vxe-loading--spinner' - }), - loadingText ? h('div', { - class: 'vxe-loading--text' - }, `${loadingText}`) : null - ]) - ]) - } - } -}) diff --git a/packages/locale/lang/en-US.ts b/packages/locale/lang/en-US.ts index 73c5b43709..473606eebd 100644 --- a/packages/locale/lang/en-US.ts +++ b/packages/locale/lang/en-US.ts @@ -1,3 +1,7 @@ +/** + * v4保留兼容，已废弃，即将删除文件 + * @deprecated + */ export default { vxe: { base: { diff --git a/packages/locale/lang/es-ES.ts b/packages/locale/lang/es-ES.ts index 13c977872e..4aeade258e 100644 --- a/packages/locale/lang/es-ES.ts +++ b/packages/locale/lang/es-ES.ts @@ -1,3 +1,7 @@ +/** + * v4保留兼容，已废弃，即将删除文件 + * @deprecated + */ export default { vxe: { base: { diff --git a/packages/locale/lang/ja-JP.ts b/packages/locale/lang/ja-JP.ts index ff30588445..6341dbca63 100644 --- a/packages/locale/lang/ja-JP.ts +++ b/packages/locale/lang/ja-JP.ts @@ -1,3 +1,7 @@ +/** + * v4保留兼容，已废弃，即将删除文件 + * @deprecated + */ export default { vxe: { base: { diff --git a/packages/locale/lang/pt-BR.ts b/packages/locale/lang/pt-BR.ts index c5d244ef0a..1e54462a91 100644 --- a/packages/locale/lang/pt-BR.ts +++ b/packages/locale/lang/pt-BR.ts @@ -1,3 +1,7 @@ +/** + * v4保留兼容，已废弃，即将删除文件 + * @deprecated + */ export default { vxe: { base: { diff --git a/packages/locale/lang/zh-CN.ts b/packages/locale/lang/zh-CN.ts index b1c1a69a20..875606474d 100644 --- a/packages/locale/lang/zh-CN.ts +++ b/packages/locale/lang/zh-CN.ts @@ -1,3 +1,7 @@ +/** + * v4保留兼容，已废弃，即将删除文件 + * @deprecated + */ export default { vxe: { base: { diff --git a/packages/locale/lang/zh-TC.ts b/packages/locale/lang/zh-TC.ts index 27e5da24d6..fd1c78ebcc 100644 --- a/packages/locale/lang/zh-TC.ts +++ b/packages/locale/lang/zh-TC.ts @@ -1,3 +1,7 @@ +/** + * v4保留兼容，已废弃，即将删除文件 + * @deprecated + */ export default { vxe: { base: { diff --git a/packages/menu/index.d.ts b/packages/menu/index.d.ts deleted file mode 100644 index 67d7738f8c..0000000000 --- a/packages/menu/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTableMenuModule } from '../../types/module/menu' - -export * from '../../types/module/menu' -export default VxeTableMenuModule diff --git a/packages/menu/index.ts b/packages/menu/index.ts deleted file mode 100644 index 3270936473..0000000000 --- a/packages/menu/index.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { App } from 'vue' -import { VXETable } from '../v-x-e-table' -import PanelComponent from './src/panel' -import menuHook from './src/hooks' -import { dynamicApp } from '../dynamics' - -export const VxeTableMenuModule = { - Panel: PanelComponent, - install (app: App) { - VXETable.hooks.add('$tableMenu', menuHook) - app.component(PanelComponent.name, PanelComponent) - } -} - -export const Menu = VxeTableMenuModule - -dynamicApp.component(PanelComponent.name, PanelComponent) - -export default VxeTableMenuModule diff --git a/packages/menu/src/panel.ts b/packages/menu/src/panel.ts deleted file mode 100644 index 2a2031505e..0000000000 --- a/packages/menu/src/panel.ts +++ /dev/null @@ -1,125 +0,0 @@ -import { defineComponent, h, Teleport, inject, ref, Ref, createCommentVNode } from 'vue' -import { getFuncText } from '../../tools/utils' -import XEUtils from 'xe-utils' - -import { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeTableMenuPanelConstructor, VxeTableMenuPanelPrivateRef } from '../../../types/all' - -export default defineComponent({ - name: 'VxeTableMenuPanel', - setup (props, context) { - const xID = XEUtils.uniqueId() - - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) - - const { reactData: tableReactData } = $xetable - - const refElem = ref() as Ref - - const refMaps: VxeTableMenuPanelPrivateRef = { - refElem - } - - const $xemenupanel = { - xID, - props, - context, - getRefMaps: () => refMaps - } as VxeTableMenuPanelConstructor - - const renderVN = () => { - const { ctxMenuStore } = tableReactData - const { computeMenuOpts } = $xetable.getComputeMaps() - const menuOpts = computeMenuOpts.value - - return h(Teleport, { - to: 'body', - disabled: false - }, [ - h('div', { - ref: refElem, - class: ['vxe-table--context-menu-wrapper', menuOpts.className, { - 'is--visible': ctxMenuStore.visible - }], - style: ctxMenuStore.style - }, ctxMenuStore.list.map((options, gIndex) => { - return options.every(item => item.visible === false) ? createCommentVNode() : h('ul', { - class: 'vxe-context-menu--option-wrapper', - key: gIndex - }, options.map((item, index) => { - const hasChildMenus = item.children && item.children.some((child: any) => child.visible !== false) - return item.visible === false ? null : h('li', { - class: [item.className, { - 'link--disabled': item.disabled, - 'link--active': item === ctxMenuStore.selected - }], - key: `${gIndex}_${index}` - }, [ - h('a', { - class: 'vxe-context-menu--link', - onClick (evnt: Event) { - $xetable.ctxMenuLinkEvent(evnt, item) - }, - onMouseover (evnt: Event) { - $xetable.ctxMenuMouseoverEvent(evnt, item) - }, - onMouseout (evnt: Event) { - $xetable.ctxMenuMouseoutEvent(evnt, item) - } - }, [ - h('i', { - class: ['vxe-context-menu--link-prefix', item.prefixIcon] - }), - h('span', { - class: 'vxe-context-menu--link-content' - }, getFuncText(item.name)), - h('i', { - class: ['vxe-context-menu--link-suffix', hasChildMenus ? item.suffixIcon || 'suffix--haschild' : item.suffixIcon] - }) - ]), - hasChildMenus ? h('ul', { - class: ['vxe-table--context-menu-clild-wrapper', { - 'is--show': item === ctxMenuStore.selected && ctxMenuStore.showChild - }] - }, item.children.map((child: any, cIndex: any) => { - return child.visible === false ? null : h('li', { - class: [child.className, { - 'link--disabled': child.disabled, - 'link--active': child === ctxMenuStore.selectChild - }], - key: `${gIndex}_${index}_${cIndex}` - }, [ - h('a', { - class: 'vxe-context-menu--link', - onClick (evnt: Event) { - $xetable.ctxMenuLinkEvent(evnt, child) - }, - onMouseover (evnt: Event) { - $xetable.ctxMenuMouseoverEvent(evnt, item, child) - }, - onMouseout (evnt: Event) { - $xetable.ctxMenuMouseoutEvent(evnt, item) - } - }, [ - h('i', { - class: ['vxe-context-menu--link-prefix', child.prefixIcon] - }), - h('span', { - class: 'vxe-context-menu--link-content' - }, getFuncText(child.name)) - ]) - ]) - })) : null - ]) - })) - })) - ]) - } - - $xemenupanel.renderVN = renderVN - - return $xemenupanel - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/modal/index.d.ts b/packages/modal/index.d.ts deleted file mode 100644 index 2f2f55da61..0000000000 --- a/packages/modal/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeModal } from '../../types/modal' - -export * from '../../types/modal' -export default VxeModal diff --git a/packages/modal/index.ts b/packages/modal/index.ts deleted file mode 100644 index 2e25bee0f4..0000000000 --- a/packages/modal/index.ts +++ /dev/null @@ -1,110 +0,0 @@ -import { App } from 'vue' -import XEUtils from 'xe-utils' -import VxeModalComponent, { allActiveModals } from './src/modal' -import { VXETable } from '../v-x-e-table' -import { dynamicApp, dynamicStore, checkDynamic } from '../dynamics' - -import { VxeModalPropTypes, ModalEventTypes, VxeModalDefines } from '../../types/all' - -function openModal (options: VxeModalDefines.ModalOptions): Promise { - // 使用动态组件渲染动态弹框 - checkDynamic() - return new Promise(resolve => { - if (options && options.id && allActiveModals.some(comp => comp.props.id === options.id)) { - resolve('exist') - } else { - const _onHide = options.onHide - const modalOpts = Object.assign(options, { - key: XEUtils.uniqueId(), - modelValue: true, - onHide (params) { - const modalList = dynamicStore.modals - if (_onHide) { - _onHide(params) - } - dynamicStore.modals = modalList.filter(item => item.key !== modalOpts.key) - resolve(params.type) - } - } as VxeModalDefines.ModalOptions) - dynamicStore.modals.push(modalOpts) - } - }) -} - -function getModal (id: VxeModalPropTypes.ID) { - return XEUtils.find(allActiveModals, $modal => $modal.props.id === id) -} - -/** - * 全局关闭动态的活动窗口（只能用于关闭动态的创建的活动窗口） - * 如果传 id 则关闭指定的窗口 - * 如果不传则关闭所有窗口 - */ -function closeModal (id?: VxeModalPropTypes.ID) { - const modals = id ? [getModal(id)] : allActiveModals - const restPromises: any[] = [] - modals.forEach($modal => { - if ($modal) { - restPromises.push($modal.close()) - } - }) - return Promise.all(restPromises) -} - -function handleOpen (defOpts: VxeModalDefines.ModalOptions, content: VxeModalPropTypes.Content | VxeModalDefines.ModalOptions, title?: VxeModalPropTypes.Title, options?: VxeModalDefines.ModalOptions) { - let opts - if (XEUtils.isObject(content)) { - opts = content - } else { - opts = { content: XEUtils.toValueString(content), title } - } - return openModal({ ...defOpts, ...options, ...opts }) -} - -function openAlert (content: VxeModalPropTypes.Content | VxeModalDefines.ModalOptions, title?: VxeModalPropTypes.Title, options?: VxeModalDefines.ModalOptions) { - return handleOpen({ - type: 'alert', - showFooter: true - }, content, title, options) -} - -function openConfirm (content: VxeModalPropTypes.Content | VxeModalDefines.ModalOptions, title?: VxeModalPropTypes.Title, options?: VxeModalDefines.ModalOptions) { - return handleOpen({ - type: 'confirm', - status: 'question', - showFooter: true - }, content, title, options) -} - -function openMessage (content: VxeModalPropTypes.Content | VxeModalDefines.ModalOptions, options?: VxeModalDefines.ModalOptions) { - return handleOpen({ - type: 'message', - mask: false, - lockView: false, - showHeader: false - }, content, '', options) -} - -const ModalController = { - get: getModal, - close: closeModal, - open: openModal, - alert: openAlert, - confirm: openConfirm, - message: openMessage -} - -export const modal = ModalController - -export const VxeModal = Object.assign(VxeModalComponent, { - install: function (app: App) { - app.component(VxeModalComponent.name as string, VxeModalComponent) - VXETable.modal = ModalController - } -}) - -export const Modal = VxeModal - -dynamicApp.component(VxeModalComponent.name as string, VxeModalComponent) - -export default VxeModal diff --git a/packages/modal/src/modal.ts b/packages/modal/src/modal.ts deleted file mode 100644 index f20a4880ce..0000000000 --- a/packages/modal/src/modal.ts +++ /dev/null @@ -1,955 +0,0 @@ -import { defineComponent, h, Teleport, ref, Ref, computed, reactive, nextTick, watch, PropType, VNode, onMounted, onUnmounted } from 'vue' -import XEUtils from 'xe-utils' -import { useSize } from '../../hooks/size' -import { getDomNode, getEventTargetNode } from '../../tools/dom' -import { getLastZIndex, nextZIndex, getFuncText } from '../../tools/utils' -import { errLog } from '../../tools/log' -import { GlobalEvent, hasEventKey, EVENT_KEYS } from '../../tools/event' -import GlobalConfig from '../../v-x-e-table/src/conf' -import VxeButtonComponent from '../../button/src/button' -import VxeLoadingComponent from '../../loading/index' -import { getSlotVNs } from '../../tools/vn' - -import { VxeModalConstructor, VxeModalPropTypes, ModalReactData, VxeModalEmits, ModalEventTypes, VxeButtonInstance, ModalMethods, ModalPrivateRef, VxeModalMethods } from '../../../types/all' - -export const allActiveModals: VxeModalConstructor[] = [] -export const msgQueue: VxeModalConstructor[] = [] - -export default defineComponent({ - name: 'VxeModal', - props: { - modelValue: Boolean as PropType, - id: String as PropType, - type: { type: String as PropType, default: 'modal' }, - loading: { type: Boolean as PropType, default: null }, - status: String as PropType, - iconStatus: String as PropType, - className: String as PropType, - top: { type: [Number, String] as PropType, default: () => GlobalConfig.modal.top }, - position: [String, Object] as PropType, - title: String as PropType, - duration: { type: [Number, String] as PropType, default: () => GlobalConfig.modal.duration }, - message: [Number, String] as PropType, - content: [Number, String] as PropType, - showCancelButton: { type: Boolean as PropType, default: null }, - cancelButtonText: { type: String as PropType, default: () => GlobalConfig.modal.cancelButtonText }, - showConfirmButton: { type: Boolean as PropType, default: () => GlobalConfig.modal.showConfirmButton }, - confirmButtonText: { type: String as PropType, default: () => GlobalConfig.modal.confirmButtonText }, - lockView: { type: Boolean as PropType, default: () => GlobalConfig.modal.lockView }, - lockScroll: Boolean as PropType, - mask: { type: Boolean as PropType, default: () => GlobalConfig.modal.mask }, - maskClosable: { type: Boolean as PropType, default: () => GlobalConfig.modal.maskClosable }, - escClosable: { type: Boolean as PropType, default: () => GlobalConfig.modal.escClosable }, - resize: Boolean as PropType, - showHeader: { type: Boolean as PropType, default: () => GlobalConfig.modal.showHeader }, - showFooter: { type: Boolean as PropType, default: () => GlobalConfig.modal.showFooter }, - showZoom: Boolean as PropType, - showClose: { type: Boolean as PropType, default: () => GlobalConfig.modal.showClose }, - dblclickZoom: { type: Boolean as PropType, default: () => GlobalConfig.modal.dblclickZoom }, - width: [Number, String] as PropType, - height: [Number, String] as PropType, - minWidth: { type: [Number, String] as PropType, default: () => GlobalConfig.modal.minWidth }, - minHeight: { type: [Number, String] as PropType, default: () => GlobalConfig.modal.minHeight }, - zIndex: Number as PropType, - marginSize: { type: [Number, String] as PropType, default: () => GlobalConfig.modal.marginSize }, - fullscreen: Boolean as PropType, - draggable: { type: Boolean as PropType, default: () => GlobalConfig.modal.draggable }, - remember: { type: Boolean, default: () => GlobalConfig.modal.remember }, - destroyOnClose: { type: Boolean as PropType, default: () => GlobalConfig.modal.destroyOnClose }, - showTitleOverflow: { type: Boolean as PropType, default: () => GlobalConfig.modal.showTitleOverflow }, - transfer: { type: Boolean as PropType, default: () => GlobalConfig.modal.transfer }, - storage: { type: Boolean as PropType, default: () => GlobalConfig.modal.storage }, - storageKey: { type: String as PropType, default: () => GlobalConfig.modal.storageKey }, - animat: { type: Boolean as PropType, default: () => GlobalConfig.modal.animat }, - size: { type: String as PropType, default: () => GlobalConfig.modal.size || GlobalConfig.size }, - beforeHideMethod: { type: Function as PropType, default: () => GlobalConfig.modal.beforeHideMethod }, - slots: Object as PropType - }, - emits: [ - 'update:modelValue', - 'show', - 'hide', - 'before-hide', - 'close', - 'confirm', - 'cancel', - 'zoom', - 'resize', - 'move' - ] as VxeModalEmits, - setup (props, context) { - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - inited: false, - visible: false, - contentVisible: false, - modalTop: 0, - modalZindex: 0, - zoomLocat: null, - firstOpen: true - }) - - const refElem = ref() as Ref - const refModalBox = ref() as Ref - const refConfirmBtn = ref() - const refCancelBtn = ref() - - const refMaps: ModalPrivateRef = { - refElem - } - - const $xemodal = { - xID, - props, - context, - reactData, - getRefMaps: () => refMaps - } as unknown as VxeModalConstructor & VxeModalMethods - - let modalMethods = {} as ModalMethods - - const computeIsMsg = computed(() => { - return props.type === 'message' - }) - - const getBox = () => { - const boxElem = refModalBox.value - return boxElem - } - - const recalculate = () => { - const { width, height } = props - const boxElem = getBox() - boxElem.style.width = `${width ? (isNaN(width as number) ? width : `${width}px`) : ''}` - boxElem.style.height = `${height ? (isNaN(height as number) ? height : `${height}px`) : ''}` - return nextTick() - } - - const updateZindex = () => { - const { zIndex } = props - const { modalZindex } = reactData - if (zIndex) { - reactData.modalZindex = zIndex - } else if (modalZindex < getLastZIndex()) { - reactData.modalZindex = nextZIndex() - } - } - - const updatePosition = () => { - return nextTick().then(() => { - const { position } = props - const marginSize = XEUtils.toNumber(props.marginSize) - const boxElem = getBox() - const clientVisibleWidth = document.documentElement.clientWidth || document.body.clientWidth - const clientVisibleHeight = document.documentElement.clientHeight || document.body.clientHeight - const isPosCenter = position === 'center' - const { top, left }: any = XEUtils.isString(position) ? { top: position, left: position } : Object.assign({}, position) - const topCenter = isPosCenter || top === 'center' - const leftCenter = isPosCenter || left === 'center' - let posTop = '' - let posLeft = '' - if (left && !leftCenter) { - posLeft = isNaN(left) ? left : `${left}px` - } else { - posLeft = `${Math.max(marginSize, clientVisibleWidth / 2 - boxElem.offsetWidth / 2)}px` - } - if (top && !topCenter) { - posTop = isNaN(top) ? top : `${top}px` - } else { - posTop = `${Math.max(marginSize, clientVisibleHeight / 2 - boxElem.offsetHeight / 2)}px` - } - boxElem.style.top = posTop - boxElem.style.left = posLeft - }) - } - - const updateStyle = () => { - nextTick(() => { - let offsetTop = 0 - msgQueue.forEach(comp => { - const boxElem = comp.getBox() - offsetTop += XEUtils.toNumber(comp.props.top) - comp.reactData.modalTop = offsetTop - offsetTop += boxElem.clientHeight - }) - }) - } - - const removeMsgQueue = () => { - if (msgQueue.indexOf($xemodal) > -1) { - XEUtils.remove(msgQueue, comp => comp === $xemodal) - } - updateStyle() - } - - const closeModal = (type: ModalEventTypes) => { - const { remember, beforeHideMethod } = props - const { visible } = reactData - const isMsg = computeIsMsg.value - const params = { type } - if (visible) { - Promise.resolve(beforeHideMethod ? beforeHideMethod(params) : null).then((rest) => { - if (!XEUtils.isError(rest)) { - if (isMsg) { - removeMsgQueue() - } - reactData.contentVisible = false - if (!remember) { - reactData.zoomLocat = null - } - XEUtils.remove(allActiveModals, item => item === $xemodal) - modalMethods.dispatchEvent('before-hide', params) - setTimeout(() => { - reactData.visible = false - emit('update:modelValue', false) - modalMethods.dispatchEvent('hide', params) - }, 200) - } - }).catch(e => e) - } - return nextTick() - } - - const closeEvent = (evnt: Event) => { - const type = 'close' - modalMethods.dispatchEvent(type, { type }, evnt) - closeModal(type) - } - - const confirmEvent = (evnt: Event) => { - const type = 'confirm' - modalMethods.dispatchEvent(type, { type }, evnt) - closeModal(type) - } - - const cancelEvent = (evnt: Event) => { - const type = 'cancel' - modalMethods.dispatchEvent(type, { type }, evnt) - closeModal(type) - } - - const getStorageMap = (key: string) => { - const version = GlobalConfig.version - const rest = XEUtils.toStringJSON(localStorage.getItem(key) || '') - return rest && rest._v === version ? rest : { _v: version } - } - - const hasPosStorage = () => { - const { id, remember, storage, storageKey } = props - return !!(id && remember && storage && getStorageMap(storageKey)[id]) - } - - const restorePosStorage = () => { - const { id, remember, storage, storageKey } = props - if (id && remember && storage) { - const posStorage = getStorageMap(storageKey)[id] - if (posStorage) { - const boxElem = getBox() - const [left, top, width, height, zoomLeft, zoomTop, zoomWidth, zoomHeight] = posStorage.split(',') - if (left) { - boxElem.style.left = `${left}px` - } - if (top) { - boxElem.style.top = `${top}px` - } - if (width) { - boxElem.style.width = `${width}px` - } - if (height) { - boxElem.style.height = `${height}px` - } - if (zoomLeft && zoomTop) { - reactData.zoomLocat = { - left: zoomLeft, - top: zoomTop, - width: zoomWidth, - height: zoomHeight - } - } - } - } - } - - const addMsgQueue = () => { - if (msgQueue.indexOf($xemodal) === -1) { - msgQueue.push($xemodal) - } - updateStyle() - } - - const savePosStorage = () => { - const { id, remember, storage, storageKey } = props - const { zoomLocat } = reactData - if (id && remember && storage) { - const boxElem = getBox() - const posStorageMap = getStorageMap(storageKey) - posStorageMap[id] = ([ - boxElem.style.left, - boxElem.style.top, - boxElem.style.width, - boxElem.style.height - ] as (string | number)[]).concat(zoomLocat ? [ - zoomLocat.left, - zoomLocat.top, - zoomLocat.width, - zoomLocat.height - ] : []).map(val => val ? XEUtils.toNumber(val) : '').join(',') - localStorage.setItem(storageKey, XEUtils.toJSONString(posStorageMap)) - } - } - - const maximize = () => { - return nextTick().then(() => { - if (!reactData.zoomLocat) { - const marginSize = Math.max(0, XEUtils.toNumber(props.marginSize)) - const boxElem = getBox() - const { visibleHeight, visibleWidth } = getDomNode() - reactData.zoomLocat = { - top: boxElem.offsetTop, - left: boxElem.offsetLeft, - width: boxElem.offsetWidth + (boxElem.style.width ? 0 : 1), - height: boxElem.offsetHeight + (boxElem.style.height ? 0 : 1) - } - Object.assign(boxElem.style, { - top: `${marginSize}px`, - left: `${marginSize}px`, - width: `${visibleWidth - marginSize * 2}px`, - height: `${visibleHeight - marginSize * 2}px` - }) - savePosStorage() - } - }) - } - - const openModal = () => { - const { duration, remember, showFooter } = props - const { inited, visible } = reactData - const isMsg = computeIsMsg.value - if (!inited) { - reactData.inited = true - } - if (!visible) { - if (!remember) { - recalculate() - } - reactData.visible = true - reactData.contentVisible = false - updateZindex() - allActiveModals.push($xemodal) - setTimeout(() => { - reactData.contentVisible = true - nextTick(() => { - if (showFooter) { - const confirmBtn = refConfirmBtn.value - const cancelBtn = refCancelBtn.value - const operBtn = confirmBtn || cancelBtn - if (operBtn) { - operBtn.focus() - } - } - const type = '' - const params = { type } - emit('update:modelValue', true) - modalMethods.dispatchEvent('show', params) - }) - }, 10) - if (isMsg) { - addMsgQueue() - if (duration !== -1) { - setTimeout(() => closeModal('close'), XEUtils.toNumber(duration)) - } - } else { - nextTick(() => { - const { fullscreen } = props - const { firstOpen } = reactData - if (!remember || firstOpen) { - updatePosition().then(() => { - setTimeout(() => updatePosition(), 20) - }) - } - if (firstOpen) { - reactData.firstOpen = false - if (hasPosStorage()) { - restorePosStorage() - } else if (fullscreen) { - nextTick(() => maximize()) - } - } else { - if (fullscreen) { - nextTick(() => maximize()) - } - } - }) - } - } - return nextTick() - } - - const selfClickEvent = (evnt: Event) => { - const el = refElem.value - if (props.maskClosable && evnt.target === el) { - const type = 'mask' - closeModal(type) - } - } - - const handleGlobalKeydownEvent = (evnt: KeyboardEvent) => { - const isEsc = hasEventKey(evnt, EVENT_KEYS.ESCAPE) - if (isEsc) { - const lastModal = XEUtils.max(allActiveModals, (item) => item.reactData.modalZindex) - // 多个时，只关掉最上层的窗口 - if (lastModal) { - setTimeout(() => { - if (lastModal === $xemodal && (lastModal as VxeModalConstructor).props.escClosable) { - closeModal('exit') - } - }, 10) - } - } - } - - const isMaximized = () => { - return !!reactData.zoomLocat - } - - const revert = () => { - return nextTick().then(() => { - const { zoomLocat } = reactData - if (zoomLocat) { - const boxElem = getBox() - reactData.zoomLocat = null - Object.assign(boxElem.style, { - top: `${zoomLocat.top}px`, - left: `${zoomLocat.left}px`, - width: `${zoomLocat.width}px`, - height: `${zoomLocat.height}px` - }) - savePosStorage() - } - }) - } - - const zoom = () => { - if (reactData.zoomLocat) { - return revert().then(() => isMaximized()) - } - return maximize().then(() => isMaximized()) - } - - const toggleZoomEvent = (evnt: Event) => { - const { zoomLocat } = reactData - const params = { type: zoomLocat ? 'revert' : 'max' } - return zoom().then(() => { - modalMethods.dispatchEvent('zoom', params, evnt) - }) - } - - const getPosition = () => { - const isMsg = computeIsMsg.value - if (!isMsg) { - const boxElem = getBox() - if (boxElem) { - return { - top: boxElem.offsetTop, - left: boxElem.offsetLeft - } - } - } - return null - } - - const setPosition = (top?: number, left?: number) => { - const isMsg = computeIsMsg.value - if (!isMsg) { - const boxElem = getBox() - if (XEUtils.isNumber(top)) { - boxElem.style.top = `${top}px` - } - if (XEUtils.isNumber(left)) { - boxElem.style.left = `${left}px` - } - } - return nextTick() - } - - const boxMousedownEvent = () => { - const { modalZindex } = reactData - if (allActiveModals.some(comp => comp.reactData.visible && comp.reactData.modalZindex > modalZindex)) { - updateZindex() - } - } - - const mousedownEvent = (evnt: MouseEvent) => { - const { remember, storage } = props - const { zoomLocat } = reactData - const marginSize = XEUtils.toNumber(props.marginSize) - const boxElem = getBox() - if (!zoomLocat && evnt.button === 0 && !getEventTargetNode(evnt, boxElem, 'trigger--btn').flag) { - evnt.preventDefault() - const domMousemove = document.onmousemove - const domMouseup = document.onmouseup - const disX = evnt.clientX - boxElem.offsetLeft - const disY = evnt.clientY - boxElem.offsetTop - const { visibleHeight, visibleWidth } = getDomNode() - document.onmousemove = evnt => { - evnt.preventDefault() - const offsetWidth = boxElem.offsetWidth - const offsetHeight = boxElem.offsetHeight - const minX = marginSize - const maxX = visibleWidth - offsetWidth - marginSize - 1 - const minY = marginSize - const maxY = visibleHeight - offsetHeight - marginSize - 1 - let left = evnt.clientX - disX - let top = evnt.clientY - disY - if (left > maxX) { - left = maxX - } - if (left < minX) { - left = minX - } - if (top > maxY) { - top = maxY - } - if (top < minY) { - top = minY - } - boxElem.style.left = `${left}px` - boxElem.style.top = `${top}px` - boxElem.className = boxElem.className.replace(/\s?is--drag/, '') + ' is--drag' - emit('move', { type: 'move', $event: evnt }) - } - document.onmouseup = () => { - document.onmousemove = domMousemove - document.onmouseup = domMouseup - if (remember && storage) { - nextTick(() => { - savePosStorage() - }) - } - setTimeout(() => { - boxElem.className = boxElem.className.replace(/\s?is--drag/, '') - }, 50) - } - } - } - - const dragEvent = (evnt: MouseEvent) => { - evnt.preventDefault() - const { remember, storage } = props - const { visibleHeight, visibleWidth } = getDomNode() - const marginSize = XEUtils.toNumber(props.marginSize) - const targetElem = evnt.target as HTMLSpanElement - const type = targetElem.getAttribute('type') - const minWidth = XEUtils.toNumber(props.minWidth) - const minHeight = XEUtils.toNumber(props.minHeight) - const maxWidth = visibleWidth - const maxHeight = visibleHeight - const boxElem = getBox() - const domMousemove = document.onmousemove - const domMouseup = document.onmouseup - const clientWidth = boxElem.clientWidth - const clientHeight = boxElem.clientHeight - const disX = evnt.clientX - const disY = evnt.clientY - const offsetTop = boxElem.offsetTop - const offsetLeft = boxElem.offsetLeft - const params = { type: 'resize' } - document.onmousemove = evnt => { - evnt.preventDefault() - let dragLeft - let dragTop - let width - let height - switch (type) { - case 'wl': - dragLeft = disX - evnt.clientX - width = dragLeft + clientWidth - if (offsetLeft - dragLeft > marginSize) { - if (width > minWidth) { - boxElem.style.width = `${width < maxWidth ? width : maxWidth}px` - boxElem.style.left = `${offsetLeft - dragLeft}px` - } - } - break - case 'swst': - dragLeft = disX - evnt.clientX - dragTop = disY - evnt.clientY - width = dragLeft + clientWidth - height = dragTop + clientHeight - if (offsetLeft - dragLeft > marginSize) { - if (width > minWidth) { - boxElem.style.width = `${width < maxWidth ? width : maxWidth}px` - boxElem.style.left = `${offsetLeft - dragLeft}px` - } - } - if (offsetTop - dragTop > marginSize) { - if (height > minHeight) { - boxElem.style.height = `${height < maxHeight ? height : maxHeight}px` - boxElem.style.top = `${offsetTop - dragTop}px` - } - } - break - case 'swlb': - dragLeft = disX - evnt.clientX - dragTop = evnt.clientY - disY - width = dragLeft + clientWidth - height = dragTop + clientHeight - if (offsetLeft - dragLeft > marginSize) { - if (width > minWidth) { - boxElem.style.width = `${width < maxWidth ? width : maxWidth}px` - boxElem.style.left = `${offsetLeft - dragLeft}px` - } - } - if (offsetTop + height + marginSize < visibleHeight) { - if (height > minHeight) { - boxElem.style.height = `${height < maxHeight ? height : maxHeight}px` - } - } - break - case 'st': - dragTop = disY - evnt.clientY - height = clientHeight + dragTop - if (offsetTop - dragTop > marginSize) { - if (height > minHeight) { - boxElem.style.height = `${height < maxHeight ? height : maxHeight}px` - boxElem.style.top = `${offsetTop - dragTop}px` - } - } - break - case 'wr': - dragLeft = evnt.clientX - disX - width = dragLeft + clientWidth - if (offsetLeft + width + marginSize < visibleWidth) { - if (width > minWidth) { - boxElem.style.width = `${width < maxWidth ? width : maxWidth}px` - } - } - break - case 'sest': - dragLeft = evnt.clientX - disX - dragTop = disY - evnt.clientY - width = dragLeft + clientWidth - height = dragTop + clientHeight - if (offsetLeft + width + marginSize < visibleWidth) { - if (width > minWidth) { - boxElem.style.width = `${width < maxWidth ? width : maxWidth}px` - } - } - if (offsetTop - dragTop > marginSize) { - if (height > minHeight) { - boxElem.style.height = `${height < maxHeight ? height : maxHeight}px` - boxElem.style.top = `${offsetTop - dragTop}px` - } - } - break - case 'selb': - dragLeft = evnt.clientX - disX - dragTop = evnt.clientY - disY - width = dragLeft + clientWidth - height = dragTop + clientHeight - if (offsetLeft + width + marginSize < visibleWidth) { - if (width > minWidth) { - boxElem.style.width = `${width < maxWidth ? width : maxWidth}px` - } - } - if (offsetTop + height + marginSize < visibleHeight) { - if (height > minHeight) { - boxElem.style.height = `${height < maxHeight ? height : maxHeight}px` - } - } - break - case 'sb': - dragTop = evnt.clientY - disY - height = dragTop + clientHeight - if (offsetTop + height + marginSize < visibleHeight) { - if (height > minHeight) { - boxElem.style.height = `${height < maxHeight ? height : maxHeight}px` - } - } - break - } - boxElem.className = boxElem.className.replace(/\s?is--drag/, '') + ' is--drag' - if (remember && storage) { - savePosStorage() - } - modalMethods.dispatchEvent('resize', params, evnt) - } - document.onmouseup = () => { - reactData.zoomLocat = null - document.onmousemove = domMousemove - document.onmouseup = domMouseup - setTimeout(() => { - boxElem.className = boxElem.className.replace(/\s?is--drag/, '') - }, 50) - } - } - - modalMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $modal: $xemodal, $event: evnt }, params)) - }, - open: openModal, - close () { - return closeModal('close') - }, - getBox, - getPosition, - setPosition, - isMaximized, - zoom, - maximize, - revert - } - - Object.assign($xemodal, modalMethods) - - const renderTitles = () => { - const { slots: propSlots = {}, showClose, showZoom, title } = props - const { zoomLocat } = reactData - const titleSlot = slots.title || propSlots.title - const cornerSlot = slots.corner || propSlots.corner - const titVNs = [ - h('div', { - class: 'vxe-modal--header-title' - }, titleSlot ? getSlotVNs(titleSlot({ $modal: $xemodal })) : (title ? getFuncText(title) : GlobalConfig.i18n('vxe.alert.title'))) - ] - const rightVNs = [] - if (cornerSlot) { - rightVNs.push( - h('span', { - class: 'vxe-modal--corner-wrapper' - }, getSlotVNs(cornerSlot({ $modal: $xemodal }))) - ) - } - if (showZoom) { - rightVNs.push( - h('i', { - class: ['vxe-modal--zoom-btn', 'trigger--btn', zoomLocat ? GlobalConfig.icon.MODAL_ZOOM_OUT : GlobalConfig.icon.MODAL_ZOOM_IN], - title: GlobalConfig.i18n(`vxe.modal.zoom${zoomLocat ? 'Out' : 'In'}`), - onClick: toggleZoomEvent - }) - ) - } - if (showClose) { - rightVNs.push( - h('i', { - class: ['vxe-modal--close-btn', 'trigger--btn', GlobalConfig.icon.MODAL_CLOSE], - title: GlobalConfig.i18n('vxe.modal.close'), - onClick: closeEvent - }) - ) - } - titVNs.push( - h('div', { - class: 'vxe-modal--header-right' - }, rightVNs) - ) - return titVNs - } - - const renderHeaders = () => { - const { slots: propSlots = {}, showZoom, draggable } = props - const isMsg = computeIsMsg.value - const headerSlot = slots.header || propSlots.header - const headVNs: VNode[] = [] - if (props.showHeader) { - const headerOns: { - onMousedown?: typeof mousedownEvent; - onDblclick?: typeof toggleZoomEvent; - } = {} - if (draggable) { - headerOns.onMousedown = mousedownEvent - } - if (showZoom && props.dblclickZoom && props.type === 'modal') { - headerOns.onDblclick = toggleZoomEvent - } - headVNs.push( - h('div', { - class: ['vxe-modal--header', { - 'is--draggable': draggable, - 'is--ellipsis': !isMsg && props.showTitleOverflow - }], - ...headerOns - }, headerSlot ? (!reactData.inited || (props.destroyOnClose && !reactData.visible) ? [] : getSlotVNs(headerSlot({ $modal: $xemodal }))) : renderTitles()) - ) - } - return headVNs - } - - const renderBodys = () => { - const { slots: propSlots = {}, status, message } = props - const content = props.content || message - const isMsg = computeIsMsg.value - const defaultSlot = slots.default || propSlots.default - const contVNs: VNode[] = [] - if (status) { - contVNs.push( - h('div', { - class: 'vxe-modal--status-wrapper' - }, [ - h('i', { - class: ['vxe-modal--status-icon', props.iconStatus || GlobalConfig.icon[`MODAL_${status}`.toLocaleUpperCase()]] - }) - ]) - ) - } - contVNs.push( - h('div', { - class: 'vxe-modal--content' - }, defaultSlot ? (!reactData.inited || (props.destroyOnClose && !reactData.visible) ? [] : getSlotVNs(defaultSlot({ $modal: $xemodal }))) as VNode[] : getFuncText(content)) - ) - if (!isMsg) { - /** - * 加载中 - */ - contVNs.push( - h(VxeLoadingComponent, { - class: 'vxe-modal--loading', - modelValue: props.loading - }) - ) - } - return [ - h('div', { - class: 'vxe-modal--body' - }, contVNs) - ] - } - - const renderBtns = () => { - const { showCancelButton, showConfirmButton, type } = props - const btnVNs = [] - if (XEUtils.isBoolean(showCancelButton) ? showCancelButton : type === 'confirm') { - btnVNs.push( - h(VxeButtonComponent, { - key: 1, - ref: refCancelBtn, - content: props.cancelButtonText || GlobalConfig.i18n('vxe.button.cancel'), - onClick: cancelEvent - }) - ) - } - if (XEUtils.isBoolean(showConfirmButton) ? showConfirmButton : (type === 'confirm' || type === 'alert')) { - btnVNs.push( - h(VxeButtonComponent, { - key: 2, - ref: refConfirmBtn, - status: 'primary', - content: props.confirmButtonText || GlobalConfig.i18n('vxe.button.confirm'), - onClick: confirmEvent - }) - ) - } - return btnVNs - } - - const renderFooters = () => { - const { slots: propSlots = {} } = props - const isMsg = computeIsMsg.value - const footerSlot = slots.footer || propSlots.footer - const footVNs: VNode[] = [] - if (props.showFooter) { - footVNs.push( - h('div', { - class: 'vxe-modal--footer' - }, footerSlot ? (!reactData.inited || (props.destroyOnClose && !reactData.visible) ? [] : getSlotVNs(footerSlot({ $modal: $xemodal }))) as VNode[] : renderBtns()) - ) - } - if (!isMsg && props.resize) { - footVNs.push( - h('span', { - class: 'vxe-modal--resize' - }, ['wl', 'wr', 'swst', 'sest', 'st', 'swlb', 'selb', 'sb'].map(type => { - return h('span', { - class: `${type}-resize`, - type: type, - onMousedown: dragEvent - }) - })) - ) - } - return footVNs - } - - const renderVN = () => { - const { className, type, animat, loading, status, lockScroll, lockView, mask, resize } = props - const { inited, zoomLocat, modalTop, contentVisible, visible } = reactData - const vSize = computeSize.value - return h(Teleport, { - to: 'body', - disabled: props.transfer ? !inited : true - }, [ - h('div', { - ref: refElem, - class: ['vxe-modal--wrapper', `type--${type}`, className || '', { - [`size--${vSize}`]: vSize, - [`status--${status}`]: status, - 'is--animat': animat, - 'lock--scroll': lockScroll, - 'lock--view': lockView, - 'is--resize': resize, - 'is--mask': mask, - 'is--maximize': zoomLocat, - 'is--visible': contentVisible, - 'is--active': visible, - 'is--loading': loading - }], - style: { - zIndex: reactData.modalZindex, - top: modalTop ? `${modalTop}px` : null - }, - onClick: selfClickEvent - }, [ - h('div', { - ref: refModalBox, - class: 'vxe-modal--box', - onMousedown: boxMousedownEvent - }, renderHeaders().concat(renderBodys(), renderFooters())) - ]) - ]) - } - - $xemodal.renderVN = renderVN - - watch(() => props.width, recalculate) - watch(() => props.height, recalculate) - - watch(() => props.modelValue, (value) => { - if (value) { - openModal() - } else { - closeModal('model') - } - }) - - onMounted(() => { - nextTick(() => { - if (props.storage && !props.id) { - errLog('vxe.error.reqProp', ['modal.id']) - } - if (props.modelValue) { - openModal() - } - recalculate() - }) - if (props.escClosable) { - GlobalEvent.on($xemodal, 'keydown', handleGlobalKeydownEvent) - } - }) - - onUnmounted(() => { - GlobalEvent.off($xemodal, 'keydown') - removeMsgQueue() - }) - - return $xemodal - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/optgroup/index.d.ts b/packages/optgroup/index.d.ts deleted file mode 100644 index c0ab819407..0000000000 --- a/packages/optgroup/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeOption } from '../../types/option' - -export * from '../../types/option' -export default VxeOption diff --git a/packages/optgroup/index.ts b/packages/optgroup/index.ts deleted file mode 100644 index 9c6af8cc8a..0000000000 --- a/packages/optgroup/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeOptgroupComponent from '../select/src/optgroup' -import { dynamicApp } from '../dynamics' - -export const VxeOptgroup = Object.assign(VxeOptgroupComponent, { - install: function (app: App) { - app.component(VxeOptgroupComponent.name, VxeOptgroupComponent) - } -}) - -export const Optgroup = VxeOptgroup - -dynamicApp.component(VxeOptgroupComponent.name, VxeOptgroupComponent) - -export default VxeOptgroup diff --git a/packages/option/index.d.ts b/packages/option/index.d.ts deleted file mode 100644 index a659a5a2e2..0000000000 --- a/packages/option/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeSelect } from '../../types/select' - -export * from '../../types/select' -export default VxeSelect diff --git a/packages/option/index.ts b/packages/option/index.ts deleted file mode 100644 index 2b5af866af..0000000000 --- a/packages/option/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeOptionComponent from '../select/src/option' -import { dynamicApp } from '../dynamics' - -export const VxeOption = Object.assign(VxeOptionComponent, { - install: function (app: App) { - app.component(VxeOptionComponent.name, VxeOptionComponent) - } -}) - -export const Option = VxeOption - -dynamicApp.component(VxeOptionComponent.name, VxeOptionComponent) - -export default VxeOption diff --git a/packages/pager/index.d.ts b/packages/pager/index.d.ts deleted file mode 100644 index a5a4a8edd6..0000000000 --- a/packages/pager/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxePager } from '../../types/pager' - -export * from '../../types/pager' -export default VxePager diff --git a/packages/pager/index.ts b/packages/pager/index.ts deleted file mode 100644 index e29d5147f6..0000000000 --- a/packages/pager/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxePagerComponent from './src/pager' -import { dynamicApp } from '../dynamics' - -export const VxePager = Object.assign(VxePagerComponent, { - install: function (app: App) { - app.component(VxePagerComponent.name, VxePagerComponent) - } -}) - -export const Pager = VxePager - -dynamicApp.component(VxePagerComponent.name, VxePagerComponent) - -export default VxePager diff --git a/packages/pager/src/pager.ts b/packages/pager/src/pager.ts deleted file mode 100644 index e11cd72f83..0000000000 --- a/packages/pager/src/pager.ts +++ /dev/null @@ -1,585 +0,0 @@ -import { defineComponent, h, PropType, computed, inject, ref, Ref, reactive, nextTick, watch } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import VxeSelectComponent from '../../select' -import { hasEventKey, EVENT_KEYS } from '../../tools/event' -import { useSize } from '../../hooks/size' -import { errLog } from '../../tools/log' - -import { VxePagerPropTypes, VxePagerConstructor, VxePagerEmits, VxeSelectEvents, PagerPrivateRef, VxeGridConstructor, PagerMethods, PagerPrivateMethods, VxePagerPrivateMethods, PagerReactData } from '../../../types/all' - -export default defineComponent({ - name: 'VxePager', - props: { - size: { type: String as PropType, default: () => GlobalConfig.pager.size || GlobalConfig.size }, - // 自定义布局 - layouts: { type: Array as PropType, default: () => GlobalConfig.pager.layouts || ['PrevJump', 'PrevPage', 'Jump', 'PageCount', 'NextPage', 'NextJump', 'Sizes', 'Total'] }, - // 当前页 - currentPage: { type: Number as PropType, default: 1 }, - // 加载中 - loading: Boolean as PropType, - // 每页大小 - pageSize: { type: Number as PropType, default: () => GlobalConfig.pager.pageSize || 10 }, - // 总条数 - total: { type: Number as PropType, default: 0 }, - // 显示页码按钮的数量 - pagerCount: { type: Number as PropType, default: () => GlobalConfig.pager.pagerCount || 7 }, - // 每页大小选项列表 - pageSizes: { type: Array as PropType, default: () => GlobalConfig.pager.pageSizes || [10, 15, 20, 50, 100] }, - // 列对其方式 - align: { type: String as PropType, default: () => GlobalConfig.pager.align }, - // 带边框 - border: { type: Boolean as PropType, default: () => GlobalConfig.pager.border }, - // 带背景颜色 - background: { type: Boolean as PropType, default: () => GlobalConfig.pager.background }, - // 配套的样式 - perfect: { type: Boolean as PropType, default: () => GlobalConfig.pager.perfect }, - // 当只有一页时隐藏 - autoHidden: { type: Boolean as PropType, default: () => GlobalConfig.pager.autoHidden }, - transfer: { type: Boolean as PropType, default: () => GlobalConfig.pager.transfer }, - className: [String, Function] as PropType, - // 自定义图标 - iconPrevPage: String as PropType, - iconJumpPrev: String as PropType, - iconJumpNext: String as PropType, - iconNextPage: String as PropType, - iconJumpMore: String as PropType, - iconHomePage: String as PropType, - iconEndPage: String as PropType - }, - emits: [ - 'update:pageSize', - 'update:currentPage', - 'page-change' - ] as VxePagerEmits, - setup (props, context) { - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const $xegrid = inject('$xegrid', null as VxeGridConstructor | null) - - const reactData = reactive({ - inpCurrPage: props.currentPage - }) - - const refElem = ref() as Ref - - const refMaps: PagerPrivateRef = { - refElem - } - - const $xepager = { - xID, - props, - context, - getRefMaps: () => refMaps - } as unknown as VxePagerConstructor & VxePagerPrivateMethods - - let pagerMethods = {} as PagerMethods - let pagerPrivateMethods = {} as PagerPrivateMethods - - const getPageCount = (total: number, size: number) => { - return Math.max(Math.ceil(total / size), 1) - } - - const computePageCount = computed(() => { - return getPageCount(props.total, props.pageSize) - }) - - const jumpPageEvent = (evnt: Event, currentPage: number) => { - emit('update:currentPage', currentPage) - if (evnt && currentPage !== props.currentPage) { - pagerMethods.dispatchEvent('page-change', { type: 'current', pageSize: props.pageSize, currentPage }, evnt) - } - } - - const changeCurrentPage = (currentPage: number, evnt?: Event) => { - emit('update:currentPage', currentPage) - if (evnt && currentPage !== props.currentPage) { - pagerMethods.dispatchEvent('page-change', { type: 'current', pageSize: props.pageSize, currentPage }, evnt) - } - } - - const triggerJumpEvent = (evnt: Event) => { - const inputElem: HTMLInputElement = evnt.target as HTMLInputElement - const inpValue = XEUtils.toInteger(inputElem.value) - const pageCount = computePageCount.value - const current = inpValue <= 0 ? 1 : inpValue >= pageCount ? pageCount : inpValue - const currPage = XEUtils.toValueString(current) - inputElem.value = currPage - reactData.inpCurrPage = currPage - changeCurrentPage(current, evnt) - } - - const computeNumList = computed(() => { - const { pagerCount } = props - const pageCount = computePageCount.value - const len = pageCount > pagerCount ? pagerCount - 2 : pagerCount - const rest = [] - for (let index = 0; index < len; index++) { - rest.push(index) - } - return rest - }) - - const computeOffsetNumber = computed(() => { - return Math.floor((props.pagerCount - 2) / 2) - }) - - const computeSizeList = computed(() => { - return props.pageSizes.map((item) => { - if (XEUtils.isNumber(item)) { - return { - value: item, - label: `${GlobalConfig.i18n('vxe.pager.pagesize', [item])}` - } - } - return { value: '', label: '', ...item } - }) - }) - - const handleHomePage = (evnt?: Event) => { - const { currentPage } = props - if (currentPage > 1) { - changeCurrentPage(1, evnt) - } - } - - const handleEndPage = (evnt?: Event) => { - const { currentPage } = props - const pageCount = computePageCount.value - if (currentPage < pageCount) { - changeCurrentPage(pageCount, evnt) - } - } - - const handlePrevPage = (evnt?: Event) => { - const { currentPage } = props - const pageCount = computePageCount.value - if (currentPage > 1) { - changeCurrentPage(Math.min(pageCount, Math.max(currentPage - 1, 1)), evnt) - } - } - - const handleNextPage = (evnt?: Event) => { - const { currentPage } = props - const pageCount = computePageCount.value - if (currentPage < pageCount) { - changeCurrentPage(Math.min(pageCount, currentPage + 1), evnt) - } - } - - const handlePrevJump = (evnt?: Event) => { - const numList = computeNumList.value - changeCurrentPage(Math.max(props.currentPage - numList.length, 1), evnt) - } - - const handleNextJump = (evnt?: Event) => { - const pageCount = computePageCount.value - const numList = computeNumList.value - changeCurrentPage(Math.min(props.currentPage + numList.length, pageCount), evnt) - } - - const pageSizeEvent: VxeSelectEvents.Change = (params) => { - const { value } = params - const pageSize = XEUtils.toNumber(value) - const pageCount = getPageCount(props.total, pageSize) - let currentPage = props.currentPage - if (currentPage > pageCount) { - currentPage = pageCount - emit('update:currentPage', pageCount) - } - emit('update:pageSize', pageSize) - pagerMethods.dispatchEvent('page-change', { type: 'size', pageSize, currentPage }) - } - - const jumpInputEvent = (evnt: KeyboardEvent) => { - const inputElem: HTMLInputElement = evnt.target as HTMLInputElement - reactData.inpCurrPage = inputElem.value - } - - const jumpKeydownEvent = (evnt: KeyboardEvent) => { - if (hasEventKey(evnt, EVENT_KEYS.ENTER)) { - triggerJumpEvent(evnt) - } else if (hasEventKey(evnt, EVENT_KEYS.ARROW_UP)) { - evnt.preventDefault() - handleNextPage(evnt) - } else if (hasEventKey(evnt, EVENT_KEYS.ARROW_DOWN)) { - evnt.preventDefault() - handlePrevPage(evnt) - } - } - - // 第一页 - const renderHomePage = () => { - return h('button', { - class: ['vxe-pager--prev-btn', { - 'is--disabled': props.currentPage <= 1 - }], - type: 'button', - title: GlobalConfig.i18n('vxe.pager.homePageTitle'), - onClick: handleHomePage - }, [ - h('i', { - class: ['vxe-pager--btn-icon', props.iconHomePage || GlobalConfig.icon.PAGER_HOME] - }) - ]) - } - - // 上一页 - const renderPrevPage = () => { - return h('button', { - class: ['vxe-pager--prev-btn', { - 'is--disabled': props.currentPage <= 1 - }], - type: 'button', - title: GlobalConfig.i18n('vxe.pager.prevPageTitle'), - onClick: handlePrevPage - }, [ - h('i', { - class: ['vxe-pager--btn-icon', props.iconPrevPage || GlobalConfig.icon.PAGER_PREV_PAGE] - }) - ]) - } - - // 向上翻页 - const renderPrevJump = (tagName?: string) => { - return h(tagName || 'button', { - class: ['vxe-pager--jump-prev', { - 'is--fixed': !tagName, - 'is--disabled': props.currentPage <= 1 - }], - type: 'button', - title: GlobalConfig.i18n('vxe.pager.prevJumpTitle'), - onClick: handlePrevJump - }, [ - tagName ? h('i', { - class: ['vxe-pager--jump-more-icon', props.iconJumpMore || GlobalConfig.icon.PAGER_JUMP_MORE] - }) : null, - h('i', { - class: ['vxe-pager--jump-icon', props.iconJumpPrev || GlobalConfig.icon.PAGER_JUMP_PREV] - }) - ]) - } - - // 向下翻页 - const renderNextJump = (tagName?: string) => { - const pageCount = computePageCount.value - return h(tagName || 'button', { - class: ['vxe-pager--jump-next', { - 'is--fixed': !tagName, - 'is--disabled': props.currentPage >= pageCount - }], - type: 'button', - title: GlobalConfig.i18n('vxe.pager.nextJumpTitle'), - onClick: handleNextJump - }, [ - tagName ? h('i', { - class: ['vxe-pager--jump-more-icon', props.iconJumpMore || GlobalConfig.icon.PAGER_JUMP_MORE] - }) : null, - h('i', { - class: ['vxe-pager--jump-icon', props.iconJumpNext || GlobalConfig.icon.PAGER_JUMP_NEXT] - }) - ]) - } - - // 下一页 - const renderNextPage = () => { - const pageCount = computePageCount.value - return h('button', { - class: ['vxe-pager--next-btn', { - 'is--disabled': props.currentPage >= pageCount - }], - type: 'button', - title: GlobalConfig.i18n('vxe.pager.nextPageTitle'), - onClick: handleNextPage - }, [ - h('i', { - class: ['vxe-pager--btn-icon', props.iconNextPage || GlobalConfig.icon.PAGER_NEXT_PAGE] - }) - ]) - } - - // 最后一页 - const renderEndPage = () => { - const pageCount = computePageCount.value - return h('button', { - class: ['vxe-pager--prev-btn', { - 'is--disabled': props.currentPage >= pageCount - }], - type: 'button', - title: GlobalConfig.i18n('vxe.pager.endPageTitle'), - onClick: handleEndPage - }, [ - h('i', { - class: ['vxe-pager--btn-icon', props.iconEndPage || GlobalConfig.icon.PAGER_END] - }) - ]) - } - - // 页数 - const renderNumber = (showJump?: boolean) => { - const { currentPage, pagerCount } = props - const nums = [] - const pageCount = computePageCount.value - const numList = computeNumList.value - const offsetNumber = computeOffsetNumber.value - const isOv = pageCount > pagerCount - const isLt = isOv && currentPage > offsetNumber + 1 - const isGt = isOv && currentPage < pageCount - offsetNumber - let startNumber = 1 - if (isOv) { - if (currentPage >= pageCount - offsetNumber) { - startNumber = Math.max(pageCount - numList.length + 1, 1) - } else { - startNumber = Math.max(currentPage - offsetNumber, 1) - } - } - if (showJump && isLt) { - nums.push( - h('button', { - class: 'vxe-pager--num-btn', - type: 'button', - onClick: (evnt: Event) => jumpPageEvent(evnt, 1) - }, 1), - renderPrevJump('span') - ) - } - numList.forEach((item, index) => { - const number = startNumber + index - if (number <= pageCount) { - nums.push( - h('button', { - key: number, - class: ['vxe-pager--num-btn', { - 'is--active': currentPage === number - }], - type: 'button', - onClick: (evnt: Event) => jumpPageEvent(evnt, number) - }, number) - ) - } - }) - if (showJump && isGt) { - nums.push( - renderNextJump('button'), - h('button', { - class: 'vxe-pager--num-btn', - type: 'button', - onClick: (evnt: Event) => jumpPageEvent(evnt, pageCount) - }, pageCount) - ) - } - return h('span', { - class: 'vxe-pager--btn-wrapper' - }, nums) - } - - // jumpNumber - const renderJumpNumber = () => { - return renderNumber(true) - } - - // sizes - const renderSizes = () => { - const sizeList = computeSizeList.value - return h(VxeSelectComponent, { - class: 'vxe-pager--sizes', - modelValue: props.pageSize, - placement: 'top', - transfer: props.transfer, - options: sizeList, - onChange: pageSizeEvent - }) - } - - // Jump - const renderJump = (isFull?: boolean) => { - return h('span', { - class: 'vxe-pager--jump' - }, [ - isFull ? h('span', { - class: 'vxe-pager--goto-text' - }, GlobalConfig.i18n('vxe.pager.goto')) : null, - h('input', { - class: 'vxe-pager--goto', - value: reactData.inpCurrPage, - type: 'text', - autocomplete: 'off', - onInput: jumpInputEvent, - onKeydown: jumpKeydownEvent, - onBlur: triggerJumpEvent - }), - isFull ? h('span', { - class: 'vxe-pager--classifier-text' - }, GlobalConfig.i18n('vxe.pager.pageClassifier')) : null - ]) - } - - // FullJump - const renderFullJump = () => { - return renderJump(true) - } - - // PageCount - const renderPageCount = () => { - const pageCount = computePageCount.value - return h('span', { - class: 'vxe-pager--count' - }, [ - h('span', { - class: 'vxe-pager--separator' - }), - h('span', pageCount) - ]) - } - - // total - const renderTotal = () => { - return h('span', { - class: 'vxe-pager--total' - }, GlobalConfig.i18n('vxe.pager.total', [props.total])) - } - - pagerMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $pager: $xepager, $event: evnt }, params)) - }, - homePage () { - handleHomePage() - return nextTick() - }, - endPage () { - handleEndPage() - return nextTick() - }, - prevPage () { - handlePrevPage() - return nextTick() - }, - nextPage () { - handleNextPage() - return nextTick() - }, - prevJump () { - handlePrevJump() - return nextTick() - }, - nextJump () { - handleNextJump() - return nextTick() - } - } - - pagerPrivateMethods = { - handlePrevPage, - handleNextPage, - handlePrevJump, - handleNextJump - } - - Object.assign($xepager, pagerMethods, pagerPrivateMethods) - - watch(() => props.currentPage, (value) => { - reactData.inpCurrPage = value - }) - - const renderVN = () => { - const { align, layouts, className } = props - const childNodes = [] - const vSize = computeSize.value - const pageCount = computePageCount.value - if (slots.left) { - childNodes.push( - h('span', { - class: 'vxe-pager--left-wrapper' - }, slots.left({ $grid: $xegrid })) - ) - } - layouts.forEach((name) => { - let renderFn - switch (name) { - case 'Home': - renderFn = renderHomePage - break - case 'PrevJump': - renderFn = renderPrevJump - break - case 'PrevPage': - renderFn = renderPrevPage - break - case 'Number': - renderFn = renderNumber - break - case 'JumpNumber': - renderFn = renderJumpNumber - break - case 'NextPage': - renderFn = renderNextPage - break - case 'NextJump': - renderFn = renderNextJump - break - case 'End': - renderFn = renderEndPage - break - case 'Sizes': - renderFn = renderSizes - break - case 'FullJump': - renderFn = renderFullJump - break - case 'Jump': - renderFn = renderJump - break - case 'PageCount': - renderFn = renderPageCount - break - case 'Total': - renderFn = renderTotal - break - } - if (renderFn) { - childNodes.push(renderFn()) - } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - errLog('vxe.error.notProp', [`layouts -> ${name}`]) - } - } - }) - if (slots.right) { - childNodes.push( - h('span', { - class: 'vxe-pager--right-wrapper' - }, slots.right({ $grid: $xegrid })) - ) - } - return h('div', { - ref: refElem, - class: ['vxe-pager', className ? (XEUtils.isFunction(className) ? className({ $pager: $xepager }) : className) : '', { - [`size--${vSize}`]: vSize, - [`align--${align}`]: align, - 'is--border': props.border, - 'is--background': props.background, - 'is--perfect': props.perfect, - 'is--hidden': props.autoHidden && pageCount === 1, - 'is--loading': props.loading - }] - }, [ - h('div', { - class: 'vxe-pager--wrapper' - }, childNodes) - ]) - } - - $xepager.renderVN = renderVN - - return $xepager - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/pulldown/index.d.ts b/packages/pulldown/index.d.ts deleted file mode 100644 index 65edef7788..0000000000 --- a/packages/pulldown/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxePulldown } from '../../types/pulldown' - -export * from '../../types/pulldown' -export default VxePulldown diff --git a/packages/pulldown/index.ts b/packages/pulldown/index.ts deleted file mode 100644 index 8b060cf1dc..0000000000 --- a/packages/pulldown/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxePulldownComponent from './src/pulldown' -import { dynamicApp } from '../dynamics' - -export const VxePulldown = Object.assign(VxePulldownComponent, { - install: function (app: App) { - app.component(VxePulldownComponent.name, VxePulldownComponent) - } -}) - -export const Pulldown = VxePulldown - -dynamicApp.component(VxePulldownComponent.name, VxePulldownComponent) - -export default VxePulldown diff --git a/packages/pulldown/src/pulldown.ts b/packages/pulldown/src/pulldown.ts deleted file mode 100644 index 83fb1355b0..0000000000 --- a/packages/pulldown/src/pulldown.ts +++ /dev/null @@ -1,341 +0,0 @@ -import { defineComponent, h, Teleport, ref, Ref, onUnmounted, reactive, nextTick, PropType, watch, createCommentVNode } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' -import { getAbsolutePos, getEventTargetNode } from '../../tools/dom' -import { getLastZIndex, nextZIndex } from '../../tools/utils' -import { GlobalEvent } from '../../tools/event' - -import { VNodeStyle, VxePulldownConstructor, VxePulldownPropTypes, VxePulldownEmits, PulldownReactData, PulldownMethods, PulldownPrivateRef, VxePulldownMethods } from '../../../types/all' - -export default defineComponent({ - name: 'VxePulldown', - props: { - modelValue: Boolean as PropType, - disabled: Boolean as PropType, - placement: String as PropType, - size: { type: String as PropType, default: () => GlobalConfig.size }, - className: [String, Function] as PropType, - popupClassName: [String, Function] as PropType, - destroyOnClose: Boolean as PropType, - transfer: Boolean as PropType - }, - emits: [ - 'update:modelValue', - 'hide-panel' - ] as VxePulldownEmits, - setup (props, context) { - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - inited: false, - panelIndex: 0, - panelStyle: null, - panelPlacement: null, - visiblePanel: false, - animatVisible: false, - isActivated: false - }) - - const refElem = ref() as Ref - const refPulldowContent = ref() as Ref - const refPulldowPnanel = ref() as Ref - - const refMaps: PulldownPrivateRef = { - refElem - } - - const $xepulldown = { - xID, - props, - context, - reactData, - getRefMaps: () => refMaps - } as unknown as VxePulldownConstructor & VxePulldownMethods - - let pulldownMethods = {} as PulldownMethods - - const updateZindex = () => { - if (reactData.panelIndex < getLastZIndex()) { - reactData.panelIndex = nextZIndex() - } - } - - const isPanelVisible = () => { - return reactData.visiblePanel - } - - /** - * 手动更新位置 - */ - const updatePlacement = () => { - return nextTick().then(() => { - const { transfer, placement } = props - const { panelIndex, visiblePanel } = reactData - if (visiblePanel) { - const targetElem = refPulldowContent.value - const panelElem = refPulldowPnanel.value - if (panelElem && targetElem) { - const targetHeight = targetElem.offsetHeight - const targetWidth = targetElem.offsetWidth - const panelHeight = panelElem.offsetHeight - const panelWidth = panelElem.offsetWidth - const marginSize = 5 - const panelStyle: VNodeStyle = { - zIndex: panelIndex - } - const { boundingTop, boundingLeft, visibleHeight, visibleWidth } = getAbsolutePos(targetElem) - let panelPlacement = 'bottom' - if (transfer) { - let left = boundingLeft - let top = boundingTop + targetHeight - if (placement === 'top') { - panelPlacement = 'top' - top = boundingTop - panelHeight - } else if (!placement) { - // 如果下面不够放，则向上 - if (top + panelHeight + marginSize > visibleHeight) { - panelPlacement = 'top' - top = boundingTop - panelHeight - } - // 如果上面不够放，则向下（优先） - if (top < marginSize) { - panelPlacement = 'bottom' - top = boundingTop + targetHeight - } - } - // 如果溢出右边 - if (left + panelWidth + marginSize > visibleWidth) { - left -= left + panelWidth + marginSize - visibleWidth - } - // 如果溢出左边 - if (left < marginSize) { - left = marginSize - } - Object.assign(panelStyle, { - left: `${left}px`, - top: `${top}px`, - minWidth: `${targetWidth}px` - }) - } else { - if (placement === 'top') { - panelPlacement = 'top' - panelStyle.bottom = `${targetHeight}px` - } else if (!placement) { - // 如果下面不够放，则向上 - if (boundingTop + targetHeight + panelHeight > visibleHeight) { - // 如果上面不够放，则向下（优先） - if (boundingTop - targetHeight - panelHeight > marginSize) { - panelPlacement = 'top' - panelStyle.bottom = `${targetHeight}px` - } - } - } - } - reactData.panelStyle = panelStyle - reactData.panelPlacement = panelPlacement - } - } - return nextTick() - }) - } - - let hidePanelTimeout: number - - /** - * 显示下拉面板 - */ - const showPanel = (): Promise => { - if (!reactData.inited) { - reactData.inited = true - } - return new Promise(resolve => { - if (!props.disabled) { - clearTimeout(hidePanelTimeout) - reactData.isActivated = true - reactData.animatVisible = true - setTimeout(() => { - reactData.visiblePanel = true - emit('update:modelValue', true) - updatePlacement() - setTimeout(() => { - resolve(updatePlacement()) - }, 40) - }, 10) - updateZindex() - } else { - nextTick(() => { - resolve() - }) - } - }) - } - - /** - * 隐藏下拉面板 - */ - const hidePanel = (): Promise => { - reactData.visiblePanel = false - emit('update:modelValue', false) - return new Promise(resolve => { - if (reactData.animatVisible) { - hidePanelTimeout = window.setTimeout(() => { - reactData.animatVisible = false - nextTick(() => { - resolve() - }) - }, 350) - } else { - nextTick(() => { - resolve() - }) - } - }) - } - - /** - * 切换下拉面板 - */ - const togglePanel = () => { - if (reactData.visiblePanel) { - return hidePanel() - } - return showPanel() - } - - const handleGlobalMousewheelEvent = (evnt: Event) => { - const { disabled } = props - const { visiblePanel } = reactData - const panelElem = refPulldowPnanel.value - if (!disabled) { - if (visiblePanel) { - if (getEventTargetNode(evnt, panelElem).flag) { - updatePlacement() - } else { - hidePanel() - pulldownMethods.dispatchEvent('hide-panel', {}, evnt) - } - } - } - } - - const handleGlobalMousedownEvent = (evnt: Event) => { - const { disabled } = props - const { visiblePanel } = reactData - const el = refElem.value - const panelElem = refPulldowPnanel.value - if (!disabled) { - reactData.isActivated = getEventTargetNode(evnt, el).flag || getEventTargetNode(evnt, panelElem).flag - if (visiblePanel && !reactData.isActivated) { - hidePanel() - pulldownMethods.dispatchEvent('hide-panel', {}, evnt) - } - } - } - - const handleGlobalBlurEvent = (evnt: Event) => { - if (reactData.visiblePanel) { - reactData.isActivated = false - hidePanel() - pulldownMethods.dispatchEvent('hide-panel', {}, evnt) - } - } - - pulldownMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $pulldown: $xepulldown, $event: evnt }, params)) - }, - isPanelVisible, - togglePanel, - showPanel, - hidePanel - } - - Object.assign($xepulldown, pulldownMethods) - - watch(() => props.modelValue, (value) => { - if (value) { - showPanel() - } else { - hidePanel() - } - }) - - nextTick(() => { - GlobalEvent.on($xepulldown, 'mousewheel', handleGlobalMousewheelEvent) - GlobalEvent.on($xepulldown, 'mousedown', handleGlobalMousedownEvent) - GlobalEvent.on($xepulldown, 'blur', handleGlobalBlurEvent) - }) - - onUnmounted(() => { - GlobalEvent.off($xepulldown, 'mousewheel') - GlobalEvent.off($xepulldown, 'mousedown') - GlobalEvent.off($xepulldown, 'blur') - }) - - const renderVN = () => { - const { className, popupClassName, destroyOnClose, transfer, disabled } = props - const { inited, isActivated, animatVisible, visiblePanel, panelStyle, panelPlacement } = reactData - const vSize = computeSize.value - const defaultSlot = slots.default - const headerSlot = slots.header - const footerSlot = slots.footer - const dropdownSlot = slots.dropdown - return h('div', { - ref: refElem, - class: ['vxe-pulldown', className ? (XEUtils.isFunction(className) ? className({ $pulldown: $xepulldown }) : className) : '', { - [`size--${vSize}`]: vSize, - 'is--visivle': visiblePanel, - 'is--disabled': disabled, - 'is--active': isActivated - }] - }, [ - h('div', { - ref: refPulldowContent, - class: 'vxe-pulldown--content' - }, defaultSlot ? defaultSlot({ $pulldown: $xepulldown }) : []), - h(Teleport, { - to: 'body', - disabled: transfer ? !inited : true - }, [ - h('div', { - ref: refPulldowPnanel, - class: ['vxe-table--ignore-clear vxe-pulldown--panel', popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $pulldown: $xepulldown }) : popupClassName) : '', { - [`size--${vSize}`]: vSize, - 'is--transfer': transfer, - 'animat--leave': animatVisible, - 'animat--enter': visiblePanel - }], - placement: panelPlacement, - style: panelStyle - }, dropdownSlot ? [ - h('div', { - class: 'vxe-pulldown--panel-wrapper' - }, !inited || (destroyOnClose && !visiblePanel && !animatVisible) ? [] : [ - headerSlot ? h('div', { - class: 'vxe-pulldown--panel-header' - }, headerSlot({ $pulldown: $xepulldown })) : createCommentVNode(), - h('div', { - class: 'vxe-pulldown--panel-body' - }, dropdownSlot({ $pulldown: $xepulldown })), - footerSlot ? h('div', { - class: 'vxe-pulldown--panel-footer' - }, footerSlot({ $pulldown: $xepulldown })) : createCommentVNode() - ]) - ] : []) - ]) - ]) - } - - $xepulldown.renderVN = renderVN - - return $xepulldown - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/radio-button/index.d.ts b/packages/radio-button/index.d.ts deleted file mode 100644 index 2d96fd572c..0000000000 --- a/packages/radio-button/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeRadioButton } from '../../types/radio-button' - -export * from '../../types/radio-button' -export default VxeRadioButton diff --git a/packages/radio-button/index.ts b/packages/radio-button/index.ts deleted file mode 100644 index 33f9f62cc1..0000000000 --- a/packages/radio-button/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeRadioButtonComponent from '../radio/src/button' -import { dynamicApp } from '../dynamics' - -export const VxeRadioButton = Object.assign(VxeRadioButtonComponent, { - install: function (app: App) { - app.component(VxeRadioButtonComponent.name, VxeRadioButtonComponent) - } -}) - -export const RadioButton = VxeRadioButton - -dynamicApp.component(VxeRadioButtonComponent.name, VxeRadioButtonComponent) - -export default VxeRadioButton diff --git a/packages/radio-group/index.d.ts b/packages/radio-group/index.d.ts deleted file mode 100644 index 406035be2c..0000000000 --- a/packages/radio-group/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeRadioGroup } from '../../types/radio-group' - -export * from '../../types/radio-group' -export default VxeRadioGroup diff --git a/packages/radio-group/index.ts b/packages/radio-group/index.ts deleted file mode 100644 index e5ad04eada..0000000000 --- a/packages/radio-group/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeRadioGroupComponent from '../radio/src/group' -import { dynamicApp } from '../dynamics' - -export const VxeRadioGroup = Object.assign(VxeRadioGroupComponent, { - install: function (app: App) { - app.component(VxeRadioGroupComponent.name, VxeRadioGroupComponent) - } -}) - -export const RadioGroup = VxeRadioGroup - -dynamicApp.component(VxeRadioGroupComponent.name, VxeRadioGroupComponent) - -export default VxeRadioGroup diff --git a/packages/radio/index.d.ts b/packages/radio/index.d.ts deleted file mode 100644 index 35f1d15970..0000000000 --- a/packages/radio/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeRadio } from '../../types/radio' - -export * from '../../types/radio' -export default VxeRadio diff --git a/packages/radio/index.ts b/packages/radio/index.ts deleted file mode 100644 index 0c46b9707e..0000000000 --- a/packages/radio/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeRadioComponent from './src/radio' -import { dynamicApp } from '../dynamics' - -export const VxeRadio = Object.assign(VxeRadioComponent, { - install: function (app: App) { - app.component(VxeRadioComponent.name, VxeRadioComponent) - } -}) - -export const Radio = VxeRadio - -dynamicApp.component(VxeRadioComponent.name, VxeRadioComponent) - -export default VxeRadio diff --git a/packages/radio/src/button.ts b/packages/radio/src/button.ts deleted file mode 100644 index 28c0bd1c98..0000000000 --- a/packages/radio/src/button.ts +++ /dev/null @@ -1,132 +0,0 @@ -import { defineComponent, h, computed, inject, PropType } from 'vue' -import XEUtils from 'xe-utils' -import { getFuncText } from '../../tools/utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' - -import { VxeRadioButtonPropTypes, VxeRadioGroupConstructor, VxeRadioButtonConstructor, VxeRadioButtonEmits, VxeRadioGroupPrivateMethods, RadioButtonMethods, VxeFormConstructor, VxeFormPrivateMethods, VxeFormDefines } from '../../../types/all' - -export default defineComponent({ - name: 'VxeRadioButton', - props: { - modelValue: [String, Number, Boolean] as PropType, - label: { type: [String, Number, Boolean] as PropType, default: null }, - title: [String, Number] as PropType, - content: [String, Number] as PropType, - disabled: Boolean as PropType, - strict: { type: Boolean as PropType, default: () => GlobalConfig.radioButton.strict }, - size: { type: String as PropType, default: () => GlobalConfig.radioButton.size || GlobalConfig.size } - }, - emits: [ - 'update:modelValue', - 'change' - ] as VxeRadioButtonEmits, - setup (props, context) { - const { slots, emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const $xeradiobutton = { - xID, - props, - context - } as unknown as VxeRadioButtonConstructor - - let radioButtonMethods = {} as RadioButtonMethods - - const $xeradiogroup = inject('$xeradiogroup', null as (VxeRadioGroupConstructor & VxeRadioGroupPrivateMethods) | null) - - const computeDisabled = computed(() => { - return props.disabled || ($xeradiogroup && $xeradiogroup.props.disabled) - }) - - const computeName = computed(() => { - return $xeradiogroup ? $xeradiogroup.name : null - }) - - const computeStrict = computed(() => { - return $xeradiogroup ? $xeradiogroup.props.strict : props.strict - }) - - const computeChecked = computed(() => { - const { modelValue, label } = props - return $xeradiogroup ? $xeradiogroup.props.modelValue === label : modelValue === label - }) - - radioButtonMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $radioButton: $xeradiobutton, $event: evnt }, params)) - } - } - - Object.assign($xeradiobutton, radioButtonMethods) - - const handleValue = (label: VxeRadioButtonPropTypes.Label, evnt: Event) => { - if ($xeradiogroup) { - $xeradiogroup.handleChecked({ label }, evnt) - } else { - emit('update:modelValue', label) - radioButtonMethods.dispatchEvent('change', { label }, evnt) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, label) - } - } - } - - const changeEvent = (evnt: Event) => { - const isDisabled = computeDisabled.value - if (!isDisabled) { - handleValue(props.label, evnt) - } - } - - const clickEvent = (evnt: Event) => { - const isDisabled = computeDisabled.value - const isStrict = computeStrict.value - if (!isDisabled && !isStrict) { - if (props.label === ($xeradiogroup ? $xeradiogroup.props.modelValue : props.modelValue)) { - handleValue(null, evnt) - } - } - } - - const renderVN = () => { - const vSize = computeSize.value - const isDisabled = computeDisabled.value - const name = computeName.value - const checked = computeChecked.value - return h('label', { - class: ['vxe-radio', 'vxe-radio-button', { - [`size--${vSize}`]: vSize, - 'is--disabled': isDisabled - }], - title: props.title - }, [ - h('input', { - class: 'vxe-radio--input', - type: 'radio', - name, - checked, - disabled: isDisabled, - onChange: changeEvent, - onClick: clickEvent - }), - h('span', { - class: 'vxe-radio--label' - }, slots.default ? slots.default({}) : getFuncText(props.content)) - ]) - } - - Object.assign($xeradiobutton, { - renderVN, - dispatchEvent - }) - - return renderVN - } -}) diff --git a/packages/radio/src/group.ts b/packages/radio/src/group.ts deleted file mode 100644 index 771a718422..0000000000 --- a/packages/radio/src/group.ts +++ /dev/null @@ -1,106 +0,0 @@ -import { defineComponent, h, provide, PropType, inject, computed } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import VxeRadioComponent from './radio' -import VxeRadioButtonComponent from './button' -import { useSize } from '../../hooks/size' - -import { VxeRadioGroupPropTypes, VxeRadioGroupConstructor, VxeRadioGroupEmits, VxeRadioGroupPrivateMethods, RadioGroupPrivateMethods, RadioGroupMethods, VxeFormConstructor, VxeFormPrivateMethods, VxeFormDefines } from '../../../types/all' - -export default defineComponent({ - name: 'VxeRadioGroup', - props: { - modelValue: [String, Number, Boolean] as PropType, - disabled: Boolean as PropType, - type: String as PropType, - options: Array as PropType, - optionProps: Object as PropType, - strict: { type: Boolean as PropType, default: () => GlobalConfig.radioGroup.strict }, - size: { type: String as PropType, default: () => GlobalConfig.radioGroup.size || GlobalConfig.size } - }, - emits: [ - 'update:modelValue', - 'change' - ] as VxeRadioGroupEmits, - setup (props, context) { - const { slots, emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const $xeradiogroup = { - xID, - props, - context, - name: XEUtils.uniqueId('xegroup_') - } as unknown as VxeRadioGroupConstructor & VxeRadioGroupPrivateMethods - - const computePropsOpts = computed(() => { - return props.optionProps || {} - }) - - const computeLabelField = computed(() => { - const propsOpts = computePropsOpts.value - return propsOpts.label || 'label' - }) - - const computeValueField = computed(() => { - const propsOpts = computePropsOpts.value - return propsOpts.value || 'value' - }) - - const computeDisabledField = computed(() => { - const propsOpts = computePropsOpts.value - return propsOpts.disabled || 'disabled' - }) - - let radioGroupMethods = {} as RadioGroupMethods - - useSize(props) - - const radioGroupPrivateMethods: RadioGroupPrivateMethods = { - handleChecked (params, evnt) { - emit('update:modelValue', params.label) - radioGroupMethods.dispatchEvent('change', params) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, params.label) - } - } - } - - radioGroupMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $radioGroup: $xeradiogroup, $event: evnt }, params)) - } - } - - const renderVN = () => { - const { options, type } = props - const defaultSlot = slots.default - const valueField = computeValueField.value as 'value' - const labelField = computeLabelField.value as 'label' - const disabledField = computeDisabledField.value as 'disabled' - const btnComp = type === 'button' ? VxeRadioButtonComponent : VxeRadioComponent - return h('div', { - class: 'vxe-radio-group' - }, defaultSlot ? defaultSlot({}) : (options ? options.map(item => { - return h(btnComp, { - label: item[valueField], - content: item[labelField], - disabled: item[disabledField] - }) - }) : [])) - } - - Object.assign($xeradiogroup, radioGroupPrivateMethods, { - renderVN, - dispatchEvent - }) - - provide('$xeradiogroup', $xeradiogroup) - - return renderVN - } -}) diff --git a/packages/radio/src/radio.ts b/packages/radio/src/radio.ts deleted file mode 100644 index 4255c0a415..0000000000 --- a/packages/radio/src/radio.ts +++ /dev/null @@ -1,137 +0,0 @@ -import { defineComponent, h, computed, inject, PropType } from 'vue' -import XEUtils from 'xe-utils' -import { getFuncText } from '../../tools/utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' - -import { VxeRadioPropTypes, VxeRadioConstructor, VxeRadioEmits, VxeRadioGroupConstructor, VxeRadioGroupPrivateMethods, RadioMethods, VxeFormConstructor, VxeFormPrivateMethods, VxeFormDefines } from '../../../types/all' - -export default defineComponent({ - name: 'VxeRadio', - props: { - modelValue: [String, Number, Boolean] as PropType, - label: { type: [String, Number, Boolean] as PropType, default: null }, - title: [String, Number] as PropType, - content: [String, Number] as PropType, - disabled: Boolean as PropType, - name: String as PropType, - strict: { type: Boolean as PropType, default: () => GlobalConfig.radio.strict }, - size: { type: String as PropType, default: () => GlobalConfig.radio.size || GlobalConfig.size } - }, - emits: [ - 'update:modelValue', - 'change' - ] as VxeRadioEmits, - setup (props, context) { - const { slots, emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const $xeradio = { - xID, - props, - context - } as unknown as VxeRadioConstructor - - const computeSize = useSize(props) - - const $xeradiogroup = inject('$xeradiogroup', null as (VxeRadioGroupConstructor & VxeRadioGroupPrivateMethods) | null) - - let radioMethods = {} as RadioMethods - - const computeDisabled = computed(() => { - return props.disabled || ($xeradiogroup && $xeradiogroup.props.disabled) - }) - - const computeName = computed(() => { - return $xeradiogroup ? $xeradiogroup.name : props.name - }) - - const computeStrict = computed(() => { - return $xeradiogroup ? $xeradiogroup.props.strict : props.strict - }) - - const computeChecked = computed(() => { - const { modelValue, label } = props - return $xeradiogroup ? $xeradiogroup.props.modelValue === label : modelValue === label - }) - - const handleValue = (label: VxeRadioPropTypes.Label, evnt: Event) => { - if ($xeradiogroup) { - $xeradiogroup.handleChecked({ label }, evnt) - } else { - emit('update:modelValue', label) - radioMethods.dispatchEvent('change', { label }, evnt) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, label) - } - } - } - - const changeEvent = (evnt: Event) => { - const isDisabled = computeDisabled.value - if (!isDisabled) { - handleValue(props.label, evnt) - } - } - - const clickEvent = (evnt: Event) => { - const isDisabled = computeDisabled.value - const isStrict = computeStrict.value - if (!isDisabled && !isStrict) { - if (props.label === ($xeradiogroup ? $xeradiogroup.props.modelValue : props.modelValue)) { - handleValue(null, evnt) - } - } - } - - radioMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $radio: $xeradio, $event: evnt }, params)) - } - } - - Object.assign($xeradio, radioMethods) - - const renderVN = () => { - const vSize = computeSize.value - const isDisabled = computeDisabled.value - const name = computeName.value - const isChecked = computeChecked.value - return h('label', { - class: ['vxe-radio', { - [`size--${vSize}`]: vSize, - 'is--checked': isChecked, - 'is--disabled': isDisabled - }], - title: props.title - }, [ - h('input', { - class: 'vxe-radio--input', - type: 'radio', - name, - checked: isChecked, - disabled: isDisabled, - onChange: changeEvent, - onClick: clickEvent - }), - h('span', { - class: ['vxe-radio--icon', isChecked ? 'vxe-icon-radio-checked' : 'vxe-icon-radio-unchecked'] - }), - h('span', { - class: 'vxe-radio--label' - }, slots.default ? slots.default({}) : getFuncText(props.content)) - ]) - } - - $xeradio.renderVN = renderVN - - return $xeradio - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/select/index.d.ts b/packages/select/index.d.ts deleted file mode 100644 index c355580cae..0000000000 --- a/packages/select/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeOptgroup } from '../../types/optgroup' - -export * from '../../types/optgroup' -export default VxeOptgroup diff --git a/packages/select/index.ts b/packages/select/index.ts deleted file mode 100644 index 2b95c068b6..0000000000 --- a/packages/select/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeSelectComponent from './src/select' -import { dynamicApp } from '../dynamics' - -export const VxeSelect = Object.assign(VxeSelectComponent, { - install: function (app: App) { - app.component(VxeSelectComponent.name, VxeSelectComponent) - } -}) - -export const Select = VxeSelect - -dynamicApp.component(VxeSelectComponent.name, VxeSelectComponent) - -export default VxeSelect diff --git a/packages/select/src/optgroup.ts b/packages/select/src/optgroup.ts deleted file mode 100644 index bdaa99bad4..0000000000 --- a/packages/select/src/optgroup.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { defineComponent, h, onUnmounted, provide, inject, ref, Ref, onMounted, PropType } from 'vue' -import { XEOptionProvide, createOption, watchOption, destroyOption, assemOption } from './util' - -import { VxeSelectConstructor, VxeOptionPropTypes } from '../../../types/all' - -export default defineComponent({ - name: 'VxeOptgroup', - props: { - label: { type: [String, Number, Boolean] as PropType, default: '' }, - visible: { type: Boolean as PropType, default: null }, - className: [String, Function] as PropType, - disabled: Boolean as PropType - }, - setup (props, { slots }) { - const elem = ref() as Ref - const $xeselect = inject('$xeselect', {} as VxeSelectConstructor) - const option = createOption($xeselect, props) - const xeoption: XEOptionProvide = { option } - option.options = [] - - provide('xeoptgroup', xeoption) - - watchOption(props, option) - - onMounted(() => { - assemOption($xeselect, elem.value, option) - }) - - onUnmounted(() => { - destroyOption($xeselect, option) - }) - - return () => { - return h('div', { - ref: elem - }, slots.default ? slots.default() : []) - } - } -}) diff --git a/packages/select/src/option.ts b/packages/select/src/option.ts deleted file mode 100644 index 3dae517664..0000000000 --- a/packages/select/src/option.ts +++ /dev/null @@ -1,38 +0,0 @@ -import { defineComponent, h, onUnmounted, inject, ref, Ref, onMounted, PropType } from 'vue' -import { XEOptionProvide, createOption, watchOption, destroyOption, assemOption } from './util' - -import { VxeSelectConstructor, VxeOptionPropTypes } from '../../../types/all' - -export default defineComponent({ - name: 'VxeOption', - props: { - value: null, - label: { type: [String, Number, Boolean] as PropType, default: '' }, - visible: { type: Boolean as PropType, default: null }, - className: [String, Function] as PropType, - disabled: Boolean as PropType - }, - setup (props, { slots }) { - const elem = ref() as Ref - const $xeselect = inject('$xeselect', {} as VxeSelectConstructor) - const optgroup = inject('xeoptgroup', null as XEOptionProvide | null) - const option = createOption($xeselect, props) - option.slots = slots - - watchOption(props, option) - - onMounted(() => { - assemOption($xeselect, elem.value, option, optgroup) - }) - - onUnmounted(() => { - destroyOption($xeselect, option) - }) - - return () => { - return h('div', { - ref: elem - }) - } - } -}) diff --git a/packages/select/src/optionInfo.ts b/packages/select/src/optionInfo.ts deleted file mode 100644 index 141f03300e..0000000000 --- a/packages/select/src/optionInfo.ts +++ /dev/null @@ -1,20 +0,0 @@ -import XEUtils from 'xe-utils' - -export class OptionInfo { - constructor ($xeselect: any, _vm: any) { - Object.assign(this, { - id: XEUtils.uniqueId('option_'), - value: _vm.value, - label: _vm.label, - visible: _vm.visible, - className: _vm.className, - disabled: _vm.disabled - }) - } - - update (name: any, value: any) { - this[name] = value - } - - [key: string]: any -} diff --git a/packages/select/src/select.ts b/packages/select/src/select.ts deleted file mode 100644 index de9f774a07..0000000000 --- a/packages/select/src/select.ts +++ /dev/null @@ -1,1020 +0,0 @@ -import { defineComponent, h, Teleport, PropType, ref, Ref, inject, computed, provide, onUnmounted, reactive, nextTick, watch, onMounted, createCommentVNode } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' -import { getEventTargetNode, getAbsolutePos } from '../../tools/dom' -import { getLastZIndex, nextZIndex, getFuncText, formatText } from '../../tools/utils' -import { GlobalEvent, hasEventKey, EVENT_KEYS } from '../../tools/event' -import VxeInputComponent from '../../input/src/input' -import { getSlotVNs } from '../../tools/vn' - -import { VxeSelectPropTypes, VxeSelectConstructor, SelectReactData, VxeSelectEmits, VxeInputConstructor, SelectMethods, SelectPrivateRef, VxeSelectMethods, VxeOptgroupProps, VxeOptionProps, VxeFormDefines, VxeFormConstructor, VxeFormPrivateMethods, VxeInputDefines, SlotVNodeType } from '../../../types/all' - -function isOptionVisible (option: any) { - return option.visible !== false -} - -function getOptUniqueId () { - return XEUtils.uniqueId('opt_') -} - -export default defineComponent({ - name: 'VxeSelect', - props: { - modelValue: null, - clearable: Boolean as PropType, - placeholder: { - type: String as PropType, - default: () => XEUtils.eqNull(GlobalConfig.select.placeholder) ? GlobalConfig.i18n('vxe.base.pleaseSelect') : GlobalConfig.select.placeholder - }, - loading: Boolean as PropType, - disabled: Boolean as PropType, - multiple: Boolean as PropType, - multiCharOverflow: { type: [Number, String] as PropType, default: () => GlobalConfig.select.multiCharOverflow }, - prefixIcon: String as PropType, - placement: String as PropType, - options: Array as PropType, - optionProps: Object as PropType, - optionGroups: Array as PropType, - optionGroupProps: Object as PropType, - optionConfig: Object as PropType, - className: [String, Function] as PropType, - popupClassName: [String, Function] as PropType, - max: { type: [String, Number] as PropType, default: null }, - size: { type: String as PropType, default: () => GlobalConfig.select.size || GlobalConfig.size }, - filterable: Boolean as PropType, - filterMethod: Function as PropType, - remote: Boolean as PropType, - remoteMethod: Function as PropType, - emptyText: String as PropType, - // 已废弃，被 option-config.keyField 替换 - optionId: { type: String as PropType, default: () => GlobalConfig.select.optionId }, - // 已废弃，被 option-config.useKey 替换 - optionKey: Boolean as PropType, - transfer: { type: Boolean as PropType, default: () => GlobalConfig.select.transfer } - }, - emits: [ - 'update:modelValue', - 'change', - 'clear', - 'blur', - 'focus' - ] as VxeSelectEmits, - setup (props, context) { - const { slots, emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - inited: false, - staticOptions: [], - fullGroupList: [], - fullOptionList: [], - visibleGroupList: [], - visibleOptionList: [], - remoteValueList: [], - panelIndex: 0, - panelStyle: {}, - panelPlacement: null, - currentOption: null, - currentValue: null, - visiblePanel: false, - animatVisible: false, - isActivated: false, - searchValue: '', - searchLoading: false - }) - - const refElem = ref() as Ref - const refInput = ref() as Ref - const refInpSearch = ref() as Ref - const refOptionWrapper = ref() as Ref - const refOptionPanel = ref() as Ref - - const refMaps: SelectPrivateRef = { - refElem - } - - const $xeselect = { - xID, - props, - context, - reactData, - getRefMaps: () => refMaps - } as unknown as VxeSelectConstructor & VxeSelectMethods - - let selectMethods = {} as SelectMethods - - const computePropsOpts = computed(() => { - return props.optionProps || {} - }) - - const computeGroupPropsOpts = computed(() => { - return props.optionGroupProps || {} - }) - - const computeLabelField = computed(() => { - const propsOpts = computePropsOpts.value - return propsOpts.label || 'label' - }) - - const computeValueField = computed(() => { - const propsOpts = computePropsOpts.value - return propsOpts.value || 'value' - }) - - const computeGroupLabelField = computed(() => { - const groupPropsOpts = computeGroupPropsOpts.value - return groupPropsOpts.label || 'label' - }) - - const computeGroupOptionsField = computed(() => { - const groupPropsOpts = computeGroupPropsOpts.value - return groupPropsOpts.options || 'options' - }) - - const computeIsMaximize = computed(() => { - const { modelValue, multiple, max } = props - if (multiple && max) { - return (modelValue ? modelValue.length : 0) >= XEUtils.toNumber(max) - } - return false - }) - - const computeOptionOpts = computed(() => { - return Object.assign({}, GlobalConfig.select.optionConfig, props.optionConfig) - }) - - const computeIsGroup = computed(() => { - return reactData.fullGroupList.some((item) => item.options && item.options.length) - }) - - const computeMultiMaxCharNum = computed(() => { - return XEUtils.toNumber(props.multiCharOverflow) - }) - - const callSlot = (slotFunc: ((params: T) => SlotVNodeType | SlotVNodeType[]) | string | null, params: T) => { - if (slotFunc) { - if (XEUtils.isString(slotFunc)) { - slotFunc = slots[slotFunc] || null - } - if (XEUtils.isFunction(slotFunc)) { - return getSlotVNs(slotFunc(params)) - } - } - return [] - } - - const findOption = (optionValue: any) => { - const { fullOptionList, fullGroupList } = reactData - const isGroup = computeIsGroup.value - const valueField = computeValueField.value as 'value' - if (isGroup) { - for (let gIndex = 0; gIndex < fullGroupList.length; gIndex++) { - const group = fullGroupList[gIndex] - if (group.options) { - for (let index = 0; index < group.options.length; index++) { - const option = group.options[index] - if (optionValue === option[valueField]) { - return option - } - } - } - } - } - return fullOptionList.find((item) => optionValue === item[valueField]) - } - - const getRemoteSelectLabel = (value: any) => { - const { remoteValueList } = reactData - const labelField = computeLabelField.value - const remoteItem = remoteValueList.find(item => value === item.key) - const item = remoteItem ? remoteItem.result : null - return XEUtils.toValueString(item ? item[labelField] : value) - } - - const getSelectLabel = (value: any) => { - const labelField = computeLabelField.value - const item = findOption(value) - return XEUtils.toValueString(item ? item[labelField as 'label'] : value) - } - - const computeSelectLabel = computed(() => { - const { modelValue, multiple, remote } = props - const multiMaxCharNum = computeMultiMaxCharNum.value - if (modelValue && multiple) { - const vals = XEUtils.isArray(modelValue) ? modelValue : [modelValue] - if (remote) { - return vals.map(val => getRemoteSelectLabel(val)).join(', ') - } - return vals.map((val) => { - const label = getSelectLabel(val) - if (multiMaxCharNum > 0 && label.length > multiMaxCharNum) { - return `${label.substring(0, multiMaxCharNum)}...` - } - return label - }).join(', ') - } - if (remote) { - return getRemoteSelectLabel(modelValue) - } - return getSelectLabel(modelValue) - }) - - const getOptkey = () => { - const optionOpts = computeOptionOpts.value - return optionOpts.keyField || props.optionId || '_X_OPTION_KEY' - } - - const getOptid = (option: any) => { - const optid = option[getOptkey()] - return optid ? encodeURIComponent(optid) : '' - } - - /** - * 刷新选项，当选项被动态显示/隐藏时可能会用到 - */ - const refreshOption = () => { - const { filterable, filterMethod } = props - const { fullOptionList, fullGroupList, searchValue } = reactData - const isGroup = computeIsGroup.value - const groupLabelField = computeGroupLabelField.value - const labelField = computeLabelField.value - if (isGroup) { - if (filterable && filterMethod) { - reactData.visibleGroupList = fullGroupList.filter(group => isOptionVisible(group) && filterMethod({ group, option: null, searchValue })) - } else if (filterable) { - reactData.visibleGroupList = fullGroupList.filter(group => isOptionVisible(group) && (!searchValue || `${group[groupLabelField]}`.indexOf(searchValue) > -1)) - } else { - reactData.visibleGroupList = fullGroupList.filter(isOptionVisible) - } - } else { - if (filterable && filterMethod) { - reactData.visibleOptionList = fullOptionList.filter(option => isOptionVisible(option) && filterMethod({ group: null, option, searchValue })) - } else if (filterable) { - reactData.visibleOptionList = fullOptionList.filter(option => isOptionVisible(option) && (!searchValue || `${option[labelField]}`.indexOf(searchValue) > -1)) - } else { - reactData.visibleOptionList = fullOptionList.filter(isOptionVisible) - } - } - return nextTick() - } - - const cacheItemMap = () => { - const { fullOptionList, fullGroupList } = reactData - const groupOptionsField = computeGroupOptionsField.value - const key = getOptkey() - const handleOptis = (item: any) => { - if (!getOptid(item)) { - item[key] = getOptUniqueId() - } - } - if (fullGroupList.length) { - fullGroupList.forEach((group: any) => { - handleOptis(group) - if (group[groupOptionsField]) { - group[groupOptionsField].forEach(handleOptis) - } - }) - } else if (fullOptionList.length) { - fullOptionList.forEach(handleOptis) - } - refreshOption() - } - - const setCurrentOption = (option: any) => { - const valueField = computeValueField.value - if (option) { - reactData.currentOption = option - reactData.currentValue = option[valueField] - } - } - - const scrollToOption = (option: any, isAlignBottom?: boolean) => { - return nextTick().then(() => { - if (option) { - const optWrapperElem = refOptionWrapper.value - const panelElem = refOptionPanel.value - const optElem = panelElem.querySelector(`[optid='${getOptid(option)}']`) as HTMLElement - if (optWrapperElem && optElem) { - const wrapperHeight = optWrapperElem.offsetHeight - const offsetPadding = 5 - if (isAlignBottom) { - if (optElem.offsetTop + optElem.offsetHeight - optWrapperElem.scrollTop > wrapperHeight) { - optWrapperElem.scrollTop = optElem.offsetTop + optElem.offsetHeight - wrapperHeight - } - } else { - if (optElem.offsetTop + offsetPadding < optWrapperElem.scrollTop || optElem.offsetTop + offsetPadding > optWrapperElem.scrollTop + optWrapperElem.clientHeight) { - optWrapperElem.scrollTop = optElem.offsetTop - offsetPadding - } - } - } - } - }) - } - - const updateZindex = () => { - if (reactData.panelIndex < getLastZIndex()) { - reactData.panelIndex = nextZIndex() - } - } - - const updatePlacement = () => { - return nextTick().then(() => { - const { transfer, placement } = props - const { panelIndex } = reactData - const el = refElem.value - const panelElem = refOptionPanel.value - if (panelElem && el) { - const targetHeight = el.offsetHeight - const targetWidth = el.offsetWidth - const panelHeight = panelElem.offsetHeight - const panelWidth = panelElem.offsetWidth - const marginSize = 5 - const panelStyle: { [key: string]: any } = { - zIndex: panelIndex - } - const { boundingTop, boundingLeft, visibleHeight, visibleWidth } = getAbsolutePos(el) - let panelPlacement = 'bottom' - if (transfer) { - let left = boundingLeft - let top = boundingTop + targetHeight - if (placement === 'top') { - panelPlacement = 'top' - top = boundingTop - panelHeight - } else if (!placement) { - // 如果下面不够放，则向上 - if (top + panelHeight + marginSize > visibleHeight) { - panelPlacement = 'top' - top = boundingTop - panelHeight - } - // 如果上面不够放，则向下（优先） - if (top < marginSize) { - panelPlacement = 'bottom' - top = boundingTop + targetHeight - } - } - // 如果溢出右边 - if (left + panelWidth + marginSize > visibleWidth) { - left -= left + panelWidth + marginSize - visibleWidth - } - // 如果溢出左边 - if (left < marginSize) { - left = marginSize - } - Object.assign(panelStyle, { - left: `${left}px`, - top: `${top}px`, - minWidth: `${targetWidth}px` - }) - } else { - if (placement === 'top') { - panelPlacement = 'top' - panelStyle.bottom = `${targetHeight}px` - } else if (!placement) { - // 如果下面不够放，则向上 - if (boundingTop + targetHeight + panelHeight > visibleHeight) { - // 如果上面不够放，则向下（优先） - if (boundingTop - targetHeight - panelHeight > marginSize) { - panelPlacement = 'top' - panelStyle.bottom = `${targetHeight}px` - } - } - } - } - reactData.panelStyle = panelStyle - reactData.panelPlacement = panelPlacement - return nextTick() - } - }) - } - - let hidePanelTimeout: number - - const showOptionPanel = () => { - const { loading, disabled, filterable } = props - if (!loading && !disabled) { - clearTimeout(hidePanelTimeout) - if (!reactData.inited) { - reactData.inited = true - } - reactData.isActivated = true - reactData.animatVisible = true - if (filterable) { - refreshOption() - } - setTimeout(() => { - const { modelValue, multiple } = props - const currOption = findOption(multiple && modelValue ? modelValue[0] : modelValue) - reactData.visiblePanel = true - if (currOption) { - setCurrentOption(currOption) - scrollToOption(currOption) - } - handleFocusSearch() - }, 10) - updateZindex() - updatePlacement() - } - } - - const hideOptionPanel = () => { - reactData.searchValue = '' - reactData.searchLoading = false - reactData.visiblePanel = false - hidePanelTimeout = window.setTimeout(() => { - reactData.animatVisible = false - }, 350) - } - - const changeEvent = (evnt: Event, selectValue: any) => { - if (selectValue !== props.modelValue) { - emit('update:modelValue', selectValue) - selectMethods.dispatchEvent('change', { value: selectValue }, evnt) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, selectValue) - } - } - } - - const clearValueEvent = (evnt: Event, selectValue: any) => { - reactData.remoteValueList = [] - changeEvent(evnt, selectValue) - selectMethods.dispatchEvent('clear', { value: selectValue }, evnt) - } - - const clearEvent = (params: any, evnt: Event) => { - clearValueEvent(evnt, null) - hideOptionPanel() - } - - const changeOptionEvent = (evnt: Event, selectValue: any, option: any) => { - const { modelValue, multiple } = props - const { remoteValueList } = reactData - if (multiple) { - let multipleValue - if (modelValue) { - if (modelValue.indexOf(selectValue) === -1) { - multipleValue = modelValue.concat([selectValue]) - } else { - multipleValue = (modelValue as any[]).filter((val) => val !== selectValue) - } - } else { - multipleValue = [selectValue] - } - const remoteItem = remoteValueList.find(item => item.key === selectValue) - if (remoteItem) { - remoteItem.result = option - } else { - remoteValueList.push({ key: selectValue, result: option }) - } - changeEvent(evnt, multipleValue) - } else { - reactData.remoteValueList = [{ key: selectValue, result: option }] - changeEvent(evnt, selectValue) - hideOptionPanel() - } - } - - const handleGlobalMousewheelEvent = (evnt: MouseEvent) => { - const { disabled } = props - const { visiblePanel } = reactData - if (!disabled) { - if (visiblePanel) { - const panelElem = refOptionPanel.value - if (getEventTargetNode(evnt, panelElem).flag) { - updatePlacement() - } else { - hideOptionPanel() - } - } - } - } - - const handleGlobalMousedownEvent = (evnt: MouseEvent) => { - const { disabled } = props - const { visiblePanel } = reactData - if (!disabled) { - const el = refElem.value - const panelElem = refOptionPanel.value - reactData.isActivated = getEventTargetNode(evnt, el).flag || getEventTargetNode(evnt, panelElem).flag - if (visiblePanel && !reactData.isActivated) { - hideOptionPanel() - } - } - } - - const findOffsetOption = (optionValue: any, isUpArrow: boolean) => { - const { visibleOptionList, visibleGroupList } = reactData - const isGroup = computeIsGroup.value - const valueField = computeValueField.value as 'value' - const groupOptionsField = computeGroupOptionsField.value as 'options' - let firstOption - let prevOption - let nextOption - let currOption - if (isGroup) { - for (let gIndex = 0; gIndex < visibleGroupList.length; gIndex++) { - const group = visibleGroupList[gIndex] - const groupOptionList = group[groupOptionsField] - const isGroupDisabled = group.disabled - if (groupOptionList) { - for (let index = 0; index < groupOptionList.length; index++) { - const option = groupOptionList[index] - const isVisible = isOptionVisible(option) - const isDisabled = isGroupDisabled || option.disabled - if (!firstOption && !isDisabled) { - firstOption = option - } - if (currOption) { - if (isVisible && !isDisabled) { - nextOption = option - if (!isUpArrow) { - return { offsetOption: nextOption } - } - } - } - if (optionValue === option[valueField]) { - currOption = option - if (isUpArrow) { - return { offsetOption: prevOption } - } - } else { - if (isVisible && !isDisabled) { - prevOption = option - } - } - } - } - } - } else { - for (let index = 0; index < visibleOptionList.length; index++) { - const option = visibleOptionList[index] - const isDisabled = option.disabled - if (!firstOption && !isDisabled) { - firstOption = option - } - if (currOption) { - if (!isDisabled) { - nextOption = option - if (!isUpArrow) { - return { offsetOption: nextOption } - } - } - } - if (optionValue === option[valueField]) { - currOption = option - if (isUpArrow) { - return { offsetOption: prevOption } - } - } else { - if (!isDisabled) { - prevOption = option - } - } - } - } - return { firstOption } - } - - const handleGlobalKeydownEvent = (evnt: KeyboardEvent) => { - const { clearable, disabled } = props - const { visiblePanel, currentValue, currentOption } = reactData - if (!disabled) { - const isTab = hasEventKey(evnt, EVENT_KEYS.TAB) - const isEnter = hasEventKey(evnt, EVENT_KEYS.ENTER) - const isEsc = hasEventKey(evnt, EVENT_KEYS.ESCAPE) - const isUpArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_UP) - const isDwArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_DOWN) - const isDel = hasEventKey(evnt, EVENT_KEYS.DELETE) - const isSpacebar = hasEventKey(evnt, EVENT_KEYS.SPACEBAR) - if (isTab) { - reactData.isActivated = false - } - if (visiblePanel) { - if (isEsc || isTab) { - hideOptionPanel() - } else if (isEnter) { - evnt.preventDefault() - evnt.stopPropagation() - changeOptionEvent(evnt, currentValue, currentOption) - } else if (isUpArrow || isDwArrow) { - evnt.preventDefault() - let { firstOption, offsetOption } = findOffsetOption(currentValue, isUpArrow) - if (!offsetOption && !findOption(currentValue)) { - offsetOption = firstOption - } - setCurrentOption(offsetOption) - scrollToOption(offsetOption, isDwArrow) - } else if (isSpacebar) { - evnt.preventDefault() - } - } else if ((isUpArrow || isDwArrow || isEnter || isSpacebar) && reactData.isActivated) { - evnt.preventDefault() - showOptionPanel() - } - if (reactData.isActivated) { - if (isDel && clearable) { - clearValueEvent(evnt, null) - } - } - } - } - - const handleGlobalBlurEvent = () => { - hideOptionPanel() - } - - const handleFocusSearch = () => { - if (props.filterable) { - nextTick(() => { - const inpSearch = refInpSearch.value - if (inpSearch) { - inpSearch.focus() - } - }) - } - } - - const focusEvent = (evnt: FocusEvent) => { - if (!props.disabled) { - reactData.isActivated = true - } - selectMethods.dispatchEvent('focus', {}, evnt) - } - - const blurEvent = (evnt: FocusEvent) => { - reactData.isActivated = false - selectMethods.dispatchEvent('blur', {}, evnt) - } - - const modelSearchEvent = (value: string) => { - reactData.searchValue = value - } - - const focusSearchEvent = () => { - reactData.isActivated = true - } - - const keydownSearchEvent = (params: VxeInputDefines.KeydownEventParams) => { - const { $event } = params - const isEnter = hasEventKey($event, EVENT_KEYS.ENTER) - if (isEnter) { - $event.preventDefault() - $event.stopPropagation() - } - } - - const triggerSearchEvent = XEUtils.debounce(function () { - const { remote, remoteMethod } = props - const { searchValue } = reactData - if (remote && remoteMethod) { - reactData.searchLoading = true - Promise.resolve(remoteMethod({ searchValue })).then(() => nextTick()).catch(() => nextTick()).finally(() => { - reactData.searchLoading = false - refreshOption() - }) - } else { - refreshOption() - } - }, 350, { trailing: true }) - - const togglePanelEvent = (params: any) => { - const { $event } = params - $event.preventDefault() - if (reactData.visiblePanel) { - hideOptionPanel() - } else { - showOptionPanel() - } - } - - const checkOptionDisabled = (isSelected: any, option: VxeOptionProps, group?: VxeOptgroupProps) => { - if (option.disabled) { - return true - } - if (group && group.disabled) { - return true - } - const isMaximize = computeIsMaximize.value - if (isMaximize && !isSelected) { - return true - } - return false - } - - const renderOption = (list: VxeOptionProps[], group?: VxeOptgroupProps) => { - const { optionKey, modelValue, multiple } = props - const { currentValue } = reactData - const optionOpts = computeOptionOpts.value - const labelField = computeLabelField.value - const valueField = computeValueField.value - const isGroup = computeIsGroup.value - const { useKey } = optionOpts - const optionSlot = slots.option - return list.map((option, cIndex) => { - const { slots, className } = option - const optionValue = option[valueField as 'value'] - const isSelected = multiple ? (modelValue && modelValue.indexOf(optionValue) > -1) : modelValue === optionValue - const isVisible = !isGroup || isOptionVisible(option) - const isDisabled = checkOptionDisabled(isSelected, option, group) - const optid = getOptid(option) - const defaultSlot = slots ? slots.default : null - const optParams = { option, group: null, $select: $xeselect } - return isVisible ? h('div', { - key: useKey || optionKey ? optid : cIndex, - class: ['vxe-select-option', className ? (XEUtils.isFunction(className) ? className(optParams) : className) : '', { - 'is--disabled': isDisabled, - 'is--selected': isSelected, - 'is--hover': currentValue === optionValue - }], - // attrs - optid: optid, - // event - onMousedown: (evnt: MouseEvent) => { - const isLeftBtn = evnt.button === 0 - if (isLeftBtn) { - evnt.stopPropagation() - } - }, - onClick: (evnt: MouseEvent) => { - if (!isDisabled) { - changeOptionEvent(evnt, optionValue, option) - } - }, - onMouseenter: () => { - if (!isDisabled) { - setCurrentOption(option) - } - } - }, optionSlot ? callSlot(optionSlot, optParams) : (defaultSlot ? callSlot(defaultSlot, optParams) : formatText(getFuncText(option[labelField as 'label'])))) : null - }) - } - - const renderOptgroup = () => { - const { optionKey } = props - const { visibleGroupList } = reactData - const optionOpts = computeOptionOpts.value - const groupLabelField = computeGroupLabelField.value - const groupOptionsField = computeGroupOptionsField.value - const { useKey } = optionOpts - const optionSlot = slots.option - return visibleGroupList.map((group, gIndex) => { - const { slots, className } = group - const optid = getOptid(group) - const isGroupDisabled = group.disabled - const defaultSlot = slots ? slots.default : null - const optParams = { option: group, group, $select: $xeselect } - return h('div', { - key: useKey || optionKey ? optid : gIndex, - class: ['vxe-optgroup', className ? (XEUtils.isFunction(className) ? className(optParams) : className) : '', { - 'is--disabled': isGroupDisabled - }], - // attrs - optid: optid - }, [ - h('div', { - class: 'vxe-optgroup--title' - }, optionSlot ? callSlot(optionSlot, optParams) : (defaultSlot ? callSlot(defaultSlot, optParams) : getFuncText(group[groupLabelField as 'label']))), - h('div', { - class: 'vxe-optgroup--wrapper' - }, renderOption(group[groupOptionsField as 'options'] || [], group)) - ]) - }) - } - - const renderOpts = () => { - const { visibleGroupList, visibleOptionList, searchLoading } = reactData - const isGroup = computeIsGroup.value - if (searchLoading) { - return [ - h('div', { - class: 'vxe-select--search-loading' - }, [ - h('i', { - class: ['vxe-select--search-icon', GlobalConfig.icon.SELECT_LOADED] - }), - h('span', { - class: 'vxe-select--search-text' - }, GlobalConfig.i18n('vxe.select.loadingText')) - ]) - ] - } - if (isGroup) { - if (visibleGroupList.length) { - return renderOptgroup() - } - } else { - if (visibleOptionList.length) { - return renderOption(visibleOptionList) - } - } - return [ - h('div', { - class: 'vxe-select--empty-placeholder' - }, props.emptyText || GlobalConfig.i18n('vxe.select.emptyText')) - ] - } - - selectMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $select: $xeselect, $event: evnt }, params)) - }, - isPanelVisible () { - return reactData.visiblePanel - }, - togglePanel () { - if (reactData.visiblePanel) { - hideOptionPanel() - } else { - showOptionPanel() - } - return nextTick() - }, - hidePanel () { - if (reactData.visiblePanel) { - hideOptionPanel() - } - return nextTick() - }, - showPanel () { - if (!reactData.visiblePanel) { - showOptionPanel() - } - return nextTick() - }, - refreshOption, - focus () { - const $input = refInput.value - reactData.isActivated = true - $input.blur() - return nextTick() - }, - blur () { - const $input = refInput.value - $input.blur() - reactData.isActivated = false - return nextTick() - } - } - - Object.assign($xeselect, selectMethods) - - watch(() => reactData.staticOptions, (value) => { - if (value.some((item) => item.options && item.options.length)) { - reactData.fullOptionList = [] - reactData.fullGroupList = value - } else { - reactData.fullGroupList = [] - reactData.fullOptionList = value || [] - } - cacheItemMap() - }) - - watch(() => props.options, (value) => { - reactData.fullGroupList = [] - reactData.fullOptionList = value || [] - cacheItemMap() - }) - - watch(() => props.optionGroups, (value) => { - reactData.fullOptionList = [] - reactData.fullGroupList = value || [] - cacheItemMap() - }) - - onMounted(() => { - nextTick(() => { - const { options, optionGroups } = props - if (optionGroups) { - reactData.fullGroupList = optionGroups - } else if (options) { - reactData.fullOptionList = options - } - cacheItemMap() - }) - GlobalEvent.on($xeselect, 'mousewheel', handleGlobalMousewheelEvent) - GlobalEvent.on($xeselect, 'mousedown', handleGlobalMousedownEvent) - GlobalEvent.on($xeselect, 'keydown', handleGlobalKeydownEvent) - GlobalEvent.on($xeselect, 'blur', handleGlobalBlurEvent) - }) - - onUnmounted(() => { - GlobalEvent.off($xeselect, 'mousewheel') - GlobalEvent.off($xeselect, 'mousedown') - GlobalEvent.off($xeselect, 'keydown') - GlobalEvent.off($xeselect, 'blur') - }) - - const renderVN = () => { - const { className, popupClassName, transfer, disabled, loading, filterable } = props - const { inited, isActivated, visiblePanel } = reactData - const vSize = computeSize.value - const selectLabel = computeSelectLabel.value - const defaultSlot = slots.default - const headerSlot = slots.header - const footerSlot = slots.footer - const prefixSlot = slots.prefix - return h('div', { - ref: refElem, - class: ['vxe-select', className ? (XEUtils.isFunction(className) ? className({ $select: $xeselect }) : className) : '', { - [`size--${vSize}`]: vSize, - 'is--visivle': visiblePanel, - 'is--disabled': disabled, - 'is--filter': filterable, - 'is--loading': loading, - 'is--active': isActivated - }] - }, [ - h('div', { - class: 'vxe-select-slots', - ref: 'hideOption' - }, defaultSlot ? defaultSlot({}) : []), - h(VxeInputComponent, { - ref: refInput, - clearable: props.clearable, - placeholder: props.placeholder, - readonly: true, - disabled: disabled, - type: 'text', - prefixIcon: props.prefixIcon, - suffixIcon: loading ? GlobalConfig.icon.SELECT_LOADED : (visiblePanel ? GlobalConfig.icon.SELECT_OPEN : GlobalConfig.icon.SELECT_CLOSE), - modelValue: selectLabel, - onClear: clearEvent, - onClick: togglePanelEvent, - onFocus: focusEvent, - onBlur: blurEvent, - onSuffixClick: togglePanelEvent - }, prefixSlot ? { - prefix: () => prefixSlot({}) - } : {}), - h(Teleport, { - to: 'body', - disabled: transfer ? !inited : true - }, [ - h('div', { - ref: refOptionPanel, - class: ['vxe-table--ignore-clear vxe-select--panel', popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $select: $xeselect }) : popupClassName) : '', { - [`size--${vSize}`]: vSize, - 'is--transfer': transfer, - 'animat--leave': !loading && reactData.animatVisible, - 'animat--enter': !loading && visiblePanel - }], - placement: reactData.panelPlacement, - style: reactData.panelStyle - }, inited ? [ - filterable ? h('div', { - class: 'vxe-select--panel-search' - }, [ - h(VxeInputComponent, { - ref: refInpSearch, - class: 'vxe-select-search--input', - modelValue: reactData.searchValue, - clearable: true, - placeholder: GlobalConfig.i18n('vxe.select.search'), - prefixIcon: GlobalConfig.icon.INPUT_SEARCH, - 'onUpdate:modelValue': modelSearchEvent, - onFocus: focusSearchEvent, - onKeydown: keydownSearchEvent, - onChange: triggerSearchEvent, - onSearch: triggerSearchEvent - }) - ]) : createCommentVNode(), - h('div', { - class: 'vxe-select--panel-wrapper' - }, [ - headerSlot ? h('div', { - class: 'vxe-select--panel-header' - }, headerSlot({})) : createCommentVNode(), - h('div', { - class: 'vxe-select--panel-body' - }, [ - h('div', { - ref: refOptionWrapper, - class: 'vxe-select-option--wrapper' - }, renderOpts()) - ]), - footerSlot ? h('div', { - class: 'vxe-select--panel-footer' - }, footerSlot({})) : createCommentVNode() - ]) - ] : []) - ]) - ]) - } - - $xeselect.renderVN = renderVN - - provide('$xeselect', $xeselect) - - return $xeselect - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/select/src/util.ts b/packages/select/src/util.ts deleted file mode 100644 index 8443ddefe3..0000000000 --- a/packages/select/src/util.ts +++ /dev/null @@ -1,47 +0,0 @@ -import { watch } from 'vue' -import XEUtils from 'xe-utils' -import { OptionInfo } from './optionInfo' - -import { VxeSelectConstructor } from '../../../types/all' - -export interface XEOptionProvide { - option: OptionInfo; -} - -export function isOption (option: any) { - return option instanceof OptionInfo -} - -export function createOption ($xeselect: VxeSelectConstructor, _vm: any) { - return isOption(_vm) ? _vm : new OptionInfo($xeselect, _vm) -} - -export function watchOption (props: any, option: OptionInfo) { - Object.keys(props).forEach(name => { - watch(() => props[name], (value: any) => { - option.update(name, value) - }) - }) -} - -export function assemOption ($xeselect: VxeSelectConstructor, el: HTMLDivElement, option: OptionInfo, optgroup?: XEOptionProvide | null) { - const { reactData } = $xeselect - const { staticOptions } = reactData - const parentElem = el.parentNode - const parentOption = optgroup ? optgroup.option : null - const parentCols = parentOption ? parentOption.options : staticOptions - if (parentElem && parentCols) { - parentCols.splice(XEUtils.arrayIndexOf(parentElem.children, el), 0, option) - reactData.staticOptions = staticOptions.slice(0) - } -} - -export function destroyOption ($xeselect: VxeSelectConstructor, option: OptionInfo) { - const { reactData } = $xeselect - const { staticOptions } = reactData - const matchObj = XEUtils.findTree(staticOptions, (item) => item.id === option.id, { children: 'options' }) - if (matchObj) { - matchObj.items.splice(matchObj.index, 1) - } - reactData.staticOptions = staticOptions.slice(0) -} diff --git a/packages/switch/index.d.ts b/packages/switch/index.d.ts deleted file mode 100644 index 995335c7c6..0000000000 --- a/packages/switch/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeSwitch } from '../../types/switch' - -export * from '../../types/switch' -export default VxeSwitch diff --git a/packages/switch/index.ts b/packages/switch/index.ts deleted file mode 100644 index fc877fa2f9..0000000000 --- a/packages/switch/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeSwitchComponent from './src/switch' -import { dynamicApp } from '../dynamics' - -export const VxeSwitch = Object.assign(VxeSwitchComponent, { - install: function (app: App) { - app.component(VxeSwitchComponent.name, VxeSwitchComponent) - } -}) - -export const Switch = VxeSwitch - -dynamicApp.component(VxeSwitchComponent.name, VxeSwitchComponent) - -export default VxeSwitch diff --git a/packages/switch/src/switch.ts b/packages/switch/src/switch.ts deleted file mode 100644 index 959f20869d..0000000000 --- a/packages/switch/src/switch.ts +++ /dev/null @@ -1,175 +0,0 @@ -import { defineComponent, h, ref, Ref, computed, reactive, nextTick, createCommentVNode, PropType, inject } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' -import { getFuncText } from '../../tools/utils' - -import { VxeSwitchPropTypes, VxeSwitchConstructor, VxeSwitchEmits, SwitchReactData, SwitchMethods, VxeFormConstructor, VxeFormPrivateMethods, VxeFormDefines } from '../../../types/all' - -export default defineComponent({ - name: 'VxeSwitch', - props: { - modelValue: [String, Number, Boolean] as PropType, - disabled: Boolean as PropType, - size: { type: String as PropType, default: () => GlobalConfig.switch.size || GlobalConfig.size }, - openLabel: String as PropType, - closeLabel: String as PropType, - openValue: { type: [String, Number, Boolean] as PropType, default: true }, - closeValue: { type: [String, Number, Boolean] as PropType, default: false }, - openIcon: String as PropType, - closeIcon: String as PropType, - openActiveIcon: String as PropType, - closeActiveIcon: String as PropType - }, - emits: [ - 'update:modelValue', - 'change', - 'focus', - 'blur' - ] as VxeSwitchEmits, - setup (props, context) { - const { emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - isActivated: false, - hasAnimat: false, - offsetLeft: 0 - }) - - const $xeswitch = { - xID, - props, - context, - reactData - } as unknown as VxeSwitchConstructor - - const refButton = ref() as Ref - - let switchMethods = {} as SwitchMethods - - const computeOnShowLabel = computed(() => { - return getFuncText(props.openLabel) - }) - - const computeOffShowLabel = computed(() => { - return getFuncText(props.closeLabel) - }) - - const computeIsChecked = computed(() => { - return props.modelValue === props.openValue - }) - - let _atimeout: any - const clickEvent = (evnt: Event) => { - if (!props.disabled) { - const isChecked = computeIsChecked.value - clearTimeout(_atimeout) - const value = isChecked ? props.closeValue : props.openValue - reactData.hasAnimat = true - emit('update:modelValue', value) - switchMethods.dispatchEvent('change', { value }, evnt) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, value) - } - _atimeout = setTimeout(() => { - reactData.hasAnimat = false - }, 400) - } - } - - const focusEvent = (evnt: Event) => { - reactData.isActivated = true - switchMethods.dispatchEvent('focus', { value: props.modelValue }, evnt) - } - - const blurEvent = (evnt: Event) => { - reactData.isActivated = false - switchMethods.dispatchEvent('blur', { value: props.modelValue }, evnt) - } - - switchMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $switch: $xeswitch, $event: evnt }, params)) - }, - focus () { - const btnElem = refButton.value - reactData.isActivated = true - btnElem.focus() - return nextTick() - }, - blur () { - const btnElem = refButton.value - btnElem.blur() - reactData.isActivated = false - return nextTick() - } - } - - Object.assign($xeswitch, switchMethods) - - const renderVN = () => { - const { disabled, openIcon, closeIcon, openActiveIcon, closeActiveIcon } = props - const isChecked = computeIsChecked.value - const vSize = computeSize.value - const onShowLabel = computeOnShowLabel.value - const offShowLabel = computeOffShowLabel.value - return h('div', { - class: ['vxe-switch', isChecked ? 'is--on' : 'is--off', { - [`size--${vSize}`]: vSize, - 'is--disabled': disabled, - 'is--animat': reactData.hasAnimat - }] - }, [ - h('button', { - ref: refButton, - class: 'vxe-switch--button', - type: 'button', - disabled, - onClick: clickEvent, - onFocus: focusEvent, - onBlur: blurEvent - }, [ - h('span', { - class: 'vxe-switch--label vxe-switch--label-on' - }, [ - openIcon ? h('i', { - class: ['vxe-switch--label-icon', openIcon] - }) : createCommentVNode(), - onShowLabel - ]), - h('span', { - class: 'vxe-switch--label vxe-switch--label-off' - }, [ - closeIcon ? h('i', { - class: ['vxe-switch--label-icon', closeIcon] - }) : createCommentVNode(), - offShowLabel - ]), - h('span', { - class: 'vxe-switch--icon' - }, openActiveIcon || closeActiveIcon - ? [ - h('i', { - class: isChecked ? openActiveIcon : closeActiveIcon - }) - ] - : []) - ]) - ]) - } - - $xeswitch.renderVN = renderVN - - return $xeswitch - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/table/index.d.ts b/packages/table/index.d.ts deleted file mode 100644 index 6e12fe45fa..0000000000 --- a/packages/table/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTable } from '../../types/table' - -export * from '../../types/table' -export default VxeTable diff --git a/packages/table/index.ts b/packages/table/index.ts index 0e60358846..8701da6f33 100644 --- a/packages/table/index.ts +++ b/packages/table/index.ts @@ -1,15 +1,24 @@ import { App } from 'vue' +import { VxeUI } from '../ui' import VxeTableComponent from './src/table' -import { dynamicApp } from '../dynamics' +import './module/filter/hook' +import './module/menu/hook' +import './module/edit/hook' +import './module/export/hook' +import './module/keyboard/hook' +import './module/validator/hook' +import './module/custom/hook' +import './render' -export const VxeTable = Object.assign(VxeTableComponent, { - install: function (app: App) { - app.component(VxeTableComponent.name, VxeTableComponent) +export const VxeTable = Object.assign({}, VxeTableComponent, { + install (app: App) { + app.component(VxeTableComponent.name as string, VxeTableComponent) } }) -export const Table = VxeTable - -dynamicApp.component(VxeTableComponent.name, VxeTableComponent) +if (VxeUI.dynamicApp) { + VxeUI.dynamicApp.component(VxeTableComponent.name as string, VxeTableComponent) +} +export const Table = VxeTable export default VxeTable diff --git a/packages/custom/src/hook.ts b/packages/table/module/custom/hook.ts similarity index 52% rename from packages/custom/src/hook.ts rename to packages/table/module/custom/hook.ts index 08c374e17d..d1a4038dd1 100644 --- a/packages/custom/src/hook.ts +++ b/packages/table/module/custom/hook.ts @@ -1,41 +1,51 @@ import { nextTick } from 'vue' +import { VxeUI } from '../../../ui' +import XEUtils from 'xe-utils' -import { VxeGlobalHooksHandles, TableCustomMethods, TableCustomPrivateMethods } from '../../../types/all' +import type { TableCustomMethods, TableCustomPrivateMethods, VxeColumnPropTypes, VxeTableDefines } from '../../../../types' const tableCustomMethodKeys: (keyof TableCustomMethods)[] = ['openCustom', 'closeCustom'] -const customHook: VxeGlobalHooksHandles.HookOptions = { - setupTable ($xetable) { - const { reactData, internalData } = $xetable - const { computeCustomOpts } = $xetable.getComputeMaps() - const { refTableHeader, refTableBody, refTableCustom } = $xetable.getRefMaps() +VxeUI.hooks.add('tableCustomModule', { + setupTable ($xeTable) { + const { reactData, internalData } = $xeTable + const { computeCustomOpts } = $xeTable.getComputeMaps() + const { refElem } = $xeTable.getRefMaps() - const $xegrid = $xetable.xegrid + const $xeGrid = $xeTable.xegrid const calcMaxHeight = () => { const { customStore } = reactData - const tableHeader = refTableHeader.value - const tableBody = refTableBody.value - const tableCustom = refTableCustom.value - const customWrapperElem = tableCustom ? tableCustom.$el as HTMLDivElement : null - const headElem = tableHeader.$el as HTMLDivElement - const bodyElem = tableBody.$el as HTMLDivElement + const el = refElem.value // 判断面板不能大于表格高度 let tableHeight = 0 - if (headElem) { - tableHeight += headElem.clientHeight + if (el) { + tableHeight = el.clientHeight - 30 } - if (bodyElem) { - tableHeight += bodyElem.clientHeight - } - customStore.maxHeight = Math.max(0, customWrapperElem ? Math.min(customWrapperElem.clientHeight, tableHeight - 80) : 0) + customStore.maxHeight = Math.max(4, tableHeight) } const openCustom = () => { const { initStore, customStore } = reactData + const { collectColumn } = internalData + const sortMaps: Record = {} + const fixedMaps: Record = {} + const visibleMaps: Record = {} + XEUtils.eachTree(collectColumn, column => { + const colid = column.getKey() + column.renderFixed = column.fixed + column.renderVisible = column.visible + column.renderResizeWidth = column.renderWidth + sortMaps[colid] = column.renderSortNumber + fixedMaps[colid] = column.fixed + visibleMaps[colid] = column.visible + }, { children: 'children' }) + customStore.oldSortMaps = sortMaps + customStore.oldFixedMaps = fixedMaps + customStore.oldVisibleMaps = visibleMaps + reactData.customColumnList = collectColumn.slice(0) customStore.visible = true initStore.custom = true - reactData.customColumnList = internalData.collectColumn.slice(0) checkCustomStatus() calcMaxHeight() return nextTick().then(() => calcMaxHeight()) @@ -47,7 +57,7 @@ const customHook: VxeGlobalHooksHandles.HookOptions = { if (customStore.visible) { customStore.visible = false if (!customOpts.immediate) { - $xetable.handleCustom() + $xeTable.handleCustom() } } return nextTick() @@ -63,12 +73,12 @@ const customHook: VxeGlobalHooksHandles.HookOptions = { const { collectColumn } = internalData const customOpts = computeCustomOpts.value const { checkMethod } = customOpts - customStore.isAll = collectColumn.every((column) => (checkMethod ? !checkMethod({ column }) : false) || column.visible) - customStore.isIndeterminate = !customStore.isAll && collectColumn.some((column) => (!checkMethod || checkMethod({ column })) && (column.visible || column.halfVisible)) + customStore.isAll = collectColumn.every((column) => (checkMethod ? !checkMethod({ column }) : false) || column.renderVisible) + customStore.isIndeterminate = !customStore.isAll && collectColumn.some((column) => (!checkMethod || checkMethod({ column })) && (column.renderVisible || column.halfVisible)) } - const emitCustomEvent = (type: string, evnt: Event) => { - const comp = $xegrid || $xetable + const emitCustomEvent = (type: VxeTableDefines.CustomType, evnt: Event) => { + const comp = $xeGrid || $xeTable comp.dispatchEvent('custom', { type }, evnt) } @@ -76,7 +86,7 @@ const customHook: VxeGlobalHooksHandles.HookOptions = { checkCustomStatus, emitCustomEvent, triggerCustomEvent (evnt) { - const { customStore } = $xetable.reactData + const { customStore } = $xeTable.reactData if (customStore.visible) { closeCustom() emitCustomEvent('close', evnt) @@ -91,25 +101,23 @@ const customHook: VxeGlobalHooksHandles.HookOptions = { if (!customStore.visible) { customStore.activeBtn = true customStore.btnEl = evnt.target as HTMLDivElement - $xetable.openCustom() - $xetable.emitCustomEvent('open', evnt) + $xeTable.openCustom() + $xeTable.emitCustomEvent('open', evnt) } }, - customColseEvent (evnt) { + customCloseEvent (evnt) { const { customStore } = reactData if (customStore.visible) { customStore.activeBtn = false - $xetable.closeCustom() - $xetable.emitCustomEvent('close', evnt) + $xeTable.closeCustom() + $xeTable.emitCustomEvent('close', evnt) } } } return { ...customMethods, ...customPrivateMethods } }, - setupGrid ($xegrid) { - return $xegrid.extendTableMethods(tableCustomMethodKeys) + setupGrid ($xeGrid) { + return $xeGrid.extendTableMethods(tableCustomMethodKeys) } -} - -export default customHook +}) diff --git a/packages/table/module/custom/panel.ts b/packages/table/module/custom/panel.ts new file mode 100644 index 0000000000..d6937c351e --- /dev/null +++ b/packages/table/module/custom/panel.ts @@ -0,0 +1,775 @@ +import { defineComponent, h, inject, ref, Ref, VNode, PropType, resolveComponent, TransitionGroup, createCommentVNode } from 'vue' +import { VxeUI } from '../../../ui' +import { formatText } from '../../../ui/src/utils' +import { addClass, removeClass } from '../../../ui/src/dom' +import XEUtils from 'xe-utils' + +import type { VxeTableDefines, VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeColumnPropTypes, VxeModalComponent, VxeButtonComponent, VxeRadioGroupComponent, VxeTooltipComponent, VxeInputComponent } from '../../../../types' + +const { getI18n, getIcon } = VxeUI + +export default defineComponent({ + name: 'TableCustomPanel', + props: { + customStore: { + type: Object as PropType, + default: () => ({}) + } + }, + setup (props) { + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) + + const { props: tableProps, reactData } = $xeTable + const { computeCustomOpts, computeColumnOpts, computeIsMaxFixedColumn } = $xeTable.getComputeMaps() + + const refElem = ref() as Ref + const bodyElemRef = ref() as Ref + const dragHintElemRef = ref() as Ref + + const dragColumn = ref() + + let prevDropTrEl: any + + const handleWrapperMouseenterEvent = (evnt: Event) => { + const { customStore } = props + customStore.activeWrapper = true + $xeTable.customOpenEvent(evnt) + } + + const handleWrapperMouseleaveEvent = (evnt: Event) => { + const { customStore } = props + customStore.activeWrapper = false + setTimeout(() => { + if (!customStore.activeBtn && !customStore.activeWrapper) { + $xeTable.customCloseEvent(evnt) + } + }, 300) + } + + const handleSaveStore = (type: 'confirm' | 'reset') => { + const { id } = tableProps + const customOpts = computeCustomOpts.value + const { storage, updateStore } = customOpts + if (storage && id && updateStore) { + updateStore({ + id, + type, + storeData: $xeTable.getCustomStoreData() + }) + } + } + + const confirmCustomEvent = (evnt: Event) => { + const { customColumnList } = reactData + const customOpts = computeCustomOpts.value + const { allowVisible, allowSort, allowFixed, allowResizable } = customOpts + XEUtils.eachTree(customColumnList, (column, index, items, path, parent) => { + if (!parent) { + if (allowSort) { + const sortIndex = index + 1 + column.renderSortNumber = sortIndex + } + if (allowFixed) { + column.fixed = column.renderFixed + } + } + if (allowResizable) { + if (column.renderVisible && (!column.children || column.children.length)) { + if (column.renderResizeWidth !== column.renderWidth) { + column.resizeWidth = column.renderResizeWidth + } + } + } + if (allowVisible) { + column.visible = column.renderVisible + } + }) + $xeTable.closeCustom() + $xeTable.emitCustomEvent('confirm', evnt) + handleSaveStore('confirm') + } + + const cancelCustomEvent = (evnt: Event) => { + const { customStore } = props + const { customColumnList } = reactData + const { oldSortMaps, oldFixedMaps, oldVisibleMaps } = customStore + const customOpts = computeCustomOpts.value + const { allowVisible, allowSort, allowFixed, allowResizable } = customOpts + XEUtils.eachTree(customColumnList, column => { + const colid = column.getKey() + const visible = !!oldVisibleMaps[colid] + const fixed = oldFixedMaps[colid] || '' + if (allowVisible) { + column.renderVisible = visible + column.visible = visible + } + if (allowFixed) { + column.renderFixed = fixed + column.fixed = fixed + } + if (allowSort) { + column.renderSortNumber = oldSortMaps[colid] || 0 + } + if (allowResizable) { + column.renderResizeWidth = column.renderWidth + } + }, { children: 'children' }) + $xeTable.closeCustom() + $xeTable.emitCustomEvent('cancel', evnt) + } + + const handleResetCustomEvent = (evnt: Event) => { + $xeTable.resetColumn(true) + $xeTable.closeCustom() + $xeTable.emitCustomEvent('reset', evnt) + handleSaveStore('reset') + } + + const resetCustomEvent = (evnt: Event) => { + if (VxeUI.modal) { + VxeUI.modal.confirm({ + content: getI18n('vxe.custom.cstmConfirmRestore'), + className: 'vxe-table--ignore-clear', + escClosable: true + }).then(type => { + if (type === 'confirm') { + handleResetCustomEvent(evnt) + } + }) + } else { + handleResetCustomEvent(evnt) + } + } + + const handleOptionCheck = (column: VxeTableDefines.ColumnInfo) => { + const { customColumnList } = reactData + const matchObj = XEUtils.findTree(customColumnList, item => item === column) + if (matchObj && matchObj.parent) { + const { parent } = matchObj + if (parent.children && parent.children.length) { + parent.renderVisible = parent.children.every((column) => column.renderVisible) + parent.halfVisible = !parent.renderVisible && parent.children.some((column) => column.renderVisible || column.halfVisible) + handleOptionCheck(parent) + } + } + } + + const changeCheckboxOption = (column: VxeTableDefines.ColumnInfo) => { + const isChecked = !column.renderVisible + const customOpts = computeCustomOpts.value + XEUtils.eachTree([column], (item) => { + item.renderVisible = isChecked + item.halfVisible = false + }) + handleOptionCheck(column) + if (customOpts.immediate) { + $xeTable.handleCustom() + } + $xeTable.checkCustomStatus() + } + + const changeFixedOption = (column: VxeTableDefines.ColumnInfo, colFixed: VxeColumnPropTypes.Fixed) => { + const isMaxFixedColumn = computeIsMaxFixedColumn.value + if (column.renderFixed === colFixed) { + column.renderFixed = '' + // $xeTable.clearColumnFixed(column) + } else { + if (!isMaxFixedColumn || column.renderFixed) { + column.renderFixed = colFixed + // $xeTable.setColumnFixed(column, colFixed) + } + } + } + + // const changePopupFixedOption = () => { + // const isMaxFixedColumn = computeIsMaxFixedColumn.value + // if (!isMaxFixedColumn) { + // // $xeTable.setColumnFixed(column, column.fixed) + // } + // } + + const allCustomEvent = () => { + const { customStore } = props + const { customColumnList } = reactData + const customOpts = computeCustomOpts.value + const { checkMethod } = customOpts + const isAll = !customStore.isAll + XEUtils.eachTree(customColumnList, (column) => { + if (!checkMethod || checkMethod({ column })) { + column.renderVisible = isAll + column.halfVisible = false + } + }) + customStore.isAll = isAll + $xeTable.checkCustomStatus() + } + + const sortMousedownEvent = (evnt: DragEvent) => { + const btnEl = evnt.currentTarget as HTMLElement + const tdEl = btnEl.parentNode as HTMLElement + const trEl = tdEl.parentNode as HTMLElement + const colid = trEl.getAttribute('colid') + const column = $xeTable.getColumnById(colid) + trEl.draggable = true + dragColumn.value = column + addClass(trEl, 'active--drag-origin') + } + + const sortMouseupEvent = (evnt: DragEvent) => { + const btnEl = evnt.currentTarget as HTMLElement + const tdEl = btnEl.parentNode as HTMLElement + const trEl = tdEl.parentNode as HTMLElement + const dragHintEl = dragHintElemRef.value + trEl.draggable = false + dragColumn.value = null + removeClass(trEl, 'active--drag-origin') + if (dragHintEl) { + dragHintEl.style.display = '' + } + } + + const sortDragstartEvent = (evnt: DragEvent) => { + const img = new Image() + if (evnt.dataTransfer) { + evnt.dataTransfer.setDragImage(img, 0, 0) + } + } + + const sortDragendEvent = (evnt: DragEvent) => { + const { customColumnList } = reactData + const trEl = evnt.currentTarget as HTMLElement + const dragHintEl = dragHintElemRef.value + if (prevDropTrEl) { + // 判断是否有拖动 + if (prevDropTrEl !== trEl) { + const dragOffset = prevDropTrEl.getAttribute('drag-pos') + const colid = trEl.getAttribute('colid') + const column = $xeTable.getColumnById(colid) + if (!column) { + return + } + const cIndex = XEUtils.findIndexOf(customColumnList, item => item.id === column.id) + const targetColid = prevDropTrEl.getAttribute('colid') + const targetColumn = $xeTable.getColumnById(targetColid) + if (!targetColumn) { + return + } + // 移出源位置 + customColumnList.splice(cIndex, 1) + const tcIndex = XEUtils.findIndexOf(customColumnList, item => item.id === targetColumn.id) + // 插新位置 + customColumnList.splice(tcIndex + (dragOffset === 'bottom' ? 1 : 0), 0, column) + } + prevDropTrEl.draggable = false + prevDropTrEl.removeAttribute('drag-pos') + removeClass(prevDropTrEl, 'active--drag-target') + } + dragColumn.value = null + trEl.draggable = false + trEl.removeAttribute('drag-pos') + if (dragHintEl) { + dragHintEl.style.display = '' + } + removeClass(trEl, 'active--drag-target') + removeClass(trEl, 'active--drag-origin') + } + + const sortDragoverEvent = (evnt: DragEvent) => { + const trEl = evnt.currentTarget as HTMLElement + if (prevDropTrEl !== trEl) { + removeClass(prevDropTrEl, 'active--drag-target') + } + const colid = trEl.getAttribute('colid') + const column = $xeTable.getColumnById(colid) + // 是否移入有效元行 + if (column && column.level === 1) { + evnt.preventDefault() + const offsetY = evnt.clientY - trEl.getBoundingClientRect().y + const dragOffset = offsetY < trEl.clientHeight / 2 ? 'top' : 'bottom' + addClass(trEl, 'active--drag-target') + trEl.setAttribute('drag-pos', dragOffset) + prevDropTrEl = trEl + } + updateDropHint(evnt) + } + + const updateDropHint = (evnt: DragEvent) => { + const dragHintEl = dragHintElemRef.value + const bodyEl = bodyElemRef.value + if (!bodyEl) { + return + } + if (dragHintEl) { + const wrapperEl = bodyEl.parentNode as HTMLElement + const wrapperRect = wrapperEl.getBoundingClientRect() + dragHintEl.style.display = 'block' + dragHintEl.style.top = `${Math.min(wrapperEl.clientHeight - wrapperEl.scrollTop - dragHintEl.clientHeight, evnt.clientY - wrapperRect.y)}px` + dragHintEl.style.left = `${Math.min(wrapperEl.clientWidth - wrapperEl.scrollLeft - dragHintEl.clientWidth - 16, evnt.clientX - wrapperRect.x)}px` + } + } + + const renderSimplePanel = () => { + const { customStore } = props + const { customColumnList } = reactData + const customOpts = computeCustomOpts.value + const { maxHeight } = customStore + const { checkMethod, visibleMethod, allowVisible, allowSort, allowFixed, trigger, placement } = customOpts + const isMaxFixedColumn = computeIsMaxFixedColumn.value + const colVNs: VNode[] = [] + const customWrapperOns: any = {} + // hover 触发 + if (trigger === 'hover') { + customWrapperOns.onMouseenter = handleWrapperMouseenterEvent + customWrapperOns.onMouseleave = handleWrapperMouseleaveEvent + } + XEUtils.eachTree(customColumnList, (column, index, items, path, parent) => { + const isVisible = visibleMethod ? visibleMethod({ column }) : true + if (isVisible) { + const isChecked = column.renderVisible + const isIndeterminate = column.halfVisible + const isColGroup = column.children && column.children.length + const colTitle = formatText(column.getTitle(), 1) + const isDisabled = checkMethod ? !checkMethod({ column }) : false + colVNs.push( + h('li', { + key: column.id, + colid: column.id, + class: ['vxe-table-custom--option', `level--${column.level}`, { + 'is--group': isColGroup + }], + onDragstart: sortDragstartEvent, + onDragend: sortDragendEvent, + onDragover: sortDragoverEvent + }, [ + allowVisible + ? h('div', { + class: ['vxe-table-custom--checkbox-option', { + 'is--checked': isChecked, + 'is--indeterminate': isIndeterminate, + 'is--disabled': isDisabled + }], + title: getI18n('vxe.custom.setting.colVisible'), + onClick: () => { + if (!isDisabled) { + changeCheckboxOption(column) + } + } + }, [ + h('span', { + class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] + }) + ]) + : createCommentVNode(), + allowSort && column.level === 1 + ? h('div', { + class: 'vxe-table-custom--sort-option' + }, [ + h('span', { + class: 'vxe-table-custom--sort-btn', + title: getI18n('vxe.custom.setting.sortHelpTip'), + onMousedown: sortMousedownEvent, + onMouseup: sortMouseupEvent + }, [ + h('i', { + class: getIcon().TABLE_CUSTOM_SORT + }) + ]) + ]) + : createCommentVNode(), + h('div', { + class: 'vxe-table-custom--checkbox-label', + title: colTitle + }, colTitle), + !parent && allowFixed + ? h('div', { + class: 'vxe-table-custom--fixed-option' + }, [ + h('span', { + class: ['vxe-table-custom--fixed-left-option', column.renderFixed === 'left' ? getIcon().TOOLBAR_TOOLS_FIXED_LEFT_ACTIVE : getIcon().TOOLBAR_TOOLS_FIXED_LEFT, { + 'is--checked': column.renderFixed === 'left', + 'is--disabled': isMaxFixedColumn && !column.renderFixed + }], + title: getI18n(column.renderFixed === 'left' ? 'vxe.toolbar.cancelFixed' : 'vxe.toolbar.fixedLeft'), + onClick: () => { + changeFixedOption(column, 'left') + } + }), + h('span', { + class: ['vxe-table-custom--fixed-right-option', column.renderFixed === 'right' ? getIcon().TOOLBAR_TOOLS_FIXED_RIGHT_ACTIVE : getIcon().TOOLBAR_TOOLS_FIXED_RIGHT, { + 'is--checked': column.renderFixed === 'right', + 'is--disabled': isMaxFixedColumn && !column.renderFixed + }], + title: getI18n(column.renderFixed === 'right' ? 'vxe.toolbar.cancelFixed' : 'vxe.toolbar.fixedRight'), + onClick: () => { + changeFixedOption(column, 'right') + } + }) + ]) + : createCommentVNode() + ]) + ) + } + }) + const isAllChecked = customStore.isAll + const isAllIndeterminate = customStore.isIndeterminate + return h('div', { + ref: refElem, + key: 'simple', + class: ['vxe-table-custom-wrapper', `placement--${placement}`, { + 'is--active': customStore.visible + }], + style: maxHeight && !['left', 'right'].includes(placement as string) + ? { + maxHeight: `${maxHeight}px` + } + : {} + }, customStore.visible + ? [ + h('ul', { + class: 'vxe-table-custom--header' + }, [ + h('li', { + class: 'vxe-table-custom--option' + }, [ + allowVisible + ? h('div', { + class: ['vxe-table-custom--checkbox-option', { + 'is--checked': isAllChecked, + 'is--indeterminate': isAllIndeterminate + }], + title: getI18n('vxe.table.allTitle'), + onClick: allCustomEvent + }, [ + h('span', { + class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] + }), + h('span', { + class: 'vxe-checkbox--label' + }, getI18n('vxe.toolbar.customAll')) + ]) + : h('span', { + class: 'vxe-checkbox--label' + }, getI18n('vxe.table.customTitle')) + ]) + ]), + h('div', { + ref: bodyElemRef, + class: 'vxe-table-custom--list-wrapper' + }, [ + h(TransitionGroup, { + class: 'vxe-table-custom--body', + name: 'vxe-table-custom--list', + tag: 'ul', + ...customWrapperOns + }, { + default: () => colVNs + }), + h('div', { + ref: dragHintElemRef, + class: 'vxe-table-custom-popup--drag-hint' + }, getI18n('vxe.custom.cstmDragTarget', [dragColumn.value ? dragColumn.value.getTitle() : ''])) + ]), + customOpts.showFooter + ? h('div', { + class: 'vxe-table-custom--footer' + }, [ + h('button', { + class: 'btn--reset', + onClick: resetCustomEvent + }, customOpts.resetButtonText || getI18n('vxe.table.customRestore')), + customOpts.immediate + ? createCommentVNode() + : h('button', { + class: 'btn--cancel', + onClick: cancelCustomEvent + }, customOpts.resetButtonText || getI18n('vxe.table.customCancel')), + h('button', { + class: 'btn--confirm', + onClick: confirmCustomEvent + }, customOpts.confirmButtonText || getI18n('vxe.table.customConfirm')) + ]) + : null + ] + : []) + } + + const renderPopupPanel = () => { + const { customStore } = props + const { customColumnList } = reactData + const customOpts = computeCustomOpts.value + const { allowVisible, allowSort, allowFixed, allowResizable, checkMethod, visibleMethod } = customOpts + const columnOpts = computeColumnOpts.value + const isMaxFixedColumn = computeIsMaxFixedColumn.value + const trVNs: VNode[] = [] + XEUtils.eachTree(customColumnList, (column, index, items, path, parent) => { + const isVisible = visibleMethod ? visibleMethod({ column }) : true + if (isVisible) { + const isChecked = column.renderVisible + const isIndeterminate = column.halfVisible + const colTitle = formatText(column.getTitle(), 1) + const isColGroup = column.children && column.children.length + const isDisabled = checkMethod ? !checkMethod({ column }) : false + trVNs.push( + h('tr', { + key: column.id, + colid: column.id, + class: [`vxe-table-custom-popup--row level--${column.level}`, { + 'is--group': isColGroup + }], + onDragstart: sortDragstartEvent, + onDragend: sortDragendEvent, + onDragover: sortDragoverEvent + }, [ + allowVisible + ? h('td', { + class: 'vxe-table-custom-popup--column-item col--visible' + }, [ + h('div', { + class: ['vxe-table-custom--checkbox-option', { + 'is--checked': isChecked, + 'is--indeterminate': isIndeterminate, + 'is--disabled': isDisabled + }], + title: getI18n('vxe.custom.setting.colVisible'), + onClick: () => { + if (!isDisabled) { + changeCheckboxOption(column) + } + } + }, [ + h('span', { + class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] + }) + ]) + ]) + : createCommentVNode(), + allowSort + ? h('td', { + class: 'vxe-table-custom-popup--column-item col--sort' + }, [ + column.level === 1 + ? h('span', { + class: 'vxe-table-custom-popup--column-sort-btn', + title: getI18n('vxe.custom.setting.sortHelpTip'), + onMousedown: sortMousedownEvent, + onMouseup: sortMouseupEvent + }, [ + h('i', { + class: getIcon().TABLE_CUSTOM_SORT + }) + ]) + : h('span', '-') + ]) + : createCommentVNode(), + h('td', { + class: 'vxe-table-custom-popup--column-item col--name' + }, [ + h('div', { + class: 'vxe-table-custom-popup--name', + title: colTitle + }, colTitle) + ]), + allowResizable + ? h('td', { + class: 'vxe-table-custom-popup--column-item col--resizable' + }, [ + !isChecked || (column.children && column.children.length) + ? h('span', '-') + : h(resolveComponent('vxe-input') as VxeInputComponent, { + type: 'integer', + min: 40, + modelValue: column.renderResizeWidth, + 'onUpdate:modelValue' (value: any) { + column.renderResizeWidth = Math.max(40, Number(value)) + } + }) + ]) + : createCommentVNode(), + allowFixed + ? h('td', { + class: 'vxe-table-custom-popup--column-item col--fixed' + }, [ + parent + ? h('span', '-') + : h(resolveComponent('vxe-radio-group') as VxeRadioGroupComponent, { + modelValue: column.renderFixed || '', + type: 'button', + size: 'mini', + options: [ + { label: getI18n('vxe.custom.setting.fixedLeft'), value: 'left', disabled: isMaxFixedColumn }, + { label: getI18n('vxe.custom.setting.fixedUnset'), value: '' }, + { label: getI18n('vxe.custom.setting.fixedRight'), value: 'right', disabled: isMaxFixedColumn } + ], + 'onUpdate:modelValue' (value: any) { + column.renderFixed = value + } + // onChange () { + // changePopupFixedOption(column) + // } + }) + ]) + : createCommentVNode() + ]) + ) + } + }) + const isAllChecked = customStore.isAll + const isAllIndeterminate = customStore.isIndeterminate + return h(resolveComponent('vxe-modal') as VxeModalComponent, { + key: 'popup', + className: 'vxe-table-custom-popup-wrapper vxe-table--ignore-clear', + modelValue: customStore.visible, + title: getI18n('vxe.custom.cstmTitle'), + width: 700, + minWidth: 700, + height: 400, + minHeight: 400, + mask: true, + lockView: true, + showFooter: true, + resize: true, + escClosable: true, + destroyOnClose: true, + 'onUpdate:modelValue' (value: any) { + customStore.visible = value + } + }, { + default: () => { + return h('div', { + ref: bodyElemRef, + class: 'vxe-table-custom-popup--body' + }, [ + h('div', { + class: 'vxe-table-custom-popup--table-wrapper' + }, [ + h('table', {}, [ + h('colgroup', {}, [ + allowVisible + ? h('col', { + style: { + width: '80px' + } + }) + : createCommentVNode(), + allowSort + ? h('col', { + style: { + width: '80px' + } + }) + : createCommentVNode(), + h('col', { + style: { + minWidth: '120px' + } + }), + allowResizable + ? h('col', { + style: { + width: '140px' + } + }) + : createCommentVNode(), + allowFixed + ? h('col', { + style: { + width: '200px' + } + }) + : createCommentVNode() + ]), + h('thead', {}, [ + h('tr', {}, [ + allowVisible + ? h('th', {}, [ + h('div', { + class: ['vxe-table-custom--checkbox-option', { + 'is--checked': isAllChecked, + 'is--indeterminate': isAllIndeterminate + }], + title: getI18n('vxe.table.allTitle'), + onClick: allCustomEvent + }, [ + h('span', { + class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] + }), + h('span', { + class: 'vxe-checkbox--label' + }, getI18n('vxe.toolbar.customAll')) + ]) + ]) + : createCommentVNode(), + allowSort + ? h('th', {}, [ + h('span', { + class: 'vxe-table-custom-popup--table-sort-help-title' + }, getI18n('vxe.custom.setting.colSort')), + h(resolveComponent('vxe-tooltip') as VxeTooltipComponent, { + enterable: true, + content: getI18n('vxe.custom.setting.sortHelpTip') + }, { + default: () => { + return h('i', { + class: 'vxe-table-custom-popup--table-sort-help-icon vxe-icon-question-circle-fill' + }) + } + }) + ]) + : createCommentVNode(), + h('th', {}, getI18n('vxe.custom.setting.colTitle')), + allowResizable + ? h('th', {}, getI18n('vxe.custom.setting.colResizable')) + : createCommentVNode(), + allowFixed + ? h('th', {}, getI18n('vxe.custom.setting.colFixed', [columnOpts.maxFixedSize || 0])) + : createCommentVNode() + ]) + ]), + h(TransitionGroup, { + class: 'vxe-table-custom--body', + tag: 'tbody', + name: 'vxe-table-custom--list' + }, { + default: () => trVNs + }) + ]) + ]), + h('div', { + ref: dragHintElemRef, + class: 'vxe-table-custom-popup--drag-hint' + }, getI18n('vxe.custom.cstmDragTarget', [dragColumn.value ? dragColumn.value.getTitle() : ''])) + ]) + }, + footer: () => { + return h('div', { + class: 'vxe-table-custom-popup--footer' + }, [ + h(resolveComponent('vxe-button') as VxeButtonComponent, { + content: customOpts.resetButtonText || getI18n('vxe.custom.cstmRestore'), + onClick: resetCustomEvent + }), + h(resolveComponent('vxe-button') as VxeButtonComponent, { + content: customOpts.resetButtonText || getI18n('vxe.custom.cstmCancel'), + onClick: cancelCustomEvent + }), + h(resolveComponent('vxe-button') as VxeButtonComponent, { + status: 'primary', + content: customOpts.confirmButtonText || getI18n('vxe.custom.cstmConfirm'), + onClick: confirmCustomEvent + }) + ]) + } + }) + } + + const renderVN = () => { + const customOpts = computeCustomOpts.value + if (customOpts.mode === 'popup') { + return renderPopupPanel() + } + return renderSimplePanel() + } + + return renderVN + } +}) diff --git a/packages/edit/src/hook.ts b/packages/table/module/edit/hook.ts similarity index 79% rename from packages/edit/src/hook.ts rename to packages/table/module/edit/hook.ts index 0a7045239a..77d143a054 100644 --- a/packages/edit/src/hook.ts +++ b/packages/table/module/edit/hook.ts @@ -1,21 +1,22 @@ import { reactive, nextTick } from 'vue' import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { renderer } from '../../v-x-e-table' -import { isEnableConf } from '../../tools/utils' -import { getCellValue, setCellValue, getRowid } from '../../table/src/util' -import { browse, removeClass, addClass } from '../../tools/dom' -import { warnLog, errLog, getLog } from '../../tools/log' +import { VxeUI } from '../../../ui' +import { isEnableConf } from '../../../ui/src/utils' +import { getCellValue, setCellValue, getRowid } from '../../src/util' +import { browse, removeClass, addClass } from '../../../ui/src/dom' +import { warnLog, errLog } from '../../../ui/src/log' -import { VxeGlobalHooksHandles, TableEditMethods, TableEditPrivateMethods } from '../../../types/all' +import type { TableEditMethods, TableEditPrivateMethods } from '../../../../types' + +const { getConfig, renderer, hooks, getI18n } = VxeUI const tableEditMethodKeys: (keyof TableEditMethods)[] = ['insert', 'insertAt', 'insertNextAt', 'remove', 'removeCheckboxRow', 'removeRadioRow', 'removeCurrentRow', 'getRecordset', 'getInsertRecords', 'getRemoveRecords', 'getUpdateRecords', 'getEditRecord', 'getActiveRecord', 'getSelectedCell', 'clearEdit', 'clearActived', 'clearSelected', 'isEditByRow', 'isActiveByRow', 'setEditRow', 'setActiveRow', 'setEditCell', 'setActiveCell', 'setSelectCell'] -const editHook: VxeGlobalHooksHandles.HookOptions = { - setupTable ($xetable) { - const { props, reactData, internalData } = $xetable - const { refElem } = $xetable.getRefMaps() - const { computeMouseOpts, computeEditOpts, computeCheckboxOpts, computeTreeOpts } = $xetable.getComputeMaps() +hooks.add('tableEditModule', { + setupTable ($xeTable) { + const { props, reactData, internalData } = $xeTable + const { refElem } = $xeTable.getRefMaps() + const { computeMouseOpts, computeEditOpts, computeCheckboxOpts, computeTreeOpts } = $xeTable.getComputeMaps() let editMethods = {} as TableEditMethods let editPrivateMethods = {} as TableEditPrivateMethods @@ -69,11 +70,11 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { const funcName = isAppend ? 'push' : 'unshift' newRecords.forEach(item => { const parentRowId = item[parentField] - const rowid = getRowid($xetable, item) + const rowid = getRowid($xeTable, item) const matchObj = parentRowId ? XEUtils.findTree(tableFullTreeData, item => parentRowId === item[rowField], { children: mapChildrenField }) : null if (matchObj) { const { item: parentRow } = matchObj - const parentRest = fullAllDataRowIdData[getRowid($xetable, parentRow)] + const parentRest = fullAllDataRowIdData[getRowid($xeTable, parentRow)] const parentLevel = parentRest ? parentRest.level : 0 let parentChilds = parentRow[childrenField] let mapChilds = parentRow[mapChildrenField] @@ -89,7 +90,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { fullDataRowIdData[rowid] = rest fullAllDataRowIdData[rowid] = rest } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (parentRowId) { warnLog('vxe.error.unableInsert') } @@ -113,7 +114,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { if (!XEUtils.isArray(records)) { records = [records] } - const newRecords: any[] = reactive($xetable.defineField(records.map((record: any) => Object.assign(treeConfig && transform ? { [mapChildrenField]: [], [childrenField]: [] } : {}, record)))) + const newRecords: any[] = reactive($xeTable.defineField(records.map((record: any) => Object.assign(treeConfig && transform ? { [mapChildrenField]: [], [childrenField]: [] } : {}, record)))) if (XEUtils.eqNull(row)) { // 如果为虚拟树 if (treeConfig && transform) { @@ -152,11 +153,11 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { if (matchMapObj) { const { parent: parentRow } = matchMapObj const parentMapChilds = parentRow ? parentRow[mapChildrenField] : tableFullTreeData - const parentRest = fullAllDataRowIdData[getRowid($xetable, parentRow)] + const parentRest = fullAllDataRowIdData[getRowid($xeTable, parentRow)] const parentLevel = parentRest ? parentRest.level : 0 newRecords.forEach((item, i) => { - const rowid = getRowid($xetable, item) - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + const rowid = getRowid($xeTable, item) + if (process.env.VUE_APP_VXE_ENV === 'development') { if (item[treeOpts.parentField]) { if (parentRow && item[treeOpts.parentField] !== parentRow[rowField]) { errLog('vxe.error.errProp', [`${treeOpts.parentField}=${item[treeOpts.parentField]}`, `${treeOpts.parentField}=${parentRow[rowField]}`]) @@ -189,14 +190,14 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { } } } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.unableInsert') } insertTreeRow(newRecords, true) } } else { if (treeConfig) { - throw new Error(getLog('vxe.error.noTree', ['insert'])) + throw new Error(getI18n('vxe.error.noTree', ['insert'])) } let afIndex = -1 // 如果是可视索引 @@ -205,17 +206,17 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { afIndex = row } } else { - afIndex = $xetable.findRowIndexOf(afterFullData, row) + afIndex = $xeTable.findRowIndexOf(afterFullData, row) } // 如果是插入指定行的下一行 if (isInsertNextRow) { afIndex = Math.min(afterFullData.length, afIndex + 1) } if (afIndex === -1) { - throw new Error(errLog('vxe.error.unableInsert')) + throw new Error(getI18n('vxe.error.unableInsert')) } afterFullData.splice(afIndex, 0, ...newRecords) - tableFullData.splice($xetable.findRowIndexOf(tableFullData, row), 0, ...newRecords) + tableFullData.splice($xeTable.findRowIndexOf(tableFullData, row), 0, ...newRecords) // 刷新单元格合并 mergeList.forEach((mergeItem: any) => { const { row: mergeRowIndex, rowspan: mergeRowspan } = mergeItem @@ -230,23 +231,23 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { } const { insertMaps } = editStore newRecords.forEach(newRow => { - const rowid = getRowid($xetable, newRow) + const rowid = getRowid($xeTable, newRow) insertMaps[rowid] = newRow }) - $xetable.cacheRowMap() - $xetable.updateScrollYStatus() - $xetable.handleTableData(treeConfig && transform) + $xeTable.cacheRowMap() + $xeTable.updateScrollYStatus() + $xeTable.handleTableData(treeConfig && transform) if (!(treeConfig && transform)) { - $xetable.updateAfterDataIndex() + $xeTable.updateAfterDataIndex() } - $xetable.updateFooter() - $xetable.checkSelectionStatus() + $xeTable.updateFooter() + $xeTable.checkSelectionStatus() if (reactData.scrollYLoad) { - $xetable.updateScrollYSpace() + $xeTable.updateScrollYSpace() } return nextTick().then(() => { - $xetable.updateCellAreas() - return $xetable.recalculate() + $xeTable.updateCellAreas() + return $xeTable.recalculate() }).then(() => { return { row: newRecords.length ? newRecords[newRecords.length - 1] : null, @@ -302,8 +303,8 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { } // 如果是新增，则保存记录 rows.forEach((row: any) => { - if (!$xetable.isInsertByRow(row)) { - const rowid = getRowid($xetable, row) + if (!$xeTable.isInsertByRow(row)) { + const rowid = getRowid($xeTable, row) removeMaps[rowid] = row } }) @@ -311,7 +312,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { if (!checkField) { const selectRowMaps = { ...selectCheckboxMaps } rows.forEach((row: any) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (selectRowMaps[rowid]) { delete selectRowMaps[rowid] } @@ -323,34 +324,34 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { rows = delList = tableFullData.slice(0) internalData.tableFullData = [] internalData.afterFullData = [] - $xetable.clearMergeCells() + $xeTable.clearMergeCells() } else { // 如果为虚拟树 if (treeConfig && transform) { rows.forEach((row: any) => { - const rowid = getRowid($xetable, row) - const matchMapObj = XEUtils.findTree(tableFullTreeData, item => rowid === getRowid($xetable, item), { children: mapChildrenField }) + const rowid = getRowid($xeTable, row) + const matchMapObj = XEUtils.findTree(tableFullTreeData, item => rowid === getRowid($xeTable, item), { children: mapChildrenField }) if (matchMapObj) { const rItems = matchMapObj.items.splice(matchMapObj.index, 1) delList.push(rItems[0]) } - const matchObj = XEUtils.findTree(tableFullTreeData, item => rowid === getRowid($xetable, item), { children: childrenField }) + const matchObj = XEUtils.findTree(tableFullTreeData, item => rowid === getRowid($xeTable, item), { children: childrenField }) if (matchObj) { matchObj.items.splice(matchObj.index, 1) } - const afIndex = $xetable.findRowIndexOf(afterFullData, row) + const afIndex = $xeTable.findRowIndexOf(afterFullData, row) if (afIndex > -1) { afterFullData.splice(afIndex, 1) } }) } else { rows.forEach((row: any) => { - const tfIndex = $xetable.findRowIndexOf(tableFullData, row) + const tfIndex = $xeTable.findRowIndexOf(tableFullData, row) if (tfIndex > -1) { const rItems = tableFullData.splice(tfIndex, 1) delList.push(rItems[0]) } - const afIndex = $xetable.findRowIndexOf(afterFullData, row) + const afIndex = $xeTable.findRowIndexOf(afterFullData, row) if (afIndex > -1) { // 刷新单元格合并 mergeList.forEach((mergeItem: any) => { @@ -367,29 +368,29 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { } } // 如果当前行被激活编辑，则清除激活状态 - if (actived.row && $xetable.findRowIndexOf(rows, actived.row) > -1) { + if (actived.row && $xeTable.findRowIndexOf(rows, actived.row) > -1) { editMethods.clearEdit() } // 从新增中移除已删除的数据 rows.forEach((row: any) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (insertMaps[rowid]) { delete insertMaps[rowid] } }) - $xetable.updateFooter() - $xetable.cacheRowMap() - $xetable.handleTableData(treeConfig && transform) + $xeTable.updateFooter() + $xeTable.cacheRowMap() + $xeTable.handleTableData(treeConfig && transform) if (!(treeConfig && transform)) { - $xetable.updateAfterDataIndex() + $xeTable.updateAfterDataIndex() } - $xetable.checkSelectionStatus() + $xeTable.checkSelectionStatus() if (reactData.scrollYLoad) { - $xetable.updateScrollYSpace() + $xeTable.updateScrollYSpace() } return nextTick().then(() => { - $xetable.updateCellAreas() - return $xetable.recalculate() + $xeTable.updateCellAreas() + return $xeTable.recalculate() }).then(() => { return { row: delList.length ? delList[delList.length - 1] : null, rows: delList } }) @@ -398,8 +399,8 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { * 删除复选框选中的数据 */ removeCheckboxRow () { - return editMethods.remove($xetable.getCheckboxRecords()).then((params: any) => { - $xetable.clearCheckboxRow() + return editMethods.remove($xeTable.getCheckboxRecords()).then((params: any) => { + $xeTable.clearCheckboxRow() return params }) }, @@ -407,9 +408,9 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { * 删除单选框选中的数据 */ removeRadioRow () { - const radioRecord = $xetable.getRadioRecord() + const radioRecord = $xeTable.getRadioRecord() return editMethods.remove(radioRecord || []).then((params: any) => { - $xetable.clearRadioRow() + $xeTable.clearRadioRow() return params }) }, @@ -417,9 +418,9 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { * 删除当前行选中的数据 */ removeCurrentRow () { - const currentRecord = $xetable.getCurrentRecord() + const currentRecord = $xeTable.getCurrentRecord() return editMethods.remove(currentRecord || []).then((params: any) => { - $xetable.clearCurrentRow() + $xeTable.clearCurrentRow() return params }) }, @@ -431,7 +432,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { insertRecords: editMethods.getInsertRecords(), removeRecords: editMethods.getRemoveRecords(), updateRecords: editMethods.getUpdateRecords(), - pendingRecords: $xetable.getPendingRecords() + pendingRecords: $xeTable.getPendingRecords() } }, /** @@ -473,14 +474,14 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { if (keepSource) { syncActivedCell() if (treeConfig) { - return XEUtils.filterTree(tableFullData, row => $xetable.isUpdateByRow(row), treeOpts) + return XEUtils.filterTree(tableFullData, row => $xeTable.isUpdateByRow(row), treeOpts) } - return tableFullData.filter((row: any) => $xetable.isUpdateByRow(row)) + return tableFullData.filter((row: any) => $xeTable.isUpdateByRow(row)) } return [] }, getActiveRecord () { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.delFunc', ['getActiveRecord', 'getEditRecord']) } return this.getEditRecord() @@ -490,7 +491,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { const { afterFullData } = internalData const el = refElem.value const { args, row } = editStore.actived - if (args && $xetable.findRowIndexOf(afterFullData, row) > -1 && el.querySelectorAll('.vxe-body--column.col--active').length) { + if (args && $xeTable.findRowIndexOf(afterFullData, row) > -1 && el.querySelectorAll('.vxe-body--column.col--active').length) { return Object.assign({}, args) } return null @@ -508,7 +509,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { }, clearActived (evnt) { // 即将废弃 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.delFunc', ['clearActived', 'clearEdit']) } return this.clearEdit(evnt) @@ -525,19 +526,19 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { actived.args = null actived.row = null actived.column = null - $xetable.updateFooter() - $xetable.dispatchEvent('edit-closed', { + $xeTable.updateFooter() + $xeTable.dispatchEvent('edit-closed', { row, - rowIndex: $xetable.getRowIndex(row), - $rowIndex: $xetable.getVMRowIndex(row), + rowIndex: $xeTable.getRowIndex(row), + $rowIndex: $xeTable.getVMRowIndex(row), column, - columnIndex: $xetable.getColumnIndex(column), - $columnIndex: $xetable.getVMColumnIndex(column) + columnIndex: $xeTable.getColumnIndex(column), + $columnIndex: $xeTable.getVMColumnIndex(column) }, evnt || null) } - if (GlobalConfig.cellVaildMode === 'obsolete') { - if ($xetable.clearValidate) { - return $xetable.clearValidate() + if (getConfig().cellVaildMode === 'obsolete') { + if ($xeTable.clearValidate) { + return $xeTable.clearValidate() } } focused.row = null @@ -556,7 +557,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { return nextTick() }, isActiveByRow (row) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.delFunc', ['isActiveByRow', 'isEditByRow']) } // 即将废弃 @@ -571,7 +572,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { return editStore.actived.row === row }, setActiveRow (row) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.delFunc', ['setActiveRow', 'setEditRow']) } // 即将废弃 @@ -584,12 +585,12 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { const { visibleColumn } = internalData let column: any = XEUtils.find(visibleColumn, column => isEnableConf(column.editRender)) if (fieldOrColumn) { - column = XEUtils.isString(fieldOrColumn) ? $xetable.getColumnByField(fieldOrColumn) : fieldOrColumn + column = XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn } - return $xetable.setEditCell(row, column) + return $xeTable.setEditCell(row, column) }, setActiveCell (row, fieldOrColumn) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.delFunc', ['setActiveCell', 'setEditCell']) } // 即将废弃 @@ -600,18 +601,18 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { */ setEditCell (row, fieldOrColumn) { const { editConfig } = props - const column = XEUtils.isString(fieldOrColumn) ? $xetable.getColumnByField(fieldOrColumn) : fieldOrColumn + const column = XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn if (row && column && isEnableConf(editConfig) && isEnableConf(column.editRender)) { - return $xetable.scrollToRow(row, column).then(() => { - const cell = $xetable.getCell(row, column) + return $xeTable.scrollToRow(row, column).then(() => { + const cell = $xeTable.getCell(row, column) if (cell) { editPrivateMethods.handleActived({ row, - rowIndex: $xetable.getRowIndex(row), + rowIndex: $xeTable.getRowIndex(row), column, - columnIndex: $xetable.getColumnIndex(column), + columnIndex: $xeTable.getColumnIndex(column), cell, - $table: $xetable + $table: $xeTable }) internalData._lastCallTime = Date.now() } @@ -626,19 +627,19 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { setSelectCell (row, fieldOrColumn) { const { tableData } = reactData const editOpts = computeEditOpts.value - const column = XEUtils.isString(fieldOrColumn) ? $xetable.getColumnByField(fieldOrColumn) : fieldOrColumn + const column = XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn if (row && column && editOpts.trigger !== 'manual') { - const rowIndex = $xetable.findRowIndexOf(tableData, row) + const rowIndex = $xeTable.findRowIndexOf(tableData, row) if (rowIndex > -1 && column) { - const cell = $xetable.getCell(row, column) + const cell = $xeTable.getCell(row, column) const params = { row, rowIndex, column, - columnIndex: $xetable.getColumnIndex(column), + columnIndex: $xeTable.getColumnIndex(column), cell } - $xetable.handleSelected(params, {}) + $xeTable.handleSelected(params, {}) } } return nextTick() @@ -657,24 +658,24 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { const { actived, focused } = editStore const { row, column } = params const { editRender } = column - const cell = (params.cell || $xetable.getCell(row, column)) + const cell = (params.cell || $xeTable.getCell(row, column)) const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod params.cell = cell if (cell && isEnableConf(editConfig) && isEnableConf(editRender)) { // 激活编辑 - if (!$xetable.hasPendingByRow(row)) { + if (!$xeTable.hasPendingByRow(row)) { if (actived.row !== row || (mode === 'cell' ? actived.column !== column : false)) { // 判断是否禁用编辑 let type: 'edit-disabled' | 'edit-activated' = 'edit-disabled' - if (!beforeEditMethod || beforeEditMethod({ ...params, $table: $xetable, $grid: $xetable.xegrid })) { + if (!beforeEditMethod || beforeEditMethod({ ...params, $table: $xeTable, $grid: $xeTable.xegrid })) { if (mouseConfig) { editMethods.clearSelected() - if ($xetable.clearCellAreas) { - $xetable.clearCellAreas() - $xetable.clearCopyCellArea() + if ($xeTable.clearCellAreas) { + $xeTable.clearCellAreas() + $xeTable.clearCopyCellArea() } } - $xetable.closeTooltip() + $xeTable.closeTooltip() if (actived.column) { editMethods.clearEdit(evnt) } @@ -692,37 +693,37 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { nextTick(() => { editPrivateMethods.handleFocus(params, evnt) if (afterEditMethod) { - afterEditMethod({ ...params, $table: $xetable, $grid: $xetable.xegrid }) + afterEditMethod({ ...params, $table: $xeTable, $grid: $xeTable.xegrid }) } }) } - $xetable.dispatchEvent(type, { + $xeTable.dispatchEvent(type, { row, - rowIndex: $xetable.getRowIndex(row), - $rowIndex: $xetable.getVMRowIndex(row), + rowIndex: $xeTable.getRowIndex(row), + $rowIndex: $xeTable.getVMRowIndex(row), column, - columnIndex: $xetable.getColumnIndex(column), - $columnIndex: $xetable.getVMColumnIndex(column) + columnIndex: $xeTable.getColumnIndex(column), + $columnIndex: $xeTable.getVMColumnIndex(column) }, evnt) // v4已废弃 if (type === 'edit-activated') { - $xetable.dispatchEvent('edit-actived', { + $xeTable.dispatchEvent('edit-actived', { row, - rowIndex: $xetable.getRowIndex(row), - $rowIndex: $xetable.getVMRowIndex(row), + rowIndex: $xeTable.getRowIndex(row), + $rowIndex: $xeTable.getVMRowIndex(row), column, - columnIndex: $xetable.getColumnIndex(column), - $columnIndex: $xetable.getVMColumnIndex(column) + columnIndex: $xeTable.getColumnIndex(column), + $columnIndex: $xeTable.getVMColumnIndex(column) }, evnt) } } else { const { column: oldColumn } = actived if (mouseConfig) { editMethods.clearSelected() - if ($xetable.clearCellAreas) { - $xetable.clearCellAreas() - $xetable.clearCopyCellArea() + if ($xeTable.clearCellAreas) { + $xeTable.clearCellAreas() + $xeTable.clearCopyCellArea() } } if (oldColumn !== column) { @@ -730,8 +731,8 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { if (oldModel.update) { setCellValue(row, oldColumn, oldModel.value) } - if ($xetable.clearValidate) { - $xetable.clearValidate(row, column) + if ($xeTable.clearValidate) { + $xeTable.clearValidate(row, column) } } column.renderHeight = cell.offsetHeight @@ -743,7 +744,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { } focused.column = null focused.row = null - $xetable.focus() + $xeTable.focus() } } return nextTick() @@ -786,7 +787,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { } } else { // 显示到可视区中 - $xetable.scrollToRow(row, column) + $xeTable.scrollToRow(row, column) } } }, @@ -806,9 +807,9 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { if (actived.row !== row || (editOpts.mode === 'cell' ? actived.column !== column : false)) { editMethods.clearEdit(evnt) editMethods.clearSelected() - if ($xetable.clearCellAreas) { - $xetable.clearCellAreas() - $xetable.clearCopyCellArea() + if ($xeTable.clearCellAreas) { + $xeTable.clearCellAreas() + $xeTable.clearCopyCellArea() } selected.args = params selected.row = row @@ -816,9 +817,9 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { if (isMouseSelected) { editPrivateMethods.addCellSelectedClass() } - $xetable.focus() + $xeTable.focus() if (evnt) { - $xetable.dispatchEvent('cell-selected', params, evnt) + $xeTable.dispatchEvent('cell-selected', params, evnt) } } } @@ -832,7 +833,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { const { row, column } = selected removeCellSelectedClass() if (row && column) { - const cell = $xetable.getCell(row, column) + const cell = $xeTable.getCell(row, column) if (cell) { addClass(cell, 'col--selected') } @@ -842,9 +843,7 @@ const editHook: VxeGlobalHooksHandles.HookOptions = { return { ...editMethods, ...editPrivateMethods } }, - setupGrid ($xegrid) { - return $xegrid.extendTableMethods(tableEditMethodKeys) + setupGrid ($xeGrid) { + return $xeGrid.extendTableMethods(tableEditMethodKeys) } -} - -export default editHook +}) diff --git a/packages/export/src/export-panel.ts b/packages/table/module/export/export-panel.ts similarity index 64% rename from packages/export/src/export-panel.ts rename to packages/table/module/export/export-panel.ts index 23ec787201..2fe3feb1ad 100644 --- a/packages/export/src/export-panel.ts +++ b/packages/table/module/export/export-panel.ts @@ -1,14 +1,11 @@ -import { defineComponent, h, createCommentVNode, ref, Ref, computed, reactive, inject, nextTick } from 'vue' +import { defineComponent, h, createCommentVNode, ref, Ref, computed, reactive, inject, nextTick, resolveComponent } from 'vue' +import { VxeUI } from '../../../ui' import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { formatText } from '../../tools/utils' -import VxeModalComponent from '../../modal/src/modal' -import VxeInputComponent from '../../input/src/input' -import VxeCheckboxComponent from '../../checkbox/src/checkbox' -import VxeSelectComponent from '../../select/src/select' -import VxeButtonComponent from '../../button/src/button' +import { formatText } from '../../../ui/src/utils' -import { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods } from '../../../types/all' +import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeModalComponent, VxeInputComponent, VxeCheckboxComponent, VxeSelectComponent, VxeButtonComponent } from '../../../../types' + +const { getI18n, getIcon } = VxeUI export default defineComponent({ name: 'VxeTableExportPanel', @@ -17,8 +14,8 @@ export default defineComponent({ storeData: Object as any }, setup (props) { - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) - const { computeExportOpts, computePrintOpts } = $xetable.getComputeMaps() + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) + const { computeExportOpts, computePrintOpts } = $xeTable.getComputeMaps() const reactData = reactive({ isAll: false, @@ -122,14 +119,14 @@ export default defineComponent({ const { storeData } = props const printOpts = computePrintOpts.value storeData.visible = false - $xetable.print(Object.assign({}, printOpts, getExportOption())) + $xeTable.print(Object.assign({}, printOpts, getExportOption())) } const exportEvent = () => { const { storeData } = props const exportOpts = computeExportOpts.value reactData.loading = true - $xetable.exportData(Object.assign({}, exportOpts, getExportOption())).then(() => { + $xeTable.exportData(Object.assign({}, exportOpts, getExportOption())).then(() => { reactData.loading = false storeData.visible = false }).catch(() => { @@ -182,7 +179,7 @@ export default defineComponent({ } }, [ h('span', { - class: ['vxe-checkbox--icon', indeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] + class: ['vxe-checkbox--icon', indeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] }), h('span', { class: 'vxe-checkbox--label' @@ -190,9 +187,9 @@ export default defineComponent({ ]) ) }) - return h(VxeModalComponent, { + return h(resolveComponent('vxe-modal') as VxeModalComponent, { modelValue: storeData.visible, - title: GlobalConfig.i18n(isPrint ? 'vxe.export.printTitle' : 'vxe.export.expTitle'), + title: getI18n(isPrint ? 'vxe.export.printTitle' : 'vxe.export.expTitle'), className: 'vxe-table-export-popup-wrapper', width: 660, mask: true, @@ -217,62 +214,68 @@ export default defineComponent({ }, [ h('tbody', [ [ - isPrint ? createCommentVNode() : h('tr', [ - h('td', GlobalConfig.i18n('vxe.export.expName')), - h('td', [ - h(VxeInputComponent, { - ref: xInputFilename, - modelValue: defaultOptions.filename, - type: 'text', - clearable: true, - placeholder: GlobalConfig.i18n('vxe.export.expNamePlaceholder'), - 'onUpdate:modelValue' (value: any) { - defaultOptions.filename = value - } - }) - ]) - ]), - isPrint ? createCommentVNode() : h('tr', [ - h('td', GlobalConfig.i18n('vxe.export.expType')), - h('td', [ - h(VxeSelectComponent, { - modelValue: defaultOptions.type, - options: storeData.typeList.map((item: any) => { - return { - value: item.value, - label: GlobalConfig.i18n(item.label) + isPrint + ? createCommentVNode() + : h('tr', [ + h('td', getI18n('vxe.export.expName')), + h('td', [ + h(resolveComponent('vxe-input') as VxeInputComponent, { + ref: xInputFilename, + modelValue: defaultOptions.filename, + type: 'text', + clearable: true, + placeholder: getI18n('vxe.export.expNamePlaceholder'), + 'onUpdate:modelValue' (value: any) { + defaultOptions.filename = value } - }), - 'onUpdate:modelValue' (value: any) { - defaultOptions.type = value - } - }) - ]) - ]), - isPrint || showSheet ? h('tr', [ - h('td', GlobalConfig.i18n('vxe.export.expSheetName')), - h('td', [ - h(VxeInputComponent, { - ref: xInputSheetname, - modelValue: defaultOptions.sheetName, - type: 'text', - clearable: true, - placeholder: GlobalConfig.i18n('vxe.export.expSheetNamePlaceholder'), - 'onUpdate:modelValue' (value: any) { - defaultOptions.sheetName = value - } - }) + }) + ]) + ]), + isPrint + ? createCommentVNode() + : h('tr', [ + h('td', getI18n('vxe.export.expType')), + h('td', [ + h(resolveComponent('vxe-select') as VxeSelectComponent, { + modelValue: defaultOptions.type, + options: storeData.typeList.map((item: any) => { + return { + value: item.value, + label: getI18n(item.label) + } + }), + 'onUpdate:modelValue' (value: any) { + defaultOptions.type = value + } + }) + ]) + ]), + isPrint || showSheet + ? h('tr', [ + h('td', getI18n('vxe.export.expSheetName')), + h('td', [ + h(resolveComponent('vxe-input') as VxeInputComponent, { + ref: xInputSheetname, + modelValue: defaultOptions.sheetName, + type: 'text', + clearable: true, + placeholder: getI18n('vxe.export.expSheetNamePlaceholder'), + 'onUpdate:modelValue' (value: any) { + defaultOptions.sheetName = value + } + }) + ]) ]) - ]) : createCommentVNode(), + : createCommentVNode(), h('tr', [ - h('td', GlobalConfig.i18n('vxe.export.expMode')), + h('td', getI18n('vxe.export.expMode')), h('td', [ - h(VxeSelectComponent, { + h(resolveComponent('vxe-select') as VxeSelectComponent, { modelValue: defaultOptions.mode, options: storeData.modeList.map((item: any) => { return { value: item.value, - label: GlobalConfig.i18n(item.label) + label: getI18n(item.label) } }), 'onUpdate:modelValue' (value: any) { @@ -282,7 +285,7 @@ export default defineComponent({ ]) ]), h('tr', [ - h('td', [GlobalConfig.i18n('vxe.export.expColumn')]), + h('td', [getI18n('vxe.export.expColumn')]), h('td', [ h('div', { class: 'vxe-export--panel-column' @@ -295,15 +298,15 @@ export default defineComponent({ 'is--checked': isAllChecked, 'is--indeterminate': isAllIndeterminate }], - title: GlobalConfig.i18n('vxe.table.allTitle'), + title: getI18n('vxe.table.allTitle'), onClick: allColumnEvent }, [ h('span', { - class: ['vxe-checkbox--icon', isAllIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] + class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] }), h('span', { class: 'vxe-checkbox--label' - }, GlobalConfig.i18n('vxe.export.expCurrentColumn')) + }, getI18n('vxe.export.expCurrentColumn')) ]) ]), h('ul', { @@ -313,32 +316,32 @@ export default defineComponent({ ]) ]), h('tr', [ - h('td', GlobalConfig.i18n('vxe.export.expOpts')), + h('td', getI18n('vxe.export.expOpts')), h('td', [ h('div', { class: 'vxe-export--panel-option-row' }, [ - h(VxeCheckboxComponent, { + h(resolveComponent('vxe-checkbox') as VxeCheckboxComponent, { modelValue: defaultOptions.isHeader, - title: GlobalConfig.i18n('vxe.export.expHeaderTitle'), - content: GlobalConfig.i18n('vxe.export.expOptHeader'), + title: getI18n('vxe.export.expHeaderTitle'), + content: getI18n('vxe.export.expOptHeader'), 'onUpdate:modelValue' (value: any) { defaultOptions.isHeader = value } }), - h(VxeCheckboxComponent, { + h(resolveComponent('vxe-checkbox') as VxeCheckboxComponent, { modelValue: defaultOptions.isFooter, disabled: !storeData.hasFooter, - title: GlobalConfig.i18n('vxe.export.expFooterTitle'), - content: GlobalConfig.i18n('vxe.export.expOptFooter'), + title: getI18n('vxe.export.expFooterTitle'), + content: getI18n('vxe.export.expOptFooter'), 'onUpdate:modelValue' (value: any) { defaultOptions.isFooter = value } }), - h(VxeCheckboxComponent, { + h(resolveComponent('vxe-checkbox') as VxeCheckboxComponent, { modelValue: defaultOptions.original, - title: GlobalConfig.i18n('vxe.export.expOriginalTitle'), - content: GlobalConfig.i18n('vxe.export.expOptOriginal'), + title: getI18n('vxe.export.expOriginalTitle'), + content: getI18n('vxe.export.expOptOriginal'), 'onUpdate:modelValue' (value: any) { defaultOptions.original = value } @@ -347,38 +350,40 @@ export default defineComponent({ h('div', { class: 'vxe-export--panel-option-row' }, [ - h(VxeCheckboxComponent, { + h(resolveComponent('vxe-checkbox') as VxeCheckboxComponent, { modelValue: isHeader && hasColgroup && supportMerge ? defaultOptions.isColgroup : false, - title: GlobalConfig.i18n('vxe.export.expColgroupTitle'), + title: getI18n('vxe.export.expColgroupTitle'), disabled: !isHeader || !hasColgroup || !supportMerge, - content: GlobalConfig.i18n('vxe.export.expOptColgroup'), + content: getI18n('vxe.export.expOptColgroup'), 'onUpdate:modelValue' (value: any) { defaultOptions.isColgroup = value } }), - h(VxeCheckboxComponent, { + h(resolveComponent('vxe-checkbox') as VxeCheckboxComponent, { modelValue: hasMerge && supportMerge && checkedAll ? defaultOptions.isMerge : false, - title: GlobalConfig.i18n('vxe.export.expMergeTitle'), + title: getI18n('vxe.export.expMergeTitle'), disabled: !hasMerge || !supportMerge || !checkedAll, - content: GlobalConfig.i18n('vxe.export.expOptMerge'), + content: getI18n('vxe.export.expOptMerge'), 'onUpdate:modelValue' (value: any) { defaultOptions.isMerge = value } }), - isPrint ? createCommentVNode() : h(VxeCheckboxComponent, { - modelValue: supportStyle ? defaultOptions.useStyle : false, - disabled: !supportStyle, - title: GlobalConfig.i18n('vxe.export.expUseStyleTitle'), - content: GlobalConfig.i18n('vxe.export.expOptUseStyle'), - 'onUpdate:modelValue' (value: any) { - defaultOptions.useStyle = value - } - }), - h(VxeCheckboxComponent, { + isPrint + ? createCommentVNode() + : h(resolveComponent('vxe-checkbox') as VxeCheckboxComponent, { + modelValue: supportStyle ? defaultOptions.useStyle : false, + disabled: !supportStyle, + title: getI18n('vxe.export.expUseStyleTitle'), + content: getI18n('vxe.export.expOptUseStyle'), + 'onUpdate:modelValue' (value: any) { + defaultOptions.useStyle = value + } + }), + h(resolveComponent('vxe-checkbox') as VxeCheckboxComponent, { modelValue: hasTree ? defaultOptions.isAllExpand : false, disabled: !hasTree, - title: GlobalConfig.i18n('vxe.export.expAllExpandTitle'), - content: GlobalConfig.i18n('vxe.export.expOptAllExpand'), + title: getI18n('vxe.export.expAllExpandTitle'), + content: getI18n('vxe.export.expOptAllExpand'), 'onUpdate:modelValue' (value: any) { defaultOptions.isAllExpand = value } @@ -392,14 +397,14 @@ export default defineComponent({ h('div', { class: 'vxe-export--panel-btns' }, [ - h(VxeButtonComponent, { - content: GlobalConfig.i18n('vxe.export.expCancel'), + h(resolveComponent('vxe-button') as VxeButtonComponent, { + content: getI18n('vxe.export.expCancel'), onClick: cancelEvent }), - h(VxeButtonComponent, { + h(resolveComponent('vxe-button') as VxeButtonComponent, { ref: xButtonConfirm, status: 'primary', - content: GlobalConfig.i18n(isPrint ? 'vxe.export.expPrint' : 'vxe.export.expConfirm'), + content: getI18n(isPrint ? 'vxe.export.expPrint' : 'vxe.export.expConfirm'), onClick: confirmEvent }) ]) diff --git a/packages/export/src/hook.ts b/packages/table/module/export/hook.ts similarity index 86% rename from packages/export/src/hook.ts rename to packages/table/module/export/hook.ts index 6a97a0cff6..9649dd6943 100644 --- a/packages/export/src/hook.ts +++ b/packages/table/module/export/hook.ts @@ -1,13 +1,14 @@ import { inject, nextTick } from 'vue' import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' -import { isColumnInfo, mergeBodyMethod, getCellValue } from '../../table/src/util' -import { parseFile, formatText } from '../../tools/utils' -import { warnLog, errLog } from '../../tools/log' -import { readLocalFile, handlePrint, saveLocalFile, createHtmlPage, getExportBlobByContent } from './util' +import { VxeUI } from '../../../ui' +import { isColumnInfo, mergeBodyMethod, getCellValue } from '../../src/util' +import { parseFile, formatText } from '../../../ui/src/utils' +import { createHtmlPage, getExportBlobByContent } from './util' +import { warnLog, errLog } from '../../../ui/src/log' -import { VxeGlobalHooksHandles, VxeGridConstructor, VxeGridPrivateMethods, TableExportMethods } from '../../../types/all' +import type { VxeGridConstructor, VxeGridPrivateMethods, TableExportMethods } from '../../../../types' + +const { getI18n, hooks, renderer } = VxeUI let htmlCellElem: any @@ -280,12 +281,12 @@ function checkImportData (columns: any[], fields: string[]) { const tableExportMethodKeys: (keyof TableExportMethods)[] = ['exportData', 'importByFile', 'importData', 'saveFile', 'readFile', 'print', 'openImport', 'openExport', 'openPrint'] -const tableExportHook: VxeGlobalHooksHandles.HookOptions = { - setupTable ($xetable) { - const { props, reactData, internalData } = $xetable - const { computeTreeOpts, computePrintOpts, computeExportOpts, computeImportOpts, computeCustomOpts, computeSeqOpts, computeRadioOpts, computeCheckboxOpts, computeColumnOpts } = $xetable.getComputeMaps() +hooks.add('tableExportModule', { + setupTable ($xeTable) { + const { props, reactData, internalData } = $xeTable + const { computeTreeOpts, computePrintOpts, computeExportOpts, computeImportOpts, computeCustomOpts, computeSeqOpts, computeRadioOpts, computeCheckboxOpts, computeColumnOpts } = $xeTable.getComputeMaps() - const $xegrid = inject('$xegrid', null as (VxeGridConstructor & VxeGridPrivateMethods) | null) + const $xeGrid = inject('$xeGrid', null as (VxeGridConstructor & VxeGridPrivateMethods) | null) const hasTreeChildren = (row: any) => { const treeOpts = computeTreeOpts.value @@ -299,20 +300,20 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { if (seqMethod) { return seqMethod({ row, - rowIndex: $xetable.getRowIndex(row), + rowIndex: $xeTable.getRowIndex(row), $rowIndex, column, - columnIndex: $xetable.getColumnIndex(column), + columnIndex: $xeTable.getColumnIndex(column), $columnIndex }) } - return $xetable.getRowSeq(row) + return $xeTable.getRowSeq(row) } function getHeaderTitle (opts: any, column: any) { const columnOpts = computeColumnOpts.value const headExportMethod = column.headerExportMethod || columnOpts.headerExportMethod - return headExportMethod ? headExportMethod({ column, options: opts, $table: $xetable }) : ((opts.original ? column.property : column.getTitle()) || '') + return headExportMethod ? headExportMethod({ column, options: opts, $table: $xeTable }) : ((opts.original ? column.property : column.getTitle()) || '') } const toBooleanValue = (cellValue: any) => { @@ -337,20 +338,20 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { XEUtils.eachTree(datas, (item, $rowIndex, items, path, parent, nodes) => { const row = item._row || item const parentRow = parent && parent._row ? parent._row : parent - if ((isAllExpand || !parentRow || (expandMaps.has(parentRow) && $xetable.isTreeExpandByRow(parentRow)))) { + if ((isAllExpand || !parentRow || (expandMaps.has(parentRow) && $xeTable.isTreeExpandByRow(parentRow)))) { const hasRowChild = hasTreeChildren(row) const item: any = { _row: row, _level: nodes.length - 1, _hasChild: hasRowChild, - _expand: hasRowChild && $xetable.isTreeExpandByRow(row) + _expand: hasRowChild && $xeTable.isTreeExpandByRow(row) } columns.forEach((column, $columnIndex) => { let cellValue: string | boolean = '' const renderOpts = column.editRender || column.cellRender let bodyExportMethod = column.exportMethod if (!bodyExportMethod && renderOpts && renderOpts.name) { - const compConf = VXETable.renderer.get(renderOpts.name) + const compConf = renderer.get(renderOpts.name) if (compConf) { bodyExportMethod = compConf.exportMethod } @@ -359,19 +360,19 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { bodyExportMethod = columnOpts.exportMethod } if (bodyExportMethod) { - cellValue = bodyExportMethod({ $table: $xetable, row, column, options: opts }) + cellValue = bodyExportMethod({ $table: $xeTable, row, column, options: opts }) } else { switch (column.type) { case 'seq': cellValue = mode === 'all' ? path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('') : getSeq(row, $rowIndex, column, $columnIndex) break case 'checkbox': - cellValue = toBooleanValue($xetable.isCheckedByCheckboxRow(row)) + cellValue = toBooleanValue($xeTable.isCheckedByCheckboxRow(row)) item._checkboxLabel = checkboxOpts.labelField ? XEUtils.get(row, checkboxOpts.labelField) : '' item._checkboxDisabled = checkboxOpts.checkMethod && !checkboxOpts.checkMethod({ row }) break case 'radio': - cellValue = toBooleanValue($xetable.isCheckedByRadioRow(row)) + cellValue = toBooleanValue($xeTable.isCheckedByRadioRow(row)) item._radioLabel = radioOpts.labelField ? XEUtils.get(row, radioOpts.labelField) : '' item._radioDisabled = radioOpts.checkMethod && !radioOpts.checkMethod({ row }) break @@ -379,12 +380,12 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { if (opts.original) { cellValue = getCellValue(row, column) } else { - cellValue = $xetable.getCellLabel(row, column) + cellValue = $xeTable.getCellLabel(row, column) if (column.type === 'html') { htmlCellElem.innerHTML = cellValue cellValue = htmlCellElem.innerText.trim() } else { - const cell = $xetable.getCell(row, column) + const cell = $xeTable.getCell(row, column) if (cell) { cellValue = cell.innerText.trim() } @@ -409,25 +410,25 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const renderOpts = column.editRender || column.cellRender let exportLabelMethod = column.exportMethod if (!exportLabelMethod && renderOpts && renderOpts.name) { - const compConf = VXETable.renderer.get(renderOpts.name) + const compConf = renderer.get(renderOpts.name) if (compConf) { exportLabelMethod = compConf.exportMethod } } if (exportLabelMethod) { - cellValue = exportLabelMethod({ $table: $xetable, row, column, options: opts }) + cellValue = exportLabelMethod({ $table: $xeTable, row, column, options: opts }) } else { switch (column.type) { case 'seq': cellValue = mode === 'all' ? $rowIndex + 1 : getSeq(row, $rowIndex, column, $columnIndex) break case 'checkbox': - cellValue = toBooleanValue($xetable.isCheckedByCheckboxRow(row)) + cellValue = toBooleanValue($xeTable.isCheckedByCheckboxRow(row)) item._checkboxLabel = checkboxOpts.labelField ? XEUtils.get(row, checkboxOpts.labelField) : '' item._checkboxDisabled = checkboxOpts.checkMethod && !checkboxOpts.checkMethod({ row }) break case 'radio': - cellValue = toBooleanValue($xetable.isCheckedByRadioRow(row)) + cellValue = toBooleanValue($xeTable.isCheckedByRadioRow(row)) item._radioLabel = radioOpts.labelField ? XEUtils.get(row, radioOpts.labelField) : '' item._radioDisabled = radioOpts.checkMethod && !radioOpts.checkMethod({ row }) break @@ -435,12 +436,12 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { if (opts.original) { cellValue = getCellValue(row, column) } else { - cellValue = $xetable.getCellLabel(row, column) + cellValue = $xeTable.getCellLabel(row, column) if (column.type === 'html') { htmlCellElem.innerHTML = cellValue cellValue = htmlCellElem.innerText.trim() } else { - const cell = $xetable.getCell(row, column) + const cell = $xeTable.getCell(row, column) if (cell) { cellValue = cell.innerText.trim() } @@ -468,7 +469,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const renderOpts = column.editRender || column.cellRender let footLabelMethod = column.footerExportMethod if (!footLabelMethod && renderOpts && renderOpts.name) { - const compConf = VXETable.renderer.get(renderOpts.name) + const compConf = renderer.get(renderOpts.name) if (compConf) { footLabelMethod = compConf.footerExportMethod } @@ -476,8 +477,8 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { if (!footLabelMethod) { footLabelMethod = columnOpts.footerExportMethod } - const _columnIndex = $xetable.getVTColumnIndex(column) - const cellValue = footLabelMethod ? footLabelMethod({ $table: $xetable, items, itemIndex: _columnIndex, row: items, _columnIndex, column, options: opts }) : XEUtils.toValueString(items[_columnIndex]) + const _columnIndex = $xeTable.getVTColumnIndex(column) + const cellValue = footLabelMethod ? footLabelMethod({ $table: $xeTable, items, itemIndex: _columnIndex, row: items, _columnIndex, column, options: opts }) : XEUtils.toValueString(items[_columnIndex]) return cellValue } @@ -638,8 +639,8 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { let rowSpan = 1 let colSpan = 1 if (isMerge && mergeList.length) { - const _rowIndex = $xetable.getVTRowIndex(item._row) - const _columnIndex = $xetable.getVTColumnIndex(column) + const _rowIndex = $xeTable.getVTRowIndex(item._row) + const _columnIndex = $xeTable.getVTColumnIndex(column) const spanRest = mergeBodyMethod(mergeList, _rowIndex, _columnIndex) if (spanRest) { const { rowspan, colspan } = spanRest @@ -754,29 +755,27 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const blob = getExportBlobByContent(content, opts) return Promise.resolve({ type, content, blob }) } - saveLocalFile({ filename, type, content }).then(() => { - if (opts.message !== false) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) + if (VxeUI.saveFile) { + VxeUI.saveFile({ filename, type, content }).then(() => { + if (opts.message !== false) { + if (VxeUI.modal) { + VxeUI.modal.message({ content: getI18n('vxe.table.expSuccess'), status: 'success' }) } } - VXETable.modal.message({ content: GlobalConfig.i18n('vxe.table.expSuccess'), status: 'success' }) - } - }) + }) + } } const handleExport = (opts: any) => { const { remote, columns, colgroups, exportMethod, afterExportMethod } = opts return new Promise(resolve => { if (remote) { - const params = { options: opts, $table: $xetable, $grid: $xegrid } + const params = { options: opts, $table: $xeTable, $grid: $xeGrid } resolve(exportMethod ? exportMethod(params) : params) } else { const datas = getExportData(opts) resolve( - $xetable.preventEvent(null, 'event.export', { options: opts, columns, colgroups, datas }, () => { + $xeTable.preventEvent(null, 'event.export', { options: opts, columns, colgroups, datas }, () => { return downloadFile(opts, getContent(opts, columns, datas)) }) ) @@ -785,7 +784,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { clearColumnConvert(columns) if (!opts.print) { if (afterExportMethod) { - afterExportMethod({ status: true, options: opts, $table: $xetable, $grid: $xegrid }) + afterExportMethod({ status: true, options: opts, $table: $xeTable, $grid: $xeGrid }) } } return Object.assign({ status: true }, params) @@ -793,7 +792,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { clearColumnConvert(columns) if (!opts.print) { if (afterExportMethod) { - afterExportMethod({ status: false, options: opts, $table: $xetable, $grid: $xegrid }) + afterExportMethod({ status: false, options: opts, $table: $xeTable, $grid: $xeGrid }) } } const params = { status: false } @@ -824,22 +823,18 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const { fields, rows } = rest const status = checkImportData(tableFullColumn, fields) if (status) { - $xetable.createData(rows) + $xeTable.createData(rows) .then((data: any) => { let loadRest if (opts.mode === 'insert') { - loadRest = $xetable.insert(data) + loadRest = $xeTable.insert(data) } else { - loadRest = $xetable.reloadData(data) + loadRest = $xeTable.reloadData(data) } if (opts.message !== false) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ content: getI18n('vxe.table.impSuccess', [rows.length]), status: 'success' }) } - VXETable.modal.message({ content: GlobalConfig.i18n('vxe.table.impSuccess', [rows.length]), status: 'success' }) } return loadRest.then(() => { if (_importResolve) { @@ -848,13 +843,9 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { }) }) } else if (opts.message !== false) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ content: getI18n('vxe.error.impFields'), status: 'error' }) } - VXETable.modal.message({ content: GlobalConfig.i18n('vxe.error.impFields'), status: 'error' }) if (_importReject) { _importReject({ status: false }) } @@ -864,17 +855,14 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const handleFileImport = (file: File, opts: any) => { const { importMethod, afterImportMethod } = opts const { type, filename } = parseFile(file) + const importOpts = computeImportOpts.value // 检查类型，如果为自定义导出，则不需要校验类型 - if (!importMethod && !XEUtils.includes(VXETable.globalConfs.importTypes, type)) { + if (!importMethod && !XEUtils.includes(XEUtils.keys(importOpts._typeMaps), type)) { if (opts.message !== false) { - // 检测弹窗模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!VXETable.modal) { - errLog('vxe.error.reqModule', ['Modal']) - } + if (VxeUI.modal) { + VxeUI.modal.message({ content: getI18n('vxe.error.notType', [type]), status: 'error' }) } - VXETable.modal.message({ content: GlobalConfig.i18n('vxe.error.notType', [type]), status: 'error' }) } const params = { status: false } return Promise.reject(params) @@ -897,7 +885,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const options = Object.assign({ mode: 'insert' }, opts, { type, filename }) if (options.remote) { if (importMethod) { - Promise.resolve(importMethod({ file, options, $table: $xetable })).then(() => { + Promise.resolve(importMethod({ file, options, $table: $xeTable })).then(() => { _importResolve({ status: true }) }).catch(() => { _importResolve({ status: true }) @@ -907,7 +895,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { } } else { const { tableFullColumn } = internalData - $xetable.preventEvent(null, 'event.import', { file, options, columns: tableFullColumn }, () => { + $xeTable.preventEvent(null, 'event.import', { file, options, columns: tableFullColumn }, () => { const reader = new FileReader() reader.onerror = () => { errLog('vxe.error.notType', [type]) @@ -921,7 +909,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { } } else { // 不支持的浏览器 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notExp') } _importResolve({ status: true }) @@ -930,11 +918,11 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { return rest.then(() => { if (afterImportMethod) { - afterImportMethod({ status: true, options: opts, $table: $xetable }) + afterImportMethod({ status: true, options: opts, $table: $xeTable }) } }).catch((e) => { if (afterImportMethod) { - afterImportMethod({ status: false, options: opts, $table: $xetable }) + afterImportMethod({ status: false, options: opts, $table: $xeTable }) } return Promise.reject(e) }) @@ -944,13 +932,14 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const { treeConfig, showHeader, showFooter } = props const { initStore, mergeList, isGroup, footerTableData, exportStore, exportParams } = reactData const { collectColumn } = internalData + const exportOpts = computeExportOpts.value const hasTree = treeConfig const customOpts = computeCustomOpts.value - const selectRecords = $xetable.getCheckboxRecords() + const selectRecords = $xeTable.getCheckboxRecords() const hasFooter = !!footerTableData.length const hasMerge = !hasTree && mergeList.length const defOpts = Object.assign({ message: true, isHeader: showHeader, isFooter: showFooter }, options) - const types: string[] = defOpts.types || VXETable.globalConfs.exportTypes + const types: string[] = defOpts.types || XEUtils.keys(exportOpts._typeMaps) const modes: string[] = defOpts.modes const checkMethod = customOpts.checkMethod const exportColumns = collectColumn.slice(0) @@ -972,27 +961,29 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { XEUtils.eachTree(exportColumns, (column: any, index, items, path, parent) => { const isColGroup = column.children && column.children.length if (isColGroup || defaultFilterExportColumn(column)) { - column.checked = columns ? columns.some((item: any) => { - if (isColumnInfo(item)) { - return column === item - } else if (XEUtils.isString(item)) { - return column.field === item - } else { - const colid = item.id || item.colId - const type = item.type - const field = item.property || item.field - if (colid) { - return column.id === colid - } else if (field && type) { - return column.property === field && column.type === type - } else if (field) { - return column.property === field - } else if (type) { - return column.type === type + column.checked = columns + ? columns.some((item: any) => { + if (isColumnInfo(item)) { + return column === item + } else if (XEUtils.isString(item)) { + return column.field === item + } else { + const colid = item.id || item.colId + const type = item.type + const field = item.property || item.field + if (colid) { + return column.id === colid + } else if (field && type) { + return column.property === field && column.type === type + } else if (field) { + return column.property === field + } else if (type) { + return column.type === type + } } - } - return false - }) : column.visible + return false + }) + : column.visible column.halfChecked = false column.disabled = (parent && parent.disabled) || (checkMethod ? !checkMethod({ column }) : false) } @@ -1061,7 +1052,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { print: false }, options) const { type, mode, columns, original, beforeExportMethod } = opts - let groups = [] + let groups: any[] = [] const customCols = columns && columns.length ? columns : null let columnFilterMethod = opts.columnFilterMethod // 如果设置源数据，则默认导出设置了字段的列 @@ -1077,17 +1068,17 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { if (isColumnInfo(item)) { targetColumn = item } else if (XEUtils.isString(item)) { - targetColumn = $xetable.getColumnByField(item) + targetColumn = $xeTable.getColumnByField(item) } else { const colid = item.id || item.colId const type = item.type const field = item.property || item.field if (colid) { - targetColumn = $xetable.getColumnById(colid) + targetColumn = $xeTable.getColumnById(colid) } else if (field && type) { targetColumn = tableFullColumn.find((column: any) => column.property === field && column.type === type) } else if (field) { - targetColumn = $xetable.getColumnByField(field) + targetColumn = $xeTable.getColumnByField(field) } else if (type) { targetColumn = tableFullColumn.find((column: any) => column.type === type) } @@ -1120,15 +1111,15 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { opts.columns = cols opts.colgroups = convertToRows(groups) if (!opts.filename) { - opts.filename = GlobalConfig.i18n(opts.original ? 'vxe.table.expOriginFilename' : 'vxe.table.expFilename', [XEUtils.toDateString(Date.now(), 'yyyyMMddHHmmss')]) + opts.filename = getI18n(opts.original ? 'vxe.table.expOriginFilename' : 'vxe.table.expFilename', [XEUtils.toDateString(Date.now(), 'yyyyMMddHHmmss')]) } if (!opts.sheetName) { opts.sheetName = document.title } // 检查类型，如果为自定义导出，则不需要校验类型 - if (!opts.exportMethod && !XEUtils.includes(VXETable.globalConfs.exportTypes, type)) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (!opts.exportMethod && !XEUtils.includes(XEUtils.keys(exportOpts._typeMaps), type)) { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notType', [type]) } const params = { status: false } @@ -1137,34 +1128,34 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { if (!opts.print) { if (beforeExportMethod) { - beforeExportMethod({ options: opts, $table: $xetable, $grid: $xegrid }) + beforeExportMethod({ options: opts, $table: $xeTable, $grid: $xeGrid }) } } if (!opts.data) { opts.data = afterFullData if (mode === 'selected') { - const selectRecords = $xetable.getCheckboxRecords() + const selectRecords = $xeTable.getCheckboxRecords() if (['html', 'pdf'].indexOf(type) > -1 && treeConfig) { - opts.data = XEUtils.searchTree($xetable.getTableData().fullData, item => $xetable.findRowIndexOf(selectRecords, item) > -1, Object.assign({}, treeOpts, { data: '_row' })) + opts.data = XEUtils.searchTree($xeTable.getTableData().fullData, item => $xeTable.findRowIndexOf(selectRecords, item) > -1, Object.assign({}, treeOpts, { data: '_row' })) } else { opts.data = selectRecords } } else if (mode === 'all') { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (!$xegrid) { + if (process.env.VUE_APP_VXE_ENV === 'development') { + if (!$xeGrid) { warnLog('vxe.error.errProp', ['all', 'mode=current,selected']) } } - if ($xegrid && !opts.remote) { - const { reactData: gridReactData } = $xegrid - const { computeProxyOpts } = $xegrid.getComputeMaps() + if ($xeGrid && !opts.remote) { + const { reactData: gridReactData } = $xeGrid + const { computeProxyOpts } = $xeGrid.getComputeMaps() const proxyOpts = computeProxyOpts.value const { beforeQueryAll, afterQueryAll, ajax = {}, props = {} } = proxyOpts const ajaxMethods = ajax.queryAll - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (!ajaxMethods) { warnLog('vxe.error.notFunc', ['proxy-config.ajax.queryAll']) } @@ -1172,8 +1163,8 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { if (ajaxMethods) { const params = { - $table: $xetable, - $grid: $xegrid, + $table: $xeTable, + $grid: $xeGrid, sort: gridReactData.sortData, filters: gridReactData.filterData, form: gridReactData.formData, @@ -1199,36 +1190,36 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const opts = Object.assign({}, options) const { beforeImportMethod } = opts if (beforeImportMethod) { - beforeImportMethod({ options: opts, $table: $xetable }) + beforeImportMethod({ options: opts, $table: $xeTable }) } return handleFileImport(file, opts) }, importData (options) { const importOpts = computeImportOpts.value const opts = Object.assign({ - types: VXETable.globalConfs.importTypes + types: XEUtils.keys(importOpts._typeMaps) // beforeImportMethod: null, // afterImportMethod: null }, importOpts, options) const { beforeImportMethod, afterImportMethod } = opts if (beforeImportMethod) { - beforeImportMethod({ options: opts, $table: $xetable }) + beforeImportMethod({ options: opts, $table: $xeTable }) } - return readLocalFile(opts).catch(e => { + return VxeUI.readFile(opts).catch(e => { if (afterImportMethod) { - afterImportMethod({ status: false, options: opts, $table: $xetable }) + afterImportMethod({ status: false, options: opts, $table: $xeTable }) } return Promise.reject(e) - }).then((params: any) => { + }).then((params) => { const { file } = params return handleFileImport(file, opts) }) }, saveFile (options) { - return saveLocalFile(options) + return VxeUI.saveFile(options) }, readFile (options) { - return readLocalFile(options) + return VxeUI.readFile(options) }, print (options) { const printOpts = computePrintOpts.value @@ -1244,15 +1235,45 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { if (!opts.sheetName) { opts.sheetName = document.title } - return new Promise(resolve => { - if (opts.content) { - resolve(handlePrint($xetable, opts, opts.content)) + return new Promise((resolve, reject) => { + if (VxeUI.print) { + if (opts.content) { + resolve( + VxeUI.print({ + title: opts.sheetName, + html: opts.content + }) + ) + } else { + resolve( + exportMethods.exportData(opts).then(({ content }: any) => { + return VxeUI.print({ + title: opts.sheetName, + html: content + }) + }) + ) + } } else { - resolve( - exportMethods.exportData(opts).then(({ content }: any) => { - return handlePrint($xetable, opts, content) - }) - ) + const e = { status: false } + reject(e) + } + }) + }, + getPrintHtml (options) { + const printOpts = computePrintOpts.value + const opts = Object.assign({ + original: false + // beforePrintMethod + }, printOpts, options, { + type: 'html', + download: false, + remote: false, + print: true + }) + return exportMethods.exportData(opts).then(({ content }) => { + return { + html: content } }) }, @@ -1260,12 +1281,14 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { const { treeConfig, importConfig } = props const { initStore, importStore, importParams } = reactData const importOpts = computeImportOpts.value - const defOpts = Object.assign({ mode: 'insert', message: true, types: VXETable.globalConfs.importTypes }, options, importOpts) + const defOpts = Object.assign({ mode: 'insert', message: true, types: XEUtils.keys(importOpts._typeMaps) }, options, importOpts) const { types } = defOpts const isTree = !!treeConfig if (isTree) { if (defOpts.message) { - VXETable.modal.message({ content: GlobalConfig.i18n('vxe.error.treeNotImp'), status: 'error' }) + if (VxeUI.modal) { + VxeUI.modal.message({ content: getI18n('vxe.error.treeNotImp'), status: 'error' }) + } } return } @@ -1273,13 +1296,13 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { errLog('vxe.error.reqProp', ['import-config']) } // 处理类型 - const typeList = types.map((value) => { + const typeList = types.map((value: any) => { return { value, label: `vxe.export.types.${value}` } }) - const modeList = defOpts.modes.map((value) => { + const modeList = defOpts.modes.map((value: any) => { return { value, label: `vxe.import.modes.${value}` @@ -1298,7 +1321,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { }, openExport (options: any) { const exportOpts = computeExportOpts.value - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (!props.exportConfig) { errLog('vxe.error.reqProp', ['export-config']) } @@ -1307,7 +1330,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { }, openPrint (options: any) { const printOpts = computePrintOpts.value - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (!props.printConfig) { errLog('vxe.error.reqProp', ['print-config']) } @@ -1318,9 +1341,7 @@ const tableExportHook: VxeGlobalHooksHandles.HookOptions = { return exportMethods }, - setupGrid ($xegrid) { - return $xegrid.extendTableMethods(tableExportMethodKeys) + setupGrid ($xeGrid) { + return $xeGrid.extendTableMethods(tableExportMethodKeys) } -} - -export default tableExportHook +}) diff --git a/packages/export/src/import-panel.ts b/packages/table/module/export/import-panel.ts similarity index 64% rename from packages/export/src/import-panel.ts rename to packages/table/module/export/import-panel.ts index 9ea513001a..9dad78cf03 100644 --- a/packages/export/src/import-panel.ts +++ b/packages/table/module/export/import-panel.ts @@ -1,13 +1,11 @@ -import { defineComponent, h, ref, Ref, computed, inject, reactive, nextTick } from 'vue' +import { defineComponent, h, ref, Ref, computed, inject, reactive, nextTick, resolveComponent } from 'vue' +import { VxeUI } from '../../../ui' import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import VxeModalComponent from '../../modal/src/modal' -import VxeRadioGroupComponent from '../../radio/src/group' -import VxeRadioComponent from '../../radio/src/radio' -import VxeButtonComponent from '../../button/src/button' -import { parseFile } from '../../tools/utils' +import { parseFile } from '../../../ui/src/utils' -import { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods } from '../../../types/all' +import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeButtonComponent, VxeModalComponent, VxeRadioGroupComponent, VxeRadioComponent } from '../../../../types' + +const { getI18n, getIcon } = VxeUI export default defineComponent({ name: 'VxeTableImportPanel', @@ -16,8 +14,8 @@ export default defineComponent({ storeData: Object as any }, setup (props) { - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) - const { computeImportOpts } = $xetable.getComputeMaps() + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) + const { computeImportOpts } = $xeTable.getComputeMaps() const reactData = reactive({ loading: false @@ -40,7 +38,7 @@ export default defineComponent({ const { type, typeList } = storeData if (type) { const selectItem = XEUtils.find(typeList, item => type === item.value) - return selectItem ? GlobalConfig.i18n(selectItem.label) : '*.*' + return selectItem ? getI18n(selectItem.label) : '*.*' } return `*.${typeList.map((item: any) => item.value).join(', *.')}` }) @@ -56,7 +54,7 @@ export default defineComponent({ const selectFileEvent = () => { const { storeData, defaultOptions } = props - $xetable.readFile(defaultOptions).then((params: any) => { + $xeTable.readFile(defaultOptions).then((params: any) => { const { file } = params Object.assign(storeData, parseFile(file), { file }) }).catch((e: any) => e) @@ -80,7 +78,7 @@ export default defineComponent({ const { storeData, defaultOptions } = props const importOpts = computeImportOpts.value reactData.loading = true - $xetable.importByFile(storeData.file, Object.assign({}, importOpts, defaultOptions)).then(() => { + $xeTable.importByFile(storeData.file, Object.assign({}, importOpts, defaultOptions)).then(() => { reactData.loading = false storeData.visible = false }).catch(() => { @@ -93,9 +91,9 @@ export default defineComponent({ const selectName = computeSelectName.value const hasFile = computeHasFile.value const parseTypeLabel = computeParseTypeLabel.value - return h(VxeModalComponent, { + return h(resolveComponent('vxe-modal') as VxeModalComponent, { modelValue: storeData.visible, - title: GlobalConfig.i18n('vxe.import.impTitle'), + title: getI18n('vxe.import.impTitle'), className: 'vxe-table-import-popup-wrapper', width: 440, mask: true, @@ -120,38 +118,40 @@ export default defineComponent({ }, [ h('tbody', [ h('tr', [ - h('td', GlobalConfig.i18n('vxe.import.impFile')), + h('td', getI18n('vxe.import.impFile')), h('td', [ - hasFile ? h('div', { - class: 'vxe-import-selected--file', - title: selectName - }, [ - h('span', selectName), - h('i', { - class: GlobalConfig.icon.INPUT_CLEAR, - onClick: clearFileEvent - }) - ]) : h('button', { - ref: refFileBtn, - class: 'vxe-import-select--file', - onClick: selectFileEvent - }, GlobalConfig.i18n('vxe.import.impSelect')) + hasFile + ? h('div', { + class: 'vxe-import-selected--file', + title: selectName + }, [ + h('span', selectName), + h('i', { + class: getIcon().INPUT_CLEAR, + onClick: clearFileEvent + }) + ]) + : h('button', { + ref: refFileBtn, + class: 'vxe-import-select--file', + onClick: selectFileEvent + }, getI18n('vxe.import.impSelect')) ]) ]), h('tr', [ - h('td', GlobalConfig.i18n('vxe.import.impType')), + h('td', getI18n('vxe.import.impType')), h('td', parseTypeLabel) ]), h('tr', [ - h('td', GlobalConfig.i18n('vxe.import.impOpts')), + h('td', getI18n('vxe.import.impOpts')), h('td', [ - h(VxeRadioGroupComponent, { + h(resolveComponent('vxe-radio-group') as VxeRadioGroupComponent, { modelValue: defaultOptions.mode, 'onUpdate:modelValue' (value: any) { defaultOptions.mode = value } }, { - default: () => storeData.modeList.map((item: any) => h(VxeRadioComponent, { label: item.value, content: GlobalConfig.i18n(item.label) })) + default: () => storeData.modeList.map((item: any) => h(resolveComponent('vxe-radio') as VxeRadioComponent, { label: item.value, content: getI18n(item.label) })) }) ]) ]) @@ -160,14 +160,14 @@ export default defineComponent({ h('div', { class: 'vxe-export--panel-btns' }, [ - h(VxeButtonComponent, { - content: GlobalConfig.i18n('vxe.import.impCancel'), + h(resolveComponent('vxe-button') as VxeButtonComponent, { + content: getI18n('vxe.import.impCancel'), onClick: cancelEvent }), - h(VxeButtonComponent, { + h(resolveComponent('vxe-button') as VxeButtonComponent, { status: 'primary', disabled: !hasFile, - content: GlobalConfig.i18n('vxe.import.impConfirm'), + content: getI18n('vxe.import.impConfirm'), onClick: importEvent }) ]) diff --git a/packages/table/module/export/util.ts b/packages/table/module/export/util.ts new file mode 100644 index 0000000000..dfdba9c862 --- /dev/null +++ b/packages/table/module/export/util.ts @@ -0,0 +1,24 @@ +import type { VxeTablePropTypes } from '../../../../types' + +// 默认导出或打印的 HTML 样式 +const defaultHtmlStyle = 'body{margin:0;padding: 0 1px;color:#333333;font-size:14px;font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu}body *{-webkit-box-sizing:border-box;box-sizing:border-box}.vxe-table{border-collapse:collapse;text-align:left;border-spacing:0}.vxe-table:not(.is--print){table-layout:fixed}.vxe-table,.vxe-table th,.vxe-table td,.vxe-table td{border-color:#D0D0D0;border-style:solid;border-width:0}.vxe-table.is--print{width:100%}.border--default,.border--full,.border--outer{border-top-width:1px}.border--default,.border--full,.border--outer{border-left-width:1px}.border--outer,.border--default th,.border--default td,.border--full th,.border--full td,.border--outer th,.border--inner th,.border--inner td{border-bottom-width:1px}.border--default,.border--outer,.border--full th,.border--full td{border-right-width:1px}.border--default th,.border--full th,.border--outer th{background-color:#f8f8f9}.vxe-table td>div,.vxe-table th>div{padding:.5em .4em}.col--center{text-align:center}.col--right{text-align:right}.vxe-table:not(.is--print) .col--ellipsis>div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-break:break-all}.vxe-table--tree-node{text-align:left}.vxe-table--tree-node-wrapper{position:relative}.vxe-table--tree-icon-wrapper{position:absolute;top:50%;width:1em;height:1em;text-align:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}.vxe-table--tree-unfold-icon,.vxe-table--tree-fold-icon{position:absolute;width:0;height:0;border-style:solid;border-width:.5em;border-right-color:transparent;border-bottom-color:transparent}.vxe-table--tree-unfold-icon{left:.3em;top:0;border-left-color:#939599;border-top-color:transparent}.vxe-table--tree-fold-icon{left:0;top:.3em;border-left-color:transparent;border-top-color:#939599}.vxe-table--tree-cell{display:block;padding-left:1.5em}.vxe-table input[type="checkbox"]{margin:0}.vxe-table input[type="checkbox"],.vxe-table input[type="radio"],.vxe-table input[type="checkbox"]+span,.vxe-table input[type="radio"]+span{vertical-align:middle;padding-left:0.4em}' + +export function getExportBlobByContent (content: string, options: { type: string }) { + return new Blob([content], { type: `text/${options.type};charset=utf-8;` }) +} + +export function createHtmlPage (opts: VxeTablePropTypes.PrintConfig, content: string): string { + const { style } = opts + return [ + '', + '', + '', + `${opts.sheetName}`, + '', + ``, + style ? `` : '', + '', + `${content}`, + '' + ].join('') +} diff --git a/packages/filter/src/hook.ts b/packages/table/module/filter/hook.ts similarity index 82% rename from packages/filter/src/hook.ts rename to packages/table/module/filter/hook.ts index 93de1d2c36..aabf423a1b 100644 --- a/packages/filter/src/hook.ts +++ b/packages/table/module/filter/hook.ts @@ -1,18 +1,20 @@ import { nextTick } from 'vue' import XEUtils from 'xe-utils' -import { VXETable } from '../../v-x-e-table' -import { toFilters, handleFieldOrColumn } from '../../table/src/util' -import { getDomNode, triggerEvent } from '../../tools/dom' +import { VxeUI } from '../../../ui' +import { toFilters, handleFieldOrColumn } from '../../src/util' +import { getDomNode, triggerEvent } from '../../../ui/src/dom' -import { VxeGlobalHooksHandles, TableFilterMethods, TableFilterPrivateMethods } from '../../../types/all' +import type { TableFilterMethods, TableFilterPrivateMethods } from '../../../../types' + +const { renderer, hooks } = VxeUI const tableFilterMethodKeys: (keyof TableFilterMethods)[] = ['setFilter', 'clearFilter', 'getCheckedFilters'] -const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { - setupTable ($xetable) { - const { props, reactData, internalData } = $xetable - const { refTableBody, refTableFilter } = $xetable.getRefMaps() - const { computeFilterOpts, computeMouseOpts } = $xetable.getComputeMaps() +hooks.add('tableFilterModule', { + setupTable ($xeTable) { + const { props, reactData, internalData } = $xeTable + const { refTableBody, refTableFilter } = $xeTable.getRefMaps() + const { computeFilterOpts, computeMouseOpts } = $xeTable.getComputeMaps() const filterPrivateMethods: TableFilterPrivateMethods = { checkFilterOptions () { @@ -37,7 +39,7 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { const { target: targetElem, pageX } = evnt const { visibleWidth } = getDomNode() const { filters, filterMultiple, filterRender } = column - const compConf = filterRender ? VXETable.renderer.get(filterRender.name) : null + const compConf = filterRender ? renderer.get(filterRender.name) : null const filterRecoverMethod = column.filterRecoverMethod || (compConf ? compConf.filterRecoverMethod : null) internalData._currFilterParams = params Object.assign(filterStore, { @@ -52,7 +54,7 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { option._checked = checked if (!checked && _checked !== checked) { if (filterRecoverMethod) { - filterRecoverMethod({ option, column, $table: $xetable }) + filterRecoverMethod({ option, column, $table: $xeTable }) } } }) @@ -82,7 +84,7 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { top: `${targetElem.offsetTop + targetElem.offsetParent.offsetTop + targetElem.offsetHeight + 8}px` } // 判断面板不能大于表格高度 - let maxHeight = null + let maxHeight: number | null = null if (filterHeight >= bodyElem.clientHeight) { maxHeight = Math.max(60, bodyElem.clientHeight - (filterFootElem ? filterFootElem.offsetHeight : 0) - (filterHeadElem ? filterHeadElem.offsetHeight : 0)) } @@ -110,13 +112,13 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { filterStore.maxHeight = maxHeight }) } - $xetable.dispatchEvent('filter-visible', { column, field: column.field, property: column.field, filterList: $xetable.getCheckedFilters(), visible: filterStore.visible }, evnt) + $xeTable.dispatchEvent('filter-visible', { column, field: column.field, property: column.field, filterList: $xeTable.getCheckedFilters(), visible: filterStore.visible }, evnt) }, handleClearFilter (column) { if (column) { const { filters, filterRender } = column if (filters) { - const compConf = filterRender ? VXETable.renderer.get(filterRender.name) : null + const compConf = filterRender ? renderer.get(filterRender.name) : null const filterResetMethod = column.filterResetMethod || (compConf ? compConf.filterResetMethod : null) filters.forEach((item: any) => { item._checked = false @@ -126,7 +128,7 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { } }) if (filterResetMethod) { - filterResetMethod({ options: filters, column, $table: $xetable }) + filterResetMethod({ options: filters, column, $table: $xeTable }) } } } @@ -151,35 +153,35 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { datas.push(item.data) } }) - const filterList = $xetable.getCheckedFilters() - const params = { $table: $xetable, $event: evnt, column, field, property: field, values, datas, filters: filterList, filterList } + const filterList = $xeTable.getCheckedFilters() + const params = { $table: $xeTable, $event: evnt, column, field, property: field, values, datas, filters: filterList, filterList } // 如果是服务端筛选，则跳过本地筛选处理 if (!filterOpts.remote) { - $xetable.handleTableData(true) - $xetable.checkSelectionStatus() + $xeTable.handleTableData(true) + $xeTable.checkSelectionStatus() } - if (mouseConfig && mouseOpts.area && $xetable.handleFilterEvent) { - $xetable.handleFilterEvent(evnt, params) + if (mouseConfig && mouseOpts.area && $xeTable.handleFilterEvent) { + $xeTable.handleFilterEvent(evnt, params) } - $xetable.dispatchEvent('filter-change', params, evnt) - $xetable.closeFilter() - $xetable.updateFooter().then(() => { + $xeTable.dispatchEvent('filter-change', params, evnt) + $xeTable.closeFilter() + $xeTable.updateFooter().then(() => { const { scrollXLoad, scrollYLoad } = reactData if ((oldScrollXLoad || scrollXLoad) || (oldScrollYLoad || scrollYLoad)) { if (oldScrollXLoad || scrollXLoad) { - $xetable.updateScrollXSpace() + $xeTable.updateScrollXSpace() } if (oldScrollYLoad || scrollYLoad) { - $xetable.updateScrollYSpace() + $xeTable.updateScrollYSpace() } - return $xetable.refreshScroll() + return $xeTable.refreshScroll() } }).then(() => { - $xetable.updateCellAreas() - return $xetable.recalculate(true) + $xeTable.updateCellAreas() + return $xeTable.recalculate(true) }).then(() => { // 存在滚动行为未结束情况 - setTimeout(() => $xetable.recalculate(), 50) + setTimeout(() => $xeTable.recalculate(), 50) }) } } @@ -190,11 +192,11 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { * @param column */ openFilter (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column && column.filters) { const { elemStore } = internalData const { fixed } = column - return $xetable.scrollToColumn(column).then(() => { + return $xeTable.scrollToColumn(column).then(() => { const headerWrapperRef = elemStore[`${fixed || 'main'}-header-wrapper`] || elemStore['main-header-wrapper'] const headerWrapperElem = headerWrapperRef ? headerWrapperRef.value : null if (headerWrapperElem) { @@ -211,7 +213,7 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { * @param {Array} options 选项 */ setFilter (fieldOrColumn, options) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column && column.filters) { column.filters = toFilters(options || []) } @@ -228,7 +230,7 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { const filterOpts = computeFilterOpts.value let column if (fieldOrColumn) { - column = handleFieldOrColumn($xetable, fieldOrColumn) + column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column) { filterPrivateMethods.handleClearFilter(column) } @@ -247,7 +249,7 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { }) } if (!filterOpts.remote) { - return $xetable.updateData() + return $xeTable.updateData() } return nextTick() }, @@ -276,9 +278,7 @@ const tableFilterHook: VxeGlobalHooksHandles.HookOptions = { return { ...filterMethods, ...filterPrivateMethods } }, - setupGrid ($xegrid) { - return $xegrid.extendTableMethods(tableFilterMethodKeys) + setupGrid ($xeGrid) { + return $xeGrid.extendTableMethods(tableFilterMethodKeys) } -} - -export default tableFilterHook +}) diff --git a/packages/filter/src/panel.ts b/packages/table/module/filter/panel.ts similarity index 70% rename from packages/filter/src/panel.ts rename to packages/table/module/filter/panel.ts index 0011e7e325..3a530a15ca 100644 --- a/packages/filter/src/panel.ts +++ b/packages/table/module/filter/panel.ts @@ -1,11 +1,12 @@ import { defineComponent, h, computed, inject } from 'vue' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' -import { formatText } from '../../tools/utils' -import { getPropClass } from '../../tools/dom' -import { getSlotVNs } from '../../tools/vn' +import { VxeUI } from '../../../ui' +import { formatText } from '../../../ui/src/utils' +import { getPropClass } from '../../../ui/src/dom' +import { getSlotVNs } from '../../../ui/src/vn' -import { VxeTableConstructor, VxeTableMethods, VxeTablePrivateMethods } from '../../../types/all' +import type { VxeTableConstructor, VxeTableMethods, VxeTablePrivateMethods } from '../../../../types' + +const { getI18n, getIcon, renderer } = VxeUI export default defineComponent({ name: 'VxeTableFilterPanel', @@ -13,8 +14,8 @@ export default defineComponent({ filterStore: Object as any }, setup (props) { - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) - const { reactData: tableReactData, internalData: tableInternalData, getComputeMaps } = $xetable + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) + const { reactData: tableReactData, internalData: tableInternalData, getComputeMaps } = $xeTable const { computeFilterOpts } = getComputeMaps() const computeHasCheckOption = computed(() => { @@ -42,7 +43,7 @@ export default defineComponent({ filterStore.options.forEach((option: any) => { option.checked = option._checked }) - $xetable.confirmFilterEvent(evnt) + $xeTable.confirmFilterEvent(evnt) } // （单选）筛选发生改变 @@ -52,7 +53,7 @@ export default defineComponent({ option._checked = false }) item._checked = checked - $xetable.checkFilterOptions() + $xeTable.checkFilterOptions() confirmFilter(evnt) } @@ -63,14 +64,14 @@ export default defineComponent({ */ const resetFilter = (evnt: Event) => { const { filterStore } = props - $xetable.handleClearFilter(filterStore.column) - $xetable.confirmFilterEvent(evnt) + $xeTable.handleClearFilter(filterStore.column) + $xeTable.confirmFilterEvent(evnt) } // （多选）筛选发生改变 const changeMultipleOption = (evnt: Event, checked: boolean, item: any) => { item._checked = checked - $xetable.checkFilterOptions() + $xeTable.checkFilterOptions() } // 筛选发生改变 @@ -109,12 +110,12 @@ export default defineComponent({ const { column, multiple, maxHeight } = filterStore const { slots } = column const filterSlot = slots ? slots.filter : null - const params = Object.assign({}, tableInternalData._currFilterParams, { $panel, $table: $xetable }) + const params = Object.assign({}, tableInternalData._currFilterParams, { $panel, $table: $xeTable }) if (filterSlot) { return [ h('div', { class: 'vxe-table--filter-template' - }, $xetable.callSlot(filterSlot, params)) + }, $xeTable.callSlot(filterSlot, params)) ] } else if (compConf && compConf.renderFilter) { return [ @@ -134,25 +135,29 @@ export default defineComponent({ 'is--checked': isAllChecked, 'is--indeterminate': isAllIndeterminate }], - title: GlobalConfig.i18n(multiple ? 'vxe.table.allTitle' : 'vxe.table.allFilter'), + title: getI18n(multiple ? 'vxe.table.allTitle' : 'vxe.table.allFilter'), onClick: (evnt: MouseEvent) => { changeAllOption(evnt, !filterStore.isAllSelected) } - }, (multiple ? [ - h('span', { - class: ['vxe-checkbox--icon', isAllIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] - }) - ] : []).concat([ + }, (multiple + ? [ + h('span', { + class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] + }) + ] + : []).concat([ h('span', { class: 'vxe-checkbox--label' - }, GlobalConfig.i18n('vxe.table.allFilter')) + }, getI18n('vxe.table.allFilter')) ])) ]), h('ul', { class: 'vxe-table--filter-body', - style: maxHeight ? { - maxHeight: `${maxHeight}px` - } : {} + style: maxHeight + ? { + maxHeight: `${maxHeight}px` + } + : {} }, filterStore.options.map((item: any) => { const isChecked = item._checked const isIndeterminate = false @@ -164,11 +169,13 @@ export default defineComponent({ onClick: (evnt: MouseEvent) => { changeOption(evnt, !item._checked, item) } - }, (multiple ? [ - h('span', { - class: ['vxe-checkbox--icon', isIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] - }) - ] : []).concat([ + }, (multiple + ? [ + h('span', { + class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] + }) + ] + : []).concat([ h('span', { class: 'vxe-checkbox--label' }, formatText(item.label, 1)) @@ -183,24 +190,26 @@ export default defineComponent({ const filterOpts = computeFilterOpts.value const hasCheckOption = computeHasCheckOption.value const filterRender = column.filterRender - const compConf = filterRender ? VXETable.renderer.get(filterRender.name) : null + const compConf = filterRender ? renderer.get(filterRender.name) : null const isDisabled = !hasCheckOption && !filterStore.isAllSelected && !filterStore.isIndeterminate - return multiple && (!compConf || compConf.showFilterFooter !== false) ? [ - h('div', { - class: 'vxe-table--filter-footer' - }, [ - h('button', { - class: { - 'is--disabled': isDisabled - }, - disabled: isDisabled, - onClick: confirmFilter - }, filterOpts.confirmButtonText || GlobalConfig.i18n('vxe.table.confirmFilter')), - h('button', { - onClick: resetFilter - }, filterOpts.resetButtonText || GlobalConfig.i18n('vxe.table.resetFilter')) - ]) - ] : [] + return multiple && (!compConf || compConf.showFilterFooter !== false) + ? [ + h('div', { + class: 'vxe-table--filter-footer' + }, [ + h('button', { + class: { + 'is--disabled': isDisabled + }, + disabled: isDisabled, + onClick: confirmFilter + }, filterOpts.confirmButtonText || getI18n('vxe.table.confirmFilter')), + h('button', { + onClick: resetFilter + }, filterOpts.resetButtonText || getI18n('vxe.table.resetFilter')) + ]) + ] + : [] } const renderVN = () => { @@ -208,16 +217,16 @@ export default defineComponent({ const { initStore } = tableReactData const { column } = filterStore const filterRender = column ? column.filterRender : null - const compConf = filterRender ? VXETable.renderer.get(filterRender.name) : null + const compConf = filterRender ? renderer.get(filterRender.name) : null const filterClassName = compConf ? compConf.filterClassName : '' - const params = Object.assign({}, tableInternalData._currFilterParams, { $panel, $table: $xetable }) + const params = Object.assign({}, tableInternalData._currFilterParams, { $panel, $table: $xeTable }) return h('div', { class: [ 'vxe-table--filter-wrapper', 'filter--prevent-default', getPropClass(filterClassName, params), { - 'is--animat': $xetable.props.animat, + 'is--animat': $xeTable.props.animat, 'is--multiple': filterStore.multiple, 'is--active': filterStore.visible } diff --git a/packages/keyboard/src/hook.ts b/packages/table/module/keyboard/hook.ts similarity index 83% rename from packages/keyboard/src/hook.ts rename to packages/table/module/keyboard/hook.ts index f9bd3018e0..93b68da71c 100644 --- a/packages/keyboard/src/hook.ts +++ b/packages/table/module/keyboard/hook.ts @@ -1,7 +1,10 @@ import XEUtils from 'xe-utils' -import { browse, hasClass, getAbsolutePos, addClass, removeClass, getEventTargetNode } from '../../tools/dom' +import { VxeUI } from 'vxe-pc-ui' +import { browse, hasClass, getAbsolutePos, addClass, removeClass, getEventTargetNode } from '../../../ui/src/dom' -import { VxeGlobalHooksHandles, TableKeyboardPrivateMethods } from '../../../types/all' +import type { TableKeyboardPrivateMethods } from '../../../../types' + +const { hooks } = VxeUI function getTargetOffset (target: any, container: any) { let offsetTop = 0 @@ -25,21 +28,21 @@ function getTargetOffset (target: any, container: any) { return { offsetTop, offsetLeft } } -const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { - setupTable ($xetable) { - const { props, reactData, internalData } = $xetable - const { refElem } = $xetable.getRefMaps() - const { computeEditOpts, computeCheckboxOpts, computeMouseOpts, computeTreeOpts } = $xetable.getComputeMaps() +hooks.add('tableKeyboardModule', { + setupTable ($xeTable) { + const { props, reactData, internalData } = $xeTable + const { refElem } = $xeTable.getRefMaps() + const { computeEditOpts, computeCheckboxOpts, computeMouseOpts, computeTreeOpts } = $xeTable.getComputeMaps() function getCheckboxRangeRows (params: any, targetTrElem: any, moveRange: any) { let countHeight = 0 - let rangeRows = [] + let rangeRows: any[] = [] const isDown = moveRange > 0 const moveSize = moveRange > 0 ? moveRange : (Math.abs(moveRange) + targetTrElem.offsetHeight) const { scrollYLoad } = reactData const { afterFullData, scrollYStore } = internalData if (scrollYLoad) { - const _rowIndex = $xetable.getVTRowIndex(params.row) + const _rowIndex = $xeTable.getVTRowIndex(params.row) if (isDown) { rangeRows = afterFullData.slice(_rowIndex, _rowIndex + Math.ceil(moveSize / scrollYStore.rowHeight)) } else { @@ -48,7 +51,7 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { } else { const siblingProp = isDown ? 'next' : 'previous' while (targetTrElem && countHeight < moveSize) { - const rowNodeRest = $xetable.getRowNode(targetTrElem) + const rowNodeRest = $xeTable.getRowNode(targetTrElem) if (rowNodeRest) { rangeRows.push(rowNodeRest.item) countHeight += targetTrElem.offsetHeight @@ -75,8 +78,8 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { const domMousemove = document.onmousemove const domMouseup = document.onmouseup const trElem = cell.parentNode - const selectRecords = $xetable.getCheckboxRecords() - let lastRangeRows = [] + const selectRecords = $xeTable.getCheckboxRecords() + let lastRangeRows: any[] = [] const marginSize = 1 const offsetRest = getTargetOffset(evnt.target, bodyWrapperElem) const startTop = offsetRest.offsetTop + evnt.offsetY @@ -87,7 +90,7 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { let isMouseScrollDown: any = false let mouseScrollSpaceSize = 1 const triggerEvent = (type: 'change' | 'start' | 'end', evnt: MouseEvent) => { - $xetable.dispatchEvent(`checkbox-range-${type}` as 'checkbox-range-change' | 'checkbox-range-start' | 'checkbox-range-end', { records: $xetable.getCheckboxRecords(), reserves: $xetable.getCheckboxReserveRecords() }, evnt) + $xeTable.dispatchEvent(`checkbox-range-${type}` as 'checkbox-range-change' | 'checkbox-range-start' | 'checkbox-range-end', { records: $xeTable.getCheckboxRecords(), reserves: $xeTable.getCheckboxReserveRecords() }, evnt) } const handleChecked = (evnt: MouseEvent) => { const { clientX, clientY } = evnt @@ -130,11 +133,11 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { lastRangeRows = rangeRows if (evnt.ctrlKey) { rangeRows.forEach((row: any) => { - $xetable.handleSelectRow({ row }, selectRecords.indexOf(row) === -1) + $xeTable.handleSelectRow({ row }, selectRecords.indexOf(row) === -1) }) } else { - $xetable.setAllCheckboxRow(false) - $xetable.handleCheckedCheckboxRow(rangeRows, true, false) + $xeTable.setAllCheckboxRow(false) + $xeTable.handleCheckedCheckboxRow(rangeRows, true, false) } triggerEvent('change', evnt) } @@ -153,7 +156,7 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { const topSize = Math.ceil(mouseScrollSpaceSize * 50 / rowHeight) if (isMouseScrollDown) { if (scrollTop + clientHeight < scrollHeight) { - $xetable.scrollTo(scrollLeft, scrollTop + topSize) + $xeTable.scrollTo(scrollLeft, scrollTop + topSize) startMouseScroll(evnt) handleChecked(evnt) } else { @@ -161,7 +164,7 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { } } else { if (scrollTop) { - $xetable.scrollTo(scrollLeft, scrollTop - topSize) + $xeTable.scrollTo(scrollLeft, scrollTop - topSize) startMouseScroll(evnt) handleChecked(evnt) } else { @@ -212,15 +215,15 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { const checkboxOpts = computeCheckboxOpts.value const mouseOpts = computeMouseOpts.value const editOpts = computeEditOpts.value - if (mouseConfig && mouseOpts.area && $xetable.handleCellAreaEvent) { - return $xetable.handleCellAreaEvent(evnt, params) + if (mouseConfig && mouseOpts.area && $xeTable.handleCellAreaEvent) { + return $xeTable.handleCellAreaEvent(evnt, params) } else { if (checkboxConfig && checkboxOpts.range) { handleCheckboxRangeEvent(evnt, params) } if (mouseConfig && mouseOpts.selected) { if (!editConfig || editOpts.mode === 'cell') { - $xetable.handleSelected(params, evnt) + $xeTable.handleSelected(params, evnt) } } } @@ -236,8 +239,8 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { let targetRowIndex: any let targetColumnIndex: any const params = Object.assign({}, args) - const _rowIndex = $xetable.getVTRowIndex(params.row) - const _columnIndex = $xetable.getVTColumnIndex(params.column) + const _rowIndex = $xeTable.getVTRowIndex(params.row) + const _columnIndex = $xeTable.getVTColumnIndex(params.column) evnt.preventDefault() if (isLeft) { // 向左 @@ -273,19 +276,19 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { } params.columnIndex = targetColumnIndex params.column = targetColumn - params.cell = $xetable.getCell(params.row, params.column) + params.cell = $xeTable.getCell(params.row, params.column) if (editConfig) { if (editOpts.trigger === 'click' || editOpts.trigger === 'dblclick') { if (editOpts.mode === 'row') { - $xetable.handleActived(params, evnt) + $xeTable.handleActived(params, evnt) } else { - $xetable.scrollToRow(params.row, params.column) - .then(() => $xetable.handleSelected(params, evnt)) + $xeTable.scrollToRow(params.row, params.column) + .then(() => $xeTable.handleSelected(params, evnt)) } } } else { - $xetable.scrollToRow(params.row, params.column) - .then(() => $xetable.handleSelected(params, evnt)) + $xeTable.scrollToRow(params.row, params.column) + .then(() => $xeTable.handleSelected(params, evnt)) } } }, @@ -307,7 +310,7 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { targetRow = items[index + 1] } } else { - const _rowIndex = $xetable.getVTRowIndex(currentRow) + const _rowIndex = $xeTable.getVTRowIndex(currentRow) if (isUpArrow && _rowIndex > 0) { targetRow = afterFullData[_rowIndex - 1] } else if (isDwArrow && _rowIndex < afterFullData.length - 1) { @@ -319,21 +322,21 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { } if (targetRow) { const params = { - $table: $xetable, + $table: $xeTable, row: targetRow, - rowIndex: $xetable.getRowIndex(targetRow), - $rowIndex: $xetable.getVMRowIndex(targetRow) + rowIndex: $xeTable.getRowIndex(targetRow), + $rowIndex: $xeTable.getVMRowIndex(targetRow) } - $xetable.scrollToRow(targetRow) - .then(() => $xetable.triggerCurrentRowEvent(evnt, params)) + $xeTable.scrollToRow(targetRow) + .then(() => $xeTable.triggerCurrentRowEvent(evnt, params)) } }, // 处理可编辑方向键移动 moveSelected (args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, evnt) { const { afterFullData, visibleColumn } = internalData const params = Object.assign({}, args) - const _rowIndex = $xetable.getVTRowIndex(params.row) - const _columnIndex = $xetable.getVTColumnIndex(params.column) + const _rowIndex = $xeTable.getVTRowIndex(params.row) + const _columnIndex = $xeTable.getVTColumnIndex(params.column) evnt.preventDefault() if (isUpArrow && _rowIndex > 0) { // 移动到上一行 @@ -352,9 +355,9 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { params.columnIndex = _columnIndex + 1 params.column = visibleColumn[params.columnIndex] } - $xetable.scrollToRow(params.row, params.column).then(() => { - params.cell = $xetable.getCell(params.row, params.column) - $xetable.handleSelected(params, evnt) + $xeTable.scrollToRow(params.row, params.column).then(() => { + params.cell = $xeTable.getCell(params.row, params.column) + $xeTable.handleSelected(params, evnt) }) }, /** @@ -363,15 +366,15 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { triggerHeaderCellMousedownEvent (evnt, params) { const { mouseConfig } = props const mouseOpts = computeMouseOpts.value - if (mouseConfig && mouseOpts.area && $xetable.handleHeaderCellAreaEvent) { + if (mouseConfig && mouseOpts.area && $xeTable.handleHeaderCellAreaEvent) { const cell = evnt.currentTarget const triggerSort = getEventTargetNode(evnt, cell, 'vxe-cell--sort').flag const triggerFilter = getEventTargetNode(evnt, cell, 'vxe-cell--filter').flag - $xetable.handleHeaderCellAreaEvent(evnt, Object.assign({ cell, triggerSort, triggerFilter }, params)) + $xeTable.handleHeaderCellAreaEvent(evnt, Object.assign({ cell, triggerSort, triggerFilter }, params)) } - $xetable.focus() - if ($xetable.closeMenu) { - $xetable.closeMenu() + $xeTable.focus() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } }, /** @@ -381,16 +384,14 @@ const tableKeyboardHook: VxeGlobalHooksHandles.HookOptions = { const cell = evnt.currentTarget params.cell = cell handleCellMousedownEvent(evnt, params) - $xetable.focus() - $xetable.closeFilter() - if ($xetable.closeMenu) { - $xetable.closeMenu() + $xeTable.focus() + $xeTable.closeFilter() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } } } return keyboardMethods } -} - -export default tableKeyboardHook +}) diff --git a/packages/menu/src/hooks.ts b/packages/table/module/menu/hook.ts similarity index 85% rename from packages/menu/src/hooks.ts rename to packages/table/module/menu/hook.ts index 1893058650..ea28946b8f 100644 --- a/packages/menu/src/hooks.ts +++ b/packages/table/module/menu/hook.ts @@ -1,19 +1,20 @@ import { nextTick } from 'vue' import XEUtils from 'xe-utils' -import { VXETable } from '../../v-x-e-table' -import { getDomNode, getAbsolutePos, getEventTargetNode } from '../../tools/dom' -import { isEnableConf, hasChildrenList } from '../../tools/utils' -import { hasEventKey, EVENT_KEYS } from '../../tools/event' +import { VxeUI } from '../../../ui' +import { getDomNode, getAbsolutePos, getEventTargetNode } from '../../../ui/src/dom' +import { isEnableConf, hasChildrenList } from '../../../ui/src/utils' -import { VxeGlobalHooksHandles, TableMenuMethods, TableMenuPrivateMethods } from '../../../types/all' +import type { TableMenuMethods, TableMenuPrivateMethods } from '../../../../types' + +const { menus, hooks, globalEvents, GLOBAL_EVENT_KEYS } = VxeUI const tableMenuMethodKeys: (keyof TableMenuMethods)[] = ['closeMenu'] -const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { - setupTable ($xetable) { - const { xID, props, reactData, internalData } = $xetable - const { refElem, refTableFilter, refTableMenu } = $xetable.getRefMaps() - const { computeMouseOpts, computeIsMenu, computeMenuOpts } = $xetable.getComputeMaps() +hooks.add('tableMenuModule', { + setupTable ($xeTable) { + const { xID, props, reactData, internalData } = $xeTable + const { refElem, refTableFilter, refTableMenu } = $xeTable.getRefMaps() + const { computeMouseOpts, computeIsMenu, computeMenuOpts } = $xeTable.getComputeMaps() let menuMethods = {} as TableMenuMethods let menuPrivateMethods = {} as TableMenuPrivateMethods @@ -33,10 +34,10 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { evnt.preventDefault() } else if (isMenu && options && options.length) { params.options = options - $xetable.preventEvent(evnt, 'event.showMenu', params, () => { + $xeTable.preventEvent(evnt, 'event.showMenu', params, () => { if (!visibleMethod || visibleMethod(params)) { evnt.preventDefault() - $xetable.updateZindex() + $xeTable.updateZindex() const { scrollTop, scrollLeft, visibleHeight, visibleWidth } = getDomNode() let top = evnt.clientY + scrollTop let left = evnt.clientX + scrollLeft @@ -72,8 +73,8 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { } const { keyboard, row, column } = params if (keyboard && row && column) { - $xetable.scrollToRow(row, column).then(() => { - const cell = $xetable.getCell(row, column) + $xeTable.scrollToRow(row, column).then(() => { + const cell = $xeTable.getCell(row, column) if (cell) { const { boundingTop, boundingLeft } = getAbsolutePos(cell) top = boundingTop + scrollTop + Math.floor(cell.offsetHeight / 2) @@ -90,7 +91,7 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { }) } } - $xetable.closeFilter() + $xeTable.closeFilter() } menuMethods = { @@ -122,7 +123,7 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { ctxMenuStore.showChild = false ctxMenuStore.selectChild = null } - } else if (hasEventKey(evnt, EVENT_KEYS.ARROW_UP)) { + } else if (globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP)) { for (let len = selectIndex - 1; len >= 0; len--) { if (menuList[len].visible !== false) { selectItem = menuList[len] @@ -130,7 +131,7 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { } } ctxMenuStore[property] = selectItem || menuList[menuList.length - 1] - } else if (hasEventKey(evnt, EVENT_KEYS.ARROW_DOWN)) { + } else if (globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN)) { for (let index = selectIndex + 1; index < menuList.length; index++) { if (menuList[index].visible !== false) { selectItem = menuList[index] @@ -138,7 +139,7 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { } } ctxMenuStore[property] = selectItem || menuList[0] - } else if (ctxMenuStore[property] && (hasEventKey(evnt, EVENT_KEYS.ENTER) || hasEventKey(evnt, EVENT_KEYS.SPACEBAR))) { + } else if (ctxMenuStore[property] && (globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ENTER) || globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.SPACEBAR))) { menuPrivateMethods.ctxMenuLinkEvent(evnt, ctxMenuStore[property]) } }, @@ -164,10 +165,10 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { } if (internalData._keyCtx) { const type = 'body' - const params: any = { type, $table: $xetable, keyboard: true, columns: visibleColumn.slice(0), $event: evnt } + const params: any = { type, $table: $xeTable, keyboard: true, columns: visibleColumn.slice(0), $event: evnt } // 如果开启单元格区域 if (mouseConfig && mouseOpts.area) { - const activeArea = $xetable.getActiveCellArea() + const activeArea = $xeTable.getActiveCellArea() if (activeArea && activeArea.row && activeArea.column) { params.row = activeArea.row params.column = activeArea.column @@ -191,27 +192,27 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { // target=td|th，直接向上找 table 去匹配即可 return target.parentNode.parentNode.parentNode.getAttribute('xid') === xID }) - const params: any = { type: layout, $table: $xetable, columns: visibleColumn.slice(0), $event: evnt } + const params: any = { type: layout, $table: $xeTable, columns: visibleColumn.slice(0), $event: evnt } if (columnTargetNode.flag) { const cell = columnTargetNode.targetElem - const columnNodeRest = $xetable.getColumnNode(cell) + const columnNodeRest = $xeTable.getColumnNode(cell) const column = columnNodeRest ? columnNodeRest.item : null let typePrefix = `${layout}-` if (column) { - Object.assign(params, { column, columnIndex: $xetable.getColumnIndex(column), cell }) + Object.assign(params, { column, columnIndex: $xeTable.getColumnIndex(column), cell }) } if (layout === 'body') { - const rowNodeRest = $xetable.getRowNode(cell.parentNode) + const rowNodeRest = $xeTable.getRowNode(cell.parentNode) const row = rowNodeRest ? rowNodeRest.item : null typePrefix = '' if (row) { params.row = row - params.rowIndex = $xetable.getRowIndex(row) + params.rowIndex = $xeTable.getRowIndex(row) } } const eventType = `${typePrefix}cell-menu` as 'cell-menu' | 'header-cell-menu' | 'footer-cell-menu' handleOpenMenuEvent(evnt, layout, params) - $xetable.dispatchEvent(eventType, params, evnt) + $xeTable.dispatchEvent(eventType, params, evnt) return } else if (getEventTargetNode(evnt, el, `vxe-table--${layout}-wrapper`, target => target.getAttribute('xid') === xID).flag) { if (menuOpts.trigger === 'cell') { @@ -224,7 +225,7 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { } } if (tableFilter && !getEventTargetNode(evnt, tableFilter.$el).flag) { - $xetable.closeFilter() + $xeTable.closeFilter() } menuMethods.closeMenu() }, @@ -280,12 +281,12 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { ctxMenuLinkEvent (evnt, menu) { // 如果一级菜单有配置 code 则允许点击，否则不能点击 if (!menu.disabled && (menu.code || !menu.children || !menu.children.length)) { - const gMenuOpts = VXETable.menus.get(menu.code) - const params = Object.assign({}, internalData._currMenuParams, { menu, $table: $xetable, $grid: $xetable.xegrid, $event: evnt }) + const gMenuOpts = menus.get(menu.code) + const params = Object.assign({}, internalData._currMenuParams, { menu, $table: $xeTable, $grid: $xeTable.xegrid, $event: evnt }) if (gMenuOpts && gMenuOpts.menuMethod) { gMenuOpts.menuMethod(params, evnt) } - $xetable.dispatchEvent('menu-click', params, evnt) + $xeTable.dispatchEvent('menu-click', params, evnt) menuMethods.closeMenu() } } @@ -293,9 +294,7 @@ const tableMenuHook: VxeGlobalHooksHandles.HookOptions = { return { ...menuMethods, ...menuPrivateMethods } }, - setupGrid ($xegrid) { - return $xegrid.extendTableMethods(tableMenuMethodKeys) + setupGrid ($xeGrid) { + return $xeGrid.extendTableMethods(tableMenuMethodKeys) } -} - -export default tableMenuHook +}) diff --git a/packages/table/module/menu/panel.ts b/packages/table/module/menu/panel.ts new file mode 100644 index 0000000000..c0facb6cc0 --- /dev/null +++ b/packages/table/module/menu/panel.ts @@ -0,0 +1,133 @@ +import { defineComponent, h, Teleport, inject, ref, Ref, createCommentVNode } from 'vue' +import { getFuncText } from '../../../ui/src/utils' +import XEUtils from 'xe-utils' + +import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods } from '../../../../types' + +export default defineComponent({ + name: 'VxeTableMenuPanel', + setup (props, context) { + const xID = XEUtils.uniqueId() + + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) + + const { reactData: tableReactData } = $xeTable + + const refElem = ref() as Ref + + const refMaps = { + refElem + } + + const $xemenupanel: any = { + xID, + props, + context, + getRefMaps: () => refMaps + } + + const renderVN = () => { + const { ctxMenuStore } = tableReactData + const { computeMenuOpts } = $xeTable.getComputeMaps() + const menuOpts = computeMenuOpts.value + + return h(Teleport, { + to: 'body', + disabled: false + }, [ + h('div', { + ref: refElem, + class: ['vxe-table--context-menu-wrapper', menuOpts.className, { + 'is--visible': ctxMenuStore.visible + }], + style: ctxMenuStore.style + }, ctxMenuStore.list.map((options, gIndex) => { + return options.every(item => item.visible === false) + ? createCommentVNode() + : h('ul', { + class: 'vxe-context-menu--option-wrapper', + key: gIndex + }, options.map((item, index) => { + const hasChildMenus = item.children && item.children.some((child: any) => child.visible !== false) + return item.visible === false + ? null + : h('li', { + class: [item.className, { + 'link--disabled': item.disabled, + 'link--active': item === ctxMenuStore.selected + }], + key: `${gIndex}_${index}` + }, [ + h('a', { + class: 'vxe-context-menu--link', + onClick (evnt: Event) { + $xeTable.ctxMenuLinkEvent(evnt, item) + }, + onMouseover (evnt: Event) { + $xeTable.ctxMenuMouseoverEvent(evnt, item) + }, + onMouseout (evnt: Event) { + $xeTable.ctxMenuMouseoutEvent(evnt, item) + } + }, [ + h('i', { + class: ['vxe-context-menu--link-prefix', item.prefixIcon] + }), + h('span', { + class: 'vxe-context-menu--link-content' + }, getFuncText(item.name)), + h('i', { + class: ['vxe-context-menu--link-suffix', hasChildMenus ? item.suffixIcon || 'suffix--haschild' : item.suffixIcon] + }) + ]), + hasChildMenus + ? h('ul', { + class: ['vxe-table--context-menu-clild-wrapper', { + 'is--show': item === ctxMenuStore.selected && ctxMenuStore.showChild + }] + }, item.children.map((child: any, cIndex: any) => { + return child.visible === false + ? null + : h('li', { + class: [child.className, { + 'link--disabled': child.disabled, + 'link--active': child === ctxMenuStore.selectChild + }], + key: `${gIndex}_${index}_${cIndex}` + }, [ + h('a', { + class: 'vxe-context-menu--link', + onClick (evnt: Event) { + $xeTable.ctxMenuLinkEvent(evnt, child) + }, + onMouseover (evnt: Event) { + $xeTable.ctxMenuMouseoverEvent(evnt, item, child) + }, + onMouseout (evnt: Event) { + $xeTable.ctxMenuMouseoutEvent(evnt, item) + } + }, [ + h('i', { + class: ['vxe-context-menu--link-prefix', child.prefixIcon] + }), + h('span', { + class: 'vxe-context-menu--link-content' + }, getFuncText(child.name)) + ]) + ]) + })) + : null + ]) + })) + })) + ]) + } + + $xemenupanel.renderVN = renderVN + + return $xemenupanel + }, + render () { + return this.renderVN() + } +}) diff --git a/packages/validator/src/hook.ts b/packages/table/module/validator/hook.ts similarity index 85% rename from packages/validator/src/hook.ts rename to packages/table/module/validator/hook.ts index 20cd1932ec..4f7cefbdd9 100644 --- a/packages/validator/src/hook.ts +++ b/packages/table/module/validator/hook.ts @@ -1,13 +1,14 @@ import { nextTick } from 'vue' -import GlobalConfig from '../../v-x-e-table/src/conf' import XEUtils from 'xe-utils' -import { VXETable } from '../../v-x-e-table' -import { getFuncText, eqEmptyValue } from '../../tools/utils' -import { scrollToView } from '../../tools/dom' -import { errLog, warnLog } from '../../tools/log' -import { handleFieldOrColumn, getRowid } from '../../table/src/util' +import { VxeUI } from '../../../ui' +import { getFuncText, eqEmptyValue } from '../../../ui/src/utils' +import { scrollToView } from '../../../ui/src/dom' +import { handleFieldOrColumn, getRowid } from '../../src/util' +import { warnLog, errLog } from '../../../ui/src/log' -import { VxeGlobalHooksHandles, TableValidatorMethods, TableValidatorPrivateMethods, VxeTableDefines } from '../../../types/all' +import type { TableValidatorMethods, TableValidatorPrivateMethods, VxeTableDefines } from '../../../../types' + +const { getConfig, validators, hooks } = VxeUI /** * 校验规则 @@ -44,11 +45,11 @@ class Rule { const tableValidatorMethodKeys: (keyof TableValidatorMethods)[] = ['fullValidate', 'validate', 'clearValidate'] -const validatorHook: VxeGlobalHooksHandles.HookOptions = { - setupTable ($xetable) { - const { props, reactData, internalData } = $xetable - const { refValidTooltip } = $xetable.getRefMaps() - const { computeValidOpts, computeTreeOpts, computeEditOpts } = $xetable.getComputeMaps() +hooks.add('tableValidatorModule', { + setupTable ($xeTable) { + const { props, reactData, internalData } = $xeTable + const { refValidTooltip } = $xeTable.getRefMaps() + const { computeValidOpts, computeTreeOpts, computeEditOpts } = $xeTable.getComputeMaps() let validatorMethods = {} as TableValidatorMethods let validatorPrivateMethods = {} as TableValidatorPrivateMethods @@ -62,10 +63,10 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { return new Promise(resolve => { const validOpts = computeValidOpts.value if (validOpts.autoPos === false) { - $xetable.dispatchEvent('valid-error', params, null) + $xeTable.dispatchEvent('valid-error', params, null) resolve() } else { - $xetable.handleActived(params, { type: 'valid-error', trigger: 'call' }).then(() => { + $xeTable.handleActived(params, { type: 'valid-error', trigger: 'call' }).then(() => { resolve(validatorPrivateMethods.showValidTooltip(params)) }) } @@ -112,21 +113,21 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { const treeOpts = computeTreeOpts.value const childrenField = treeOpts.children || treeOpts.childrenField const validOpts = computeValidOpts.value - let validDatas + let validList if (rows === true) { - validDatas = afterFullData + validList = afterFullData } else if (rows) { if (XEUtils.isFunction(rows)) { cb = rows } else { - validDatas = XEUtils.isArray(rows) ? rows : [rows] + validList = XEUtils.isArray(rows) ? rows : [rows] } } - if (!validDatas) { - if ($xetable.getInsertRecords) { - validDatas = $xetable.getInsertRecords().concat($xetable.getUpdateRecords()) + if (!validList) { + if ($xeTable.getInsertRecords) { + validList = $xeTable.getInsertRecords().concat($xeTable.getUpdateRecords()) } else { - validDatas = [] + validList = [] } } const rowValidErrs: any = [] @@ -140,7 +141,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { content: any; }> = {} if (editRules) { - const columns = $xetable.getColumns() + const columns = $xeTable.getColumns() const handleVaild = (row: any) => { if (isFull || !validRuleErr) { const colVailds: any[] = [] @@ -152,17 +153,17 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { const rest = { rule, rules, - rowIndex: $xetable.getRowIndex(row), + rowIndex: $xeTable.getRowIndex(row), row, - columnIndex: $xetable.getColumnIndex(column), + columnIndex: $xeTable.getColumnIndex(column), column, field: column.property, - $table: $xetable + $table: $xeTable } if (!validRest[column.property]) { validRest[column.property] = [] } - validErrMaps[`${getRowid($xetable, row)}:${column.id}`] = { + validErrMaps[`${getRowid($xeTable, row)}:${column.id}`] = { column, row, rule, @@ -181,9 +182,9 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { } } if (treeConfig) { - XEUtils.eachTree(validDatas, handleVaild, { children: childrenField }) + XEUtils.eachTree(validList, handleVaild, { children: childrenField }) } else { - validDatas.forEach(handleVaild) + validList.forEach(handleVaild) } return Promise.all(rowValidErrs).then(() => { const ruleProps = Object.keys(validRest) @@ -204,7 +205,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { cb(validRest) resolve() } else { - if (GlobalConfig.validToReject === 'obsolete') { + if (getConfig().validToReject === 'obsolete') { // 已废弃，校验失败将不会执行catch reject(validRest) } else { @@ -214,7 +215,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { }) } const posAndFinish = () => { - firstErrParams.cell = $xetable.getCell(firstErrParams.row, firstErrParams.column) + firstErrParams.cell = $xeTable.getCell(firstErrParams.row, firstErrParams.column) scrollToView(firstErrParams.cell) handleValidError(firstErrParams).then(finish) } @@ -232,7 +233,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { const columnIndex = visibleColumn.indexOf(column) const targetRow = rowIndex > 0 ? afterFullData[rowIndex - 1] : row const targetColumn = columnIndex > 0 ? visibleColumn[columnIndex - 1] : column - $xetable.scrollToRow(targetRow, targetColumn).then(posAndFinish) + $xeTable.scrollToRow(targetRow, targetColumn).then(posAndFinish) } }) }) @@ -251,7 +252,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { * 完整校验，和 validate 的区别就是会给有效数据中的每一行进行校验 */ fullValidate (rows, cb) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (XEUtils.isFunction(cb)) { warnLog('vxe.error.notValidators', ['fullValidate(rows, callback)', 'fullValidate(rows)']) } @@ -262,7 +263,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { * 快速校验，如果存在记录不通过的记录，则返回不再继续校验（异步校验除外） */ validate (rows, cb) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (XEUtils.isFunction(cb)) { warnLog('vxe.error.notValidators', ['validate(rows, callback)', 'validate(rows)']) } @@ -274,7 +275,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { const validTip = refValidTooltip.value const validOpts = computeValidOpts.value const rowList = XEUtils.isArray(rows) ? rows : (rows ? [rows] : []) - const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : []).map(column => handleFieldOrColumn($xetable, column))) as VxeTableDefines.ColumnInfo[] + const colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : []).map(column => handleFieldOrColumn($xeTable, column))) as VxeTableDefines.ColumnInfo[] let validErrMaps: Record { colList.forEach((column) => { - const validKey = `${getRowid($xetable, row)}:${column.id}` + const validKey = `${getRowid($xeTable, row)}:${column.id}` if (validErrMaps[validKey]) { delete validErrMaps[validKey] } }) }) } else if (rowList.length) { - const rowidList = rowList.map(row => `${getRowid($xetable, row)}`) + const rowIdList = rowList.map(row => `${getRowid($xeTable, row)}`) XEUtils.each(validErrorMaps, (item, key) => { - if (rowidList.indexOf(key.split(':')[0]) > -1) { + if (rowIdList.indexOf(key.split(':')[0]) > -1) { validErrMaps[key] = item } }) @@ -361,7 +362,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { const { editRules } = props const { field } = column const errorRules: Rule[] = [] - const syncVailds: Promise[] = [] + const syncValidList: Promise[] = [] if (field && editRules) { const rules = XEUtils.get(editRules, field) if (rules) { @@ -375,26 +376,26 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { rule, rules, row, - rowIndex: $xetable.getRowIndex(row), + rowIndex: $xeTable.getRowIndex(row), column, - columnIndex: $xetable.getColumnIndex(column), + columnIndex: $xeTable.getColumnIndex(column), field: column.field, - $table: $xetable, - $grid: $xetable.xegrid + $table: $xeTable, + $grid: $xeTable.xegrid } let customValid: any if (XEUtils.isString(validator)) { - const gvItem = VXETable.validators.get(validator) + const gvItem = validators.get(validator) if (gvItem) { if (gvItem.cellValidatorMethod) { customValid = gvItem.cellValidatorMethod(validParams) } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.notValidators', [validator]) } } } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notValidators', [validator]) } } @@ -407,7 +408,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { errorRules.push(new Rule({ type: 'custom', trigger, content: customValid.message, rule: new Rule(rule) })) } else if (customValid.catch) { // 如果为异步校验（注：异步校验是并发无序的） - syncVailds.push( + syncValidList.push( customValid.catch((e: any) => { validRuleErr = true errorRules.push(new Rule({ type: 'custom', trigger, content: e && e.message ? e.message : (rule.content || rule.message), rule: new Rule(rule) })) @@ -435,7 +436,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { }) } } - return Promise.all(syncVailds).then(() => { + return Promise.all(syncValidList).then(() => { if (errorRules.length) { const rest = { rules: errorRules, rule: errorRules[0] } return Promise.reject(rest) @@ -499,7 +500,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { validStore.visible = true if (validOpts.msgMode === 'single') { reactData.validErrorMaps = { - [`${getRowid($xetable, row)}:${column.id}`]: { + [`${getRowid($xeTable, row)}:${column.id}`]: { column, row, rule, @@ -508,7 +509,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { } } else { reactData.validErrorMaps = Object.assign({}, validErrorMaps, { - [`${getRowid($xetable, row)}:${column.id}`]: { + [`${getRowid($xeTable, row)}:${column.id}`]: { column, row, rule, @@ -516,7 +517,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { } }) } - $xetable.dispatchEvent('valid-error', params, null) + $xeTable.dispatchEvent('valid-error', params, null) if (validTip) { if (validTip && (validOpts.message === 'tooltip' || (validOpts.message === 'default' && !height && tableData.length < 2))) { return validTip.open(cell, content) @@ -528,9 +529,7 @@ const validatorHook: VxeGlobalHooksHandles.HookOptions = { return { ...validatorMethods, ...validatorPrivateMethods } }, - setupGrid ($xegrid) { - return $xegrid.extendTableMethods(tableValidatorMethodKeys) + setupGrid ($xeGrid) { + return $xeGrid.extendTableMethods(tableValidatorMethodKeys) } -} - -export default validatorHook +}) diff --git a/packages/v-x-e-table/src/renderer.ts b/packages/table/render/index.ts similarity index 63% rename from packages/v-x-e-table/src/renderer.ts rename to packages/table/render/index.ts index 658bfac7a3..af9a11cedd 100644 --- a/packages/v-x-e-table/src/renderer.ts +++ b/packages/table/render/index.ts @@ -1,12 +1,14 @@ import { h, resolveComponent, ComponentOptions } from 'vue' import XEUtils from 'xe-utils' -import GlobalConfig from './conf' +import { VxeUI } from '../../ui' import { getCellValue, setCellValue } from '../../table/src/util' -import { getFuncText, formatText, isEmptyValue } from '../../tools/utils' -import { errLog, warnLog } from '../../tools/log' -import { getOnName } from '../../tools/vn' +import { getFuncText, formatText, isEmptyValue } from '../../ui/src/utils' +import { getOnName } from '../../ui/src/vn' +import { errLog } from '../../ui/src/log' -import { VxeGlobalRendererHandles, VxeGlobalRenderer, RendererOptions, VxeColumnPropTypes } from '../../../types/all' +import type { VxeGlobalRendererHandles, VxeColumnPropTypes, VxeButtonComponent } from '../../../types' + +const { getConfig, renderer, getI18n } = VxeUI const componentDefaultModelProp = 'modelValue' @@ -44,7 +46,7 @@ function getFormatDate (value: any, props: any, defaultFormat: string) { } function getLabelFormatDate (value: any, props: any) { - return getFormatDate(value, props, GlobalConfig.i18n(`vxe.input.date.labelFormat.${props.type}`)) + return getFormatDate(value, props, getI18n(`vxe.input.date.labelFormat.${props.type}`)) } /** @@ -103,10 +105,6 @@ function getCellEditFilterProps (renderOpts: any, params: any, value: any, defau return XEUtils.assign({}, defaultCompProps, defaultProps, renderOpts.props, { [componentDefaultModelProp]: value }) } -function getComponentFormItemProps (renderOpts: any, params: any, value: any, defaultProps?: any) { - return XEUtils.assign({}, defaultCompProps, defaultProps, renderOpts.props, { [componentDefaultModelProp]: value }) -} - function isImmediateCell (renderOpts: VxeColumnPropTypes.EditRender, params: any) { return params.$type === 'cell' || getInputImmediateModel(renderOpts) } @@ -116,11 +114,13 @@ function getCellLabelVNs (renderOpts: any, params: any, cellLabel: any) { return [ h('span', { class: 'vxe-cell--label' - }, placeholder && isEmptyValue(cellLabel) ? [ - h('span', { - class: 'vxe-cell--placeholder' - }, formatText(getFuncText(placeholder), 1)) - ] : formatText(cellLabel, 1)) + }, placeholder && isEmptyValue(cellLabel) + ? [ + h('span', { + class: 'vxe-cell--placeholder' + }, formatText(getFuncText(placeholder), 1)) + ] + : formatText(cellLabel, 1)) ] } @@ -180,7 +180,7 @@ function getComponentOns (renderOpts: any, params: any, modelFunc?: any, changeF const ons: any = {} XEUtils.objectEach(events, (func, key: any) => { ons[getOnName(key)] = function (...args: any[]) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (!XEUtils.isFunction(func)) { errLog('vxe.error.errFunc', [func]) } @@ -242,17 +242,6 @@ function getFilterOns (renderOpts: any, params: any, option: any) { }) } -function getItemOns (renderOpts: any, params: any) { - const { $form, data, property } = params - return getComponentOns(renderOpts, params, (value: any) => { - // 处理 model 值双向绑定 - XEUtils.set(data, property, value) - }, () => { - // 处理 change 事件相关逻辑 - $form.updateStatus(params) - }) -} - function getNativeEditOns (renderOpts: any, params: any) { const { $table, row, column } = params const { model } = column @@ -281,18 +270,6 @@ function getNativeFilterOns (renderOpts: any, params: any, option: any) { }) } -function getNativeItemOns (renderOpts: any, params: any) { - const { $form, data, property } = params - return getElementOns(renderOpts, params, (evnt: any) => { - // 处理 model 值双向绑定 - const itemValue = evnt.target.value - XEUtils.set(data, property, itemValue) - }, () => { - // 处理 change 事件相关逻辑 - $form.updateStatus(params) - }) -} - /** * 单元格可编辑渲染-原生的标签 * input、textarea、select @@ -352,7 +329,7 @@ function oldEditRender (renderOpts: VxeGlobalRendererHandles.RenderEditOptions, */ function oldButtonEditRender (renderOpts: any, params: any) { return [ - h(resolveComponent('vxe-button') as ComponentOptions, { + h(resolveComponent('vxe-button') as VxeButtonComponent, { ...getCellEditProps(renderOpts, params, null), ...getComponentOns(renderOpts, params) }) @@ -496,201 +473,48 @@ function getSelectCellValue (renderOpts: any, { row, column }: any) { const labelProp = optionProps.label || 'label' const valueProp = optionProps.value || 'value' if (!isEmptyValue(cellValue)) { - return XEUtils.map(props.multiple ? cellValue : [cellValue], optionGroups ? (value) => { - const groupOptions = optionGroupProps.options || 'options' - for (let index = 0; index < optionGroups.length; index++) { - /* eslint-disable eqeqeq */ - selectItem = XEUtils.find(optionGroups[index][groupOptions], item => item[valueProp] == value) - if (selectItem) { - break - } - } - return selectItem ? selectItem[labelProp] : value - } : (value) => { - /* eslint-disable eqeqeq */ - selectItem = XEUtils.find(options, item => item[valueProp] == value) - return selectItem ? selectItem[labelProp] : value - }).join(', ') + return XEUtils.map(props.multiple ? cellValue : [cellValue], + optionGroups + ? (value) => { + const groupOptions = optionGroupProps.options || 'options' + for (let index = 0; index < optionGroups.length; index++) { + /* eslint-disable eqeqeq */ + selectItem = XEUtils.find(optionGroups[index][groupOptions], item => item[valueProp] == value) + if (selectItem) { + break + } + } + return selectItem ? selectItem[labelProp] : value + } + : (value) => { + /* eslint-disable eqeqeq */ + selectItem = XEUtils.find(options, item => item[valueProp] == value) + return selectItem ? selectItem[labelProp] : value + } + ).join(', ') } return '' } -/** - * 渲染表单-项 - * 用于渲染原生的标签 - */ -function nativeItemRender (renderOpts: any, params: any) { - const { data, property } = params - const { name } = renderOpts - const attrs = getNativeAttrs(renderOpts) - const itemValue = XEUtils.get(data, property) - return [ - h(name, { - class: `vxe-default-${name}`, - ...attrs, - value: attrs && name === 'input' && (attrs.type === 'submit' || attrs.type === 'reset') ? null : itemValue, - ...getNativeItemOns(renderOpts, params) - }) - ] -} - -function defaultItemRender (renderOpts: any, params: any) { - const { data, property } = params - const itemValue = XEUtils.get(data, property) - return [ - h(getDefaultComponent(renderOpts), { - ...getComponentFormItemProps(renderOpts, params, itemValue), - ...getItemOns(renderOpts, params) - }) - ] -} - -/** - * 已废弃 - * @deprecated - */ -function oldItemRender (renderOpts: any, params: any) { - const { data, property } = params - const itemValue = XEUtils.get(data, property) - return [ - h(getOldComponent(renderOpts), { - ...getComponentFormItemProps(renderOpts, params, itemValue), - ...getItemOns(renderOpts, params) - }) - ] -} - -/** - * 已废弃 - * @deprecated - */ -function oldButtonItemRender (renderOpts: any, params: any) { - return [ - h(resolveComponent('vxe-button') as ComponentOptions, { - ...getComponentFormItemProps(renderOpts, params, null), - ...getComponentOns(renderOpts, params) - }) - ] -} - -/** - * 已废弃 - * @deprecated - */ -function oldButtonsItemRender (renderOpts: any, params: any) { - return renderOpts.children.map((childRenderOpts: any) => oldButtonItemRender(childRenderOpts, params)[0]) -} - -/** - * 渲染原生的 select 标签 - */ -function renderNativeFormOptions (options: any, renderOpts: any, params: any) { - const { data, property } = params - const { optionProps = {} } = renderOpts - const labelProp = optionProps.label || 'label' - const valueProp = optionProps.value || 'value' - const disabledProp = optionProps.disabled || 'disabled' - const cellValue = XEUtils.get(data, property) - return options.map((item: any, oIndex: any) => { - return h('option', { - key: oIndex, - value: item[valueProp], - disabled: item[disabledProp], - /* eslint-disable eqeqeq */ - selected: item[valueProp] == cellValue - }, item[labelProp]) - }) -} - function handleExportSelectMethod (params: any) { const { row, column, options } = params return options.original ? getCellValue(row, column) : getSelectCellValue(column.editRender || column.cellRender, params) } /** - * 渲染表单-项 + * 表格 - 渲染器 */ -function defaultFormItemRender (renderOpts: any, params: any) { - const { data, property } = params - const itemValue = XEUtils.get(data, property) - return [ - h(getDefaultComponent(renderOpts), { - ...getComponentFormItemProps(renderOpts, params, itemValue), - ...getItemOns(renderOpts, params) - }) - ] -} - -function formItemRadioAndCheckboxRender (renderOpts: any, params: any) { - const { options, optionProps } = renderOpts - const { data, property } = params - const itemValue = XEUtils.get(data, property) - return [ - h(getDefaultComponent(renderOpts), { - options, - optionProps, - ...getComponentFormItemProps(renderOpts, params, itemValue), - ...getItemOns(renderOpts, params) - }) - ] -} - -/** - * 已废弃 - * @deprecated - */ -function oldFormItemRadioAndCheckboxRender (renderOpts: any, params: any) { - const { name, options, optionProps = {} } = renderOpts - const { data, property } = params - const labelProp = optionProps.label || 'label' - const valueProp = optionProps.value || 'value' - const disabledProp = optionProps.disabled || 'disabled' - const itemValue = XEUtils.get(data, property) - const compName = getOldComponentName(name) - // 如果是分组 - if (options) { - return [ - h(resolveComponent(`${compName}-group`) as ComponentOptions, { - ...getComponentFormItemProps(renderOpts, params, itemValue), - ...getItemOns(renderOpts, params) - }, { - default: () => { - return options.map((item: any, index: any) => { - return h(resolveComponent(compName) as ComponentOptions, { - key: index, - label: item[valueProp], - content: item[labelProp], - disabled: item[disabledProp] - }) - }) - } - }) - ] - } - return [ - h(resolveComponent(compName) as ComponentOptions, { - ...getComponentFormItemProps(renderOpts, params, itemValue), - ...getItemOns(renderOpts, params) - }) - ] -} - -/** - * 内置的组件渲染 - */ -const renderMap: { [name: string]: RendererOptions } = { +renderer.mixin({ input: { autofocus: 'input', renderEdit: nativeEditRender, renderDefault: nativeEditRender, renderFilter: nativeFilterRender, - defaultFilterMethod: handleFilterMethod, - renderItemContent: nativeItemRender + defaultFilterMethod: handleFilterMethod }, textarea: { autofocus: 'textarea', - renderEdit: nativeEditRender, - renderItemContent: nativeItemRender + renderEdit: nativeEditRender }, select: { renderEdit: nativeSelectEditRender, @@ -711,16 +535,6 @@ const renderMap: { [name: string]: RendererOptions } = { }) }, defaultFilterMethod: handleFilterMethod, - renderItemContent (renderOpts: any, params: any) { - return [ - h('select', { - class: 'vxe-default-select', - ...getNativeAttrs(renderOpts), - ...getNativeItemOns(renderOpts, params) - }, - renderOpts.optionGroups ? renderNativeOptgroups(renderOpts, params, renderNativeFormOptions) : renderNativeFormOptions(renderOpts.options, renderOpts, params)) - ] - }, exportMethod: handleExportSelectMethod }, VxeInput: { @@ -729,7 +543,7 @@ const renderMap: { [name: string]: RendererOptions } = { renderCell (renderOpts: any, params: any) { const { props = {} } = renderOpts const { row, column } = params - const digits = props.digits || GlobalConfig.input.digits + const digits = props.digits || getConfig().input?.digits || 2 let cellValue = XEUtils.get(row, column.property) if (cellValue) { switch (props.type) { @@ -748,31 +562,16 @@ const renderMap: { [name: string]: RendererOptions } = { }, renderDefault: defaultEditRender, renderFilter: defaultFilterRender, - defaultFilterMethod: handleFilterMethod, - renderItemContent: defaultItemRender + defaultFilterMethod: handleFilterMethod }, VxeTextarea: { - autofocus: '.vxe-textarea--inner', - renderItemContent: defaultItemRender + autofocus: '.vxe-textarea--inner' }, VxeButton: { - renderDefault: defaultCellRender, - renderItemContent: defaultFormItemRender + renderDefault: defaultCellRender }, VxeButtonGroup: { - renderDefault: defaultCellRender, - renderItemContent (renderOpts: any, params: any) { - const { options } = renderOpts - const { data, property } = params - const itemValue = XEUtils.get(data, property) - return [ - h(getDefaultComponent(renderOpts), { - options, - ...getComponentFormItemProps(renderOpts, params, itemValue), - ...getItemOns(renderOpts, params) - }) - ] - } + renderDefault: defaultCellRender }, VxeSelect: { autofocus: '.vxe-input--inner', @@ -794,40 +593,24 @@ const renderMap: { [name: string]: RendererOptions } = { }) }, defaultFilterMethod: handleFilterMethod, - renderItemContent (renderOpts: any, params: any) { - const { data, property } = params - const { options, optionProps, optionGroups, optionGroupProps } = renderOpts - const itemValue = XEUtils.get(data, property) - return [ - h(getDefaultComponent(renderOpts), { - ...getComponentFormItemProps(renderOpts, params, itemValue, { options, optionProps, optionGroups, optionGroupProps }), - ...getItemOns(renderOpts, params) - }) - ] - }, exportMethod: handleExportSelectMethod }, VxeRadio: { - autofocus: '.vxe-radio--input', - renderItemContent: defaultFormItemRender + autofocus: '.vxe-radio--input' }, VxeRadioGroup: { - autofocus: '.vxe-radio--input', - renderItemContent: formItemRadioAndCheckboxRender + autofocus: '.vxe-radio--input' }, VxeCheckbox: { - autofocus: '.vxe-checkbox--input', - renderItemContent: defaultFormItemRender + autofocus: '.vxe-checkbox--input' }, VxeCheckboxGroup: { - autofocus: '.vxe-checkbox--input', - renderItemContent: formItemRadioAndCheckboxRender + autofocus: '.vxe-checkbox--input' }, VxeSwitch: { autofocus: '.vxe-switch--button', renderEdit: defaultEditRender, - renderDefault: defaultEditRender, - renderItemContent: defaultItemRender + renderDefault: defaultEditRender }, // 以下已废弃 @@ -837,7 +620,7 @@ const renderMap: { [name: string]: RendererOptions } = { renderCell (renderOpts: any, params: any) { const { props = {} } = renderOpts const { row, column } = params - const digits = props.digits || GlobalConfig.input.digits + const digits = props.digits || getConfig().input?.digits || 2 let cellValue = XEUtils.get(row, column.property) if (cellValue) { switch (props.type) { @@ -856,20 +639,16 @@ const renderMap: { [name: string]: RendererOptions } = { }, renderDefault: oldEditRender, renderFilter: oldFilterRender, - defaultFilterMethod: handleFilterMethod, - renderItemContent: oldItemRender + defaultFilterMethod: handleFilterMethod }, $textarea: { - autofocus: '.vxe-textarea--inner', - renderItemContent: oldItemRender + autofocus: '.vxe-textarea--inner' }, $button: { - renderDefault: oldButtonEditRender, - renderItemContent: oldButtonItemRender + renderDefault: oldButtonEditRender }, $buttons: { - renderDefault: oldButtonsEditRender, - renderItemContent: oldButtonsItemRender + renderDefault: oldButtonsEditRender }, $select: { autofocus: '.vxe-input--inner', @@ -891,69 +670,18 @@ const renderMap: { [name: string]: RendererOptions } = { }) }, defaultFilterMethod: handleFilterMethod, - renderItemContent (renderOpts: any, params: any) { - const { data, property } = params - const { options, optionProps, optionGroups, optionGroupProps } = renderOpts - const itemValue = XEUtils.get(data, property) - return [ - h(getOldComponent(renderOpts), { - ...getComponentFormItemProps(renderOpts, params, itemValue, { options, optionProps, optionGroups, optionGroupProps }), - ...getItemOns(renderOpts, params) - }) - ] - }, exportMethod: handleExportSelectMethod }, $radio: { - autofocus: '.vxe-radio--input', - renderItemContent: oldFormItemRadioAndCheckboxRender + autofocus: '.vxe-radio--input' }, $checkbox: { - autofocus: '.vxe-checkbox--input', - renderItemContent: oldFormItemRadioAndCheckboxRender + autofocus: '.vxe-checkbox--input' }, $switch: { autofocus: '.vxe-switch--button', renderEdit: oldEditRender, - renderDefault: oldEditRender, - renderItemContent: oldItemRender + renderDefault: oldEditRender } // 以上已废弃 -} - -/** - * 全局渲染器 - */ -export const renderer: VxeGlobalRenderer = { - mixin (opts) { - XEUtils.each(opts, (options, name) => renderer.add(name, options)) - return renderer - }, - get (name: string) { - return renderMap[name] || null - }, - add (name, options) { - if (name && options) { - const renders: any = renderMap[name] - if (renders) { - // 检测是否覆盖 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - XEUtils.each(options, (val, key) => { - if (!XEUtils.eqNull(renders[key]) && renders[key] !== val) { - warnLog('vxe.error.coverProp', [`Renderer.${name}`, key]) - } - }) - } - - Object.assign(renders, options) - } else { - renderMap[name] = options - } - } - return renderer - }, - delete (name) { - delete renderMap[name] - return renderer - } -} +}) diff --git a/packages/table/src/body.ts b/packages/table/src/body.ts index b9415d4091..743edce039 100644 --- a/packages/table/src/body.ts +++ b/packages/table/src/body.ts @@ -1,13 +1,14 @@ import { createCommentVNode, defineComponent, h, ref, Ref, PropType, inject, nextTick, ComputedRef, onBeforeUnmount, onMounted, onUnmounted } from 'vue' import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' +import { VxeUI } from '../../ui' import { mergeBodyMethod, getRowid, removeScrollListener, restoreScrollListener, XEBodyScrollElement } from './util' -import { updateCellTitle, getPropClass } from '../../tools/dom' -import { isEnableConf } from '../../tools/utils' -import { getSlotVNs } from '../../tools/vn' +import { updateCellTitle, getPropClass } from '../../ui/src/dom' +import { isEnableConf } from '../../ui/src/utils' +import { getSlotVNs } from '../../ui/src/vn' -import { VxeTablePrivateMethods, VxeTableConstructor, VxeTableDefines, VxeTableMethods, VxeGlobalRendererHandles, VxeColumnPropTypes, SizeType } from '../../../types/all' +import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableDefines, VxeTableMethods, VxeColumnPropTypes, VxeComponentSlotType, VxeComponentSizeType } from '../../../types' + +const { getI18n, renderer } = VxeUI const renderType = 'body' @@ -26,13 +27,13 @@ export default defineComponent({ fixedType: { type: String as PropType, default: null } }, setup (props) { - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) - const xesize = inject('xesize', null as ComputedRef | null) + const xesize = inject('xesize', null as ComputedRef | null) - const { xID, props: tableProps, context: tableContext, reactData: tableReactData, internalData: tableInternalData } = $xetable - const { refTableHeader, refTableBody, refTableFooter, refTableLeftBody, refTableRightBody, refValidTooltip } = $xetable.getRefMaps() - const { computeEditOpts, computeMouseOpts, computeSYOpts, computeEmptyOpts, computeKeyboardOpts, computeTooltipOpts, computeRadioOpts, computeExpandOpts, computeTreeOpts, computeCheckboxOpts, computeValidOpts, computeRowOpts, computeColumnOpts } = $xetable.getComputeMaps() + const { xID, props: tableProps, context: tableContext, reactData: tableReactData, internalData: tableInternalData } = $xeTable + const { refTableHeader, refTableBody, refTableFooter, refTableLeftBody, refTableRightBody, refValidTooltip } = $xeTable.getRefMaps() + const { computeEditOpts, computeMouseOpts, computeSYOpts, computeEmptyOpts, computeKeyboardOpts, computeTooltipOpts, computeRadioOpts, computeExpandOpts, computeTreeOpts, computeCheckboxOpts, computeValidOpts, computeRowOpts, computeColumnOpts } = $xeTable.getComputeMaps() const refElem = ref() as Ref const refBodyTable = ref() as Ref @@ -67,7 +68,7 @@ export default defineComponent({ const treeOpts = computeTreeOpts.value const childrenField = treeOpts.children || treeOpts.childrenField const rowChildren = prevRow[childrenField] - if (rowChildren && $xetable.isTreeExpandByRow(prevRow)) { + if (rowChildren && $xeTable.isTreeExpandByRow(prevRow)) { for (let index = 0; index < rowChildren.length; index++) { count += countTreeExpand(rowChildren[index], params) } @@ -90,20 +91,20 @@ export default defineComponent({ const treeOpts = computeTreeOpts.value const { slots, treeNode } = column const { fullAllDataRowIdData } = tableInternalData - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const rest = fullAllDataRowIdData[rowid] let rLevel = 0 let rIndex = 0 - let items = [] + let items: any[] = [] if (rest) { rLevel = rest.level rIndex = rest._index items = rest.items } if (slots && slots.line) { - return $xetable.callSlot(slots.line, params) + return $xeTable.callSlot(slots.line, params) } - const isFirstRow = $xetable.eqRow(afterFullData[0], row) + const isFirstRow = $xeTable.eqRow(afterFullData[0], row) if (treeConfig && treeNode && (treeOpts.showLine || treeOpts.line)) { return [ h('div', { @@ -141,12 +142,12 @@ export default defineComponent({ const { rHeight: scrollYRHeight } = sYOpts const { height: rowHeight } = rowOpts const renderOpts = editRender || cellRender - const compConf = renderOpts ? VXETable.renderer.get(renderOpts.name) : null + const compConf = renderOpts ? renderer.get(renderOpts.name) : null const compCellClassName = compConf ? compConf.cellClassName : '' const compCellStyle = compConf ? compConf.cellStyle : '' const showAllTip = tooltipOpts.showAll - const columnIndex = $xetable.getColumnIndex(column) - const _columnIndex = $xetable.getVTColumnIndex(column) + const columnIndex = $xeTable.getColumnIndex(column) + const _columnIndex = $xeTable.getVTColumnIndex(column) const isEdit = isEnableConf(editRender) let fixedHiddenColumn = fixedType ? column.fixed !== fixedType : column.fixed && overflowX const cellOverflow = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? allColumnOverflow : showOverflow @@ -160,7 +161,7 @@ export default defineComponent({ const errorValidItem = validErrorMaps[`${rowid}:${column.id}`] const showValidTip = editRules && validOpts.showMessage && (validOpts.message === 'default' ? (height || tableData.length > 1) : validOpts.message === 'inline') const attrs: any = { colid: column.id } - const params: VxeTableDefines.CellRenderBodyParams = { $table: $xetable, $grid: $xetable.xegrid, seq, rowid, row, rowIndex, $rowIndex, _rowIndex, column, columnIndex, $columnIndex, _columnIndex, fixed: fixedType, type: renderType, isHidden: fixedHiddenColumn, level: rowLevel, visibleData: afterFullData, data: tableData, items } + const params: VxeTableDefines.CellRenderBodyParams = { $table: $xeTable, $grid: $xeTable.xegrid, seq, rowid, row, rowIndex, $rowIndex, _rowIndex, column, columnIndex, $columnIndex, _columnIndex, fixed: fixedType, type: renderType, isHidden: fixedHiddenColumn, level: rowLevel, visibleData: afterFullData, data: tableData, items } // 虚拟滚动不支持动态高度 if (scrollYLoad && !hasEllipsis) { showEllipsis = hasEllipsis = true @@ -175,9 +176,9 @@ export default defineComponent({ updateCellTitle(evnt.currentTarget, column) } else if (showTooltip || showAllTip) { // 如果配置了显示 tooltip - $xetable.triggerBodyTooltipEvent(evnt, params) + $xeTable.triggerBodyTooltipEvent(evnt, params) } - $xetable.dispatchEvent('cell-mouseenter', Object.assign({ cell: evnt.currentTarget }, params), evnt) + $xeTable.dispatchEvent('cell-mouseenter', Object.assign({ cell: evnt.currentTarget }, params), evnt) } } // hover 退出事件 @@ -187,24 +188,24 @@ export default defineComponent({ return } if (showTooltip || showAllTip) { - $xetable.handleTargetLeaveEvent(evnt) + $xeTable.handleTargetLeaveEvent(evnt) } - $xetable.dispatchEvent('cell-mouseleave', Object.assign({ cell: evnt.currentTarget }, params), evnt) + $xeTable.dispatchEvent('cell-mouseleave', Object.assign({ cell: evnt.currentTarget }, params), evnt) } } // 按下事件处理 if (checkboxOpts.range || mouseConfig) { tdOns.onMousedown = (evnt: MouseEvent) => { - $xetable.triggerCellMousedownEvent(evnt, params) + $xeTable.triggerCellMousedownEvent(evnt, params) } } // 点击事件处理 tdOns.onClick = (evnt: MouseEvent) => { - $xetable.triggerCellClickEvent(evnt, params) + $xeTable.triggerCellClickEvent(evnt, params) } // 双击事件处理 tdOns.onDblclick = (evnt: MouseEvent) => { - $xetable.triggerCellDblclickEvent(evnt, params) + $xeTable.triggerCellDblclickEvent(evnt, params) } // 合并行或列 if (mergeList.length) { @@ -242,9 +243,9 @@ export default defineComponent({ } // 如果编辑列开启显示状态 if (!fixedHiddenColumn && editConfig && (editRender || cellRender) && (editOpts.showStatus || editOpts.showUpdateStatus)) { - isDirty = $xetable.isUpdateByRow(row, column.field) + isDirty = $xeTable.isUpdateByRow(row, column.field) } - const tdVNs = [] + const tdVNs: any[] = [] if (fixedHiddenColumn && (allColumnOverflow ? isAllOverflow : allColumnOverflow)) { tdVNs.push( h('div', { @@ -271,7 +272,7 @@ export default defineComponent({ style: { maxHeight: hasEllipsis && (scrollYRHeight || rowHeight) ? `${scrollYRHeight || rowHeight}px` : '' }, - title: showTitle ? $xetable.getCellLabel(row, column) : null + title: showTitle ? $xeTable.getCellLabel(row, column) : null }, column.renderCell(params)) ) if (showValidTip && errorValidItem) { @@ -281,14 +282,18 @@ export default defineComponent({ tdVNs.push( h('div', { class: ['vxe-cell--valid-error-hint', getPropClass(validOpts.className, validParams)], - style: errRule && errRule.maxWidth ? { - width: `${errRule.maxWidth}px` - } : null - }, validSlot ? $xetable.callSlot(validSlot, validParams) : [ - h('span', { - class: 'vxe-cell--valid-error-msg' - }, errorValidItem.content) - ]) + style: errRule && errRule.maxWidth + ? { + width: `${errRule.maxWidth}px` + } + : null + }, validSlot + ? $xeTable.callSlot(validSlot, validParams) + : [ + h('span', { + class: 'vxe-cell--valid-error-msg' + }, errorValidItem.content) + ]) ) } } @@ -339,23 +344,23 @@ export default defineComponent({ const trOn: any = {} let rowIndex = $rowIndex // 确保任何情况下 rowIndex 都精准指向真实 data 索引 - rowIndex = $xetable.getRowIndex(row) + rowIndex = $xeTable.getRowIndex(row) // 事件绑定 if (rowOpts.isHover || highlightHoverRow) { trOn.onMouseenter = (evnt: any) => { if (isVMScrollProcess()) { return } - $xetable.triggerHoverEvent(evnt, { row, rowIndex }) + $xeTable.triggerHoverEvent(evnt, { row, rowIndex }) } trOn.onMouseleave = () => { if (isVMScrollProcess()) { return } - $xetable.clearHoverRow() + $xeTable.clearHoverRow() } } - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const rest = fullAllDataRowIdData[rowid] let rowLevel = 0 let seq: string | number = -1 @@ -365,7 +370,7 @@ export default defineComponent({ seq = rest.seq _rowIndex = rest._index } - const params = { $table: $xetable, seq, rowid, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex } + const params = { $table: $xeTable, seq, rowid, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex } // 行是否被展开 const isExpandRow = expandColumn && !!rowExpandedMaps[rowid] // 树节点是否被展开 @@ -374,11 +379,11 @@ export default defineComponent({ // 处理新增状态 let isNewRow = false if (editConfig) { - isNewRow = $xetable.isInsertByRow(row) + isNewRow = $xeTable.isInsertByRow(row) } if (treeConfig && !scrollYLoad && !transform) { rowChildren = row[childrenField] - isExpandTree = rowChildren && rowChildren.length && !!treeExpandedMaps[rowid] + isExpandTree = rowChildren && rowChildren.length > 0 && !!treeExpandedMaps[rowid] } rows.push( h('tr', { @@ -386,13 +391,13 @@ export default defineComponent({ 'vxe-body--row', treeConfig ? `row--level-${rowLevel}` : '', { - 'row--stripe': stripe && ($xetable.getVTRowIndex(row) + 1) % 2 === 0, + 'row--stripe': stripe && ($xeTable.getVTRowIndex(row) + 1) % 2 === 0, 'is--new': isNewRow, 'is--expand-row': isExpandRow, 'is--expand-tree': isExpandTree, 'row--new': isNewRow && (editOpts.showStatus || editOpts.showInsertStatus), - 'row--radio': radioOpts.highlight && $xetable.eqRow(selectRadioRow, row), - 'row--checked': checkboxOpts.highlight && $xetable.isCheckedByCheckboxRow(row), + 'row--radio': radioOpts.highlight && $xeTable.eqRow(selectRadioRow, row), + 'row--checked': checkboxOpts.highlight && $xeTable.isCheckedByCheckboxRow(row), 'row--pending': pendingRowList.length && !!pendingRowMaps[rowid] }, getPropClass(rowClassName, params) @@ -408,7 +413,7 @@ export default defineComponent({ // 如果行被展开了 if (isExpandRow) { const expandOpts = computeExpandOpts.value - const { height: expandHeight } = expandOpts + const { height: expandHeight, padding } = expandOpts const cellStyle: any = {} if (expandHeight) { cellStyle.height = `${expandHeight}px` @@ -418,10 +423,12 @@ export default defineComponent({ } const { showOverflow } = expandColumn const hasEllipsis = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? allColumnOverflow : showOverflow - const expandParams = { $table: $xetable, seq, column: expandColumn, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex } + const expandParams = { $table: $xeTable, seq, column: expandColumn, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex } rows.push( h('tr', { - class: 'vxe-body--expanded-row', + class: ['vxe-body--expanded-row', { + 'is--padding': padding + }], key: `expand_${rowid}`, style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(expandParams) : rowStyle) : null, ...trOn @@ -537,7 +544,7 @@ export default defineComponent({ tableInternalData.lastScrollLeft = scrollLeft tableReactData.lastScrollTime = Date.now() if (rowOpts.isHover || highlightHoverRow) { - $xetable.clearHoverRow() + $xeTable.clearHoverRow() } if (leftElem && fixedType === 'left') { scrollTop = leftElem.scrollTop @@ -555,7 +562,7 @@ export default defineComponent({ } } if (leftElem || rightElem) { - $xetable.checkScrolling() + $xeTable.checkScrolling() if (isRollY) { syncBodyScroll(fixedType, scrollTop, leftElem, rightElem) } @@ -564,11 +571,11 @@ export default defineComponent({ // let isLoadScroll = false if (scrollXLoad && isRollX) { // isLoadScroll = true - $xetable.triggerScrollXEvent(evnt) + $xeTable.triggerScrollXEvent(evnt) } if (scrollYLoad && isRollY) { // isLoadScroll = true - $xetable.triggerScrollYEvent(evnt) + $xeTable.triggerScrollYEvent(evnt) } if (scrollLoadingTime !== null) { @@ -587,7 +594,7 @@ export default defineComponent({ if (isRollX && validTip && validTip.reactData.visible) { validTip.updatePlacement() } - $xetable.dispatchEvent('scroll', { + $xeTable.dispatchEvent('scroll', { type: renderType, fixed: fixedType, scrollTop, @@ -648,7 +655,7 @@ export default defineComponent({ if (isTopWheel ? targerTop < scrollHeight - clientHeight : targerTop >= 0) { wheelTime = setTimeout(handleSmooth, 10) } - $xetable.dispatchEvent('scroll', { + $xeTable.dispatchEvent('scroll', { type: renderType, fixed: fixedType, scrollTop: bodyElem.scrollTop, @@ -698,11 +705,11 @@ export default defineComponent({ tableInternalData.lastScrollLeft = scrollLeft tableReactData.lastScrollTime = Date.now() if (rowOpts.isHover || highlightHoverRow) { - $xetable.clearHoverRow() + $xeTable.clearHoverRow() } handleWheel(evnt, isTopWheel, deltaTop, isRollX, isRollY) if (scrollYLoad) { - $xetable.triggerScrollYEvent(evnt) + $xeTable.triggerScrollYEvent(evnt) } } } @@ -782,17 +789,17 @@ export default defineComponent({ tableColumn = visibleColumn } } - let emptyContent: string | VxeGlobalRendererHandles.RenderResult + let emptyContent: string | VxeComponentSlotType | VxeComponentSlotType[] const emptySlot = slots ? slots.empty : null if (emptySlot) { - emptyContent = $xetable.callSlot(emptySlot, { $table: $xetable, $grid: $xetable.xegrid }) + emptyContent = $xeTable.callSlot(emptySlot, { $table: $xeTable, $grid: $xeTable.xegrid }) } else { - const compConf = emptyOpts.name ? VXETable.renderer.get(emptyOpts.name) : null + const compConf = emptyOpts.name ? renderer.get(emptyOpts.name) : null const renderTableEmptyView = compConf ? compConf.renderTableEmptyView || compConf.renderEmpty : null if (renderTableEmptyView) { - emptyContent = getSlotVNs(renderTableEmptyView(emptyOpts, { $table: $xetable })) + emptyContent = getSlotVNs(renderTableEmptyView(emptyOpts, { $table: $xeTable })) } else { - emptyContent = tableProps.emptyText || GlobalConfig.i18n('vxe.table.emptyText') + emptyContent = tableProps.emptyText || getI18n('vxe.table.emptyText') } } return h('div', { @@ -801,10 +808,12 @@ export default defineComponent({ xid: xID, ...(sYOpts.mode === 'wheel' ? { onWheel: wheelEvent } : {}) }, [ - fixedType ? createCommentVNode() : h('div', { - ref: refBodyXSpace, - class: 'vxe-body--x-space' - }), + fixedType + ? createCommentVNode() + : h('div', { + ref: refBodyXSpace, + class: 'vxe-body--x-space' + }), h('div', { ref: refBodyYSpace, class: 'vxe-body--y-space' @@ -838,40 +847,46 @@ export default defineComponent({ h('div', { class: 'vxe-table--checkbox-range' }), - mouseConfig && mouseOpts.area ? h('div', { - class: 'vxe-table--cell-area' - }, [ - h('span', { - class: 'vxe-table--cell-main-area' - }, mouseOpts.extension ? [ + mouseConfig && mouseOpts.area + ? h('div', { + class: 'vxe-table--cell-area' + }, [ h('span', { - class: 'vxe-table--cell-main-area-btn', - onMousedown (evnt: any) { - $xetable.triggerCellExtendMousedownEvent(evnt, { $table: $xetable, fixed: fixedType, type: renderType }) - } + class: 'vxe-table--cell-main-area' + }, mouseOpts.extension + ? [ + h('span', { + class: 'vxe-table--cell-main-area-btn', + onMousedown (evnt: any) { + $xeTable.triggerCellExtendMousedownEvent(evnt, { $table: $xeTable, fixed: fixedType, type: renderType }) + } + }) + ] + : []), + h('span', { + class: 'vxe-table--cell-copy-area' + }), + h('span', { + class: 'vxe-table--cell-extend-area' + }), + h('span', { + class: 'vxe-table--cell-multi-area' + }), + h('span', { + class: 'vxe-table--cell-active-area' }) - ] : []), - h('span', { - class: 'vxe-table--cell-copy-area' - }), - h('span', { - class: 'vxe-table--cell-extend-area' - }), - h('span', { - class: 'vxe-table--cell-multi-area' - }), - h('span', { - class: 'vxe-table--cell-active-area' - }) - ]) : null, - !fixedType ? h('div', { - class: 'vxe-table--empty-block', - ref: refBodyEmptyBlock - }, [ - h('div', { - class: 'vxe-table--empty-content' - }, emptyContent) - ]) : null + ]) + : null, + !fixedType + ? h('div', { + class: 'vxe-table--empty-block', + ref: refBodyEmptyBlock + }, [ + h('div', { + class: 'vxe-table--empty-content' + }, emptyContent) + ]) + : null ]) } diff --git a/packages/table/src/cell.ts b/packages/table/src/cell.ts index 780c09dfaa..aeb069ddbd 100644 --- a/packages/table/src/cell.ts +++ b/packages/table/src/cell.ts @@ -1,47 +1,52 @@ import { h, VNode } from 'vue' import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { VXETable } from '../../v-x-e-table' -import { getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../tools/utils' -import { updateCellTitle } from '../../tools/dom' +import { VxeUI } from '../../ui' +import { getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils' +import { updateCellTitle } from '../../ui/src/dom' import { createColumn, getRowid } from './util' -import { getSlotVNs } from '../../tools/vn' +import { getSlotVNs } from '../../ui/src/vn' -import { SlotVNodeType, VxeTableConstructor, VxeTableDefines, VxeTablePrivateMethods } from '../../../types/all' +import type { VxeTableConstructor, VxeTableDefines, VxeTablePrivateMethods, VxeComponentSlotType } from '../../../types' + +const { getI18n, getIcon, renderer } = VxeUI function renderTitlePrefixIcon (params: VxeTableDefines.CellRenderHeaderParams) { const { $table, column } = params const titlePrefix = column.titlePrefix || column.titleHelp - return titlePrefix ? [ - h('i', { - class: ['vxe-cell-title-prefix-icon', titlePrefix.icon || GlobalConfig.icon.TABLE_TITLE_PREFIX], - onMouseenter (evnt: MouseEvent) { - $table.triggerHeaderTitleEvent(evnt, titlePrefix, params) - }, - onMouseleave (evnt: MouseEvent) { - $table.handleTargetLeaveEvent(evnt) - } - }) - ] : [] + return titlePrefix + ? [ + h('i', { + class: ['vxe-cell-title-prefix-icon', titlePrefix.icon || getIcon().TABLE_TITLE_PREFIX], + onMouseenter (evnt: MouseEvent) { + $table.triggerHeaderTitleEvent(evnt, titlePrefix, params) + }, + onMouseleave (evnt: MouseEvent) { + $table.handleTargetLeaveEvent(evnt) + } + }) + ] + : [] } function renderTitleSuffixIcon (params: VxeTableDefines.CellRenderHeaderParams) { const { $table, column } = params const titleSuffix = column.titleSuffix - return titleSuffix ? [ - h('i', { - class: ['vxe-cell-title-suffix-icon', titleSuffix.icon || GlobalConfig.icon.TABLE_TITLE_SUFFIX], - onMouseenter (evnt: MouseEvent) { - $table.triggerHeaderTitleEvent(evnt, titleSuffix, params) - }, - onMouseleave (evnt: MouseEvent) { - $table.handleTargetLeaveEvent(evnt) - } - }) - ] : [] + return titleSuffix + ? [ + h('i', { + class: ['vxe-cell-title-suffix-icon', titleSuffix.icon || getIcon().TABLE_TITLE_SUFFIX], + onMouseenter (evnt: MouseEvent) { + $table.triggerHeaderTitleEvent(evnt, titleSuffix, params) + }, + onMouseleave (evnt: MouseEvent) { + $table.handleTargetLeaveEvent(evnt) + } + }) + ] + : [] } -function renderTitleContent (params: VxeTableDefines.CellRenderHeaderParams, content: SlotVNodeType | SlotVNodeType[]) { +function renderTitleContent (params: VxeTableDefines.CellRenderHeaderParams, content: VxeComponentSlotType | VxeComponentSlotType[]) { const { $table, column } = params const { props, reactData } = $table const { computeTooltipOpts } = $table.getComputeMaps() @@ -76,14 +81,16 @@ function renderTitleContent (params: VxeTableDefines.CellRenderHeaderParams, con } } return [ - type === 'html' && XEUtils.isString(content) ? h('span', { - class: 'vxe-cell--title', - innerHTML: content, - ...ons - }) : h('span', { - class: 'vxe-cell--title', - ...ons - }, getSlotVNs(content)) + type === 'html' && XEUtils.isString(content) + ? h('span', { + class: 'vxe-cell--title', + innerHTML: content, + ...ons + }) + : h('span', { + class: 'vxe-cell--title', + ...ons + }, getSlotVNs(content)) ] } @@ -96,7 +103,7 @@ function getFooterContent (params: VxeTableDefines.CellRenderFooterParams) { return $table.callSlot(footerSlot, params) } if (renderOpts) { - const compConf = VXETable.renderer.get(renderOpts.name) + const compConf = renderer.get(renderOpts.name) if (compConf && compConf.renderFooter) { return getSlotVNs(compConf.renderFooter(renderOpts, params)) } @@ -114,11 +121,11 @@ function getDefaultCellLabel (params: VxeTableDefines.CellRenderBodyParams) { } export const Cell = { - createColumn ($xetable: VxeTableConstructor & VxeTablePrivateMethods, columnOpts: VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo) { + createColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, columnOpts: VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo) { const { type, sortable, filters, editRender, treeNode } = columnOpts - const { props } = $xetable + const { props } = $xeTable const { editConfig } = props - const { computeEditOpts, computeCheckboxOpts } = $xetable.getComputeMaps() + const { computeEditOpts, computeCheckboxOpts } = $xeTable.getComputeMaps() const checkboxOpts = computeCheckboxOpts.value const editOpts = computeEditOpts.value const renConfs: any = { @@ -165,7 +172,7 @@ export const Cell = { renConfs.renderHeader = Cell.renderFilterHeader } } - return createColumn($xetable, columnOpts, renConfs) + return createColumn($xeTable, columnOpts, renConfs) }, /** * 单元格 @@ -179,7 +186,7 @@ export const Cell = { return renderTitleContent(params, $table.callSlot(headerSlot, params)) } if (renderOpts) { - const compConf = VXETable.renderer.get(renderOpts.name) + const compConf = renderer.get(renderOpts.name) if (compConf && compConf.renderHeader) { return renderTitleContent(params, getSlotVNs(compConf.renderHeader(renderOpts, params))) } @@ -199,7 +206,7 @@ export const Cell = { } if (renderOpts) { const funName = editRender ? 'renderCell' : 'renderDefault' - const compConf = VXETable.renderer.get(renderOpts.name) + const compConf = renderer.get(renderOpts.name) const compFn = compConf ? compConf[funName] : null if (compFn) { return getSlotVNs(compFn(renderOpts, Object.assign({ $type: editRender ? 'edit' : 'cell' }, params))) @@ -210,12 +217,14 @@ export const Cell = { return [ h('span', { class: 'vxe-cell--label' - }, editRender && eqEmptyValue(cellValue) ? [ - // 如果设置占位符 - h('span', { - class: 'vxe-cell--placeholder' - }, formatText(getFuncText(cellPlaceholder), 1)) - ] : formatText(cellValue, 1)) + }, editRender && eqEmptyValue(cellValue) + ? [ + // 如果设置占位符 + h('span', { + class: 'vxe-cell--placeholder' + }, formatText(getFuncText(cellPlaceholder), 1)) + ] + : formatText(cellValue, 1)) ] }, renderTreeCell (params: VxeTableDefines.CellRenderBodyParams) { @@ -232,7 +241,7 @@ export const Cell = { /** * 树节点 */ - renderTreeIcon (params: VxeTableDefines.CellRenderBodyParams, cellVNodes: SlotVNodeType[]) { + renderTreeIcon (params: VxeTableDefines.CellRenderBodyParams, cellVNodes: VxeComponentSlotType[]) { const { $table, isHidden } = params const { reactData } = $table const { computeTreeOpts } = $table.getComputeMaps() @@ -275,16 +284,18 @@ export const Cell = { paddingLeft: `${level * indent}px` } }, [ - showIcon && ((rowChilds && rowChilds.length) || hasLazyChilds) ? [ - h('div', { - class: 'vxe-tree--btn-wrapper', - ...ons - }, [ - h('i', { - class: ['vxe-tree--node-btn', isLazyLoaded ? (iconLoaded || GlobalConfig.icon.TABLE_TREE_LOADED) : (isAceived ? (iconOpen || GlobalConfig.icon.TABLE_TREE_OPEN) : (iconClose || GlobalConfig.icon.TABLE_TREE_CLOSE))] - }) - ]) - ] : null, + showIcon && ((rowChilds && rowChilds.length) || hasLazyChilds) + ? [ + h('div', { + class: 'vxe-tree--btn-wrapper', + ...ons + }, [ + h('i', { + class: ['vxe-tree--node-btn', isLazyLoaded ? (iconLoaded || getIcon().TABLE_TREE_LOADED) : (isAceived ? (iconOpen || getIcon().TABLE_TREE_OPEN) : (iconClose || getIcon().TABLE_TREE_CLOSE))] + }) + ]) + ] + : null, h('div', { class: 'vxe-tree-cell' }, cellVNodes) @@ -328,11 +339,13 @@ export const Cell = { const { slots } = column const headerSlot = slots ? slots.header : null const titleSlot = slots ? slots.title : null - return renderTitleContent(params, headerSlot ? $table.callSlot(headerSlot, params) : [ - h('span', { - class: 'vxe-radio--label' - }, titleSlot ? $table.callSlot(titleSlot, params) : formatText(column.getTitle(), 1)) - ]) + return renderTitleContent(params, headerSlot + ? $table.callSlot(headerSlot, params) + : [ + h('span', { + class: 'vxe-radio--label' + }, titleSlot ? $table.callSlot(titleSlot, params) : formatText(column.getTitle(), 1)) + ]) }, renderRadioCell (params: VxeTableDefines.CellRenderBodyParams) { const { $table, column, isHidden } = params @@ -366,11 +379,11 @@ export const Cell = { if (radioSlot) { return $table.callSlot(radioSlot, radioParams) } - const radioVNs = [] + const radioVNs: VNode[] = [] if (isVisible) { radioVNs.push( h('span', { - class: ['vxe-radio--icon', isChecked ? GlobalConfig.icon.TABLE_RADIO_CHECKED : GlobalConfig.icon.TABLE_RADIO_UNCHECKED] + class: ['vxe-radio--icon', isChecked ? getIcon().TABLE_RADIO_CHECKED : getIcon().TABLE_RADIO_UNCHECKED] }) ) } @@ -438,17 +451,19 @@ export const Cell = { 'is--disabled': isAllCheckboxDisabled, 'is--indeterminate': isAllCheckboxIndeterminate }], - title: GlobalConfig.i18n('vxe.table.allTitle'), + title: getI18n('vxe.table.allTitle'), ...ons }, [ h('span', { - class: ['vxe-checkbox--icon', isAllCheckboxIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isAllCheckboxSelected ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] + class: ['vxe-checkbox--icon', isAllCheckboxIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllCheckboxSelected ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] }) - ].concat(titleSlot || headerTitle ? [ - h('span', { - class: 'vxe-checkbox--label' - }, titleSlot ? $table.callSlot(titleSlot, checkboxParams) : headerTitle) - ] : [])) + ].concat(titleSlot || headerTitle + ? [ + h('span', { + class: 'vxe-checkbox--label' + }, titleSlot ? $table.callSlot(titleSlot, checkboxParams) : headerTitle) + ] + : [])) ]) }, renderCheckboxCell (params: VxeTableDefines.CellRenderBodyParams) { @@ -489,11 +504,11 @@ export const Cell = { if (checkboxSlot) { return $table.callSlot(checkboxSlot, checkboxParams) } - const checkVNs = [] + const checkVNs: VNode[] = [] if (isVisible) { checkVNs.push( h('span', { - class: ['vxe-checkbox--icon', indeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] + class: ['vxe-checkbox--icon', indeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] }) ) } @@ -558,11 +573,11 @@ export const Cell = { if (checkboxSlot) { return $table.callSlot(checkboxSlot, checkboxParams) } - const checkVNs = [] + const checkVNs: VNode[] = [] if (isVisible) { checkVNs.push( h('span', { - class: ['vxe-checkbox--icon', isIndeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)] + class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)] }) ) if (defaultSlot || labelField) { @@ -615,22 +630,26 @@ export const Cell = { } } return [ - showIcon && (!visibleMethod || visibleMethod(params)) ? h('span', { - class: ['vxe-table--expanded', { - 'is--active': isAceived - }], - onClick (evnt: MouseEvent) { - evnt.stopPropagation() - $table.triggerRowExpandEvent(evnt, params) - } - }, [ - h('i', { - class: ['vxe-table--expand-btn', isLazyLoaded ? (iconLoaded || GlobalConfig.icon.TABLE_EXPAND_LOADED) : (isAceived ? (iconOpen || GlobalConfig.icon.TABLE_EXPAND_OPEN) : (iconClose || GlobalConfig.icon.TABLE_EXPAND_CLOSE))] - }) - ]) : null, - defaultSlot || labelField ? h('span', { - class: 'vxe-table--expand-label' - }, defaultSlot ? $table.callSlot(defaultSlot, params) : XEUtils.get(row, labelField as string)) : null + showIcon && (!visibleMethod || visibleMethod(params)) + ? h('span', { + class: ['vxe-table--expanded', { + 'is--active': isAceived + }], + onClick (evnt: MouseEvent) { + evnt.stopPropagation() + $table.triggerRowExpandEvent(evnt, params) + } + }, [ + h('i', { + class: ['vxe-table--expand-btn', isLazyLoaded ? (iconLoaded || getIcon().TABLE_EXPAND_LOADED) : (isAceived ? (iconOpen || getIcon().TABLE_EXPAND_OPEN) : (iconClose || getIcon().TABLE_EXPAND_CLOSE))] + }) + ]) + : null, + defaultSlot || labelField + ? h('span', { + class: 'vxe-table--expand-label' + }, defaultSlot ? $table.callSlot(defaultSlot, params) : XEUtils.get(row, labelField as string)) + : null ] }, renderExpandData (params: VxeTableDefines.CellRenderDataParams) { @@ -641,7 +660,7 @@ export const Cell = { return $table.callSlot(contentSlot, params) } if (contentRender) { - const compConf = VXETable.renderer.get(contentRender.name) + const compConf = renderer.get(contentRender.name) if (compConf && compConf.renderExpand) { return getSlotVNs(compConf.renderExpand(contentRender, params)) } @@ -697,20 +716,20 @@ export const Cell = { class: ['vxe-cell--sort', `vxe-cell--sort-${iconLayout}-layout`] }, [ h('i', { - class: ['vxe-sort--asc-btn', iconAsc || GlobalConfig.icon.TABLE_SORT_ASC, { + class: ['vxe-sort--asc-btn', iconAsc || getIcon().TABLE_SORT_ASC, { 'sort--active': order === 'asc' }], - title: GlobalConfig.i18n('vxe.table.sortAsc'), + title: getI18n('vxe.table.sortAsc'), onClick (evnt: Event) { evnt.stopPropagation() $table.triggerSortEvent(evnt, column, 'asc') } }), h('i', { - class: ['vxe-sort--desc-btn', iconDesc || GlobalConfig.icon.TABLE_SORT_DESC, { + class: ['vxe-sort--desc-btn', iconDesc || getIcon().TABLE_SORT_DESC, { 'sort--active': order === 'desc' }], - title: GlobalConfig.i18n('vxe.table.sortDesc'), + title: getI18n('vxe.table.sortDesc'), onClick (evnt: Event) { evnt.stopPropagation() $table.triggerSortEvent(evnt, column, 'desc') @@ -735,23 +754,25 @@ export const Cell = { const { computeFilterOpts } = $table.getComputeMaps() const filterOpts = computeFilterOpts.value const { showIcon, iconNone, iconMatch } = filterOpts - return showIcon ? [ - h('span', { - class: ['vxe-cell--filter', { - 'is--active': filterStore.visible && filterStore.column === column - }] - }, [ - h('i', { - class: ['vxe-filter--btn', hasFilter ? (iconMatch || GlobalConfig.icon.TABLE_FILTER_MATCH) : (iconNone || GlobalConfig.icon.TABLE_FILTER_NONE)], - title: GlobalConfig.i18n('vxe.table.filter'), - onClick (evnt: Event) { - if ($table.triggerFilterEvent) { - $table.triggerFilterEvent(evnt, params.column, params) - } - } - }) - ]) - ] : [] + return showIcon + ? [ + h('span', { + class: ['vxe-cell--filter', { + 'is--active': filterStore.visible && filterStore.column === column + }] + }, [ + h('i', { + class: ['vxe-filter--btn', hasFilter ? (iconMatch || getIcon().TABLE_FILTER_MATCH) : (iconNone || getIcon().TABLE_FILTER_NONE)], + title: getI18n('vxe.table.filter'), + onClick (evnt: Event) { + if ($table.triggerFilterEvent) { + $table.triggerFilterEvent(evnt, params.column, params) + } + } + }) + ]) + ] + : [] }, /** @@ -771,14 +792,20 @@ export const Cell = { isRequired = columnRules.some((rule) => rule.required) } } - return (isEnableConf(editConfig) ? [ - isRequired && editOpts.showAsterisk ? h('i', { - class: 'vxe-cell--required-icon' - }) : null, - isEnableConf(editRender) && editOpts.showIcon ? h('i', { - class: ['vxe-cell--edit-icon', editOpts.icon || GlobalConfig.icon.TABLE_EDIT] - }) : null - ] : []).concat(Cell.renderDefaultHeader(params)) + return (isEnableConf(editConfig) + ? [ + isRequired && editOpts.showAsterisk + ? h('i', { + class: 'vxe-cell--required-icon' + }) + : null, + isEnableConf(editRender) && editOpts.showIcon + ? h('i', { + class: ['vxe-cell--edit-icon', editOpts.icon || getIcon().TABLE_EDIT] + }) + : null + ] + : []).concat(Cell.renderDefaultHeader(params)) .concat(sortable ? Cell.renderSortIcon(params) : []) .concat(filters ? Cell.renderFilterIcon(params) : []) }, @@ -811,7 +838,7 @@ export const Cell = { const { slots, editRender, formatter } = column const defaultSlot = slots ? slots.default : null const editSlot = slots ? slots.edit : null - const compConf = VXETable.renderer.get(editRender.name) + const compConf = renderer.get(editRender.name) if (isEdit) { if (editSlot) { return $table.callSlot(editSlot, params) diff --git a/packages/table/src/column.ts b/packages/table/src/column.ts index a3f7e10d1e..9f1409a8ab 100644 --- a/packages/table/src/column.ts +++ b/packages/table/src/column.ts @@ -2,7 +2,7 @@ import { defineComponent, h, onUnmounted, inject, ref, Ref, PropType, provide, o import { XEColumnInstance, watchColumn, assemColumn, destroyColumn } from '../../table/src/util' import Cell from '../../table/src/cell' -import { VxeTableConstructor, VxeTablePrivateMethods, VxeColumnPropTypes, VxeColumnProps } from '../../../types/all' +import type { VxeTableConstructor, VxeTablePrivateMethods, VxeColumnPropTypes, VxeColumnProps } from '../../../types' export const columnProps = { // 列唯一主键 @@ -94,28 +94,35 @@ export default defineComponent({ props: columnProps, setup (props, { slots }) { const refElem = ref() as Ref - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTablePrivateMethods) - const colgroup = inject('xecolgroup', null as XEColumnInstance | null) - const column = Cell.createColumn($xetable, props as VxeColumnProps) + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTablePrivateMethods) + const parentColgroup = inject('$xeColgroup', null as XEColumnInstance | null) + const column = Cell.createColumn($xeTable, props as VxeColumnProps) column.slots = slots - provide('$xegrid', null) + const renderVN = () => { + return h('div', { + ref: refElem + }) + } + + const $xeColumn = { + column, - watchColumn($xetable, props, column) + renderVN + } + + watchColumn($xeTable, props, column) onMounted(() => { - assemColumn($xetable, refElem.value, column, colgroup) + assemColumn($xeTable, refElem.value, column, parentColgroup) }) onUnmounted(() => { - destroyColumn($xetable, column) + destroyColumn($xeTable, column) }) - const renderVN = () => { - return h('div', { - ref: refElem - }) - } + provide('$xeColumn', $xeColumn) + provide('$xeGrid', null) return renderVN } diff --git a/packages/table/src/columnInfo.ts b/packages/table/src/columnInfo.ts index 2950113ea9..b78dfaffcc 100644 --- a/packages/table/src/columnInfo.ts +++ b/packages/table/src/columnInfo.ts @@ -1,20 +1,20 @@ import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { formats } from '../../v-x-e-table/src/formats' +import { VxeUI } from '../../ui' import { toFilters } from './util' -import { getFuncText } from '../../tools/utils' -import { warnLog, errLog } from '../../tools/log' +import { getFuncText } from '../../ui/src/utils' +import { warnLog, errLog } from '../../ui/src/log' -import { VxeTableConstructor, VxeTablePrivateMethods } from '../../../types/all' +import type { VxeTableConstructor, VxeTablePrivateMethods } from '../../../types' +const { getI18n, formats } = VxeUI export class ColumnInfo { /* eslint-disable @typescript-eslint/no-use-before-define */ - constructor ($xetable: VxeTableConstructor & VxeTablePrivateMethods, _vm: any, { renderHeader, renderCell, renderFooter, renderData }: any = {}) { - const $xegrid = $xetable.xegrid + constructor ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, _vm: any, { renderHeader, renderCell, renderFooter, renderData }: any = {}) { + const $xeGrid = $xeTable.xegrid const formatter: string | any[] = _vm.formatter const visible = XEUtils.isBoolean(_vm.visible) ? _vm.visible : true - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { const types = ['seq', 'checkbox', 'radio', 'expand', 'html'] if (_vm.type && types.indexOf(_vm.type) === -1) { warnLog('vxe.error.errProp', [`type=${_vm.type}`, types.join(', ')]) @@ -29,9 +29,9 @@ export class ColumnInfo { warnLog('vxe.error.errConflicts', ['column.cell-render', 'column.edit-render']) } if (_vm.type === 'expand') { - const { props: tableProps } = $xetable + const { props: tableProps } = $xeTable const { treeConfig } = tableProps - const { computeTreeOpts } = $xetable.getComputeMaps() + const { computeTreeOpts } = $xeTable.getComputeMaps() const treeOpts = computeTreeOpts.value if (treeConfig && (treeOpts.showLine || treeOpts.line)) { errLog('vxe.error.errConflicts', ['tree-config.showLine', 'column.type=expand']) @@ -103,6 +103,7 @@ export class ColumnInfo { halfVisible: false, defaultVisible: visible, defaultFixed: _vm.fixed, + checked: false, halfChecked: false, disabled: false, @@ -121,9 +122,14 @@ export class ColumnInfo { sortNumber: 0, // 用于记录自定义列顺序 renderSortNumber: 0, // 用于记录自定义列顺序 + renderFixed: '', + renderVisible: false, + renderWidth: 0, renderHeight: 0, + renderResizeWidth: 0, resizeWidth: 0, // 手动调整 + renderLeft: 0, renderArgs: [], // 渲染参数可用于扩展 model: {}, @@ -134,17 +140,17 @@ export class ColumnInfo { // 单元格插槽，只对 grid 有效 slots: _vm.slots }) - if ($xegrid) { - const { computeProxyOpts } = $xegrid.getComputeMaps() + if ($xeGrid) { + const { computeProxyOpts } = $xeGrid.getComputeMaps() const proxyOpts = computeProxyOpts.value if (proxyOpts.beforeColumn) { - proxyOpts.beforeColumn({ $grid: $xegrid, column: this }) + proxyOpts.beforeColumn({ $grid: $xeGrid, column: this }) } } } getTitle () { - return getFuncText(this.title || (this.type === 'seq' ? GlobalConfig.i18n('vxe.table.seqTitle') : '')) + return getFuncText(this.title || (this.type === 'seq' ? getI18n('vxe.table.seqTitle') : '')) } getKey () { diff --git a/packages/table/src/emits.ts b/packages/table/src/emits.ts index 9fc6f08456..09f367ddca 100644 --- a/packages/table/src/emits.ts +++ b/packages/table/src/emits.ts @@ -1,4 +1,4 @@ -import { VxeTableEmits } from '../../../types/all' +import { VxeTableEmits } from '../../../types' export default [ 'update:data', diff --git a/packages/table/src/footer.ts b/packages/table/src/footer.ts index 248c93fd9b..9eb1a95e92 100644 --- a/packages/table/src/footer.ts +++ b/packages/table/src/footer.ts @@ -1,8 +1,8 @@ import { createCommentVNode, defineComponent, h, ref, Ref, PropType, inject, nextTick, onMounted, onUnmounted } from 'vue' import XEUtils from 'xe-utils' -import { updateCellTitle, getPropClass } from '../../tools/dom' +import { updateCellTitle, getPropClass } from '../../ui/src/dom' -import { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeColumnPropTypes, VxeTableDefines } from '../../../types/all' +import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeColumnPropTypes, VxeTableDefines } from '../../../types' const renderType = 'footer' @@ -29,11 +29,11 @@ export default defineComponent({ fixedType: { type: String as PropType, default: null } }, setup (props) { - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) - const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xetable - const { refTableHeader, refTableBody, refValidTooltip } = $xetable.getRefMaps() - const { computeTooltipOpts, computeColumnOpts } = $xetable.getComputeMaps() + const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable + const { refTableHeader, refTableBody, refValidTooltip } = $xeTable.getRefMaps() + const { computeTooltipOpts, computeColumnOpts } = $xeTable.getComputeMaps() const refElem = ref() as Ref const refFooterTable = ref() as Ref @@ -67,12 +67,12 @@ export default defineComponent({ bodyElem.scrollLeft = scrollLeft } if (scrollXLoad && isX) { - $xetable.triggerScrollXEvent(evnt) + $xeTable.triggerScrollXEvent(evnt) } if (isX && validTip && validTip.reactData.visible) { validTip.updatePlacement() } - $xetable.dispatchEvent('scroll', { type: renderType, fixed: fixedType, scrollTop: bodyElem.scrollTop, scrollLeft, isX, isY: false }, evnt) + $xeTable.dispatchEvent('scroll', { type: renderType, fixed: fixedType, scrollTop: bodyElem.scrollTop, scrollLeft, isX, isY: false }, evnt) } onMounted(() => { @@ -125,10 +125,12 @@ export default defineComponent({ xid: xID, onScroll: scrollEvent }, [ - fixedType ? createCommentVNode() : h('div', { - ref: refFooterXSpace, - class: 'vxe-body--x-space' - }), + fixedType + ? createCommentVNode() + : h('div', { + ref: refFooterXSpace, + class: 'vxe-body--x-space' + }), h('table', { ref: refFooterTable, class: 'vxe-table--footer', @@ -147,11 +149,13 @@ export default defineComponent({ name: column.id, key: $columnIndex }) - }).concat(scrollbarWidth ? [ - h('col', { - name: 'col_gutter' - }) - ] : [])), + }).concat(scrollbarWidth + ? [ + h('col', { + name: 'col_gutter' + }) + ] + : [])), /** * 底部 */ @@ -159,7 +163,7 @@ export default defineComponent({ ref: refFooterTFoot }, footerTableData.map((list, _rowIndex) => { const $rowIndex = _rowIndex - const rowParams = { $table: $xetable, row: list, _rowIndex, $rowIndex, fixed: fixedType, type: renderType } + const rowParams = { $table: $xeTable, row: list, _rowIndex, $rowIndex, fixed: fixedType, type: renderType } return h('tr', { class: ['vxe-footer--row', footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''], style: footerRowStyle ? (XEUtils.isFunction(footerRowStyle) ? footerRowStyle(rowParams) : footerRowStyle) : null @@ -176,12 +180,12 @@ export default defineComponent({ let hasEllipsis = showTitle || showTooltip || showEllipsis const attrs: any = { colid: column.id } const tfOns: any = {} - const columnIndex = $xetable.getColumnIndex(column) - const _columnIndex = $xetable.getVTColumnIndex(column) + const columnIndex = $xeTable.getColumnIndex(column) + const _columnIndex = $xeTable.getVTColumnIndex(column) const itemIndex = _columnIndex const cellParams: VxeTableDefines.CellRenderFooterParams = { - $table: $xetable, - $grid: $xetable.xegrid, + $table: $xeTable, + $grid: $xeTable.xegrid, row: list, rowIndex: _rowIndex, _rowIndex, @@ -205,22 +209,22 @@ export default defineComponent({ if (showTitle) { updateCellTitle(evnt.currentTarget, column) } else if (showTooltip || showAllTip) { - $xetable.triggerFooterTooltipEvent(evnt, cellParams) + $xeTable.triggerFooterTooltipEvent(evnt, cellParams) } } } if (showTooltip || showAllTip) { tfOns.onMouseleave = (evnt: MouseEvent) => { if (showTooltip || showAllTip) { - $xetable.handleTargetLeaveEvent(evnt) + $xeTable.handleTargetLeaveEvent(evnt) } } } tfOns.onClick = (evnt: MouseEvent) => { - $xetable.dispatchEvent('footer-cell-click', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt) + $xeTable.dispatchEvent('footer-cell-click', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt) } tfOns.onDblclick = (evnt: MouseEvent) => { - $xetable.dispatchEvent('footer-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt) + $xeTable.dispatchEvent('footer-cell-dblclick', Object.assign({ cell: evnt.currentTarget }, cellParams), evnt) } // 合并行或列 if (mergeFooterList.length) { @@ -272,11 +276,13 @@ export default defineComponent({ }] }, column.renderFooter(cellParams)) ]) - }).concat(scrollbarWidth ? [ - h('td', { - class: 'vxe-footer--gutter col--gutter' - }) - ] : [])) + }).concat(scrollbarWidth + ? [ + h('td', { + class: 'vxe-footer--gutter col--gutter' + }) + ] + : [])) })) ]) ]) diff --git a/packages/table/src/group.ts b/packages/table/src/group.ts index f8616ba26b..a78035d025 100644 --- a/packages/table/src/group.ts +++ b/packages/table/src/group.ts @@ -3,37 +3,35 @@ import { columnProps } from './column' import { XEColumnInstance, watchColumn, assemColumn, destroyColumn } from '../../table/src/util' import Cell from '../../table/src/cell' -import { VxeTableConstructor, VxeTablePrivateMethods } from '../../../types/all' +import type { VxeTableConstructor, VxeTablePrivateMethods } from '../../../types' export default defineComponent({ name: 'VxeColgroup', props: columnProps, setup (props, { slots }) { const refElem = ref() as Ref - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTablePrivateMethods) - const colgroup = inject('xecolgroup', null as XEColumnInstance | null) - const column = Cell.createColumn($xetable, props) + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTablePrivateMethods) + const parentColgroup = inject('$xeColgroup', null as XEColumnInstance | null) + const column = Cell.createColumn($xeTable, props) const columnSlots: { header?: Slot; } = {} + if (slots.header) { columnSlots.header = slots.header } - const xecolumn: XEColumnInstance = { column } + column.slots = columnSlots column.children = [] - provide('xecolgroup', xecolumn) - provide('$xegrid', null) - - watchColumn($xetable, props, column) + watchColumn($xeTable, props, column) onMounted(() => { - assemColumn($xetable, refElem.value, column, colgroup) + assemColumn($xeTable, refElem.value, column, parentColgroup) }) onUnmounted(() => { - destroyColumn($xetable, column) + destroyColumn($xeTable, column) }) const renderVN = () => { @@ -42,6 +40,11 @@ export default defineComponent({ }, slots.default ? slots.default() : []) } + const $xeColgroup = { column } + + provide('$xeColgroup', $xeColgroup) + provide('$xeGrid', null) + return renderVN } }) diff --git a/packages/table/src/header.ts b/packages/table/src/header.ts index 80ed4ee4c4..2b157e0650 100644 --- a/packages/table/src/header.ts +++ b/packages/table/src/header.ts @@ -1,9 +1,9 @@ import { createCommentVNode, defineComponent, h, ref, Ref, PropType, inject, nextTick, watch, onMounted, onUnmounted } from 'vue' import XEUtils from 'xe-utils' import { convertHeaderColumnToRows, getColReMinWidth } from './util' -import { hasClass, getOffsetPos, addClass, removeClass } from '../../tools/dom' +import { hasClass, getOffsetPos, addClass, removeClass } from '../../ui/src/dom' -import { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeTableDefines, VxeColumnPropTypes } from '../../../types/all' +import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeTableDefines, VxeColumnPropTypes } from '../../../types' const renderType = 'header' @@ -17,11 +17,11 @@ export default defineComponent({ fixedType: { type: String as PropType, default: null } }, setup (props) { - const $xetable = inject('$xetable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) + const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods) - const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xetable - const { refElem: tableRefElem, refTableBody, refLeftContainer, refRightContainer, refCellResizeBar } = $xetable.getRefMaps() - const { computeColumnOpts } = $xetable.getComputeMaps() + const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable + const { refElem: tableRefElem, refTableBody, refLeftContainer, refRightContainer, refCellResizeBar } = $xeTable.getRefMaps() + const { computeColumnOpts } = $xeTable.getComputeMaps() const headerColumn = ref([] as VxeTableDefines.ColumnInfo[][]) @@ -114,17 +114,17 @@ export default defineComponent({ resizeBarElem.style.display = 'none' tableReactData._isResize = false tableInternalData._lastResizeTime = Date.now() - $xetable.analyColumnWidth() - $xetable.recalculate(true).then(() => { - $xetable.saveCustomResizable() - $xetable.updateCellAreas() - $xetable.dispatchEvent('resizable-change', { ...params, resizeWidth }, evnt) + $xeTable.analyColumnWidth() + $xeTable.recalculate(true).then(() => { + $xeTable.saveCustomResizable() + $xeTable.updateCellAreas() + $xeTable.dispatchEvent('resizable-change', { ...params, resizeWidth }, evnt) }) removeClass(tableEl, 'drag--resize') } updateEvent(evnt) - if ($xetable.closeMenu) { - $xetable.closeMenu() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } } @@ -133,7 +133,7 @@ export default defineComponent({ onMounted(() => { nextTick(() => { const { fixedType } = props - const { internalData } = $xetable + const { internalData } = $xeTable const { elemStore } = internalData const prefix = `${fixedType || 'main'}-header-` elemStore[`${prefix}wrapper`] = refElem @@ -148,7 +148,7 @@ export default defineComponent({ onUnmounted(() => { const { fixedType } = props - const { internalData } = $xetable + const { internalData } = $xeTable const { elemStore } = internalData const prefix = `${fixedType || 'main'}-header-` elemStore[`${prefix}wrapper`] = null @@ -183,10 +183,12 @@ export default defineComponent({ class: ['vxe-table--header-wrapper', fixedType ? `fixed-${fixedType}--wrapper` : 'body--wrapper'], xid: xID }, [ - fixedType ? createCommentVNode() : h('div', { - ref: refHeaderXSpace, - class: 'vxe-body--x-space' - }), + fixedType + ? createCommentVNode() + : h('div', { + ref: refHeaderXSpace, + class: 'vxe-body--x-space' + }), h('table', { ref: refHeaderTable, class: 'vxe-table--header', @@ -205,11 +207,13 @@ export default defineComponent({ name: column.id, key: $columnIndex }) - }).concat(scrollbarWidth ? [ - h('col', { - name: 'col_gutter' - }) - ] : [])), + }).concat(scrollbarWidth + ? [ + h('col', { + name: 'col_gutter' + }) + ] + : [])), /** * 头部 */ @@ -217,8 +221,8 @@ export default defineComponent({ ref: refHeaderTHead }, headerGroups.map((cols, $rowIndex) => { return h('tr', { - class: ['vxe-header--row', headerRowClassName ? (XEUtils.isFunction(headerRowClassName) ? headerRowClassName({ $table: $xetable, $rowIndex, fixed: fixedType, type: renderType }) : headerRowClassName) : ''], - style: headerRowStyle ? (XEUtils.isFunction(headerRowStyle) ? headerRowStyle({ $table: $xetable, $rowIndex, fixed: fixedType, type: renderType }) : headerRowStyle) : null + class: ['vxe-header--row', headerRowClassName ? (XEUtils.isFunction(headerRowClassName) ? headerRowClassName({ $table: $xeTable, $rowIndex, fixed: fixedType, type: renderType }) : headerRowClassName) : ''], + style: headerRowStyle ? (XEUtils.isFunction(headerRowStyle) ? headerRowStyle({ $table: $xeTable, $rowIndex, fixed: fixedType, type: renderType }) : headerRowStyle) : null }, cols.map((column, $columnIndex) => { const { type, showHeaderOverflow, headerAlign, align, headerClassName } = column const isColGroup = column.children && column.children.length @@ -230,12 +234,12 @@ export default defineComponent({ const showTooltip = headOverflow === true || headOverflow === 'tooltip' let hasEllipsis = showTitle || showTooltip || showEllipsis const hasFilter = column.filters && column.filters.some((item) => item.checked) - const columnIndex = $xetable.getColumnIndex(column) - const _columnIndex = $xetable.getVTColumnIndex(column) - const params: VxeTableDefines.CellRenderHeaderParams = { $table: $xetable, $grid: $xetable.xegrid, $rowIndex, column, columnIndex, $columnIndex, _columnIndex, fixed: fixedType, type: renderType, isHidden: fixedHiddenColumn, hasFilter } + const columnIndex = $xeTable.getColumnIndex(column) + const _columnIndex = $xeTable.getVTColumnIndex(column) + const params: VxeTableDefines.CellRenderHeaderParams = { $table: $xeTable, $grid: $xeTable.xegrid, $rowIndex, column, columnIndex, $columnIndex, _columnIndex, fixed: fixedType, type: renderType, isHidden: fixedHiddenColumn, hasFilter } const thOns: any = { - onClick: (evnt: MouseEvent) => $xetable.triggerHeaderCellClickEvent(evnt, params), - onDblclick: (evnt: MouseEvent) => $xetable.triggerHeaderCellDblclickEvent(evnt, params) + onClick: (evnt: MouseEvent) => $xeTable.triggerHeaderCellClickEvent(evnt, params), + onDblclick: (evnt: MouseEvent) => $xeTable.triggerHeaderCellDblclickEvent(evnt, params) } // 横向虚拟滚动不支持动态行高 if (scrollXLoad && !hasEllipsis) { @@ -243,7 +247,7 @@ export default defineComponent({ } // 按下事件处理 if (mouseConfig) { - thOns.onMousedown = (evnt: MouseEvent) => $xetable.triggerHeaderCellMousedownEvent(evnt, params) + thOns.onMousedown = (evnt: MouseEvent) => $xeTable.triggerHeaderCellMousedownEvent(evnt, params) } return h('th', { class: ['vxe-header--column', column.id, { @@ -279,18 +283,22 @@ export default defineComponent({ /** * 列宽拖动 */ - !fixedHiddenColumn && !isColGroup && (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || resizable)) ? h('div', { - class: ['vxe-resizable', { - 'is--line': !border || border === 'none' - }], - onMousedown: (evnt: MouseEvent) => resizeMousedown(evnt, params) - }) : null + !fixedHiddenColumn && !isColGroup && (XEUtils.isBoolean(column.resizable) ? column.resizable : (columnOpts.resizable || resizable)) + ? h('div', { + class: ['vxe-resizable', { + 'is--line': !border || border === 'none' + }], + onMousedown: (evnt: MouseEvent) => resizeMousedown(evnt, params) + }) + : null ]) - }).concat(scrollbarWidth ? [ - h('th', { - class: 'vxe-header--gutter col--gutter' - }) - ] : [])) + }).concat(scrollbarWidth + ? [ + h('th', { + class: 'vxe-header--gutter col--gutter' + }) + ] + : [])) })) ]), /** diff --git a/packages/table/src/props.ts b/packages/table/src/props.ts index 8ba0d9e7e1..251d5e78bd 100644 --- a/packages/table/src/props.ts +++ b/packages/table/src/props.ts @@ -1,7 +1,9 @@ import { PropType } from 'vue' -import GlobalConfig from '../../v-x-e-table/src/conf' +import { VxeUI } from '../../ui' -import { VxeTablePropTypes } from '../../../types/all' +import type { VxeTablePropTypes } from '../../../types' + +const { getConfig } = VxeUI export default { /** 基本属性 */ @@ -11,39 +13,39 @@ export default { // 表格的高度 height: [Number, String] as PropType, // 表格的最小高度 - minHeight: { type: [Number, String] as PropType, default: () => GlobalConfig.table.minHeight }, + minHeight: { type: [Number, String] as PropType, default: () => getConfig().table.minHeight }, // 表格的最大高度 maxHeight: [Number, String] as PropType, // 已废弃，被 column-config.resizable 替换 - resizable: { type: Boolean as PropType, default: () => GlobalConfig.table.resizable }, + resizable: { type: Boolean as PropType, default: () => getConfig().table.resizable }, // 是否带有斑马纹 - stripe: { type: Boolean as PropType, default: () => GlobalConfig.table.stripe }, + stripe: { type: Boolean as PropType, default: () => getConfig().table.stripe }, // 是否带有边框 - border: { type: [Boolean, String] as PropType, default: () => GlobalConfig.table.border }, + border: { type: [Boolean, String] as PropType, default: () => getConfig().table.border }, // 是否圆角边框 - round: { type: Boolean as PropType, default: () => GlobalConfig.table.round }, + round: { type: Boolean as PropType, default: () => getConfig().table.round }, // 表格的尺寸 - size: { type: String as PropType, default: () => GlobalConfig.table.size || GlobalConfig.size }, + size: { type: String as PropType, default: () => getConfig().table.size || getConfig().size }, // 列的宽度是否自撑开（可能会被废弃的参数，不要使用） - fit: { type: Boolean as PropType, default: () => GlobalConfig.table.fit }, + fit: { type: Boolean as PropType, default: () => getConfig().table.fit }, // 表格是否加载中 loading: Boolean as PropType, // 所有的列对其方式 - align: { type: String as PropType, default: () => GlobalConfig.table.align }, + align: { type: String as PropType, default: () => getConfig().table.align }, // 所有的表头列的对齐方式 - headerAlign: { type: String as PropType, default: () => GlobalConfig.table.headerAlign }, + headerAlign: { type: String as PropType, default: () => getConfig().table.headerAlign }, // 所有的表尾列的对齐方式 - footerAlign: { type: String as PropType, default: () => GlobalConfig.table.footerAlign }, + footerAlign: { type: String as PropType, default: () => getConfig().table.footerAlign }, // 是否显示表头 - showHeader: { type: Boolean as PropType, default: () => GlobalConfig.table.showHeader }, + showHeader: { type: Boolean as PropType, default: () => getConfig().table.showHeader }, // （即将废弃）是否要高亮当前选中行 - highlightCurrentRow: { type: Boolean as PropType, default: () => GlobalConfig.table.highlightCurrentRow }, + highlightCurrentRow: { type: Boolean as PropType, default: () => getConfig().table.highlightCurrentRow }, // （即将废弃）鼠标移到行是否要高亮显示 - highlightHoverRow: { type: Boolean as PropType, default: () => GlobalConfig.table.highlightHoverRow }, + highlightHoverRow: { type: Boolean as PropType, default: () => getConfig().table.highlightHoverRow }, // （即将废弃）是否要高亮当前选中列 - highlightCurrentColumn: { type: Boolean as PropType, default: () => GlobalConfig.table.highlightCurrentColumn }, + highlightCurrentColumn: { type: Boolean as PropType, default: () => getConfig().table.highlightCurrentColumn }, // （即将废弃）鼠标移到列是否要高亮显示 - highlightHoverColumn: { type: Boolean as PropType, default: () => GlobalConfig.table.highlightHoverColumn }, + highlightHoverColumn: { type: Boolean as PropType, default: () => getConfig().table.highlightHoverColumn }, // （即将废弃）激活单元格编辑时是否高亮显示 highlightCell: Boolean as PropType, // 是否显示表尾合计 @@ -85,11 +87,11 @@ export default { // 表尾合并行或列 footerSpanMethod: Function as PropType, // 设置所有内容过长时显示为省略号 - showOverflow: { type: [Boolean, String] as PropType, default: () => GlobalConfig.table.showOverflow }, + showOverflow: { type: [Boolean, String] as PropType, default: () => getConfig().table.showOverflow }, // 设置表头所有内容过长时显示为省略号 - showHeaderOverflow: { type: [Boolean, String] as PropType, default: () => GlobalConfig.table.showHeaderOverflow }, + showHeaderOverflow: { type: [Boolean, String] as PropType, default: () => getConfig().table.showHeaderOverflow }, // 设置表尾所有内容过长时显示为省略号 - showFooterOverflow: { type: [Boolean, String] as PropType, default: () => GlobalConfig.table.showFooterOverflow }, + showFooterOverflow: { type: [Boolean, String] as PropType, default: () => getConfig().table.showFooterOverflow }, /** 高级属性 */ // （即将废弃）columnKey 已废弃，被 column-config.useKey 替换 @@ -97,12 +99,12 @@ export default { // （即将废弃）rowKey 已废弃，被 row-config.useKey 替换 rowKey: Boolean as PropType, // （即将废弃）rowId 已废弃，被 row-config.keyField 替换 - rowId: { type: String as PropType, default: () => GlobalConfig.table.rowId }, + rowId: { type: String as PropType, default: () => getConfig().table.rowId }, zIndex: Number as PropType, - emptyText: { type: String as PropType, default: () => GlobalConfig.table.emptyText }, - keepSource: { type: Boolean as PropType, default: () => GlobalConfig.table.keepSource }, + emptyText: { type: String as PropType, default: () => getConfig().table.emptyText }, + keepSource: { type: Boolean as PropType, default: () => getConfig().table.keepSource }, // 是否自动监听父容器变化去更新响应式表格宽高 - autoResize: { type: Boolean as PropType, default: () => GlobalConfig.table.autoResize }, + autoResize: { type: Boolean as PropType, default: () => getConfig().table.autoResize }, // 是否自动根据状态属性去更新响应式表格宽高 syncResize: [Boolean, String, Number], // 响应式布局配置项 @@ -164,9 +166,9 @@ export default { // 纵向虚拟滚动配置项 scrollY: Object as PropType, // （即将废弃）优化相关 - animat: { type: Boolean as PropType, default: () => GlobalConfig.table.animat }, + animat: { type: Boolean as PropType, default: () => getConfig().table.animat }, // （可能会被废弃的参数，不要使用） - delayHover: { type: Number as PropType, default: () => GlobalConfig.table.delayHover as number }, + delayHover: { type: Number as PropType, default: () => getConfig().table.delayHover as number }, // 额外的参数 params: Object as PropType } diff --git a/packages/table/src/table.ts b/packages/table/src/table.ts index 79760fe9b3..f5939a36dc 100644 --- a/packages/table/src/table.ts +++ b/packages/table/src/table.ts @@ -1,24 +1,26 @@ -import { defineComponent, getCurrentInstance, h, createCommentVNode, ComponentPublicInstance, resolveComponent, ComponentOptions, reactive, ref, Ref, provide, inject, nextTick, onActivated, onDeactivated, onBeforeUnmount, onUnmounted, watch, computed, ComputedRef, onMounted } from 'vue' +import { defineComponent, h, createCommentVNode, ComponentPublicInstance, resolveComponent, reactive, ref, Ref, provide, inject, nextTick, onActivated, onDeactivated, onBeforeUnmount, onUnmounted, watch, computed, ComputedRef, onMounted } from 'vue' import XEUtils from 'xe-utils' -import { browse, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft, isNodeElement } from '../../tools/dom' -import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../tools/utils' -import { warnLog, errLog } from '../../tools/log' -import { createResizeEvent, XEResizeObserver } from '../../tools/resize' -import { GlobalEvent, hasEventKey, EVENT_KEYS } from '../../tools/event' -import { useSize } from '../../hooks/size' -import { VXETable } from '../../v-x-e-table' -import GlobalConfig from '../../v-x-e-table/src/conf' +import { browse, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft, isNodeElement } from '../../ui/src/dom' +import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils' +import { VxeUI } from '../../ui' import Cell from './cell' import TableBodyComponent from './body' import TableHeaderComponent from './header' import TableFooterComponent from './footer' import tableProps from './props' import tableEmits from './emits' -import VxeLoading from '../../loading/index' import { getRowUniqueId, clearTableAllStatus, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, restoreScrollListener, XEBodyScrollElement, getRootColumn } from './util' -import { getSlotVNs } from '../../tools/vn' +import { getSlotVNs } from '../../ui/src/vn' +import { warnLog, errLog } from '../../ui/src/log' +import TableCustomPanelComponent from '../module/custom/panel' +import TableFilterPanelComponent from '../module/filter/panel' +import TableImportPanelComponent from '../module/export/import-panel' +import TableExportPanelComponent from '../module/export/export-panel' +import TableMenuPanelComponent from '../module/menu/panel' -import { VxeGridConstructor, VxeGridPrivateMethods, VxeTableConstructor, TableReactData, TableInternalData, VxeTablePropTypes, VxeToolbarConstructor, VxeTooltipInstance, TablePrivateMethods, VxeTablePrivateRef, VxeTablePrivateComputed, VxeTablePrivateMethods, VxeTableMethods, TableMethods, VxeTableMenuPanelInstance, VxeTableDefines, VxeTableProps, VxeColumnPropTypes, VxeTableDataRow, VxeTableCustomStorageObj } from '../../../types/all' +import type { VxeGridConstructor, VxeGridPrivateMethods, VxeTableConstructor, TableReactData, TableInternalData, VxeTablePropTypes, VxeToolbarConstructor, TablePrivateMethods, VxeTablePrivateRef, VxeTablePrivateComputed, VxeTablePrivateMethods, TableMethods, VxeTableMethods, VxeTableDefines, VxeTableProps, VxeColumnPropTypes, VxeLoadingComponent, VxeTooltipInstance, VxeTooltipComponent } from '../../../types' + +const { getConfig, getI18n, renderer, formats, createEvent, globalResize, interceptor, hooks, globalEvents, GLOBAL_EVENT_KEYS, useFns } = VxeUI const isWebkit = browse['-webkit'] && !browse.edge @@ -34,13 +36,9 @@ export default defineComponent({ setup (props, context) { const { slots, emit } = context - const hasUseTooltip = VXETable.tooltip - const xID = XEUtils.uniqueId() - const computeSize = useSize(props) - - const instance = getCurrentInstance() + const { computeSize } = useFns.useSize(props) const reactData = reactive({ // 低性能的静态列 @@ -128,7 +126,10 @@ export default defineComponent({ activeBtn: false, activeWrapper: false, visible: false, - maxHeight: 0 + maxHeight: 0, + oldSortMaps: {}, + oldFixedMaps: {}, + oldVisibleMaps: {} }, customColumnList: [], // 当前选中的筛选列 @@ -334,7 +335,7 @@ export default defineComponent({ const refTooltip = ref() as Ref const refCommTooltip = ref() as Ref const refValidTooltip = ref() as Ref - const refTableMenu = ref() as Ref + const refTableMenu = ref() as Ref const refTableFilter = ref() as Ref const refTableCustom = ref() as Ref @@ -353,19 +354,19 @@ export default defineComponent({ const refCellResizeBar = ref() as Ref const refEmptyPlaceholder = ref() as Ref - const $xegrid = inject<(VxeGridConstructor & VxeGridPrivateMethods) | null>('$xegrid', null) - let $xetoolbar: VxeToolbarConstructor + const $xeGrid = inject<(VxeGridConstructor & VxeGridPrivateMethods) | null>('$xeGrid', null) + let $xeToolbar: VxeToolbarConstructor const computeValidOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.validConfig, props.validConfig) as VxeTablePropTypes.ValidOpts + return Object.assign({}, getConfig().table.validConfig, props.validConfig) as VxeTablePropTypes.ValidOpts }) const computeSXOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.scrollX, props.scrollX) as VxeTablePropTypes.SXOpts + return Object.assign({}, getConfig().table.scrollX, props.scrollX) as VxeTablePropTypes.SXOpts }) const computeSYOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.scrollY, props.scrollY) as VxeTablePropTypes.SYOpts + return Object.assign({}, getConfig().table.scrollY, props.scrollY) as VxeTablePropTypes.SYOpts }) const computeRowHeightMaps = computed(() => { @@ -378,37 +379,37 @@ export default defineComponent({ }) const computeColumnOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.columnConfig, props.columnConfig) as VxeTablePropTypes.ColumnOpts + return Object.assign({}, getConfig().table.columnConfig, props.columnConfig) as VxeTablePropTypes.ColumnOpts }) const computeRowOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.rowConfig, props.rowConfig) as VxeTablePropTypes.RowOpts + return Object.assign({}, getConfig().table.rowConfig, props.rowConfig) as VxeTablePropTypes.RowOpts }) const computeResizeleOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.resizeConfig, props.resizeConfig) as VxeTablePropTypes.ResizeOpts + return Object.assign({}, getConfig().table.resizeConfig, props.resizeConfig) as VxeTablePropTypes.ResizeOpts }) const computeResizableOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.resizableConfig, props.resizableConfig) as VxeTablePropTypes.ResizableOpts + return Object.assign({}, getConfig().table.resizableConfig, props.resizableConfig) as VxeTablePropTypes.ResizableOpts }) const computeSeqOpts = computed(() => { - return Object.assign({ startIndex: 0 }, GlobalConfig.table.seqConfig, props.seqConfig) as VxeTablePropTypes.SeqOpts + return Object.assign({ startIndex: 0 }, getConfig().table.seqConfig, props.seqConfig) as VxeTablePropTypes.SeqOpts }) const computeRadioOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.radioConfig, props.radioConfig) as VxeTablePropTypes.RadioOpts + return Object.assign({}, getConfig().table.radioConfig, props.radioConfig) as VxeTablePropTypes.RadioOpts }) const computeCheckboxOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.checkboxConfig, props.checkboxConfig) as VxeTablePropTypes.CheckboxOpts + return Object.assign({}, getConfig().table.checkboxConfig, props.checkboxConfig) as VxeTablePropTypes.CheckboxOpts }) let computeTooltipOpts = ref() as ComputedRef computeTooltipOpts = computed(() => { - return Object.assign({}, GlobalConfig.tooltip, GlobalConfig.table.tooltipConfig, props.tooltipConfig) + return Object.assign({}, getConfig().tooltip, getConfig().table.tooltipConfig, props.tooltipConfig) }) const computeTipConfig = computed(() => { @@ -424,39 +425,39 @@ export default defineComponent({ }) const computeEditOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.editConfig, props.editConfig) as VxeTablePropTypes.EditOpts + return Object.assign({}, getConfig().table.editConfig, props.editConfig) as VxeTablePropTypes.EditOpts }) const computeSortOpts = computed(() => { - return Object.assign({ orders: ['asc', 'desc', null] }, GlobalConfig.table.sortConfig, props.sortConfig) as VxeTablePropTypes.SortOpts + return Object.assign({ orders: ['asc', 'desc', null] }, getConfig().table.sortConfig, props.sortConfig) as VxeTablePropTypes.SortOpts }) const computeFilterOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.filterConfig, props.filterConfig) as VxeTablePropTypes.FilterOpts + return Object.assign({}, getConfig().table.filterConfig, props.filterConfig) as VxeTablePropTypes.FilterOpts }) const computeMouseOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.mouseConfig, props.mouseConfig) as VxeTablePropTypes.MouseOpts + return Object.assign({}, getConfig().table.mouseConfig, props.mouseConfig) as VxeTablePropTypes.MouseOpts }) const computeAreaOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.areaConfig, props.areaConfig) as VxeTablePropTypes.AreaOpts + return Object.assign({}, getConfig().table.areaConfig, props.areaConfig) as VxeTablePropTypes.AreaOpts }) const computeKeyboardOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.keyboardConfig, props.keyboardConfig) as VxeTablePropTypes.KeyboardOpts + return Object.assign({}, getConfig().table.keyboardConfig, props.keyboardConfig) as VxeTablePropTypes.KeyboardOpts }) const computeClipOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.clipConfig, props.clipConfig) + return Object.assign({}, getConfig().table.clipConfig, props.clipConfig) }) const computeFNROpts = computed(() => { - return Object.assign({}, GlobalConfig.table.fnrConfig, props.fnrConfig) as VxeTablePropTypes.FNROpts + return Object.assign({}, getConfig().table.fnrConfig, props.fnrConfig) as VxeTablePropTypes.FNROpts }) const computeMenuOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.menuConfig, props.menuConfig) as VxeTablePropTypes.MenuOpts + return Object.assign({}, getConfig().table.menuConfig, props.menuConfig) as VxeTablePropTypes.MenuOpts }) const computeHeaderMenu = computed(() => { @@ -497,31 +498,31 @@ export default defineComponent({ }) const computeExportOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.exportConfig, props.exportConfig) as VxeTablePropTypes.ExportOpts + return Object.assign({}, getConfig().table.exportConfig, props.exportConfig) as VxeTablePropTypes.ExportOpts }) const computeImportOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.importConfig, props.importConfig) as VxeTablePropTypes.ImportOpts + return Object.assign({}, getConfig().table.importConfig, props.importConfig) as VxeTablePropTypes.ImportOpts }) const computePrintOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.printConfig, props.printConfig) as VxeTablePropTypes.PrintOpts + return Object.assign({}, getConfig().table.printConfig, props.printConfig) as VxeTablePropTypes.PrintOpts }) const computeExpandOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.expandConfig, props.expandConfig) as VxeTablePropTypes.ExpandOpts + return Object.assign({}, getConfig().table.expandConfig, props.expandConfig) as VxeTablePropTypes.ExpandOpts }) const computeTreeOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.treeConfig, props.treeConfig) as VxeTablePropTypes.TreeOpts + return Object.assign({}, getConfig().table.treeConfig, props.treeConfig) as VxeTablePropTypes.TreeOpts }) const computeEmptyOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.emptyRender, props.emptyRender) as VxeTablePropTypes.EmptyOpts + return Object.assign({}, getConfig().table.emptyRender, props.emptyRender) as VxeTablePropTypes.EmptyOpts }) const computeLoadingOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.loadingConfig, props.loadingConfig) as VxeTablePropTypes.LoadingOpts + return Object.assign({}, getConfig().table.loadingConfig, props.loadingConfig) as VxeTablePropTypes.LoadingOpts }) const computeCellOffsetWidth = computed(() => { @@ -529,7 +530,7 @@ export default defineComponent({ }) const computeCustomOpts = computed(() => { - return Object.assign({}, GlobalConfig.table.customConfig, props.customConfig) + return Object.assign({}, getConfig().table.customConfig, props.customConfig) }) const computeFixedColumnSize = computed(() => { @@ -647,17 +648,16 @@ export default defineComponent({ computeIsAllCheckboxDisabled } - const $xetable = { + const $xeTable = { xID, props: props as VxeTableProps, context, - instance, reactData, internalData, getRefMaps: () => refMaps, getComputeMaps: () => computeMaps, - xegrid: $xegrid + xegrid: $xeGrid } as unknown as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods const eqCellValue = (row1: any, row2: any, field: string) => { @@ -681,7 +681,7 @@ export default defineComponent({ } const getCustomStorageMap = (key: string) => { - const version = GlobalConfig.version + const version = getConfig().version const rest = XEUtils.toStringJSON(localStorage.getItem(key) || '') return rest && rest._v === version ? rest : { _v: version } } @@ -701,7 +701,7 @@ export default defineComponent({ const { fullDataRowIdData } = internalData const reserveList: any[] = [] XEUtils.each(reserveRowMap, (item, rowid) => { - if (fullDataRowIdData[rowid] && $xetable.findRowIndexOf(reserveList, fullDataRowIdData[rowid].row) === -1) { + if (fullDataRowIdData[rowid] && $xeTable.findRowIndexOf(reserveList, fullDataRowIdData[rowid].row) === -1) { reserveList.push(fullDataRowIdData[rowid].row) } }) @@ -802,7 +802,7 @@ export default defineComponent({ rowspan = XEUtils.toNumber(rowspan) || 1 colspan = XEUtils.toNumber(colspan) || 1 if (rowspan > 1 || colspan > 1) { - const mcIndex = XEUtils.findIndexOf(mList, item => (item._row === row || getRowid($xetable, item._row) === getRowid($xetable, row)) && ((item as any)._col.id === col || item._col.id === (col as VxeTableDefines.ColumnInfo).id)) + const mcIndex = XEUtils.findIndexOf(mList, item => (item._row === row || getRowid($xeTable, item._row) === getRowid($xeTable, row)) && ((item as any)._col.id === col || item._col.id === (col as VxeTableDefines.ColumnInfo).id)) const mergeItem = mList[mcIndex] if (mergeItem) { mergeItem.rowspan = rowspan @@ -810,7 +810,7 @@ export default defineComponent({ mergeItem._rowspan = rowspan mergeItem._colspan = colspan } else { - const mergeRowIndex = rowList ? $xetable.findRowIndexOf(rowList, row) : row + const mergeRowIndex = rowList ? $xeTable.findRowIndexOf(rowList, row) : row const mergeColIndex = tableMethods.getVTColumnIndex(col) mList.push({ row: mergeRowIndex, @@ -848,7 +848,7 @@ export default defineComponent({ if (XEUtils.isNumber(col)) { col = visibleColumn[col] } - const mcIndex = XEUtils.findIndexOf(mList, item => (item._row === row || getRowid($xetable, item._row) === getRowid($xetable, row)) && ((item as any)._col.id === col || item._col.id === (col as VxeTableDefines.ColumnInfo).id)) + const mcIndex = XEUtils.findIndexOf(mList, item => (item._row === row || getRowid($xeTable, item._row) === getRowid($xeTable, row)) && ((item as any)._col.id === col || item._col.id === (col as VxeTableDefines.ColumnInfo).id)) if (mcIndex > -1) { const rItems = mList.splice(mcIndex, 1) rest.push(rItems[0]) @@ -873,7 +873,7 @@ export default defineComponent({ if (val === 'auto') { num = parentHeight } else { - const excludeHeight = $xetable.getExcludeHeight() + const excludeHeight = $xeTable.getExcludeHeight() if (isScale(val)) { num = Math.floor((XEUtils.toInteger(val) || 1) / 100 * parentHeight) } else { @@ -891,13 +891,16 @@ export default defineComponent({ const restoreCustomStorage = () => { const { id, customConfig } = props const customOpts = computeCustomOpts.value - const { storage } = customOpts + const { storage, restoreStore } = customOpts const isAllCustom = storage === true - const storageOpts: VxeTableCustomStorageObj = isAllCustom ? {} : Object.assign({}, storage || {}) + const storageOpts: VxeTableDefines.VxeTableCustomStorageObj = isAllCustom ? {} : Object.assign({}, storage || {}) const isCustomResizable = isAllCustom || storageOpts.resizable const isCustomVisible = isAllCustom || storageOpts.visible const isCustomFixed = isAllCustom || storageOpts.fixed const isCustomSort = isAllCustom || storageOpts.sort + if (storage && id && restoreStore) { + restoreStore({ id }) + } if (customConfig && (isCustomResizable || isCustomVisible || isCustomFixed || isCustomSort)) { const customMap: { [key: string]: { @@ -1035,7 +1038,7 @@ export default defineComponent({ const { id: colid, field, fixed, type, treeNode } = column const rest = { column, colid, index, items, parent } if (field) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (fullColumnFieldData[field]) { warnLog('vxe.error.colRepet', ['field', field]) } @@ -1049,7 +1052,7 @@ export default defineComponent({ htmlColumn = column } if (treeNode) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (treeNodeColumn) { warnLog('vxe.error.colRepet', ['tree-node', treeNode]) } @@ -1058,7 +1061,7 @@ export default defineComponent({ treeNodeColumn = column } } else if (type === 'expand') { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (expandColumn) { warnLog('vxe.error.colRepet', ['type', type]) } @@ -1067,7 +1070,7 @@ export default defineComponent({ expandColumn = column } } - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (type === 'checkbox') { if (checkboxColumn) { warnLog('vxe.error.colRepet', ['type', type]) @@ -1101,13 +1104,13 @@ export default defineComponent({ tableFullColumn.forEach(handleFunc) } - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (expandColumn && mouseOpts.area) { errLog('vxe.error.errConflicts', ['mouse-config.area', 'column.type=expand']) } } - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (htmlColumn) { if (!columnOpts.useKey) { errLog('vxe.error.reqProp', ['column-config.useKey', 'column.type=html']) @@ -1300,7 +1303,7 @@ export default defineComponent({ const fullMaps: Record = {} if (treeConfig) { XEUtils.eachTree(afterTreeFullData, (row, index, items, path) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const allrest = fullAllDataRowIdData[rowid] const seq = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('') if (allrest) { @@ -1315,7 +1318,7 @@ export default defineComponent({ }, { children: treeOpts.transform ? treeOpts.mapChildrenField : childrenField }) } else { afterFullData.forEach((row, index) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const allrest = fullAllDataRowIdData[rowid] const seq = index + 1 if (allrest) { @@ -1346,8 +1349,8 @@ export default defineComponent({ [key: string]: number } = {} XEUtils.eachTree(internalData.afterTreeFullData, (row, index, items, path, parent) => { - const rowid = getRowid($xetable, row) - const parentRowid = getRowid($xetable, parent) + const rowid = getRowid($xeTable, row) + const parentRowid = getRowid($xeTable, parent) if (!parent || (expandMaps[parentRowid] && treeExpandedMaps[parentRowid])) { expandMaps[rowid] = 1 fullData.push(row) @@ -1413,18 +1416,18 @@ export default defineComponent({ const handleFilter = (row: any) => { return filterColumns.every(({ column, valueList, itemList }) => { const { filterMethod, filterRender } = column - const compConf = filterRender ? VXETable.renderer.get(filterRender.name) : null + const compConf = filterRender ? renderer.get(filterRender.name) : null const compFilterMethod = compConf ? compConf.filterMethod : null const defaultFilterMethod = compConf ? compConf.defaultFilterMethod : null const cellValue = getCellValue(row, column) if (filterMethod) { - return itemList.some((item) => filterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xetable })) + return itemList.some((item) => filterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable })) } else if (compFilterMethod) { - return itemList.some((item) => compFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xetable })) + return itemList.some((item) => compFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable })) } else if (allFilterMethod) { return allFilterMethod({ options: itemList, values: valueList, cellValue, row, column }) } else if (defaultFilterMethod) { - return itemList.some((item) => defaultFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xetable })) + return itemList.some((item) => defaultFilterMethod({ value: item.value, option: item, cellValue, row, column, $table: $xeTable })) } return valueList.indexOf(XEUtils.get(row, column.field)) > -1 }) @@ -1454,7 +1457,7 @@ export default defineComponent({ if (treeConfig && transform) { // 虚拟树和列表一样，只能排序根级节点 if (allSortMethod) { - const sortRests = allSortMethod({ data: tableTree, sortList: orderColumns, $table: $xetable }) + const sortRests = allSortMethod({ data: tableTree, sortList: orderColumns, $table: $xeTable }) tableTree = XEUtils.isArray(sortRests) ? sortRests : tableTree } else { tableTree = XEUtils.orderBy(tableTree, orderColumns.map(({ column, order }) => [getOrderField(column), order])) @@ -1462,7 +1465,7 @@ export default defineComponent({ tableData = tableTree } else { if (allSortMethod) { - const sortRests = allSortMethod({ data: tableData, sortList: orderColumns, $table: $xetable }) + const sortRests = allSortMethod({ data: tableData, sortList: orderColumns, $table: $xeTable }) tableData = XEUtils.isArray(sortRests) ? sortRests : tableData } else { tableData = XEUtils.orderBy(tableData, orderColumns.map(({ column, order }) => [getOrderField(column), order])) @@ -1730,14 +1733,14 @@ export default defineComponent({ tableMethods.setCurrentRow(currentRow) } if (mouseConfig && mouseOpts.selected && editStore.selected.row && editStore.selected.column) { - $xetable.addCellSelectedClass() + $xeTable.addCellSelectedClass() } return nextTick() } const checkValidate = (type: any) => { - if ($xetable.triggerValidate) { - return $xetable.triggerValidate(type) + if ($xeTable.triggerValidate) { + return $xeTable.triggerValidate(type) } return nextTick() } @@ -1750,7 +1753,7 @@ export default defineComponent({ checkValidate('blur') .catch((e: any) => e) .then(() => { - $xetable.handleActived(params, evnt) + $xeTable.handleActived(params, evnt) .then(() => checkValidate('change')) .catch((e: any) => e) }) @@ -1821,7 +1824,7 @@ export default defineComponent({ handleCheckedRadioRow(fullDataRowIdData[rowid].row, true) } if (reserve) { - const rowkey = getRowkey($xetable) + const rowkey = getRowkey($xeTable) internalData.radioReserveRow = { [rowkey]: rowid } } } @@ -1862,7 +1865,7 @@ export default defineComponent({ const { checkboxReserveRowMap } = internalData const checkboxOpts = computeCheckboxOpts.value if (checkboxOpts.reserve) { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (checked) { checkboxReserveRowMap[rowid] = row } else if (checkboxReserveRowMap[rowid]) { @@ -1921,7 +1924,7 @@ export default defineComponent({ const checkValFn = (row: any) => { if (isForce || (!checkMethod || checkMethod({ row }))) { if (value) { - selectRowMaps[getRowid($xetable, row)] = row + selectRowMaps[getRowid($xeTable, row)] = row } XEUtils.set(row, checkField, value) } @@ -1949,7 +1952,7 @@ export default defineComponent({ */ XEUtils.eachTree(afterFullData, (row) => { if (isForce || (!checkMethod || checkMethod({ row }))) { - selectRowMaps[getRowid($xetable, row)] = row + selectRowMaps[getRowid($xeTable, row)] = row } }, { children: childrenField }) } else { @@ -1959,7 +1962,7 @@ export default defineComponent({ */ if (!isForce && checkMethod) { XEUtils.eachTree(afterFullData, (row) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (checkMethod({ row }) ? 0 : selectCheckboxMaps[rowid]) { selectRowMaps[rowid] = row } @@ -1975,14 +1978,14 @@ export default defineComponent({ */ if (!isForce && checkMethod) { afterFullData.forEach((row) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (selectCheckboxMaps[rowid] || checkMethod({ row })) { selectRowMaps[rowid] = row } }) } else { afterFullData.forEach(row => { - selectRowMaps[getRowid($xetable, row)] = row + selectRowMaps[getRowid($xeTable, row)] = row }) } } else { @@ -1993,7 +1996,7 @@ export default defineComponent({ */ if (!isForce && checkMethod) { afterFullData.forEach((row) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (checkMethod({ row }) ? 0 : selectCheckboxMaps[rowid]) { selectRowMaps[rowid] = row } @@ -2029,12 +2032,12 @@ export default defineComponent({ const radioOpts = computeRadioOpts.value const checkboxOpts = computeCheckboxOpts.value // 单选框 - if (selectRadioRow && !fullAllDataRowIdData[getRowid($xetable, selectRadioRow)]) { + if (selectRadioRow && !fullAllDataRowIdData[getRowid($xeTable, selectRadioRow)]) { reactData.selectRadioRow = null // 刷新单选行状态 } // 还原保留选中状态 if (radioOpts.reserve && radioReserveRow) { - const rowid = getRowid($xetable, radioReserveRow) + const rowid = getRowid($xeTable, radioReserveRow) if (fullDataRowIdData[rowid]) { handleCheckedRadioRow(fullDataRowIdData[rowid].row, true) } @@ -2045,7 +2048,7 @@ export default defineComponent({ if (checkboxOpts.reserve) { handleCheckedCheckboxRow(handleReserveRow(internalData.checkboxReserveRowMap), true, true) } - if (currentRow && !fullAllDataRowIdData[getRowid($xetable, currentRow)]) { + if (currentRow && !fullAllDataRowIdData[getRowid($xeTable, currentRow)]) { reactData.currentRow = null // 刷新当前行状态 } // 行展开 @@ -2075,7 +2078,7 @@ export default defineComponent({ tableMethods.setAllTreeExpand(true) } else if (expandRowKeys) { const defExpandeds: any[] = [] - const rowkey = getRowkey($xetable) + const rowkey = getRowkey($xeTable) expandRowKeys.forEach((rowid: any) => { const matchObj = XEUtils.findTree(tableFullData, item => rowid === XEUtils.get(item, rowkey), { children: childrenField }) if (matchObj) { @@ -2096,10 +2099,10 @@ export default defineComponent({ if (loadMethod) { const { treeExpandLazyLoadedMaps } = reactData const { fullAllDataRowIdData } = internalData - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const rest = fullAllDataRowIdData[rowid] treeExpandLazyLoadedMaps[rowid] = row - loadMethod({ $table: $xetable, row }).then((childRecords: any) => { + loadMethod({ $table: $xeTable, row }).then((childRecords: any) => { rest.treeLoaded = true if (treeExpandLazyLoadedMaps[rowid]) { delete treeExpandLazyLoadedMaps[rowid] @@ -2143,7 +2146,7 @@ export default defineComponent({ const { treeExpandedReserveRowMap } = internalData const treeOpts = computeTreeOpts.value if (treeOpts.reserve) { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (expanded) { treeExpandedReserveRowMap[rowid] = row } else if (treeExpandedReserveRowMap[rowid]) { @@ -2159,10 +2162,10 @@ export default defineComponent({ if (loadMethod) { const { fullAllDataRowIdData } = internalData const { rowExpandLazyLoadedMaps } = reactData - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const rest = fullAllDataRowIdData[rowid] rowExpandLazyLoadedMaps[rowid] = row - loadMethod({ $table: $xetable, row, rowIndex: tableMethods.getRowIndex(row), $rowIndex: tableMethods.getVMRowIndex(row) }).then(() => { + loadMethod({ $table: $xeTable, row, rowIndex: tableMethods.getRowIndex(row), $rowIndex: tableMethods.getVMRowIndex(row) }).then(() => { const { rowExpandedMaps } = reactData rest.expandLoaded = true rowExpandedMaps[rowid] = row @@ -2185,7 +2188,7 @@ export default defineComponent({ const { rowExpandedReserveRowMap } = internalData const expandOpts = computeExpandOpts.value if (expandOpts.reserve) { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (expanded) { rowExpandedReserveRowMap[rowid] = row } else if (rowExpandedReserveRowMap[rowid]) { @@ -2258,7 +2261,7 @@ export default defineComponent({ if (treeConfig) { if (transform) { // 树结构自动转换 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (!treeOpts.rowField) { errLog('vxe.error.reqProp', ['tree-config.rowField']) } @@ -2311,7 +2314,7 @@ export default defineComponent({ if (keepSource) { tablePrivateMethods.cacheSourceMap(fullData) } - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (sYLoad) { if (!(props.height || props.maxHeight)) { errLog('vxe.error.reqProp', ['table.height | table.max-height | table.scroll-y={enabled: false}']) @@ -2324,9 +2327,9 @@ export default defineComponent({ } } } - if ($xetable.clearCellAreas && props.mouseConfig) { - $xetable.clearCellAreas() - $xetable.clearCopyCellArea() + if ($xeTable.clearCellAreas && props.mouseConfig) { + $xeTable.clearCellAreas() + $xeTable.clearCopyCellArea() } tableMethods.clearMergeCells() tableMethods.clearMergeFooterItems() @@ -2361,9 +2364,9 @@ export default defineComponent({ } // 是否变更虚拟滚动 if (oldScrollYLoad === sYLoad) { - restoreScrollLocation($xetable, targetScrollLeft, targetScrollTop).then(resolve) + restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop).then(resolve) } else { - setTimeout(() => restoreScrollLocation($xetable, targetScrollLeft, targetScrollTop).then(resolve)) + setTimeout(() => restoreScrollLocation($xeTable, targetScrollLeft, targetScrollTop).then(resolve)) } }) }) @@ -2509,7 +2512,7 @@ export default defineComponent({ reactData.hasFixedColumn = leftList.length > 0 || rightList.length > 0 Object.assign(columnStore, { leftList, centerList, rightList }) if (scrollXLoad) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { // if (props.showHeader && !props.showHeaderOverflow) { // warnLog('vxe.error.reqProp', ['show-header-overflow']) // } @@ -2576,14 +2579,14 @@ export default defineComponent({ tableMethods.clearMergeCells() tableMethods.clearMergeFooterItems() tablePrivateMethods.handleTableData(true) - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if ((reactData.scrollXLoad || reactData.scrollYLoad) && reactData.expandColumn) { warnLog('vxe.error.scrollErrProp', ['column.type=expand']) } } return nextTick().then(() => { - if ($xetoolbar) { - $xetoolbar.syncUpdate({ collectColumn, $table: $xetable }) + if ($xeToolbar) { + $xeToolbar.syncUpdate({ collectColumn, $table: $xeTable }) } return tableMethods.recalculate() }) @@ -2618,14 +2621,14 @@ export default defineComponent({ const result: any[] = [] const columnIndex = tableMethods.getColumnIndex(treeNodeColumn) const $columnIndex = tableMethods.getVMColumnIndex(treeNodeColumn) - let validRows = toggleMethod ? rows.filter((row: any) => toggleMethod({ $table: $xetable, expanded, column: treeNodeColumn, columnIndex, $columnIndex, row })) : rows + let validRows = toggleMethod ? rows.filter((row: any) => toggleMethod({ $table: $xeTable, expanded, column: treeNodeColumn, columnIndex, $columnIndex, row })) : rows if (accordion) { validRows = validRows.length ? [validRows[validRows.length - 1]] : [] // 同一级只能展开一个 const matchObj = XEUtils.findTree(tableFullData, item => item === validRows[0], { children: childrenField }) if (matchObj) { matchObj.items.forEach(item => { - const rowid = getRowid($xetable, item) + const rowid = getRowid($xeTable, item) if (treeTempExpandedMaps[rowid]) { delete treeTempExpandedMaps[rowid] } @@ -2634,7 +2637,7 @@ export default defineComponent({ } if (expanded) { validRows.forEach((row: any) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (!treeTempExpandedMaps[rowid]) { const rest = fullAllDataRowIdData[rowid] const isLoad = lazy && row[hasChildField] && !rest.treeLoaded && !treeExpandLazyLoadedMaps[rowid] @@ -2650,7 +2653,7 @@ export default defineComponent({ }) } else { validRows.forEach(item => { - const rowid = getRowid($xetable, item) + const rowid = getRowid($xeTable, item) if (treeTempExpandedMaps[rowid]) { delete treeTempExpandedMaps[rowid] } @@ -2709,7 +2712,7 @@ export default defineComponent({ return function (row: any) { const { fullAllDataRowIdData } = internalData if (row) { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const rest = fullAllDataRowIdData[rowid] if (rest) { return rest[prop] @@ -2740,13 +2743,13 @@ export default defineComponent({ tableMethods = { dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $table: $xetable, $grid: $xegrid, $event: evnt }, params)) + emit(type, createEvent(evnt, { $table: $xeTable, $grid: $xeGrid }, params)) }, /** * 重置表格的一切数据状态 */ clearAll () { - return clearTableAllStatus($xetable) + return clearTableAllStatus($xeTable) }, /** * 同步 data 数据（即将废弃） @@ -2783,7 +2786,7 @@ export default defineComponent({ return tableMethods.recalculate(true) }).then(() => { // 存在滚动行为未结束情况 - setTimeout(() => $xetable.recalculate(), 50) + setTimeout(() => $xeTable.recalculate(), 50) }) }, /** @@ -2824,6 +2827,19 @@ export default defineComponent({ return tableMethods.recalculate() }) }, + /** + * 修改行数据 + */ + setRow (rows, record) { + if (rows && record) { + let rest: any[] = rows + if (!XEUtils.isArray(rows)) { + rest = [rows] + } + rest.forEach(item => Object.assign(item, record)) + } + return nextTick() + }, /** * 局部加载行数据并恢复到初始状态 * 对于行数据需要局部更改的场景中可能会用到 @@ -2850,7 +2866,7 @@ export default defineComponent({ } reactData.tableData = tableData.slice(0) } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.reqProp', ['keep-source']) } } @@ -2865,22 +2881,22 @@ export default defineComponent({ const treeOpts = computeTreeOpts.value const { transform, mapChildrenField } = treeOpts const childrenField = treeOpts.children || treeOpts.childrenField - const parentRest = fullAllDataRowIdData[getRowid($xetable, row)] + const parentRest = fullAllDataRowIdData[getRowid($xeTable, row)] const parentLevel = parentRest ? parentRest.level : 0 return tableMethods.createData(childRecords).then((rows) => { if (keepSource) { - const rowid = getRowid($xetable, row) - const matchObj = XEUtils.findTree(tableSourceData, (item) => rowid === getRowid($xetable, item), { children: childrenField }) + const rowid = getRowid($xeTable, row) + const matchObj = XEUtils.findTree(tableSourceData, (item) => rowid === getRowid($xeTable, item), { children: childrenField }) if (matchObj) { matchObj.item[childrenField] = XEUtils.clone(rows, true) } rows.forEach(childRow => { - const rowid = getRowid($xetable, childRow) + const rowid = getRowid($xeTable, childRow) sourceDataRowIdData[rowid] = XEUtils.clone(childRow, true) }) } XEUtils.eachTree(rows, (childRow, index, items, path, parent, nodes) => { - const rowid = getRowid($xetable, childRow) + const rowid = getRowid($xeTable, childRow) const parentRow = parent || parentRest.row const rest = { row: childRow, rowid, seq: -1, index, _index: -1, $index: -1, items, parent: parentRow, level: parentLevel + nodes.length } fullDataRowIdData[rowid] = rest @@ -2900,7 +2916,7 @@ export default defineComponent({ * @param {ColumnInfo} columns 列配置 */ loadColumn (columns) { - const collectColumn = XEUtils.mapTree(columns, column => reactive(Cell.createColumn($xetable, column))) + const collectColumn = XEUtils.mapTree(columns, column => reactive(Cell.createColumn($xeTable, column))) return handleColumn(collectColumn) }, /** @@ -3015,7 +3031,7 @@ export default defineComponent({ const { keepSource } = props const { tableSourceData, sourceDataRowIdData } = internalData if (!keepSource) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.reqProp', ['keep-source']) } return nextTick() @@ -3026,12 +3042,12 @@ export default defineComponent({ targetRows = [rows] } } else { - targetRows = XEUtils.toArray($xetable.getUpdateRecords()) + targetRows = XEUtils.toArray($xeTable.getUpdateRecords()) } if (targetRows.length) { targetRows.forEach((row: any) => { if (!tableMethods.isInsertByRow(row)) { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const oRow = sourceDataRowIdData[rowid] if (oRow && row) { if (field) { @@ -3083,7 +3099,7 @@ export default defineComponent({ */ isInsertByRow (row) { const { editStore } = reactData - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) return editStore.insertMaps[rowid] }, /** @@ -3093,7 +3109,7 @@ export default defineComponent({ removeInsertRow () { const { editStore } = reactData editStore.insertMaps = {} - return $xetable.remove($xetable.getInsertRecords()) + return $xeTable.remove($xeTable.getInsertRecords()) }, /** * 检查行或列数据是否发生改变 @@ -3104,7 +3120,7 @@ export default defineComponent({ const { keepSource } = props const { tableFullColumn, fullDataRowIdData, sourceDataRowIdData } = internalData if (keepSource) { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) // 新增的数据不需要检测 if (!fullDataRowIdData[rowid]) { return false @@ -3189,8 +3205,14 @@ export default defineComponent({ } else { const { selectCheckboxMaps } = reactData XEUtils.each(selectCheckboxMaps, (row, rowid) => { - if (isFull ? fullDataRowIdData[rowid] : afterFullRowMaps[rowid]) { - rowList.push(row) + if (isFull) { + if (fullDataRowIdData[rowid]) { + rowList.push(fullDataRowIdData[rowid].row) + } + } else { + if (afterFullRowMaps[rowid]) { + rowList.push(afterFullRowMaps[rowid]) + } } }) } @@ -3207,7 +3229,7 @@ export default defineComponent({ if (XEUtils.isString(rowOrRowid)) { rowid = rowOrRowid } else { - rowid = getRowid($xetable, rowOrRowid) + rowid = getRowid($xeTable, rowOrRowid) } if (rowid) { const rest = fullDataRowIdData[rowid] @@ -3230,7 +3252,7 @@ export default defineComponent({ * @param {Row} row 行对象 */ getRowid (row) { - return getRowid($xetable, row) + return getRowid($xeTable, row) }, /** * 获取处理后的表格数据 @@ -3251,18 +3273,18 @@ export default defineComponent({ * 设置为固定列 */ setColumnFixed (fieldOrColumn, fixed) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) - const targetColumn = getRootColumn($xetable, column as any) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) + const targetColumn = getRootColumn($xeTable, column as any) const isMaxFixedColumn = computeIsMaxFixedColumn.value const columnOpts = computeColumnOpts.value const { maxFixedSize } = columnOpts if (targetColumn && targetColumn.fixed !== fixed) { // 是否超过最大固定列数量 if (!targetColumn.fixed && isMaxFixedColumn) { - if (VXETable.modal) { - VXETable.modal.message({ + if (VxeUI.modal) { + VxeUI.modal.message({ status: 'error', - content: GlobalConfig.i18n('vxe.table.maxFixedCol', [maxFixedSize]) + content: getI18n('vxe.table.maxFixedCol', [maxFixedSize]) }) } return nextTick() @@ -3279,8 +3301,8 @@ export default defineComponent({ * 取消指定固定列 */ clearColumnFixed (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) - const targetColumn = getRootColumn($xetable, column as any) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) + const targetColumn = getRootColumn($xeTable, column as any) if (targetColumn && targetColumn.fixed) { XEUtils.eachTree([targetColumn], (column) => { column.fixed = null @@ -3294,7 +3316,7 @@ export default defineComponent({ * 隐藏指定列 */ hideColumn (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column && column.visible) { column.visible = false return tablePrivateMethods.handleCustom() @@ -3305,7 +3327,7 @@ export default defineComponent({ * 显示指定列 */ showColumn (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column && !column.visible) { column.visible = true return tablePrivateMethods.handleCustom() @@ -3313,7 +3335,7 @@ export default defineComponent({ return nextTick() }, setColumnWidth (fieldOrColumn, width) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column) { const colWidth = XEUtils.toInteger(width) let rdWidth = colWidth @@ -3328,7 +3350,7 @@ export default defineComponent({ return nextTick() }, getColumnWidth (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column) { return column.renderWidth } @@ -3343,7 +3365,7 @@ export default defineComponent({ const { collectColumn } = internalData const customOpts = computeCustomOpts.value const { checkMethod } = customOpts - const opts: VxeTableCustomStorageObj = Object.assign({ + const opts: VxeTableDefines.VxeTableCustomStorageObj = Object.assign({ visible: true, resizable: options === true, fixed: options === true, @@ -3362,6 +3384,7 @@ export default defineComponent({ if (!checkMethod || checkMethod({ column })) { column.visible = column.defaultVisible } + column.renderResizeWidth = column.renderWidth }) if (opts.resizable) { tablePrivateMethods.saveCustomResizable(true) @@ -3409,7 +3432,7 @@ export default defineComponent({ return new Promise(resolve => { // 还原滚动条位置 if (lastScrollLeft || lastScrollTop) { - return restoreScrollLocation($xetable, lastScrollLeft, lastScrollTop).then().then(() => { + return restoreScrollLocation($xeTable, lastScrollLeft, lastScrollTop).then().then(() => { // 存在滚动行为未结束情况 setTimeout(resolve, 30) }) @@ -3440,7 +3463,7 @@ export default defineComponent({ }, openTooltip (target, content) { const $commTip = refCommTooltip.value - if ($commTip) { + if ($commTip && $commTip.open) { return $commTip.open(target, content) } return nextTick() @@ -3459,11 +3482,11 @@ export default defineComponent({ content: null, visible: false }) - if ($tooltip) { + if ($tooltip && $tooltip.close) { $tooltip.close() } } - if ($commTip) { + if ($commTip && $commTip.close) { $commTip.close() } return nextTick() @@ -3520,11 +3543,11 @@ export default defineComponent({ if (checkField) { return XEUtils.get(row, checkField) } - return !!selectCheckboxMaps[getRowid($xetable, row)] + return !!selectCheckboxMaps[getRowid($xeTable, row)] }, isIndeterminateByCheckboxRow (row) { const { treeIndeterminateMaps } = reactData - return !!treeIndeterminateMaps[getRowid($xetable, row)] && !tableMethods.isCheckedByCheckboxRow(row) + return !!treeIndeterminateMaps[getRowid($xeTable, row)] && !tableMethods.isCheckedByCheckboxRow(row) }, /** * 多选，切换某一行的选中状态 @@ -3533,7 +3556,7 @@ export default defineComponent({ const { selectCheckboxMaps } = reactData const checkboxOpts = computeCheckboxOpts.value const { checkField } = checkboxOpts - const value = checkField ? !XEUtils.get(row, checkField) : !selectCheckboxMaps[getRowid($xetable, row)] + const value = checkField ? !XEUtils.get(row, checkField) : !selectCheckboxMaps[getRowid($xeTable, row)] tablePrivateMethods.handleSelectRow({ row }, value, true) return nextTick() }, @@ -3554,13 +3577,13 @@ export default defineComponent({ const treeOpts = computeTreeOpts.value const childrenField = treeOpts.children || treeOpts.childrenField if (radioOpts.reserve && radioReserveRow) { - const rowid = getRowid($xetable, radioReserveRow) + const rowid = getRowid($xeTable, radioReserveRow) if (isFull) { if (!fullDataRowIdData[rowid]) { return radioReserveRow } } else { - const rowkey = getRowkey($xetable) + const rowkey = getRowkey($xeTable) if (treeConfig) { const matchObj = XEUtils.findTree(afterFullData, row => rowid === XEUtils.get(row, rowkey), { children: childrenField }) if (matchObj) { @@ -3593,11 +3616,11 @@ export default defineComponent({ const afterFullIdMaps: { [key: string]: number } = {} if (treeConfig) { XEUtils.eachTree(afterFullData, row => { - afterFullIdMaps[getRowid($xetable, row)] = 1 + afterFullIdMaps[getRowid($xeTable, row)] = 1 }, { children: childrenField }) } else { afterFullData.forEach(row => { - afterFullIdMaps[getRowid($xetable, row)] = 1 + afterFullIdMaps[getRowid($xeTable, row)] = 1 }) } XEUtils.each(checkboxReserveRowMap, (oldRow, oldRowid) => { @@ -3673,13 +3696,13 @@ export default defineComponent({ reactData.currentRow = row if (rowOpts.isCurrent || props.highlightCurrentRow) { if (el) { - XEUtils.arrayEach(el.querySelectorAll(`[rowid="${getRowid($xetable, row)}"]`), elem => addClass(elem, 'row--current')) + XEUtils.arrayEach(el.querySelectorAll(`[rowid="${getRowid($xeTable, row)}"]`), elem => addClass(elem, 'row--current')) } } return nextTick() }, isCheckedByRadioRow (row) { - return $xetable.eqRow(reactData.selectRadioRow, row) + return $xeTable.eqRow(reactData.selectRadioRow, row) }, /** * 用于单选行，设置某一行为选中状态 @@ -3721,7 +3744,7 @@ export default defineComponent({ const { fullDataRowIdData, afterFullRowMaps } = internalData const { selectRadioRow } = reactData if (selectRadioRow) { - const rowid = getRowid($xetable, selectRadioRow) + const rowid = getRowid($xeTable, selectRadioRow) if (isFull) { if (fullDataRowIdData[rowid]) { return selectRadioRow @@ -3742,7 +3765,7 @@ export default defineComponent({ * 用于当前列，设置某列行为高亮状态 */ setCurrentColumn (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column) { // tableMethods.clearCurrentRow() tableMethods.clearCurrentColumn() @@ -3765,7 +3788,7 @@ export default defineComponent({ } if (status) { rows.forEach((row: any) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (rowid && !pendingMaps[rowid]) { pendingList.push(row) pendingMaps[rowid] = row @@ -3773,9 +3796,9 @@ export default defineComponent({ }) } else { rows.forEach((row: any) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (rowid && pendingMaps[rowid]) { - const pendingIndex = $xetable.findRowIndexOf(pendingList, row) + const pendingIndex = $xeTable.findRowIndexOf(pendingList, row) if (pendingIndex > -1) { pendingList.splice(pendingIndex, 1) } @@ -3794,10 +3817,10 @@ export default defineComponent({ rows = [rows] } rows.forEach((row: any) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (rowid) { if (pendingMaps[rowid]) { - const pendingIndex = $xetable.findRowIndexOf(pendingList, row) + const pendingIndex = $xeTable.findRowIndexOf(pendingList, row) if (pendingIndex > -1) { pendingList.splice(pendingIndex, 1) } @@ -3814,7 +3837,7 @@ export default defineComponent({ }, hasPendingByRow (row) { const { pendingRowMaps } = reactData - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) return !!pendingRowMaps[rowid] }, getPendingRecords () { @@ -3878,7 +3901,7 @@ export default defineComponent({ clearSort (fieldOrColumn) { const sortOpts = computeSortOpts.value if (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column) { column.order = null } @@ -3892,7 +3915,7 @@ export default defineComponent({ }, isSort (fieldOrColumn) { if (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) return column ? column.sortable && !!column.order : false } return tableMethods.getSortColumns().length > 0 @@ -3927,7 +3950,7 @@ export default defineComponent({ visible: false }) if (visible) { - $xetable.dispatchEvent('filter-visible', { column, property: column.field, field: column.field, filterList: $xetable.getCheckedFilters(), visible: false }, null) + $xeTable.dispatchEvent('filter-visible', { column, property: column.field, field: column.field, filterList: $xeTable.getCheckedFilters(), visible: false }, null) } return nextTick() }, @@ -3936,11 +3959,11 @@ export default defineComponent({ * @param {String} fieldOrColumn 字段名 */ isActiveFilterByColumn (fieldOrColumn) { - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column) { return column.filters && column.filters.some((option) => option.checked) } - return $xetable.getCheckedFilters().length > 0 + return $xeTable.getCheckedFilters().length > 0 }, isFilter (fieldOrColumn) { return tableMethods.isActiveFilterByColumn(fieldOrColumn) @@ -3951,7 +3974,7 @@ export default defineComponent({ */ isRowExpandLoaded (row) { const { fullAllDataRowIdData } = internalData - const rest = fullAllDataRowIdData[getRowid($xetable, row)] + const rest = fullAllDataRowIdData[getRowid($xeTable, row)] return rest && !!rest.expandLoaded }, clearRowExpandLoaded (row) { @@ -3959,7 +3982,7 @@ export default defineComponent({ const { fullAllDataRowIdData } = internalData const expandOpts = computeExpandOpts.value const { lazy } = expandOpts - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const rest = fullAllDataRowIdData[rowid] if (lazy && rest) { rest.expandLoaded = false @@ -3975,7 +3998,7 @@ export default defineComponent({ const { rowExpandLazyLoadedMaps } = reactData const expandOpts = computeExpandOpts.value const { lazy } = expandOpts - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (lazy && !rowExpandLazyLoadedMaps[rowid]) { tableMethods.clearRowExpandLoaded(row) .then(() => handleAsyncRowExpand(row)) @@ -3983,7 +4006,7 @@ export default defineComponent({ return nextTick() }, reloadExpandContent (row) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.delFunc', ['reloadExpandContent', 'reloadRowExpand']) } // 即将废弃 @@ -4038,10 +4061,10 @@ export default defineComponent({ rExpandedMaps = {} rows = rows.slice(rows.length - 1, rows.length) } - const validRows: any[] = toggleMethod ? rows.filter((row: any) => toggleMethod({ $table: $xetable, expanded, column, columnIndex, $columnIndex, row, rowIndex: tableMethods.getRowIndex(row), $rowIndex: tableMethods.getVMRowIndex(row) })) : rows + const validRows: any[] = toggleMethod ? rows.filter((row: any) => toggleMethod({ $table: $xeTable, expanded, column, columnIndex, $columnIndex, row, rowIndex: tableMethods.getRowIndex(row), $rowIndex: tableMethods.getVMRowIndex(row) })) : rows if (expanded) { validRows.forEach((row: any) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (!rExpandedMaps[rowid]) { const rest = fullAllDataRowIdData[rowid] const isLoad = lazy && !rest.expandLoaded && !rowExpandLazyLoadedMaps[rowid] @@ -4054,7 +4077,7 @@ export default defineComponent({ }) } else { validRows.forEach(item => { - const rowid = getRowid($xetable, item) + const rowid = getRowid($xeTable, item) if (rExpandedMaps[rowid]) { delete rExpandedMaps[rowid] } @@ -4073,12 +4096,12 @@ export default defineComponent({ */ isRowExpandByRow (row) { const { rowExpandedMaps } = reactData - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) return !!rowExpandedMaps[rowid] }, isExpandByRow (row) { // 已废弃 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.delFunc', ['isExpandByRow', 'isRowExpandByRow']) } return tableMethods.isRowExpandByRow(row) @@ -4129,7 +4152,7 @@ export default defineComponent({ */ isTreeExpandLoaded (row) { const { fullAllDataRowIdData } = internalData - const rest = fullAllDataRowIdData[getRowid($xetable, row)] + const rest = fullAllDataRowIdData[getRowid($xeTable, row)] return rest && !!rest.treeLoaded }, clearTreeExpandLoaded (row) { @@ -4137,7 +4160,7 @@ export default defineComponent({ const { fullAllDataRowIdData } = internalData const treeOpts = computeTreeOpts.value const { transform, lazy } = treeOpts - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const rest = fullAllDataRowIdData[rowid] if (lazy && rest) { rest.treeLoaded = false @@ -4160,7 +4183,7 @@ export default defineComponent({ const treeOpts = computeTreeOpts.value const hasChildField = treeOpts.hasChild || treeOpts.hasChildField const { transform, lazy } = treeOpts - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (lazy && row[hasChildField] && !treeExpandLazyLoadedMaps[rowid]) { tableMethods.clearTreeExpandLoaded(row).then(() => { return handleAsyncTreeExpandChilds(row) @@ -4176,7 +4199,7 @@ export default defineComponent({ return nextTick() }, reloadTreeChilds (row) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { warnLog('vxe.error.delFunc', ['reloadTreeChilds', 'reloadTreeExpand']) } // 即将废弃 @@ -4242,7 +4265,7 @@ export default defineComponent({ */ isTreeExpandByRow (row) { const { treeExpandedMaps } = reactData - return !!treeExpandedMaps[getRowid($xetable, row)] + return !!treeExpandedMaps[getRowid($xeTable, row)] }, /** * 手动清空树形节点的展开状态，数据会恢复成未展开的状态 @@ -4326,7 +4349,7 @@ export default defineComponent({ if (props.treeConfig) { rest.push(tablePrivateMethods.scrollToTreeRow(row)) } else { - rest.push(rowToVisible($xetable, row)) + rest.push(rowToVisible($xeTable, row)) } } if (fieldOrColumn) { @@ -4339,9 +4362,9 @@ export default defineComponent({ */ scrollToColumn (fieldOrColumn) { const { fullColumnIdData } = internalData - const column = handleFieldOrColumn($xetable, fieldOrColumn) + const column = handleFieldOrColumn($xeTable, fieldOrColumn) if (column && fullColumnIdData[column.id]) { - return colToVisible($xetable, column) + return colToVisible($xeTable, column) } return nextTick() }, @@ -4382,7 +4405,7 @@ export default defineComponent({ if (showFooter && footerData && footerData.length) { footData = footerData.slice(0) } else if (showFooter && footerMethod) { - footData = visibleColumn.length ? footerMethod({ columns: visibleColumn, data: afterFullData, $table: $xetable, $grid: $xegrid }) : [] + footData = visibleColumn.length ? footerMethod({ columns: visibleColumn, data: afterFullData, $table: $xeTable, $grid: $xeGrid }) : [] } reactData.footerTableData = footData return nextTick() @@ -4401,22 +4424,22 @@ export default defineComponent({ if (slotParams && tableBody && editRules) { const { row, column } = slotParams const type = 'change' - if ($xetable.hasCellRules) { - if ($xetable.hasCellRules(type, row, column)) { + if ($xeTable.hasCellRules) { + if ($xeTable.hasCellRules(type, row, column)) { const cell = tablePrivateMethods.getCell(row, column) if (cell) { - return $xetable.validCellRules(type, row, column, cellValue) + return $xeTable.validCellRules(type, row, column, cellValue) .then(() => { if (customVal && validStore.visible) { setCellValue(row, column, cellValue) } - $xetable.clearValidate(row, column) + $xeTable.clearValidate(row, column) }) .catch(({ rule }) => { if (customVal) { setCellValue(row, column, cellValue) } - $xetable.showValidTooltip({ rule, row, column, cell }) + $xeTable.showValidTooltip({ rule, row, column, cell }) }) } } @@ -4507,11 +4530,68 @@ export default defineComponent({ updateCellAreas () { const { mouseConfig } = props const mouseOpts = computeMouseOpts.value - if (mouseConfig && mouseOpts.area && $xetable.handleUpdateCellAreas) { - return $xetable.handleUpdateCellAreas() + if (mouseConfig && mouseOpts.area && $xeTable.handleUpdateCellAreas) { + return $xeTable.handleUpdateCellAreas() } return nextTick() }, + getCustomStoreData () { + const { id } = props + const customOpts = computeCustomOpts.value + const { collectColumn } = internalData + const { checkMethod } = customOpts + const resizableData: Record = {} + const sortData: Record = {} + const visibleData: Record = {} + const fixedData: Record = {} + const storeData = { + resizableData, + sortData, + visibleData, + fixedData + } + if (!id) { + errLog('vxe.error.reqProp', ['id']) + return storeData + } + XEUtils.eachTree(collectColumn, (column, index, items, path, parent) => { + // 排序只支持一级 + if (!parent) { + collectColumn.forEach((column) => { + const colKey = column.getKey() + if (colKey) { + sortData[colKey] = column.renderSortNumber + } + }) + } + if (column.resizeWidth) { + const colKey = column.getKey() + if (colKey) { + resizableData[colKey] = column.renderWidth + } + } + if (column.fixed && column.fixed !== column.defaultFixed) { + const colKey = column.getKey() + if (colKey) { + fixedData[colKey] = column.fixed + } + } + if (!checkMethod || checkMethod({ column })) { + if (!column.visible && column.defaultVisible) { + const colKey = column.getKey() + if (colKey) { + visibleData[colKey] = false + } + } else if (column.visible && !column.defaultVisible) { + const colKey = column.getKey() + if (colKey) { + visibleData[colKey] = true + } + } + } + }) + return storeData + }, focus () { internalData.isActivated = true return nextTick() @@ -4526,8 +4606,8 @@ export default defineComponent({ */ connect ($toolbar) { if ($toolbar) { - $xetoolbar = $toolbar - $xetoolbar.syncUpdate({ collectColumn: internalData.collectColumn, $table: $xetable }) + $xeToolbar = $toolbar + $xeToolbar.syncUpdate({ collectColumn: internalData.collectColumn, $table: $xeTable }) } else { errLog('vxe.error.barUnableLink') } @@ -4571,8 +4651,8 @@ export default defineComponent({ } else { if (!getEventTargetNode(evnt, document.body, 'vxe-table--ignore-clear').flag) { tablePrivateMethods.preventEvent(evnt, 'event.clearCustom', {}, () => { - if ($xetable.closeCustom) { - $xetable.closeCustom() + if ($xeTable.closeCustom) { + $xeTable.closeCustom() } }) } @@ -4597,7 +4677,7 @@ export default defineComponent({ const rowTargetNode = getEventTargetNode(evnt, el, 'vxe-body--row') const rowNodeRest = rowTargetNode.flag ? tableMethods.getRowNode(rowTargetNode.targetElem) : null // row 方式，如果点击了不同行 - isClear = rowNodeRest ? !$xetable.eqRow(rowNodeRest.item, actived.args.row) : false + isClear = rowNodeRest ? !$xeTable.eqRow(rowNodeRest.item, actived.args.row) : false } else { // cell 方式，如果是非编辑列 isClear = !getEventTargetNode(evnt, el, 'col--edit').flag @@ -4622,7 +4702,7 @@ export default defineComponent({ // 如果点击了当前表格之外 !getEventTargetNode(evnt, el).flag ) { - setTimeout(() => $xetable.clearEdit(evnt)) + setTimeout(() => $xeTable.clearEdit(evnt)) } }) } @@ -4630,16 +4710,16 @@ export default defineComponent({ } } } else if (mouseConfig) { - if (!getEventTargetNode(evnt, el).flag && !($xegrid && getEventTargetNode(evnt, $xegrid.getRefMaps().refElem.value).flag) && !(tableMenu && getEventTargetNode(evnt, tableMenu.getRefMaps().refElem.value).flag) && !($xetoolbar && getEventTargetNode(evnt, $xetoolbar.getRefMaps().refElem.value).flag)) { - if ($xetable.clearSelected) { - $xetable.clearSelected() + if (!getEventTargetNode(evnt, el).flag && !($xeGrid && getEventTargetNode(evnt, $xeGrid.getRefMaps().refElem.value).flag) && !(tableMenu && getEventTargetNode(evnt, tableMenu.getRefMaps().refElem.value).flag) && !($xeToolbar && getEventTargetNode(evnt, $xeToolbar.getRefMaps().refElem.value).flag)) { + if ($xeTable.clearSelected) { + $xeTable.clearSelected() } if (areaOpts.autoClear) { - if ($xetable.clearCellAreas) { + if ($xeTable.clearCellAreas) { if (!getEventTargetNode(evnt, document.body, 'vxe-table--ignore-areas-clear').flag) { tablePrivateMethods.preventEvent(evnt, 'event.clearAreas', {}, () => { - $xetable.clearCellAreas() - $xetable.clearCopyCellArea() + $xeTable.clearCellAreas() + $xeTable.clearCopyCellArea() }) } } @@ -4647,12 +4727,12 @@ export default defineComponent({ } } // 如果配置了快捷菜单且，点击了其他地方则关闭 - if ($xetable.closeMenu) { + if ($xeTable.closeMenu) { if (ctxMenuStore.visible && tableMenu && !getEventTargetNode(evnt, tableMenu.getRefMaps().refElem.value).flag) { - $xetable.closeMenu() + $xeTable.closeMenu() } } - const isActivated = getEventTargetNode(evnt, $xegrid ? $xegrid.getRefMaps().refElem.value : el).flag + const isActivated = getEventTargetNode(evnt, $xeGrid ? $xeGrid.getRefMaps().refElem.value : el).flag // 如果存在校验，点击了表格之外则清除 if (!isActivated && editRules && validOpts.autoClear) { reactData.validErrorMaps = {} @@ -4666,8 +4746,8 @@ export default defineComponent({ */ const handleGlobalBlurEvent = () => { tableMethods.closeFilter() - if ($xetable.closeMenu) { - $xetable.closeMenu() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } } @@ -4676,8 +4756,8 @@ export default defineComponent({ */ const handleGlobalMousewheelEvent = () => { tableMethods.closeTooltip() - if ($xetable.closeMenu) { - $xetable.closeMenu() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } } @@ -4690,27 +4770,27 @@ export default defineComponent({ const mouseOpts = computeMouseOpts.value const keyboardOpts = computeKeyboardOpts.value const { actived } = editStore - const isEsc = hasEventKey(evnt, EVENT_KEYS.ESCAPE) + const isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE) if (isEsc) { tablePrivateMethods.preventEvent(evnt, 'event.keydown', null, () => { tableMethods.dispatchEvent('keydown-start', {}, evnt) - if (keyboardConfig && mouseConfig && mouseOpts.area && $xetable.handleKeyboardEvent) { - $xetable.handleKeyboardEvent(evnt) + if (keyboardConfig && mouseConfig && mouseOpts.area && $xeTable.handleKeyboardEvent) { + $xeTable.handleKeyboardEvent(evnt) } else if (actived.row || filterStore.visible || ctxMenuStore.visible) { evnt.stopPropagation() // 如果按下了 Esc 键，关闭快捷菜单、筛选 - if ($xetable.closeMenu) { - $xetable.closeMenu() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } tableMethods.closeFilter() if (keyboardConfig && keyboardOpts.isEsc) { // 如果是激活编辑状态，则取消编辑 if (actived.row) { const params = actived.args - $xetable.clearEdit(evnt) + $xeTable.clearEdit(evnt) // 如果配置了选中功能，则为选中状态 if (mouseOpts.selected) { - nextTick(() => $xetable.handleSelected(params, evnt)) + nextTick(() => $xeTable.handleSelected(params, evnt)) } } } @@ -4741,18 +4821,18 @@ export default defineComponent({ const { selected, actived } = editStore const childrenField = treeOpts.children || treeOpts.childrenField const keyCode = evnt.keyCode - const isEsc = hasEventKey(evnt, EVENT_KEYS.ESCAPE) - const isBack = hasEventKey(evnt, EVENT_KEYS.BACKSPACE) - const isTab = hasEventKey(evnt, EVENT_KEYS.TAB) - const isEnter = hasEventKey(evnt, EVENT_KEYS.ENTER) - const isSpacebar = hasEventKey(evnt, EVENT_KEYS.SPACEBAR) - const isLeftArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_LEFT) - const isUpArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_UP) - const isRightArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_RIGHT) - const isDwArrow = hasEventKey(evnt, EVENT_KEYS.ARROW_DOWN) - const isDel = hasEventKey(evnt, EVENT_KEYS.DELETE) - const isF2 = hasEventKey(evnt, EVENT_KEYS.F2) - const isContextMenu = hasEventKey(evnt, EVENT_KEYS.CONTEXT_MENU) + const isEsc = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ESCAPE) + const isBack = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.BACKSPACE) + const isTab = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.TAB) + const isEnter = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ENTER) + const isSpacebar = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.SPACEBAR) + const isLeftArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_LEFT) + const isUpArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_UP) + const isRightArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_RIGHT) + const isDwArrow = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.ARROW_DOWN) + const isDel = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.DELETE) + const isF2 = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.F2) + const isContextMenu = globalEvents.hasKey(evnt, GLOBAL_EVENT_KEYS.CONTEXT_MENU) const hasMetaKey = evnt.metaKey const hasCtrlKey = evnt.ctrlKey const hasShiftKey = evnt.shiftKey @@ -4765,26 +4845,26 @@ export default defineComponent({ // 如果配置了右键菜单; 支持方向键操作、回车 evnt.preventDefault() if (ctxMenuStore.showChild && hasChildrenList(ctxMenuStore.selected)) { - $xetable.moveCtxMenu(evnt, ctxMenuStore, 'selectChild', isLeftArrow, false, ctxMenuStore.selected.children) + $xeTable.moveCtxMenu(evnt, ctxMenuStore, 'selectChild', isLeftArrow, false, ctxMenuStore.selected.children) } else { - $xetable.moveCtxMenu(evnt, ctxMenuStore, 'selected', isRightArrow, true, menuList) + $xeTable.moveCtxMenu(evnt, ctxMenuStore, 'selected', isRightArrow, true, menuList) } - } else if (keyboardConfig && mouseConfig && mouseOpts.area && $xetable.handleKeyboardEvent) { - $xetable.handleKeyboardEvent(evnt) + } else if (keyboardConfig && mouseConfig && mouseOpts.area && $xeTable.handleKeyboardEvent) { + $xeTable.handleKeyboardEvent(evnt) } else if (isEsc) { // 如果按下了 Esc 键，关闭快捷菜单、筛选 - if ($xetable.closeMenu) { - $xetable.closeMenu() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } tableMethods.closeFilter() if (keyboardConfig && keyboardOpts.isEsc) { // 如果是激活编辑状态，则取消编辑 if (actived.row) { const params = actived.args - $xetable.clearEdit(evnt) + $xeTable.clearEdit(evnt) // 如果配置了选中功能，则为选中状态 if (mouseOpts.selected) { - nextTick(() => $xetable.handleSelected(params, evnt)) + nextTick(() => $xeTable.handleSelected(params, evnt)) } } } @@ -4801,7 +4881,7 @@ export default defineComponent({ // 如果按下了 F2 键 if (selected.row && selected.column) { evnt.preventDefault() - $xetable.handleActived(selected.args, evnt) + $xeTable.handleActived(selected.args, evnt) } } } else if (isContextMenu) { @@ -4817,10 +4897,10 @@ export default defineComponent({ // 如果是激活编辑状态，则取消编辑 if (actived.row) { params = actived.args - $xetable.clearEdit(evnt) + $xeTable.clearEdit(evnt) // 如果配置了选中功能，则为选中状态 if (mouseOpts.selected) { - nextTick(() => $xetable.handleSelected(params, evnt)) + nextTick(() => $xeTable.handleSelected(params, evnt)) } } } else { @@ -4829,15 +4909,15 @@ export default defineComponent({ const targetArgs = selected.row ? selected.args : actived.args if (hasShiftKey) { if (keyboardOpts.enterToTab) { - $xetable.moveTabSelected(targetArgs, hasShiftKey, evnt) + $xeTable.moveTabSelected(targetArgs, hasShiftKey, evnt) } else { - $xetable.moveSelected(targetArgs, isLeftArrow, true, isRightArrow, false, evnt) + $xeTable.moveSelected(targetArgs, isLeftArrow, true, isRightArrow, false, evnt) } } else { if (keyboardOpts.enterToTab) { - $xetable.moveTabSelected(targetArgs, hasShiftKey, evnt) + $xeTable.moveTabSelected(targetArgs, hasShiftKey, evnt) } else { - $xetable.moveSelected(targetArgs, isLeftArrow, false, isRightArrow, true, evnt) + $xeTable.moveSelected(targetArgs, isLeftArrow, false, isRightArrow, true, evnt) } } } else if (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow) { @@ -4847,7 +4927,7 @@ export default defineComponent({ evnt.preventDefault() const targetRow = childrens[0] params = { - $table: $xetable, + $table: $xeTable, row: targetRow, rowIndex: tableMethods.getRowIndex(targetRow), $rowIndex: tableMethods.getVMRowIndex(targetRow) @@ -4862,18 +4942,18 @@ export default defineComponent({ if (!isEditStatus) { // 如果按下了方向键 if (selected.row && selected.column) { - $xetable.moveSelected(selected.args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, evnt) + $xeTable.moveSelected(selected.args, isLeftArrow, isUpArrow, isRightArrow, isDwArrow, evnt) } else if ((isUpArrow || isDwArrow) && (rowOpts.isCurrent || highlightCurrentRow)) { // 当前行按键上下移动 - $xetable.moveCurrentRow(isUpArrow, isDwArrow, evnt) + $xeTable.moveCurrentRow(isUpArrow, isDwArrow, evnt) } } } else if (isTab && keyboardConfig && keyboardOpts.isTab) { // 如果按下了 Tab 键切换 if (selected.row || selected.column) { - $xetable.moveTabSelected(selected.args, hasShiftKey, evnt) + $xeTable.moveTabSelected(selected.args, hasShiftKey, evnt) } else if (actived.row || actived.column) { - $xetable.moveTabSelected(actived.args, hasShiftKey, evnt) + $xeTable.moveTabSelected(actived.args, hasShiftKey, evnt) } } else if (keyboardConfig && isEnableConf(editConfig) && (isDel || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow ? isBack && keyboardOpts.isArrow : isBack))) { if (!isEditStatus) { @@ -4881,11 +4961,11 @@ export default defineComponent({ // 如果是删除键 if (keyboardOpts.isDel && (selected.row || selected.column)) { const delPaqrams = { - row: selected.row as VxeTableDataRow, + row: selected.row, rowIndex: tableMethods.getRowIndex(selected.row), column: selected.column, columnIndex: tableMethods.getColumnIndex(selected.column), - $table: $xetable + $table: $xeTable } if (delMethod) { delMethod(delPaqrams) @@ -4895,27 +4975,27 @@ export default defineComponent({ if (isBack) { if (backMethod) { backMethod({ - row: selected.row as VxeTableDataRow, + row: selected.row, rowIndex: tableMethods.getRowIndex(selected.row), column: selected.column, columnIndex: tableMethods.getColumnIndex(selected.column), - $table: $xetable + $table: $xeTable }) } else { - $xetable.handleActived(selected.args, evnt) + $xeTable.handleActived(selected.args, evnt) } } else if (isDel) { // 如果按下 del 键，更新表尾数据 tableMethods.updateFooter() } - $xetable.dispatchEvent('cell-delete-value', delPaqrams, evnt) + $xeTable.dispatchEvent('cell-delete-value', delPaqrams, evnt) } else if (isBack && keyboardOpts.isArrow && treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow) { // 如果树形表格回退键关闭当前行返回父节点 const { parent: parentRow } = XEUtils.findTree(internalData.afterFullData, item => item === currentRow, { children: childrenField }) if (parentRow) { evnt.preventDefault() params = { - $table: $xetable, + $table: $xeTable, row: parentRow, rowIndex: tableMethods.getRowIndex(parentRow), $rowIndex: tableMethods.getVMRowIndex(parentRow) @@ -4935,19 +5015,19 @@ export default defineComponent({ // 如果是按下非功能键之外允许直接编辑 if (selected.column && selected.row && isEnableConf(selected.column.editRender)) { const beforeEditMethod = editOpts.beforeEditMethod || editOpts.activeMethod - if (!beforeEditMethod || beforeEditMethod({ ...selected.args, $table: $xetable, $grid: $xegrid })) { + if (!beforeEditMethod || beforeEditMethod({ ...selected.args, $table: $xeTable, $grid: $xeGrid })) { if (editMethod) { editMethod({ row: selected.row, rowIndex: tableMethods.getRowIndex(selected.row), column: selected.column, columnIndex: tableMethods.getColumnIndex(selected.column), - $table: $xetable, - $grid: $xegrid + $table: $xeTable, + $grid: $xeGrid }) } else { setCellValue(selected.row, selected.column, null) - $xetable.handleActived(selected.args, evnt) + $xeTable.handleActived(selected.args, evnt) } const afterEditMethod = editOpts.afterEditMethod if (afterEditMethod) { @@ -4957,8 +5037,8 @@ export default defineComponent({ rowIndex: tableMethods.getRowIndex(selected.row), column: selected.column, columnIndex: tableMethods.getColumnIndex(selected.column), - $table: $xetable, - $grid: $xegrid + $table: $xeTable, + $grid: $xeGrid }) }) } @@ -4979,8 +5059,8 @@ export default defineComponent({ const { actived } = editStore if (isActivated && !filterStore.visible) { if (!(actived.row || actived.column)) { - if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xetable.handlePasteCellAreaEvent) { - $xetable.handlePasteCellAreaEvent(evnt) + if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xeTable.handlePasteCellAreaEvent) { + $xeTable.handlePasteCellAreaEvent(evnt) } } tableMethods.dispatchEvent('paste', {}, evnt) @@ -4996,8 +5076,8 @@ export default defineComponent({ const { actived } = editStore if (isActivated && !filterStore.visible) { if (!(actived.row || actived.column)) { - if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xetable.handleCopyCellAreaEvent) { - $xetable.handleCopyCellAreaEvent(evnt) + if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xeTable.handleCopyCellAreaEvent) { + $xeTable.handleCopyCellAreaEvent(evnt) } } tableMethods.dispatchEvent('copy', {}, evnt) @@ -5013,8 +5093,8 @@ export default defineComponent({ const { actived } = editStore if (isActivated && !filterStore.visible) { if (!(actived.row || actived.column)) { - if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xetable.handleCutCellAreaEvent) { - $xetable.handleCutCellAreaEvent(evnt) + if (keyboardConfig && keyboardOpts.isClip && mouseConfig && mouseOpts.area && $xeTable.handleCutCellAreaEvent) { + $xeTable.handleCutCellAreaEvent(evnt) } } tableMethods.dispatchEvent('cut', {}, evnt) @@ -5022,8 +5102,8 @@ export default defineComponent({ } const handleGlobalResizeEvent = () => { - if ($xetable.closeMenu) { - $xetable.closeMenu() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } tableMethods.updateCellAreas() tableMethods.recalculate(true) @@ -5035,7 +5115,7 @@ export default defineComponent({ if (isClear) { tableMethods.closeTooltip() } else { - if ($tooltip) { + if ($tooltip && $tooltip.setActived) { $tooltip.setActived(true) } } @@ -5065,7 +5145,7 @@ export default defineComponent({ }) nextTick(() => { const $tooltip = refTooltip.value - if ($tooltip) { + if ($tooltip && $tooltip.open) { $tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content)) } }) @@ -5078,13 +5158,13 @@ export default defineComponent({ */ tablePrivateMethods = { getSetupOptions () { - return GlobalConfig + return getConfig() }, updateAfterDataIndex, callSlot (slotFunc, params) { if (slotFunc) { - if ($xegrid) { - return $xegrid.callSlot(slotFunc, params) + if ($xeGrid) { + return $xeGrid.callSlot(slotFunc, params) } if (XEUtils.isFunction(slotFunc)) { return getSlotVNs(slotFunc(params)) @@ -5097,8 +5177,8 @@ export default defineComponent({ */ getParentElem () { const el = refElem.value - if ($xegrid) { - const gridEl = $xegrid.getRefMaps().refElem.value + if ($xeGrid) { + const gridEl = $xeGrid.getRefMaps().refElem.value return gridEl ? gridEl.parentNode as HTMLElement : null } return el ? el.parentNode as HTMLElement : null @@ -5112,7 +5192,7 @@ export default defineComponent({ if (el) { const parentElem = el.parentNode as HTMLElement const parentPaddingSize = height === 'auto' ? getPaddingTopBottomSize(parentElem) : 0 - return Math.floor($xegrid ? $xegrid.getParentHeight() : XEUtils.toNumber(getComputedStyle(parentElem).height) - parentPaddingSize) + return Math.floor($xeGrid ? $xeGrid.getParentHeight() : XEUtils.toNumber(getComputedStyle(parentElem).height) - parentPaddingSize) } return 0 }, @@ -5122,7 +5202,7 @@ export default defineComponent({ * 如果存在表尾合计滚动条，则需要排除滚动条高度 */ getExcludeHeight () { - return $xegrid ? $xegrid.getExcludeHeight() : 0 + return $xeGrid ? $xeGrid.getExcludeHeight() : 0 }, /** * 定义行数据中的列属性，如果不存在则定义 @@ -5135,7 +5215,7 @@ export default defineComponent({ const radioOpts = computeRadioOpts.value const checkboxOpts = computeCheckboxOpts.value const childrenField = treeOpts.children || treeOpts.childrenField - const rowkey = getRowkey($xetable) + const rowkey = getRowkey($xeTable) if (!XEUtils.isArray(records)) { records = [records] } @@ -5184,7 +5264,7 @@ export default defineComponent({ } const tableData = scrollYLoad ? fullList.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullList.slice(0) tableData.forEach((row, $index) => { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const rest = fullDataRowIdData[rowid] if (rest) { rest.$index = $index @@ -5203,10 +5283,10 @@ export default defineComponent({ let { fullDataRowIdData, fullAllDataRowIdData, tableFullData, tableFullTreeData } = internalData const childrenField = treeOpts.children || treeOpts.childrenField const hasChildField = treeOpts.hasChild || treeOpts.hasChildField - const rowkey = getRowkey($xetable) + const rowkey = getRowkey($xeTable) const isLazy = treeConfig && treeOpts.lazy const handleRow = (row: any, index: any, items: any, path?: any[], parent?: any, nodes?: any[]) => { - let rowid = getRowid($xetable, row) + let rowid = getRowid($xeTable, row) const seq = treeConfig && path ? toTreePathSeq(path) : index + 1 const level = nodes ? nodes.length - 1 : 0 if (eqEmptyValue(rowid)) { @@ -5237,10 +5317,10 @@ export default defineComponent({ const treeOpts = computeTreeOpts.value let { sourceDataRowIdData } = internalData const sourceData = XEUtils.clone(fullData, true) - const rowkey = getRowkey($xetable) + const rowkey = getRowkey($xeTable) sourceDataRowIdData = internalData.sourceDataRowIdData = {} const handleSourceRow = (row: any) => { - let rowid = getRowid($xetable, row) + let rowid = getRowid($xeTable, row) if (eqEmptyValue(rowid)) { rowid = getRowUniqueId() XEUtils.set(row, rowkey, rowid) @@ -5343,11 +5423,9 @@ export default defineComponent({ columnWidthStorage = XEUtils.isPlainObject(columnSortStorageMap[id]) ? columnSortStorageMap[id] : {} // 排序只支持一级 collectColumn.forEach((column) => { - if (column.sortNumber !== column.renderSortNumber) { - const colKey = column.getKey() - if (colKey) { - columnWidthStorage[colKey] = column.renderSortNumber - } + const colKey = column.getKey() + if (colKey) { + columnWidthStorage[colKey] = column.renderSortNumber } }) } @@ -5420,12 +5498,12 @@ export default defineComponent({ handleCustom () { const { mouseConfig } = props if (mouseConfig) { - if ($xetable.clearSelected) { - $xetable.clearSelected() + if ($xeTable.clearSelected) { + $xeTable.clearSelected() } - if ($xetable.clearCellAreas) { - $xetable.clearCellAreas() - $xetable.clearCopyCellArea() + if ($xeTable.clearCellAreas) { + $xeTable.clearCellAreas() + $xeTable.clearCopyCellArea() } } tablePrivateMethods.saveCustomVisible() @@ -5440,12 +5518,12 @@ export default defineComponent({ reactData.reColumnFlag++ }, preventEvent (evnt, type, args, next, end) { - let evntList = VXETable.interceptor.get(type) + let evntList = interceptor.get(type) // 兼容老版本 if (!evntList.length && type === 'event.clearEdit') { - evntList = VXETable.interceptor.get('event.clearActived') - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + evntList = interceptor.get('event.clearActived') + if (process.env.VUE_APP_VXE_ENV === 'development') { if (evntList.length) { warnLog('vxe.error.delEvent', ['event.clearActived', 'event.clearEdit']) } @@ -5454,7 +5532,7 @@ export default defineComponent({ // 兼容老版本 let rest - if (!evntList.some((func) => func(Object.assign({ $grid: $xegrid, $table: $xetable, $event: evnt }, args)) === false)) { + if (!evntList.some((func) => func(Object.assign({ $grid: $xeGrid, $table: $xeTable, $event: evnt }, args)) === false)) { if (next) { rest = next() } @@ -5496,9 +5574,9 @@ export default defineComponent({ isAllSelected = isAllResolve && afterFullData.length !== disableRows.length if (treeConfig) { if (indeterminateField) { - isIndeterminate = !isAllSelected && afterFullData.some((row) => XEUtils.get(row, checkField) || XEUtils.get(row, indeterminateField) || !!treeIndeterminateMaps[getRowid($xetable, row)]) + isIndeterminate = !isAllSelected && afterFullData.some((row) => XEUtils.get(row, checkField) || XEUtils.get(row, indeterminateField) || !!treeIndeterminateMaps[getRowid($xeTable, row)]) } else { - isIndeterminate = !isAllSelected && afterFullData.some((row) => XEUtils.get(row, checkField) || !!treeIndeterminateMaps[getRowid($xetable, row)]) + isIndeterminate = !isAllSelected && afterFullData.some((row) => XEUtils.get(row, checkField) || !!treeIndeterminateMaps[getRowid($xeTable, row)]) } } else { if (indeterminateField) { @@ -5515,22 +5593,22 @@ export default defineComponent({ disableRows.push(row) return true } - if (selectCheckboxMaps[getRowid($xetable, row)]) { + if (selectCheckboxMaps[getRowid($xeTable, row)]) { checkRows.push(row) return true } return false } - : row => selectCheckboxMaps[getRowid($xetable, row)] + : row => selectCheckboxMaps[getRowid($xeTable, row)] ) isAllSelected = isAllResolve && afterFullData.length !== disableRows.length if (treeConfig) { isIndeterminate = !isAllSelected && afterFullData.some((row) => { - const itemRid = getRowid($xetable, row) + const itemRid = getRowid($xeTable, row) return treeIndeterminateMaps[itemRid] || selectCheckboxMaps[itemRid] }) } else { - isIndeterminate = !isAllSelected && afterFullData.some((row) => selectCheckboxMaps[getRowid($xetable, row)]) + isIndeterminate = !isAllSelected && afterFullData.some((row) => selectCheckboxMaps[getRowid($xeTable, row)]) } } reactData.isAllSelected = isAllSelected @@ -5551,7 +5629,7 @@ export default defineComponent({ const checkboxOpts = computeCheckboxOpts.value const { checkField, checkStrictly, checkMethod } = checkboxOpts const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (checkField) { if (treeConfig && !checkStrictly) { if (value === -1) { @@ -5565,18 +5643,18 @@ export default defineComponent({ } else { // 更新子节点状态 XEUtils.eachTree([row], (item) => { - if ($xetable.eqRow(item, row) || (isForce || (!checkMethod || checkMethod({ row: item })))) { + if ($xeTable.eqRow(item, row) || (isForce || (!checkMethod || checkMethod({ row: item })))) { XEUtils.set(item, checkField, value) if (indeterminateField) { XEUtils.set(row, indeterminateField, false) } - delete treeIndeterminateMaps[getRowid($xetable, item)] + delete treeIndeterminateMaps[getRowid($xeTable, item)] handleCheckboxReserveRow(row, value) } }, { children: childrenField }) } // 如果存在父节点，更新父节点状态 - const matchObj = XEUtils.findTree(afterFullData, item => $xetable.eqRow(item, row), { children: childrenField }) + const matchObj = XEUtils.findTree(afterFullData, item => $xeTable.eqRow(item, row), { children: childrenField }) if (matchObj && matchObj.parent) { let parentStatus const vItems: any[] = [] @@ -5584,19 +5662,19 @@ export default defineComponent({ if (!isForce && checkMethod) { matchObj.items.forEach((item) => { if (checkMethod({ row: item })) { - const itemRid = getRowid($xetable, item) + const itemRid = getRowid($xeTable, item) vItemMaps[itemRid] = item vItems.push(item) } }) } else { matchObj.items.forEach(item => { - const itemRid = getRowid($xetable, item) + const itemRid = getRowid($xeTable, item) vItemMaps[itemRid] = item vItems.push(item) }) } - const indeterminatesItem = XEUtils.find(matchObj.items, item => !!treeIndeterminateMaps[getRowid($xetable, item)]) + const indeterminatesItem = XEUtils.find(matchObj.items, item => !!treeIndeterminateMaps[getRowid($xeTable, item)]) if (indeterminatesItem) { parentStatus = -1 } else { @@ -5606,7 +5684,7 @@ export default defineComponent({ selectItems.push(item) } }) - parentStatus = selectItems.filter(item => vItemMaps[getRowid($xetable, item)]).length === vItems.length ? true : (selectItems.length || value === -1 ? -1 : false) + parentStatus = selectItems.filter(item => vItemMaps[getRowid($xeTable, item)]).length === vItems.length ? true : (selectItems.length || value === -1 ? -1 : false) } reactData.selectCheckboxMaps = selectRowMaps return tablePrivateMethods.handleSelectRow({ row: matchObj.parent }, parentStatus, isForce) @@ -5632,8 +5710,8 @@ export default defineComponent({ } else { // 更新子节点状态 XEUtils.eachTree([row], (item) => { - const itemRid = getRowid($xetable, item) - if ($xetable.eqRow(item, row) || (isForce || (!checkMethod || checkMethod({ row: item })))) { + const itemRid = getRowid($xeTable, item) + if ($xeTable.eqRow(item, row) || (isForce || (!checkMethod || checkMethod({ row: item })))) { if (value) { selectRowMaps[itemRid] = item } else { @@ -5644,13 +5722,13 @@ export default defineComponent({ if (indeterminateField) { XEUtils.set(row, indeterminateField, false) } - delete treeIndeterminateMaps[getRowid($xetable, item)] + delete treeIndeterminateMaps[getRowid($xeTable, item)] handleCheckboxReserveRow(row, value) } }, { children: childrenField }) } // 如果存在父节点，更新父节点状态 - const matchObj = XEUtils.findTree(afterFullData, item => $xetable.eqRow(item, row), { children: childrenField }) + const matchObj = XEUtils.findTree(afterFullData, item => $xeTable.eqRow(item, row), { children: childrenField }) if (matchObj && matchObj.parent) { let parentStatus const vItems: any[] = [] @@ -5658,30 +5736,30 @@ export default defineComponent({ if (!isForce && checkMethod) { matchObj.items.forEach((item) => { if (checkMethod({ row: item })) { - const itemRid = getRowid($xetable, item) + const itemRid = getRowid($xeTable, item) vItemMaps[itemRid] = item vItems.push(item) } }) } else { matchObj.items.forEach(item => { - const itemRid = getRowid($xetable, item) + const itemRid = getRowid($xeTable, item) vItemMaps[itemRid] = item vItems.push(item) }) } - const indeterminatesItem = XEUtils.find(matchObj.items, item => !!treeIndeterminateMaps[getRowid($xetable, item)]) + const indeterminatesItem = XEUtils.find(matchObj.items, item => !!treeIndeterminateMaps[getRowid($xeTable, item)]) if (indeterminatesItem) { parentStatus = -1 } else { const selectItems: any[] = [] matchObj.items.forEach(item => { - const itemRid = getRowid($xetable, item) + const itemRid = getRowid($xeTable, item) if (selectRowMaps[itemRid]) { selectItems.push(item) } }) - parentStatus = selectItems.filter(item => vItemMaps[getRowid($xetable, item)]).length === vItems.length ? true : (selectItems.length || value === -1 ? -1 : false) + parentStatus = selectItems.filter(item => vItemMaps[getRowid($xeTable, item)]).length === vItems.length ? true : (selectItems.length || value === -1 ? -1 : false) } reactData.selectCheckboxMaps = selectRowMaps return tablePrivateMethods.handleSelectRow({ row: matchObj.parent }, parentStatus, isForce) @@ -5717,7 +5795,7 @@ export default defineComponent({ // tooltipStore.currOpts = { content: null } nextTick(() => { const $tooltip = refTooltip.value - if ($tooltip) { + if ($tooltip && $tooltip.open) { $tooltip.open(evnt.currentTarget, content) } }) @@ -5787,13 +5865,13 @@ export default defineComponent({ handleTargetLeaveEvent () { const tooltipOpts = computeTooltipOpts.value let $tooltip = refTooltip.value - if ($tooltip) { + if ($tooltip && $tooltip.setActived) { $tooltip.setActived(false) } if (tooltipOpts.enterable) { internalData.tooltipTimeout = setTimeout(() => { $tooltip = refTooltip.value - if ($tooltip && !$tooltip.isActived()) { + if ($tooltip && $tooltip.isActived && !$tooltip.isActived()) { tableMethods.closeTooltip() } }, tooltipOpts.leaveDelay) @@ -5917,12 +5995,12 @@ export default defineComponent({ checkValidate('blur') .catch((e) => e) .then(() => { - $xetable.handleActived(params, evnt) + $xeTable.handleActived(params, evnt) .then(() => checkValidate('change')) .catch((e) => e) }) } else if (editOpts.mode === 'cell') { - $xetable.handleActived(params, evnt) + $xeTable.handleActived(params, evnt) .then(() => checkValidate('change')) .catch((e) => e) } @@ -5939,7 +6017,7 @@ export default defineComponent({ if (checkField) { value = !XEUtils.get(row, checkField) } else { - value = !selectCheckboxMaps[getRowid($xetable, row)] + value = !selectCheckboxMaps[getRowid($xeTable, row)] } if (evnt) { tablePrivateMethods.triggerCheckRowEvent(evnt, params, value) @@ -6030,7 +6108,7 @@ export default defineComponent({ const expandOpts = computeExpandOpts.value const { row } = params const { lazy } = expandOpts - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (!lazy || !rowExpandLazyLoadedMaps[rowid]) { const expanded = !tableMethods.isRowExpandByRow(row) const columnIndex = tableMethods.getColumnIndex(column) @@ -6055,7 +6133,7 @@ export default defineComponent({ const treeOpts = computeTreeOpts.value const { row, column } = params const { lazy } = treeOpts - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) if (!lazy || !treeExpandLazyLoadedMaps[rowid]) { const expanded = !tableMethods.isTreeExpandByRow(row) const columnIndex = tableMethods.getColumnIndex(column) @@ -6078,9 +6156,9 @@ export default defineComponent({ } else { tableMethods.sort({ field, order }) } - const params = { $table: $xetable, $event: evnt, column, field, property: field, order: column.order, sortList: tableMethods.getSortColumns(), sortTime: column.sortTime } - if (mouseConfig && mouseOpts.area && $xetable.handleSortEvent) { - $xetable.handleSortEvent(evnt, params) + const params = { $table: $xeTable, $event: evnt, column, field, property: field, order: column.order, sortList: tableMethods.getSortColumns(), sortTime: column.sortTime } + if (mouseConfig && mouseOpts.area && $xeTable.handleSortEvent) { + $xeTable.handleSortEvent(evnt, params) } tableMethods.dispatchEvent('sort-change', params, evnt) } @@ -6116,7 +6194,7 @@ export default defineComponent({ if (treeConfig) { const treeOpts = computeTreeOpts.value const childrenField = treeOpts.children || treeOpts.childrenField - const matchObj = XEUtils.findTree(tableFullData, item => $xetable.eqRow(item, row), { children: childrenField }) + const matchObj = XEUtils.findTree(tableFullData, item => $xeTable.eqRow(item, row), { children: childrenField }) if (matchObj) { const nodes = matchObj.nodes nodes.forEach((row, index) => { @@ -6126,7 +6204,7 @@ export default defineComponent({ }) } } - return Promise.all(rests).then(() => rowToVisible($xetable, row)) + return Promise.all(rests).then(() => rowToVisible($xeTable, row)) }, updateScrollYStatus, // 更新横向 X 可视渲染上下剩余空间大小 @@ -6254,7 +6332,7 @@ export default defineComponent({ tablePrivateMethods.setHoverRow(row) }, setHoverRow (row) { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const el = refElem.value tablePrivateMethods.clearHoverRow() if (el) { @@ -6270,7 +6348,7 @@ export default defineComponent({ internalData.hoverRow = null }, getCell (row, column) { - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const tableBody = refTableBody.value const leftBody = refTableLeftBody.value const rightBody = refTableRightBody.value @@ -6303,7 +6381,7 @@ export default defineComponent({ if (formatter) { let formatData const { fullAllDataRowIdData } = internalData - const rowid = getRowid($xetable, row) + const rowid = getRowid($xeTable, row) const colid = column.id const rest = fullAllDataRowIdData[rowid] if (rest) { @@ -6319,10 +6397,10 @@ export default defineComponent({ } const formatParams = { cellValue, row, rowIndex: tableMethods.getRowIndex(row), column, columnIndex: tableMethods.getColumnIndex(column) } if (XEUtils.isString(formatter)) { - const gFormatOpts = VXETable.formats.get(formatter) + const gFormatOpts = formats.get(formatter) cellLabel = gFormatOpts && gFormatOpts.cellFormatMethod ? gFormatOpts.cellFormatMethod(formatParams) : '' } else if (XEUtils.isArray(formatter)) { - const gFormatOpts = VXETable.formats.get(formatter[0]) + const gFormatOpts = formats.get(formatter[0]) cellLabel = gFormatOpts && gFormatOpts.cellFormatMethod ? gFormatOpts.cellFormatMethod(formatParams, ...formatter.slice(1)) : '' } else { cellLabel = formatter(formatParams) @@ -6334,34 +6412,34 @@ export default defineComponent({ return cellLabel }, findRowIndexOf (list, row) { - return row ? XEUtils.findIndexOf(list, item => $xetable.eqRow(item, row)) : -1 + return row ? XEUtils.findIndexOf(list, item => $xeTable.eqRow(item, row)) : -1 }, eqRow (row1, row2) { if (row1 && row2) { if (row1 === row2) { return true } - return getRowid($xetable, row1) === getRowid($xetable, row2) + return getRowid($xeTable, row1) === getRowid($xeTable, row2) } return false } } // 检测对应模块是否安装 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { 'openExport,openPrint,exportData,openImport,importData,saveFile,readFile,importByFile,print'.split(',').forEach(name => { - ($xetable as any)[name] = function () { + ($xeTable as any)[name] = function () { errLog('vxe.error.reqModule', ['VxeTableExportModule']) } }) 'clearValidate,fullValidate,validate'.split(',').forEach(name => { - ($xetable as any)[name] = function () { + ($xeTable as any)[name] = function () { errLog('vxe.error.reqModule', ['VxeTableValidatorModule']) } }) } - Object.assign($xetable, tableMethods, tablePrivateMethods) + Object.assign($xeTable, tableMethods, tablePrivateMethods) /** * 渲染浮固定列 @@ -6378,44 +6456,48 @@ export default defineComponent({ ref: isFixedLeft ? refLeftContainer : refRightContainer, class: `vxe-table--fixed-${fixedType}-wrapper` }, [ - showHeader ? h(TableHeaderComponent, { - ref: isFixedLeft ? refTableLeftHeader : refTableRightHeader, - fixedType, - tableData, - tableColumn, - tableGroupColumn, - fixedColumn - }) : createCommentVNode(), - h(TableBodyComponent as ComponentOptions, { + showHeader + ? h(TableHeaderComponent, { + ref: isFixedLeft ? refTableLeftHeader : refTableRightHeader, + fixedType, + tableData, + tableColumn, + tableGroupColumn, + fixedColumn + }) + : createCommentVNode(), + h(TableBodyComponent, { ref: isFixedLeft ? refTableLeftBody : refTableRightBody, fixedType, tableData, tableColumn, fixedColumn }), - showFooter ? h(TableFooterComponent, { - ref: isFixedLeft ? refTableLeftFooter : refTableRightFooter, - footerTableData, - tableColumn, - fixedColumn, - fixedType - }) : createCommentVNode() + showFooter + ? h(TableFooterComponent, { + ref: isFixedLeft ? refTableLeftFooter : refTableRightFooter, + footerTableData, + tableColumn, + fixedColumn, + fixedType + }) + : createCommentVNode() ]) } const renderEmptyContenet = () => { const emptyOpts = computeEmptyOpts.value - const params = { $table: $xetable } + const params = { $table: $xeTable } if (slots.empty) { return slots.empty(params) } else { - const compConf = emptyOpts.name ? VXETable.renderer.get(emptyOpts.name) : null + const compConf = emptyOpts.name ? renderer.get(emptyOpts.name) : null const renderTableEmptyView = compConf ? compConf.renderTableEmptyView || compConf.renderEmpty : null if (renderTableEmptyView) { return getSlotVNs(renderTableEmptyView(emptyOpts, params)) } } - return getFuncText(props.emptyText) || GlobalConfig.i18n('vxe.table.emptyText') + return getFuncText(props.emptyText) || getI18n('vxe.table.emptyText') } function handleUupdateResize () { @@ -6445,7 +6527,7 @@ export default defineComponent({ if (!inited) { handleInitDefaults() } - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { // const checkboxOpts = computeCheckboxOpts.value // const checkboxColumn = internalData.tableFullColumn.find(column => column.type === 'checkbox') // if (checkboxColumn && internalData.tableFullData.length > 300 && !checkboxOpts.checkField) { @@ -6566,28 +6648,28 @@ export default defineComponent({ }) }) - VXETable.hooks.forEach((options) => { + hooks.forEach((options) => { const { setupTable } = options if (setupTable) { - const hookRest = setupTable($xetable) + const hookRest = setupTable($xeTable) if (hookRest && XEUtils.isObject(hookRest)) { - Object.assign($xetable, hookRest) + Object.assign($xeTable, hookRest) } } }) - tablePrivateMethods.preventEvent(null, 'created', { $table: $xetable }) + tablePrivateMethods.preventEvent(null, 'created', { $table: $xeTable }) - let resizeObserver: XEResizeObserver + let resizeObserver: ResizeObserver onActivated(() => { tableMethods.recalculate().then(() => tableMethods.refreshScroll()) - tablePrivateMethods.preventEvent(null, 'activated', { $table: $xetable }) + tablePrivateMethods.preventEvent(null, 'activated', { $table: $xeTable }) }) onDeactivated(() => { internalData.isActivated = false - tablePrivateMethods.preventEvent(null, 'deactivated', { $table: $xetable }) + tablePrivateMethods.preventEvent(null, 'deactivated', { $table: $xeTable }) }) onMounted(() => { @@ -6602,7 +6684,7 @@ export default defineComponent({ const expandOpts = computeExpandOpts.value const rowOpts = computeRowOpts.value - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (props.rowId) { warnLog('vxe.error.delProp', ['row-id', 'row-config.keyField']) } @@ -6643,15 +6725,15 @@ export default defineComponent({ const { exportConfig, importConfig } = props const exportOpts = computeExportOpts.value const importOpts = computeImportOpts.value - if (importConfig && importOpts.types && !importOpts.importMethod && !XEUtils.includeArrays(VXETable.globalConfs.importTypes, importOpts.types)) { - warnLog('vxe.error.errProp', [`export-config.types=${importOpts.types.join(',')}`, importOpts.types.filter((type: string) => XEUtils.includes(VXETable.globalConfs.importTypes, type)).join(',') || VXETable.globalConfs.importTypes.join(',')]) + if (importConfig && importOpts.types && !importOpts.importMethod && !XEUtils.includeArrays(XEUtils.keys(importOpts._typeMaps), importOpts.types)) { + warnLog('vxe.error.errProp', [`export-config.types=${importOpts.types.join(',')}`, importOpts.types.filter((type: string) => XEUtils.includes(XEUtils.keys(importOpts._typeMaps), type)).join(',') || XEUtils.keys(importOpts._typeMaps).join(',')]) } - if (exportConfig && exportOpts.types && !exportOpts.exportMethod && !XEUtils.includeArrays(VXETable.globalConfs.exportTypes, exportOpts.types)) { - warnLog('vxe.error.errProp', [`export-config.types=${exportOpts.types.join(',')}`, exportOpts.types.filter((type: string) => XEUtils.includes(VXETable.globalConfs.exportTypes, type)).join(',') || VXETable.globalConfs.exportTypes.join(',')]) + if (exportConfig && exportOpts.types && !exportOpts.exportMethod && !XEUtils.includeArrays(XEUtils.keys(exportOpts._typeMaps), exportOpts.types)) { + warnLog('vxe.error.errProp', [`export-config.types=${exportOpts.types.join(',')}`, exportOpts.types.filter((type: string) => XEUtils.includes(XEUtils.keys(exportOpts._typeMaps), type)).join(',') || XEUtils.keys(exportOpts._typeMaps).join(',')]) } } - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { const customOpts = computeCustomOpts.value const mouseOpts = computeMouseOpts.value const rowOpts = computeRowOpts.value @@ -6664,7 +6746,7 @@ export default defineComponent({ if (rowOpts.height && !props.showOverflow) { warnLog('vxe.error.notProp', ['table.show-overflow']) } - if (!$xetable.handleUpdateCellAreas) { + if (!$xeTable.handleUpdateCellAreas) { if (props.clipConfig) { warnLog('vxe.error.notProp', ['clip-config']) } @@ -6703,17 +6785,17 @@ export default defineComponent({ } // 检查是否有安装需要的模块 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (props.editConfig && !$xetable.insert) { + if (process.env.VUE_APP_VXE_ENV === 'development') { + if (props.editConfig && !$xeTable.insert) { errLog('vxe.error.reqModule', ['Edit']) } - if (props.editRules && !$xetable.validate) { + if (props.editRules && !$xeTable.validate) { errLog('vxe.error.reqModule', ['Validator']) } - if ((checkboxOpts.range || props.keyboardConfig || props.mouseConfig) && !$xetable.triggerCellMousedownEvent) { + if ((checkboxOpts.range || props.keyboardConfig || props.mouseConfig) && !$xeTable.triggerCellMousedownEvent) { errLog('vxe.error.reqModule', ['Keyboard']) } - if ((props.printConfig || props.importConfig || props.exportConfig) && !$xetable.exportData) { + if ((props.printConfig || props.importConfig || props.exportConfig) && !$xeTable.exportData) { errLog('vxe.error.reqModule', ['Export']) } } @@ -6746,15 +6828,17 @@ export default defineComponent({ const el = refElem.value const parentEl = tablePrivateMethods.getParentElem() const handleOptimizeResize = refreshDelay ? XEUtils.throttle(() => tableMethods.recalculate(true), refreshDelay, { leading: true, trailing: true }) : null - resizeObserver = createResizeEvent(handleOptimizeResize ? () => { - if (props.autoResize) { - requestAnimationFrame(handleOptimizeResize) - } - } : () => { - if (props.autoResize) { - tableMethods.recalculate(true) - } - }) + resizeObserver = globalResize.create(handleOptimizeResize + ? () => { + if (props.autoResize) { + requestAnimationFrame(handleOptimizeResize) + } + } + : () => { + if (props.autoResize) { + tableMethods.recalculate(true) + } + }) if (el) { resizeObserver.observe(el) } @@ -6763,18 +6847,18 @@ export default defineComponent({ } } }) - GlobalEvent.on($xetable, 'paste', handleGlobalPasteEvent) - GlobalEvent.on($xetable, 'copy', handleGlobalCopyEvent) - GlobalEvent.on($xetable, 'cut', handleGlobalCutEvent) - GlobalEvent.on($xetable, 'mousedown', handleGlobalMousedownEvent) - GlobalEvent.on($xetable, 'blur', handleGlobalBlurEvent) - GlobalEvent.on($xetable, 'mousewheel', handleGlobalMousewheelEvent) - GlobalEvent.on($xetable, 'keydown', handleGlobalKeydownEvent) - GlobalEvent.on($xetable, 'resize', handleGlobalResizeEvent) - if ($xetable.handleGlobalContextmenuEvent) { - GlobalEvent.on($xetable, 'contextmenu', $xetable.handleGlobalContextmenuEvent) + globalEvents.on($xeTable, 'paste', handleGlobalPasteEvent) + globalEvents.on($xeTable, 'copy', handleGlobalCopyEvent) + globalEvents.on($xeTable, 'cut', handleGlobalCutEvent) + globalEvents.on($xeTable, 'mousedown', handleGlobalMousedownEvent) + globalEvents.on($xeTable, 'blur', handleGlobalBlurEvent) + globalEvents.on($xeTable, 'mousewheel', handleGlobalMousewheelEvent) + globalEvents.on($xeTable, 'keydown', handleGlobalKeydownEvent) + globalEvents.on($xeTable, 'resize', handleGlobalResizeEvent) + if ($xeTable.handleGlobalContextmenuEvent) { + globalEvents.on($xeTable, 'contextmenu', $xeTable.handleGlobalContextmenuEvent) } - tablePrivateMethods.preventEvent(null, 'mounted', { $table: $xetable }) + tablePrivateMethods.preventEvent(null, 'mounted', { $table: $xeTable }) }) onBeforeUnmount(() => { @@ -6782,23 +6866,23 @@ export default defineComponent({ resizeObserver.disconnect() } tableMethods.closeFilter() - if ($xetable.closeMenu) { - $xetable.closeMenu() + if ($xeTable.closeMenu) { + $xeTable.closeMenu() } - tablePrivateMethods.preventEvent(null, 'beforeUnmount', { $table: $xetable }) + tablePrivateMethods.preventEvent(null, 'beforeUnmount', { $table: $xeTable }) }) onUnmounted(() => { - GlobalEvent.off($xetable, 'paste') - GlobalEvent.off($xetable, 'copy') - GlobalEvent.off($xetable, 'cut') - GlobalEvent.off($xetable, 'mousedown') - GlobalEvent.off($xetable, 'blur') - GlobalEvent.off($xetable, 'mousewheel') - GlobalEvent.off($xetable, 'keydown') - GlobalEvent.off($xetable, 'resize') - GlobalEvent.off($xetable, 'contextmenu') - tablePrivateMethods.preventEvent(null, 'unmounted', { $table: $xetable }) + globalEvents.off($xeTable, 'paste') + globalEvents.off($xeTable, 'copy') + globalEvents.off($xeTable, 'cut') + globalEvents.off($xeTable, 'mousedown') + globalEvents.off($xeTable, 'blur') + globalEvents.off($xeTable, 'mousewheel') + globalEvents.off($xeTable, 'keydown') + globalEvents.off($xeTable, 'resize') + globalEvents.off($xeTable, 'contextmenu') + tablePrivateMethods.preventEvent(null, 'unmounted', { $table: $xeTable }) }) const renderVN = () => { @@ -6823,7 +6907,7 @@ export default defineComponent({ [`size--${vSize}`]: vSize, [`valid-msg--${validOpts.msgMode}`]: !!editRules, 'vxe-editable': !!editConfig, - 'old-cell-valid': editRules && GlobalConfig.cellVaildMode === 'obsolete', + 'old-cell-valid': editRules && getConfig().cellVaildMode === 'obsolete', 'cell--highlight': highlightCell, 'cell--selected': mouseConfig && mouseOpts.selected, 'cell--area': mouseConfig && mouseOpts.area, @@ -6862,16 +6946,18 @@ export default defineComponent({ /** * 表头 */ - showHeader ? h(TableHeaderComponent, { - ref: refTableHeader, - tableData, - tableColumn, - tableGroupColumn - }) : createCommentVNode(), + showHeader + ? h(TableHeaderComponent, { + ref: refTableHeader, + tableData, + tableColumn, + tableGroupColumn + }) + : createCommentVNode(), /** * 表体 */ - h(TableBodyComponent as ComponentOptions, { + h(TableBodyComponent, { ref: refTableBody, tableData, tableColumn @@ -6879,11 +6965,13 @@ export default defineComponent({ /** * 表尾 */ - showFooter ? h(TableFooterComponent, { - ref: refTableFooter, - footerTableData, - tableColumn - }) : createCommentVNode() + showFooter + ? h(TableFooterComponent, { + ref: refTableFooter, + footerTableData, + tableColumn + }) + : createCommentVNode() ]), h('div', { class: 'vxe-table--fixed-wrapper' @@ -6921,89 +7009,105 @@ export default defineComponent({ h('div', { ref: refCellResizeBar, class: 'vxe-table--resizable-bar', - style: overflowX ? { - 'padding-bottom': `${scrollbarHeight}px` - } : null + style: overflowX + ? { + 'padding-bottom': `${scrollbarHeight}px` + } + : null }), /** * 加载中 */ - h(VxeLoading, { + h(resolveComponent('vxe-loading') as VxeLoadingComponent, { class: 'vxe-table--loading', modelValue: loading, icon: loadingOpts.icon, text: loadingOpts.text - }, loadingSlot ? { - default: () => loadingSlot({ $table: $xetable, $grid: $xegrid }) - } : {}), + }, loadingSlot + ? { + default: () => loadingSlot({ $table: $xeTable, $grid: $xeGrid }) + } + : {}), /** * 自定义列 */ - initStore.custom ? h(resolveComponent('vxe-table-custom-panel') as ComponentOptions, { - ref: refTableCustom, - customStore - }) : createCommentVNode(), + initStore.custom + ? h(TableCustomPanelComponent, { + ref: refTableCustom, + customStore + }) + : createCommentVNode(), /** * 筛选 */ - initStore.filter ? h(resolveComponent('vxe-table-filter-panel') as ComponentOptions, { - ref: refTableFilter, - filterStore - }) : createCommentVNode(), + initStore.filter + ? h(TableFilterPanelComponent, { + ref: refTableFilter, + filterStore + }) + : createCommentVNode(), /** * 导入 */ - initStore.import && props.importConfig ? h(resolveComponent('vxe-table-import-panel') as ComponentOptions, { - defaultOptions: reactData.importParams, - storeData: reactData.importStore - }) : createCommentVNode(), + initStore.import && props.importConfig + ? h(TableImportPanelComponent, { + defaultOptions: reactData.importParams, + storeData: reactData.importStore + }) + : createCommentVNode(), /** * 导出/导出 */ - initStore.export && (props.exportConfig || props.printConfig) ? h(resolveComponent('vxe-table-export-panel') as ComponentOptions, { - defaultOptions: reactData.exportParams, - storeData: reactData.exportStore - }) : createCommentVNode(), + initStore.export && (props.exportConfig || props.printConfig) + ? h(TableExportPanelComponent, { + defaultOptions: reactData.exportParams, + storeData: reactData.exportStore + }) + : createCommentVNode(), /** * 快捷菜单 */ - isMenu ? h(resolveComponent('vxe-table-menu-panel') as ComponentOptions, { - ref: refTableMenu - }) : createCommentVNode(), + isMenu + ? h(TableMenuPanelComponent, { + ref: refTableMenu + }) + : createCommentVNode(), /** * 通用提示 */ - hasUseTooltip ? h(resolveComponent('vxe-tooltip') as ComponentOptions, { + h(resolveComponent('vxe-tooltip') as VxeTooltipComponent, { ref: refCommTooltip, isArrow: false, enterable: false - }) : createCommentVNode(), + }), /** * 工具提示 */ - hasUseTooltip ? h(resolveComponent('vxe-tooltip') as ComponentOptions, { + h(resolveComponent('vxe-tooltip') as VxeTooltipComponent, { ref: refTooltip, - ...tipConfig - }) : createCommentVNode(), + ...tipConfig as any + }), /** * 校验提示 */ - hasUseTooltip && props.editRules && validOpts.showMessage && (validOpts.message === 'default' ? !height : validOpts.message === 'tooltip') ? h(resolveComponent('vxe-tooltip') as ComponentOptions, { - ref: refValidTooltip, - class: [{ - 'old-cell-valid': editRules && GlobalConfig.cellVaildMode === 'obsolete' - }, 'vxe-table--valid-error'], - ...(validOpts.message === 'tooltip' || tableData.length === 1 ? validTipOpts : {}) - }) : createCommentVNode() + props.editRules && validOpts.showMessage && (validOpts.message === 'default' ? !height : validOpts.message === 'tooltip') + ? h(resolveComponent('vxe-tooltip') as VxeTooltipComponent, { + ref: refValidTooltip, + class: [{ + 'old-cell-valid': editRules && getConfig().cellVaildMode === 'obsolete' + }, 'vxe-table--valid-error'], + ...(validOpts.message === 'tooltip' || tableData.length === 1 ? validTipOpts : {}) as any + }) + : createCommentVNode() ]) } - $xetable.renderVN = renderVN + $xeTable.renderVN = renderVN - provide('xecolgroup', null) - provide('$xetable', $xetable) + provide('$xeColgroup', null) + provide('$xeTable', $xeTable) - return $xetable + return $xeTable }, render () { return this.renderVN() diff --git a/packages/table/src/util.ts b/packages/table/src/util.ts index c31043bcd0..2066b088b3 100644 --- a/packages/table/src/util.ts +++ b/packages/table/src/util.ts @@ -1,9 +1,9 @@ import { watch, reactive } from 'vue' import XEUtils from 'xe-utils' import { ColumnInfo } from './columnInfo' -import { isPx, isScale } from '../../tools/dom' +import { isPx, isScale } from '../../ui/src/dom' -import { VxeTableConstructor, VxeTablePrivateMethods, VxeTableDefines } from '../../../types/all' +import type { VxeTableConstructor, VxeTablePrivateMethods, VxeTableDefines } from '../../../types' const getAllConvertColumns = (columns: any, parentColumn?: any) => { const result: any[] = [] @@ -72,15 +72,15 @@ export interface XEBodyScrollElement extends HTMLDivElement { _onscroll: ((evnt: Event) => void) | null; } -export function restoreScrollLocation ($xetable: VxeTableConstructor, scrollLeft: number, scrollTop: number) { - const { internalData } = $xetable - return $xetable.clearScroll().then(() => { +export function restoreScrollLocation ($xeTable: VxeTableConstructor, scrollLeft: number, scrollTop: number) { + const { internalData } = $xeTable + return $xeTable.clearScroll().then(() => { if (scrollLeft || scrollTop) { // 重置最后滚动状态 internalData.lastScrollLeft = 0 internalData.lastScrollTop = 0 // 还原滚动状态 - return $xetable.scrollTo(scrollLeft, scrollTop) + return $xeTable.scrollTo(scrollLeft, scrollTop) } }) } @@ -105,17 +105,17 @@ export function getRowUniqueId () { } // 行主键 key -export function getRowkey ($xetable: VxeTableConstructor) { - const { props } = $xetable - const { computeRowOpts } = $xetable.getComputeMaps() +export function getRowkey ($xeTable: VxeTableConstructor) { + const { props } = $xeTable + const { computeRowOpts } = $xeTable.getComputeMaps() const { rowId } = props const rowOpts = computeRowOpts.value return rowId || rowOpts.keyField || '_X_ROW_KEY' } // 行主键 value -export function getRowid ($xetable: VxeTableConstructor, row: any) { - const rowid = XEUtils.get(row, getRowkey($xetable)) +export function getRowid ($xeTable: VxeTableConstructor, row: any) { + const rowid = XEUtils.get(row, getRowkey($xeTable)) return XEUtils.eqNull(rowid) ? '' : encodeURIComponent(rowid) } @@ -123,9 +123,9 @@ export interface XEColumnInstance { column: ColumnInfo; } -export const handleFieldOrColumn = ($xetable: VxeTableConstructor, fieldOrColumn: string | VxeTableDefines.ColumnInfo | null) => { +export const handleFieldOrColumn = ($xeTable: VxeTableConstructor, fieldOrColumn: string | VxeTableDefines.ColumnInfo | null) => { if (fieldOrColumn) { - return XEUtils.isString(fieldOrColumn) ? $xetable.getColumnByField(fieldOrColumn) : fieldOrColumn + return XEUtils.isString(fieldOrColumn) ? $xeTable.getColumnByField(fieldOrColumn) : fieldOrColumn } return null } @@ -270,28 +270,28 @@ export function isColumnInfo (column: any): column is ColumnInfo { return column && (column.constructor === ColumnInfo || column instanceof ColumnInfo) } -export function createColumn ($xetable: VxeTableConstructor & VxeTablePrivateMethods, options: VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo, renderOptions: any): any { - return isColumnInfo(options) ? options : reactive(new ColumnInfo($xetable, options, renderOptions)) +export function createColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, options: VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo, renderOptions: any): any { + return isColumnInfo(options) ? options : reactive(new ColumnInfo($xeTable, options, renderOptions)) } -export function watchColumn ($xetable: VxeTableConstructor & VxeTablePrivateMethods, props: any, column: ColumnInfo) { +export function watchColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, props: any, column: ColumnInfo) { Object.keys(props).forEach(name => { watch(() => props[name], (value: any) => { column.update(name, value) - if ($xetable) { + if ($xeTable) { if (name === 'filters') { - $xetable.setFilter(column as any, value) - $xetable.handleUpdateDataQueue() + $xeTable.setFilter(column as any, value) + $xeTable.handleUpdateDataQueue() } else if (['visible', 'fixed', 'width', 'minWidth', 'maxWidth'].includes(name)) { - $xetable.handleRefreshColumnQueue() + $xeTable.handleRefreshColumnQueue() } } }) }) } -export function assemColumn ($xetable: VxeTableConstructor & VxeTablePrivateMethods, elem: HTMLElement, column: ColumnInfo, colgroup: XEColumnInstance | null) { - const { reactData } = $xetable +export function assemColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, elem: HTMLElement, column: ColumnInfo, colgroup: XEColumnInstance | null) { + const { reactData } = $xeTable const { staticColumns } = reactData const parentElem = elem.parentNode const parentColumn = colgroup ? colgroup.column : null @@ -302,8 +302,8 @@ export function assemColumn ($xetable: VxeTableConstructor & VxeTablePrivateMeth } } -export function destroyColumn ($xetable: VxeTableConstructor & VxeTablePrivateMethods, column: ColumnInfo) { - const { reactData } = $xetable +export function destroyColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, column: ColumnInfo) { + const { reactData } = $xeTable const { staticColumns } = reactData const matchObj = XEUtils.findTree(staticColumns, item => item.id === column.id, { children: 'children' }) if (matchObj) { @@ -312,8 +312,8 @@ export function destroyColumn ($xetable: VxeTableConstructor & VxeTablePrivateMe reactData.staticColumns = staticColumns.slice(0) } -export function getRootColumn ($xetable: VxeTableConstructor & VxeTablePrivateMethods, column: ColumnInfo) { - const { internalData } = $xetable +export function getRootColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, column: ColumnInfo) { + const { internalData } = $xeTable const { fullColumnIdData } = internalData if (!column) { return null @@ -343,49 +343,49 @@ export function mergeBodyMethod (mergeList: VxeTableDefines.MergeItem[], _rowInd } } -export function clearTableDefaultStatus ($xetable: VxeTableConstructor & VxeTablePrivateMethods) { - const { props, internalData } = $xetable +export function clearTableDefaultStatus ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) { + const { props, internalData } = $xeTable internalData.initStatus = false - $xetable.clearSort() - $xetable.clearCurrentRow() - $xetable.clearCurrentColumn() - $xetable.clearRadioRow() - $xetable.clearRadioReserve() - $xetable.clearCheckboxRow() - $xetable.clearCheckboxReserve() - $xetable.clearRowExpand() - $xetable.clearTreeExpand() - $xetable.clearTreeExpandReserve() - $xetable.clearPendingRow() - if ($xetable.clearFilter) { - $xetable.clearFilter() + $xeTable.clearSort() + $xeTable.clearCurrentRow() + $xeTable.clearCurrentColumn() + $xeTable.clearRadioRow() + $xeTable.clearRadioReserve() + $xeTable.clearCheckboxRow() + $xeTable.clearCheckboxReserve() + $xeTable.clearRowExpand() + $xeTable.clearTreeExpand() + $xeTable.clearTreeExpandReserve() + $xeTable.clearPendingRow() + if ($xeTable.clearFilter) { + $xeTable.clearFilter() } - if ($xetable.clearSelected && (props.keyboardConfig || props.mouseConfig)) { - $xetable.clearSelected() + if ($xeTable.clearSelected && (props.keyboardConfig || props.mouseConfig)) { + $xeTable.clearSelected() } - if ($xetable.clearCellAreas && props.mouseConfig) { - $xetable.clearCellAreas() - $xetable.clearCopyCellArea() + if ($xeTable.clearCellAreas && props.mouseConfig) { + $xeTable.clearCellAreas() + $xeTable.clearCopyCellArea() } - return $xetable.clearScroll() + return $xeTable.clearScroll() } -export function clearTableAllStatus ($xetable: VxeTableConstructor & VxeTablePrivateMethods) { - if ($xetable.clearFilter) { - $xetable.clearFilter() +export function clearTableAllStatus ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) { + if ($xeTable.clearFilter) { + $xeTable.clearFilter() } - return clearTableDefaultStatus($xetable) + return clearTableDefaultStatus($xeTable) } -export function rowToVisible ($xetable: VxeTableConstructor & VxeTablePrivateMethods, row: any) { - const { reactData, internalData } = $xetable - const { refTableBody } = $xetable.getRefMaps() +export function rowToVisible ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, row: any) { + const { reactData, internalData } = $xeTable + const { refTableBody } = $xeTable.getRefMaps() const { scrollYLoad } = reactData const { afterFullData, scrollYStore } = internalData const tableBody = refTableBody.value const bodyElem = tableBody ? tableBody.$el as HTMLDivElement : null if (bodyElem) { - const trElem: HTMLTableRowElement | null = bodyElem.querySelector(`[rowid="${getRowid($xetable, row)}"]`) + const trElem: HTMLTableRowElement | null = bodyElem.querySelector(`[rowid="${getRowid($xeTable, row)}"]`) if (trElem) { const bodyHeight = bodyElem.clientHeight const bodySrcollTop = bodyElem.scrollTop @@ -395,24 +395,24 @@ export function rowToVisible ($xetable: VxeTableConstructor & VxeTablePrivateMet // 检测行是否在可视区中 if (trOffsetTop < bodySrcollTop || trOffsetTop > bodySrcollTop + bodyHeight) { // 向上定位 - return $xetable.scrollTo(null, trOffsetTop) + return $xeTable.scrollTo(null, trOffsetTop) } else if (trOffsetTop + trHeight >= bodyHeight + bodySrcollTop) { // 向下定位 - return $xetable.scrollTo(null, bodySrcollTop + trHeight) + return $xeTable.scrollTo(null, bodySrcollTop + trHeight) } } else { // 如果是虚拟渲染跨行滚动 if (scrollYLoad) { - return $xetable.scrollTo(null, (afterFullData.indexOf(row) - 1) * scrollYStore.rowHeight) + return $xeTable.scrollTo(null, (afterFullData.indexOf(row) - 1) * scrollYStore.rowHeight) } } } return Promise.resolve() } -export function colToVisible ($xetable: VxeTableConstructor & VxeTablePrivateMethods, column: VxeTableDefines.ColumnInfo) { - const { reactData, internalData } = $xetable - const { refTableBody } = $xetable.getRefMaps() +export function colToVisible ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, column: VxeTableDefines.ColumnInfo) { + const { reactData, internalData } = $xeTable + const { refTableBody } = $xeTable.getRefMaps() const { scrollXLoad } = reactData const { visibleColumn } = internalData const tableBody = refTableBody.value @@ -428,10 +428,10 @@ export function colToVisible ($xetable: VxeTableConstructor & VxeTablePrivateMet // 检测行是否在可视区中 if (tdOffsetLeft < bodySrcollLeft || tdOffsetLeft > bodySrcollLeft + bodyWidth) { // 向左定位 - return $xetable.scrollTo(tdOffsetLeft) + return $xeTable.scrollTo(tdOffsetLeft) } else if (tdOffsetLeft + tdWidth >= bodyWidth + bodySrcollLeft) { // 向右定位 - return $xetable.scrollTo(bodySrcollLeft + tdWidth) + return $xeTable.scrollTo(bodySrcollLeft + tdWidth) } } else { // 如果是虚拟渲染跨行滚动 @@ -443,7 +443,7 @@ export function colToVisible ($xetable: VxeTableConstructor & VxeTablePrivateMet } scrollLeft += visibleColumn[index].renderWidth } - return $xetable.scrollTo(scrollLeft) + return $xeTable.scrollTo(scrollLeft) } } } diff --git a/packages/textarea/index.d.ts b/packages/textarea/index.d.ts deleted file mode 100644 index 18117f398c..0000000000 --- a/packages/textarea/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTextarea } from '../../types/textarea' - -export * from '../../types/textarea' -export default VxeTextarea diff --git a/packages/textarea/index.ts b/packages/textarea/index.ts deleted file mode 100644 index cc323fa210..0000000000 --- a/packages/textarea/index.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { App } from 'vue' -import VxeTextareaComponent from './src/textarea' -import { dynamicApp } from '../dynamics' - -export const VxeTextarea = Object.assign(VxeTextareaComponent, { - install: function (app: App) { - app.component(VxeTextareaComponent.name, VxeTextareaComponent) - } -}) - -export const Textarea = VxeTextarea - -dynamicApp.component(VxeTextareaComponent.name, VxeTextareaComponent) - -export default VxeTextarea diff --git a/packages/textarea/src/textarea.ts b/packages/textarea/src/textarea.ts deleted file mode 100644 index 40400925e2..0000000000 --- a/packages/textarea/src/textarea.ts +++ /dev/null @@ -1,268 +0,0 @@ -import { defineComponent, h, ref, Ref, computed, nextTick, watch, PropType, reactive, inject } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { getFuncText } from '../../tools/utils' -import { useSize } from '../../hooks/size' - -import { VxeTextareaPropTypes, TextareaReactData, TextareaMethods, VxeTextareaConstructor, VxeTextareaEmits, TextareaPrivateRef, VxeFormConstructor, VxeFormPrivateMethods, VxeFormDefines } from '../../../types/all' - -let autoTxtElem: HTMLDivElement - -export default defineComponent({ - name: 'VxeTextarea', - props: { - modelValue: [String, Number] as PropType, - className: String as PropType, - immediate: { type: Boolean as PropType, default: true }, - name: String as PropType, - readonly: Boolean as PropType, - disabled: Boolean as PropType, - placeholder: { - type: String as PropType, - default: () => XEUtils.eqNull(GlobalConfig.textarea.placeholder) ? GlobalConfig.i18n('vxe.base.pleaseInput') : GlobalConfig.textarea.placeholder - }, - maxlength: [String, Number] as PropType, - rows: { type: [String, Number] as PropType, default: 2 }, - cols: { type: [String, Number] as PropType, default: null }, - showWordCount: Boolean as PropType, - countMethod: Function as PropType, - autosize: [Boolean, Object] as PropType, - form: String as PropType, - resize: { type: String as PropType, default: () => GlobalConfig.textarea.resize }, - size: { type: String as PropType, default: () => GlobalConfig.textarea.size || GlobalConfig.size } - }, - emits: [ - 'update:modelValue', - 'input', - 'keydown', - 'keyup', - 'click', - 'change', - 'focus', - 'blur' - ] as VxeTextareaEmits, - setup (props, context) { - const { emit } = context - const $xeform = inject('$xeform', null) - const $xeformiteminfo = inject('$xeformiteminfo', null) - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - inputValue: props.modelValue - }) - - const refElem = ref() as Ref - const refTextarea = ref() as Ref - - const refMaps: TextareaPrivateRef = { - refElem, - refTextarea - } - - const $xetextarea = { - xID, - props, - context, - reactData, - getRefMaps: () => refMaps - } as unknown as VxeTextareaConstructor - - let textareaMethods = {} as TextareaMethods - - const computeInputCount = computed(() => { - return XEUtils.getSize(reactData.inputValue) - }) - - const computeIsCountError = computed(() => { - const inputCount = computeInputCount.value - return props.maxlength && inputCount > XEUtils.toNumber(props.maxlength) - }) - - const computeSizeOpts = computed(() => { - return Object.assign({ minRows: 1, maxRows: 10 }, GlobalConfig.textarea.autosize, props.autosize) - }) - - const updateAutoTxt = () => { - const { size, autosize } = props - const { inputValue } = reactData - if (autosize) { - if (!autoTxtElem) { - autoTxtElem = document.createElement('div') - } - if (!autoTxtElem.parentNode) { - document.body.appendChild(autoTxtElem) - } - const textElem = refTextarea.value - const textStyle = getComputedStyle(textElem) - autoTxtElem.className = ['vxe-textarea--autosize', size ? `size--${size}` : ''].join(' ') - autoTxtElem.style.width = `${textElem.clientWidth}px` - autoTxtElem.style.padding = textStyle.padding - autoTxtElem.innerText = ('' + (inputValue || '　')).replace(/\n$/, '\n　') - } - } - - const handleResize = () => { - if (props.autosize) { - nextTick(() => { - const sizeOpts = computeSizeOpts.value - const { minRows, maxRows } = sizeOpts - const textElem = refTextarea.value - const sizeHeight = autoTxtElem.clientHeight - const textStyle = getComputedStyle(textElem) - const lineHeight = XEUtils.toNumber(textStyle.lineHeight) - const paddingTop = XEUtils.toNumber(textStyle.paddingTop) - const paddingBottom = XEUtils.toNumber(textStyle.paddingBottom) - const borderTopWidth = XEUtils.toNumber(textStyle.borderTopWidth) - const borderBottomWidth = XEUtils.toNumber(textStyle.borderBottomWidth) - const intervalHeight = paddingTop + paddingBottom + borderTopWidth + borderBottomWidth - const rowNum = (sizeHeight - intervalHeight) / lineHeight - const textRows = rowNum && /[0-9]/.test('' + rowNum) ? rowNum : Math.floor(rowNum) + 1 - let vaildRows = textRows - if (textRows < minRows) { - vaildRows = minRows - } else if (textRows > maxRows) { - vaildRows = maxRows - } - textElem.style.height = `${(vaildRows * lineHeight) + intervalHeight}px` - }) - } - } - - const triggerEvent = (evnt: Event & { type: 'focus' | 'blur' | 'change' }) => { - const value = reactData.inputValue - $xetextarea.dispatchEvent(evnt.type, { value }, evnt) - } - - const emitUpdate = (value: string, evnt: Event) => { - reactData.inputValue = value - emit('update:modelValue', value) - if (XEUtils.toValueString(props.modelValue) !== value) { - textareaMethods.dispatchEvent('change', { value }, evnt) - // 自动更新校验状态 - if ($xeform && $xeformiteminfo) { - $xeform.triggerItemEvent(evnt, $xeformiteminfo.itemConfig.field, value) - } - } - } - - const inputEvent = (evnt: InputEvent) => { - const { immediate } = props - const textElem = evnt.target as HTMLTextAreaElement - const value = textElem.value - reactData.inputValue = value - if (immediate) { - emitUpdate(value, evnt) - } - $xetextarea.dispatchEvent('input', { value }, evnt) - handleResize() - } - - const changeEvent = (evnt: Event & { type: 'change' }) => { - const { immediate } = props - if (immediate) { - triggerEvent(evnt) - } else { - emitUpdate(reactData.inputValue, evnt) - } - } - - const blurEvent = (evnt: Event & { type: 'blur' }) => { - const { immediate } = props - const { inputValue } = reactData - if (!immediate) { - emitUpdate(inputValue, evnt) - } - $xetextarea.dispatchEvent('blur', { value: inputValue }, evnt) - } - - textareaMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $textarea: $xetextarea, $event: evnt }, params)) - }, - - focus () { - const textElem = refTextarea.value - textElem.focus() - return nextTick() - }, - - blur () { - const textElem = refTextarea.value - textElem.blur() - return nextTick() - } - } - - Object.assign($xetextarea, textareaMethods) - - watch(() => props.modelValue, (val) => { - reactData.inputValue = val - updateAutoTxt() - }) - - nextTick(() => { - const { autosize } = props - if (autosize) { - updateAutoTxt() - handleResize() - } - }) - - const renderVN = () => { - const { className, resize, placeholder, disabled, maxlength, autosize, showWordCount, countMethod, rows, cols } = props - const { inputValue } = reactData - const vSize = computeSize.value - const isCountError = computeIsCountError.value - const inputCount = computeInputCount.value - return h('div', { - ref: refElem, - class: ['vxe-textarea', className, { - [`size--${vSize}`]: vSize, - 'is--autosize': autosize, - 'is--count': showWordCount, - 'is--disabled': disabled, - 'def--rows': !XEUtils.eqNull(rows), - 'def--cols': !XEUtils.eqNull(cols) - }] - }, [ - h('textarea', { - ref: refTextarea, - class: 'vxe-textarea--inner', - value: inputValue, - name: props.name, - placeholder: placeholder ? getFuncText(placeholder) : null, - maxlength, - readonly: props.readonly, - disabled, - rows, - cols, - style: resize ? { - resize - } : null, - onInput: inputEvent, - onChange: changeEvent, - onKeydown: triggerEvent, - onKeyup: triggerEvent, - onClick: triggerEvent, - onFocus: triggerEvent, - onBlur: blurEvent - }), - showWordCount ? h('span', { - class: ['vxe-textarea--count', { - 'is--error': isCountError - }] - }, countMethod ? `${countMethod({ value: inputValue })}` : `${inputCount}${maxlength ? `/${maxlength}` : ''}`) : null - ]) - } - - $xetextarea.renderVN = renderVN - - return $xetextarea - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/toolbar/index.d.ts b/packages/toolbar/index.d.ts deleted file mode 100644 index 6b720e6e82..0000000000 --- a/packages/toolbar/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeToolbar } from '../../types/toolbar' - -export * from '../../types/toolbar' -export default VxeToolbar diff --git a/packages/toolbar/index.ts b/packages/toolbar/index.ts index 6080699730..20405f97b5 100644 --- a/packages/toolbar/index.ts +++ b/packages/toolbar/index.ts @@ -1,15 +1,16 @@ import { App } from 'vue' +import { VxeUI } from '../ui' import VxeToolbarComponent from './src/toolbar' -import { dynamicApp } from '../dynamics' -export const VxeToolbar = Object.assign(VxeToolbarComponent, { - install: function (app: App) { - app.component(VxeToolbarComponent.name, VxeToolbarComponent) +export const VxeToolbar = Object.assign({}, VxeToolbarComponent, { + install (app: App) { + app.component(VxeToolbarComponent.name as string, VxeToolbarComponent) } }) -export const Toolbar = VxeToolbar - -dynamicApp.component(VxeToolbarComponent.name, VxeToolbarComponent) +if (VxeUI.dynamicApp) { + VxeUI.dynamicApp.component(VxeToolbarComponent.name as string, VxeToolbarComponent) +} +export const Toolbar = VxeToolbar export default VxeToolbar diff --git a/packages/toolbar/src/toolbar.ts b/packages/toolbar/src/toolbar.ts index a4d7ab40f3..e425f003bd 100644 --- a/packages/toolbar/src/toolbar.ts +++ b/packages/toolbar/src/toolbar.ts @@ -1,13 +1,12 @@ -import { defineComponent, h, ref, Ref, computed, inject, createCommentVNode, VNode, reactive, nextTick, PropType } from 'vue' +import { defineComponent, h, ref, Ref, computed, inject, createCommentVNode, VNode, reactive, nextTick, PropType, resolveComponent } from 'vue' import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import VxeButtonComponent from '../../button' -import { VXETable } from '../../v-x-e-table' -import { useSize } from '../../hooks/size' -import { warnLog, errLog } from '../../tools/log' -import { getSlotVNs } from '../../tools/vn' +import { VxeUI } from '../../ui' +import { getSlotVNs } from '../../ui/src/vn' +import { warnLog, errLog } from '../../ui/src/log' -import { VxeGridConstructor, GridPrivateMethods, ToolbarMethods, VxeToolbarConstructor, VxeToolbarEmits, VxeToolbarPropTypes, VxeTableConstructor, ToolbarPrivateRef, VxeTableMethods, VxeTablePrivateMethods, ToolbarReactData } from '../../../types/all' +import type { VxeGridConstructor, GridPrivateMethods, ToolbarMethods, VxeToolbarConstructor, VxeToolbarEmits, VxeToolbarPropTypes, VxeTableConstructor, ToolbarPrivateRef, VxeTableMethods, VxeTablePrivateMethods, ToolbarReactData, VxeButtonComponent } from '../../../types' + +const { getConfig, getIcon, getI18n, renderer, commands, createEvent, useFns } = VxeUI export default defineComponent({ name: 'VxeToolbar', @@ -19,10 +18,10 @@ export default defineComponent({ print: [Boolean, Object] as PropType, zoom: [Boolean, Object] as PropType< VxeToolbarPropTypes.Zoom>, custom: [Boolean, Object] as PropType, - buttons: { type: Array as PropType, default: () => GlobalConfig.toolbar.buttons }, - tools: { type: Array as PropType, default: () => GlobalConfig.toolbar.tools }, - perfect: { type: Boolean as PropType, default: () => GlobalConfig.toolbar.perfect }, - size: { type: String as PropType, default: () => GlobalConfig.toolbar.size || GlobalConfig.size }, + buttons: { type: Array as PropType, default: () => getConfig().toolbar.buttons }, + tools: { type: Array as PropType, default: () => getConfig().toolbar.tools }, + perfect: { type: Boolean as PropType, default: () => getConfig().toolbar.perfect }, + size: { type: String as PropType, default: () => getConfig().toolbar.size || getConfig().size }, className: [String, Function] as PropType }, emits: [ @@ -34,7 +33,7 @@ export default defineComponent({ const xID = XEUtils.uniqueId() - const computeSize = useSize(props) + const { computeSize } = useFns.useSize(props) const reactData = reactive({ isRefresh: false, @@ -47,7 +46,7 @@ export default defineComponent({ refElem } - const $xetoolbar = { + const $xeToolbar = { xID, props, context, @@ -57,39 +56,39 @@ export default defineComponent({ let toolbarMethods = {} as ToolbarMethods - const $xegrid = inject('$xegrid', null as (VxeGridConstructor & GridPrivateMethods) | null) - let $xetable: VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods + const $xeGrid = inject('$xeGrid', null as (VxeGridConstructor & GridPrivateMethods) | null) + let $xeTable: VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods const connectFlag = ref(0) const computeRefreshOpts = computed(() => { - return Object.assign({}, GlobalConfig.toolbar.refresh, props.refresh) as VxeToolbarPropTypes.RefreshOpts + return Object.assign({}, getConfig().toolbar.refresh, props.refresh) as VxeToolbarPropTypes.RefreshOpts }) const computeImportOpts = computed(() => { - return Object.assign({}, GlobalConfig.toolbar.import, props.import) as VxeToolbarPropTypes.ImportOpts + return Object.assign({}, getConfig().toolbar.import, props.import) as VxeToolbarPropTypes.ImportOpts }) const computeExportOpts = computed(() => { - return Object.assign({}, GlobalConfig.toolbar.export, props.export) as VxeToolbarPropTypes.ExportOpts + return Object.assign({}, getConfig().toolbar.export, props.export) as VxeToolbarPropTypes.ExportOpts }) const computePrintOpts = computed(() => { - return Object.assign({}, GlobalConfig.toolbar.print, props.print) as VxeToolbarPropTypes.PrintOpts + return Object.assign({}, getConfig().toolbar.print, props.print) as VxeToolbarPropTypes.PrintOpts }) const computeZoomOpts = computed(() => { - return Object.assign({}, GlobalConfig.toolbar.zoom, props.zoom) as VxeToolbarPropTypes.ZoomOpts + return Object.assign({}, getConfig().toolbar.zoom, props.zoom) as VxeToolbarPropTypes.ZoomOpts }) const computeCustomOpts = computed(() => { - return Object.assign({}, GlobalConfig.toolbar.custom, props.custom) as VxeToolbarPropTypes.CustomOpts + return Object.assign({}, getConfig().toolbar.custom, props.custom) as VxeToolbarPropTypes.CustomOpts }) const computeTableCustomOpts = computed(() => { - if (connectFlag.value || $xetable) { - if ($xetable) { - const { computeCustomOpts } = $xetable.getComputeMaps() + if (connectFlag.value || $xeTable) { + if ($xeTable) { + const { computeCustomOpts } = $xeTable.getComputeMaps() return computeCustomOpts.value } } @@ -102,16 +101,16 @@ export default defineComponent({ }) const checkTable = () => { - if ($xetable) { + if ($xeTable) { return true } errLog('vxe.error.barUnableLink') } const handleClickSettingEvent = ({ $event }: any) => { - if ($xetable) { - if ($xetable.triggerCustomEvent) { - $xetable.triggerCustomEvent($event) + if ($xeTable) { + if ($xeTable.triggerCustomEvent) { + $xeTable.triggerCustomEvent($event) } else { errLog('vxe.error.reqModule', ['VxeTableCustomModule']) } @@ -119,19 +118,19 @@ export default defineComponent({ } const handleMouseenterSettingEvent = ({ $event }: any) => { - if ($xetable) { - $xetable.customOpenEvent($event) + if ($xeTable) { + $xeTable.customOpenEvent($event) } else { errLog('vxe.error.reqModule', ['VxeTableCustomModule']) } } const handleMouseleaveSettingEvent = ({ $event }: any) => { - const { customStore } = $xetable.reactData + const { customStore } = $xeTable.reactData customStore.activeBtn = false setTimeout(() => { if (!customStore.activeBtn && !customStore.activeWrapper) { - $xetable.customColseEvent($event) + $xeTable.customCloseEvent($event) } }, 350) } @@ -150,9 +149,9 @@ export default defineComponent({ } catch (e) { reactData.isRefresh = false } - } else if ($xegrid) { + } else if ($xeGrid) { reactData.isRefresh = true - $xegrid.triggerToolbarCommitEvent({ code: refreshOpts.code || 'reload' }, evnt).catch((e) => e).then(() => { + $xeGrid.triggerToolbarCommitEvent({ code: refreshOpts.code || 'reload' }, evnt).catch((e) => e).then(() => { reactData.isRefresh = false }) } @@ -160,29 +159,29 @@ export default defineComponent({ } const zoomEvent = (evnt: Event) => { - if ($xegrid) { - $xegrid.triggerZoomEvent(evnt) + if ($xeGrid) { + $xeGrid.triggerZoomEvent(evnt) } } const btnEvent = (evnt: Event, item: VxeToolbarPropTypes.ButtonConfig) => { const { code } = item if (code) { - if ($xegrid) { - $xegrid.triggerToolbarBtnEvent(item, evnt) + if ($xeGrid) { + $xeGrid.triggerToolbarBtnEvent(item, evnt) } else { - const gCommandOpts = VXETable.commands.get(code) - const params = { code, button: item, $table: $xetable, $grid: $xegrid, $event: evnt } + const gCommandOpts = commands.get(code) + const params = { code, button: item, $table: $xeTable, $grid: $xeGrid, $event: evnt } if (gCommandOpts) { if (gCommandOpts.commandMethod) { gCommandOpts.commandMethod(params) } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notCommands', [code]) } } } - $xetoolbar.dispatchEvent('button-click', params, evnt) + $xeToolbar.dispatchEvent('button-click', params, evnt) } } } @@ -190,40 +189,40 @@ export default defineComponent({ const tolEvent = (evnt: Event, item: VxeToolbarPropTypes.ButtonConfig) => { const { code } = item if (code) { - if ($xegrid) { - $xegrid.triggerToolbarTolEvent(item, evnt) + if ($xeGrid) { + $xeGrid.triggerToolbarTolEvent(item, evnt) } else { - const gCommandOpts = VXETable.commands.get(code) - const params = { code, tool: item, $table: $xetable, $grid: $xegrid, $event: evnt } + const gCommandOpts = commands.get(code) + const params = { code, tool: item, $table: $xeTable, $grid: $xeGrid, $event: evnt } if (gCommandOpts) { if (gCommandOpts.commandMethod) { gCommandOpts.commandMethod(params) } else { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { errLog('vxe.error.notCommands', [code]) } } } - $xetoolbar.dispatchEvent('tool-click', params, evnt) + $xeToolbar.dispatchEvent('tool-click', params, evnt) } } } const importEvent = () => { if (checkTable()) { - $xetable.openImport() + $xeTable.openImport() } } const exportEvent = () => { if (checkTable()) { - $xetable.openExport() + $xeTable.openExport() } } const printEvent = () => { if (checkTable()) { - $xetable.openPrint() + $xeTable.openPrint() } } @@ -235,7 +234,7 @@ export default defineComponent({ if (child.visible === false) { return createCommentVNode() } - return h(VxeButtonComponent, { + return h(resolveComponent('vxe-button') as VxeButtonComponent, { key: index, disabled: child.disabled, loading: child.loading, @@ -259,17 +258,17 @@ export default defineComponent({ const { buttons } = props const buttonsSlot = slots.buttons if (buttonsSlot) { - return getSlotVNs(buttonsSlot({ $grid: $xegrid, $table: $xetable })) + return getSlotVNs(buttonsSlot({ $grid: $xeGrid, $table: $xeTable })) } const btnVNs: VNode[] = [] if (buttons) { buttons.forEach((item) => { const { dropdowns, buttonRender } = item if (item.visible !== false) { - const compConf = buttonRender ? VXETable.renderer.get(buttonRender.name) : null + const compConf = buttonRender ? renderer.get(buttonRender.name) : null if (buttonRender && compConf && compConf.renderToolbarButton) { const toolbarButtonClassName = compConf.toolbarButtonClassName - const params = { $grid: $xegrid, $table: $xetable, button: item } + const params = { $grid: $xeGrid, $table: $xeTable, button: item } btnVNs.push( h('span', { class: ['vxe-button--item', toolbarButtonClassName ? (XEUtils.isFunction(toolbarButtonClassName) ? toolbarButtonClassName(params) : toolbarButtonClassName) : ''] @@ -277,7 +276,7 @@ export default defineComponent({ ) } else { btnVNs.push( - h(VxeButtonComponent, { + h(resolveComponent('vxe-button') as VxeButtonComponent, { disabled: item.disabled, loading: item.loading, type: item.type, @@ -290,9 +289,11 @@ export default defineComponent({ placement: item.placement, transfer: item.transfer, onClick: (evnt: Event) => btnEvent(evnt, item) - }, dropdowns && dropdowns.length ? { - dropdowns: () => renderDropdowns(item, true) - } : {}) + }, dropdowns && dropdowns.length + ? { + dropdowns: () => renderDropdowns(item, true) + } + : {}) ) } } @@ -308,7 +309,7 @@ export default defineComponent({ const { tools } = props const toolsSlot = slots.tools if (toolsSlot) { - return getSlotVNs(toolsSlot({ $grid: $xegrid, $table: $xetable })) + return getSlotVNs(toolsSlot({ $grid: $xeGrid, $table: $xeTable })) } const btnVNs: VNode[] = [] if (tools) { @@ -316,10 +317,10 @@ export default defineComponent({ const { dropdowns, toolRender } = item if (item.visible !== false) { const rdName = toolRender ? toolRender.name : null - const compConf = toolRender ? VXETable.renderer.get(rdName) : null + const compConf = toolRender ? renderer.get(rdName) : null if (toolRender && compConf && compConf.renderToolbarTool) { const toolbarToolClassName = compConf.toolbarToolClassName - const params = { $grid: $xegrid, $table: $xetable, tool: item } + const params = { $grid: $xeGrid, $table: $xeTable, tool: item } btnVNs.push( h('span', { key: rdName as string, @@ -328,7 +329,7 @@ export default defineComponent({ ) } else { btnVNs.push( - h(VxeButtonComponent, { + h(resolveComponent('vxe-button') as VxeButtonComponent, { key: tIndex, disabled: item.disabled, loading: item.loading, @@ -342,9 +343,11 @@ export default defineComponent({ placement: item.placement, transfer: item.transfer, onClick: (evnt: Event) => tolEvent(evnt, item) - }, dropdowns && dropdowns.length ? { - dropdowns: () => renderDropdowns(item, false) - } : {}) + }, dropdowns && dropdowns.length + ? { + dropdowns: () => renderDropdowns(item, false) + } + : {}) ) } } @@ -355,57 +358,59 @@ export default defineComponent({ const renderToolImport = () => { const importOpts = computeImportOpts.value - return h(VxeButtonComponent, { + return h(resolveComponent('vxe-button') as VxeButtonComponent, { key: 'import', circle: true, - icon: importOpts.icon || GlobalConfig.icon.TOOLBAR_TOOLS_IMPORT, - title: GlobalConfig.i18n('vxe.toolbar.import'), + icon: importOpts.icon || getIcon().TOOLBAR_TOOLS_IMPORT, + title: getI18n('vxe.toolbar.import'), onClick: importEvent }) } const renderToolExport = () => { const exportOpts = computeExportOpts.value - return h(VxeButtonComponent, { + return h(resolveComponent('vxe-button') as VxeButtonComponent, { key: 'export', circle: true, - icon: exportOpts.icon || GlobalConfig.icon.TOOLBAR_TOOLS_EXPORT, - title: GlobalConfig.i18n('vxe.toolbar.export'), + icon: exportOpts.icon || getIcon().TOOLBAR_TOOLS_EXPORT, + title: getI18n('vxe.toolbar.export'), onClick: exportEvent }) } const renderToolPrint = () => { const printOpts = computePrintOpts.value - return h(VxeButtonComponent, { + return h(resolveComponent('vxe-button') as VxeButtonComponent, { key: 'print', circle: true, - icon: printOpts.icon || GlobalConfig.icon.TOOLBAR_TOOLS_PRINT, - title: GlobalConfig.i18n('vxe.toolbar.print'), + icon: printOpts.icon || getIcon().TOOLBAR_TOOLS_PRINT, + title: getI18n('vxe.toolbar.print'), onClick: printEvent }) } const renderToolRefresh = () => { const refreshOpts = computeRefreshOpts.value - return h(VxeButtonComponent, { + return h(resolveComponent('vxe-button') as VxeButtonComponent, { key: 'refresh', circle: true, - icon: reactData.isRefresh ? (refreshOpts.iconLoading || GlobalConfig.icon.TOOLBAR_TOOLS_REFRESH_LOADING) : (refreshOpts.icon || GlobalConfig.icon.TOOLBAR_TOOLS_REFRESH), - title: GlobalConfig.i18n('vxe.toolbar.refresh'), + icon: reactData.isRefresh ? (refreshOpts.iconLoading || getIcon().TOOLBAR_TOOLS_REFRESH_LOADING) : (refreshOpts.icon || getIcon().TOOLBAR_TOOLS_REFRESH), + title: getI18n('vxe.toolbar.refresh'), onClick: refreshEvent }) } const renderToolZoom = () => { const zoomOpts = computeZoomOpts.value - return $xegrid ? h(VxeButtonComponent, { - key: 'zoom', - circle: true, - icon: $xegrid.isMaximized() ? (zoomOpts.iconOut || GlobalConfig.icon.TOOLBAR_TOOLS_MINIMIZE) : (zoomOpts.iconIn || GlobalConfig.icon.TOOLBAR_TOOLS_FULLSCREEN), - title: GlobalConfig.i18n(`vxe.toolbar.zoom${$xegrid.isMaximized() ? 'Out' : 'In'}`), - onClick: zoomEvent - }) : createCommentVNode() + return $xeGrid + ? h(resolveComponent('vxe-button') as VxeButtonComponent, { + key: 'zoom', + circle: true, + icon: $xeGrid.isMaximized() ? (zoomOpts.iconOut || getIcon().TOOLBAR_TOOLS_MINIMIZE) : (zoomOpts.iconIn || getIcon().TOOLBAR_TOOLS_FULLSCREEN), + title: getI18n(`vxe.toolbar.zoom${$xeGrid.isMaximized() ? 'Out' : 'In'}`), + onClick: zoomEvent + }) + : createCommentVNode() } const renderToolCustom = () => { @@ -426,11 +431,11 @@ export default defineComponent({ // 点击触发 customBtnOns.onClick = handleClickSettingEvent } - return h(VxeButtonComponent, { + return h(resolveComponent('vxe-button') as VxeButtonComponent, { key: 'custom', circle: true, - icon: customOpts.icon || GlobalConfig.icon.TOOLBAR_TOOLS_CUSTOM, - title: GlobalConfig.i18n('vxe.toolbar.custom'), + icon: customOpts.icon || getIcon().TOOLBAR_TOOLS_CUSTOM, + title: getI18n('vxe.toolbar.custom'), className: 'vxe-toolbar-custom-target', ...customBtnOns }) @@ -438,27 +443,27 @@ export default defineComponent({ toolbarMethods = { dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $toolbar: $xetoolbar, $event: evnt }, params)) + emit(type, createEvent(evnt, { $toolbar: $xeToolbar }, params)) }, syncUpdate (params) { const { collectColumn } = params - $xetable = params.$table + $xeTable = params.$table reactData.columns = collectColumn connectFlag.value++ } } - Object.assign($xetoolbar, toolbarMethods) + Object.assign($xeToolbar, toolbarMethods) nextTick(() => { const { refresh } = props const refreshOpts = computeRefreshOpts.value const queryMethod = refreshOpts.queryMethod || refreshOpts.query - if (refresh && !$xegrid && !queryMethod) { + if (refresh && !$xeGrid && !queryMethod) { warnLog('vxe.error.notFunc', ['queryMethod']) } const customOpts = computeCustomOpts.value - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { + if (process.env.VUE_APP_VXE_ENV === 'development') { if (customOpts.isFooter) { warnLog('vxe.error.delProp', ['toolbar.custom.isFooter', 'table.custom-config.showFooter']) } @@ -479,7 +484,7 @@ export default defineComponent({ const vSize = computeSize.value return h('div', { ref: refElem, - class: ['vxe-toolbar', className ? (XEUtils.isFunction(className) ? className({ $toolbar: $xetoolbar }) : className) : '', { + class: ['vxe-toolbar', className ? (XEUtils.isFunction(className) ? className({ $toolbar: $xeToolbar }) : className) : '', { [`size--${vSize}`]: vSize, 'is--perfect': perfect, 'is--loading': loading @@ -498,15 +503,15 @@ export default defineComponent({ props.export ? renderToolExport() : createCommentVNode(), props.print ? renderToolPrint() : createCommentVNode(), refresh ? renderToolRefresh() : createCommentVNode(), - zoom && $xegrid ? renderToolZoom() : createCommentVNode(), + zoom && $xeGrid ? renderToolZoom() : createCommentVNode(), custom ? renderToolCustom() : createCommentVNode() ]) ]) } - $xetoolbar.renderVN = renderVN + $xeToolbar.renderVN = renderVN - return $xetoolbar + return $xeToolbar }, render () { return this.renderVN() diff --git a/packages/tools/event.ts b/packages/tools/event.ts deleted file mode 100644 index becf050756..0000000000 --- a/packages/tools/event.ts +++ /dev/null @@ -1,88 +0,0 @@ -import XEUtils from 'xe-utils' -import { browse } from './dom' - -import { VxeComponentBase } from '../../types/all' - -export const EVENT_KEYS = { - F2: 'F2', - ESCAPE: 'Escape', - ENTER: 'Enter', - TAB: 'Tab', - DELETE: 'Delete', - BACKSPACE: 'Backspace', - SPACEBAR: ' ', - CONTEXT_MENU: 'ContextMenu', - ARROW_UP: 'ArrowUp', - ARROW_DOWN: 'ArrowDown', - ARROW_LEFT: 'ArrowLeft', - ARROW_RIGHT: 'ArrowRight', - PAGE_UP: 'PageUp', - PAGE_DOWN: 'PageDown' -} - -const convertEventKeys: { [key: string]: string } = { - ' ': 'Spacebar', - Apps: EVENT_KEYS.CONTEXT_MENU, - Del: EVENT_KEYS.DELETE, - Up: EVENT_KEYS.ARROW_UP, - Down: EVENT_KEYS.ARROW_DOWN, - Left: EVENT_KEYS.ARROW_LEFT, - Right: EVENT_KEYS.ARROW_RIGHT -} - -// 监听全局事件 -const wheelName = browse.firefox ? 'DOMMouseScroll' : 'mousewheel' -const eventStore: { - comp: VxeComponentBase; - type: string; - cb: (evnt: Event) => void; -}[] = [] - -export const hasEventKey = (evnt: KeyboardEvent, targetKey: string) => { - const { key } = evnt - targetKey = targetKey.toLowerCase() - return key ? (targetKey === key.toLowerCase() || !!(convertEventKeys[key] && convertEventKeys[key].toLowerCase() === targetKey)) : false -} - -function triggerEvent (evnt: Event) { - const isWheel = evnt.type === wheelName - eventStore.forEach(({ type, cb }) => { - // 如果被取消冒泡，不再执行 - if (!evnt.cancelBubble) { - if (type === evnt.type || (isWheel && type === 'mousewheel')) { - cb(evnt) - } - } - }) -} - -export const GlobalEvent = { - on (comp: VxeComponentBase, type: string, cb: (evnt: any) => void) { - eventStore.push({ comp, type, cb }) - }, - off (comp: VxeComponentBase, type: string) { - XEUtils.remove(eventStore, item => item.comp === comp && item.type === type) - }, - trigger: triggerEvent, - eqKeypad (evnt: KeyboardEvent, keyVal: string) { - const { key } = evnt - if (keyVal.toLowerCase() === key.toLowerCase()) { - return true - } - return false - } -} - -if (browse.isDoc) { - if (!browse.msie) { - window.addEventListener('copy', triggerEvent, false) - window.addEventListener('cut', triggerEvent, false) - window.addEventListener('paste', triggerEvent, false) - } - document.addEventListener('keydown', triggerEvent, false) - document.addEventListener('contextmenu', triggerEvent, false) - window.addEventListener('mousedown', triggerEvent, false) - window.addEventListener('blur', triggerEvent, false) - window.addEventListener('resize', triggerEvent, false) - window.addEventListener(wheelName, XEUtils.throttle(triggerEvent, 100, { leading: true, trailing: false }), { passive: true, capture: false }) -} diff --git a/packages/tools/log.ts b/packages/tools/log.ts deleted file mode 100644 index 10b8afd7d1..0000000000 --- a/packages/tools/log.ts +++ /dev/null @@ -1,16 +0,0 @@ -import GlobalConfig from '../v-x-e-table/src/conf' - -export function getLog (message: string, params?: any) { - return `[vxe-table v${process.env.VUE_APP_VXE_TABLE_VERSION}] ${GlobalConfig.i18n(message, params)}` -} - -function outLog (type: 'log' | 'warn' | 'error') { - return function (message: string, params?: any) { - const msg = getLog(message, params) - console[type](msg) - return msg - } -} - -export const warnLog = outLog('warn') -export const errLog = outLog('error') diff --git a/packages/tools/resize.ts b/packages/tools/resize.ts deleted file mode 100644 index 8662eb4862..0000000000 --- a/packages/tools/resize.ts +++ /dev/null @@ -1,85 +0,0 @@ -import XEUtils from 'xe-utils' -import GlobalConfig from '../v-x-e-table/src/conf' - -/** - * 监听 resize 事件 - * 如果项目中已使用了 resize-observer-polyfill，那么只需要将方法定义全局，该组件就会自动使用 - */ -let resizeTimeout: any -/* eslint-disable no-use-before-define */ -const eventStore: XEResizeObserver[] = [] -const defaultInterval = 500 - -function eventHandle () { - if (eventStore.length) { - eventStore.forEach((item) => { - item.tarList.forEach((observer) => { - const { target, width, heighe } = observer - const clientWidth = target.clientWidth - const clientHeight = target.clientHeight - const rWidth = clientWidth && width !== clientWidth - const rHeight = clientHeight && heighe !== clientHeight - if (rWidth || rHeight) { - observer.width = clientWidth - observer.heighe = clientHeight - setTimeout(item.callback) - } - }) - }) - /* eslint-disable @typescript-eslint/no-use-before-define */ - eventListener() - } -} - -function eventListener () { - clearTimeout(resizeTimeout) - resizeTimeout = setTimeout(eventHandle, GlobalConfig.resizeInterval || defaultInterval) -} - -export class XEResizeObserver { - tarList: { - target: Element; - width: number; - heighe: number; - }[] = [] - - callback: (...args: any[]) => void - - constructor (callback: (...args: any[]) => void) { - this.callback = callback - } - - observe (target: Element): void { - if (target) { - const { tarList } = this - if (!tarList.some(observer => observer.target === target)) { - tarList.push({ - target, - width: target.clientWidth, - heighe: target.clientHeight - }) - } - if (!eventStore.length) { - eventListener() - } - if (!eventStore.some((item) => item === this)) { - eventStore.push(this) - } - } - } - - unobserve (target: Element): void { - XEUtils.remove(eventStore, item => item.tarList.some(observer => observer.target === target)) - } - - disconnect (): void { - XEUtils.remove(eventStore, item => item === this) - } -} - -export function createResizeEvent (callback: (...args: any[]) => void): any { - if (window.ResizeObserver) { - return new window.ResizeObserver(callback) - } - return new XEResizeObserver(callback) -} diff --git a/packages/tooltip/index.d.ts b/packages/tooltip/index.d.ts deleted file mode 100644 index dc4a06ea32..0000000000 --- a/packages/tooltip/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTooltip } from '../../types/tooltip' - -export * from '../../types/tooltip' -export default VxeTooltip diff --git a/packages/tooltip/index.ts b/packages/tooltip/index.ts deleted file mode 100644 index d073d2d759..0000000000 --- a/packages/tooltip/index.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { App } from 'vue' -import { VXETable } from '../v-x-e-table' -import VxeTooltipComponent from './src/tooltip' -import { dynamicApp } from '../dynamics' - -export const VxeTooltip = Object.assign(VxeTooltipComponent, { - install: function (app: App) { - VXETable.tooltip = true - app.component(VxeTooltipComponent.name, VxeTooltipComponent) - } -}) - -export const Tooltip = VxeTooltip - -dynamicApp.component(VxeTooltipComponent.name, VxeTooltipComponent) - -export default VxeTooltip diff --git a/packages/tooltip/src/tooltip.ts b/packages/tooltip/src/tooltip.ts deleted file mode 100644 index e633c7de70..0000000000 --- a/packages/tooltip/src/tooltip.ts +++ /dev/null @@ -1,360 +0,0 @@ -import { defineComponent, h, ref, Ref, nextTick, onBeforeUnmount, onMounted, reactive, watch, PropType } from 'vue' -import XEUtils from 'xe-utils' -import GlobalConfig from '../../v-x-e-table/src/conf' -import { useSize } from '../../hooks/size' -import { getLastZIndex, nextZIndex, formatText } from '../../tools/utils' -import { getAbsolutePos, getDomNode } from '../../tools/dom' -import { getSlotVNs } from '../../tools/vn' - -import { VxeTooltipPropTypes, VxeTooltipConstructor, VxeTooltipEmits, TooltipReactData, TooltipMethods, TooltipPrivateRef } from '../../../types/all' - -export default defineComponent({ - name: 'VxeTooltip', - props: { - modelValue: Boolean, - size: { type: String as PropType, default: () => GlobalConfig.tooltip.size || GlobalConfig.size }, - trigger: { type: String as PropType, default: () => GlobalConfig.tooltip.trigger || 'hover' }, - theme: { type: String as PropType, default: () => GlobalConfig.tooltip.theme || 'dark' }, - content: { type: [String, Number] as PropType, default: null }, - useHTML: Boolean as PropType, - zIndex: [String, Number] as PropType, - popupClassName: [String, Function] as PropType, - isArrow: { type: Boolean as PropType, default: true }, - enterable: Boolean as PropType, - enterDelay: { type: Number as PropType, default: () => GlobalConfig.tooltip.enterDelay }, - leaveDelay: { type: Number as PropType, default: () => GlobalConfig.tooltip.leaveDelay } - }, - emits: [ - 'update:modelValue' - ] as VxeTooltipEmits, - setup (props, context) { - const { slots, emit } = context - - const xID = XEUtils.uniqueId() - - const computeSize = useSize(props) - - const reactData = reactive({ - target: null, - isUpdate: false, - visible: false, - tipContent: '', - tipActive: false, - tipTarget: null, - tipZindex: 0, - tipStore: { - style: {}, - placement: '', - arrowStyle: {} - } - }) - - const refElem = ref() as Ref - - const refMaps: TooltipPrivateRef = { - refElem - } - - const $xetooltip = { - xID, - props, - context, - reactData, - getRefMaps: () => refMaps - } as unknown as VxeTooltipConstructor - - let tooltipMethods = {} as TooltipMethods - - const updateTipStyle = () => { - const { tipTarget, tipStore } = reactData - if (tipTarget) { - const { scrollTop, scrollLeft, visibleWidth } = getDomNode() - const { top, left } = getAbsolutePos(tipTarget) - const el = refElem.value - const marginSize = 6 - const offsetHeight = el.offsetHeight - const offsetWidth = el.offsetWidth - let tipLeft = left - let tipTop = top - offsetHeight - marginSize - tipLeft = Math.max(marginSize, left + Math.floor((tipTarget.offsetWidth - offsetWidth) / 2)) - if (tipLeft + offsetWidth + marginSize > scrollLeft + visibleWidth) { - tipLeft = scrollLeft + visibleWidth - offsetWidth - marginSize - } - if (top - offsetHeight < scrollTop + marginSize) { - tipStore.placement = 'bottom' - tipTop = top + tipTarget.offsetHeight + marginSize - } - tipStore.style.top = `${tipTop}px` - tipStore.style.left = `${tipLeft}px` - tipStore.arrowStyle.left = `${left - tipLeft + tipTarget.offsetWidth / 2}px` - } - } - - const updateValue = (value: VxeTooltipPropTypes.ModelValue) => { - if (value !== reactData.visible) { - reactData.visible = value - reactData.isUpdate = true - emit('update:modelValue', value) - } - } - - const updateZindex = () => { - if (reactData.tipZindex < getLastZIndex()) { - reactData.tipZindex = nextZIndex() - } - } - - const clickEvent = () => { - if (reactData.visible) { - tooltipMethods.close() - } else { - tooltipMethods.open() - } - } - - const targetMouseenterEvent = () => { - tooltipMethods.open() - } - - const targetMouseleaveEvent = () => { - const { trigger, enterable, leaveDelay } = props - reactData.tipActive = false - if (enterable && trigger === 'hover') { - setTimeout(() => { - if (!reactData.tipActive) { - tooltipMethods.close() - } - }, leaveDelay) - } else { - tooltipMethods.close() - } - } - - const wrapperMouseenterEvent = () => { - reactData.tipActive = true - } - - const wrapperMouseleaveEvent = () => { - const { trigger, enterable, leaveDelay } = props - reactData.tipActive = false - if (enterable && trigger === 'hover') { - setTimeout(() => { - if (!reactData.tipActive) { - tooltipMethods.close() - } - }, leaveDelay) - } - } - - const showTip = () => { - const { tipStore } = reactData - const el = refElem.value - if (el) { - const parentNode = el.parentNode - if (!parentNode) { - document.body.appendChild(el) - } - } - updateValue(true) - updateZindex() - tipStore.placement = 'top' - tipStore.style = { width: 'auto', left: 0, top: 0, zIndex: props.zIndex || reactData.tipZindex } - tipStore.arrowStyle = { left: '50%' } - return tooltipMethods.updatePlacement() - } - - const showDelayTip = XEUtils.debounce(() => { - if (reactData.tipActive) { - showTip() - } - }, props.enterDelay, { leading: false, trailing: true }) - - tooltipMethods = { - dispatchEvent (type, params, evnt) { - emit(type, Object.assign({ $tooltip: $xetooltip, $event: evnt }, params)) - }, - open (target?: HTMLElement, content?: VxeTooltipPropTypes.Content) { - return tooltipMethods.toVisible(target || reactData.target as HTMLElement, content) - }, - close () { - reactData.tipTarget = null - reactData.tipActive = false - Object.assign(reactData.tipStore, { - style: {}, - placement: '', - arrowStyle: null - }) - updateValue(false) - return nextTick() - }, - toVisible (target: HTMLElement, content?: VxeTooltipPropTypes.Content) { - if (target) { - const { trigger, enterDelay } = props - reactData.tipActive = true - reactData.tipTarget = target - if (content) { - reactData.tipContent = content - } - if (enterDelay && trigger === 'hover') { - showDelayTip() - } else { - return showTip() - } - } - return nextTick() - }, - updatePlacement () { - return nextTick().then(() => { - const { tipTarget } = reactData - const el = refElem.value - if (tipTarget && el) { - updateTipStyle() - return nextTick().then(updateTipStyle) - } - }) - }, - isActived () { - return reactData.tipActive - }, - setActived (actived) { - reactData.tipActive = !!actived - } - } - - Object.assign($xetooltip, tooltipMethods) - - watch(() => props.content, () => { - reactData.tipContent = props.content - }) - - watch(() => props.modelValue, () => { - if (!reactData.isUpdate) { - if (props.modelValue) { - tooltipMethods.open() - } else { - tooltipMethods.close() - } - } - reactData.isUpdate = false - }) - - onMounted(() => { - nextTick(() => { - const { trigger, content, modelValue } = props - const wrapperElem = refElem.value - if (wrapperElem) { - const parentNode = wrapperElem.parentNode - if (parentNode) { - reactData.tipContent = content - reactData.tipZindex = nextZIndex() - XEUtils.arrayEach(wrapperElem.children, (elem, index) => { - if (index > 1) { - parentNode.insertBefore(elem, wrapperElem) - if (!reactData.target) { - reactData.target = elem as HTMLElement - } - } - }) - parentNode.removeChild(wrapperElem) - const { target } = reactData - if (target) { - if (trigger === 'hover') { - target.onmouseenter = targetMouseenterEvent - target.onmouseleave = targetMouseleaveEvent - } else if (trigger === 'click') { - target.onclick = clickEvent - } - } - if (modelValue) { - tooltipMethods.open() - } - } - } - }) - }) - - onBeforeUnmount(() => { - const { trigger } = props - const { target } = reactData - const wrapperElem = refElem.value - if (target) { - if (trigger === 'hover') { - target.onmouseenter = null - target.onmouseleave = null - } else if (trigger === 'click') { - target.onclick = null - } - } - if (wrapperElem) { - const parentNode = wrapperElem.parentNode - if (parentNode) { - parentNode.removeChild(wrapperElem) - } - } - }) - - const renderContent = () => { - const { useHTML } = props - const { tipContent } = reactData - const contentSlot = slots.content - if (contentSlot) { - return h('div', { - key: 1, - class: 'vxe-table--tooltip-content' - }, getSlotVNs(contentSlot({}))) - } - if (useHTML) { - return h('div', { - key: 2, - class: 'vxe-table--tooltip-content', - innerHTML: tipContent - }) - } - return h('div', { - key: 3, - class: 'vxe-table--tooltip-content' - }, formatText(tipContent)) - } - - const renderVN = () => { - const { popupClassName, theme, isArrow, enterable } = props - const { tipActive, visible, tipStore } = reactData - const defaultSlot = slots.default - const vSize = computeSize.value - let ons - if (enterable) { - ons = { - onMouseenter: wrapperMouseenterEvent, - onMouseleave: wrapperMouseleaveEvent - } - } - return h('div', { - ref: refElem, - class: ['vxe-table--tooltip-wrapper', `theme--${theme}`, popupClassName ? (XEUtils.isFunction(popupClassName) ? popupClassName({ $tooltip: $xetooltip }) : popupClassName) : '', { - [`size--${vSize}`]: vSize, - [`placement--${tipStore.placement}`]: tipStore.placement, - 'is--enterable': enterable, - 'is--visible': visible, - 'is--arrow': isArrow, - 'is--active': tipActive - }], - style: tipStore.style, - ...ons - }, [ - renderContent(), - h('div', { - class: 'vxe-table--tooltip-arrow', - style: tipStore.arrowStyle - }), - ...(defaultSlot ? getSlotVNs(defaultSlot({})) : []) - ]) - } - - $xetooltip.renderVN = renderVN - - return $xetooltip - }, - render () { - return this.renderVN() - } -}) diff --git a/packages/ui/index.d.ts b/packages/ui/index.d.ts deleted file mode 100644 index a1ea5eccdb..0000000000 --- a/packages/ui/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import VxeUI from '../v-x-e-table' - -export * from '../v-x-e-table' -export default VxeUI diff --git a/packages/ui/index.ts b/packages/ui/index.ts index a1ea5eccdb..e2344ca36a 100644 --- a/packages/ui/index.ts +++ b/packages/ui/index.ts @@ -1,4 +1,300 @@ -import VxeUI from '../v-x-e-table' +import { VxeUI } from 'vxe-pc-ui' + +VxeUI.version = process.env.VUE_APP_VXE_VERSION as string +VxeUI.tableVersion = process.env.VUE_APP_VXE_VERSION as string + +VxeUI.setConfig({ + emptyCell: '　', + + table: { + fit: true, + showHeader: true, + animat: true, + delayHover: 250, + autoResize: true, + minHeight: 144, + // keepSource: false, + // showOverflow: null, + // showHeaderOverflow: null, + // showFooterOverflow: null, + // resizeInterval: 500, + // size: null, + // zIndex: null, + // stripe: false, + // border: false, + // round: false, + // emptyText: '暂无数据', + // emptyRender: { + // name: '' + // }, + // rowConfig: { + // keyField: '_X_ROW_KEY' // 行数据的唯一主键字段名 + // }, + resizeConfig: { + refreshDelay: 250 + }, + radioConfig: { + // trigger: 'default' + strict: true + }, + checkboxConfig: { + // trigger: 'default', + strict: true + }, + tooltipConfig: { + enterable: true + }, + validConfig: { + showMessage: true, + autoClear: true, + autoPos: true, + message: 'inline', + msgMode: 'single' + }, + columnConfig: { + maxFixedSize: 4 + }, + // menuConfig: { + // visibleMethod () {} + // }, + customConfig: { + allowVisible: true, + allowResizable: true, + allowFixed: true, + allowSort: true, + showFooter: true, + placement: 'top-right' + // storage: false, + // checkMethod () {} + }, + sortConfig: { + // remote: false, + // trigger: 'default', + // orders: ['asc', 'desc', null], + // sortMethod: null, + showIcon: true, + iconLayout: 'vertical' + }, + filterConfig: { + // remote: false, + // filterMethod: null, + showIcon: true + }, + treeConfig: { + rowField: 'id', + parentField: 'parentId', + childrenField: 'children', + hasChildField: 'hasChild', + mapChildrenField: '_X_ROW_CHILD', + indent: 20, + showIcon: true + }, + expandConfig: { + // trigger: 'default', + showIcon: true + }, + editConfig: { + // mode: 'cell', + showIcon: true, + showAsterisk: true + }, + importConfig: { + _typeMaps: { + csv: 1, + html: 1, + xml: 1, + txt: 1 + }, + modes: ['insert', 'covering'] + }, + exportConfig: { + _typeMaps: { + csv: 1, + html: 1, + xml: 1, + txt: 1 + }, + modes: ['current', 'selected'] + }, + printConfig: { + modes: ['current', 'selected'] + }, + mouseConfig: { + extension: true + }, + keyboardConfig: { + isEsc: true + }, + areaConfig: { + autoClear: true, + selectCellByHeader: true + }, + clipConfig: { + isCopy: true, + isCut: true, + isPaste: true + }, + fnrConfig: { + isFind: true, + isReplace: true + }, + scrollX: { + // enabled: false, + gt: 60 + // oSize: 0 + }, + scrollY: { + // enabled: false, + gt: 100 + // oSize: 0 + } + }, + // export: { + // types: {} + // }, + grid: { + // size: null, + // zoomConfig: { + // escRestore: true + // }, + formConfig: { + enabled: true + }, + pagerConfig: { + enabled: true + // perfect: false + }, + toolbarConfig: { + enabled: true + // perfect: false + }, + proxyConfig: { + enabled: true, + autoLoad: true, + message: true, + props: { + list: null, + result: 'result', + total: 'page.total', + message: 'message' + } + // beforeItem: null, + // beforeColumn: null, + // beforeQuery: null, + // afterQuery: null, + // beforeDelete: null, + // afterDelete: null, + // beforeSave: null, + // afterSave: null + } + }, + toolbar: { + // size: null, + // import: { + // mode: 'covering' + // }, + // export: { + // types: ['csv', 'html', 'xml', 'txt'] + // }, + // buttons: [] + } +}) + +const iconPrefix = 'vxe-icon-' + +VxeUI.setIcon({ + // table + TABLE_SORT_ASC: iconPrefix + 'caret-up', + TABLE_SORT_DESC: iconPrefix + 'caret-down', + TABLE_FILTER_NONE: iconPrefix + 'funnel', + TABLE_FILTER_MATCH: iconPrefix + 'funnel', + TABLE_EDIT: iconPrefix + 'edit', + TABLE_TITLE_PREFIX: iconPrefix + 'question-circle-fill', + TABLE_TITLE_SUFFIX: iconPrefix + 'question-circle-fill', + TABLE_TREE_LOADED: iconPrefix + 'spinner roll', + TABLE_TREE_OPEN: iconPrefix + 'caret-right rotate90', + TABLE_TREE_CLOSE: iconPrefix + 'caret-right', + TABLE_EXPAND_LOADED: iconPrefix + 'spinner roll', + TABLE_EXPAND_OPEN: iconPrefix + 'arrow-right rotate90', + TABLE_EXPAND_CLOSE: iconPrefix + 'arrow-right', + TABLE_CHECKBOX_CHECKED: iconPrefix + 'checkbox-checked-fill', + TABLE_CHECKBOX_UNCHECKED: iconPrefix + 'checkbox-unchecked', + TABLE_CHECKBOX_INDETERMINATE: iconPrefix + 'checkbox-indeterminate-fill', + TABLE_RADIO_CHECKED: iconPrefix + 'radio-checked-fill', + TABLE_RADIO_UNCHECKED: iconPrefix + 'radio-unchecked', + TABLE_CUSTOM_SORT: iconPrefix + 'drag-handle', + + // toolbar + TOOLBAR_TOOLS_REFRESH: iconPrefix + 'repeat', + TOOLBAR_TOOLS_REFRESH_LOADING: iconPrefix + 'repeat roll', + TOOLBAR_TOOLS_IMPORT: iconPrefix + 'upload', + TOOLBAR_TOOLS_EXPORT: iconPrefix + 'download', + TOOLBAR_TOOLS_PRINT: iconPrefix + 'print', + TOOLBAR_TOOLS_FULLSCREEN: iconPrefix + 'fullscreen', + TOOLBAR_TOOLS_MINIMIZE: iconPrefix + 'minimize', + TOOLBAR_TOOLS_CUSTOM: iconPrefix + 'custom-column', + TOOLBAR_TOOLS_FIXED_LEFT: iconPrefix + 'fixed-left', + TOOLBAR_TOOLS_FIXED_LEFT_ACTIVE: iconPrefix + 'fixed-left-fill', + TOOLBAR_TOOLS_FIXED_RIGHT: iconPrefix + 'fixed-right', + TOOLBAR_TOOLS_FIXED_RIGHT_ACTIVE: iconPrefix + 'fixed-right-fill' +}) + +export const setTheme = VxeUI.setTheme +export const getTheme = VxeUI.getTheme +export const setConfig = VxeUI.setConfig +export const getConfig = VxeUI.getConfig +export const setIcon = VxeUI.setIcon +export const getIcon = VxeUI.getIcon +export const setLanguage = VxeUI.setLanguage +export const setI18n = VxeUI.setI18n +export const getI18n = VxeUI.getI18n + +export const globalEvents = VxeUI.globalEvents +export const globalResize = VxeUI.globalResize +export const renderer = VxeUI.renderer +export const validators = VxeUI.validators +export const menus = VxeUI.menus +export const formats = VxeUI.formats +export const commands = VxeUI.commands +export const interceptor = VxeUI.interceptor +export const clipboard = VxeUI.clipboard +export const log = VxeUI.log + +export const hooks = VxeUI.hooks +export const use = VxeUI.use + +/** + * 已废弃 + * @deprecated + */ +export const setup = VxeUI.setup +/** + * 已废弃 + * @deprecated + */ +export const config = VxeUI.config +/** + * 已废弃 + * @deprecated + */ +export const t = VxeUI.t +/** + * 已废弃 + * @deprecated + */ +export const _t = VxeUI._t + +/** + * 已废弃，兼容老版本 + * @deprecated + */ +export const VXETable = VxeUI + +export const saveFile = VxeUI.readFile +export const readFile = VxeUI.readFile + +export { + VxeUI +} -export * from '../v-x-e-table' export default VxeUI diff --git a/packages/tools/dom.ts b/packages/ui/src/dom.ts similarity index 100% rename from packages/tools/dom.ts rename to packages/ui/src/dom.ts diff --git a/packages/ui/src/log.ts b/packages/ui/src/log.ts new file mode 100644 index 0000000000..88f7aaa225 --- /dev/null +++ b/packages/ui/src/log.ts @@ -0,0 +1,8 @@ +import { VxeUI } from 'vxe-pc-ui' + +const { log } = VxeUI + +const version = `table v${process.env.VUE_APP_VXE_VERSION}` + +export const warnLog = log.create('warn', version) +export const errLog = log.create('error', version) diff --git a/packages/tools/utils.ts b/packages/ui/src/utils.ts similarity index 79% rename from packages/tools/utils.ts rename to packages/ui/src/utils.ts index f477acf5f0..c1329a5a6c 100644 --- a/packages/tools/utils.ts +++ b/packages/ui/src/utils.ts @@ -1,5 +1,5 @@ import XEUtils from 'xe-utils' -import GlobalConfig from '../v-x-e-table/src/conf' +import { VxeUI } from 'vxe-pc-ui' import DomZIndex from 'dom-zindex' export function isEnableConf (conf: any): boolean { @@ -31,11 +31,15 @@ export function hasChildrenList (item: any) { } export function getFuncText (content?: string | number | boolean | null) { - return content ? XEUtils.toValueString(GlobalConfig.translate ? GlobalConfig.translate('' + content) : content) : '' + if (content) { + const translate = VxeUI.getConfig().translate + return XEUtils.toValueString(translate ? translate('' + content) : content) + } + return '' } export function formatText (value: any, placeholder?: any) { - return '' + (isEmptyValue(value) ? (placeholder ? GlobalConfig.emptyCell : '') : value) + return '' + (isEmptyValue(value) ? (placeholder ? VxeUI.getConfig().emptyCell : '') : value) } /** diff --git a/packages/tools/vn.ts b/packages/ui/src/vn.ts similarity index 60% rename from packages/tools/vn.ts rename to packages/ui/src/vn.ts index 2c460e65e4..41bf47464d 100644 --- a/packages/tools/vn.ts +++ b/packages/ui/src/vn.ts @@ -1,11 +1,12 @@ import XEUtils from 'xe-utils' -import { SlotVNodeType } from '../../types/all' + +import type { VxeComponentSlotType } from '../../../types' export function getOnName (type: string) { return 'on' + type.substring(0, 1).toLocaleUpperCase() + type.substring(1) } -export function getSlotVNs (vns: SlotVNodeType | SlotVNodeType[]) { +export function getSlotVNs (vns: VxeComponentSlotType | VxeComponentSlotType[]) { if (XEUtils.isArray(vns)) { return vns } diff --git a/packages/v-x-e-table/index.d.ts b/packages/v-x-e-table/index.d.ts index 8f5e965006..d041241042 100644 --- a/packages/v-x-e-table/index.d.ts +++ b/packages/v-x-e-table/index.d.ts @@ -1,4 +1,4 @@ -import { VXETable } from '../../types/v-x-e-table' +import VxeUI from '../ui' -export * from '../../types/v-x-e-table' -export default VXETable +export * from '../ui' +export default VxeUI diff --git a/packages/v-x-e-table/index.ts b/packages/v-x-e-table/index.ts index 8cd40b3026..d041241042 100644 --- a/packages/v-x-e-table/index.ts +++ b/packages/v-x-e-table/index.ts @@ -1,167 +1,4 @@ -import XEUtils from 'xe-utils' -import GlobalConfig from './src/conf' -import DomZIndex from 'dom-zindex' -import { interceptor } from './src/interceptor' -import { renderer } from './src/renderer' -import { commands } from './src/commands' -import { menus } from './src/menus' -import { formats } from './src/formats' -import { validators } from './src/validators' -import { hooks } from './src/hooks' -import { setTheme } from './src/theme' -import { getLastZIndex, nextZIndex } from '../tools/utils' -import { warnLog } from '../tools/log' +import VxeUI from '../ui' -import { VXETableCore, VxeGlobalConfigMethod, VXETableSetupOptions } from '../../types/all' - -function getExportOrImpotType (types: any, flag: number) { - const rest: string[] = [] - XEUtils.objectEach(types, (val, type) => { - if (val === 0 || val === flag) { - rest.push(type) - } - }) - return rest -} - -const installedPlugins: any[] = [] - -export function use (Plugin: any, options?: any) { - /* eslint-disable @typescript-eslint/no-use-before-define */ - if (Plugin && Plugin.install) { - if (installedPlugins.indexOf(Plugin) === -1) { - Plugin.install(VXETable, options) - installedPlugins.push(Plugin) - } - } - return VXETable -} - -export function t (key: any, args?: any) { - return GlobalConfig.i18n(key, args) -} - -export function _t (key: string, args?: any) { - return key ? XEUtils.toValueString(GlobalConfig.translate ? GlobalConfig.translate(key, args) : key) : '' -} - -/** - * 全局参数设置 - */ -export const setConfig: VxeGlobalConfigMethod = (options) => { - if (options) { - if (options.theme) { - setTheme(options) - } - if (options.zIndex) { - DomZIndex.setCurrent(options.zIndex) - } - XEUtils.merge(GlobalConfig, options) - } - return VXETable -} - -class VXETableConfig { - /** - * 获取当前的 zIndex - */ - get zIndex () { - return getLastZIndex() - } - - /** - * 获取下一个 zIndex - */ - get nextZIndex () { - return nextZIndex() - } - - /** - * 获取所有导出类型 - */ - get exportTypes () { - return getExportOrImpotType(GlobalConfig.export.types, 1) - } - - /** - * 获取所有导入类型 - */ - get importTypes () { - return getExportOrImpotType(GlobalConfig.export.types, 2) - } -} - -// 已废弃 -export const globalConfs = new VXETableConfig() - -export const v = 'v4' - -/** - * 已废弃，请使用 setConfig - * @deprecated - */ -export const setup: VXETableSetupOptions = (options) => { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - warnLog('vxe.error.delFunc', ['setup', 'setConfig']) - } - setConfig(options) - return GlobalConfig -} - -/** - * 已废弃，请使用 setConfig - * @deprecated - */ -export const config: VXETableSetupOptions = (options) => { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - warnLog('vxe.error.delFunc', ['setup', 'setConfig']) - } - setConfig(options) - return GlobalConfig -} - -export function setIcon (options?: any) { - if (options) { - Object.assign(GlobalConfig.icon, options) - } - return VXETable -} - -export const globalStore = {} - -export const VXETable = { - v, - version: process.env.VUE_APP_VXE_TABLE_VERSION, - setConfig, - setIcon, - globalStore, - interceptor, - renderer, - commands, - formats, - validators, - menus, - hooks, - use, - t, - _t, - - // 已废弃 - config, - setup, - globalConfs -} as VXETableCore - -export const VxeUI = VXETable - -setTheme(globalStore) - -export * from './src/interceptor' -export * from './src/renderer' -export * from './src/commands' -export * from './src/menus' -export * from './src/formats' -export * from './src/validators' -export * from './src/hooks' - -export default VXETable +export * from '../ui' +export default VxeUI diff --git a/packages/v-x-e-table/src/commands.ts b/packages/v-x-e-table/src/commands.ts deleted file mode 100644 index 9840f9bed7..0000000000 --- a/packages/v-x-e-table/src/commands.ts +++ /dev/null @@ -1,62 +0,0 @@ -import XEUtils from 'xe-utils' -import { warnLog } from '../../tools/log' - -import { VxeGlobalCommands } from '../../../types/v-x-e-table' - -class VXECommandsStore { - private store: any = {} - - mixin (options: any): VXECommandsStore { - XEUtils.each(options, (item, key) => { - this.add(key, item) - }) - return this - } - - has (name: string): boolean { - return !!this.get(name) - } - - get (name: string): any { - return this.store[name] - } - - add (name: string, render: any): VXECommandsStore { - const conf = this.store[name] - // 兼容 - if (XEUtils.isFunction(render)) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - warnLog('vxe.error.delProp', ['commands -> callback', 'commandMethod']) - } - render = { - commandMethod: render - } - } - - // 检测是否覆盖 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - const confKeys = XEUtils.keys(conf) - XEUtils.each(render, (item, key) => { - if (confKeys.includes(key)) { - warnLog('vxe.error.coverProp', [name, key]) - } - }) - } - this.store[name] = conf ? XEUtils.merge(conf, render) : render - return this - } - - delete (name: string): void { - delete this.store[name] - } - - forEach (callback: any): void { - XEUtils.objectEach(this.store, callback) - } -} - -export const commands = new VXECommandsStore() as VxeGlobalCommands - -if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - Object.assign(commands, { _name: 'Commands' }) -} diff --git a/packages/v-x-e-table/src/conf.ts b/packages/v-x-e-table/src/conf.ts deleted file mode 100644 index 1f77500645..0000000000 --- a/packages/v-x-e-table/src/conf.ts +++ /dev/null @@ -1,394 +0,0 @@ -import { VXETableConfigOptions } from '../../../types/all' - -const iconPrefix = 'vxe-icon-' - -const GlobalConfig: VXETableConfigOptions = { - size: null, // 全局尺寸 - zIndex: 999, // 全局 zIndex 起始值，如果项目的的 z-index 样式值过大时就需要跟随设置更大，避免被遮挡 - version: 0, // 版本号，对于某些带数据缓存的功能有用到，上升版本号可以用于重置数据 - // resizeInterval: 500, - emptyCell: '　', - // loadingText: null, // 自定义loading提示内容，如果为null则不显示文本 - table: { - fit: true, - showHeader: true, - animat: true, - delayHover: 250, - autoResize: true, - minHeight: 144, - // keepSource: false, - // showOverflow: null, - // showHeaderOverflow: null, - // showFooterOverflow: null, - // resizeInterval: 500, - // size: null, - // zIndex: null, - // stripe: false, - // border: false, - // round: false, - // emptyText: '暂无数据', - // emptyRender: { - // name: '' - // }, - // rowConfig: { - // keyField: '_X_ROW_KEY' // 行数据的唯一主键字段名 - // }, - resizeConfig: { - refreshDelay: 250 - }, - radioConfig: { - // trigger: 'default' - strict: true - }, - checkboxConfig: { - // trigger: 'default', - strict: true - }, - tooltipConfig: { - enterable: true - }, - validConfig: { - showMessage: true, - autoClear: true, - autoPos: true, - message: 'inline', - msgMode: 'single' - }, - columnConfig: { - maxFixedSize: 4 - }, - // menuConfig: { - // visibleMethod () {} - // }, - customConfig: { - allowFixed: true, - showFooter: true - // storage: false, - // checkMethod () {} - }, - sortConfig: { - // remote: false, - // trigger: 'default', - // orders: ['asc', 'desc', null], - // sortMethod: null, - showIcon: true, - iconLayout: 'vertical' - }, - filterConfig: { - // remote: false, - // filterMethod: null, - showIcon: true - }, - treeConfig: { - rowField: 'id', - parentField: 'parentId', - childrenField: 'children', - hasChildField: 'hasChild', - mapChildrenField: '_X_ROW_CHILD', - indent: 20, - showIcon: true - }, - expandConfig: { - // trigger: 'default', - showIcon: true - }, - editConfig: { - // mode: 'cell', - showIcon: true, - showAsterisk: true - }, - importConfig: { - modes: ['insert', 'covering'] - }, - exportConfig: { - modes: ['current', 'selected'] - }, - printConfig: { - modes: ['current', 'selected'] - }, - mouseConfig: { - extension: true - }, - keyboardConfig: { - isEsc: true - }, - areaConfig: { - autoClear: true, - selectCellByHeader: true - }, - clipConfig: { - isCopy: true, - isCut: true, - isPaste: true - }, - fnrConfig: { - isFind: true, - isReplace: true - }, - scrollX: { - // enabled: false, - gt: 60 - // oSize: 0 - }, - scrollY: { - // enabled: false, - gt: 100 - // oSize: 0 - } - }, - export: { - types: {} - }, - grid: { - // size: null, - // zoomConfig: { - // escRestore: true - // }, - formConfig: { - enabled: true - }, - pagerConfig: { - enabled: true - // perfect: false - }, - toolbarConfig: { - enabled: true - // perfect: false - }, - proxyConfig: { - enabled: true, - autoLoad: true, - message: true, - props: { - list: null, - result: 'result', - total: 'page.total', - message: 'message' - } - // beforeItem: null, - // beforeColumn: null, - // beforeQuery: null, - // afterQuery: null, - // beforeDelete: null, - // afterDelete: null, - // beforeSave: null, - // afterSave: null - } - }, - toolbar: { - // size: null, - // import: { - // mode: 'covering' - // }, - // export: { - // types: ['csv', 'html', 'xml', 'txt'] - // }, - // buttons: [] - }, - - icon: { - // loading - LOADING: iconPrefix + 'spinner roll vxe-loading--default-icon', - - // table - TABLE_SORT_ASC: iconPrefix + 'caret-up', - TABLE_SORT_DESC: iconPrefix + 'caret-down', - TABLE_FILTER_NONE: iconPrefix + 'funnel', - TABLE_FILTER_MATCH: iconPrefix + 'funnel', - TABLE_EDIT: iconPrefix + 'edit', - TABLE_TITLE_PREFIX: iconPrefix + 'question-circle-fill', - TABLE_TITLE_SUFFIX: iconPrefix + 'question-circle-fill', - TABLE_TREE_LOADED: iconPrefix + 'spinner roll', - TABLE_TREE_OPEN: iconPrefix + 'caret-right rotate90', - TABLE_TREE_CLOSE: iconPrefix + 'caret-right', - TABLE_EXPAND_LOADED: iconPrefix + 'spinner roll', - TABLE_EXPAND_OPEN: iconPrefix + 'arrow-right rotate90', - TABLE_EXPAND_CLOSE: iconPrefix + 'arrow-right', - TABLE_CHECKBOX_CHECKED: iconPrefix + 'checkbox-checked', - TABLE_CHECKBOX_UNCHECKED: iconPrefix + 'checkbox-unchecked', - TABLE_CHECKBOX_INDETERMINATE: iconPrefix + 'checkbox-indeterminate', - TABLE_RADIO_CHECKED: iconPrefix + 'radio-checked', - TABLE_RADIO_UNCHECKED: iconPrefix + 'radio-unchecked', - - // button - BUTTON_DROPDOWN: iconPrefix + 'arrow-down', - BUTTON_LOADING: iconPrefix + 'spinner roll', - - // select - SELECT_LOADED: iconPrefix + 'spinner roll', - SELECT_OPEN: iconPrefix + 'caret-down rotate180', - SELECT_CLOSE: iconPrefix + 'caret-down', - - // pager - PAGER_HOME: iconPrefix + 'home-page', - PAGER_END: iconPrefix + 'end-page', - PAGER_JUMP_PREV: iconPrefix + 'arrow-double-left', - PAGER_JUMP_NEXT: iconPrefix + 'arrow-double-right', - PAGER_PREV_PAGE: iconPrefix + 'arrow-left', - PAGER_NEXT_PAGE: iconPrefix + 'arrow-right', - PAGER_JUMP_MORE: iconPrefix + 'ellipsis-h', - - // input - INPUT_CLEAR: iconPrefix + 'error-circle-fill', - INPUT_PWD: iconPrefix + 'eye-fill', - INPUT_SHOW_PWD: iconPrefix + 'eye-fill-close', - INPUT_PREV_NUM: iconPrefix + 'caret-up', - INPUT_NEXT_NUM: iconPrefix + 'caret-down', - INPUT_DATE: iconPrefix + 'calendar', - INPUT_SEARCH: iconPrefix + 'search', - - // modal - MODAL_ZOOM_IN: iconPrefix + 'square', - MODAL_ZOOM_OUT: iconPrefix + 'maximize', - MODAL_CLOSE: iconPrefix + 'close', - MODAL_INFO: iconPrefix + 'info-circle-fill', - MODAL_SUCCESS: iconPrefix + 'success-circle-fill', - MODAL_WARNING: iconPrefix + 'warnion-circle-fill', - MODAL_ERROR: iconPrefix + 'error-circle-fill', - MODAL_QUESTION: iconPrefix + 'question-circle-fill', - MODAL_LOADING: iconPrefix + 'spinner roll', - - // toolbar - TOOLBAR_TOOLS_REFRESH: iconPrefix + 'repeat', - TOOLBAR_TOOLS_REFRESH_LOADING: iconPrefix + 'repeat roll', - TOOLBAR_TOOLS_IMPORT: iconPrefix + 'upload', - TOOLBAR_TOOLS_EXPORT: iconPrefix + 'download', - TOOLBAR_TOOLS_PRINT: iconPrefix + 'print', - TOOLBAR_TOOLS_FULLSCREEN: iconPrefix + 'fullscreen', - TOOLBAR_TOOLS_MINIMIZE: iconPrefix + 'minimize', - TOOLBAR_TOOLS_CUSTOM: iconPrefix + 'custom-column', - TOOLBAR_TOOLS_FIXED_LEFT: iconPrefix + 'fixed-left', - TOOLBAR_TOOLS_FIXED_LEFT_ACTIVED: iconPrefix + 'fixed-left-fill', - TOOLBAR_TOOLS_FIXED_RIGHT: iconPrefix + 'fixed-right', - TOOLBAR_TOOLS_FIXED_RIGHT_ACTIVED: iconPrefix + 'fixed-right-fill', - - // form - FORM_PREFIX: iconPrefix + 'question-circle-fill', - FORM_SUFFIX: iconPrefix + 'question-circle-fill', - FORM_FOLDING: iconPrefix + 'arrow-up rotate180', - FORM_UNFOLDING: iconPrefix + 'arrow-up' - }, - tooltip: { - // size: null, - trigger: 'hover', - theme: 'dark', - enterDelay: 500, - leaveDelay: 300 - }, - pager: { - // size: null, - // autoHidden: false, - // perfect: true, - // pageSize: 10, - // pagerCount: 7, - // pageSizes: [10, 15, 20, 50, 100], - // layouts: ['PrevJump', 'PrevPage', 'Jump', 'PageCount', 'NextPage', 'NextJump', 'Sizes', 'Total'] - }, - form: { - // preventSubmit: false, - // size: null, - // colon: false, - validConfig: { - showMessage: true, - autoPos: true - }, - tooltipConfig: { - enterable: true - }, - titleAsterisk: true - }, - input: { - // size: null, - // transfer: false - // parseFormat: 'yyyy-MM-dd HH:mm:ss.SSS', - // labelFormat: '', - // valueFormat: '', - startDate: new Date(1900, 0, 1), - endDate: new Date(2100, 0, 1), - startDay: 1, - selectDay: 1, - digits: 2, - controls: true - }, - textarea: { - // size: null, - // autosize: { - // minRows: 1, - // maxRows: 10 - // } - }, - select: { - // size: null, - // transfer: false, - // optionConfig: { - // keyField: '_X_OPTION_KEY' - // }, - multiCharOverflow: 8 - }, - button: { - // size: null, - // transfer: false - }, - buttonGroup: { - // size: null - }, - radio: { - // size: null, - strict: true - }, - radioButton: { - // size: null, - strict: true - }, - radioGroup: { - // size: null, - strict: true - }, - checkbox: { - // size: null - }, - checkboxGroup: { - // size: null - }, - switch: { - // size: null - }, - modal: { - // size: null, - top: 15, - showHeader: true, - minWidth: 340, - minHeight: 140, - lockView: true, - mask: true, - duration: 3000, - marginSize: 0, - dblclickZoom: true, - showTitleOverflow: true, - animat: true, - showClose: true, - draggable: true, - showConfirmButton: null, - // storage: false, - storageKey: 'VXE_MODAL_POSITION' - }, - drawer: { - // size: null, - showHeader: true, - lockView: true, - mask: true, - showTitleOverflow: true, - showClose: true - }, - list: { - // size: null, - scrollY: { - enabled: true, - gt: 100 - // oSize: 0 - } - }, - i18n: (key: string) => key -} - -export default GlobalConfig as Required diff --git a/packages/v-x-e-table/src/formats.ts b/packages/v-x-e-table/src/formats.ts deleted file mode 100644 index ef90557e4a..0000000000 --- a/packages/v-x-e-table/src/formats.ts +++ /dev/null @@ -1,62 +0,0 @@ -import XEUtils from 'xe-utils' -import { warnLog } from '../../tools/log' - -import { VxeGlobalFormats } from '../../../types/v-x-e-table' - -class VXEFormatsStore { - private store: any = {} - - mixin (options: any): VXEFormatsStore { - XEUtils.each(options, (item, key) => { - this.add(key, item) - }) - return this - } - - has (name: string): boolean { - return !!this.get(name) - } - - get (name: string): any { - return this.store[name] - } - - add (name: string, render: any): VXEFormatsStore { - const conf = this.store[name] - // 兼容 - if (XEUtils.isFunction(render)) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - warnLog('vxe.error.delProp', ['formats -> callback', 'cellFormatMethod']) - } - render = { - cellFormatMethod: render - } - } - - // 检测是否覆盖 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - const confKeys = XEUtils.keys(conf) - XEUtils.each(render, (item, key) => { - if (confKeys.includes(key)) { - warnLog('vxe.error.coverProp', [name, key]) - } - }) - } - this.store[name] = conf ? XEUtils.merge(conf, render) : render - return this - } - - delete (name: string): void { - delete this.store[name] - } - - forEach (callback: any): void { - XEUtils.objectEach(this.store, callback) - } -} - -export const formats = new VXEFormatsStore() as VxeGlobalFormats - -if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - Object.assign(formats, { _name: 'Formats' }) -} diff --git a/packages/v-x-e-table/src/hooks.ts b/packages/v-x-e-table/src/hooks.ts deleted file mode 100644 index 9832461b5b..0000000000 --- a/packages/v-x-e-table/src/hooks.ts +++ /dev/null @@ -1,5 +0,0 @@ -import VXEStore from './store' - -import { VxeGlobalHooks } from '../../../types/v-x-e-table' - -export const hooks = new VXEStore() as VxeGlobalHooks diff --git a/packages/v-x-e-table/src/interceptor.ts b/packages/v-x-e-table/src/interceptor.ts deleted file mode 100644 index 79867e6737..0000000000 --- a/packages/v-x-e-table/src/interceptor.ts +++ /dev/null @@ -1,52 +0,0 @@ -import XEUtils from 'xe-utils' -import { warnLog } from '../../tools/log' - -import { VxeGlobalInterceptor, VxeGlobalInterceptorHandles } from '../../../types/v-x-e-table' - -const storeMap: { [type: string]: VxeGlobalInterceptorHandles.InterceptorCallback[] } = {} - -export const interceptor: VxeGlobalInterceptor = { - mixin (options) { - XEUtils.each(options, (callback: VxeGlobalInterceptorHandles.InterceptorCallback, type) => interceptor.add(type as VxeGlobalInterceptorHandles.Type, callback)) - return interceptor - }, - get (type) { - return storeMap[type] || [] - }, - add (type, callback) { - // 检测类型 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - const eventTypes: VxeGlobalInterceptorHandles.Type[] = ['created', 'mounted', 'activated', 'beforeUnmount', 'unmounted', 'event.clearEdit', 'event.clearActived', 'event.clearFilter', 'event.clearAreas', 'event.showMenu', 'event.keydown', 'event.export', 'event.import'] - if (eventTypes.indexOf(type) === -1) { - warnLog('vxe.error.errProp', [`Interceptor.${type}`, eventTypes.join('|')]) - } - } - - if (callback) { - let eList = storeMap[type] - if (!eList) { - eList = storeMap[type] = [] - } - - // 检测重复 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - if (eList.indexOf(callback) > -1) { - warnLog('vxe.error.coverProp', ['Interceptor', type]) - } - } - - eList.push(callback) - } - return interceptor - }, - delete (type, callback) { - const eList = storeMap[type] - if (eList) { - if (callback) { - XEUtils.remove(eList, fn => fn === callback) - } else { - delete storeMap[type] - } - } - } -} diff --git a/packages/v-x-e-table/src/menus.ts b/packages/v-x-e-table/src/menus.ts deleted file mode 100644 index 31143b3f65..0000000000 --- a/packages/v-x-e-table/src/menus.ts +++ /dev/null @@ -1,62 +0,0 @@ -import XEUtils from 'xe-utils' -import { warnLog } from '../../tools/log' - -import { VxeGlobalMenus } from '../../../types/v-x-e-table' - -class VXEMenusStore { - private store: any = {} - - mixin (options: any): VXEMenusStore { - XEUtils.each(options, (item, key) => { - this.add(key, item) - }) - return this - } - - has (name: string): boolean { - return !!this.get(name) - } - - get (name: string): any { - return this.store[name] - } - - add (name: string, render: any): VXEMenusStore { - const conf = this.store[name] - // 兼容 - if (XEUtils.isFunction(render)) { - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - warnLog('vxe.error.delProp', ['menus -> callback', 'menuMethod']) - } - render = { - menuMethod: render - } - } - - // 检测是否覆盖 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - const confKeys = XEUtils.keys(conf) - XEUtils.each(render, (item, key) => { - if (confKeys.includes(key)) { - warnLog('vxe.error.coverProp', [name, key]) - } - }) - } - this.store[name] = conf ? XEUtils.merge(conf, render) : render - return this - } - - delete (name: string): void { - delete this.store[name] - } - - forEach (callback: any): void { - XEUtils.objectEach(this.store, callback) - } -} - -export const menus = new VXEMenusStore() as VxeGlobalMenus - -if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - Object.assign(menus, { _name: 'Menus' }) -} diff --git a/packages/v-x-e-table/src/store.ts b/packages/v-x-e-table/src/store.ts deleted file mode 100644 index 9b5e84ff24..0000000000 --- a/packages/v-x-e-table/src/store.ts +++ /dev/null @@ -1,49 +0,0 @@ -import { warnLog } from '../../tools/log' -import XEUtils from 'xe-utils' - -/** - * 创建数据仓库 - */ -export class Store { - private store: any = {} - - mixin (options: any): Store { - XEUtils.each(options, (item, key) => { - this.add(key, item) - }) - return this - } - - has (name: string): boolean { - return !!this.get(name) - } - - get (name: string): any { - return this.store[name] - } - - add (name: string, options: any): Store { - const conf = this.store[name] - // 检测是否覆盖 - if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - const confKeys = XEUtils.keys(conf) - XEUtils.each(options, (item, key) => { - if (confKeys.includes(key)) { - warnLog('vxe.error.coverProp', [name, key]) - } - }) - } - this.store[name] = conf ? XEUtils.merge(conf, options) : options - return this - } - - delete (name: string): void { - delete this.store[name] - } - - forEach (callback: any): void { - XEUtils.objectEach(this.store, callback) - } -} - -export default Store diff --git a/packages/v-x-e-table/src/theme.ts b/packages/v-x-e-table/src/theme.ts deleted file mode 100644 index fee69b27ce..0000000000 --- a/packages/v-x-e-table/src/theme.ts +++ /dev/null @@ -1,11 +0,0 @@ -import GlobalConfig from './conf' - -export function setTheme (options: any) { - const theme = (options ? options.theme : null) || GlobalConfig.theme || 'default' - if (typeof document !== 'undefined') { - const documentElement = document.documentElement - if (documentElement) { - documentElement.setAttribute('data-vxe-table-theme', theme) - } - } -} diff --git a/packages/v-x-e-table/src/validators.ts b/packages/v-x-e-table/src/validators.ts deleted file mode 100644 index 4a3a733a36..0000000000 --- a/packages/v-x-e-table/src/validators.ts +++ /dev/null @@ -1,9 +0,0 @@ -import VXEStore from './store' - -import { VxeGlobalValidators } from '../../../types/v-x-e-table' - -export const validators = new VXEStore() as VxeGlobalValidators - -if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') { - Object.assign(validators, { _name: 'Validators' }) -} diff --git a/packages/validator/index.d.ts b/packages/validator/index.d.ts deleted file mode 100644 index 8704a1b1e4..0000000000 --- a/packages/validator/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -import { VxeTableValidatorModule } from '../../types/module/validator' - -export * from '../../types/module/validator' -export default VxeTableValidatorModule diff --git a/packages/validator/index.ts b/packages/validator/index.ts deleted file mode 100644 index 396e737882..0000000000 --- a/packages/validator/index.ts +++ /dev/null @@ -1,12 +0,0 @@ -import validatorHook from './src/hook' -import { VXETable } from '../v-x-e-table' - -export const VxeTableValidatorModule = { - install (): void { - VXETable.hooks.add('$tableValidator', validatorHook) - } -} - -export const Validator = VxeTableValidatorModule - -export default VxeTableValidatorModule diff --git a/styles/all.scss b/styles/all.scss index 6970aa558a..b6fcfb891a 100644 --- a/styles/all.scss +++ b/styles/all.scss @@ -1,34 +1,7 @@ -@import './variable.scss'; -@import './theme/default.scss'; -@import './theme/dark.scss'; +@import './base.scss'; -@import './filter.scss'; -@import './export.scss'; -@import './custom.scss'; - -@import './icon.scss'; -@import './table.scss'; -@import './grid.scss'; -@import './toolbar.scss'; -@import './pager.scss'; -@import './checkbox.scss'; -@import './checkbox-group.scss'; -@import './radio.scss'; -@import './radio-group.scss'; -@import './radio-button.scss'; -@import './input.scss'; -@import './textarea.scss'; -@import './button.scss'; -@import './button-group.scss'; -@import './modal.scss'; -@import './drawer.scss'; -@import './tooltip.scss'; -@import './form.scss'; -@import './form-item.scss'; -@import './form-gather.scss'; -@import './select.scss'; -@import './optgroup.scss'; -@import './option.scss'; -@import './switch.scss'; -@import './list.scss'; -@import './pulldown.scss'; +@import './components/column.scss'; +@import './components/colgroup.scss'; +@import './components/table.scss'; +@import './components/grid.scss'; +@import './components/toolbar.scss'; diff --git a/styles/base.scss b/styles/base.scss new file mode 100644 index 0000000000..f353f25ca8 --- /dev/null +++ b/styles/base.scss @@ -0,0 +1,16 @@ +@import './theme/light.scss'; +@import './theme/dark.scss'; + +%boxSizing { + box-sizing: border-box; +} + +[class*="vxe-"] { + font-variant: tabular-nums; + font-feature-settings: 'tnum'; + @extend %boxSizing; + &:after, &:before, + *:after, *:before { + @extend %boxSizing; + } +} diff --git a/styles/base/common.scss b/styles/base/common.scss deleted file mode 100644 index 9a0822d02c..0000000000 --- a/styles/base/common.scss +++ /dev/null @@ -1,88 +0,0 @@ -%boxSizing { - box-sizing: border-box; -} - -%TextEllipsis { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -[class*="vxe-"] { - font-variant: tabular-nums; - font-feature-settings: 'tnum'; - @extend %boxSizing; - &:after, &:before, - *:after, *:before { - @extend %boxSizing; - } -} - -.vxe-primary-color { - color: var(--vxe-primary-color); -} -.vxe-success-color { - color: var(--vxe-success-color); -} -.vxe-info-color { - color: var(--vxe-info-color); -} -.vxe-warning-color { - color: var(--vxe-warning-color); -} -.vxe-danger-color { - color: var(--vxe-danger-color); -} -.vxe-perfect-color { - color: var(--vxe-table-header-background-color); -} - -// 24 栅格布局 -.vxe-row { - $spans: 4.16667%, 8.33333%, 12.5%, 16.66667%, 20.83333%, 25%, 29.16667%, 33.33333%, - 37.5%, 41.66667%, 45.83333%, 50%, 54.16667%, 58.33333%, 62.5%, 66.66667%, - 70.83333%, 75%, 79.16667%, 83.33333%, 87.5%, 91.66667%, 95.83333%, 100%; - &:after { - content: ''; - display: block; - clear: both; - height: 0; - overflow: hidden; - visibility: hidden; - } - @for $index from 0 to length($spans) { - & > .vxe-col--#{$index + 1} { - float: left; - width: nth($spans, $index + 1); - } - } -} - -/*animat*/ -.is--animat { - .vxe-sort--asc-btn, - .vxe-sort--desc-btn, - .vxe-filter--btn { - &:before, - &:after { - @include createAnimationTransition(border); - } - } - .vxe-input--wrapper { - .vxe-input { - @include createAnimationTransition(border); - } - } - .vxe-table--expand-btn, - .vxe-tree--node-btn { - @include createAnimationTransition(transform); - } - .vxe-checkbox, - .vxe-radio { - > input { - &:checked+span { - @include createAnimationTransition(background-color); - } - } - } -} \ No newline at end of file diff --git a/styles/button-group.scss b/styles/button-group.scss deleted file mode 100644 index b56fa655b4..0000000000 --- a/styles/button-group.scss +++ /dev/null @@ -1,5 +0,0 @@ -/**Variable**/ - -.vxe-button-group { - display: inline-flex; -} \ No newline at end of file diff --git a/styles/button.scss b/styles/button.scss deleted file mode 100644 index 433a556d53..0000000000 --- a/styles/button.scss +++ /dev/null @@ -1,358 +0,0 @@ -/**Variable**/ -@import './helpers/mixin.scss'; - -$btnThemeList: ( - ( - name: "primary", - textColor: var(--vxe-primary-color), - btnColor: #fff, - btnLightenColor: var(--vxe-primary-lighten-color), - btnDarkenColor: var(--vxe-primary-darken-color), - btnDisabledColor: var(--vxe-primary-disabled-color) - ), - ( - name: "success", - textColor: var(--vxe-success-color), - btnColor: #fff, - btnLightenColor: var(--vxe-success-lighten-color), - btnDarkenColor: var(--vxe-success-darken-color), - btnDisabledColor: var(--vxe-success-disabled-color) - ), - ( - name: "info", - textColor: var(--vxe-info-color), - btnColor: #fff, - btnLightenColor: var(--vxe-info-lighten-color), - btnDarkenColor: var(--vxe-info-darken-color), - btnDisabledColor: var(--vxe-info-disabled-color) - ), - ( - name: "warning", - textColor: var(--vxe-warning-color), - btnColor: #fff, - btnLightenColor: var(--vxe-warning-lighten-color), - btnDarkenColor: var(--vxe-warning-darken-color), - btnDisabledColor: var(--vxe-warning-disabled-color) - ), - ( - name: "danger", - textColor: var(--vxe-danger-color), - btnColor: #fff, - btnLightenColor: var(--vxe-danger-lighten-color), - btnDarkenColor: var(--vxe-danger-darken-color), - btnDisabledColor: var(--vxe-danger-disabled-color) - ), - ( - name: "perfect", - textColor: var(--vxe-table-header-background-color), - btnColor: var(--vxe-font-color), - btnLightenColor: var(--vxe-table-header-background-color), - btnDarkenColor: var(--vxe-table-header-background-color), - btnDisabledColor: var(--vxe-table-header-background-color) - ) -); - -.vxe-button { - position: relative; - text-align: center; - background-color: var(--vxe-button-default-background-color); - outline: 0; - font-size: var(--vxe-font-size); - max-width: var(--vxe-button-max-width); - line-height: 1.5; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - white-space: nowrap; - user-select: none; - appearance: none; - @include createAnimationTransition(border, .2s); - &:not(.is--disabled) { - color: var(--vxe-font-color); - cursor: pointer; - } - &.is--loading { - cursor: progress; - &:before { - content: ""; - position: absolute; - left: -1px; - top: -1px; - right: -1px; - bottom: -1px; - border-radius: inherit; - background-color: hsla(0,0%,100%,.35); - pointer-events: none; - } - } - &.is--disabled { - color: var(--vxe-font-disabled-color); - &:not(.is--loading) { - cursor: no-drop; - } - } - &.type--text { - text-decoration: none; - border: 0; - padding: 0.1em 0.5em; - background-color: transparent; - &:not(.is--disabled) { - &:focus { - color: var(--vxe-font-darken-color); - } - &:hover { - color: var(--vxe-primary-lighten-color); - } - } - @for $index from 0 to length($btnThemeList) { - $item: nth($btnThemeList, $index + 1); - &.theme--#{map-get($item, name)} { - color: map-get($item, textColor); - &:not(.is--disabled) { - &:focus { - color: map-get($item, btnDarkenColor); - } - &:hover { - color: map-get($item, btnLightenColor); - } - } - &.is--disabled { - color: map-get($item, btnDisabledColor); - } - } - } - } - &.type--button { - font-family: inherit; - height: var(--vxe-button-height-default); - line-height: 1; - border: 1px solid var(--vxe-input-border-color); - &.is--round { - border-radius: var(--vxe-button-round-border-radius-default); - } - &:not(.is--round) { - border-radius: var(--vxe-border-radius); - } - &.is--circle { - padding: 0 0.5em; - min-width: var(--vxe-button-height-default); - border-radius: 50%; - } - &:not(.is--circle) { - padding: 0 1em; - } - &:not(.is--disabled) { - &:hover { - color: var(--vxe-primary-lighten-color); - } - &:focus { - border-color: var(--vxe-primary-color); - } - &:active { - color: var(--vxe-primary-darken-color); - border-color: var(--vxe-primary-darken-color); - background-color: var(--vxe-button-default-background-color); - } - } - @for $index from 0 to length($btnThemeList) { - $item: nth($btnThemeList, $index + 1); - $textColor: map-get($item, textColor); - $btnColor: map-get($item, btnColor); - &.theme--#{map-get($item, name)} { - color: $btnColor; - &:not(.is--disabled) { - border-color: $textColor; - background-color: $textColor; - &:hover { - color: $btnColor; - background-color: map-get($item, btnLightenColor); - border-color: map-get($item, btnLightenColor); - } - &:active { - color: $btnColor; - background-color: map-get($item, btnDarkenColor); - border-color: map-get($item, btnDarkenColor); - } - } - &.is--disabled { - border-color: map-get($item, btnDisabledColor); - background-color: map-get($item, btnDisabledColor); - } - &.is--loading { - border-color: $textColor; - background-color: $textColor; - } - } - } - } - &.size--medium { - font-size: var(--vxe-font-size-medium); - &.type--button { - height: var(--vxe-button-height-medium); - &.is--circle { - min-width: var(--vxe-button-height-medium); - } - &.is--round { - border-radius: var(--vxe-button-round-border-radius-medium); - } - } - .vxe-button--loading-icon, - .vxe-button--icon { - min-width: var(--vxe-font-size-medium); - } - } - &.size--small { - font-size: var(--vxe-font-size-small); - &.type--button { - height: var(--vxe-button-height-small); - &.is--circle { - min-width: var(--vxe-button-height-small); - } - &.is--round { - border-radius: var(--vxe-button-round-border-radius-small); - } - } - .vxe-button--loading-icon, - .vxe-button--icon { - min-width: var(--vxe-font-size-small); - } - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - &.type--button { - height: var(--vxe-button-height-mini); - &.is--circle { - min-width: var(--vxe-button-height-mini); - } - &.is--round { - border-radius: var(--vxe-button-round-border-radius-mini); - } - } - .vxe-button--loading-icon, - .vxe-button--icon { - min-width: var(--vxe-font-size-mini); - } - } -} -.vxe-input, -.vxe-button, -.vxe-button-wrapper { - &+.vxe-button-wrapper, - &+.vxe-button.type--button, - &+.vxe-button--dropdown { - margin-left: 12px; - } -} -.vxe-button--loading-icon, -.vxe-button--icon { - min-width: var(--vxe-font-size); - &+.vxe-button--content { - margin-left: 4px; - } -} -.vxe-button--wrapper, -.vxe-button--dropdown { - display: inline-block; -} -.vxe-button--dropdown { - position: relative; - &+.vxe-button-wrapper, - &+.vxe-button.type--button, - &+.vxe-button--dropdown { - margin-left: 12px; - } - & > .vxe-button { - &.type--button { - @for $index from 0 to length($btnThemeList) { - $item: nth($btnThemeList, $index + 1); - $btnColor: map-get($item, btnColor); - &.theme--#{map-get($item, name)} { - color: $btnColor; - } - } - } - } - &.is--active { - & > .vxe-button { - &:not(.is--disabled) { - color: var(--vxe-primary-lighten-color); - } - &.type--text { - @for $index from 0 to length($btnThemeList) { - $item: nth($btnThemeList, $index + 1); - &.theme--#{map-get($item, name)} { - color: map-get($item, btnLightenColor); - } - } - } - &.type--button { - @for $index from 0 to length($btnThemeList) { - $item: nth($btnThemeList, $index + 1); - &.theme--#{map-get($item, name)} { - color: map-get($item, btnColor); - background-color: map-get($item, btnLightenColor); - border-color: map-get($item, btnLightenColor); - } - } - } - } - .vxe-button--dropdown-arrow { - transform: rotate(180deg); - } - } -} - -.vxe-button--dropdown-arrow { - display: inline-block; - font-size: 12px; - margin-left: 4px; - @include createAnimationTransition(transform, .2s); -} - -.vxe-button--dropdown-panel { - display: none; - position: absolute; - right: 0; - padding: 4px 0; - &.animat--leave { - display: block; - opacity: 0; - transform: scaleY(0.5); - transition: transform .3s cubic-bezier(.23,1,.32,1), opacity .3s cubic-bezier(.23,1,.32,1); - transform-origin: center top; - backface-visibility: hidden; - transform-style: preserve-3d; - &[placement="top"] { - transform-origin: center bottom; - } - } - &.animat--enter { - opacity: 1; - transform: scaleY(1); - } -} -.vxe-button--dropdown-wrapper { - padding: 5px; - background-color: var(--vxe-button-dropdown-panel-background-color); - border-radius: var(--vxe-border-radius); - border: 1px solid var(--vxe-input-border-color); - box-shadow: 0 1px 6px rgba(0,0,0,.2); - & > .vxe-button.type--text, - & > .vxe-button.type--button { - display: block; - width: 100%; - border: 0; - margin: 0.4em 0 0 0; - } - & > .vxe-button { - &.type--text { - padding: 2px 8px; - } - &:first-child { - margin-top: 0; - } - &:last-child { - margin-bottom: 0; - } - } -} \ No newline at end of file diff --git a/styles/checkbox-group.scss b/styles/checkbox-group.scss deleted file mode 100644 index 974988fc98..0000000000 --- a/styles/checkbox-group.scss +++ /dev/null @@ -1,5 +0,0 @@ -/**Variable**/ - -.vxe-button-group { - display: inline-flex; -} diff --git a/styles/checkbox.scss b/styles/checkbox.scss deleted file mode 100644 index a31e447573..0000000000 --- a/styles/checkbox.scss +++ /dev/null @@ -1,91 +0,0 @@ -/**Variable**/ -@import './helpers/mixin.scss'; -@import './base/common.scss'; - -/*checkbox-group*/ -.vxe-checkbox-group { - display: inline-block; - vertical-align: middle; - line-height: 1; -} - -/*checkbox*/ -.vxe-checkbox { - @include createCheckboxIcon(); - display: inline-block; - vertical-align: middle; - white-space: nowrap; - line-height: 1; - &+.vxe-checkbox { - margin-left: 10px; - } - > input { - &[type="checkbox"] { - position: absolute; - width: 0; - height: 0; - border: 0; - appearance: none; - } - } - &.is--indeterminate { - > input { - &:not(:checked) { - &+.vxe-checkbox--icon { - color: var(--vxe-primary-color); - } - } - } - } - &:not(.is--disabled) { - & > input { - &:focus { - &+.vxe-checkbox--icon { - color: var(--vxe-primary-color); - box-shadow: 0 0 0.2em 0 var(--vxe-primary-color); - } - } - } - &:hover { - > input { - &+.vxe-checkbox--icon { - border-color: var(--vxe-primary-color); - } - } - } - } - &.is--disabled { - cursor: not-allowed; - > input { - &+.vxe-checkbox--icon { - color: var(--vxe-input-disabled-color); - &+.vxe-checkbox--label { - color: var(--vxe-font-disabled-color); - } - } - &:checked+.vxe-checkbox--icon { - color: var(--vxe-input-disabled-color); - } - } - } - .vxe-checkbox--label { - padding-left: 0.5em; - vertical-align: middle; - display: inline-block; - max-width: 50em; - @extend %TextEllipsis; - } -} - -.vxe-checkbox { - font-size: var(--vxe-font-size); - &.size--medium { - font-size: var(--vxe-font-size-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - } -} \ No newline at end of file diff --git a/styles/colgroup.scss b/styles/colgroup.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/colgroup.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/column.scss b/styles/column.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/column.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/components/colgroup.scss b/styles/components/colgroup.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/styles/components/column.scss b/styles/components/column.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/styles/grid.scss b/styles/components/grid.scss similarity index 53% rename from styles/grid.scss rename to styles/components/grid.scss index 84d345a408..268ad0f2d3 100644 --- a/styles/grid.scss +++ b/styles/components/grid.scss @@ -1,5 +1,3 @@ -/**Variable**/ - .vxe-grid { position: relative; &.is--loading { @@ -12,7 +10,7 @@ height: 100%; z-index: 99; user-select: none; - background-color: var(--vxe-loading-background-color); + background-color: var(--vxe-ui-loading-background-color); } & > .vxe-table { .vxe-loading { @@ -27,24 +25,37 @@ width: 100%; height: 100%; padding: 0.5em 1em; - background-color: var(--vxe-grid-maximize-background-color); + background-color: var(--vxe-ui-layout-background-color); } .vxe-grid--form-wrapper, .vxe-grid--top-wrapper, .vxe-grid--bottom-wrapper { position: relative; } + .vxe-grid--table-container { + display: flex; + flex-direction: row; + } + .vxe-grid--left-wrapper, + .vxe-grid--right-wrapper { + flex-shrink: 0; + overflow: auto; + } + .vxe-grid--table-wrapper { + flex-grow: 1; + overflow: hidden; + } } .vxe-grid { - font-size: var(--vxe-font-size); + font-size: var(--vxe-ui-font-size-default); &.size--medium { - font-size: var(--vxe-font-size-medium); + font-size: var(--vxe-ui-font-size-medium); } &.size--small { - font-size: var(--vxe-font-size-small); + font-size: var(--vxe-ui-font-size-small); } &.size--mini { - font-size: var(--vxe-font-size-mini); + font-size: var(--vxe-ui-font-size-mini); } } diff --git a/styles/components/table-module/all.scss b/styles/components/table-module/all.scss new file mode 100644 index 0000000000..c4bb23dafb --- /dev/null +++ b/styles/components/table-module/all.scss @@ -0,0 +1,7 @@ +@import './custom.scss'; +@import './edit.scss'; +@import './export.scss'; +@import './filter.scss'; +@import './keyboard.scss'; +@import './menu.scss'; +@import './validator.scss'; \ No newline at end of file diff --git a/styles/custom.scss b/styles/components/table-module/custom.scss similarity index 55% rename from styles/custom.scss rename to styles/components/table-module/custom.scss index ff87b7cc9c..3729492322 100644 --- a/styles/custom.scss +++ b/styles/components/table-module/custom.scss @@ -1,39 +1,111 @@ -/**Variable**/ -@import './helpers/mixin.scss'; -@import './base/common.scss'; +@import '../../helpers/mixin.scss'; .vxe-table-custom--option { + position: relative; display: flex; flex-direction: row; + &.active--drag-target { + &[drag-pos="top"] { + &::after { + display: block; + top: -2px; + } + } + &[drag-pos="bottom"] { + &::after { + display: block; + bottom: -2px; + } + } + } + &:first-child { + &[drag-pos="top"] { + &::after { + top: 0; + } + } + } + &:last-child { + &[drag-pos="bottom"] { + &::after { + bottom: 0; + } + } + } + &::after { + display: none; + content: ""; + position: absolute; + left: -1px; + width: calc(100% + 1px); + height: 3px; + background-color: var(--vxe-ui-font-primary-color); + z-index: 12; + } + &:last-child { + &::after { + width: 100%; + } + } } .vxe-table-custom-wrapper { display: none; + flex-direction: column; position: absolute; - top: -4px; - right: 2px; text-align: left; - background-color: var(--vxe-toolbar-panel-background-color); + background-color: var(--vxe-ui-layout-background-color); z-index: 19; - border: 1px solid var(--vxe-table-border-color); - border-radius: var(--vxe-border-radius); - box-shadow: 0 1px 6px rgba(0,0,0,.2); + border: 1px solid var(--vxe-ui-table-border-color); + border-radius: var(--vxe-ui-border-radius); + box-shadow: var(--vxe-ui-base-popup-box-shadow); + &.placement--top-left { + top: 2px; + left: 2px; + } + &.placement--top-right { + top: 2px; + right: 2px; + } + &.placement--bottom-left { + bottom: 2px; + left: 2px; + } + &.placement--bottom-right { + bottom: 2px; + right: 2px; + } + &.placement--left { + left: 2px; + } + &.placement--right { + right: 2px; + } + &.placement--left, + &.placement--right { + top: 2px; + height: calc(100% - 4px); + } &.is--active { - display: block; + display: flex; } } +.vxe-table-custom--list-wrapper { + display: block; + flex-grow: 1; + overflow-x: hidden; + overflow-y: auto; +} + .vxe-table-custom--header, .vxe-table-custom--body { list-style-type: none; - overflow-x: hidden; - overflow-y: auto; margin: 0; padding: 0; - user-select: none; & > li { - max-width: 18em; - min-width: 14em; + max-width: 26em; + min-width: 17em; padding: 0.2em 1em 0.2em 1em; @for $i from 2 through 8 { $interval: $i - 1 + 0.2; @@ -48,47 +120,73 @@ } .vxe-table-custom--header { + flex-shrink: 0; padding: 0.28em 0; font-weight: 700; - border-bottom: 1px solid var(--vxe-table-popup-border-color); + border-bottom: 1px solid var(--vxe-ui-base-popup-border-color); + user-select: none; } .vxe-table-custom--body { padding: 0.2em 0; - max-height: 20em; .vxe-table-custom--checkbox-option { &:hover { - background-color: var(--vxe-table-row-hover-background-color); + background-color: var(--vxe-ui-table-row-hover-background-color); } } } .vxe-table-custom--footer { - border-top: 1px solid var(--vxe-table-popup-border-color); + display: flex; + flex-direction: row; + flex-shrink: 0; + border-top: 1px solid var(--vxe-ui-base-popup-border-color); text-align: right; button { background-color: transparent; width: 50%; - height: 2.5em; + height: 2.8em; border: 0; - color: var(--vxe-font-color); + color: var(--vxe-ui-font-color); text-align: center; cursor: pointer; &:focus { outline: none; } &:hover { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } } } .vxe-table-custom--checkbox-option { @include createCheckboxIcon(); +} +.vxe-table-custom--checkbox-option, +.vxe-table-custom--sort-option { + padding-right: 0.4em; + flex-shrink: 0; + user-select: none; +} +.vxe-table-custom--sort-option { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +} +.vxe-table-custom--sort-btn { + padding-left: 0.2em; + padding-right: 0.4em; + cursor: grabbing; + &:hover { + color: var(--vxe-ui-font-primary-color); + } +} +.vxe-table-custom--checkbox-label { + flex-grow: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; - flex-grow: 1; } .vxe-table-custom--fixed-option { @@ -97,6 +195,7 @@ display: flex; flex-direction: row; align-items: center; + user-select: none; } .vxe-table-custom--fixed-left-option, @@ -107,11 +206,11 @@ cursor: pointer; &.is--checked, &:hover { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } &.is--disabled { cursor: no-drop; - color: var(--vxe-input-disabled-color); + color: var(--vxe-ui-input-disabled-color); } } @@ -121,7 +220,7 @@ } .vxe-table-custom-popup--table-wrapper { - border-bottom: 1px solid var(--vxe-table-border-color); + border-bottom: 1px solid var(--vxe-ui-table-border-color); table { width: 100%; border: 0; @@ -133,15 +232,15 @@ position: sticky; top: 0; text-align: left; - border-top: 1px solid var(--vxe-table-border-color); - border-bottom: 1px solid var(--vxe-table-border-color); - border-left: 1px solid var(--vxe-table-border-color); - background-color: var(--vxe-table-header-background-color); + border-top: 1px solid var(--vxe-ui-table-border-color); + border-bottom: 1px solid var(--vxe-ui-table-border-color); + border-left: 1px solid var(--vxe-ui-table-border-color); + background-color: var(--vxe-ui-table-header-background-color); z-index: 7; } td { - border-top: 1px solid var(--vxe-table-border-color); - border-left: 1px solid var(--vxe-table-border-color); + border-top: 1px solid var(--vxe-ui-table-border-color); + border-left: 1px solid var(--vxe-ui-table-border-color); } tr { &:first-child { @@ -150,7 +249,7 @@ } } &:hover { - background-color: var(--vxe-table-row-hover-background-color); + background-color: var(--vxe-ui-table-row-hover-background-color); } } th, @@ -158,24 +257,26 @@ height: 44px; padding: 0 0.6em; &:last-child { - border-right: 1px solid var(--vxe-table-border-color); + border-right: 1px solid var(--vxe-ui-table-border-color); } } } } .vxe-table-custom-popup--drag-hint { - @extend %TextEllipsis; display: none; position: absolute; top: 0; left: 0; padding: 0.6em 1em 0.6em 1.8em; max-width: 300px; - border-radius: var(--vxe-border-radius); + border-radius: var(--vxe-ui-border-radius); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; user-select: none; pointer-events: none; - background-color: var(--vxe-table-body-background-color); + background-color: var(--vxe-ui-layout-background-color); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); z-index: 33; } @@ -201,9 +302,15 @@ position: relative; &.col--sort, &.col--visible, + &.col--resizable, &.col--fixed { text-align: center; } + &.col--resizable { + & > .vxe-input { + width: 100%; + } + } } .vxe-table-custom-popup--row { @@ -253,7 +360,7 @@ left: -1px; width: calc(100% + 1px); height: 3px; - background-color: var(--vxe-primary-color); + background-color: var(--vxe-ui-font-primary-color); z-index: 12; } &:last-child { @@ -271,6 +378,9 @@ font-size: 1.2em; padding: 0.2em 0.5em; cursor: grab; + &:hover { + color: var(--vxe-ui-font-primary-color); + } &:active { cursor: grabbing; } diff --git a/styles/components/table-module/edit.scss b/styles/components/table-module/edit.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/styles/export.scss b/styles/components/table-module/export.scss similarity index 75% rename from styles/export.scss rename to styles/components/table-module/export.scss index 54d4e364f9..99520b0226 100644 --- a/styles/export.scss +++ b/styles/components/table-module/export.scss @@ -1,5 +1,4 @@ -/**Variable**/ -@import './helpers/mixin.scss'; +@import '../../helpers/mixin.scss'; .vxe-export--panel-column > ul { list-style-type: none; @@ -44,9 +43,9 @@ } .vxe-export--panel-column { width: 80%; - border: 1px solid var(--vxe-input-border-color); + border: 1px solid var(--vxe-ui-input-border-color); margin: 3px 0; - border-radius: var(--vxe-border-radius); + border-radius: var(--vxe-ui-border-radius); user-select: none; & > ul { & > li { @@ -64,9 +63,9 @@ } .vxe-export--panel-column-header { padding: 0.1em 0; - background-color: var(--vxe-table-header-background-color); + background-color: var(--vxe-ui-table-header-background-color); font-weight: 700; - border-bottom: 1px solid var(--vxe-table-border-color); + border-bottom: 1px solid var(--vxe-ui-table-border-color); } .vxe-export--panel-column-body { padding: 0.2em 0; @@ -94,25 +93,25 @@ & > i { display: block; } - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } } .vxe-import-select--file { - border: 1px dashed var(--vxe-input-border-color); + border: 1px dashed var(--vxe-ui-input-border-color); padding: 6px 34px; outline: 0; - border-radius: var(--vxe-border-radius); - background-color: var(--vxe-input-background-color); + border-radius: var(--vxe-ui-border-radius); + background-color: var(--vxe-ui-layout-background-color); color: inherit; user-select: none; cursor: pointer; &:focus { - border-color: var(--vxe-primary-color); - box-shadow: 0 0 0.25em 0 var(--vxe-primary-color); + border-color: var(--vxe-ui-font-primary-color); + box-shadow: 0 0 0.25em 0 var(--vxe-ui-font-primary-color); } &:hover { - color: var(--vxe-primary-color); - border-color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); + border-color: var(--vxe-ui-font-primary-color); } } .vxe-export--panel-btns { diff --git a/styles/filter.scss b/styles/components/table-module/filter.scss similarity index 69% rename from styles/filter.scss rename to styles/components/table-module/filter.scss index e8b40443ec..022452f4ed 100644 --- a/styles/filter.scss +++ b/styles/components/table-module/filter.scss @@ -1,7 +1,5 @@ -/**Variable**/ -@import './helpers/mixin.scss'; +@import '../../helpers/mixin.scss'; -/*筛选*/ .vxe-cell--filter { padding: 0 0.1em 0 0.2em; text-align: center; @@ -10,21 +8,21 @@ line-height: 0; &.col--filter { .vxe-filter--btn { - color: var(--vxe-font-color); + color: var(--vxe-ui-font-color); } } .vxe-filter--btn { - color: var(--vxe-table-column-icon-border-color); + color: var(--vxe-ui-table-column-icon-border-color); cursor: pointer; &:hover { - color: var(--vxe-font-color); + color: var(--vxe-ui-font-color); } } } .is--filter-active { .vxe-cell--filter { .vxe-filter--btn { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } } } @@ -35,9 +33,9 @@ position: absolute; top: 0; min-width: 100px; - border-radius: var(--vxe-border-radius); - background-color: var(--vxe-table-filter-panel-background-color); - border: 1px solid var(--vxe-table-popup-border-color); + border-radius: var(--vxe-ui-border-radius); + background-color: var(--vxe-ui-layout-background-color); + border: 1px solid var(--vxe-ui-base-popup-border-color); box-shadow: 0 1px 6px rgba(0,0,0,.2); z-index: 10; &:not(.is--multiple) { @@ -56,10 +54,10 @@ padding: 0.25em 0.8em; cursor: pointer; &.is--checked { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } &:hover { - background-color: var(--vxe-table-row-hover-background-color); + background-color: var(--vxe-ui-table-row-hover-background-color); } } } @@ -85,23 +83,23 @@ } } .vxe-table--filter-footer { - border-top: 1px solid var(--vxe-table-popup-border-color); + border-top: 1px solid var(--vxe-ui-base-popup-border-color); padding: 0.6em; user-select: none; button { background-color: transparent; padding: 0 0.4em; border: 0; - color: var(--vxe-font-color); + color: var(--vxe-ui-font-color); cursor: pointer; &:focus { outline: none; } &:hover { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } &.is--disabled { - color: var(--vxe-font-disabled-color); + color: var(--vxe-ui-font-disabled-color); cursor: not-allowed; } } diff --git a/styles/components/table-module/keyboard.scss b/styles/components/table-module/keyboard.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/styles/menu.scss b/styles/components/table-module/menu.scss similarity index 85% rename from styles/menu.scss rename to styles/components/table-module/menu.scss index b271a417ce..2fc0dec14e 100644 --- a/styles/menu.scss +++ b/styles/components/table-module/menu.scss @@ -1,6 +1,3 @@ -/**Variable**/ - -/*快捷菜单*/ .vxe-table--context-menu-wrapper { display: none; &.is--visible { @@ -13,20 +10,20 @@ top: 0; left: 0; font-size: 12px; - border: 1px solid var(--vxe-table-popup-border-color); + border: 1px solid var(--vxe-ui-base-popup-border-color); box-shadow: 3px 3px 4px -2px rgba(0,0,0,.6); padding: 0 1px; user-select: none; - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); - background-color: var(--vxe-table-menu-background-color); + color: var(--vxe-ui-font-color); + font-family: var(--vxe-ui-font-family); + background-color: var(--vxe-ui-table-menu-background-color); } .vxe-context-menu--link { display: block; padding: 0 2.5em; - width: var(--vxe-table-menu-item-width); + width: var(--vxe-ui-table-menu-item-width); line-height: 26px; - color: var(--vxe-font-color); + color: var(--vxe-ui-font-color); cursor: pointer; .vxe-context-menu--link-prefix, .vxe-context-menu--link-suffix { @@ -84,7 +81,7 @@ } &.link--disabled { & > .vxe-context-menu--link { - color: var(--vxe-font-disabled-color); + color: var(--vxe-ui-font-disabled-color); cursor: no-drop; } &.link--active { diff --git a/styles/components/table-module/validator.scss b/styles/components/table-module/validator.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/styles/table.scss b/styles/components/table.scss similarity index 69% rename from styles/table.scss rename to styles/components/table.scss index b493e8526a..dfcf4089f7 100644 --- a/styles/table.scss +++ b/styles/components/table.scss @@ -1,22 +1,20 @@ -/**Variable**/ -@import './helpers/mixin.scss'; -@import './base/common.scss'; -@import './loading.scss'; +@import '../helpers/mixin.scss'; +@import './table-module/all.scss'; %DefaultColumnHeight { - height: var(--vxe-table-row-height-default); + height: var(--vxe-ui-table-row-height-default); } %MediumColumnHeight { - height: var(--vxe-table-row-height-medium); + height: var(--vxe-ui-table-row-height-medium); } %SmallColumnHeight { - height: var(--vxe-table-row-height-small); + height: var(--vxe-ui-table-row-height-small); } %MiniColumnHeight { - height: var(--vxe-table-row-height-mini); + height: var(--vxe-ui-table-row-height-mini); } .vxe-table-slots, @@ -33,7 +31,7 @@ border: 0; } .vxe-table--render-wrapper { - background-color: var(--vxe-table-body-background-color); + background-color: var(--vxe-ui-layout-background-color); } .vxe-table--body-wrapper { scroll-behavior: auto; @@ -50,7 +48,7 @@ .vxe-table--filter-wrapper { .vxe-default-input, .vxe-default-textarea { - background-color: var(--vxe-table-body-background-color); + background-color: var(--vxe-ui-layout-background-color); } .vxe-default-input, .vxe-default-textarea, @@ -58,21 +56,21 @@ outline: 0; padding: 0 2px; width: 100%; - color: var(--vxe-font-color); - border-radius: var(--vxe-border-radius); - border: 1px solid var(--vxe-input-border-color); + color: var(--vxe-ui-font-color); + border-radius: var(--vxe-ui-border-radius); + border: 1px solid var(--vxe-ui-input-border-color); &:focus { - border: 1px solid var(--vxe-primary-color); + border: 1px solid var(--vxe-ui-font-primary-color); } &[disabled] { cursor: not-allowed; - background-color: var(--vxe-input-disabled-background-color); + background-color: var(--vxe-ui-input-disabled-background-color); } } .vxe-default-input, .vxe-default-textarea, .vxe-default-select { - height: var(--vxe-input-height-default); + height: var(--vxe-ui-input-height-default); } .vxe-default-input { &[type="date"]::-webkit-inner-spin-button { @@ -83,7 +81,7 @@ height: 24px; } &::placeholder { - color: var(--vxe-input-placeholder-color); + color: var(--vxe-ui-input-placeholder-color); } } .vxe-default-textarea { @@ -138,7 +136,7 @@ } .vxe-table--cell-copy-area { &[half="1"] { - background-size: var(--vxe-table-cell-copy-area-border-width) 12px, 0 12px, 12px var(--vxe-table-cell-copy-area-border-width), 12px var(--vxe-table-cell-copy-area-border-width); + background-size: var(--vxe-ui-table-cell-copy-area-border-width) 12px, 0 12px, 12px var(--vxe-ui-table-cell-copy-area-border-width), 12px var(--vxe-ui-table-cell-copy-area-border-width); } } } @@ -153,15 +151,15 @@ } .vxe-table--cell-copy-area { &[half="1"] { - background-size: 0 12px, var(--vxe-table-cell-copy-area-border-width) 12px, 12px var(--vxe-table-cell-copy-area-border-width), 12px var(--vxe-table-cell-copy-area-border-width); + background-size: 0 12px, var(--vxe-ui-table-cell-copy-area-border-width) 12px, 12px var(--vxe-ui-table-cell-copy-area-border-width), 12px var(--vxe-ui-table-cell-copy-area-border-width); } } } /*复选框-范围选择*/ .vxe-table--checkbox-range { - background-color: var(--vxe-table-checkbox-range-background-color); - border: var(--vxe-table-checkbox-range-border-width) solid var(--vxe-table-checkbox-range-border-color); + background-color: var(--vxe-ui-table-checkbox-range-background-color); + border: var(--vxe-ui-table-checkbox-range-border-width) solid var(--vxe-ui-table-checkbox-range-border-color); } .vxe-table--cell-area { @@ -169,8 +167,8 @@ font-size: 0; display: none; & > .vxe-table--cell-main-area { - background-color: var(--vxe-table-cell-area-background-color); - border: var(--vxe-table-cell-area-border-width) solid var(--vxe-table-cell-area-border-color); + background-color: var(--vxe-ui-table-cell-area-background-color); + border: var(--vxe-ui-table-cell-area-border-width) solid var(--vxe-ui-table-cell-area-border-color); } .vxe-table--cell-main-area-btn { display: none; @@ -180,14 +178,14 @@ width: 7px; height: 7px; border-style: solid; - border-color: var(--vxe-table-cell-main-area-extension-border-color); + border-color: var(--vxe-ui-table-cell-main-area-extension-border-color); border-width: 1px 0 0 1px; - background-color: var(--vxe-table-cell-main-area-extension-background-color); + background-color: var(--vxe-ui-table-cell-main-area-extension-background-color); pointer-events: auto; cursor: crosshair; } .vxe-table--cell-extend-area { - border: var(--vxe-table-cell-extend-area-border-width) solid var(--vxe-table-cell-extend-area-border-color); + border: var(--vxe-ui-table-cell-extend-area-border-width) solid var(--vxe-ui-table-cell-extend-area-border-color); } } @@ -200,22 +198,25 @@ } .vxe-table--cell-copy-area { - background: linear-gradient(0deg, transparent 6px, var(--vxe-table-cell-copy-area-border-color) 6px) repeat-y, - linear-gradient(0deg, transparent 50%, var(--vxe-table-cell-copy-area-border-color) 0) repeat-y, - linear-gradient(90deg, transparent 50%, var(--vxe-table-cell-copy-area-border-color) 0) repeat-x, - linear-gradient(90deg, transparent 50%, var(--vxe-table-cell-copy-area-border-color) 0) repeat-x; - background-size: var(--vxe-table-cell-copy-area-border-width) 12px, var(--vxe-table-cell-copy-area-border-width) 12px, 12px var(--vxe-table-cell-copy-area-border-width), 12px var(--vxe-table-cell-copy-area-border-width); + background: linear-gradient(0deg, transparent 6px, var(--vxe-ui-table-cell-copy-area-border-color) 6px) repeat-y, + linear-gradient(0deg, transparent 50%, var(--vxe-ui-table-cell-copy-area-border-color) 0) repeat-y, + linear-gradient(90deg, transparent 50%, var(--vxe-ui-table-cell-copy-area-border-color) 0) repeat-x, + linear-gradient(90deg, transparent 50%, var(--vxe-ui-table-cell-copy-area-border-color) 0) repeat-x; + background-size: var(--vxe-ui-table-cell-copy-area-border-width) 12px, var(--vxe-ui-table-cell-copy-area-border-width) 12px, 12px var(--vxe-ui-table-cell-copy-area-border-width), 12px var(--vxe-ui-table-cell-copy-area-border-width); background-position: 0 0, 100% 0, 0 0, 0 100%; animation: moveCopyCellBorder .5s infinite linear; } .vxe-table--cell-active-area { - border: var(--vxe-table-cell-active-area-border-width) solid var(--vxe-table-cell-active-area-border-color); + border-color: var(--vxe-ui-table-cell-active-area-border-color); + border-style: solid; + border-width: var(--vxe-ui-table-cell-active-area-border-width); + background-color: var(--vxe-ui-table-cell-active-area-background-color); } .vxe-table--cell-multi-area { & > .vxe-table--cell-main-area { - background-color: var(--vxe-table-cell-area-background-color); + background-color: var(--vxe-ui-table-cell-area-background-color); } } @@ -223,25 +224,25 @@ .vxe-table--render-default { &.is--round { %AllRadius { - border-radius: var(--vxe-table-border-radius); + border-radius: var(--vxe-ui-table-border-radius); } %TopRadius { - border-radius: var(--vxe-table-border-radius) var(--vxe-table-border-radius) 0 0; + border-radius: var(--vxe-ui-table-border-radius) var(--vxe-ui-table-border-radius) 0 0; } %TopLeftRadius { - border-radius: var(--vxe-table-border-radius) 0 0 0; + border-radius: var(--vxe-ui-table-border-radius) 0 0 0; } %TopRightRadius { - border-radius: 0 var(--vxe-table-border-radius) 0 0; + border-radius: 0 var(--vxe-ui-table-border-radius) 0 0; } %BottomRadius { - border-radius: 0 0 var(--vxe-table-border-radius) var(--vxe-table-border-radius); + border-radius: 0 0 var(--vxe-ui-table-border-radius) var(--vxe-ui-table-border-radius); } %BottomLeftRadius { - border-radius: 0 0 0 var(--vxe-table-border-radius); + border-radius: 0 0 0 var(--vxe-ui-table-border-radius); } %BottomRightRadius { - border-radius: 0 0 var(--vxe-table-border-radius) 0; + border-radius: 0 0 var(--vxe-ui-table-border-radius) 0; } @extend %AllRadius; .vxe-table--border-line { @@ -314,13 +315,13 @@ /*header*/ .vxe-table { .vxe-table--header-wrapper { - color: var(--vxe-table-header-font-color); + color: var(--vxe-ui-table-header-font-color); .vxe-table--header-border-line { position: absolute; left: 0; bottom: 0; height: 0; - border-bottom: var(--vxe-table-border-width) solid var(--vxe-table-border-color); + border-bottom: var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color); } } /*排序*/ @@ -349,20 +350,29 @@ } .vxe-sort--asc-btn, .vxe-sort--desc-btn { - color: var(--vxe-table-column-icon-border-color); + color: var(--vxe-ui-table-column-icon-border-color); cursor: pointer; &:hover { - color: var(--vxe-font-color); + color: var(--vxe-ui-font-color); } &.sort--active { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } } } +.vxe-sort--asc-btn, +.vxe-sort--desc-btn, +.vxe-filter--btn { + &:before, + &:after { + @include createAnimationTransition(border); + } +} + .vxe-header--column { position: relative; - font-weight: var(--vxe-table-header-font-weight); + font-weight: var(--vxe-ui-table-header-font-weight); // user-select: none; &.col--ellipsis { & > .vxe-cell { @@ -383,11 +393,11 @@ } .vxe-cell--required-icon { display: inline-block; - color: var(--vxe-table-validate-error-color); + color: var(--vxe-ui-table-validate-error-color); width: 0.8em; height: 1em; line-height: 1em; - font-family: var(--vxe-icon-font-family); + font-family: Verdana,Arial,Tahoma; font-weight: normal; position: relative; &:before { @@ -435,7 +445,7 @@ &:before { width: 1px; height: 50%; - background-color: var(--vxe-table-resizable-line-color); + background-color: var(--vxe-ui-table-resizable-line-color); } &:after { width: 0; @@ -456,18 +466,18 @@ /*table*/ .vxe-table--render-default { position: relative; - font-size: var(--vxe-font-size); - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); + font-size: var(--vxe-ui-font-size-default); + color: var(--vxe-ui-font-color); + font-family: var(--vxe-ui-font-family); direction: ltr; .vxe-table--body-wrapper { table { - background-color: var(--vxe-table-body-background-color); + background-color: var(--vxe-ui-layout-background-color); } } .vxe-table--footer-wrapper { table { - background-color: var(--vxe-table-footer-background-color); + background-color: var(--vxe-ui-table-footer-background-color); } } .vxe-table--header, @@ -494,30 +504,30 @@ } .vxe-body--row { &.row--stripe { - background-color: var(--vxe-table-row-striped-background-color); + background-color: var(--vxe-ui-table-row-striped-background-color); } &.row--radio { - background-color: var(--vxe-table-row-radio-checked-background-color); + background-color: var(--vxe-ui-table-row-radio-checked-background-color); } &.row--checked { - background-color: var(--vxe-table-row-checkbox-checked-background-color); + background-color: var(--vxe-ui-table-row-checkbox-checked-background-color); } &.row--current { - background-color: var(--vxe-table-row-current-background-color); + background-color: var(--vxe-ui-table-row-current-background-color); } &.row--hover { - background-color: var(--vxe-table-row-hover-background-color); + background-color: var(--vxe-ui-table-row-hover-background-color); &.row--stripe { - background-color: var(--vxe-table-row-hover-striped-background-color); + background-color: var(--vxe-ui-table-row-hover-striped-background-color); } &.row--radio { - background-color: var(--vxe-table-row-hover-radio-checked-background-color); + background-color: var(--vxe-ui-table-row-hover-radio-checked-background-color); } &.row--checked { - background-color: var(--vxe-table-row-hover-checkbox-checked-background-color); + background-color: var(--vxe-ui-table-row-hover-checkbox-checked-background-color); } &.row--current { - background-color: var(--vxe-table-row-hover-current-background-color); + background-color: var(--vxe-ui-table-row-hover-current-background-color); } } } @@ -525,46 +535,46 @@ // .vxe-body--row { // &.row--stripe { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-striped-background-color); + // background-color: var(--vxe-ui-table-row-striped-background-color); // } // } // &.row--radio { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-radio-checked-background-color); + // background-color: var(--vxe-ui-table-row-radio-checked-background-color); // } // } // &.row--checked { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-checkbox-checked-background-color); + // background-color: var(--vxe-ui-table-row-checkbox-checked-background-color); // } // } // &.row--current { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-current-background-color); + // background-color: var(--vxe-ui-table-row-current-background-color); // } // } // &.row--hover { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-hover-background-color); + // background-color: var(--vxe-ui-table-row-hover-background-color); // } // &.row--stripe { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-hover-striped-background-color); + // background-color: var(--vxe-ui-table-row-hover-striped-background-color); // } // } // &.row--radio { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-hover-radio-checked-background-color); + // background-color: var(--vxe-ui-table-row-hover-radio-checked-background-color); // } // } // &.row--checked { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-hover-checkbox-checked-background-color); + // background-color: var(--vxe-ui-table-row-hover-checkbox-checked-background-color); // } // } // &.row--current { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-row-hover-current-background-color); + // background-color: var(--vxe-ui-table-row-hover-current-background-color); // } // } // } @@ -602,13 +612,13 @@ .vxe-header--column { &:not(.col--seq) { &:hover { - background-color: var(--vxe-table-column-hover-background-color); + background-color: var(--vxe-ui-table-column-hover-background-color); } } } } &.cell--area { - .vxe-table--main-wrapper { + .vxe-body--row { user-select: none; } } @@ -621,15 +631,15 @@ .vxe-body--column, .vxe-footer--column { position: relative; - line-height: var(--vxe-table-row-line-height); + line-height: var(--vxe-ui-table-row-line-height); text-align: left; &:not(.col--ellipsis) { - padding: var(--vxe-table-column-padding-default); + padding: var(--vxe-ui-table-column-padding-default); } &.col--current { - background-color: var(--vxe-table-column-current-background-color); + background-color: var(--vxe-ui-table-column-current-background-color); // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-column-current-background-color); + // background-color: var(--vxe-ui-table-column-current-background-color); // } } &.col--center { @@ -645,7 +655,7 @@ // .vxe-footer--column { // &.col--current { // .vxe-tree--btn-wrapper { - // background-color: var(--vxe-table-column-current-background-color); + // background-color: var(--vxe-ui-table-column-current-background-color); // } // } // } @@ -668,13 +678,13 @@ /*边框*/ .vxe-table--footer-wrapper { - border-top: var(--vxe-table-border-width) solid var(--vxe-table-border-color); + border-top: var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color); } &.border--default, &.border--full, &.border--outer { .vxe-table--header-wrapper { - background-color: var(--vxe-table-header-background-color); + background-color: var(--vxe-ui-table-header-background-color); } } &.border--default, @@ -682,9 +692,9 @@ .vxe-header--column, .vxe-body--column, .vxe-footer--column { - background-image: linear-gradient(var(--vxe-table-border-color), var(--vxe-table-border-color)); + background-image: linear-gradient(var(--vxe-ui-table-border-color), var(--vxe-ui-table-border-color)); background-repeat: no-repeat; - background-size: 100% var(--vxe-table-border-width); + background-size: 100% var(--vxe-ui-table-border-width); background-position: right bottom; } } @@ -692,15 +702,15 @@ .vxe-header--column, .vxe-body--column, .vxe-footer--column { - background-image: linear-gradient(var(--vxe-table-border-color), var(--vxe-table-border-color)), linear-gradient(var(--vxe-table-border-color), var(--vxe-table-border-color)); + background-image: linear-gradient(var(--vxe-ui-table-border-color), var(--vxe-ui-table-border-color)), linear-gradient(var(--vxe-ui-table-border-color), var(--vxe-ui-table-border-color)); background-repeat: no-repeat; - background-size: var(--vxe-table-border-width) 100%, 100% var(--vxe-table-border-width); + background-size: var(--vxe-ui-table-border-width) 100%, 100% var(--vxe-ui-table-border-width); background-position: right top, right bottom; } .vxe-table--fixed-left-wrapper { - // border-right: 1px solid var(--vxe-table-border-color); + // border-right: 1px solid var(--vxe-ui-table-border-color); .vxe-body--column{ - border-right-color: var(--vxe-table-border-color); + border-right-color: var(--vxe-ui-table-border-color); } } } @@ -712,9 +722,9 @@ .vxe-header--row { &:last-child { .vxe-header--gutter { - background-image: linear-gradient(var(--vxe-table-border-color), var(--vxe-table-border-color)); + background-image: linear-gradient(var(--vxe-ui-table-border-color), var(--vxe-ui-table-border-color)); background-repeat: no-repeat; - background-size: 100% var(--vxe-table-border-width); + background-size: 100% var(--vxe-ui-table-border-width); background-position: right bottom; } } @@ -724,7 +734,7 @@ &.border--inner, &.border--none { .vxe-table--header-wrapper { - background-color: var(--vxe-table-header-background-color); + background-color: var(--vxe-ui-table-header-background-color); } .vxe-table--fixed-left-wrapper { border-right: 0; @@ -745,23 +755,23 @@ } &.size--medium { - font-size: var(--vxe-font-size-medium); + font-size: var(--vxe-ui-font-size-medium); .vxe-table--empty-placeholder, .vxe-table--empty-block { - min-height: var(--vxe-table-row-height-medium); + min-height: var(--vxe-ui-table-row-height-medium); } .vxe-header--column, .vxe-body--column, .vxe-footer--column { &:not(.col--ellipsis) { - padding: var(--vxe-table-column-padding-medium); + padding: var(--vxe-ui-table-column-padding-medium); } } .vxe-cell { .vxe-default-input, .vxe-default-textarea, .vxe-default-select { - height: var(--vxe-input-height-medium); + height: var(--vxe-ui-input-height-medium); } .vxe-default-input { &[type="date"]::-webkit-inner-spin-button { @@ -771,23 +781,23 @@ } } &.size--small { - font-size: var(--vxe-font-size-small); + font-size: var(--vxe-ui-font-size-small); .vxe-table--empty-placeholder, .vxe-table--empty-block { - min-height: var(--vxe-table-row-height-small); + min-height: var(--vxe-ui-table-row-height-small); } .vxe-header--column, .vxe-body--column, .vxe-footer--column { &:not(.col--ellipsis) { - padding: var(--vxe-table-column-padding-small); + padding: var(--vxe-ui-table-column-padding-small); } } .vxe-cell { .vxe-default-input, .vxe-default-textarea, .vxe-default-select { - height: var(--vxe-input-height-small); + height: var(--vxe-ui-input-height-small); } .vxe-default-input { &[type="date"]::-webkit-inner-spin-button { @@ -797,23 +807,23 @@ } } &.size--mini { - font-size: var(--vxe-font-size-mini); + font-size: var(--vxe-ui-font-size-mini); .vxe-table--empty-placeholder, .vxe-table--empty-block { - min-height: var(--vxe-table-row-height-mini); + min-height: var(--vxe-ui-table-row-height-mini); } .vxe-header--column, .vxe-body--column, .vxe-footer--column { &:not(.col--ellipsis) { - padding: var(--vxe-table-column-padding-mini); + padding: var(--vxe-ui-table-column-padding-mini); } } .vxe-cell { .vxe-default-input, .vxe-default-textarea, .vxe-default-select { - height: var(--vxe-input-height-mini); + height: var(--vxe-ui-input-height-mini); } .vxe-default-input { &[type="date"]::-webkit-inner-spin-button { @@ -825,13 +835,13 @@ .vxe-cell { white-space: pre-line; word-break: break-all; - padding-left: var(--vxe-table-cell-padding-left); - padding-right: var(--vxe-table-cell-padding-right); + padding-left: var(--vxe-ui-table-cell-padding-left); + padding-right: var(--vxe-ui-table-cell-padding-right); } // 单元格占位符 .vxe-cell--placeholder { - color: var(--vxe-table-cell-placeholder-color); + color: var(--vxe-ui-table-cell-placeholder-color); } // 单选框和复选框 @@ -877,13 +887,13 @@ left: 0; width: 200px; &.scrolling--middle { - box-shadow: var(--vxe-table-fixed-left-scrolling-box-shadow); + box-shadow: var(--vxe-ui-table-fixed-left-scrolling-box-shadow); } } .vxe-table--fixed-right-wrapper { right: 0; &.scrolling--middle { - box-shadow: var(--vxe-table-fixed-right-scrolling-box-shadow); + box-shadow: var(--vxe-ui-table-fixed-right-scrolling-box-shadow); } } .vxe-table--header-wrapper, @@ -927,7 +937,7 @@ content: ""; display: block; height: 100%; - background-color: var(--vxe-table-resizable-drag-line-color); + background-color: var(--vxe-ui-table-resizable-drag-line-color); } } @@ -940,7 +950,7 @@ height: 100%; z-index: 10; pointer-events: none; - border: var(--vxe-table-border-width) solid var(--vxe-table-border-color); + border: var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color); } /*树形节点*/ @@ -969,8 +979,8 @@ bottom: -0.9em; width: 0.8em; border-width: 0 0 1px 1px; - border-style: var(--vxe-table-tree-node-line-style); - border-color: var(--vxe-table-tree-node-line-color); + border-style: var(--vxe-ui-table-tree-node-line-style); + border-color: var(--vxe-ui-table-tree-node-line-color); pointer-events: none; } .vxe-cell--tree-node { @@ -983,15 +993,17 @@ height: 1em; text-align: center; transform: translateY(-50%); + // background-color: var(--vxe-ui-layout-background-color); z-index: 1; user-select: none; cursor: pointer; } .vxe-tree--node-btn { display: block; - color: var(--vxe-font-lighten-color); + color: var(--vxe-ui-font-lighten-color); + @include createAnimationTransition(transform); &:hover { - color: var(--vxe-font-color); + color: var(--vxe-ui-font-color); } } .vxe-tree-cell { @@ -1019,17 +1031,28 @@ height: 1em; text-align: center; user-select: none; - color: var(--vxe-font-lighten-color); + color: var(--vxe-ui-font-lighten-color); + @include createAnimationTransition(transform); &:hover { - color: var(--vxe-font-color); + color: var(--vxe-ui-font-color); } } &+.vxe-table--expand-label { padding-left: 0.5em; } } + .vxe-body--expanded-row { + &.is--padding { + & > .vxe-body--expanded-column { + & > .vxe-body--expanded-cell { + padding: var(--vxe-ui-table-expand-padding-default); + } + } + } + } .vxe-body--expanded-column { - border-bottom: var(--vxe-table-border-width) solid var(--vxe-table-border-color); + border-bottom: var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color); + border-right: var(--vxe-ui-table-border-width) solid var(--vxe-ui-table-border-color); &.col--ellipsis { & > .vxe-body--expanded-cell { overflow: hidden; @@ -1076,11 +1099,13 @@ @extend %DefaultColumnHeight; &:not(.col--active) { & > .vxe-cell { - @extend %TextEllipsis; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } } & > .vxe-cell { - max-height: var(--vxe-table-row-height-default); + max-height: var(--vxe-ui-table-row-height-default); } } } @@ -1091,7 +1116,7 @@ &.col--ellipsis { @extend %MediumColumnHeight; & > .vxe-cell { - max-height: var(--vxe-table-row-height-medium); + max-height: var(--vxe-ui-table-row-height-medium); } } } @@ -1109,7 +1134,7 @@ &.col--ellipsis { @extend %SmallColumnHeight; & > .vxe-cell { - max-height: var(--vxe-table-row-height-small); + max-height: var(--vxe-ui-table-row-height-small); } } } @@ -1127,7 +1152,7 @@ &.col--ellipsis { @extend %MiniColumnHeight; & > .vxe-cell { - max-height: var(--vxe-table-row-height-mini); + max-height: var(--vxe-ui-table-row-height-mini); } } } @@ -1142,7 +1167,7 @@ /*暂无数据*/ .vxe-table--empty-placeholder, .vxe-table--empty-block { - min-height: var(--vxe-table-row-height-default); + min-height: var(--vxe-ui-table-row-height-default); justify-content: center; align-items: center; text-align: center; @@ -1174,7 +1199,7 @@ .vxe-body--column { &.col--selected { - box-shadow: inset 0px 0px 0px 2px var(--vxe-primary-color); + box-shadow: inset 0px 0px 0px 2px var(--vxe-ui-font-primary-color); } } @@ -1194,24 +1219,24 @@ transform: translateX(-50%); text-align: left; z-index: 4; - padding-left: var(--vxe-table-cell-padding-left); - padding-right: var(--vxe-table-cell-padding-right); + padding-left: var(--vxe-ui-table-cell-padding-left); + padding-right: var(--vxe-ui-table-cell-padding-right); .vxe-cell--valid-error-msg { display: inline-block; - border-radius: var(--vxe-border-radius); - color: var(--vxe-table-validate-error-color); - background-color: var(--vxe-table-validate-error-background-color); + border-radius: var(--vxe-ui-border-radius); + color: var(--vxe-ui-table-validate-error-color); + background-color: var(--vxe-ui-table-validate-error-background-color); pointer-events: auto; } } .vxe-default-input, .vxe-default-textarea, .vxe-default-select { - border-color: var(--vxe-table-validate-error-color); + border-color: var(--vxe-ui-table-validate-error-color); } .vxe-input { > .vxe-input--inner { - border-color: var(--vxe-table-validate-error-color); + border-color: var(--vxe-ui-table-validate-error-color); } } @@ -1255,7 +1280,7 @@ z-index: 4; .vxe-cell--valid-error-msg { display: inline-block; - border-radius: $vxe-border-radius; + border-radius: -var(-vxe-border-radius); padding: 8px 12px; color: #fff; background-color: #f56c6c; @@ -1286,7 +1311,7 @@ /*单元格标记删除状态*/ .vxe-body--row { &.row--pending { - color: var(--vxe-table-validate-error-color); + color: var(--vxe-ui-table-validate-error-color); text-decoration: line-through; cursor: no-drop; .vxe-body--column { @@ -1298,7 +1323,7 @@ left: 0; width: 100%; height: 0; - border-bottom: 1px solid var(--vxe-table-validate-error-color); + border-bottom: 1px solid var(--vxe-ui-table-validate-error-color); z-index: 1; } } @@ -1312,12 +1337,12 @@ position: relative; &:before { content: ""; - top: calc(var(--vxe-table-cell-dirty-width) * -1); - left: calc(var(--vxe-table-cell-dirty-width) * -1); + top: calc(var(--vxe-ui-table-cell-dirty-width) * -1); + left: calc(var(--vxe-ui-table-cell-dirty-width) * -1); position: absolute; - border-width: var(--vxe-table-cell-dirty-width); + border-width: var(--vxe-ui-table-cell-dirty-width); border-style: solid; - border-color: transparent var(--vxe-table-cell-dirty-insert-color) transparent transparent; + border-color: transparent var(--vxe-ui-table-cell-dirty-insert-color) transparent transparent; transform: rotate(45deg); } } @@ -1328,12 +1353,12 @@ position: relative; &:before { content: ""; - top: calc(var(--vxe-table-cell-dirty-width) * -1); - left: calc(var(--vxe-table-cell-dirty-width) * -1); + top: calc(var(--vxe-ui-table-cell-dirty-width) * -1); + left: calc(var(--vxe-ui-table-cell-dirty-width) * -1); position: absolute; - border-width: var(--vxe-table-cell-dirty-width); + border-width: var(--vxe-ui-table-cell-dirty-width); border-style: solid; - border-color: transparent var(--vxe-table-cell-dirty-update-color) transparent transparent; + border-color: transparent var(--vxe-ui-table-cell-dirty-update-color) transparent transparent; transform: rotate(45deg); } } @@ -1344,9 +1369,9 @@ &.cell--highlight { .vxe-body--column { &.col--active { - box-shadow: inset 0px 0px 0px 2px var(--vxe-primary-color); + box-shadow: inset 0px 0px 0px 2px var(--vxe-ui-font-primary-color); &.col--valid-error { - box-shadow: inset 0px 0px 0px 2px var(--vxe-table-validate-error-color); + box-shadow: inset 0px 0px 0px 2px var(--vxe-ui-table-validate-error-color); } .vxe-cell { .vxe-default-input, @@ -1355,7 +1380,7 @@ padding: 0; } .vxe-default-input { - height: var(--vxe-table-row-line-height); + height: var(--vxe-ui-table-row-line-height); } .vxe-input { .vxe-input--inner { @@ -1364,7 +1389,7 @@ } } .vxe-textarea { - height: calc(var(--vxe-table-row-line-height) - 1px); + height: calc(var(--vxe-ui-table-row-line-height) - 1px); .vxe-textarea--inner { border: 0; } @@ -1386,8 +1411,8 @@ div.vxe-table--tooltip-wrapper { &.vxe-table--valid-error { padding: 0; - color: var(--vxe-table-validate-error-color); - background-color: var(--vxe-table-validate-error-background-color); + color: var(--vxe-ui-table-validate-error-color); + background-color: var(--vxe-ui-table-validate-error-background-color); &.old-cell-valid { padding: 8px 12px; background-color: #f56c6c; @@ -1398,7 +1423,7 @@ div.vxe-table--tooltip-wrapper { /*footer*/ .vxe-table--footer-wrapper { - color: var(--vxe-table-footer-font-color); + color: var(--vxe-ui-table-footer-font-color); margin-top: -1px; &.body--wrapper{ overflow-x: auto; diff --git a/styles/toolbar.scss b/styles/components/toolbar.scss similarity index 71% rename from styles/toolbar.scss rename to styles/components/toolbar.scss index 931c1def03..0c0152ed77 100644 --- a/styles/toolbar.scss +++ b/styles/components/toolbar.scss @@ -1,5 +1,4 @@ -/**Variable**/ -@import './helpers/mixin.scss'; +@import '../helpers/mixin.scss'; /*toolbar*/ .vxe-toolbar { @@ -8,9 +7,9 @@ flex-direction: row; align-items: center; padding: 0.6em 0; - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); - background-color: var(--vxe-toolbar-background-color); + color: var(--vxe-ui-font-color); + font-family: var(--vxe-ui-font-family); + background-color: var(--vxe-ui-layout-background-color); &:after { content: ""; display: block; @@ -20,9 +19,9 @@ visibility: hidden; } &.is--perfect { - border: 1px solid var(--vxe-table-border-color); + border: 1px solid var(--vxe-ui-table-border-color); border-bottom-width: 0; - background-color: var(--vxe-table-header-background-color); + background-color: var(--vxe-ui-table-header-background-color); } &.is--loading { &:before { @@ -32,9 +31,9 @@ left: 0; width: 100%; height: 100%; - z-index: var(--vxe-loading-z-index); + z-index: 999; user-select: none; - background-color: var(--vxe-loading-background-color); + background-color: var(--vxe-ui-loading-background-color); } } .vxe-buttons--wrapper { @@ -82,7 +81,7 @@ position: relative; &.is--active { & > .vxe-button { - background-color: var(--vxe-toolbar-custom-active-background-color); + background-color: var(--vxe-ui-toolbar-custom-active-background-color); border-radius: 50%; } } @@ -90,14 +89,14 @@ } .vxe-toolbar { - font-size: var(--vxe-font-size); + font-size: var(--vxe-ui-font-size-default); &.size--medium { - font-size: var(--vxe-font-size-medium); + font-size: var(--vxe-ui-font-size-medium); } &.size--small { - font-size: var(--vxe-font-size-small); + font-size: var(--vxe-ui-font-size-small); } &.size--mini { - font-size: var(--vxe-font-size-mini); + font-size: var(--vxe-ui-font-size-mini); } } \ No newline at end of file diff --git a/styles/components/ui.scss b/styles/components/ui.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/styles/components/v-x-e-table.scss b/styles/components/v-x-e-table.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/styles/css-variable.scss b/styles/css-variable.scss deleted file mode 100644 index b9d1ac1608..0000000000 --- a/styles/css-variable.scss +++ /dev/null @@ -1,4 +0,0 @@ -/**Variable**/ - -// 该文件已废弃，请使用 vxe-table/styles/theme/default.scss -@import './theme/default.scss'; \ No newline at end of file diff --git a/styles/cssvar.scss b/styles/cssvar.scss index b6674f6490..439a68fce3 100644 --- a/styles/cssvar.scss +++ b/styles/cssvar.scss @@ -1,3 +1,3 @@ -@import './variable.scss'; -@import './theme/default.scss'; -@import './theme/dark.scss'; \ No newline at end of file +/*已废弃*/ + +@import './base.scss'; \ No newline at end of file diff --git a/styles/default.scss b/styles/default.scss deleted file mode 100644 index 635fb3050b..0000000000 --- a/styles/default.scss +++ /dev/null @@ -1,3 +0,0 @@ -// 该文件已废弃，请使用 vxe-table/styles/all.scss - -@import './modules.scss'; \ No newline at end of file diff --git a/styles/drawer.scss b/styles/drawer.scss deleted file mode 100644 index cd6689b485..0000000000 --- a/styles/drawer.scss +++ /dev/null @@ -1,215 +0,0 @@ -/**Variable**/ -@import './helpers/mixin.scss'; - -.vxe-drawer--wrapper { - display: none; - position: fixed; - top: 0; - left: 0; - line-height: 1.5; - width: calc(100% + 18px); - height: calc(100% + 18px); - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); - &.is--active { - display: block; - } - &.is--visible { - &.is--mask { - &:before { - background-color: rgba(0, 0, 0, 0.5); - } - } - - &.pos--left { - .vxe-drawer--box { - left: 0; - } - } - &.pos--right { - .vxe-drawer--box { - right: 0; - } - } - &.pos--top { - .vxe-drawer--box { - top: 0; - } - } - &.pos--bottom { - .vxe-drawer--box { - bottom: 0; - } - } - .vxe-drawer--box { - opacity: 1; - } - } - &.is--loading { - .vxe-drawer--header, - .vxe-drawer--footer { - position: relative; - border-bottom-color: var(--vxe-loading-background-color); - &:before { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: 1; - user-select: none; - background-color: var(--vxe-loading-background-color); - } - } - } - &:not(.lock--view) { - pointer-events: none; - } - &.lock--scroll { - overflow: hidden; - } - &:not(.lock--scroll) { - overflow: auto; - } - &.lock--view, - &.is--mask { - &:before { - content: ""; - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: -1; - pointer-events: auto; - } - } - &.is--mask { - &:before { - background-color: rgba(0, 0, 0, 0); - @include createAnimationTransition(background-color, 0.2s); - } - } - &.pos--left { - .vxe-drawer--box { - top: 0; - left: -100%; - box-shadow: 2px 0 10px 0 rgba(0, 0, 0, 0.2); - } - } - &.pos--right { - .vxe-drawer--box { - top: 0; - right: -100%; - box-shadow: -2px 0 10px 0 rgba(0, 0, 0, 0.2); - } - } - &.pos--top { - .vxe-drawer--box { - top: -100%; - left: 0; - box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2); - } - } - &.pos--bottom { - .vxe-drawer--box { - bottom: -100%; - left: 0; - box-shadow: 0 -2px 10px 0 rgba(0, 0, 0, 0.2); - } - } - &.pos--left, - &.pos--right { - .vxe-drawer--box { - width: 30%; - height: 100%; - } - } - &.pos--top, - &.pos--bottom { - .vxe-drawer--box { - width: 100%; - height: 30%; - } - } - - .vxe-drawer--box { - display: flex; - flex-direction: column; - position: fixed; - background-color: var(--vxe-drawer-body-background-color); - border: 1px solid var(--vxe-drawer-border-color); - text-align: left; - pointer-events: auto; - opacity: 0; - @include createAnimationTransition(all, 0.3s); - } - .vxe-drawer--content { - flex-grow: 1; - padding: 0.8em 1em; - white-space: pre-line; - } - .vxe-drawer--header, - .vxe-drawer--body, - .vxe-drawer--footer { - position: relative; - } - .vxe-drawer--body { - display: flex; - flex-grow: 1; - overflow: auto; - .vxe-drawer--content { - overflow: auto; - } - } - .vxe-drawer--header { - display: flex; - flex-direction: row; - flex-shrink: 0; - font-size: 1.1em; - font-weight: 700; - border-bottom: 1px solid var(--vxe-drawer-border-color); - background-color: var(--vxe-drawer-header-background-color); - &.is--ellipsis { - .vxe-drawer--header-title { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - } - } - .vxe-drawer--header-title { - flex-grow: 1; - padding: 0.6em 0 0.6em 1em; - } - .vxe-drawer--header-right { - flex-shrink: 0; - padding: 0.6em 1em 0.6em 0; - } - .vxe-drawer--close-btn { - cursor: pointer; - margin-left: 0.6em; - &:hover { - color: var(--vxe-primary-color); - } - } - .vxe-drawer--footer { - flex-shrink: 0; - text-align: right; - padding: 0.4em 1em 0.8em 1em; - } -} - -.vxe-drawer--wrapper { - font-size: var(--vxe-font-size); - &.size--medium { - font-size: var(--vxe-font-size-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - } -} \ No newline at end of file diff --git a/styles/edit.scss b/styles/edit.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/edit.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/footer.scss b/styles/footer.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/footer.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/form-gather.scss b/styles/form-gather.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/form-gather.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/form-item.scss b/styles/form-item.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/form-item.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/form.scss b/styles/form.scss deleted file mode 100644 index a072335a76..0000000000 --- a/styles/form.scss +++ /dev/null @@ -1,364 +0,0 @@ -/**Variable**/ -%ButtonHover { - color: var(--vxe-primary-lighten-color); - border-color: var(--vxe-primary-lighten-color); -} - -.vxe-form { - position: relative; - font-size: var(--vxe-font-size); - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); - background-color: var(--vxe-form-background-color); - text-align: left; -} - -.vxe-form--item-row { - display: flex; - flex-direction: row; - flex-wrap: wrap; - $spans: 4.16667%, 8.33333%, 12.5%, 16.66667%, 20.83333%, 25%, 29.16667%, 33.33333%, - 37.5%, 41.66667%, 45.83333%, 50%, 54.16667%, 58.33333%, 62.5%, 66.66667%, - 70.83333%, 75%, 79.16667%, 83.33333%, 87.5%, 91.66667%, 95.83333%, 100%; - @for $index from 0 to length($spans) { - & > .vxe-form--item-col_#{$index + 1} { - width: nth($spans, $index + 1); - } - } -} - -.vxe-form-slots { - display: none; -} - -.vxe-form--item-content, -.vxe-form--item-trigger-node { - display: inline-block; - vertical-align: middle; -} - -.vxe-form--item-title { - display: flex; - flex-direction: row; - max-width: 320px; - padding-right: 0.8em; - &.is--ellipsis { - .vxe-form--item-title-content { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - } - .vxe-form--item-title-prefix, - .vxe-form--item-title-suffix, - .vxe-form--item-title-postfix { - flex-shrink: 0; - } - .vxe-form--item-title-prefix, - .vxe-form--item-title-suffix { - cursor: help; - vertical-align: middle; - } - .vxe-form--item-title-prefix { - margin-right: 0.25em; - } - .vxe-form--item-title-suffix { - margin-left: 0.2em; - } - .vxe-form--item-title-postfix { - display: flex; - align-items: center; - } - .vxe-form--item-title-content { - flex-grow: 1; - } - .vxe-form--item-title-label { - vertical-align: middle; - } -} - -.vxe-form--item-trigger-node { - font-size: 12px; - min-width: 100px; - color: #909399; - text-align: center; - user-select: none; - cursor: pointer; - .vxe-form--item-trigger-icon { - display: inline-block; - margin: 0 0.25em; - transition: all 0.1s; - } -} - -.vxe-form--item-valid { - position: absolute; - width: 100%; - font-size: 12px; - line-height: 1.2em; - color: var(--vxe-form-validate-error-color); - background-color: var(--vxe-form-validate-error-background-color); - z-index: 1; - opacity: 0; - transform-origin: center top; - transform: scaleY(0); - transition: all 0.2s ease-in-out; -} - -.vxe-form { - .vxe-form--gather { - display: inline-flex; - flex-direction: row; - flex-wrap: wrap; - align-content: flex-start; - } - .vxe-form--wrapper { - display: flex; - flex-direction: row; - flex-wrap: wrap; - } - .vxe-form--item { - display: none; - padding: 0.5em 0.8em 0.5em 0; - &.is--vertical { - padding: 0.25em 0 0.25em 0; - } - &.is--active { - &:not(.is--hidden) { - display: inline-flex; - } - } - } -} - -.vxe-form--item { - &.is--colon { - .vxe-form--item-title-postfix { - &:after { - content: ":"; - font-weight: normal; - margin-left: 0.2em; - } - } - } - &.is--asterisk { - &.is--required { - .vxe-form--item-title-content { - &:before { - content: "*"; - color: var(--vxe-form-validate-error-color); - font-family: Verdana,Arial,Tahoma; - margin-right: 0.2em; - font-weight: normal; - vertical-align: middle; - } - } - } - } - &.is--vertical { - .vxe-form--item-inner { - flex-direction: column; - align-items: initial; - .vxe-form--item-title { - height: 2.2em; - line-height: 2.2em; - padding-right: 0; - max-width: none; - } - .vxe-form--item-title-content { - flex-grow: initial; - } - } - } - &.is--span { - .vxe-default-input:not([type="submit"]):not([type="reset"]), - .vxe-default-textarea, - .vxe-default-select, - .vxe-input, - .vxe-textarea, - .vxe-select { - width: 100%; - } - } - &.is--error { - .vxe-input > .vxe-input--inner, - .vxe-textarea > .vxe-textarea--inner, - .vxe-select, - .vxe-select.is--active > .vxe-input .vxe-input--inner, - .vxe-default-input, - .vxe-default-textarea, - .vxe-default-select { - border-color: var(--vxe-form-validate-error-color); - } - .vxe-input>.vxe-input--inner, - .vxe-textarea>.vxe-textarea--inner, - .vxe-default-input[type="text"], - .vxe-default-input[type="search"], - .vxe-default-textarea, - .vxe-default-select { - &:focus { - border-color: var(--vxe-form-validate-error-color); - } - } - .vxe-form--item-valid { - opacity: 1; - transform: scaleY(1); - } - } - .vxe-form--item-inner { - display: flex; - flex-direction: row; - align-items: center; - flex-grow: 1; - .vxe-form--item-title { - flex-shrink: 0; - } - .vxe-form--item-content { - position: relative; - flex-grow: 1; - word-break: break-all; - } - } - .vxe-default-input, - .vxe-default-textarea, - .vxe-default-select { - outline: 0; - border: 1px solid var(--vxe-input-border-color); - border-radius: var(--vxe-border-radius); - } - .vxe-default-input, - .vxe-default-select { - height: var(--vxe-button-height-default); - } - .vxe-default-input { - padding: 0 0.8em; - } - .vxe-default-textarea { - height: calc(var(--vxe-button-height-default) * 2); - padding: 0.3em 0.6em; - } - .vxe-default-input[type="number"] { - padding-right: 0.2em; - } - .vxe-default-input[type="text"], - .vxe-default-input[type="search"] { - padding: 0 1em; - } - .vxe-default-input[type="text"], - .vxe-default-input[type="search"], - .vxe-default-textarea, - .vxe-default-select { - color: var(--vxe-font-color); - &:focus { - border: 1px solid var(--vxe-primary-color); - } - &[disabled] { - cursor: not-allowed; - background-color: var(--vxe-input-disabled-background-color); - } - } - .vxe-default-input[type="submit"], - .vxe-default-input[type="reset"] { - line-height: calc(var(--vxe-button-height-default) - 2px); - background-color: #fff; - cursor: pointer; - &:hover { - @extend %ButtonHover; - } - &:active { - color: var(--vxe-primary-darken-color); - border-color: var(--vxe-primary-darken-color); - } - } - .vxe-default-input { - &[type="date"]::-webkit-inner-spin-button { - margin-top: 6px; - } - &[type="date"]::-webkit-inner-spin-button, - &[type="number"]::-webkit-inner-spin-button { - height: 24px; - } - &::placeholder { - color: var(--vxe-input-placeholder-color); - } - } - .vxe-default-input[type="text"], - .vxe-default-input[type="search"], - .vxe-default-textarea, - .vxe-default-select { - width: 180px; - } - .vxe-default-textarea { - resize: none; - vertical-align: middle; - &::placeholder { - color: var(--vxe-input-placeholder-color); - } - } -} - -.vxe-form { - .vxe-form--item-inner { - min-height: var(--vxe-form-item-min-height-default); - & > .align--center { - text-align: center; - } - & > .align--left { - text-align: left; - } - & > .align--right { - text-align: right; - } - } - &.size--medium { - font-size: var(--vxe-font-size-medium); - .vxe-form--item-inner { - min-height: var(--vxe-form-item-min-height-medium); - } - .vxe-default-input[type="submit"], - .vxe-default-input[type="reset"] { - line-height: calc(var(--vxe-button-height-medium) - 2px); - } - .vxe-default-input, - .vxe-default-select { - height: var(--vxe-button-height-medium); - } - .vxe-default-textarea { - height: calc(var(--vxe-button-height-medium) * 2); - } - } - &.size--small { - font-size: var(--vxe-font-size-small); - .vxe-form--item-inner { - min-height: var(--vxe-form-item-min-height-small); - } - .vxe-default-input[type="submit"], - .vxe-default-input[type="reset"] { - line-height: calc(var(--vxe-button-height-small) - 2px); - } - .vxe-default-input, - .vxe-default-select { - height: var(--vxe-button-height-small); - } - .vxe-default-textarea { - height: calc(var(--vxe-button-height-small) * 2); - } - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - .vxe-form--item-inner { - min-height: var(--vxe-form-item-min-height-mini); - } - .vxe-default-input[type="submit"], - .vxe-default-input[type="reset"] { - line-height: calc(var(--vxe-button-height-mini) - 2px); - } - .vxe-default-input, - .vxe-default-select { - height: var(--vxe-button-height-mini); - } - .vxe-default-textarea { - height: calc(var(--vxe-button-height-mini) * 2); - } - } -} \ No newline at end of file diff --git a/styles/header.scss b/styles/header.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/header.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/helpers/mixin.scss b/styles/helpers/mixin.scss index df1ff858aa..698be1c0f3 100644 --- a/styles/helpers/mixin.scss +++ b/styles/helpers/mixin.scss @@ -7,23 +7,23 @@ font-size: 1.34em; } .vxe-checkbox--icon { - color: var(--vxe-input-border-color); + color: var(--vxe-ui-input-border-color); vertical-align: middle; font-weight: 700; user-select: none; } &.is--checked, &.is--indeterminate { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); .vxe-checkbox--icon { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } } &:not(.is--disabled) { cursor: pointer; &:hover { .vxe-checkbox--icon { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } } } @@ -31,10 +31,10 @@ cursor: default; } &.is--disabled { - color: var(--vxe-font-disabled-color); + color: var(--vxe-ui-font-disabled-color); cursor: not-allowed; .vxe-checkbox--icon { - color: var(--vxe-input-disabled-color); + color: var(--vxe-ui-input-disabled-color); } } .vxe-checkbox--label { @@ -49,30 +49,30 @@ font-size: 1.4em; } .vxe-radio--icon { - color: var(--vxe-input-border-color); + color: var(--vxe-ui-input-border-color); vertical-align: middle; font-weight: 700; user-select: none; } &.is--checked { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); .vxe-radio--icon { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } } &:not(.is--disabled) { cursor: pointer; &:hover { .vxe-radio--icon { - color: var(--vxe-primary-color); + color: var(--vxe-ui-font-primary-color); } } } &.is--disabled { - color: var(--vxe-font-disabled-color); + color: var(--vxe-ui-font-disabled-color); cursor: not-allowed; .vxe-radio--icon { - color: var(--vxe-input-disabled-color); + color: var(--vxe-ui-input-disabled-color); } } .vxe-radio--label { diff --git a/styles/icon.scss b/styles/icon.scss deleted file mode 100644 index 98da310441..0000000000 --- a/styles/icon.scss +++ /dev/null @@ -1,787 +0,0 @@ -@import './old-icon.scss'; - -@font-face { - font-family: "vxeiconfont"; - src: - url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAEUIAAsAAAAAlqwAAES3AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACbdgqB7UiBwgcBNgIkA4VMC4JoAAQgBYULB5I9G75+B8Tb9wjQHQDssUoRoyiRs3BU1Kw5ip39/5+RdIwhjBwCWt7yQooTdYaLJ2RIAUejV8IpE9069VNEc+ilOqByQEVAFYvruX+wTAkHG9wEbpjtvp/agO6OHJGKtKVftWsTLEkYqR7lX0DCxQQ0FIwhx0pJBy5s5TWceTo49mihPv1v9wxwR5lTVx6eX8d33ryZFdP+31ZJaAAboGT+v6GwbYeSGAqc7kp5eJ5v/b07v92dORyKqFEUXReiUAu/3Nvebja5mfyjGY3wSBzuSumW0h52Y6lasGnT870eZEuJDAr6Q1zCYW8nwLXDw9z6N9aMNTBiLJoaLGFjwNgapLYxQVBqjBYBFQwQEE/AQxsJA8UEK04sjEZPvfvKBYpViPHtcwEwtM7L9WVPqmFsW8sj69ou5Cb7yaFrgg3Extr2lbG6H1cRBXJgE1B6GKHaYi/Nz9EjYHBeyCMOYr53qqeN75K0e0+Qxhs7dmDEBRrCSZfUpcR2XOCM9SP9Sr8HhpZlW7aDYKdAgZYNb1tt/9V5DCMJDaMuNHxxxp1L59qZVXekas+7Js41JSPUSM4+efSFK43TjHx/qv+/2D39tWViHRS4tnUiyhOQNv82tVpN9JSVF+0l9iEWTeIj7oi6vaL5NLL+/BlJo5Ecj8ZyLCskyc5pJAfGcKvY3txYdt46QM4CgyC+aALvaewD+dA+AOgAqL3qiupeT9BWVF7R1kf/H/eMJNBvKxLrnSNPPA2IQsa0mWy5OIa+euk1bqWKA+HJvaqf6RqQRcZCFqJXdLJQSsZXx1eSDrItenhE3zMubaI3YOSiKPUP2ZZ3E6uOOXqNDFE/It8RSbTxNkIx7pZVQYcN07UHDUp25ySL1dOGbRGBVveK1rF6smPE7rfkrCjFieIFzf7rn74OSq2k0DNrZ9YqLAV3nv5R7a8J5DfjnSTsvhCVyKKPslDV1B0vjwsz2sezGfpfwsoF4DZKpCmDYpHIhx+6YKHCSUVQihWHwFF4cr3DxQ+OJdBZfKHU5ujqf7JO4Sk9laczmCXxE6YoLjyqpK5Tn9CE7Iqmbr2BBkwQgRQ04ACuv920evXw4//vyZzKCfn9C7cXsBeMFyEvYl4MviS/jH/Z9ar39dy3e9+vcbmeAt0vSHrq7ZK79JyDm83Ndy1per3zTxeGi2xK61x11NFn51y3Gj88B895xyU8L+QuH/f6uWvhY/OW/TG2KQgYBFfdCw6Dm67brjvc39y/3GvXRNMfnZ9cPxw/nxkE5vQ8igPhuQSNQZAQiPA4NUTHGY6zQNKH36b8U3gAgG6QCBpBAlAADqACGEADNyADXLAHCMEsIMnatLK/n9YN8NvVa6t/6euHocZpKsarJ0+frf/seRfXF79+PM/8z1e05ulFB62smqifn8+dP3n3wu/T3eru4tbvf137yUyfLu1jvMvNxP177/6Dh8veNOftz7/amLz95o6du3bv2bvv0TDDTTDCSKOMNkZ707SkeTvLbKcn6+add8+c3dDJ3/sPHPzi0OEjp44eW9TWho6O31gy0CAn/tu4afOWDz78v51Ft+98dKmBJV/NMVUPy9/rqZevv/n2uyagQIMWfLcGaL7GfN4KGOIPgWCNuOF9gWKVwDCDwDGYINCbINEYCAotgLijIRAPTCEkDCFkvBRvjCUUXBEfTCJ+WCl09CfB+ElCsU7CMYBI8ZvIcVUicE2UWC2x+EXi0Jfo8YMYMJQYMY4koikQK+aSqXglDjyRAjwVJ57JdKyX2fhMavBc5qILmY/rUofFUo/XsgCPpQHzSCPmSxM+l4VYIc1oDWQxOpMleCG/ogNpRysgy/GjrMVE0o1+ZD1+lg04JxtxXjbhpGzFXTmCCzKI3+UUppPLuCVX0Z3cwkX5E1vlf/he/hp6AdYqDD5RHphJYfGpwmGpIqAPxcd4SojLKhLNgFI8Fij8q7S4p3S4r/R4oAx4qMxYpvLxRpWjOVC16Eo14U+1CH+p5WgD1CpsU6uxXa3BTdWBHWotdqpO7FJd2K26sUf1YK/agX3qAB6poxhG/Ybh1DFMoAYxgjqOkdQJjKJOYjR1CmOo02hPncM06jxaAnURC9WV0dctMIu6jdnU/3Ba/YvJ1GN0oz7gHVXZj9hHAGwkINhE8DCb4KMrYcI5iAQsISZhKZGIZUQSTkIkYzmRghVEKlYSFqwnrFhF2B6rCYwlitBBohjnISrQhaifuH4DO4jzGE9cRnfiCnoQf41sr8FFiDejtXGG3jI0AeYT73AQ4j0OQbhwCT4DdJTPEByBz27YzWcY9vCZgcPwOQTb+Rwz6R3jnKJBcBq+kM9wXzxnGHWBbnztxSS+zcV++LkXDfzhTyMJnDMkcppIYuKSGVI4Fank2+JPV4C0Copp0PupAXfsq7rMKdAXoDi1akatNsPmgmyiDjRESKcAWtF2LQWN2ehGm41D052TSKrdgllQM9SyIw9KQC2RQI4IIwVRVm5iUGBQmioo0t+QGOLpaFkV94TQBrvK0gnbNEtVJRmSMatxkjBq/V2EbCLHVl4iS3pGSpNe1jDGsqwgK6v6LRNVb7ldjl/IkVrdKg2ZGWjeCzNlxBnvKHv/7Ky7vm43DWSKMZ8RYsfzqBaC+WgqeZdHqzxHpPkgGzZkuMW21qEZFsGLho0JYt/a3tcpFLg6g6amqeoNjiFHb6PtPIMabDIUbIv53gfDJPigc1SdGE5QgDqpxWZ14w9eLv46U+c4VWMLUnOtCeDNEIynenDWnCL4nCqBQbM/QNy1g8xhtx3UBht3BlZ/rq6q1oo1HGWlwUwgDhzkEN9qGeKVDhqdjSm1AJmr5KUdgOsAiYx6hXm8G7TdYt12teqtyE42BwDjDH9ZRtidvTL/83uqqkYVVCL7kUj7T0RL+cRhvFHi8hKgB7GoQh+tmFjhw0AIjaGe4skwqiYZKJ60o1ANKHezMEil0qhsQ/nM/MoGe6QIGnasrerYA/vcW1mMPDHkKnRvIAdEjyoEkwyEOceJVSQK0srZ9TgqTMY0p3KpDwvksAQTdK4RkVUYSKTwn9mQzsGIvY8hoz55PPZbYuA4SnhjIPFrLH4E1ih3cOHqrV7WC6nr2aiC150/gZ2CBAo2eiatTYG5Q4GSIS3C5v+GvjAi+Ty6aFoVLB8GzgfGAoqk5KeW3MLucYfmdrmirSVExJJjyAAiJURJFT3Y4WwziR7A5DeSsOsVDn697qqzVadaKCoyhxf7tlaSfKL8XOyag65ecaMmadcy3SVrrmoLRDjsrswYBqwW6D4vfzO8c3HjNJJGDbzjlUn8Ozr5WgVCXZ65n8Y42pDanDyS+djMDMqIqXwnnsoL5vE26g8a9bjFBterJgcG79/7mq//QfTIO5LIaNr97V5dRVKGTNcUr/yanq1XS7NvMihCihBXr4Cvz0pfappWURq2p9TKCTfLsowRbgvkUF1jjqsXT8K3xgw8leeg85JJhSVlb8gankfCLEpcukPVfDbV0wzdTa5F/Ma8Pxyb7Dgy5RujhF2ETq4WcVV1uZsEess4slfFs3YjHWuDoHxfRoQD7qwBoElstVaaC3yEBuC76HALAJbvFCXg0h67/KEHXGUzOz2lbuH2SQsGItN3rNsRDow4bqZO3G9rW8njQpuoc9igZn6L6w6jaufhnvnPmKstbrx/qJE2gA/8vjc0BNy6cNOFi/hOB8YQUzVlZ5eQmj3sfKjYG5LBE2MYBmFNYqtFDmw1BkTcmHAjUN2pI64vBEbuvYwGq64OXj7isZw7U6myBWQCE/cTXSpQTaQ1SKo2MCaC8H5o1MZZ/nI4sON3y1++GSfZE/dyZ3l6v52RWOVqtLCCJXt01S8VFabsL4ZyFLHG2qw+KwmqWbLDrQCWoVuyL8d+ByKpWOW4W5JuGKqSaQPovv+N+DuD7QZ0vbyK71a/tFd30AIzFFrdtd+NW5LggfAski/fq025SRLOu85ARvIIKBD0yIbuq/frS289CMu0nxp0Xz3/nSf14ZMinE/FLSn1yRM06JnPzwRvbG2DDOebZztkGhtBj/2ir5kvNc2PQl0xEoVKUTKU5OmrXqbNIQJzoApXowCdgsFjDymSx+P+shs1gdry56Op4RQlzmiSLVwGwFKAfrObQHrSbMQtvtQWQbi36qhEF+C0KgE3eT6vh5qT5b2BUy7YetTVLYO+WNGowVZhaV+FCoVBocThLKiDlBp2uaR19m3P+BnRugUbm3S8mehbjb/Wna851+I0mVL0J1hA9LT9hmSrxroGBShtlIjIpLnp/QarsT+3jOhWP+6qJ7k2Ye6IDE/DUKacqpntA+qmnWULWUSSL+W1MCk19j3FMmweWfIxSRdJxbQPHumjvkob1RppeNEVdz/LftZeM2wYNO7n4jQQnKMK5/Pc56H6Xk7lVsqUu6Z9vnn73I35jeHGPiFUkxtJaCm04HzqbQpiehoo+wECjJ3tsRQ2xwezZNDgjJ04WO7YdWwJGRxHt0nZIdWnmoIB8iA3UhQa6srmbljcqgkJ+FGMfg8ULEWpfLYWBmkcU3vzxXBvLm1n8ui5/+wnQi8DYwWRMEVXWBaB5DUihOsruCz5vETS9hopUqxcjYr6jD6nvhMDuSqNLNVBsR6oBTKVdfMZO51zvCR23KjERcfv8zcdTp4fYUWaHZ9AEVvyl/nNepMluF9Vv9+D0JH/oZaiMySCq8bgAQr+ZcqYqxGdCc3cbXAZ28Ypk8eCvhFF10OEvtj9NFPwA8nhw4QH8edt+HwicO76H8tEr3xZ7lj5S6FF+PGutfR2pzwLjT9P0hhncRskYRXQAHrH7WLOo8cEq8g1t531bbnq+iuK29/6MSbtWSWLRDsrrYSkb1Af+XBHRY7yDokc+uZH8dg3LMK6cX/eaD/nRqF+dP0wRJ8PLbwiiUAmnP9oWh+SbZfLy5O941Vya+fno41RmYAmQ4kAAZ1HASDox1J/Jk8PdYS+y83c+v7bD4eAjNbfJBJNzHLGbLFxY21HbUvXDDKAUhX7PMASpeFhZoHdBnSc20KgJKRjgdVyg2tTByUDRmlviVq5ZOqKyERHqaJjHsSo3+AJslOnQYQd8jt2eVCTMlqmjedynpzckHqpOtsL+q00pTAk4dI74bVp2WkkAZFWi/hj/KIsyH2WzM9qLvjr9D6UMzqD/KnyUF5hSgSRPpfwDu7ImIrCHqrBHQMx7pw7fjTVWakgtrC26SBFgl1UI8ApelXcCCeiDSSP+REaSypRfDj7CkVDOyZjg+dBsZmVXnZAW3JRItqWRGclCAiFJwkDUFpt2trT5g8XxjItpIsUCaExI33DUx1hV59ujVGrKUU+zoTeJuhJM4LpmT1rK0m9UacNEgkamNNKVdXbq2SGnDLJTiUhceDQvK5eyY26sCK1UhmrxU3nwZGIV0DmI8ydB/Zhc+mavB8+/GF3DR2KUcs3nnsxiYvRQHtPyX6S7y6RYUJs/BzLjizPBb02Tp4g9TjtXNvZscMHoG2ow4fPjwSI4JzK23hAGm3Qc8OtmDImtJ1M3sWk62niUSTpIEJNq9yTSwjtyEacJGFZy8uQTXAuOA3mUe7IMZrsrbnIokjyWkSkcWxIHWx8QIAxsK/j9wjeC+LkXb1XbdLmVTJCzBb0Sgy42PNDYXMvLqVd13kG/IDGvjANgPW54wOof1dVoYfFy7o+NICOl6tFpZoddWSNYvDeECKQQpTDSZ5kp5pCyJjDoweSO6J+BWAGmCOyBehtnM4FHPQt9uSarLx1148tu9W3pWyfo1FeuOgkAZwFqQcAp/9FPT2EqHIiDd1N0A9h6lDG6/gy0vDoCVuudKkk/F6aCn2udduO9AJEP0oV5SD2DZ1wsme1Mzm1ipa3QxwG4IewGbCNZAoBIBd323HT/AwRx2LQM+6ENElFAP0vLIiALW/i0Zb2uuf1aQtJqkd6pR535J7GjiPjJy+OGxhE0nKECFfRI79T7H3y3LgP7QP3iB8bi7nC5g7VKQVRzF1NXWZRh9sCrnBEy0aaNzs5dGEaLFhbQAaj5udtI12Y3HvP/fDrOvlm8s3WIcG8pD2LSIcXgKCnM9rG97tHQPZB1pIfCASuj5qcJpBpwyV9b3j7DDBNMuntVRteaxrnJbF/vlNv8KhqNCtxD4k002AkH+iiIYN/oYKoEXl9lW3HUCh9osFRY/cADHgszmhB34qDCDYIRCuCFHtuL5qhL78JjOMrFMnaO5LPE6vHDaIndPMFtwASfdjfFaU+XOpVqZpHWCHJm1gxMgFsOQxnCUJAp5dyTD0hLa5ETToqkxNuasopkMDnzSxoEM3kcyxRGGP5u8ixHDDG8pfRg6yTECLGCAYXWBkpwAyiLIVII0Lo2x8dl4AfE4GMrQzRGQNrqNS4CT/cJZwgE1YFRXLZIR9L2xW1KN9jWNZ2WoWszvaecSiM2XxfY2wZe5ziHMwSv9VRSyjq9bKHqWlP+3NBEDqFQ2Gm/nfFjSFc4FLDijSK/lCeb9Xc+eHh/kc43OqkpcROw8UuCZqWwnvhZHSSGzYXOjenlEK36N6505yulWOs6p/F0qYbd2it620DaoC0xqjFEpBco6J2edgmb3zHLuJpZmqXx8bj0+b8q8qlBNbSGKaV9ZNKPEZTBVdLxFsiYTZr0P3DHS2dAxICJFLYBkUGsekGTW4WvIMepv9QW7s06rPgtVIgqFCbOzylPx4qHYhSoSVKly4u3fp2eoz+uJA1Y5xoEgJqnIBhnQY4gYKg11xquvGQoucWR5GyTVikpRFNQUxkBo9yDzrNBiXsvw9TKzqRl3zOJYV6JLUVTCAvjrpLjCz0HJY+ZZk6OnuXwTOlbM+NS0WHesjClogHg8iKsr/7DzK4AYY+XPwnjFFWjjyReKMNxkke62NCGjEK5HS1XN5PLVPNiNgwrnWNehjEwc0FHa+eAlgsn3EIAzaSkOEvij9GmEXOosVy/UFYNUVxhjyajzUQFvFvuDbJl3tjPU3UAakJRPQET/lZeNxSGFAywqxNMhDl3n1fEp1q4NOFuUYMSJuU8bpIzMpYZwAWrfnF2FpUHOOxmPKx7sQ6s/LK3WDZtmlG03JdQeBywNMuhNIHAVVIQ2U/PJzMIfDvicIA9G2CRVpKsSeIwDBwQEm4aGQewONvWkSIrkzckgQ6CuF9vDz6SCtbMEOf8k8D45nCNIpktnRO8vlscWZQoWRNqjufOvfz9c+8kD2de6EhCeicCy0CPWfnUbJgVO5BJWUle1s4dx4QQyM9fiBqsmw+05/qmRboe7pM5qXKWt6+kqZ9Dd2QVUGyuF+kCg6dRhH5rcFZyag9P1ZeRhcKfcBGrRmPx0E6BRckUyS1FjC5vMPB98odWwhSUE/OgTx9icfcCTl2w1H7e5Ty/tYZnAuhMa0gBmFqH1PqRTEBbDCNTvWLohsYijAIYeFlKmMiMrUkmoev4WljIYnzfgIEvPObffflx982XFVApWJqnDAhGVRKqjwxxgCEhrKEk6HaVPXRmLX4yexHN2fMv3bmzaFP54JTm3wZkEz7pNsVu/zO5Ov1qg0B53wV2ZPwklMmVITki5kuI4tgCBS3UACPtc+xcPTJjVzRTIowVCTlfU4fCEQbi0L0lMxSH2iWPHj8xysfI+ghhoF789ICx6dDJ9HxS8ySX9Sx0eEFgxi2Qjm1CxvkZW5rrxhE786Hw4RA91ux12Fw6DwZJ88oOngQUMH09AYSRUIwnm3XU1OAzADJd+sM6eB7yZxVDWGrRJxrM3hO+BlzISNd7JG7X73YYO7Jx4hN8+hTybkEDxchukfAgcxEyFBzucFZXeqUSShm7u2d3wAeAnyA5UnJ563XlDx7PVRsTV5o17FzWnlNu4xkvoIkTPKX2iRH5Zo+BEu2RLtk78+VlEDNi6vL1Qbsj1njnZUvsxXJpNWZriV7qyYzoXd6M2Jtwkv7vq1aLYwlP/xpBtuKlCbtia7i6lQuk8tubSfQiQX2E81nBKbqKDNBjdYn5g/B9NmR3W76DfwT0RM/musVUBxFMV12gKPIaDESKlvIBxBPxEqrxQwTEWdTe5vqUY+gWxMhUmcqIS176YryWApg6SZWc+SgQFTNef7GrvFLu4cyWZEw0A75J7qRWXYYPS4WTCxH4HvuJDFiYpTtKQ9Y7qMBUHrlkedru5u9LBA9wACYGvAp4T+Ic0PkqGZj/kmzZeR7wHgayd9TCyxfPtTyt7RJeyljksWC2B/VaDy6ziDOpvo2ZCBqvSZtSgqTXkviRXx+TJE8PGbw4EUw4Jy/uEjFaQWYAHFUBtOIsBM2n0xHDQTmVe22FJ0JJyFYkrGrDxcHaclU6M+z20BAhf5AKe+SVrr95ClQGTYt8WcJREpLA+vgUqomYY6yviSgYiFseFzsTrBOiK6TfmFEm0Y/ZB4E2mM7FrgohzMnAhyPHqSc5+uZVI9vWkqYVCQFMKmmWFi6UczgVVBEamPkPlPno4cBbOzNIHgiCqcrXPL190Qtt1yP03zMlcYBn5Nklem/iJMylYdyNNZxewsITYTJbDcREjweFvqjDZ2l/jY69CkZl1/FA+T2OvGulxJH9l4Cx5j/IfZSP35S0WMJnSFqCJBzAloKhhIhbnDzOd06s/CRnlWYkqJkfADTEFd5m3G2i+wj77ZxPdFARH5fSoCVN3utfGlixsUtBp+BsaWkPkEiVnhJT6VOZjUSHygdNBpCxkxCAg7xbRTTvnGGD0tj+BHKmlp9VCNPYTA8mHP/20CInt6jdwtG/vfGgb4Ic+7JB6ZXPxB+SokzRWGupgntsEgvUnpmIZdHXpT9p9eGdzJbpZJWklQ4wlMcwBPHxbMjuQkKa18UEI3ZhDxknJ1tusLm8ObTQrUdnKsitJfY9enOa9vSsoVsuF9wsWDX3xpa64WXILryv/zrF/IicNTuGdPRb9YX65MhW6DmYJKpoXumW0Q9LXmA41Azwk6HLx0QepKHxoZ0TeW5/zsOdAD8IDWlFDwgRYVHt1EJSF5RNbFSm2Go0nkUQDQbLHRqBeM/HeNwcLBwg4pDQe+K90wlbbEBPNHzKmI9Ac95fWEiLxrwaHfo7L6YVfkW8Bm8khPIF6ANbcglvuqj/97ec6+l/H9H5JH9r3AHKxgjc4ULxvUaXh963tVg62aAepsPdcSeYJDCrkxI3tHiaDP3NEEqOz7zhkmJj3GNbos8YO9aO1eUqOOtHshXrRn8138zc7W/hX3idX622c+i1R+1o5L+E4tIy5nlDyyXXVDpk7d53pbBoyQeM/42YnEyMBgzEnFsIiAiQdAEc+XPwAstGvUAFP2zzp1r5fZzG3WXBnA8YdC/9errlwKHM5fdSufB1IWh5ZMOtcv+8A49x7rQIZ7rQcePOz0YhFMYqL7DL6VhvQeOYYID/A2l+unC6auKszN+k+eElD/IkSn/zLLTvOSmRHSXsPchCwAhMJjLlvq9Dp85JIN79tcfg3vz0SDVPJnGlqzhB5LW+F2lErQHKsQpAL+KW9TsGHZgKKvsf4Cz8Ag/4d7ifn3j9r77m64vmjS4ftBP3VzdHTqlCbUFNXO3bCGbsb7JwFuIsZXIZkUGjClp5x9w3gB4tspr/5vqf/H80N55ar/7bKq9Ay3Y4aia52TDEU9RmovP64kfWR8e3YOqsD/9f2tHqB4pRF93twdS0aVfFY+T9vRTS0eIHiUPu8Nu0OCa67amshlItj+T2EeRN4/ePOLZ2djZNFVqrjADMUOqkgFV15fEFEarCmNKvsaURhcWqkpjvwhEILpwBXSXqCpGl8QgH5XPyI7MksuzIrPHCBjIktM/xh4mIls2daqsyG+/UvzQw+RhtPRgHKE2va4DMVCr/Y71+DX49RzzG8Ky/FhYLmMbiFMzwCgw1P3P1dUaHd3pt/WvcARDO3C6oYBhLbBsQ03Eju07qsKMVl1QoNEYFLzvyeSgfMWe7As2VgoGYYTsWzh5hlQ6pQTAleQcqo14AGYO4am5XPUkAEyX598t/dv+1sIWqks0ly4QLfRd5jthPHXREHPUoi2uW8lUjmxK/ZpkmjXStFS2LBZ3q2B2lDbE6he4QcYk8yImhWXyX3IEj0z9e7c/F4TnGT1qzaak+rQAXSR1BzVuh17OTxZKJenpElnvWHKg3NBzRZZZJpkyWdZxE41erm5Am9GbOG4Zs8DS98espkVFk0Ie0m6DFU0bwrRhPOHt7v75sviU4AfYWpOJdnHPD5tpUWGi6iHtFlhZtTtMJ1SA6/X8OB4vjs+h/1HU+OyOL+YxSm0uqoxqnB4Zn79Bao0MS5dGyKdOlUe4j3qOugcZAwONaYEGzjwI/RpliMqYJonozVMo8pS48sOrJ8MJe77hy02O1UvuyS8n5F5wuhx3d15UoYmD1phCKW0qLc8KGJnX7zSR0anqrQrd7sXjpzJ492rWroysbZXhuNSj5T4kLOpjIn1uHSOVZcloUBQqHA6FU9G45G6LpHYqheDV12/24E3d7sjZb5VMNS4qPH2+oEVLCE/em1U4PV1sDw+3i9KB61ISxOmElDdph5CTp8UWubW2usFbRAg5rE8vloCLxhH8cCOPsXkhVl6Lb8vgiUafawNnK9HV+UICVsGI1T3EQswKxA82GvMoaXmsFi8nS3MRWwUjyp8aQFaVTVU7HRo/LXWt3j/O3+mgqqna+BKRk59qSJC/LWev8VnDnuqS6xMEqaKC0vhq97zoVFNYSkxRuTKkxGYpD64VcDUhJcrymKKwlFRTtFwfniIUpuQAwJ+TrkL7CbLi4nA5cEUKlwDbUsDd/6iQ4NMAktQTupr1e2Z6GFtxWqoWZ+eGVuNMj/V7anSFdAlOl//rrxdVOF+Hk1C1radJxnzH0o0ahSN/FvIBaDboZs7UtlbH6SohWqQ5lWtg6+ozEzHhORBgcod3gCmGWOAtk/n6QCPEgjLukqVLJOmyD7Lbkbkkn2WpiTEdhv/CeJqjhtR7gi/MTzNA+PJX9A4WYT2sFoaDI9J817M6aIE6Pl9rEfD+LUb2aQEeRtH7bOmbMxgQqFUC6ALpa1g+62oIgSW/RZcuQNMi/GgzZYyQRXw4QmdFV2cOqUmsmj0Q3jBCt8uMp+xpxpOyyXT+x+RkjvpjkprDVfPRdDf9oLyInqPmJG+gPtJ8epFMf4Lgzs9Wc5I+JiclfwR9HBwLN/7UFhEoW8Kv530qFYUdzh8o2Xebeoiwioy0rXF7RBdnIup53r/Kl18gcNllrCTCKzTq6Zk4csRw5KTsVQldL4XiKcgFXMoSmea/FZldr4Cc9Ajzizw0JRlqZKYL8qC2I9+bGPc873ueEAx73ux4OJibdLcUzpS1vn1eZHCEbF5p/ttsMK9YsaxkGYhkBaOGUQ1obLTzkcBLGqCqL4xGN6CuoQkowUiQNXBEYOeJRVZruIgEKtrYRjd4viS1kDAHm7PcB8mD7lmr+zCkli5i9bC+1XXNB9tApFtYd7TKEU1VsVKoAo5UF2grUxxpo6gjyO9LKt0ZuwG6tQ3YDr+vtq2J3sp9HmyuLPGaiBSdtQP3AfKAO68CHKULrSy1mmUVxkQXF0erY3rp6OIYIcuqVltZR5/GKoT6vik2q/j0krHWYKg1yvjZZnM2v0TAOn62zGioVaVfl0+RyaaUBQh/Wfp3X9FCzOA9nHxFkf9N5nWjSbBY26L03t7hqkm97t9yWc4vX5ZjWVjGu5KJd9iWa9cQSmvBFlxlBd7VYBfnfgORjOTGd8JfnEmaZmS6j5tPOrI5SRPWwneNyE7EY0SnNxaOJASmirJiSJtZeWUD7pXHpjnPc6ZXtNnjFe3yhq1Ck4vFGmc+Zo6zWExhACoGiQ3Y/1Ll3z3dXhnkf633CFZyQjjKYA/u2SB/5eZZNVO6XzI6L10H8HEYleyXfuL4af+dm0Fd1r7dsL19GXVexrDWjwOUYmZBXnJTkfDw6R/2H3svCF+fevWOfCO88Qb5nfYzzAm7SB/CU3BxR21qHC1UBRd6h4TQMoxLq8TwyGo7oWBevvBC73f7j9OHhfPyCwj2jXZIwbw8WmiwtxCuCqXFZAUQO4giftAeRhYGLVOIPKzr+bM7YGNdV+wF3FgzY18KJ1jpsaZsvG7TL9+9mGyIE+jTYXp937Gp7ufKEg9lMAdcyvR2ha7l+5RYECbvu7ENz2kv1uNT3oa8dS1b518U4BNQ5D8Cv8QOSuX0rMcD/PqeUDv5LnxEXQ3Yn1PEjJomr3Lag61BIqMofpeAwWy3Bw9LtdunKRIpgn3qGnpIS3BTxExFWDWV7YwsUNojbDnheeLnBFwZYVPar2KZ6pky3Eg7tX2Eyve6ESvHPa8LaB/BeY+H/LzvZYgH1D2nyhcNXB9n1h7bzJbk6tglXidfef8M+Zmw1RIsfGkC5blAACBuboAI8hBQomTTAwfRcbdRDEPPD9Gcnfn3tr8T2XCwFweLmInRrlj5wZZ7kYJcSFz95WXKSmddnRjkPc0CikdcKyFf9N4rf2rAEstNS+5AHW1+RBakMA7u/hqNyqcjyz9+jW/84g9cL/kanhzJcPshok/eFUFjJZwXMeA/xN8NHpcKHnrHj8R7Pyy4ZPD4LtJjLVMiIqdwoiNKnTExUQ6lMr9GmZe/vRd+pOZQyv21ISlS7XS8jsAg6PAVmhSZNqTcL4cC6GypZpfHi4koccbGqPL7qKJjnCWKMFfk0MyTNeAZ+OO1KVIN5//hWIvDgmsZuc0RCdZ2XVuPKRr2YActs1RK+t+DfG/sxHK6Rj+9JjbLQtSxdJzDzEPnE0icsksVmj9EaZm1UTrT9V36glrNpEZp8lz1/q4t1DsBNngvw+7BorA8iBqfuE5M+iWLIVp8UkH88aG5h3AAt/z83PFDj3UsEQWd9tLDfoVNikObKcn6FQcZmtb1SgDadQcCDhjCPNyOwCP2BOzR1QWgYDUflsDhaZH3fFOn3TjuT196ai8L7UbYl7/2r1MjWVGlYYtM/qVR9kxRtmT6bIcyV6HIVTpeAxjMdofytVTT7GnAFZdlYaWw6uZrt0zBsvxI2ERle1lZu7KbgNNRtq+jGam60tJ2ZSLq2VLi0mcoT3nevFi1/MbKO+fXbdE+S+q+e7cFu/OVAW2g/z8qxpr9T5w4+SZ8QjhCbCGOeB2LLuAiebB8X7KlydoMQTvhLCQ3xhHtkCF40Jk+HGujrZmEcsLZSBkgxQGQQeWLQmkzgn3UgZwmf03RPWyTBLVlVSqcIMzv4eUujB8m+FYreE5xPEpaV4L6q67cJWMERbsRIXO/59qSDr8a8AIQCDFnKL3hYK7b6YWde7uAoCkxbyEJRcqvZ0fCZ8Aj2Yt3s1DdsQKik7XeuvHF9c/qeWAssfNQbLgTTiDOf619mjU8lA+KZ2mfhLRF2Sie5RTY3gfVQT0Zx/y1PCc2RGKVhgin0kPcObzySN9hiqsztpCJDJgDGn4x9CLUAeNARUaYmZymMWA2qPR8RqA2mE01k926RDlMDbko8uoA/M/qZlHf29CrjlEnl6sZanxopSV2QYxwC8d9WkY2cU8HKwRpI27d7ih3DbnUrnGsv4PTp4dAAxhzjS2IbVA3xL9JgAGVZVrYSaya+fRUjZ+fNr8ojqoNSJw8iR/PFWmXmX7+NM2INgwkfojUP2oi38wTa5avobPw7IKc3QsB8VBMhkDD42kEBJxAwxOUbpBs5jv5GZQNuBIlC+jWnwYy5JlPV7thDpg+0xjumBovzC6M9EwgmbqJZowGFXe/9PTggUc5Gma+T7pepnYjjszj/0yNIcTvolX6F+yC1XGcp9KmmuO8awo43wv4qvOVTtV7aa7F0/6p/sI/t9Bp/gCNrBopvIAAiEUmCXVFs9H8ESavel54GIFHy72vhV4L/if0nyYLGecXRzujopzRxV8IGHBGrfm/jLuQ51JLM5+fBzLvCM3Bmv/O+EOncU1wNwVTRXe3dl3+aaOWndXIOBvjbvQQ4LnKc3kxc2+zOOHYi1l+ZRf9LpT5ZV0AUZu+bxUv8l5U+l8cQZsmAqm/8qyRquidCHI4cUXMP7srkhZPa1Qe/HNpYUfAlPzWy41zr+qXhgq6RMqDu9EVf3YXMX2yAmyIyKQPUjND3g8nWKyzAkBE5ab+gX68BO/ESX6zxR24e/33dnV4W2HWQBwgzvu7Xjegq2lnB3u2lEUEIs2/WIDNvVa4VNEFlkeVlSvb1wsYRJVdYKnS2eID8W0Zrw1vAnPEmVmimkUBAoRVE6gNHz+RAzyIvkSPfg8qjCUA12npZIlkshRIa8fJkqK8cPVpHJFKxOl1s2bp2gTM9OVyFp6Bq104OQmp7e2xBl5DrzYJuXAyV8szANd7YWJoyCThf8KQxMSQLAKifOaTEkPjttJvx6hiHtL/oz2KVkX/QWuZgQGYNJ22eqauZSbMQJeGAZQJTFoyV8fWNKQlwqttHsAbeDzA9G1j0qoTEQ02toarS07DTIDoBkUbwUmYTQME+wlOonKEX2xWnbERPtFJ2C844/zzzFFm1Ig8khRJ5xv4WQbShm1et31/HMZiD//wvU1aDjc9fcpDGxjDWV7/0UX0/4KfeAlzn4qx4GKfUa83YaKwN0HcAijF1V3NC5hQFl6H30yi4bHarsrrpeHO4sZfgRJyvqwKy8JGzaxgQn8mNAXtDLp/i1yU4IXAssQpJ07OrgyP/yl95cYDc+c7nK4CoHQbU7+DBYWVtGZC0Na3Zv9zzycEx33UXX/hhx7LdrKQrIXrtk7c8Pq5dlufYIL2hIDu+4IL8Ft+6GHvex+1Z2J7GEdiWj8QOdnDxVv88+XD2dVDtWg1ZZm/XqaT2WRp/oeI0A0PM5/qO6+wEMz82euPE3OYTwhEBJDnDAd938MbTDI1X/zU8emCcVHSIMN+8fmDVRXHVjXYYb5bgvg6vcCqEwh0Qdsptzt4l+vnHeLZ+Md4aZS1czHFj4bUPzaFDsbIi3KiZ+veiiiKGZR9Zq5UBH1WH/3azk67GxXkg+ymhqrqnXQbrbupOoyNF6al0XbWzvlFXRYbW9Yg4CrUP/E2Whr+p80YpBcI9EHGHQCYI73AGAhU7xb39Ax0UbuOHNWiZgeEZj3MEgbURG6fXvt37bPGrC0fXoPSfkr7sCWrsK01kTP4j0ysIxdThQq8BId5W/OWipPgFTvpkUDG1vTRbx2gVvwRTe+jXRAAfqLbj938PTm5ocHDIzkJIKEahtewF/XrX+b46AC7D76D2fxe5tfp4NhYlx/Lv/M8Tfvatfqz/Lqw7xydl8C/lXY+0EC/LhB49wCW6R+djmP6MXHswXulA5aEH8SR/Eg4OMGfhD2AtI+Km3YAR/RnNuJI/kQc1zpxZ/iSVsQHkA5cRLAK/JNFMikuStb0FSvx+sulhI2mN2HfoLpRDSrKITmzoUTfvOqRuREwgwaK863d7nJSVnJD1bFAsQmK02GPwO3wERY7gtX5A3zZSEcQYqHK1zu2P8FKqVLss1PfQhf7dz96eNFU+/Bhvz97CJyEM7M/MQ5jIX4Q7G6NZrbY7rzcIeanCkbcJyzAYspgZIEJj5aRkbfZOs6evXzp/NKD+NaOjrYAFWOf97O9OiskCwLcekGqmubmr03w17ybEJVIClLji4NU6sowiy28Qh2wrXOG3+aJYH7ppkWkfbjZXsDqY6OM+RzHgnxcBU6NDmeSCx+gvOCYx/fmlt6gaMRATLz6MVESasFz/XWtVmrKs9vF8rh8+NyI4vy4syzdotQkoJmpSCk4ub9y8PjWq7JjTQewvmH/r5oXpGbdyRa9DJD4MjbBQMi1nVY2ZBsIXm0sop6FH7GTFj6sWhColqWn9zOc9MH0jAbCbccDpGUM4u2M/k+IHGMFgOUr50bw64KYm1MFva8oIco/TFWyolRVuiJK5S+crVFnYnprydDTK10VXR9VGrXtuSI9KgAqdKHJKiA/swQnwaXBUxqgWBpOQpU6mOOMAdQzBxgQZv8VifmLT5ythYD+hbkqLTZW+vRpTXm5RK3RH4hSdDF0jC5FlIEIMr6zrF+/Wlnx5aBdmRL/pXhUl5ZZ5VcgbbItx19qM80v9K4xzm+7BGT7fn+LNTOKV+vBtZXzjTvmZ975w2Ca7Q32/T3faPMo1gYyq6qf+uoUtRafekVNZ6etnEgGRJHGgrNoRMRf2rowkn1d5TO+fOumSjAg4aoWbcibmY9jQGsRSnbb1okl8Qi5m63Mmmd4zOCpA/qH6mWrCL6MkN3JVykcE0JG3lCzJe+BPSQ53MSZmeZaLL2WclXTDJeTXm4Z0Jf9e6BZQ7kqck+8tkzfd+7hfomHpO4Bxx2UA3Xny2IXvTBzM0wHkxMvtqjmpVN49+5omMmwagaX7u6mIDp4eKL+F7AFPj2TK0iBnLTn/FCuUs6mS8A2V+nRuPWvPdw9bxM45sDfGHv2f06p2EOWIczstu3RREqJURm+nxZ+sItiKLdxdx+cUVgMZb/YT2Vs5fVgUHmoepsUiy5dcpYN5dYScPOSFRyX81DWLXiqPw+HctsC9+vXrWGd/Fm6JuwLnF+eoK+r311fNzC/PiEudWy3o6a56L10F21XAJ4ew6qfz60/I3FbpAFh/WcxlogrcuLEfiKcswhH9C09fImH2FfsUVIAyLSyHeSY/kfkccFH/THkWXGQPXb23Fl2zqLmRcu9Pt6zCG/ILS4pBnEb+ir7fj2/stXi8wB5txwnP8fdjcH74DEPUJfqSpU4uzwmKBP6mztS5JcJIzxXFV+w2oK/yw/PPhWWPcVuLkC3aRZlJrBv6JvR197Iya1jD1AZuzzwiAmPJg/DywJ6Fk7n3yVciihsdm6x4EbkYTmnwnPit6Oc6NbZETfspR+i+T1W6Fm+QaIghH7jRh1W17uxphqTexDZgsxBdiIP1oevpdaPfvVibSebXmjkV1V6k4P95kF62r1lWmOhyRwRbZmG81G+Vto+QLjyltfdOVkxJiBu2k8/3KxT+eSFJIvrFa8VOzlk7rbsbnPuOvq1/RwvqK70mu97ZJHJ9NtfICJwERp4O6zdOrZ9qreQeuKkNnpSZ26AcNZr7lHcUe7s11Thw0TvUO3Jk2FUROIl5yp8LiA1j+YJPlFbtmz5JtifWXAt10o481XQt6WFenN+P5pnCZYE+b9FzvrINxho+yzTEPRtb7YP0SeewHtWSD6es8zJiX88Wf3kj8Rk8yxPHxKIehjcitPiWDgJrlWRnFKlsgqnxGvUW+o96uXmDeneRU7Hr0su4kMEGFBzbmKISWBZbl0RxE78GnJpbTX5Y3Fl2tq4qah/YjapRzdsK+kB59bdnxysdeLmdVQ+vbut2QP7/b200iCp1osxqh7l7UqCpcFkxLMpgIEFuX7rrsiOrZOuOya7su6Qb7FOegVxDEjHpPYocAWb6mQ9O/fkRHrGcxS5/ozJ2ECgtDiGhpwsytMqRHZ88cM+ySFPQsb+gqfBO+A4Iq6sB9NIGnxE4vqZ4Flkbag2beOpU0QkmOTCWDRv5v21f0ZwQv00EwtBRbBcKL6+Mnh/KP8NYVa3hmupbXPsLs+/WB5ZpuVTWFUY3PrMtGXLnd8TFG4EJNEnpvK9YIVtadl6nHtTBmtaGzaT/MLTl8MelcFqaljeULALuid9UI79V3Ese2WgIXClgbOwl87+ogFO/5uCqMY/3CDQjJ9ecI6Eg6taK2oviWLA3fH/do0H1/nXBY87GZj/V0erbndAFhK4LC6MMm5GVkXNQGSMe7tx2RxcXsf7aSVKBsydcK1V/JyCLbrKIAjKVaqH2yAQZQjajcPmwr3fxMMbYk7v4n1MnpT8cdLj7EnZj4GCjV/8zfBt8ZevLRsNG1sKMuAYrPzRfm4XyIH8dMM8GnIcJ2YTv3wh5mg0OYQdO98neDt27qjda9gL+Wr42vL1a+0e494anflsivqP2xCPE9Z01PgG16xprjJQkMzCaSVzVYVRDkdUoeqjgFdEOVSFH6EqHQXSnM29F3u/LGyvND4xPFkEVpGZ5pISc/xfN4+27WkffHnrmF9qPVA00hOvij8TZpgNdn/vKCcekY62D0N7Qm3YgJmEdzGCqPCaCqgOqqJQBUzknVppSljh/bd5cDgHBk/05sFhXNTzKIkqBw7XPEw/fIFQ0OAIptsce1nhcB5sgWveNhtuMltYUL4LLB1ijo+B308zrsk0h3iRRdiLbEEy7gAJaBW/M161YBmnyEPhq6eYj/fYONd+3TB0lfcO4X3izwTKFFJIhHvz16ZmtPsgPQD9oml+S+pkxGo1sgctQPcgzaLEpzD3nxhh7ziG2DsJ8xNjbxl3XyqTMQAgooGlQ45vPiv4ghK+f7C7lfbiCEzjsLGRGGj29aWXR2AwBzJ6drmPY8IOlmIEJMXuDj73sjQZJKLOl4485LOCFYjK9bv4/RQpGRHP2Tt6/7pBTdQvEW8LAVGpEVedR00m77n4fV0INK0FbPWFyC7UQJRDFqJaUAOozjtOVPkElBPVqnYRLxgPQe6inULtJG6OoBX0cCESoDsCCSUQYi1DeimoFkS7SagwCDEigCLc+r89M9SB7AXVqjtg5DDZN9kstpGNM2KC0YUDi4kWaO7GpOcr4DA9DH4aS8JpsSysgVJaHAl7WvN9XvE8aWMu1EIcWExAnD093EI4MYgeTFswph5jsDlV08tZDHZJw1hDCZvB+sYOY8fnmDv2LVvgylHnbMyOR19FfUNdRQdNy5kWlFdZ3iD6XFtYsWfowFAOUHzf9fHQyYRb/6WacPIQpP+THaWypFYBDHCtNQoJTwkLS8kRsD8HZSHzPY14zB/RMXyzJ5n2hcNmF4hFTzVNCkVOvmJmnkKZo2iyBWCGaJMChjwCDAEeQwGTaEOYq418fpyWmyLgffCbBH8ewTsJBoITP4kQZRPMVJwUW/WSMVKFlTan7Gny/oEThCdKXyUu2fnbJC/1jCSDMviGoFEPg/q4sdwYFMakJoZ5ZG0wogXRBkuv7Lj1KTvl844+jpd747J8uK07QNRZtyM0NXZO/6X5nvBcr3snbsLwg40LHSSSY2HjMAF37U1qLjzu0qX+tVglsX0N1nO8tnbOnOPJYPvnomelnylBJPrJ/svKCGhSUHAitLrvcv8/70juFdg17UQldu2l/ktxufDUN9dwhOGFjSSHg9S4cBAPu3ninhc813N+/6U5WDXtSJ16MJxuHFAeqUoPI6eOFwvfwHTHYcgYLlMSRzIw8REs5hdHALbf/XO5v686CRocBE2MUPZfPkknVbhjM0Z6OUfXPgYZ7l9wAA/DQg81rfQubIAlumTfL766qb/QFs3o3ltEfxbw8uXazcpSXn13hORLcGnuJxtAeba6/2b/Yxga1n3Thu3m0F+cl8jD5WnjiD8Z/dhvI4bmFD24BYreCz3cTVykei+lal2exwXrbJ3h+G5vkvwevoicXf1YAnb+CsM9m4r7CWYLNGnBQSZzkF2ZQeYQRsU5VvPmuY+fQzyiEklJSH/LjXauhpcUBgpLG3qU/C9a0uvm/igyim7a52NFzENfH+scTh589gxL+nX0pgn0dU/32ew+7Dns7rlJhoUTyf+6t3Kj3L/pWffdr7sfdD+qEwlF1JaAgwG1AUFC4KrSTI+Lm94sYH9zWhi4DPOKo50qlTO6+FN0qJxO1Zr/07gw8mBuxbTILJksK3LavQAGE6z5740LdMU7Sc5NvXbSdVqsWDHxwUkaJTmBZPPfW68nxRlkkqMP2YqIRnYi2oUuCtEtWBof0doKRgOis9cN2YL0XXLlCOQVZZHkV0EYXlmmlcq9ygDFiiIpZtx7HMPnCkT2acw+gFK5kgIoJT54SikF77OykgJ8TBRwesG10pLSrRumbzScJ72V5suvMLJPWmAXW8PDrWL7VQFftTXcLr4qWbjL85tjV99dFICC6qDhNDmKWZ9Sz6Q8a/1ey/Wa75GCQ/25X2oMDlj0S9sHub9PnWh3nAu/TgcpmSARWoZivbQzruuZP8YW+vZwMfB9wYx3tOOq6D9UfAUT2h6slpZJzRS7PnZy7xf+yq/qS+FruHFxPC1/g/b7pmvyNBt5Wp5aqoar5mtvTNq8+Z24UZ8fbgu3pIaV96KAV4RZRLYLEMKkmkX5kaXMm1u37aTpaEDZB+skhoSc951bhSQM9PQMEgQfMyfG+nn4AeWDbgBkVZMM7e1j3PCwlGRhOBc7Z87kwDJGR/v769O7SEjSzOp5J8jyz/TTOfJZCFYX9b50mYkg73YThB92FeECBvgzqDhdYheJ7ZKM25J0B+zitfV2hgQBkR3g6c4QeUXQF+206Pha3snodFv4ep5G6Phb9HwNfyPrtxRatRreUWW6izh85Og1dgv7xNEjw6yu40FkpyfoZ+I7ycDTWbogA8MAFiyYPt1gOLwCaAdXx1nm9OkA+mV6eZE7ZA3Qq6AJ1oS2G21Gq5EFWGtJvCEmext2Y/DGxJC1zZoB48lbC99xwbE2S5vcetP6tM3aBqDQcBWlE8xeVuSewB/W3P/GZGNYr/0jcE9kpQtNL5+PixWxe9nLjZF1q9bRkfewTNwz6E4cU1VxNfl+8k8ITgDFg+01NQQnw0lgVQEFIRi/c33NMH14/exBiIFwrH5K3sRjhJpNhC7NTTtOqwG8KsJIoO/oXhi8qJ84VxbTJ9MCq07pyLT3nPc0Lv0d5x1dm6IjJXk4Rca1l5D2EhQ4qb8Up/iAQdFHbBm2qhm+Kp4pAFTQUrVAFV4+rfrl1OjpL1jVq9inqfQTzNjnsR+u4yT+TGowVvrQBzCvkHfy+tdzsROw8tXxMCNLw3AuaD2R4Gfy1ePd1TxNYDw2CWtCT3KP+9z1Q19QGbkMuY5iEG1ssPy9mof4I/ZnTtOq2cpkqDopcrkkL78JpYbdUxOkZcncJrJaCNEeV8yv0jQ2krDbOzcOd21EcLgzxmlFsGpl+RGz60jJEZf5SLlp2QHHtGwCtDZgQBPOwtzcYOU9u0Nozt8DrfQCx3FGIX2gsbGf2Y/1eDsw+BMwoDFzClUOpdKhKnz/CtHtUOZ/L0VqpwY/Inrt4h8bcVoYuEJn5StzIiNzlPkvAziQE7nmfzkujLQKCq+Nk8VGtMCI0xsEBBOs+X8f71K9W7fbaYxNrZtJSs01TOOdNa9ssIlsXLguLsk7JzamrLO0I+vdoJjc+9WefcRNY2ivsFeWzRLTSJJluaYy0SjYTt3I6qBtrNXhpmyLyHAeBtA6BQOA0HhntDj+T9dZDNOgSd1O1Vb0ZnWHbZ9MvFbs6hNN4II0x+ESAAiHQg9Hhnqcch0k0UakNUGO1vXsnQ3U1s7JNNHp1RTXNkotDSeoUoTLTDHOa42qblEpn7gYlXCqNY681bQHqTl9dBlRoSveOaaJPZDeoZOOMFquiHvMDF9CiHSuz64hQsr0r4hd1XACofttkKLk7Fob9dqViiS0i827jGoxpK/PtwL5RsjzbP6FiqQng5fmD5or+o4R1SaA85BG21uqKOsCUkVNEl5T5Qy+vYMcsZA5VGqLRnxT2iuJGDJ6D3McUp6nFJrg/CEglRIa7WKpqbBq1mhrTAwJoY8UJ9rZGxUcPYSPEuJJvCcaJHbXH8Q7N2mKZbk9hu5gAX1k5w9xjwlI0qyDCrXOxVIRk7oPq5CJ6jWvU2NfuWQXJhSXqkufgiVIYUfk1h36knBKGMxnkeku1aw2HfHQ0w6jGobWoDcFrk3Ngj81RayG/Q2QqVpqFq9y1bST7EunplxkKC0blNASx3zq5wSoVu02v0Oq4RA9bXNx7G7UNQmnAC62O7KH8Jp7P5mHtgPZeNX/IndXCj65mZOP1wvT765WikTj6+ndxUHJQnm/hCtl6E/k4T9y+9z/bFO5/gFSY0sSV1KPzqAQbdy4uBLh4i7e1b/UNTpBslbI3YMLm/uDs+XBla43V7k+XAvX98FtvMxGYpPvlilbi96aeTA31x5cnP1pDble0obrp6MflipuuBofPP3SVXXLMx0b+3UYSmBJXxTNPDktk/3E0w2/4bdB8UYup//BOV6QmrnzAytfmMAfZ5F334o4cjyP9Lx78zAMMy08Jxgpg8jSVfOOhmyXZh6LG0MJLOlr/MTRzJO76bKfePnGecNvg+LuYaD/g/M94pahpqzjuBebYgdVSPNrwrfiVEdQvqfjTHqmJTAMrxot4XIJRsqQkFi6yuVzsazML41HZ/bVHNJOjegMqJpu2OwO0/pvFHyRRssLgAgTyv6y+nKXShvrfBBGcZJmeVFWddN2/TBO87Ju+3Fe9/N+PwQjKIYTJEUzLMcLoiQrqqYb5vlI/5M7rucHYRQnaZYXZVU3bdcP4zQv67Yfp/Plers/ni8gCAyBwuAIJAqNweLwBCKJTKHS6Awmi83h8vgCoUgskcrkCqVKrdHq9AajyWyJkbYctYyjLOOQ7TCjdFMewZlEK8YtelDfFP4EDgvgrmRvo/C6lcBh7azE6l7TBrq/jBKHxscY2lxDeA0SLRWOYc8+zcIiR89WY9piwOoCU3abN1JMYxzOaBahdZT4xY/uIZUrS1Q/rTG67GXtTd4thRkgxgpIS7/6HRITLhdqfkjBI/fuHAcK7rnzyJnWbUZjNyrjL9knM4IbDWIka4aOBjYi3QOJCncknOg1cnBsUaNO+z4weFrIcGtLbvHK7HNhe2OAJ725+AiRR6UyLnlEddu2N6fLdMuz9IpFkbeL3WBv1/g0NayTcDOHdsGtLJzuPYxltVIV8+yadLYbaTFKjtT0XtmPeXaKBCrTPbLNwNqbcV4kPsxVqZD99jZ6j1C6JYqDzifckAP7xLZUxe5MGil5hcj4y7dZZ3CxISmCWcjrP1WDt/3fLvscHArUc6CCaaki2SoQhpWRPb/RJuWSZNYkkdzQgujCdjgpmgDx8OAJNvY5cQjQ1s92xt7WXKI3Nkr1oYHj0r+jqw+HyZKiZBGHW1tN80VQ0uejDIKlfOTfuvagTjDJ40V5SPMDAuTZolTzLzkgPduHeA41L0tSsy9O4BonqOlQrPlUCEZhxBnWuh6MFDbMp/Lg7Sg/KOEgT04b1wQlJ9R8Ki02R1xc5O6pEKZF3iAn8ch/4pI24kfmgzNO2Z6szFA9lO164TNK3D3mQkqt8Eoe+28kyyjR3phgUQ2H/Q2/FblwDDOeVohtvpIJIpwyZ7NtD3RvMt3RZ5TCYd2dSSFdwuE2stCSxJiu0EePJj8oDahBR2YujY3pxTrJROE1+Xv6Ed3edsFS2kJXweyhK4yFSG4T5YL/tpamxGKHdi7F3tDruPATrttMk1M83XJ6xjy7SIEIR1h/baupO7KWiHyfrbIOB7mRM1SjehKdg6B0k7lYDrlai5zDxDmQ8BCMefHB05Ni8x3hdh4epIqEP7CPx0EKjQ545dYzg9Runaj3HfwIJouHEMkw7yozqcYHo5I7MsRhO1lNgyVBcKQhqCF8JzTeeFGmsAr+k3PnqGi9CtWu68HGTWw8Qv1KS8TAOm3GBsQuItby0ViEFVYqOY6ULB4dzcI9+Ac=') format('woff2'); -} - -@keyframes rollCircle { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - } -} - -$btnThemeList: ( - ( - name: "primary", - textColor: var(--vxe-primary-color), - ), - ( - name: "success", - textColor: var(--vxe-success-color), - ), - ( - name: "info", - textColor: var(--vxe-info-color), - ), - ( - name: "warning", - textColor: var(--vxe-warning-color), - ), - ( - name: "danger", - textColor: var(--vxe-danger-color), - ) -); - -[class*="vxe-icon-"] { - font-family: "vxeiconfont" !important; - font-style: normal; - font-weight: 400; - font-size: 1.1em; - line-height: 1; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - &.animat, - &.roll { - display: inline-block; - } - &.animat { - transition: transform 0.25s ease-in-out; - } - &.rotate45 { - transform: rotate(45deg); - } - &.rotate90 { - transform: rotate(90deg); - } - &.rotate180 { - transform: rotate(180deg); - } - &.roll { - animation: rollCircle 1s infinite linear; - } - @for $index from 0 to length($btnThemeList) { - $item: nth($btnThemeList, $index + 1); - &.theme--#{map-get($item, name)} { - color: map-get($item, textColor); - } - } -} - -.vxe-icon-sort:before { - content: "\e93e"; -} - -.vxe-icon-sort-desc:before { - content: "\e60a"; -} - -.vxe-icon-sort-asc:before { - content: "\f295"; -} - -.vxe-icon-end-page:before { - content: "\e607"; -} - -.vxe-icon-home-page:before { - content: "\f294"; -} - -.vxe-icon-time:before { - content: "\e64d"; -} - -.vxe-icon-feedback:before { - content: "\e738"; -} - -.vxe-icon-lightning:before { - content: "\e76d"; -} - -.vxe-icon-cloudy:before { - content: "\e608"; -} - -.vxe-icon-heavy-rain:before { - content: "\e7c4"; -} - -.vxe-icon-moon:before { - content: "\e68d"; -} - -.vxe-icon-sunny:before { - content: "\e684"; -} - -.vxe-icon-location:before { - content: "\e790"; -} - -.vxe-icon-location-fill:before { - content: "\e868"; -} - -.vxe-icon-microphone-fill:before { - content: "\e900"; -} - -.vxe-icon-microphone:before { - content: "\e7bf"; -} - -.vxe-icon-share:before { - content: "\e68c"; -} - -.vxe-icon-share-fill:before { - content: "\e86f"; -} - -.vxe-icon-flag:before { - content: "\e827"; -} - -.vxe-icon-flag-fill:before { - content: "\e687"; -} - -.vxe-icon-platform:before { - content: "\e67a"; -} - -.vxe-icon-goods-fill:before { - content: "\e778"; -} - -.vxe-icon-goods:before { - content: "\e7e4"; -} - -.vxe-icon-funnel-clear:before { - content: "\e6ca"; -} - -.vxe-icon-envelope:before { - content: "\ea99"; -} - -.vxe-icon-envelope-open-fill:before { - content: "\efaf"; -} - -.vxe-icon-envelope-open:before { - content: "\f28f"; -} - -.vxe-icon-envelope-fill:before { - content: "\e606"; -} - -.vxe-icon-message-fill:before { - content: "\e710"; -} - -.vxe-icon-chat:before { - content: "\e641"; -} - -.vxe-icon-chat-fill:before { - content: "\e69a"; -} - -.vxe-icon-send:before { - content: "\e61f"; -} - -.vxe-icon-send-fill:before { - content: "\e630"; -} - -.vxe-icon-user:before { - content: "\e8c8"; -} - -.vxe-icon-user-fill:before { - content: "\e8c9"; -} - -.vxe-icon-wechat:before { - content: "\e605"; -} - -.vxe-icon-alipay:before { - content: "\e612"; -} - -.vxe-icon-indicator:before { - content: "\e646"; -} - -.vxe-icon-file-excel:before { - content: "\e7b7"; -} - -.vxe-icon-file-pdf:before { - content: "\e7b8"; -} - -.vxe-icon-file-image:before { - content: "\e7ba"; -} - -.vxe-icon-file-markdown:before { - content: "\e7bb"; -} - -.vxe-icon-file-ppt:before { - content: "\e7bc"; -} - -.vxe-icon-file-word:before { - content: "\e7bd"; -} - -.vxe-icon-file-zip:before { - content: "\e7be"; -} - -.vxe-icon-file-txt:before { - content: "\e616"; -} - -.vxe-icon-refresh:before { - content: "\e647"; -} - -.vxe-icon-checkbox-unchecked:before { - content: "\e727"; -} - -.vxe-icon-information:before { - content: "\e7b9"; -} - -.vxe-icon-info-circle-fill:before { - content: "\e697"; -} - -.vxe-icon-info-circle:before { - content: "\e618"; -} - -.vxe-icon-chart-radar:before { - content: "\e7dc"; -} - -.vxe-icon-chart-bar-x:before { - content: "\e60c"; -} - -.vxe-icon-repeat:before { - content: "\ea4a"; -} - -.vxe-icon-voice-fill:before { - content: "\e7c3"; -} - -.vxe-icon-voice:before { - content: "\e6be"; -} - -.vxe-icon-flow-branch:before { - content: "\e604"; -} - -.vxe-icon-comment:before { - content: "\e70c"; -} - -.vxe-icon-folder:before { - content: "\e7d1"; -} - -.vxe-icon-folder-open:before { - content: "\e7d2"; -} - -.vxe-icon-picture:before { - content: "\ea13"; -} - -.vxe-icon-picture-fill:before { - content: "\e653"; -} - -.vxe-icon-bell:before { - content: "\e680"; -} - -.vxe-icon-bell-fill:before { - content: "\e681"; -} - -.vxe-icon-undo:before { - content: "\e739"; -} - -.vxe-icon-home:before { - content: "\e7c6"; -} - -.vxe-icon-home-fill:before { - content: "\e867"; -} - -.vxe-icon-checkbox-checked:before { - content: "\e67d"; -} - -.vxe-icon-checkbox-indeterminate:before { - content: "\e8c4"; -} - -.vxe-icon-fullscreen:before { - content: "\e70e"; -} - -.vxe-icon-minimize:before { - content: "\e749"; -} - -.vxe-icon-print:before { - content: "\eba0"; -} - -.vxe-icon-upload:before { - content: "\e683"; -} - -.vxe-icon-download:before { - content: "\e61a"; -} - -.vxe-icon-cloud-upload:before { - content: "\e603"; -} - -.vxe-icon-cloud-download:before { - content: "\e63a"; -} - -.vxe-icon-spinner:before { - content: "\e601"; -} - -.vxe-icon-close:before { - content: "\e6e9"; -} - -.vxe-icon-custom-column:before { - content: "\e62d"; -} - -.vxe-icon-edit:before { - content: "\e66e"; -} - -.vxe-icon-zoom-in:before { - content: "\e826"; -} - -.vxe-icon-caret-down:before { - content: "\e8ed"; -} - -.vxe-icon-caret-up:before { - content: "\e8ee"; -} - -.vxe-icon-caret-right:before { - content: "\e8ef"; -} - -.vxe-icon-caret-left:before { - content: "\e8f0"; -} - -.vxe-icon-square-checked-fill:before { - content: "\e6d4"; -} - -.vxe-icon-square-close:before { - content: "\e793"; -} - -.vxe-icon-square-down:before { - content: "\e794"; -} - -.vxe-icon-square-left:before { - content: "\e796"; -} - -.vxe-icon-square-caret-right:before { - content: "\e797"; -} - -.vxe-icon-square-minus:before { - content: "\e798"; -} - -.vxe-icon-square-plus:before { - content: "\e799"; -} - -.vxe-icon-square-right:before { - content: "\e79a"; -} - -.vxe-icon-square-up:before { - content: "\e79b"; -} - -.vxe-icon-square-checked:before { - content: "\e7a8"; -} - -.vxe-icon-square-down-fill:before { - content: "\e84b"; -} - -.vxe-icon-square-minus-fill:before { - content: "\e84c"; -} - -.vxe-icon-square-close-fill:before { - content: "\e84d"; -} - -.vxe-icon-square-left-fill:before { - content: "\e84f"; -} - -.vxe-icon-square-caret-right-fill:before { - content: "\e850"; -} - -.vxe-icon-square-up-fill:before { - content: "\e851"; -} - -.vxe-icon-square-right-fill:before { - content: "\e853"; -} - -.vxe-icon-square-plus-fill:before { - content: "\e854"; -} - -.vxe-icon-square-plus-square:before { - content: "\e87e"; -} - -.vxe-icon-square-fill:before { - content: "\e8d9"; -} - -.vxe-icon-square-square:before { - content: "\e6a1"; -} - -.vxe-icon-sort-alpha-desc:before { - content: "\e852"; -} - -.vxe-icon-sort-alpha-asc:before { - content: "\e7d5"; -} - -.vxe-icon-sort-numeric-asc:before { - content: "\e800"; -} - -.vxe-icon-sort-numeric-desc:before { - content: "\e801"; -} - -.vxe-icon-star-fill:before { - content: "\e69e"; -} - -.vxe-icon-star:before { - content: "\e69f"; -} - -.vxe-icon-star-half:before { - content: "\e6b6"; -} - -.vxe-icon-lock-fill:before { - content: "\e6d1"; -} - -.vxe-icon-unlock-fill:before { - content: "\e92c"; -} - -.vxe-icon-question:before { - content: "\e72e"; -} - -.vxe-icon-exclamation:before { - content: "\e617"; -} - -.vxe-icon-ellipsis-h:before { - content: "\e636"; -} - -.vxe-icon-ellipsis-v:before { - content: "\e637"; -} - -.vxe-icon-save:before { - content: "\e67c"; -} - -.vxe-icon-setting:before { - content: "\e8b8"; -} - -.vxe-icon-setting-fill:before { - content: "\e795"; -} - -.vxe-icon-link:before { - content: "\e6c8"; -} - -.vxe-icon-chart-pie:before { - content: "\e902"; -} - -.vxe-icon-chart-line:before { - content: "\e904"; -} - -.vxe-icon-swap:before { - content: "\e7f3"; -} - -.vxe-icon-num-list:before { - content: "\e7f4"; -} - -.vxe-icon-copy:before { - content: "\ec7a"; -} - -.vxe-icon-company:before { - content: "\e602"; -} - -.vxe-icon-swap-right:before { - content: "\e8f1"; -} - -.vxe-icon-swap-left:before { - content: "\e8f2"; -} - -.vxe-icon-table:before { - content: "\e920"; -} - -.vxe-icon-merge-cells:before { - content: "\e901"; -} - -.vxe-icon-paste:before { - content: "\e70b"; -} - -.vxe-icon-cut:before { - content: "\e70d"; -} - -.vxe-icon-lock:before { - content: "\e676"; -} - -.vxe-icon-unlock:before { - content: "\e682"; -} - -.vxe-icon-chart-bar-y:before { - content: "\e84e"; -} - -.vxe-icon-fixed-left-fill:before { - content: "\e9b9"; -} - -.vxe-icon-fixed-left:before { - content: "\e9ba"; -} - -.vxe-icon-fixed-right-fill:before { - content: "\f290"; -} - -.vxe-icon-fixed-right:before { - content: "\f291"; -} - -.vxe-icon-swap-down:before { - content: "\f292"; -} - -.vxe-icon-swap-up:before { - content: "\f293"; -} - -.vxe-icon-square:before { - content: "\e6d5"; -} - -.vxe-icon-check:before { - content: "\e645"; -} - -.vxe-icon-question-circle-fill:before { - content: "\e690"; -} - -.vxe-icon-error-circle-fill:before { - content: "\e62b"; -} - -.vxe-icon-delete:before { - content: "\e69d"; -} - -.vxe-icon-dot:before { - content: "\e63f"; -} - -.vxe-icon-success-circle:before { - content: "\e6d9"; -} - -.vxe-icon-delete-fill:before { - content: "\e634"; -} - -.vxe-icon-minus:before { - content: "\e6ba"; -} - -.vxe-icon-maximize:before { - content: "\e600"; -} - -.vxe-icon-question-circle:before { - content: "\e782"; -} - -.vxe-icon-warning-circle:before { - content: "\e785"; -} - -.vxe-icon-warning-circle-fill:before { - content: "\e848"; -} - -.vxe-icon-eye-fill:before { - content: "\e869"; -} - -.vxe-icon-search:before { - content: "\e741"; -} - -.vxe-icon-funnel:before { - content: "\e8ec"; -} - -.vxe-icon-eye-fill-close:before { - content: "\e8ff"; -} - -.vxe-icon-search-zoom-in:before { - content: "\e6a5"; -} - -.vxe-icon-arrow-right:before { - content: "\e743"; -} - -.vxe-icon-arrow-left:before { - content: "\e744"; -} - -.vxe-icon-arrow-up:before { - content: "\e745"; -} - -.vxe-icon-calendar:before { - content: "\e746"; -} - -.vxe-icon-arrow-down:before { - content: "\e7b2"; -} - -.vxe-icon-warning-triangle:before { - content: "\e67f"; -} - -.vxe-icon-add:before { - content: "\e664"; -} - -.vxe-icon-arrow-double-left:before { - content: "\e665"; -} - -.vxe-icon-arrow-double-right:before { - content: "\e666"; -} - -.vxe-icon-menu:before { - content: "\e677"; -} - -.vxe-icon-warning-triangle-fill:before { - content: "\e68b"; -} - -.vxe-icon-error-circle:before { - content: "\e613"; -} - -.vxe-icon-zoom-out:before { - content: "\e65d"; -} - -.vxe-icon-success-circle-fill:before { - content: "\e67e"; -} - -.vxe-icon-radio-checked:before { - content: "\e763"; -} - -.vxe-icon-radio-unchecked:before { - content: "\e7c9"; -} - diff --git a/styles/icon/iconfont.ttf b/styles/icon/iconfont.ttf deleted file mode 100644 index 2f3f8b39f6..0000000000 Binary files a/styles/icon/iconfont.ttf and /dev/null differ diff --git a/styles/icon/iconfont.woff b/styles/icon/iconfont.woff deleted file mode 100644 index 57bb95e7d3..0000000000 Binary files a/styles/icon/iconfont.woff and /dev/null differ diff --git a/styles/icon/iconfont.woff2 b/styles/icon/iconfont.woff2 deleted file mode 100644 index a624402c89..0000000000 Binary files a/styles/icon/iconfont.woff2 and /dev/null differ diff --git a/styles/index.scss b/styles/index.scss deleted file mode 100644 index 59a1cc3bf5..0000000000 --- a/styles/index.scss +++ /dev/null @@ -1,4 +0,0 @@ -// 该文件已废弃，请使用 vxe-table/style/all.scss - -@import './variable.scss'; -@import './default.scss'; \ No newline at end of file diff --git a/styles/input.scss b/styles/input.scss deleted file mode 100644 index 918399b710..0000000000 --- a/styles/input.scss +++ /dev/null @@ -1,912 +0,0 @@ -/**Variable**/ -@import './helpers/mixin.scss'; - -$iconWidth: 1.6em; - -.vxe-input--inner { - width: 100%; - height: 100%; - border-radius: var(--vxe-border-radius); - outline: 0; - margin: 0; - font-size: inherit; - font-family: inherit; - line-height: inherit; - padding: 0 0.6em; - color: var(--vxe-font-color); - border: 1px solid var(--vxe-input-border-color); - background-color: var(--vxe-input-background-color); - box-shadow: none; - &::placeholder { - color: var(--vxe-input-placeholder-color); - } - &::-webkit-autofill { - background-color: var(--vxe-input-background-color); - } - &[type="number"] { - appearance: none; - -moz-appearance: textfield; - } - &[type="search"], - &[type="search"]::-webkit-search-cancel-button, - &[type="number"]::-webkit-outer-spin-button, - &[type="number"]::-webkit-inner-spin-button { - appearance: none; - } - &[disabled] { - cursor: not-allowed; - color: var(--vxe-font-disabled-color); - background-color: var(--vxe-input-disabled-background-color); - } -} - -.vxe-input { - display: inline-block; - position: relative; - width: 180px; - &.is--disabled { - .vxe-input--date-picker-suffix, - .vxe-input--search-suffix, - .vxe-input--suffix, - .vxe-input--password-suffix, - .vxe-input--number-suffix { - cursor: no-drop; - } - } - &:not(.is--disabled) { - .vxe-input--search-suffix, - .vxe-input--clear-icon, - .vxe-input--password-suffix, - .vxe-input--number-suffix { - cursor: pointer; - } - &.is--active { - .vxe-input--inner { - border: 1px solid var(--vxe-primary-color); - } - } - } - .vxe-input--prefix, - .vxe-input--suffix, - .vxe-input--extra-suffix { - display: flex; - position: absolute; - top: 0; - width: $iconWidth; - height: 100%; - user-select: none; - align-items: center; - justify-content: center; - color: var(--vxe-table-column-icon-border-color); - } -} - -.vxe-input--count { - position: absolute; - top: 1px; - right: 0.5em; - height: calc(100% - 2px); - color: var(--vxe-input-count-color); - background-color: var(--vxe-input-count-background-color); - &.is--error { - color: var(--vxe-input-count-error-color); - } -} - -// 前缀图标 -.vxe-input { - .vxe-input--prefix { - left: 0.2em; - } - &.is--prefix { - .vxe-input--inner { - padding-left: $iconWidth + 0.2em; - } - } -} - -// 后缀图标 -.vxe-input { - .vxe-input--clear-icon { - display: none; - } - .vxe-input--suffix, - .vxe-input--extra-suffix { - right: 0.2em; - } - &.is--suffix { - .vxe-input--inner { - padding-right: $iconWidth + 0.2em; - } - &.is--count { - .vxe-input--inner { - padding-right: 5em; - } - } - .vxe-input--count { - right: $iconWidth + 0.5em; - } - } - &.is--left { - .vxe-input--inner { - text-align: left; - } - } - &.is--center { - .vxe-input--inner { - text-align: center; - } - } - &.is--right { - .vxe-input--inner { - text-align: right; - } - } - &.is--count { - .vxe-input--inner { - padding-right: 3.4em; - } - } - &.is--controls { - &.type--search, - &.type--password, - &.type--number, - &.type--integer, - &.type--float, - &.type--date, - &.type--datetime, - &.type--week, - &.type--month, - &.type--quarter, - &.type--year, - &.type--time { - .vxe-input--inner { - padding-right: $iconWidth + 0.2em; - } - .vxe-input--suffix { - right: $iconWidth; - } - } - } - &.is--suffix { - &.is--controls { - &.type--search, - &.type--password, - &.type--number, - &.type--integer, - &.type--float, - &.type--date, - &.type--datetime, - &.type--week, - &.type--month, - &.type--quarter, - &.type--year, - &.type--time { - .vxe-input--inner { - padding-right: $iconWidth * 2; - } - } - } - } - &.is--suffix { - &:hover { - .vxe-input--suffix { - &.is--clear { - .vxe-input--suffix-icon { - display: none; - } - .vxe-input--clear-icon { - display: inline; - } - } - } - } - } - &:not(.is--disabled) { - .vxe-input--suffix { - &:hover { - .vxe-input--clear-icon { - color: var(--vxe-font-color); - } - } - &:active { - .vxe-input--clear-icon { - color: var(--vxe-primary-color); - } - } - } - .vxe-input--extra-suffix { - &:hover { - .vxe-input--search-suffix, - .vxe-input--password-suffix { - color: var(--vxe-font-color); - } - } - &:active { - .vxe-input--search-suffix, - .vxe-input--password-suffix { - color: var(--vxe-primary-color); - } - } - } - .vxe-input--number-prev, - .vxe-input--number-next { - &:hover { - color: var(--vxe-font-color); - } - &:active { - color: var(--vxe-primary-color); - } - &.is--disabled { - cursor: no-drop; - color: var(--vxe-input-number-disabled-color); - } - } - } -} - -.vxe-input { - .vxe-input--password-suffix, - .vxe-input--number-suffix, - .vxe-input--date-picker-suffix, - .vxe-input--search-suffix { - position: relative; - width: 100%; - height: 100%; - } - - .vxe-input--date-picker-icon, - .vxe-input--search-icon, - .vxe-input--password-icon { - position: absolute; - left: 50%; - top: 50%; - transform: translate(-50%, -50%); - &[class*="vxe-icon-"] { - font-size: 1.2em; - } - } - - .vxe-input--date-picker-suffix { - display: flex; - align-items: center; - justify-content: center; - .vxe-input--panel-icon { - @include createAnimationTransition(transform, .2s); - } - } - - .vxe-input--number-prev, - .vxe-input--number-next { - position: relative; - display: block; - height: 50%; - width: 100%; - text-align: center; - } - .vxe-input--number-prev-icon, - .vxe-input--number-next-icon { - line-height: 0.8em; - position: absolute; - left: 50%; - transform: translateX(-50%); - } - .vxe-input--number-prev-icon { - bottom: 0; - } - .vxe-input--number-next-icon { - top: 0; - } -} - -.vxe-input--panel { - display: none; - position: absolute; - left: 0; - padding: 4px 0; - color: var(--vxe-font-color); - font-size: var(--vxe-font-size); - text-align: left; - &:not(.is--transfer) { - min-width: 100%; - } - &.is--transfer { - position: fixed; - } - &.animat--leave { - display: block; - opacity: 0; - transform: scaleY(0.5); - transition: transform .3s cubic-bezier(.23,1,.32,1), opacity .3s cubic-bezier(.23,1,.32,1); - transform-origin: center top; - backface-visibility: hidden; - transform-style: preserve-3d; - &[placement="top"] { - transform-origin: center bottom; - } - } - &.animat--enter { - opacity: 1; - transform: scaleY(1); - } -} - -.vxe-input--panel-wrapper, -.vxe-input--panel-layout-wrapper { - background-color: var(--vxe-input-panel-background-color); - border: 1px solid var(--vxe-table-popup-border-color); - box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1); - border-radius: var(--vxe-border-radius); -} - -.vxe-input--panel-wrapper { - overflow-x: hidden; - overflow-y: auto; -} - -.vxe-input--panel-layout-wrapper { - display: flex; - flex-direction: row; -} - -.vxe-input--panel { - &.type--date, - &.type--week, - &.type--month, - &.type--quarter, - &.type--year { - user-select: none; - } - &.type--datetime { - .vxe-input--panel-right-wrapper { - display: flex; - flex-direction: column; - border-left: 1px solid var(--vxe-input-border-color); - } - } - &.type--date, - &.type--datetime { - .vxe-input--date-picker-body { - th { - width: 14.28571%; - } - } - } - &.type--week { - .vxe-input--date-picker-body { - table { - th { - width: 12%; - &:first-child { - width: 14%; - } - } - } - } - } - &.type--quarter { - .vxe-input--date-picker-body { - table { - th { - width: 50%; - } - } - } - } - &.type--month, - &.type--year { - .vxe-input--date-picker-body { - td { - width: 25%; - } - } - } -} - -.vxe-input--time-picker-title { - display: inline-block; - text-align: center; - border: 1px solid var(--vxe-input-border-color); - border-radius: var(--vxe-border-radius); -} -.vxe-input--time-picker-confirm { - position: absolute; - right: 0; - top: 0; -} -.vxe-input--time-picker-confirm, -.vxe-input--date-picker-confirm { - outline: 0; - border: 1px solid var(--vxe-input-border-color); - border-radius: var(--vxe-border-radius); - cursor: pointer; - color: var(--vxe-input-date-time-confirm-button-color); - border-color: var(--vxe-primary-color); - background-color: var(--vxe-primary-color); - &:hover { - background-color: var(--vxe-primary-lighten-color); - border-color: var(--vxe-primary-lighten-color); - } - &:active { - background-color: var(--vxe-primary-darken-color); - border-color: var(--vxe-primary-darken-color); - } -} - -.vxe-input--time-picker-header { - display: flex; - position: relative; - flex-shrink: 0; -} - -.vxe-input--date-picker-header { - display: flex; - flex-direction: row; - user-select: none; - .vxe-input--date-picker-type-wrapper { - flex-grow: 1; - } - .vxe-input--date-picker-btn-wrapper { - flex-shrink: 0; - text-align: center; - } -} -.vxe-input--date-picker-type-wrapper { - .vxe-input--date-picker-label, - .vxe-input--date-picker-btn { - display: inline-block; - } -} -.vxe-input--date-picker-btn-wrapper { - display: flex; - flex-direction: row; -} -.vxe-input--date-picker-label, -.vxe-input--date-picker-btn { - display: flex; - align-items: center; - justify-content: center; - background-color: var(--vxe-button-default-background-color); -} -.vxe-input--date-picker-btn { - &.is--disabled { - color: var(--vxe-font-disabled-color); - cursor: no-drop; - } - &:not(.is--disabled) { - cursor: pointer; - &:hover { - background-color: #fff; - } - &:active { - background-color: #fff; - } - } -} -.vxe-input--date-picker-body { - border-radius: var(--vxe-border-radius); - border: 1px solid var(--vxe-table-popup-border-color); - user-select: none; - table { - border: 0; - width: 100%; - border-spacing: 0; - border-collapse: separate; - text-align: center; - table-layout: fixed - } - th, - td { - font-weight: normal; - } - th { - box-shadow: inset 0 -1px 0 0 var(--vxe-table-popup-border-color); - } - td { - &.is--prev, - &.is--next { - color: var(--vxe-font-disabled-color); - .vxe-input--date-label, - .vxe-input--date-festival { - color: var(--vxe-font-disabled-color); - } - } - &.is--now { - box-shadow: inset 0 0 0 1px var(--vxe-table-popup-border-color); - &:not(.is--selected) { - &.is--current { - color: var(--vxe-primary-color); - .vxe-input--date-label, - .vxe-input--date-festival { - color: var(--vxe-primary-color); - } - } - } - } - &.is--hover { - background-color: var(--vxe-input-date-picker-hover-background-color); - } - &.is--selected { - color: var(--vxe-input-date-picker-selected-color); - background-color: var(--vxe-primary-color); - &.is--prev, - &.is--next { - background-color: var(--vxe-primary-lighten-color); - } - .vxe-input--date-label, - .vxe-input--date-festival { - color: var(--vxe-input-date-picker-festival-selected-color); - } - .vxe-input--date-label { - &.is-notice { - &:before { - background-color: var(--vxe-input-date-picker-notice-selected-background-color); - } - } - } - } - &:not(.is--disabled) { - cursor: pointer; - } - &.is--disabled { - cursor: no-drop; - color: var(--vxe-input-disabled-color); - background-color: var(--vxe-input-disabled-background-color); - .vxe-input--date-label, - .vxe-input--date-festival { - color: var(--vxe-input-disabled-color); - } - } - } -} - -.vxe-input--date-week-view { - th { - &:first-child { - box-shadow: inset -1px -1px 0 0 var(--vxe-table-popup-border-color); - } - } - td { - &:first-child { - box-shadow: inset -1px 0 0 0 var(--vxe-table-popup-border-color); - } - } -} - -.vxe-input--date-label, -.vxe-input--date-festival { - display: block; - overflow: hidden; -} - -.vxe-input--date-label { - position: relative; - &.is-notice { - &:before { - content: ""; - position: absolute; - width: 4px; - height: 4px; - left: 0.8em; - top: 0.1em; - transform: translateX(-50%); - border-radius: 100%; - background-color: var(--vxe-input-date-notice-background-color); - } - } -} -.vxe-input--date-label--extra { - position: absolute; - right: 0.1em; - top: -0.2em; - font-size: 12px; - line-height: 12px; - transform: scale(0.7); - color: var(--vxe-input-date-extra-color); - &.is-important { - color: var(--vxe-input-date-extra-important-color); - } -} - -.vxe-input--date-festival { - color: var(--vxe-input-date-festival-color); - height: 14px; - line-height: 1; - overflow: hidden; - &.is-important { - color: var(--vxe-input-date-festival-important-color); - } -} -.vxe-input--date-festival--label { - display: block; - font-size: 12px; - transform: scale(0.8); -} - -@keyframes festivalOverlap2 { - 0%, 45%, 100% { - transform: translateY(0); - } - 50%, 95% { - transform: translateY(-14px); - } -} - -@keyframes festivalOverlap3 { - 0%, 20%, 100% { - transform: translateY(0); - } - 25%, 45%, 75%, 95% { - transform: translateY(-14px); - } - 50%, 70% { - transform: translateY(-28px); - } -} - -.vxe-input--date-festival--overlap { - display: block; - font-size: 12px; - &.overlap--2 { - animation: festivalOverlap2 6s infinite ease-in-out; - } - &.overlap--3 { - animation: festivalOverlap3 9s infinite ease-in-out; - } - & > span { - height: 14px; - display: block; - transform: scale(0.8); - } -} - -.vxe-input--time-picker-body { - position: relative; - display: flex; - flex-direction: row; - border: 1px solid var(--vxe-table-popup-border-color); - flex-grow: 1; - border-radius: var(--vxe-border-radius); - user-select: none; - & > ul { - height: 100%; - overflow: hidden; - margin: 0; - padding: 0; - &:before, - &:after { - content: " "; - display: block; - } - &:hover { - overflow-y: auto; - } - & > li { - display: block; - &:hover { - background-color: var(--vxe-input-date-picker-hover-background-color); - cursor: pointer; - } - &.is--selected { - font-weight: 700; - color: var(--vxe-primary-color); - } - } - } - .vxe-input--time-picker-minute-list { - border-left: 1px solid var(--vxe-table-popup-border-color); - } - .vxe-input--time-picker-second-list { - border-left: 1px solid var(--vxe-table-popup-border-color); - } -} - -.vxe-input { - font-size: var(--vxe-font-size); - height: var(--vxe-input-height-default); - line-height: var(--vxe-input-height-default); - .vxe-input--inner { - &[type="date"]::-webkit-inner-spin-button, - &[type="month"]::-webkit-inner-spin-button, - &[type="week"]::-webkit-inner-spin-button { - margin-top: 6px; - } - &[type="date"]::-webkit-inner-spin-button, - &[type="month"]::-webkit-inner-spin-button, - &[type="week"]::-webkit-inner-spin-button, - &[type="number"]::-webkit-inner-spin-button { - height: 24px; - } - } - &.size--medium { - font-size: var(--vxe-font-size-medium); - height: var(--vxe-input-height-medium); - line-height: var(--vxe-input-height-medium); - .vxe-input--inner { - &[type="date"]::-webkit-inner-spin-button, - &[type="month"]::-webkit-inner-spin-button, - &[type="week"]::-webkit-inner-spin-button { - margin-top: 4px; - } - } - } - &.size--small { - font-size: var(--vxe-font-size-small); - height: var(--vxe-input-height-small); - line-height: var(--vxe-input-height-small); - .vxe-input--inner { - &[type="date"]::-webkit-inner-spin-button, - &[type="month"]::-webkit-inner-spin-button, - &[type="week"]::-webkit-inner-spin-button { - margin-top: 2px; - } - } - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - height: var(--vxe-input-height-mini); - line-height: var(--vxe-input-height-mini); - .vxe-input--inner { - &[type="date"]::-webkit-inner-spin-button, - &[type="month"]::-webkit-inner-spin-button, - &[type="week"]::-webkit-inner-spin-button { - margin-top: 0; - } - } - } -} - -@mixin getPanelStyle ($sizeIndex) { - $fontSizeList: var(--vxe-font-size), var(--vxe-font-size-medium), var(--vxe-font-size-small), var(--vxe-font-size-mini); - $timeWeekRowHeightList: var(--vxe-input-date-time-week-row-height-default), var(--vxe-input-date-time-week-row-height-medium), var(--vxe-input-date-time-week-row-height-small), var(--vxe-input-date-time-week-row-height-mini); - $monthYearRowHeightList: var(--vxe-input-date-month-year-row-height-default), var(--vxe-input-date-month-year-row-height-medium), var(--vxe-input-date-month-year-row-height-small), var(--vxe-input-date-month-year-row-height-mini); - $quarterRowHeightList: var(--vxe-input-date-quarter-row-height-default), var(--vxe-input-date-quarter-row-height-medium), var(--vxe-input-date-quarter-row-height-small), var(--vxe-input-date-quarter-row-height-mini); - $titleRowHeightList: var(--vxe-input-date-title-height-default), var(--vxe-input-date-title-height-medium), var(--vxe-input-date-title-height-small), var(--vxe-input-date-title-height-mini); - - font-size: nth($fontSizeList, $sizeIndex); - .vxe-input--panel-wrapper { - max-height: 400px - $sizeIndex * 20; - } - &.type--date, - &.type--time, - &.type--week, - &.type--month, - &.type--quarter, - &.type--year { - .vxe-input--panel-wrapper { - padding: 12px - $sizeIndex; - } - } - &.type--date, - &.type--month, - &.type--quarter, - &.type--year { - .vxe-input--panel-wrapper { - $widthList: 336px, 336px, 312px, 288px; - width: nth($widthList, $sizeIndex); - } - } - &.type--week { - .vxe-input--panel-wrapper { - $widthList: 380px, 380px, 354px, 326px; - width: nth($widthList, $sizeIndex); - } - } - &.type--time { - .vxe-input--panel-wrapper { - $widthList: 170px, 168px, 154px, 146px; - width: nth($widthList, $sizeIndex); - } - } - &.type--datetime { - .vxe-input--panel-left-wrapper { - $widthList: 336px, 336px, 312px, 288px; - width: nth($widthList, $sizeIndex); - } - .vxe-input--panel-left-wrapper, - .vxe-input--panel-right-wrapper { - padding: 12px - $sizeIndex; - } - } - .vxe-input--time-picker-title { - height: 31px - $sizeIndex; - line-height: 31px - $sizeIndex; - padding: 0 12px - $sizeIndex; - } - .vxe-input--date-picker-label, - .vxe-input--date-picker-btn { - height: 31px - $sizeIndex; - line-height: 31px - $sizeIndex; - } - .vxe-input--date-picker-btn-wrapper { - .vxe-input--date-picker-btn { - margin-left: 9px - $sizeIndex; - } - .vxe-input--date-picker-prev-btn, - .vxe-input--date-picker-current-btn, - .vxe-input--date-picker-next-btn { - width: 31px - $sizeIndex; - border-radius: var(--vxe-border-radius); - border: 1px solid var(--vxe-input-border-color); - } - } - .vxe-input--date-picker-type-wrapper { - .vxe-input--date-picker-label, - .vxe-input--date-picker-btn { - padding: 0 10px - $sizeIndex; - } - } - .vxe-input--time-picker-header, - .vxe-input--date-picker-header { - $paddingBottomList: 8px, 7px, 6px, 5px; - padding-bottom: nth($paddingBottomList, $sizeIndex); - } - .vxe-input--date-picker-body table, - .vxe-input--time-picker-body { - height: calc(nth($timeWeekRowHeightList, $sizeIndex) * 6 + nth($titleRowHeightList, $sizeIndex)); - } - .vxe-input--time-picker-body { - $ulWidthList: 48px, 48px, 44px, 42px; - & > ul { - width: nth($ulWidthList, $sizeIndex); - &:before, - &:after { - $heightList: 120px, 120px, 110px, 100px; - height: nth($heightList, $sizeIndex); - } - & > li { - height: 26px; - padding-left: 10px - $sizeIndex; - } - } - .vxe-input--time-picker-minute-list { - left: nth($ulWidthList, $sizeIndex); - } - .vxe-input--time-picker-second-list { - left: calc(nth($ulWidthList, $sizeIndex) * 2); - } - } - .vxe-input--date-day-view, - .vxe-input--date-week-view { - td { - height: nth($timeWeekRowHeightList, $sizeIndex); - } - } - .vxe-input--date-quarter-view { - td { - height: nth($quarterRowHeightList, $sizeIndex); - } - } - .vxe-input--date-month-view, - .vxe-input--date-year-view { - td { - height: nth($monthYearRowHeightList, $sizeIndex); - } - } - .vxe-input--date-picker-body { - th { - height: nth($titleRowHeightList, $sizeIndex); - } - } - .vxe-input--time-picker-confirm, - .vxe-input--date-picker-confirm { - height: 31px - $sizeIndex; - padding: 0 10px - $sizeIndex; - } - .vxe-input--date-label { - line-height: calc(nth($fontSizeList, $sizeIndex) + 1px); - } -} - -.vxe-input--panel { - @include getPanelStyle(1); - &.size--medium { - @include getPanelStyle(2); - } - &.size--small { - @include getPanelStyle(3); - } - &.size--mini { - @include getPanelStyle(4); - } -} diff --git a/styles/keyboard.scss b/styles/keyboard.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/keyboard.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/list.scss b/styles/list.scss deleted file mode 100644 index 9237995099..0000000000 --- a/styles/list.scss +++ /dev/null @@ -1,28 +0,0 @@ -/**Variable**/ - -.vxe-list { - position: relative; - display: block; - padding: 0; - color: var(--vxe-font-color); - direction: ltr; - .vxe-list--virtual-wrapper { - position: relative; - overflow: auto; - } - .vxe-list--y-space { - width: 0; - float: left; - } - .vxe-list--virtual-wrapper, - .vxe-list--body { - padding: 0; - margin: 0; - border: 0; - outline: 0; - } -} - -.vxe-list--virtual-wrapper { - height: 100px; -} \ No newline at end of file diff --git a/styles/loading.scss b/styles/loading.scss deleted file mode 100644 index 9853f36db3..0000000000 --- a/styles/loading.scss +++ /dev/null @@ -1,87 +0,0 @@ -/**Variable**/ - -/*加载中*/ -.vxe-loading { - display: none; - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - z-index: 99; - user-select: none; - background-color: var(--vxe-loading-background-color); - &.is--visible { - display: block; - } - & > .vxe-loading--chunk, - & > .vxe-loading--wrapper { - width: 100%; - position: absolute; - top: 50%; - left: 0; - transform: translateY(-50%); - text-align: center; - color: var(--vxe-loading-color); - } - .vxe-loading--default-icon { - font-size: 1.4em; - } - .vxe-loading--text { - padding: 0.4em 0; - } - .vxe-loading--spinner { - display: inline-block; - position: relative; - width: 56px; - height: 56px; - &:before, - &:after { - content: ""; - width: 100%; - height: 100%; - border-radius: 50%; - background-color: var(--vxe-primary-color); - opacity: 0.6; - position: absolute; - top: 0; - left: 0; - animation: bounce 2.0s infinite ease-in-out; - } - &:after { - animation-delay: -1.0s; - } - } - @keyframes bounce { - 0%, 100% { - transform: scale(0); - } 50% { - transform: scale(1); - } - } -} - -.size--mini { - .vxe-loading { - .vxe-loading--spinner { - width: 38px; - height: 38px; - } - } -} -.size--small { - .vxe-loading { - .vxe-loading--spinner { - width: 44px; - height: 44px; - } - } -} -.size--medium { - .vxe-loading { - .vxe-loading--spinner { - width: 50px; - height: 50px; - } - } -} \ No newline at end of file diff --git a/styles/modal.scss b/styles/modal.scss deleted file mode 100644 index 8d55275698..0000000000 --- a/styles/modal.scss +++ /dev/null @@ -1,384 +0,0 @@ -/**Variable**/ -@import './helpers/mixin.scss'; - -.vxe-modal--wrapper { - display: none; - position: fixed; - top: 0; - left: 0; - line-height: 1.5; - width: calc(100% + 18px); - height: calc(100% + 18px); - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); - transition: top .4s ease-in-out; - &.is--active { - display: block; - } - &.is--visible { - &.is--mask { - &:before { - background-color: rgba(0, 0, 0, 0.5); - } - } - &.type--message { - .vxe-modal--box { - opacity: 1; - transform: translateY(0); - } - } - .vxe-modal--box { - opacity: 1; - visibility: visible; - } - } - &.is--loading { - .vxe-modal--header, - .vxe-modal--footer { - position: relative; - border-bottom-color: var(--vxe-loading-background-color); - &:before { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: 1; - user-select: none; - background-color: var(--vxe-loading-background-color); - } - } - } - &:not(.lock--view) { - pointer-events: none; - } - &:not(.type--message) { - &.lock--scroll { - overflow: hidden; - } - &:not(.lock--scroll) { - overflow: auto; - } - } - &.lock--view, - &.is--mask { - &:before { - content: ""; - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: -1; - pointer-events: auto; - } - } - &.is--mask { - &:before { - background-color: rgba(0, 0, 0, 0); - } - } - &.is--animat { - &.is--mask { - &:before { - @include createAnimationTransition(background-color, .2s); - } - } - &.type--message { - .vxe-modal--box { - &:not(.is--drag) { - @include createAnimationTransition(all, .4s, ease-out); - } - } - } - } - &.type--message, - &.type--alert, - &.type--confirm { - .vxe-modal--body { - white-space: normal; - word-break: break-word; - } - } - &.type--message { - text-align: center; - .vxe-modal--box { - display: inline-block; - padding: 2px 0; - margin-top: 0; - width: auto; - box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); - opacity: 0; - transform: translateY(-100%); - .vxe-modal--body { - &:after { - content: ''; - display: block; - clear: both; - height: 0; - overflow: hidden; - visibility: hidden; - } - } - .vxe-modal--content { - max-width: 800px; - float: left; - } - } - .vxe-modal--status-wrapper { - font-size: 1.4em; - padding-left: 10px; - } - } - &.type--modal, - &.type--alert, - &.type--confirm { - .vxe-modal--box { - display: flex; - flex-direction: column; - position: fixed; - left: 50%; - top: 0; - box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); - } - .vxe-modal--body { - overflow: auto; - .vxe-modal--content { - overflow: auto; - } - } - } - - &.type--alert, - &.type--confirm { - .vxe-modal--status-wrapper { - font-size: 1.6em; - padding-left: 10px; - } - } - .vxe-modal--box { - visibility: hidden; - width: 420px; - background-color: var(--vxe-modal-body-background-color); - border-radius: var(--vxe-border-radius); - border: 1px solid var(--vxe-modal-border-color); - text-align: left; - pointer-events: auto; - opacity: 0; - &.is--drag { - cursor: move; - .vxe-modal--body, - .vxe-modal--footer { - &:after { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - } - } - .vxe-modal--body { - overflow: hidden; - .vxe-modal--content { - overflow: hidden; - } - } - } - } - &.status--info { - .vxe-modal--status-wrapper { - color: var(--vxe-info-color); - } - } - &.status--warning, - &.status--question { - .vxe-modal--status-wrapper { - color: var(--vxe-warning-color); - } - } - &.status--success { - .vxe-modal--status-wrapper { - color: var(--vxe-success-color); - } - } - &.status--error { - .vxe-modal--status-wrapper { - color: var(--vxe-danger-color); - } - } - &.status--loading { - .vxe-modal--status-wrapper { - color: var(--vxe-font-disabled-color); - } - } - .vxe-modal--status-wrapper { - flex-shrink: 0; - display: flex; - align-items: center; - } - .vxe-modal--content { - flex-grow: 1; - padding: 0.8em 1em; - white-space: pre-line; - } - .vxe-modal--header, - .vxe-modal--body, - .vxe-modal--footer { - position: relative; - } - .vxe-modal--body { - display: flex; - flex-grow: 1; - } - .vxe-modal--header { - display: flex; - flex-direction: row; - flex-shrink: 0; - font-size: 1.1em; - font-weight: 700; - border-bottom: 1px solid var(--vxe-modal-border-color); - background-color: var(--vxe-modal-header-background-color); - border-radius: var(--vxe-border-radius) var(--vxe-border-radius) 0 0; - user-select: none; - &.is--draggable { - .vxe-modal--header-title { - cursor: move; - } - } - &.is--ellipsis { - .vxe-modal--header-title { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - } - } - .vxe-modal--header-title { - flex-grow: 1; - padding: 0.6em 0 0.6em 1em; - } - .vxe-modal--header-right { - flex-shrink: 0; - padding: 0.6em 1em 0.6em 0; - } - .vxe-modal--zoom-btn, - .vxe-modal--close-btn { - cursor: pointer; - margin-left: 0.6em; - &:hover { - color: var(--vxe-primary-color); - } - } - .vxe-modal--footer { - flex-shrink: 0; - text-align: right; - padding: 0.4em 1em 0.8em 1em; - } - &.is--maximize { - .vxe-modal--box { - .vxe-modal--header { - cursor: default; - } - } - .vxe-modal--resize { - .wl-resize, - .wr-resize, - .swst-resize, - .sest-resize, - .st-resize, - .swlb-resize, - .selb-resize, - .sb-resize { - display: none; - } - } - } - .vxe-modal--resize { - $SpaceSize: 8px; - $SpaceWidth: 5px; - .wl-resize, - .wr-resize, - .swst-resize, - .sest-resize, - .st-resize, - .swlb-resize, - .selb-resize, - .sb-resize { - position: absolute; - z-index: 100; - } - .wl-resize, - .wr-resize { - width: $SpaceSize; - height: 100%; - top: 0; - cursor: w-resize; - } - .wl-resize { - left: -$SpaceWidth; - } - .wr-resize { - right: -$SpaceWidth; - } - .swst-resize, - .sest-resize, - .swlb-resize, - .selb-resize { - width: $SpaceSize + 2; - height: $SpaceSize + 2; - z-index: 101; - } - .swst-resize, - .sest-resize { - top: -$SpaceSize; - } - .swlb-resize, - .selb-resize { - bottom: -$SpaceSize; - } - .sest-resize, - .swlb-resize { - cursor: sw-resize; - } - .swst-resize, - .selb-resize { - cursor: se-resize; - } - .swst-resize, - .swlb-resize { - left: -$SpaceSize; - } - .sest-resize, - .selb-resize { - right: -$SpaceSize; - } - .st-resize, - .sb-resize { - width: 100%; - height: $SpaceSize; - left: 0; - cursor: s-resize; - } - .st-resize { - top: -$SpaceWidth; - } - .sb-resize { - bottom: -$SpaceWidth; - } - } -} - -.vxe-modal--wrapper { - font-size: var(--vxe-font-size); - &.size--medium { - font-size: var(--vxe-font-size-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - } -} \ No newline at end of file diff --git a/styles/modules.scss b/styles/modules.scss index 8f2db56c01..85d96d10cc 100644 --- a/styles/modules.scss +++ b/styles/modules.scss @@ -1,35 +1,7 @@ -// 该文件已废弃，请使用 vxe-table/styles/all.scss +/*已废弃*/ -@import './variable.scss'; -@import './theme/default.scss'; -@import './theme/dark.scss'; -@import './filter.scss'; -@import './menu.scss'; -@import './export.scss'; -@import './custom.scss'; - -@import './icon.scss'; -@import './table.scss'; -@import './grid.scss'; -@import './toolbar.scss'; -@import './pager.scss'; -@import './checkbox.scss'; -@import './checkbox-group.scss'; -@import './radio.scss'; -@import './radio-group.scss'; -@import './radio-button.scss'; -@import './input.scss'; -@import './textarea.scss'; -@import './button.scss'; -@import './modal.scss'; -@import './drawer.scss'; -@import './tooltip.scss'; -@import './form.scss'; -@import './form-item.scss'; -@import './form-gather.scss'; -@import './select.scss'; -@import './optgroup.scss'; -@import './option.scss'; -@import './switch.scss'; -@import './list.scss'; -@import './pulldown.scss'; +@import './components/column.scss'; +@import './components/colgroup.scss'; +@import './components/table.scss'; +@import './components/grid.scss'; +@import './components/toolbar.scss'; diff --git a/styles/old-icon.scss b/styles/old-icon.scss deleted file mode 100644 index 38525d5bfa..0000000000 --- a/styles/old-icon.scss +++ /dev/null @@ -1,718 +0,0 @@ -@import './variable.scss'; -@import './helpers/mixin.scss'; - -[class*="vxe-icon--"] { - display: inline-block; - vertical-align: middle; - position: relative; - direction: ltr; - font-family: var(--vxe-icon-font-family); - font-weight: normal; - user-select: none; - &.rotate45 { - transform: rotate(45deg); - } - &.rotate90 { - transform: rotate(90deg); - } - &.rotate180 { - transform: rotate(180deg); - } -} - -%DefaultWidthHeight { - width: 1em; - height: 1em; - line-height: 1em; -} - -%PseudoClass { - content: ""; - position: absolute; -} - -.vxe-icon--square { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - left: 0.05em; - top: 0.05em; - width: 0.9em; - height: 0.9em; - border-width: 0.1em; - border-style: solid; - border-color: inherit; - } -} - -.vxe-icon--zoomin { - @extend %DefaultWidthHeight; - border-width: 0.1em; - border-style: solid; - border-color: inherit; - background-color: var(--vxe-icon-background-color); - &:before, - &:after { - @extend %PseudoClass; - background-color: inherit; - } - &:before { - left: -0.1em; - top: 0.2em; - width: 1.1em; - height: 0.4em; - } - &:after { - top: -0.1em; - left: 0.2em; - width: 0.4em; - height: 1.1em; - } -} - -.vxe-icon--zoomout { - @extend %DefaultWidthHeight; - position: relative; - &:before { - @extend %PseudoClass; - right: 0; - top: 0; - width: 0.7em; - height: 0.7em; - border-width: 0.1em; - border-style: solid; - border-color: inherit; - } - &:after { - @extend %PseudoClass; - left: 0.1em; - bottom: 0.1em; - width: 0.7em; - height: 0.7em; - border-width: 0.1em; - border-style: solid; - border-color: inherit; - background-color: var(--vxe-icon-background-color); - } -} - -.vxe-icon--menu { - $yOffset: 0.36em; - @extend %DefaultWidthHeight; - &:before { - content: ""; - display: inline-block; - width: 0.22em; - height: 0.22em; - box-shadow: 0 -#{$yOffset} 0, -#{$yOffset} -#{$yOffset} 0, #{$yOffset} -#{$yOffset} 0, 0 0 0 1em inset, -#{$yOffset} 0 0, #{$yOffset} 0 0, 0 #{$yOffset} 0, -#{$yOffset} #{$yOffset} 0, #{$yOffset} #{$yOffset} 0; - margin: 0.26em; - } -} - -%Caret { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - border-width: 0.4em; - border-style: solid; - border-color: transparent; - } -} - -.vxe-icon--caret-top { - @extend %Caret; - &:before { - left: 0.1em; - bottom: 0.3em; - border-bottom-color: inherit; - } -} - -.vxe-icon--caret-bottom { - @extend %Caret; - &:before { - left: 0.1em; - top: 0.3em; - border-top-color: inherit; - } -} - -.vxe-icon--caret-left { - @extend %Caret; - &:before { - right: 0.3em; - bottom: 0.1em; - border-right-color: inherit; - } -} - -.vxe-icon--caret-right { - @extend %Caret; - &:before { - left: 0.3em; - bottom: 0.1em; - border-left-color: inherit; - } -} - -%BeforeArrowTop { - &:before { - @extend %PseudoClass; - top: 0.32em; - left: 0.12em; - width: 0.6em; - height: 0.6em; - border-width: 0.1em; - border-style: solid; - border-top-color: inherit; - border-right-color: inherit; - border-bottom-color: transparent; - border-left-color: transparent; - } -} - -.vxe-icon--arrow-top { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - top: 0.4em; - left: 0.14em; - width: 0.7em; - height: 0.7em; - border-width: 0.15em; - border-style: solid; - border-top-color: inherit; - border-right-color: inherit; - border-bottom-color: transparent; - border-left-color: transparent; - border-radius: 0.15em; - transform: rotate(-45deg); - } -} - -.vxe-icon--arrow-bottom { - @extend .vxe-icon--arrow-top; - &:before { - top: 0; - left: 0.14em; - transform: rotate(135deg); - } -} - -.vxe-icon--arrow-left { - @extend .vxe-icon--arrow-top; - &:before { - top: 0.18em; - left: 0.35em; - transform: rotate(-135deg); - } -} - -.vxe-icon--arrow-right { - @extend .vxe-icon--arrow-top; - &:before { - top: 0.18em; - left: 0; - transform: rotate(45deg); - } -} - -.vxe-icon--d-arrow-left { - @extend %DefaultWidthHeight; - &:before { - left: 0.15em; - } - &:after { - left: 0.58em; - } - &:before, - &:after { - @extend %PseudoClass; - top: 0.18em; - width: 0.7em; - height: 0.7em; - border-width: 0.15em; - border-style: solid; - border-top-color: inherit; - border-right-color: transparent; - border-bottom-color: transparent; - border-left-color: inherit; - border-radius: 0.15em; - transform: rotate(-45deg); - } -} - -.vxe-icon--d-arrow-right { - @extend .vxe-icon--d-arrow-left; - &:before, - &:after { - transform: rotate(135deg); - } - &:before { - left: -0.25em; - } - &:after { - left: 0.18em; - } -} - -.vxe-icon--funnel { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - top: 0.05em; - left: 0; - border-width: 0.5em; - border-style: solid; - border-top-color: inherit; - border-right-color: transparent; - border-bottom-color: transparent; - border-left-color: transparent; - } - &:after { - @extend %PseudoClass; - left: 0.41em; - top: 0.4em; - width: 0; - height: 0.5em; - border-width: 0 0.2em 0 0; - border-style: solid; - border-right-color: inherit; - } -} - -.vxe-icon--edit-outline { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - height: 0.84em; - width: 0.86em; - top: 0.1em; - left: 0.02em; - border-radius: 0.2em; - border-width: 0.1em; - border-style: solid; - border-color: inherit; - } - &:after { - @extend %PseudoClass; - left: 0.6em; - bottom: 0.2em; - width: 0; - height: 0.8em; - border-radius: 0 0 80% 80%; - border-width: 0 0 0 0.22em; - border-style: solid; - border-color: inherit; - transform: rotate(45deg); - } -} - -.vxe-icon--more { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - content: "..."; - top: 0; - left: 0.1em; - line-height: 0.5em; - font-weight: 700; - } -} - -.vxe-icon--plus { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - content: "+"; - left: -0.12em; - bottom: -0.1em; - line-height: 1em; - font-size: 1.6em; - } -} - -.vxe-icon--check { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - left: 0.25em; - bottom: 0.2em; - width: 0.5em; - height: 0.9em; - border-width: 0.15em; - border-style: solid; - border-top-color: transparent; - border-right-color: inherit; - border-bottom-color: inherit; - border-radius: 0.15em; - border-left-color: transparent; - transform: rotate(45deg); - } -} - -.vxe-icon--close { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - content: "+"; - left: -0.1em; - bottom: -0.16em; - line-height: 1em; - font-size: 1.8em; - transform: rotate(45deg); - } -} - -.vxe-icon--minus { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - content: "\2500"; - left: 0; - bottom: 0; - width: 100%; - text-align: center; - line-height: 0.9em; - font-size: 1.2em; - } -} - -.vxe-icon--refresh { - @extend %DefaultWidthHeight; - border-width: 0.1em; - border-style: solid; - border-radius: 50%; - border-right-color: transparent !important; - border-left-color: transparent !important; - &:before { - left: 50%; - top: 0; - transform: translateX(50%) rotate(-45deg); - } - &:after { - right: 50%; - bottom: 0; - transform: translateX(-50%) rotate(135deg); - } - &:before, - &:after { - @extend %PseudoClass; - width: 0; - height: 0; - border-width: 0.25em; - border-style: solid; - border-right-color: transparent; - border-bottom-color: transparent; - border-left-color: transparent; - } - &.roll { - animation: rollCircle 1s infinite linear; - } -} - -@keyframes rollCircle { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - } -} - -%BeforeSolidRadius { - content: ""; - border-radius: 50%; - border-width: 0.5em; - border-style: solid; - border-color: inherit; - position: absolute; - top: 0; - left: 0; - transform: scale(0.95); -} - -%QuestionAndInfoWarning { - &:after { - @extend %PseudoClass; - left: 0; - bottom: 0; - width: 100%; - text-align: center; - color: var(--vxe-icon-background-color); - transform: rotate(-10deg) scale(0.75); - } -} - -.vxe-icon--question { - @extend %DefaultWidthHeight, %QuestionAndInfoWarning; - &:before { - @extend %BeforeSolidRadius; - } - &:after { - content: "\3F"; - } -} - -.vxe-icon--info { - @extend %DefaultWidthHeight, %QuestionAndInfoWarning; - &:before { - @extend %BeforeSolidRadius; - } - &:after { - content: "\A1"; - } -} - -.vxe-icon--warning { - @extend %DefaultWidthHeight, %QuestionAndInfoWarning; - &:before { - @extend %BeforeSolidRadius; - } - &:after { - content: "\21"; - } -} - -.vxe-icon--success { - @extend %DefaultWidthHeight; - &:before { - @extend %BeforeSolidRadius; - } - &:after { - @extend %PseudoClass; - content: "\2713"; - left: 0.25em; - bottom: 0; - color: var(--vxe-icon-background-color); - font-size: 0.65em; - } -} - -.vxe-icon--circle-plus { - @extend %DefaultWidthHeight; - &:before { - @extend %BeforeSolidRadius; - } - &:after { - @extend %PseudoClass; - content: "+"; - left: 0; - bottom: 0; - width: 100%; - text-align: center; - color: var(--vxe-icon-background-color); - line-height: 1.4em; - font-size: 0.8em; - } -} - -.vxe-icon--remove { - @extend %DefaultWidthHeight; - &:before { - @extend %BeforeSolidRadius; - } - &:after { - @extend %PseudoClass; - content: "\2500"; - left: 0; - bottom: 0; - width: 100%; - text-align: center; - line-height: 1.5em; - color: var(--vxe-icon-background-color); - font-size: 0.7em; - } -} - -.vxe-icon--error { - @extend %DefaultWidthHeight; - &:before { - @extend %BeforeSolidRadius; - } - &:after { - @extend %PseudoClass; - content: "\D7"; - left: 0; - bottom: 0; - width: 100%; - line-height: 1.4em; - text-align: center; - color: var(--vxe-icon-background-color); - font-size: 0.8em; - } -} - -.vxe-icon--upload, -.vxe-icon--download { - @extend %DefaultWidthHeight; - overflow: hidden; - &:before { - @extend %PseudoClass; - left: 0; - width: 1em; - border-width: 0; - border-style: solid; - border-color: inherit; - } - &:after { - @extend %PseudoClass; - width: 100%; - text-align: center; - font-size: 2em; - } -} - -.vxe-icon--upload { - &:before { - top: 0.1em; - border-top-width: 0.1em; - } - &:after { - content: "\2191"; - left: 0; - top: 0.15em; - } -} - -.vxe-icon--download { - &:before { - bottom: 0.05em; - border-bottom-width: 0.1em; - } - &:after { - content: "\2191"; - left: 0; - bottom: 0.15em; - transform: rotate(180deg); - } -} - -.vxe-icon--eye, -.vxe-icon--eye-slash { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - content: "\25CF"; - top: 0.16em; - left: 0; - width: 1em; - height: 0.68em; - line-height: 0.25em; - border-radius: 50%; - border-width: 0.1em; - border-style: solid; - border-color: inherit; - text-align: center; - } -} - -.vxe-icon--eye-slash { - &:after { - @extend %PseudoClass; - top: -0.1em; - left: 0.45em; - width: 0; - height: 1.2em; - border-width: 0; - border-style: solid; - border-color: inherit; - border-left-width: 0.1em; - transform: rotate(45deg); - } -} - -.vxe-icon--calendar { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - top: 0.15em; - left: 0; - width: 1em; - height: 0.8em; - border-width: 0.2em 0.1em 0.1em 0.1em; - border-radius: 0.1em 0.1em 0 0; - border-style: solid; - border-color: inherit; - } - &:after { - @extend %PseudoClass; - left: 0.2em; - top: 0; - width: 0.6em; - height: 0.3em; - border-width: 0 0.1em; - border-style: solid; - border-color: inherit; - } -} - -.vxe-icon--dot { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - top: 0.25em; - left: 0.25em; - border-radius: 50%; - border-width: 0.25em; - border-style: solid; - border-color: inherit; - } -} - -.vxe-icon--print { - @extend %DefaultWidthHeight; - box-shadow: inset 0 0 0 0.1em; - border-width: 0.2em 0; - border-style: solid; - border-color: transparent !important; - border-radius: 0.3em 0.3em 0 0; - &:before { - @extend %PseudoClass; - width: 0.6em; - height: 0.3em; - top: -0.2em; - left: 0.2em; - box-shadow: inset 0 0 0 0.1em; - } - &:after { - @extend %PseudoClass; - width: 0.6em; - height: 0.6em; - left: 0.2em; - bottom: -0.2em; - box-shadow: inset 0 0 0 0.1em; - background-color: var(--vxe-icon-background-color); - } -} - -.vxe-icon--search { - @extend %DefaultWidthHeight; - &:before { - @extend %PseudoClass; - top: 0; - left: 0; - width: 0.8em; - height: 0.8em; - border-width: 0.15em; - border-style: solid; - border-color: inherit; - border-radius: 50%; - } - &:after { - @extend %PseudoClass; - top: 0.75em; - left: 0.6em; - width: 0.35em; - height: 0; - border-width: 0.15em 0 0 0; - border-style: solid; - border-color: inherit; - transform: rotate(45deg); - } -} - -// 已废弃 -.vxe-icon-warnion-circle-fill:before { - content: "\e848"; -} \ No newline at end of file diff --git a/styles/optgroup.scss b/styles/optgroup.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/optgroup.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/option.scss b/styles/option.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/option.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/pager.scss b/styles/pager.scss deleted file mode 100644 index 383a6abbd9..0000000000 --- a/styles/pager.scss +++ /dev/null @@ -1,288 +0,0 @@ -/**Variable**/ -@import './helpers/mixin.scss'; - -/*pager*/ -.vxe-pager { - position: relative; - display: flex; - align-items: center; - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); - text-align: right; - background-color: var(--vxe-pager-background-color); - &.is--hidden { - display: none; - } - &.align--left { - text-align: left; - } - &.align--center { - text-align: center; - } - &.is--loading { - &:after { - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: var(--vxe-loading-z-index); - user-select: none; - background-color: var(--vxe-loading-background-color); - } - } - .vxe-pager--prev-btn, - .vxe-pager--next-btn, - .vxe-pager--num-btn, - .vxe-pager--jump-prev, - .vxe-pager--jump-next { - color: inherit; - outline: 0; - padding: 0; - border: 1px solid transparent; - font-size: inherit; - &:not(.is--disabled) { - &:focus { - box-shadow: 0 0 0.25em 0 var(--vxe-primary-color); - } - &:hover { - color: var(--vxe-primary-lighten-color); - } - &:active { - background-color: #fff; - } - } - } - &.is--border, - &.is--perfect { - &:not(.is--background) { - .vxe-pager--prev-btn, - .vxe-pager--next-btn, - .vxe-pager--num-btn, - .vxe-pager--jump-prev, - .vxe-pager--jump-next { - border-color: var(--vxe-input-border-color); - } - } - } - &.is--background, - &.is--perfect { - .vxe-pager--prev-btn, - .vxe-pager--next-btn, - .vxe-pager--jump-prev, - .vxe-pager--num-btn, - .vxe-pager--jump-next { - background-color: var(--vxe-pager-perfect-button-background-color); - } - .vxe-pager--jump-prev, - .vxe-pager--num-btn, - .vxe-pager--jump-next { - &:not(.is--disabled) { - &.is--active { - color: #fff; - background-color: var(--vxe-primary-color); - &:hover { - background-color: var(--vxe-primary-lighten-color); - } - &:focus { - border-color: var(--vxe-primary-color); - } - &:active { - border-color: var(--vxe-primary-darken-color); - background-color: var(--vxe-primary-darken-color); - } - } - } - } - } - &.is--perfect { - border: 1px solid var(--vxe-table-border-color); - border-top-width: 0; - background-color: var(--vxe-pager-perfect-background-color); - } - &.is--border { - .vxe-pager--num-btn { - &.is--active { - border-color: var(--vxe-primary-color); - } - } - } - .vxe-pager--wrapper { - flex-grow: 1; - } - .vxe-pager--jump-icon, - .vxe-pager--btn-icon { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - } - .vxe-pager--left-wrapper, - .vxe-pager--right-wrapper, - .vxe-pager--total, - .vxe-pager--prev-btn, - .vxe-pager--next-btn, - .vxe-pager--jump, - .vxe-pager--jump-prev, - .vxe-pager--jump-next, - .vxe-pager--count, - .vxe-pager--sizes { - margin: 0 0.4em; - vertical-align: middle; - display: inline-block; - } - .vxe-pager--prev-btn, - .vxe-pager--jump-prev, - .vxe-pager--num-btn, - .vxe-pager--jump-next, - .vxe-pager--next-btn { - position: relative; - cursor: pointer; - } - .vxe-pager--left-wrapper, - .vxe-pager--right-wrapper, - .vxe-pager--count, - .vxe-pager--prev-btn, - .vxe-pager--next-btn, - .vxe-pager--jump-prev, - .vxe-pager--num-btn, - .vxe-pager--jump-next { - height: 2.15em; - line-height: 2em; - display: inline-block; - } - .vxe-pager--jump .vxe-pager--goto, - .vxe-pager--sizes > .vxe-input { - height: 2.15em; - line-height: 2.15em; - } - .vxe-pager--sizes > .vxe-select--panel .vxe-select-option { - text-align: center; - } - .vxe-pager--jump-prev, - .vxe-pager--prev-btn, - .vxe-pager--next-btn, - .vxe-pager--jump-next, - .vxe-pager--num-btn, - .vxe-pager--count { - min-width: 2.15em; - } - .vxe-pager--btn-wrapper { - padding: 0; - margin: 0; - display: inline-block; - text-align: center; - .vxe-pager--jump-prev, - .vxe-pager--jump-next { - &:hover { - .vxe-pager--jump-more-icon { - display: none; - } - .vxe-pager--jump-icon { - display: inline-block; - } - } - } - .vxe-pager--jump-icon { - display: none; - } - } - .vxe-pager--jump-prev, - .vxe-pager--prev-btn, - .vxe-pager--next-btn, - .vxe-pager--jump-next, - .vxe-pager--num-btn { - text-align: center; - border-radius: var(--vxe-border-radius); - margin: 0 0.25em; - user-select: none; - background-color: var(--vxe-pager-background-color); - &:not(.is--disabled) { - &:hover { - color: var(--vxe-primary-lighten-color); - } - &.is--active, - &:focus { - color: var(--vxe-primary-color); - } - &:active { - color: var(--vxe-primary-darken-color); - } - } - &.is--disabled { - cursor: no-drop; - color: var(--vxe-font-disabled-color); - &:hover { - color: var(--vxe-font-disabled-color); - } - } - } - .vxe-pager--num-btn { - vertical-align: middle; - &.is--active { - font-weight: 700; - } - } - .vxe-pager--sizes { - width: 7em; - text-align: center; - cursor: pointer; - & .vxe-input--inner { - text-align: center; - } - } - .vxe-pager--count { - text-align: center; - & > span { - vertical-align: middle; - } - .vxe-pager--separator { - margin-right: 0.2em; - &:before { - content: "/"; - } - } - } - .vxe-pager--jump .vxe-pager--goto { - border-radius: var(--vxe-border-radius); - border: 1px solid var(--vxe-input-border-color); - color: var(--vxe-font-color); - transition: border .2s ease-in-out; - padding: 0 0.4em; - background-color: var(--vxe-input-background-color); - &:focus { - border: 1px solid var(--vxe-primary-color); - outline: 0; - } - } - .vxe-pager--jump { - .vxe-pager--goto-text { - margin-right: 0.25em; - } - .vxe-pager--classifier-text { - margin-left: 0.25em; - } - .vxe-pager--goto { - width: 3.2em; - text-align: center; - } - } -} - -.vxe-pager { - font-size: var(--vxe-font-size); - height: var(--vxe-table-row-height-default); - &.size--medium { - font-size: var(--vxe-font-size-medium); - height: var(--vxe-table-row-height-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - height: var(--vxe-table-row-height-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - height: var(--vxe-table-row-height-mini); - } -} \ No newline at end of file diff --git a/styles/pulldown.scss b/styles/pulldown.scss deleted file mode 100644 index 0e88b31df8..0000000000 --- a/styles/pulldown.scss +++ /dev/null @@ -1,57 +0,0 @@ -/**Variable**/ -/**Variable**/ -@import './helpers/mixin.scss'; - -.vxe-pulldown { - position: relative; - display: inline-block; - color: var(--vxe-font-color); - text-align: left; -} - -.vxe-pulldown--panel { - display: none; - position: absolute; - left: 0; - padding: 4px 0; - color: var(--vxe-font-color); - text-align: left; - &:not(.is--transfer) { - min-width: 100%; - } - &.is--transfer { - position: fixed; - } - &.animat--leave { - display: block; - opacity: 0; - transform: scaleY(0.5); - transition: transform .3s cubic-bezier(.23,1,.32,1), opacity .3s cubic-bezier(.23,1,.32,1); - transform-origin: center top; - backface-visibility: hidden; - &[placement="top"] { - transform-origin: center bottom; - } - } - &.animat--enter { - opacity: 1; - transform: scaleY(1); - } -} -.vxe-pulldown--panel-wrapper { - background-color: var(--vxe-pulldown-panel-background-color); -} - -.vxe-pulldown, -.vxe-pulldown--panel { - font-size: var(--vxe-font-size); - &.size--medium { - font-size: var(--vxe-font-size-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - } -} diff --git a/styles/radio-button.scss b/styles/radio-button.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/radio-button.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/radio-group.scss b/styles/radio-group.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/radio-group.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/radio.scss b/styles/radio.scss deleted file mode 100644 index b1dddb37e1..0000000000 --- a/styles/radio.scss +++ /dev/null @@ -1,147 +0,0 @@ -/**Variable**/ -@import './helpers/mixin.scss'; -@import './base/common.scss'; - -/*radio-group*/ -.vxe-radio-group { - display: inline-block; - vertical-align: middle; - line-height: 1; - font-size: 0; - &+.vxe-radio-group { - margin-left: 10px; - } -} - -/*radio*/ -.vxe-radio { - @include createRadioIcon(); - display: inline-block; - vertical-align: middle; - white-space: nowrap; - line-height: 1; - > input { - &[type="radio"] { - position: absolute; - width: 0; - height: 0; - border: 0; - appearance: none; - } - } - .vxe-radio--label { - vertical-align: middle; - display: inline-block; - max-width: 50em; - @extend %TextEllipsis; - } - &:not(.is--disabled) { - > input { - &:focus+.vxe-radio--icon { - color: var(--vxe-primary-color); - } - } - } - &:not(.vxe-radio-button) { - &+.vxe-radio { - margin-left: 10px; - } - } -} - -.vxe-radio-button { - .vxe-radio--label { - background-color: var(--vxe-radio-button-default-background-color); - } - &:first-child { - .vxe-radio--label { - border-left: 1px solid var(--vxe-input-border-color); - border-radius: var(--vxe-border-radius) 0 0 var(--vxe-border-radius); - } - } - &:last-child { - .vxe-radio--label { - border-radius: 0 var(--vxe-border-radius) var(--vxe-border-radius) 0; - } - } - > input { - &:checked+.vxe-radio--label { - color: #fff; - background-color: var(--vxe-primary-color); - border-color: var(--vxe-primary-color); - } - } - .vxe-radio--label { - padding: 0 1em; - line-height: calc(var(--vxe-button-height-default) - 2px); - display: inline-block; - border-style: solid; - border-color: var(--vxe-input-border-color); - border-width: 1px 1px 1px 0; - max-width: 50em; - @extend %TextEllipsis; - } - &.is--disabled { - cursor: not-allowed; - > input { - &:not(:checked) { - &+.vxe-radio--label { - color: var(--vxe-input-disabled-color); - } - } - &:checked { - &+.vxe-radio--label { - border-color: var(--vxe-primary-lighten-color); - background-color: var(--vxe-primary-lighten-color); - } - } - } - } - &:not(.is--disabled) { - & > input { - &:focus { - &+.vxe-radio--label { - border-color: var(--vxe-primary-color); - box-shadow: 0 0 0.2em 0 var(--vxe-primary-color); - } - } - } - &:hover { - > input { - &:not(:checked) { - &+.vxe-radio--label { - color: var(--vxe-primary-color); - } - } - } - } - } - &.size--medium { - .vxe-radio--label { - line-height: calc(var(--vxe-button-height-medium) - 2px); - } - } - &.size--small { - .vxe-radio--label { - line-height: calc(var(--vxe-button-height-small) - 2px); - } - } - &.size--mini { - .vxe-radio--label { - line-height: calc(var(--vxe-button-height-mini) - 2px); - } - } -} - -.vxe-radio { - font-size: var(--vxe-font-size); - &.size--medium { - font-size: var(--vxe-font-size-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - } -} \ No newline at end of file diff --git a/styles/select.scss b/styles/select.scss deleted file mode 100644 index 3278020fcc..0000000000 --- a/styles/select.scss +++ /dev/null @@ -1,227 +0,0 @@ -/**Variable**/ -@import './helpers/mixin.scss'; - -.vxe-select { - position: relative; - display: inline-block; - width: 180px; - color: var(--vxe-font-color); - text-align: left; - & > .vxe-input { - .vxe-input--inner { - cursor: pointer; - } - } - &.is--disabled { - & > .vxe-input { - .vxe-input--inner { - cursor: no-drop; - } - } - } - &.is--loading { - & > .vxe-input { - .vxe-input--inner { - cursor: progress; - } - } - } - & > .vxe-input { - width: 100%; - .vxe-input--suffix-icon { - display: inline-block; - @include createAnimationTransition(transform, .2s); - } - } - &.is--active { - &:not(.is--filter) { - & > .vxe-input { - .vxe-input--inner { - border: 1px solid var(--vxe-primary-color); - } - } - } - } -} - -.vxe-select-slots { - display: none; -} - -.vxe-select--panel { - display: none; - position: absolute; - left: 0; - padding: 4px 0; - color: var(--vxe-font-color); - text-align: left; - &:not(.is--transfer) { - min-width: 100%; - } - &.is--transfer { - position: fixed; - } - &.animat--leave { - display: block; - opacity: 0; - transform: scaleY(0.5); - transition: transform .3s cubic-bezier(.23,1,.32,1), opacity .3s cubic-bezier(.23,1,.32,1); - transform-origin: center top; - backface-visibility: hidden; - &[placement="top"] { - transform-origin: center bottom; - } - } - &.animat--enter { - opacity: 1; - transform: scaleY(1); - } -} - -.vxe-select--panel-search { - display: block; - .vxe-select-search--input { - width: 100%; - } -} - -.vxe-select--panel-wrapper { - position: relative; - border-radius: var(--vxe-border-radius); - border: 1px solid var(--vxe-table-popup-border-color); - box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1); - background-color: var(--vxe-select-panel-background-color); -} - -.vxe-select--panel-header { - border-bottom: 1px solid var(--vxe-table-popup-border-color); -} - -.vxe-select--panel-footer { - border-top: 1px solid var(--vxe-table-popup-border-color); -} - -.vxe-select--panel-header, -.vxe-select--panel-footer { - padding: 4px 0; -} - -.vxe-select-option--wrapper { - position: relative; - overflow-x: hidden; - overflow-y: auto; - padding: 4px 0; - max-height: 200px; -} - -.vxe-optgroup { - .vxe-optgroup--title { - padding: 0 6px; - color: var(--vxe-optgroup-title-color); - font-size: 12px; - } -} - -.vxe-optgroup--wrapper { - .vxe-select-option { - padding: 0 20px; - } -} - -.vxe-select-option { - padding: 0 0.6em; - max-width: 600px; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - user-select: none; - &.is--selected { - font-weight: 700; - color: var(--vxe-primary-color); - } - &:not(.is--disabled) { - cursor: pointer; - &.is--hover { - background-color: var(--vxe-select-option-hover-background-color); - } - } - &.is--disabled { - color: var(--vxe-font-disabled-color); - cursor: no-drop; - } -} - -.vxe-select--search-icon { - margin-right: 0.5em; -} - -.vxe-select--search-loading, -.vxe-select--empty-placeholder { - padding: 0 0.6em; - text-align: center; - color: var(--vxe-select-empty-color); -} - -.vxe-select, -.vxe-select--panel { - font-size: var(--vxe-font-size); - &.size--medium { - font-size: var(--vxe-font-size-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - } -} - -.vxe-select--panel { - .vxe-optgroup--title, - .vxe-select-option { - height: var(--vxe-select-option-height-default); - } - .vxe-optgroup--title, - .vxe-select-option, - .vxe-select--search-loading, - .vxe-select--empty-placeholder { - line-height: var(--vxe-select-option-height-default); - } - &.size--medium { - .vxe-optgroup--title, - .vxe-select-option { - height: var(--vxe-select-option-height-medium); - } - .vxe-optgroup--title, - .vxe-select-option, - .vxe-select--search-loading, - .vxe-select--empty-placeholder { - line-height: var(--vxe-select-option-height-medium); - } - } - &.size--small { - .vxe-optgroup--title, - .vxe-select-option { - height: var(--vxe-select-option-height-small); - } - .vxe-optgroup--title, - .vxe-select-option, - .vxe-select--search-loading, - .vxe-select--empty-placeholder { - line-height: var(--vxe-select-option-height-small); - } - } - &.size--mini { - .vxe-optgroup--title, - .vxe-select-option { - height: var(--vxe-select-option-height-mini); - } - .vxe-optgroup--title, - .vxe-select-option, - .vxe-select--search-loading, - .vxe-select--empty-placeholder { - line-height: var(--vxe-select-option-height-mini); - } - } -} diff --git a/styles/switch.scss b/styles/switch.scss deleted file mode 100644 index bd40ee1b54..0000000000 --- a/styles/switch.scss +++ /dev/null @@ -1,125 +0,0 @@ -/**Variable**/ - -.vxe-switch { - display: inline-block; - color: var(--vxe-font-color); - vertical-align: middle; - padding: 0.4em; - user-select: none; - text-align: center; - &.is--animat { - .vxe-switch--button { - transition: border-color .3s, background-color .3s; - } - .vxe-switch--icon { - transition: all 0.3s; - } - } - &.is--on { - .vxe-switch--button { - padding-right: 1.7em; - background-color: var(--vxe-switch-open-background-color); - } - .vxe-switch--icon { - left: 100%; - transform: translateX(-1.4em); - color: var(--vxe-primary-color); - } - } - &.is--off { - .vxe-switch--button { - padding-left: 1.7em; - background-color: var(--vxe-switch-close-background-color); - } - .vxe-switch--icon { - left: 0.2em; - transform: translateX(0); - color: var(--vxe-switch-close-background-color); - } - } - &.is--on .vxe-switch--label-off, - &.is--off .vxe-switch--label-on { - height: 0; - visibility: hidden; - overflow: hidden; - } - &.is--on, - &.is--off { - .vxe-switch--label { - opacity: 1; - } - } - &:not(.is--disabled) { - .vxe-switch--button { - cursor: pointer; - &:focus { - box-shadow: 0 0 0.4em 0 var(--vxe-primary-color); - } - } - } - &.is--disabled { - .vxe-switch--button { - cursor: no-drop; - } - &.is--on { - .vxe-switch--button { - background-color: var(--vxe-primary-lighten-color); - } - .vxe-switch--icon { - color: var(--vxe-primary-lighten-color); - } - } - &.is--off { - .vxe-switch--button { - background-color: var(--vxe-switch-disabled-background-color); - } - .vxe-switch--icon { - color: var(--vxe-switch-disabled-background-color); - } - } - } - .vxe-switch--button { - display: block; - position: relative; - height: 1.6em; - line-height: 1; - min-width: 3.2em; - padding: 0 0.6em; - border-radius: 1em; - border: 0; - outline: 0; - } - .vxe-switch--label { - opacity: 0; - display: block; - color: var(--vxe-switch-font-color); - font-size: 0.8em; - } - .vxe-switch--icon { - position: absolute; - top: 0.2em; - left: 0; - width: 1.2em; - height: 1.2em; - line-height: 1.4em; - text-align: center; - border-radius: 50%; - background-color: var(--vxe-switch-icon-background-color); - } - .vxe-switch--label-icon { - margin-right: 0.25em; - } -} - -.vxe-switch { - font-size: var(--vxe-font-size); - &.size--medium { - font-size: var(--vxe-font-size-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - } -} diff --git a/styles/textarea.scss b/styles/textarea.scss deleted file mode 100644 index 09c19373fb..0000000000 --- a/styles/textarea.scss +++ /dev/null @@ -1,104 +0,0 @@ -/**Variable**/ - -.vxe-textarea { - position: relative; - display: inline-block; - &:not(.def--cols) { - width: 100%; - .vxe-textarea--inner { - width: 100%; - } - } -} - -.vxe-textarea--inner { - border-radius: var(--vxe-border-radius); - outline: 0; - font-size: inherit; - padding: 0 0.6em; - color: var(--vxe-font-color); - line-height: inherit; - border: 1px solid var(--vxe-input-border-color); - background-color: var(--vxe-textarea-background-color); - display: block; - padding: 0.3em 0.6em; - &::placeholder { - color: var(--vxe-input-placeholder-color); - } - &:focus { - border: 1px solid var(--vxe-primary-color); - } - &[disabled] { - cursor: not-allowed; - background-color: var(--vxe-input-disabled-background-color); - } -} - -.vxe-textarea--inner, -.vxe-textarea--autosize { - line-height: var(--vxe-textarea-line-height); - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); -} - -.vxe-textarea--autosize { - display: block; - position: fixed; - top: 0; - left: 0; - width: 100%; - margin: 0; - padding: 0.3em 0.6em; - word-wrap: break-word; - white-space: pre-wrap; - z-index: -1; - visibility: hidden; -} - -.vxe-textarea--count { - position: absolute; - bottom: 0.2em; - right: 1.4em; - padding-left: 0.2em; - color: var(--vxe-input-count-color); - background-color: var(--vxe-input-count-background-color); - &.is--error { - color: var(--vxe-input-count-error-color); - } -} - -.vxe-textarea, -.vxe-textarea--autosize { - font-size: var(--vxe-font-size); - &.size--medium { - font-size: var(--vxe-font-size-medium); - } - &.size--small { - font-size: var(--vxe-font-size-small); - } - &.size--mini { - font-size: var(--vxe-font-size-mini); - } -} - -.vxe-textarea { - &:not(.is--autosize) { - min-height: var(--vxe-input-height-default); - } - &.size--medium { - font-size: var(--vxe-font-size-medium); - &:not(.is--autosize) { - min-height: var(--vxe-input-height-medium); - } - } - &.size--small { - &:not(.is--autosize) { - min-height: var(--vxe-input-height-small); - } - } - &.size--mini { - &:not(.is--autosize) { - min-height: var(--vxe-input-height-mini); - } - } -} \ No newline at end of file diff --git a/styles/theme/base.scss b/styles/theme/base.scss new file mode 100644 index 0000000000..a2fa8e13cf --- /dev/null +++ b/styles/theme/base.scss @@ -0,0 +1,95 @@ +$vxe-ui-status-error-color: #f56c6c; + +:root { + /*font*/ + --vxe-ui-font-family: -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; + + /*font size*/ + --vxe-ui-font-size-default: 14px; + --vxe-ui-font-size-medium: 14px; + --vxe-ui-font-size-small: 13px; + --vxe-ui-font-size-mini: 12px; + + /*font color*/ + --vxe-ui-font-primary-color: #409eff; + --vxe-ui-font-lighten-color: lighten(#606266, 10%); + --vxe-ui-font-disabled-color: #BFBFBF; + + /*base border*/ + --vxe-ui-border-radius: 4px; + + /*input*/ + --vxe-ui-input-disabled-color: #dcdfe6; + --vxe-ui-input-height-default: 34px; + --vxe-ui-input-height-medium: 32px; + --vxe-ui-input-height-small: 30px; + --vxe-ui-input-height-mini: 28px; + + /*table*/ + --vxe-ui-table-header-font-color: var(--vxe-ui-font-color); + --vxe-ui-table-footer-font-color: var(--vxe-ui-font-color); + --vxe-ui-table-border-radius: var(--vxe-ui-border-radius); + --vxe-ui-table-border-width: 1px; + --vxe-ui-table-resizable-line-color: #D9DDDF; + --vxe-ui-table-resizable-drag-line-color: var(--vxe-ui-font-primary-color); + --vxe-ui-table-footer-background-color: var(--vxe-ui-layout-background-color); + --vxe-ui-table-tree-node-line-color:#909399; + --vxe-ui-table-tree-node-line-style: dotted; + --vxe-ui-table-header-font-weight: 700; + + --vxe-ui-table-row-height-default: 48px; + --vxe-ui-table-row-height-medium: 44px; + --vxe-ui-table-row-height-small: 40px; + --vxe-ui-table-row-height-mini: 36px; + --vxe-ui-table-row-line-height: 22px; + + --vxe-ui-table-column-padding-default: 13px 0; + --vxe-ui-table-column-padding-medium: 11px 0; + --vxe-ui-table-column-padding-small: 9px 0; + --vxe-ui-table-column-padding-mini: 7px 0; + --vxe-ui-table-column-hover-background-color: #d7effb; + --vxe-ui-table-column-current-background-color: #e6f7ff; + --vxe-ui-table-column-icon-border-color: #c0c4cc; + --vxe-ui-table-column-icon-border-hover-color: #515A6E; + + --vxe-ui-table-cell-placeholder-color: #C0C4CC; + --vxe-ui-table-cell-padding-left: 10px; + --vxe-ui-table-cell-padding-right: 10px; + --vxe-ui-table-cell-input-height-default: var(--vxe-ui-table-row-height-default) - 6; + --vxe-ui-table-cell-input-height-medium: var(--vxe-ui-table-row-height-medium) - 6; + --vxe-ui-table-cell-input-height-small: var(--vxe-ui-table-row-height-small) - 6; + --vxe-ui-table-cell-input-height-mini: var(--vxe-ui-table-row-height-mini) - 6; + --vxe-ui-table-cell-dirty-width: 5px; + --vxe-ui-table-cell-dirty-update-color: #f56c6c; + --vxe-ui-table-cell-dirty-insert-color: #19A15F; + --vxe-ui-table-cell-area-border-color: var(--vxe-ui-font-primary-color); + --vxe-ui-table-cell-area-border-width: 1px; + --vxe-ui-table-cell-main-area-extension-border-color: #fff; + --vxe-ui-table-cell-main-area-extension-background-color: var(--vxe-ui-font-primary-color); + --vxe-ui-table-cell-extend-area-border-width: 2px; + --vxe-ui-table-cell-copy-area-border-width: 3px; + --vxe-ui-table-cell-active-area-border-width: 2px; + --vxe-ui-table-cell-active-area-background-color: transparent; + --vxe-ui-table-cell-copy-area-border-color: var(--vxe-ui-table-cell-area-border-color); + --vxe-ui-table-cell-extend-area-border-color: var(--vxe-ui-table-cell-area-border-color); + --vxe-ui-table-cell-active-area-border-color: var(--vxe-ui-table-cell-area-border-color); + --vxe-ui-table-cell-area-background-color: rgba(64,158,255,0.2); + + --vxe-ui-table-expand-padding-default: 16px; + + --vxe-ui-table-checkbox-range-border-width: 1px; + --vxe-ui-table-checkbox-range-border-color: #006af1; + --vxe-ui-table-checkbox-range-background-color: rgba(50,128,252,0.2); + + --vxe-ui-table-fixed-left-scrolling-box-shadow: 8px 0px 10px -5px rgba(0, 0, 0, 0.12); + --vxe-ui-table-fixed-right-scrolling-box-shadow: -8px 0px 10px -5px rgba(0, 0, 0, 0.12); + + --vxe-ui-table-menu-item-width: 178px; + --vxe-ui-table-menu-background-color: #fff; + + --vxe-ui-table-validate-error-color: #f56c6c; + --vxe-ui-table-validate-error-background-color: var(--vxe-ui-layout-background-color); + + /*toolbar*/ + --vxe-ui-toolbar-custom-active-background-color: #D9DADB; +} \ No newline at end of file diff --git a/styles/theme/dark.scss b/styles/theme/dark.scss index f3b0a5af30..16adeddf84 100644 --- a/styles/theme/dark.scss +++ b/styles/theme/dark.scss @@ -1,279 +1,40 @@ -@import '../variable.scss'; +@import './base.scss'; -[data-vxe-table-theme="dark"] { +[data-vxe-ui-theme="dark"] { color-scheme: dark; + $vxe-ui-font-color: #a0a3a7; + /*font*/ - --vxe-font-family: #{$vxe-font-family}; - --vxe-font-size: #{$vxe-font-size}; - --vxe-font-size-medium: #{$vxe-font-size-medium}; - --vxe-font-size-small: #{$vxe-font-size-small}; - --vxe-font-size-mini: #{$vxe-font-size-mini}; + --vxe-ui-font-color: #{$vxe-ui-font-color}; + --vxe-ui-font-lighten-color: #{lighten($vxe-ui-font-color, 10%)}; + --vxe-ui-font-darken-color: #{darken($vxe-ui-font-color, 10%)}; - /*size*/ - --vxe-border-radius: #{$vxe-border-radius}; + /*base*/ + --vxe-ui-base-popup-border-color: var(--vxe-ui-layout-background-color); + --vxe-ui-base-popup-box-shadow: 0px 12px 30px 8px rgba(0, 0, 0, 0.5); - /*icon*/ - --vxe-icon-font-family: #{$vxe-icon-font-family}; - --vxe-icon-background-color: #98989E; - - /*color*/ - --vxe-font-color: #98989E; - --vxe-primary-color: #2C7ECF; - --vxe-success-color: #{$vxe-success-color}; - --vxe-info-color: #{$vxe-info-color}; - --vxe-warning-color: #{$vxe-warning-color}; - --vxe-danger-color: #{$vxe-danger-color}; - - --vxe-font-lighten-color: #{$vxe-font-lighten-color}; - --vxe-primary-lighten-color: #{$vxe-primary-lighten-color}; - --vxe-success-lighten-color: #{$vxe-success-lighten-color}; - --vxe-info-lighten-color: #{$vxe-info-lighten-color}; - --vxe-warning-lighten-color: #{$vxe-warning-lighten-color}; - --vxe-danger-lighten-color: #{$vxe-danger-lighten-color}; - - --vxe-font-darken-color: #{$vxe-font-darken-color}; - --vxe-primary-darken-color: #{$vxe-primary-darken-color}; - --vxe-success-darken-color: #{$vxe-success-darken-color}; - --vxe-info-darken-color: #{$vxe-info-darken-color}; - --vxe-warning-darken-color: #{$vxe-warning-darken-color}; - --vxe-danger-darken-color: #{$vxe-danger-darken-color}; - - --vxe-font-disabled-color: #{$vxe-font-disabled-color}; - --vxe-primary-disabled-color: #{$vxe-primary-disabled-color}; - --vxe-success-disabled-color: #{$vxe-success-disabled-color}; - --vxe-info-disabled-color: #{$vxe-info-disabled-color}; - --vxe-warning-disabled-color: #{$vxe-warning-disabled-color}; - --vxe-danger-disabled-color: #{$vxe-danger-disabled-color}; - - /*input/radio/checkbox*/ - --vxe-input-border-color: #424242; - --vxe-input-disabled-color: #8D9095; - --vxe-input-disabled-background-color: #585656; - --vxe-input-placeholder-color: #8D9095; - - /*popup*/ - --vxe-table-popup-border-color: #424242; - - /*table*/ - --vxe-table-header-font-color: #98989E; - --vxe-table-footer-font-color: #98989E; - --vxe-table-border-radius: #{$vxe-table-border-radius}; - --vxe-table-border-width: #{$vxe-table-border-width}; - --vxe-table-border-color: #37373A; - --vxe-table-resizable-line-color: rgba(255, 255, 255, 0.1); - --vxe-table-resizable-drag-line-color: #{$vxe-table-resizable-drag-line-color}; - --vxe-table-header-background-color: #28282A; - --vxe-table-body-background-color: #151518; - --vxe-table-footer-background-color: #151518; - --vxe-table-tree-node-line-color: #{$vxe-table-tree-node-line-color}; - --vxe-table-tree-node-line-style: #{$vxe-table-tree-node-line-style}; - --vxe-table-header-font-weight: #{$vxe-table-header-font-weight}; - - --vxe-table-row-height-default: #{$vxe-table-row-height-default}; - --vxe-table-row-height-medium: #{$vxe-table-row-height-medium}; - --vxe-table-row-height-small: #{$vxe-table-row-height-small}; - --vxe-table-row-height-mini: #{$vxe-table-row-height-mini}; - --vxe-table-row-line-height: #{$vxe-table-row-line-height}; - --vxe-table-row-hover-background-color: #262727; - --vxe-table-row-striped-background-color: #1D1D1D; - --vxe-table-row-hover-striped-background-color: #262727; - --vxe-table-row-radio-checked-background-color: #604820; - --vxe-table-row-hover-radio-checked-background-color: #6e5326; - --vxe-table-row-checkbox-checked-background-color: #604820; - --vxe-table-row-hover-checkbox-checked-background-color: #6e5326; - --vxe-table-row-current-background-color: #18222c; - --vxe-table-row-hover-current-background-color: #262727; - - --vxe-table-column-padding-default: #{$vxe-table-column-padding-default}; - --vxe-table-column-padding-medium: #{$vxe-table-column-padding-medium}; - --vxe-table-column-padding-small: #{$vxe-table-column-padding-small}; - --vxe-table-column-padding-mini: #{$vxe-table-column-padding-mini}; - --vxe-table-column-hover-background-color: #18222c; - --vxe-table-column-current-background-color: #18222c; - --vxe-table-column-icon-border-color: #{$vxe-table-column-icon-border-color}; - --vxe-table-column-icon-border-hover-color: #{$vxe-table-column-icon-border-hover-color}; - - --vxe-table-cell-placeholder-color: #{$vxe-table-cell-placeholder-color}; - --vxe-table-cell-padding-left: #{$vxe-table-cell-padding-left}; - --vxe-table-cell-padding-right: #{$vxe-table-cell-padding-right}; - --vxe-table-cell-input-height-default: #{$vxe-table-cell-input-height-default}; - --vxe-table-cell-input-height-medium: #{$vxe-table-cell-input-height-medium}; - --vxe-table-cell-input-height-small: #{$vxe-table-cell-input-height-small}; - --vxe-table-cell-input-height-mini: #{$vxe-table-cell-input-height-mini}; - --vxe-table-cell-dirty-width: #{$vxe-table-cell-dirty-width}; - --vxe-table-cell-dirty-update-color: #{$vxe-table-cell-dirty-update-color}; - --vxe-table-cell-dirty-insert-color: #{$vxe-table-cell-dirty-insert-color}; - --vxe-table-cell-area-border-color: #{$vxe-table-cell-area-border-color}; - --vxe-table-cell-area-border-width: #{$vxe-table-cell-area-border-width}; - --vxe-table-cell-main-area-extension-border-color: #{$vxe-table-cell-main-area-extension-border-color}; - --vxe-table-cell-main-area-extension-background-color: #{$vxe-table-cell-main-area-extension-background-color}; - --vxe-table-cell-extend-area-border-width: #{$vxe-table-cell-extend-area-border-width}; - --vxe-table-cell-copy-area-border-width: #{$vxe-table-cell-copy-area-border-width}; - --vxe-table-cell-active-area-border-width: #{$vxe-table-cell-active-area-border-width}; - --vxe-table-cell-copy-area-border-color: #{$vxe-table-cell-copy-area-border-color}; - --vxe-table-cell-extend-area-border-color: #{$vxe-table-cell-extend-area-border-color}; - --vxe-table-cell-active-area-border-color: #{$vxe-table-cell-active-area-border-color}; - --vxe-table-cell-area-background-color: #{$vxe-table-cell-area-background-color}; - - --vxe-table-checkbox-range-border-width: #{$vxe-table-checkbox-range-border-width}; - --vxe-table-checkbox-range-border-color: #{$vxe-table-checkbox-range-border-color}; - --vxe-table-checkbox-range-background-color: #{$vxe-table-checkbox-range-background-color}; - - --vxe-table-fixed-left-scrolling-box-shadow: 8px 0px 10px -5px rgba(0, 0, 0, 0.5); - --vxe-table-fixed-right-scrolling-box-shadow: -8px 0px 10px -5px rgba(0, 0, 0, 0.5); - - /*filter*/ - --vxe-table-filter-panel-background-color: #151518; - - /*menu*/ - --vxe-table-menu-item-width: #{$vxe-table-menu-item-width}; - --vxe-table-menu-background-color: #{$vxe-table-menu-background-color}; - - /*loading*/ - --vxe-loading-color: #{$vxe-loading-color}; - --vxe-loading-background-color: rgba(0, 0, 0, 0.5);; - --vxe-loading-z-index: #{$vxe-loading-z-index}; - - /*validate*/ - --vxe-table-validate-error-color: #{$vxe-table-validate-error-color}; - --vxe-table-validate-error-background-color: #{$vxe-table-validate-error-background-color}; - - /*grid*/ - --vxe-grid-maximize-background-color: #{$vxe-grid-maximize-background-color}; - - /*toolbar*/ - --vxe-toolbar-background-color: #151518; - --vxe-toolbar-custom-active-background-color: #{$vxe-toolbar-custom-active-background-color}; - --vxe-toolbar-panel-background-color: #151518; - - /*tooltip*/ - --vxe-tooltip-dark-color: #{$vxe-tooltip-dark-color}; - --vxe-tooltip-dark-background-color: #{$vxe-tooltip-dark-background-color}; - --vxe-tooltip-light-background-color: #{$vxe-tooltip-light-background-color}; - - /*pager*/ - --vxe-pager-background-color: #151518; - --vxe-pager-perfect-background-color: #151518; - --vxe-pager-perfect-button-background-color: #151518; - - /*modal*/ - --vxe-modal-header-background-color: #151518; - --vxe-modal-body-background-color: #151518; - --vxe-modal-border-color: #424242; - - /*drawer*/ - --vxe-drawer-header-background-color: #151518; - --vxe-drawer-body-background-color: #151518; - --vxe-drawer-border-color: #424242; - - /*checkbox*/ - --vxe-checkbox-font-size-default: #{$vxe-checkbox-font-size-default}; - --vxe-checkbox-font-size-medium: #{$vxe-checkbox-font-size-medium}; - --vxe-checkbox-font-size-small: #{$vxe-checkbox-font-size-small}; - --vxe-checkbox-font-size-mini: #{$vxe-checkbox-font-size-mini}; - --vxe-checkbox-checked-width: #{$vxe-checkbox-checked-width}; - --vxe-checkbox-checked-height: #{$vxe-checkbox-checked-height}; - --vxe-checkbox-indeterminate-width: #{$vxe-checkbox-indeterminate-width}; - --vxe-checkbox-indeterminate-height: #{$vxe-checkbox-indeterminate-height}; - --vxe-checkbox-border-width: #{$vxe-checkbox-border-width}; - --vxe-checkbox-border-radius: #{$vxe-checkbox-border-radius}; - --vxe-checkbox-icon-background-color: #{$vxe-checkbox-icon-background-color}; - --vxe-checkbox-checked-icon-border-color: #{$vxe-checkbox-checked-icon-border-color}; - --vxe-checkbox-indeterminate-icon-background-color: #{$vxe-checkbox-indeterminate-icon-background-color}; - - /*radio*/ - --vxe-radio-font-size-default: #{$vxe-radio-font-size-default}; - --vxe-radio-font-size-medium: #{$vxe-radio-font-size-medium}; - --vxe-radio-font-size-small: #{$vxe-radio-font-size-small}; - --vxe-radio-font-size-mini: #{$vxe-radio-font-size-mini}; - --vxe-radio-border-width: #{$vxe-radio-border-width}; - --vxe-radio-icon-background-color: #{$vxe-radio-icon-background-color}; - --vxe-radio-checked-icon-background-color: #{$vxe-radio-checked-icon-background-color}; - --vxe-radio-indeterminate-icon-background-color: #{$vxe-radio-indeterminate-icon-background-color}; - --vxe-radio-button-default-background-color: #151518; - - /*button*/ - --vxe-button-max-width: #{$vxe-button-max-width}; - --vxe-button-default-background-color: #151518; - --vxe-button-dropdown-panel-background-color: #151518; - --vxe-button-height-default: #{$vxe-button-height-default}; - --vxe-button-height-medium: #{$vxe-button-height-medium}; - --vxe-button-height-small: #{$vxe-button-height-small}; - --vxe-button-height-mini: #{$vxe-button-height-mini}; - --vxe-button-round-border-radius-default: #{$vxe-button-round-border-radius-default}; - --vxe-button-round-border-radius-medium: #{$vxe-button-round-border-radius-medium}; - --vxe-button-round-border-radius-small: #{$vxe-button-round-border-radius-small}; - --vxe-button-round-border-radius-mini: #{$vxe-button-round-border-radius-mini}; + /*layout*/ + --vxe-ui-layout-background-color: #121212; /*input*/ - --vxe-input-background-color: #151518; - --vxe-input-panel-background-color: #{$vxe-input-panel-background-color}; - --vxe-input-number-disabled-color: #{$vxe-input-number-disabled-color}; - --vxe-input-date-festival-color: #{$vxe-input-date-festival-color}; - --vxe-input-date-festival-important-color: #{$vxe-input-date-festival-important-color}; - --vxe-input-date-notice-background-color: #{$vxe-input-date-notice-background-color}; - --vxe-input-date-picker-hover-background-color: #{$vxe-input-date-picker-hover-background-color}; - --vxe-input-date-picker-selected-color: #{$vxe-input-date-picker-selected-color}; - --vxe-input-date-time-confirm-button-color: #{$vxe-input-date-time-confirm-button-color}; - --vxe-input-date-picker-festival-selected-color: #{$vxe-input-date-picker-festival-selected-color}; - --vxe-input-date-picker-notice-selected-background-color: #{$vxe-input-date-picker-notice-selected-background-color}; - --vxe-input-date-extra-color: #{$vxe-input-date-extra-color}; - --vxe-input-date-extra-important-color: #{$vxe-input-date-extra-important-color}; - --vxe-input-date-title-height-default: #{$vxe-input-date-title-height-default}; - --vxe-input-date-title-height-medium: #{$vxe-input-date-title-height-medium}; - --vxe-input-date-title-height-small: #{$vxe-input-date-title-height-small}; - --vxe-input-date-title-height-mini: #{$vxe-input-date-title-height-mini}; - --vxe-input-date-time-week-row-height-default: #{$vxe-input-date-time-week-row-height-default}; - --vxe-input-date-time-week-row-height-medium: #{$vxe-input-date-time-week-row-height-medium}; - --vxe-input-date-time-week-row-height-small: #{$vxe-input-date-time-week-row-height-small}; - --vxe-input-date-time-week-row-height-mini: #{$vxe-input-date-time-week-row-height-mini}; - --vxe-input-date-month-year-row-height-default: #{$vxe-input-date-month-year-row-height-default}; - --vxe-input-date-month-year-row-height-medium: #{$vxe-input-date-month-year-row-height-medium}; - --vxe-input-date-month-year-row-height-small: #{$vxe-input-date-month-year-row-height-small}; - --vxe-input-date-month-year-row-height-mini: #{$vxe-input-date-month-year-row-height-mini}; - --vxe-input-date-quarter-row-height-default: #{$vxe-input-date-quarter-row-height-default}; - --vxe-input-date-quarter-row-height-medium: #{$vxe-input-date-quarter-row-height-medium}; - --vxe-input-date-quarter-row-height-small: #{$vxe-input-date-quarter-row-height-small}; - --vxe-input-date-quarter-row-height-mini: #{$vxe-input-date-quarter-row-height-mini}; - --vxe-input-height-default: #{$vxe-input-height-default}; - --vxe-input-height-medium: #{$vxe-input-height-medium}; - --vxe-input-height-small: #{$vxe-input-height-small}; - --vxe-input-height-mini: #{$vxe-input-height-mini}; - --vxe-input-count-color: #{$vxe-input-count-color}; - --vxe-input-count-background-color: #151518; - --vxe-input-count-error-color: #{$vxe-input-count-error-color}; - - /*textarea*/ - --vxe-textarea-line-height: #{$vxe-textarea-line-height}; - --vxe-textarea-background-color: #151518; + --vxe-ui-input-border-color: #424242; + --vxe-ui-input-placeholder-color: #8D9095; + --vxe-ui-input-disabled-background-color: #262727; - /*form*/ - --vxe-form-item-min-height-default: #{$vxe-form-item-min-height-default}; - --vxe-form-item-min-height-medium: #{$vxe-form-item-min-height-medium}; - --vxe-form-item-min-height-small: #{$vxe-form-item-min-height-small}; - --vxe-form-item-min-height-mini: #{$vxe-form-item-min-height-mini}; - --vxe-form-background-color: #151518; - --vxe-form-validate-error-color: #{$vxe-form-validate-error-color}; - --vxe-form-validate-error-background-color: #{$vxe-form-validate-error-background-color}; - - /*select*/ - --vxe-select-option-height-default: #{$vxe-select-option-height-default}; - --vxe-select-option-height-medium: #{$vxe-select-option-height-medium}; - --vxe-select-option-height-small: #{$vxe-select-option-height-small}; - --vxe-select-option-height-mini: #{$vxe-select-option-height-mini}; - --vxe-select-option-hover-background-color: #262727; - --vxe-select-panel-background-color: #151518; - --vxe-select-empty-color: #{$vxe-select-empty-color}; - --vxe-optgroup-title-color: #{$vxe-optgroup-title-color}; - - /*switch*/ - --vxe-switch-font-color: #{$vxe-switch-font-color}; - --vxe-switch-icon-background-color: #{$vxe-switch-icon-background-color}; - --vxe-switch-open-background-color: #{$vxe-switch-open-background-color}; - --vxe-switch-close-background-color: #4C4D4F; - --vxe-switch-disabled-background-color: #{$vxe-switch-disabled-background-color}; + /*loading*/ + --vxe-ui-loading-background-color: rgba(255, 255, 255, 0.1); - /*pulldown*/ - --vxe-pulldown-panel-background-color: #151518; + /*table*/ + --vxe-ui-table-header-background-color: #28282a; + --vxe-ui-table-border-color: #37373a; + --vxe-ui-table-row-hover-background-color: #262727; + --vxe-ui-table-row-striped-background-color: #1D1D1D; + --vxe-ui-table-row-hover-striped-background-color: #262727; + --vxe-ui-table-row-radio-checked-background-color: #604820; + --vxe-ui-table-row-hover-radio-checked-background-color: #6e5326; + --vxe-ui-table-row-checkbox-checked-background-color: #604820; + --vxe-ui-table-row-hover-checkbox-checked-background-color: #6e5326; + --vxe-ui-table-row-current-background-color: #18222c; + --vxe-ui-table-row-hover-current-background-color: #262727; } diff --git a/styles/theme/default.scss b/styles/theme/default.scss deleted file mode 100644 index 6241767b92..0000000000 --- a/styles/theme/default.scss +++ /dev/null @@ -1,277 +0,0 @@ -@import '../variable.scss'; - -[data-vxe-table-theme="default"] { - /*font*/ - --vxe-font-family: #{$vxe-font-family}; - --vxe-font-size: #{$vxe-font-size}; - --vxe-font-size-medium: #{$vxe-font-size-medium}; - --vxe-font-size-small: #{$vxe-font-size-small}; - --vxe-font-size-mini: #{$vxe-font-size-mini}; - - /*size*/ - --vxe-border-radius: #{$vxe-border-radius}; - - /*icon*/ - --vxe-icon-font-family: #{$vxe-icon-font-family}; - --vxe-icon-background-color: #{$vxe-icon-background-color}; - - /*color*/ - --vxe-font-color: #{$vxe-font-color}; - --vxe-primary-color: #{$vxe-primary-color}; - --vxe-success-color: #{$vxe-success-color}; - --vxe-info-color: #{$vxe-info-color}; - --vxe-warning-color: #{$vxe-warning-color}; - --vxe-danger-color: #{$vxe-danger-color}; - - --vxe-font-lighten-color: #{$vxe-font-lighten-color}; - --vxe-primary-lighten-color: #{$vxe-primary-lighten-color}; - --vxe-success-lighten-color: #{$vxe-success-lighten-color}; - --vxe-info-lighten-color: #{$vxe-info-lighten-color}; - --vxe-warning-lighten-color: #{$vxe-warning-lighten-color}; - --vxe-danger-lighten-color: #{$vxe-danger-lighten-color}; - - --vxe-font-darken-color: #{$vxe-font-darken-color}; - --vxe-primary-darken-color: #{$vxe-primary-darken-color}; - --vxe-success-darken-color: #{$vxe-success-darken-color}; - --vxe-info-darken-color: #{$vxe-info-darken-color}; - --vxe-warning-darken-color: #{$vxe-warning-darken-color}; - --vxe-danger-darken-color: #{$vxe-danger-darken-color}; - - --vxe-font-disabled-color: #{$vxe-font-disabled-color}; - --vxe-primary-disabled-color: #{$vxe-primary-disabled-color}; - --vxe-success-disabled-color: #{$vxe-success-disabled-color}; - --vxe-info-disabled-color: #{$vxe-info-disabled-color}; - --vxe-warning-disabled-color: #{$vxe-warning-disabled-color}; - --vxe-danger-disabled-color: #{$vxe-danger-disabled-color}; - - /*input/radio/checkbox*/ - --vxe-input-border-color: #{$vxe-input-border-color}; - --vxe-input-disabled-color: #{$vxe-input-disabled-color}; - --vxe-input-disabled-background-color: #{$vxe-input-disabled-background-color}; - --vxe-input-placeholder-color: #{$vxe-input-placeholder-color}; - - /*popup*/ - --vxe-table-popup-border-color: #{$vxe-table-popup-border-color}; - - /*table*/ - --vxe-table-header-font-color: #{$vxe-table-header-font-color}; - --vxe-table-footer-font-color: #{$vxe-table-footer-font-color}; - --vxe-table-border-radius: #{$vxe-table-border-radius}; - --vxe-table-border-width: #{$vxe-table-border-width}; - --vxe-table-border-color: #{$vxe-table-border-color}; - --vxe-table-resizable-line-color: #{$vxe-table-resizable-line-color}; - --vxe-table-resizable-drag-line-color: #{$vxe-table-resizable-drag-line-color}; - --vxe-table-header-background-color: #{$vxe-table-header-background-color}; - --vxe-table-body-background-color: #{$vxe-table-body-background-color}; - --vxe-table-footer-background-color: #{$vxe-table-footer-background-color}; - --vxe-table-tree-node-line-color: #{$vxe-table-tree-node-line-color}; - --vxe-table-tree-node-line-style: #{$vxe-table-tree-node-line-style}; - --vxe-table-header-font-weight: #{$vxe-table-header-font-weight}; - - --vxe-table-row-height-default: #{$vxe-table-row-height-default}; - --vxe-table-row-height-medium: #{$vxe-table-row-height-medium}; - --vxe-table-row-height-small: #{$vxe-table-row-height-small}; - --vxe-table-row-height-mini: #{$vxe-table-row-height-mini}; - --vxe-table-row-line-height: #{$vxe-table-row-line-height}; - --vxe-table-row-hover-background-color: #{$vxe-table-row-hover-background-color}; - --vxe-table-row-striped-background-color: #{$vxe-table-row-striped-background-color}; - --vxe-table-row-hover-striped-background-color: #{$vxe-table-row-hover-striped-background-color}; - --vxe-table-row-radio-checked-background-color: #{$vxe-table-row-radio-checked-background-color}; - --vxe-table-row-hover-radio-checked-background-color: #{$vxe-table-row-hover-radio-checked-background-color}; - --vxe-table-row-checkbox-checked-background-color: #{$vxe-table-row-checkbox-checked-background-color}; - --vxe-table-row-hover-checkbox-checked-background-color: #{$vxe-table-row-hover-checkbox-checked-background-color}; - --vxe-table-row-current-background-color: #{$vxe-table-row-current-background-color}; - --vxe-table-row-hover-current-background-color: #{$vxe-table-row-hover-current-background-color}; - - --vxe-table-column-padding-default: #{$vxe-table-column-padding-default}; - --vxe-table-column-padding-medium: #{$vxe-table-column-padding-medium}; - --vxe-table-column-padding-small: #{$vxe-table-column-padding-small}; - --vxe-table-column-padding-mini: #{$vxe-table-column-padding-mini}; - --vxe-table-column-hover-background-color: #{$vxe-table-column-hover-background-color}; - --vxe-table-column-current-background-color: #{$vxe-table-column-current-background-color}; - --vxe-table-column-icon-border-color: #{$vxe-table-column-icon-border-color}; - --vxe-table-column-icon-border-hover-color: #{$vxe-table-column-icon-border-hover-color}; - - --vxe-table-cell-placeholder-color: #{$vxe-table-cell-placeholder-color}; - --vxe-table-cell-padding-left: #{$vxe-table-cell-padding-left}; - --vxe-table-cell-padding-right: #{$vxe-table-cell-padding-right}; - --vxe-table-cell-input-height-default: #{$vxe-table-cell-input-height-default}; - --vxe-table-cell-input-height-medium: #{$vxe-table-cell-input-height-medium}; - --vxe-table-cell-input-height-small: #{$vxe-table-cell-input-height-small}; - --vxe-table-cell-input-height-mini: #{$vxe-table-cell-input-height-mini}; - --vxe-table-cell-dirty-width: #{$vxe-table-cell-dirty-width}; - --vxe-table-cell-dirty-update-color: #{$vxe-table-cell-dirty-update-color}; - --vxe-table-cell-dirty-insert-color: #{$vxe-table-cell-dirty-insert-color}; - --vxe-table-cell-area-border-color: #{$vxe-table-cell-area-border-color}; - --vxe-table-cell-area-border-width: #{$vxe-table-cell-area-border-width}; - --vxe-table-cell-main-area-extension-border-color: #{$vxe-table-cell-main-area-extension-border-color}; - --vxe-table-cell-main-area-extension-background-color: #{$vxe-table-cell-main-area-extension-background-color}; - --vxe-table-cell-extend-area-border-width: #{$vxe-table-cell-extend-area-border-width}; - --vxe-table-cell-copy-area-border-width: #{$vxe-table-cell-copy-area-border-width}; - --vxe-table-cell-active-area-border-width: #{$vxe-table-cell-active-area-border-width}; - --vxe-table-cell-copy-area-border-color: #{$vxe-table-cell-copy-area-border-color}; - --vxe-table-cell-extend-area-border-color: #{$vxe-table-cell-extend-area-border-color}; - --vxe-table-cell-active-area-border-color: #{$vxe-table-cell-active-area-border-color}; - --vxe-table-cell-area-background-color: #{$vxe-table-cell-area-background-color}; - - --vxe-table-checkbox-range-border-width: #{$vxe-table-checkbox-range-border-width}; - --vxe-table-checkbox-range-border-color: #{$vxe-table-checkbox-range-border-color}; - --vxe-table-checkbox-range-background-color: #{$vxe-table-checkbox-range-background-color}; - - --vxe-table-fixed-left-scrolling-box-shadow: #{$vxe-table-fixed-left-scrolling-box-shadow}; - --vxe-table-fixed-right-scrolling-box-shadow: #{$vxe-table-fixed-right-scrolling-box-shadow}; - - /*filter*/ - --vxe-table-filter-panel-background-color: #{$vxe-table-filter-panel-background-color}; - - /*menu*/ - --vxe-table-menu-item-width: #{$vxe-table-menu-item-width}; - --vxe-table-menu-background-color: #{$vxe-table-menu-background-color}; - - /*loading*/ - --vxe-loading-color: #{$vxe-loading-color}; - --vxe-loading-background-color: #{$vxe-loading-background-color}; - --vxe-loading-z-index: #{$vxe-loading-z-index}; - - /*validate*/ - --vxe-table-validate-error-color: #{$vxe-table-validate-error-color}; - --vxe-table-validate-error-background-color: #{$vxe-table-validate-error-background-color}; - - /*grid*/ - --vxe-grid-maximize-background-color: #{$vxe-grid-maximize-background-color}; - - /*toolbar*/ - --vxe-toolbar-background-color: #{$vxe-toolbar-background-color}; - --vxe-toolbar-custom-active-background-color: #{$vxe-toolbar-custom-active-background-color}; - --vxe-toolbar-panel-background-color: #{$vxe-toolbar-panel-background-color}; - - /*tooltip*/ - --vxe-tooltip-dark-color: #{$vxe-tooltip-dark-color}; - --vxe-tooltip-dark-background-color: #{$vxe-tooltip-dark-background-color}; - --vxe-tooltip-light-background-color: #{$vxe-tooltip-light-background-color}; - - /*pager*/ - --vxe-pager-background-color: #{$vxe-pager-background-color}; - --vxe-pager-perfect-background-color: #{$vxe-pager-perfect-background-color}; - --vxe-pager-perfect-button-background-color: #{$vxe-pager-perfect-button-background-color}; - - /*modal*/ - --vxe-modal-header-background-color: #{$vxe-modal-header-background-color}; - --vxe-modal-body-background-color: #{$vxe-modal-body-background-color}; - --vxe-modal-border-color: #{$vxe-modal-border-color}; - - /*drawer*/ - --vxe-drawer-header-background-color: #{$vxe-modal-header-background-color}; - --vxe-drawer-body-background-color: #{$vxe-modal-body-background-color}; - --vxe-drawer-border-color: #{$vxe-modal-border-color}; - - /*checkbox*/ - --vxe-checkbox-font-size-default: #{$vxe-checkbox-font-size-default}; - --vxe-checkbox-font-size-medium: #{$vxe-checkbox-font-size-medium}; - --vxe-checkbox-font-size-small: #{$vxe-checkbox-font-size-small}; - --vxe-checkbox-font-size-mini: #{$vxe-checkbox-font-size-mini}; - --vxe-checkbox-checked-width: #{$vxe-checkbox-checked-width}; - --vxe-checkbox-checked-height: #{$vxe-checkbox-checked-height}; - --vxe-checkbox-indeterminate-width: #{$vxe-checkbox-indeterminate-width}; - --vxe-checkbox-indeterminate-height: #{$vxe-checkbox-indeterminate-height}; - --vxe-checkbox-border-width: #{$vxe-checkbox-border-width}; - --vxe-checkbox-border-radius: #{$vxe-checkbox-border-radius}; - --vxe-checkbox-icon-background-color: #{$vxe-checkbox-icon-background-color}; - --vxe-checkbox-checked-icon-border-color: #{$vxe-checkbox-checked-icon-border-color}; - --vxe-checkbox-indeterminate-icon-background-color: #{$vxe-checkbox-indeterminate-icon-background-color}; - - /*radio*/ - --vxe-radio-font-size-default: #{$vxe-radio-font-size-default}; - --vxe-radio-font-size-medium: #{$vxe-radio-font-size-medium}; - --vxe-radio-font-size-small: #{$vxe-radio-font-size-small}; - --vxe-radio-font-size-mini: #{$vxe-radio-font-size-mini}; - --vxe-radio-border-width: #{$vxe-radio-border-width}; - --vxe-radio-icon-background-color: #{$vxe-radio-icon-background-color}; - --vxe-radio-checked-icon-background-color: #{$vxe-radio-checked-icon-background-color}; - --vxe-radio-indeterminate-icon-background-color: #{$vxe-radio-indeterminate-icon-background-color}; - --vxe-radio-button-default-background-color: #{$vxe-radio-button-default-background-color}; - - /*button*/ - --vxe-button-max-width: #{$vxe-button-max-width}; - --vxe-button-default-background-color: #{$vxe-button-default-background-color}; - --vxe-button-dropdown-panel-background-color: #{$vxe-button-dropdown-panel-background-color}; - --vxe-button-height-default: #{$vxe-button-height-default}; - --vxe-button-height-medium: #{$vxe-button-height-medium}; - --vxe-button-height-small: #{$vxe-button-height-small}; - --vxe-button-height-mini: #{$vxe-button-height-mini}; - --vxe-button-round-border-radius-default: #{$vxe-button-round-border-radius-default}; - --vxe-button-round-border-radius-medium: #{$vxe-button-round-border-radius-medium}; - --vxe-button-round-border-radius-small: #{$vxe-button-round-border-radius-small}; - --vxe-button-round-border-radius-mini: #{$vxe-button-round-border-radius-mini}; - - /*input*/ - --vxe-input-background-color: #{$vxe-input-background-color}; - --vxe-input-panel-background-color: #{$vxe-input-panel-background-color}; - --vxe-input-number-disabled-color: #{$vxe-input-number-disabled-color}; - --vxe-input-date-festival-color: #{$vxe-input-date-festival-color}; - --vxe-input-date-festival-important-color: #{$vxe-input-date-festival-important-color}; - --vxe-input-date-notice-background-color: #{$vxe-input-date-notice-background-color}; - --vxe-input-date-picker-hover-background-color: #{$vxe-input-date-picker-hover-background-color}; - --vxe-input-date-picker-selected-color: #{$vxe-input-date-picker-selected-color}; - --vxe-input-date-time-confirm-button-color: #{$vxe-input-date-time-confirm-button-color}; - --vxe-input-date-picker-festival-selected-color: #{$vxe-input-date-picker-festival-selected-color}; - --vxe-input-date-picker-notice-selected-background-color: #{$vxe-input-date-picker-notice-selected-background-color}; - --vxe-input-date-extra-color: #{$vxe-input-date-extra-color}; - --vxe-input-date-extra-important-color: #{$vxe-input-date-extra-important-color}; - --vxe-input-date-title-height-default: #{$vxe-input-date-title-height-default}; - --vxe-input-date-title-height-medium: #{$vxe-input-date-title-height-medium}; - --vxe-input-date-title-height-small: #{$vxe-input-date-title-height-small}; - --vxe-input-date-title-height-mini: #{$vxe-input-date-title-height-mini}; - --vxe-input-date-time-week-row-height-default: #{$vxe-input-date-time-week-row-height-default}; - --vxe-input-date-time-week-row-height-medium: #{$vxe-input-date-time-week-row-height-medium}; - --vxe-input-date-time-week-row-height-small: #{$vxe-input-date-time-week-row-height-small}; - --vxe-input-date-time-week-row-height-mini: #{$vxe-input-date-time-week-row-height-mini}; - --vxe-input-date-month-year-row-height-default: #{$vxe-input-date-month-year-row-height-default}; - --vxe-input-date-month-year-row-height-medium: #{$vxe-input-date-month-year-row-height-medium}; - --vxe-input-date-month-year-row-height-small: #{$vxe-input-date-month-year-row-height-small}; - --vxe-input-date-month-year-row-height-mini: #{$vxe-input-date-month-year-row-height-mini}; - --vxe-input-date-quarter-row-height-default: #{$vxe-input-date-quarter-row-height-default}; - --vxe-input-date-quarter-row-height-medium: #{$vxe-input-date-quarter-row-height-medium}; - --vxe-input-date-quarter-row-height-small: #{$vxe-input-date-quarter-row-height-small}; - --vxe-input-date-quarter-row-height-mini: #{$vxe-input-date-quarter-row-height-mini}; - --vxe-input-height-default: #{$vxe-input-height-default}; - --vxe-input-height-medium: #{$vxe-input-height-medium}; - --vxe-input-height-small: #{$vxe-input-height-small}; - --vxe-input-height-mini: #{$vxe-input-height-mini}; - --vxe-input-count-color: #{$vxe-input-count-color}; - --vxe-input-count-background-color: #{$vxe-input-count-background-color}; - --vxe-input-count-error-color: #{$vxe-input-count-error-color}; - - /*textarea*/ - --vxe-textarea-line-height: #{$vxe-textarea-line-height}; - --vxe-textarea-background-color: #{$vxe-textarea-background-color}; - - /*form*/ - --vxe-form-item-min-height-default: #{$vxe-form-item-min-height-default}; - --vxe-form-item-min-height-medium: #{$vxe-form-item-min-height-medium}; - --vxe-form-item-min-height-small: #{$vxe-form-item-min-height-small}; - --vxe-form-item-min-height-mini: #{$vxe-form-item-min-height-mini}; - --vxe-form-background-color: #{$vxe-form-background-color}; - --vxe-form-validate-error-color: #{$vxe-form-validate-error-color}; - --vxe-form-validate-error-background-color: #{$vxe-form-validate-error-background-color}; - - /*select*/ - --vxe-select-option-height-default: #{$vxe-select-option-height-default}; - --vxe-select-option-height-medium: #{$vxe-select-option-height-medium}; - --vxe-select-option-height-small: #{$vxe-select-option-height-small}; - --vxe-select-option-height-mini: #{$vxe-select-option-height-mini}; - --vxe-select-option-hover-background-color: #{$vxe-select-option-hover-background-color}; - --vxe-select-panel-background-color: #{$vxe-select-panel-background-color}; - --vxe-select-empty-color: #{$vxe-select-empty-color}; - --vxe-optgroup-title-color: #{$vxe-optgroup-title-color}; - - /*switch*/ - --vxe-switch-font-color: #{$vxe-switch-font-color}; - --vxe-switch-icon-background-color: #{$vxe-switch-icon-background-color}; - --vxe-switch-open-background-color: #{$vxe-switch-open-background-color}; - --vxe-switch-close-background-color: #{$vxe-switch-close-background-color}; - --vxe-switch-disabled-background-color: #{$vxe-switch-disabled-background-color}; - - /*pulldown*/ - --vxe-pulldown-panel-background-color: #{$vxe-pulldown-panel-background-color}; -} \ No newline at end of file diff --git a/styles/theme/light.scss b/styles/theme/light.scss new file mode 100644 index 0000000000..d3709e4daa --- /dev/null +++ b/styles/theme/light.scss @@ -0,0 +1,38 @@ +@import './base.scss'; + +[data-vxe-ui-theme="light"] { + $vxe-ui-font-color: #606266; + + /*font*/ + --vxe-ui-font-color: #{$vxe-ui-font-color}; + --vxe-ui-font-lighten-color: #{lighten($vxe-ui-font-color, 10%)}; + --vxe-ui-font-darken-color: #{darken($vxe-ui-font-color, 10%)}; + + /*base*/ + --vxe-ui-base-popup-border-color: #DADCE0; + --vxe-ui-base-popup-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16); + + /*layout*/ + --vxe-ui-layout-background-color: #ffffff; + + /*input*/ + --vxe-ui-input-border-color: #dcdfe6; + --vxe-ui-input-placeholder-color: #C0C4CC; + --vxe-ui-input-disabled-background-color: #f3f3f3; + + /*loading*/ + --vxe-ui-loading-background-color: rgba(255, 255, 255, 0.5); + + /*table*/ + --vxe-ui-table-header-background-color: #f8f8f9; + --vxe-ui-table-border-color: #e8eaec; + --vxe-ui-table-row-hover-background-color: #f5f7fa; + --vxe-ui-table-row-striped-background-color: #fafafa; + --vxe-ui-table-row-hover-striped-background-color: #f5f7fa; + --vxe-ui-table-row-radio-checked-background-color: #fff3e0; + --vxe-ui-table-row-hover-radio-checked-background-color: #ffebbc; + --vxe-ui-table-row-checkbox-checked-background-color: #fff3e0; + --vxe-ui-table-row-hover-checkbox-checked-background-color: #ffebbc; + --vxe-ui-table-row-current-background-color: #e6f7ff; + --vxe-ui-table-row-hover-current-background-color: #d7effb; +} \ No newline at end of file diff --git a/styles/tooltip.scss b/styles/tooltip.scss deleted file mode 100644 index 89e8521274..0000000000 --- a/styles/tooltip.scss +++ /dev/null @@ -1,127 +0,0 @@ -/**Variable**/ - -/*tppltip*/ -.vxe-table--tooltip-wrapper { - display: none; - position: absolute; - top: -100%; - left: -100%; - font-size: 12px; - max-width: 600px; - border-radius: var(--vxe-border-radius); - padding: 8px 12px; - white-space: normal; - word-break: break-word; - box-shadow: 2px 2px 4px -2px rgba(0,0,0,.2); - color: var(--vxe-font-color); - font-family: var(--vxe-font-family); - &:not(.is--enterable) { - pointer-events: none; - } - &.is--visible { - display: block; - } - &.is--arrow { - .vxe-table--tooltip-arrow { - display: block; - } - } - &.is--enterable { - &:after { - content: ""; - position: absolute; - left: 0; - width: 100%; - height: 6px; - background-color: transparent; - } - } - .vxe-table--tooltip-content { - white-space: pre-line; - } - .vxe-table--tooltip-arrow { - display: none; - position: absolute; - border-color: transparent; - border-width: 6px; - border-style: solid; - left: 50%; - transform: translateX(-6px); - &:before { - content: ""; - position: absolute; - border-color: transparent; - border-width: 5px; - border-style: solid; - left: -5px; - } - } - &.placement--top { - &.is--enterable { - &:after { - bottom: -6px; - } - } - .vxe-table--tooltip-arrow { - bottom: -12px; - &:before { - top: -7px; - } - } - } - &.placement--bottom { - &.is--enterable { - &:after { - top: -6px; - } - } - .vxe-table--tooltip-arrow { - top: -12px; - &:before { - top: -4px; - } - } - } -} -.vxe-table--tooltip-wrapper { - &.theme--light { - background-color: var(--vxe-tooltip-light-background-color); - border: 1px solid var(--vxe-input-border-color); - &.placement--top { - .vxe-table--tooltip-arrow { - border-top-color: var(--vxe-input-border-color); - &:before { - border-top-color: var(--vxe-tooltip-light-background-color); - } - } - } - &.placement--bottom { - .vxe-table--tooltip-arrow { - border-bottom-color: var(--vxe-input-border-color); - &:before { - border-bottom-color: var(--vxe-tooltip-light-background-color); - } - } - } - } - &.theme--dark { - background: var(--vxe-tooltip-dark-background-color); - color: var(--vxe-tooltip-dark-color); - &.placement--top { - .vxe-table--tooltip-arrow { - border-top-color: var(--vxe-tooltip-dark-background-color); - &:before { - border-top-color: var(--vxe-tooltip-dark-background-color); - } - } - } - &.placement--bottom { - .vxe-table--tooltip-arrow { - border-bottom-color: var(--vxe-tooltip-dark-background-color); - &:before { - border-bottom-color: var(--vxe-tooltip-dark-background-color); - } - } - } - } -} diff --git a/styles/v-x-e-table.scss b/styles/v-x-e-table.scss deleted file mode 100644 index 911c78c263..0000000000 --- a/styles/v-x-e-table.scss +++ /dev/null @@ -1,3 +0,0 @@ -/**Variable**/ -@import './icon.scss'; -@import './loading.scss'; diff --git a/styles/validator.scss b/styles/validator.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/validator.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/styles/variable.scss b/styles/variable.scss index 48b21c1062..439a68fce3 100644 --- a/styles/variable.scss +++ b/styles/variable.scss @@ -1,268 +1,3 @@ -/*font*/ -$vxe-font-family: -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol !default; -$vxe-font-size: 14px !default; -$vxe-font-size-medium: 14px !default; -$vxe-font-size-small: 13px !default; -$vxe-font-size-mini: 12px !default; +/*已废弃*/ -/*size*/ -$vxe-border-radius: 4px !default; - -/*icon*/ -$vxe-icon-font-family: Verdana,Arial,Tahoma !default; -$vxe-icon-background-color: #fff !default; - -/*color*/ -$vxe-font-color: #606266 !default; -$vxe-primary-color: #409eff !default; -$vxe-success-color: #67c23a !default; -$vxe-info-color: #909399 !default; -$vxe-warning-color: #e6a23c !default; -$vxe-danger-color: #f56c6c !default; - -$vxe-font-lighten-color: lighten($vxe-font-color, 10%) !default; -$vxe-primary-lighten-color: lighten($vxe-primary-color, 10%) !default; -$vxe-success-lighten-color: lighten($vxe-success-color, 10%) !default; -$vxe-info-lighten-color: lighten($vxe-info-color, 10%) !default; -$vxe-warning-lighten-color: lighten($vxe-warning-color, 10%) !default; -$vxe-danger-lighten-color: lighten($vxe-danger-color, 10%) !default; - -$vxe-font-darken-color: darken($vxe-font-color, 10%) !default; -$vxe-primary-darken-color: darken($vxe-primary-color, 10%) !default; -$vxe-success-darken-color: darken($vxe-success-color, 10%) !default; -$vxe-info-darken-color: darken($vxe-info-color, 10%) !default; -$vxe-warning-darken-color: darken($vxe-warning-color, 10%) !default; -$vxe-danger-darken-color: darken($vxe-danger-color, 10%) !default; - -$vxe-font-disabled-color: #BFBFBF !default; -$vxe-primary-disabled-color: lighten($vxe-primary-color, 20%) !default; -$vxe-success-disabled-color: lighten($vxe-success-color, 20%) !default; -$vxe-info-disabled-color: lighten($vxe-info-color, 20%) !default; -$vxe-warning-disabled-color: lighten($vxe-warning-color, 20%) !default; -$vxe-danger-disabled-color: lighten($vxe-danger-color, 20%) !default; - -/*input/radio/checkbox*/ -$vxe-input-border-color: #dcdfe6 !default; -$vxe-input-disabled-color: #dcdfe6 !default; -$vxe-input-disabled-background-color: #f3f3f3 !default; -$vxe-input-placeholder-color: #C0C4CC !default; - -/*popup*/ -$vxe-table-popup-border-color: #DADCE0 !default; - -/*table*/ -$vxe-table-header-font-color: $vxe-font-color !default; -$vxe-table-footer-font-color: $vxe-font-color !default; -$vxe-table-border-radius: $vxe-border-radius !default; -$vxe-table-border-width: 1px !default; -$vxe-table-border-color: #e8eaec !default; -$vxe-table-resizable-line-color: #D9DDDF !default; -$vxe-table-resizable-drag-line-color: $vxe-primary-color !default; -$vxe-table-header-background-color: #f8f8f9 !default; -$vxe-table-body-background-color: #ffffff !default; -$vxe-table-footer-background-color: #ffffff !default; -$vxe-table-tree-node-line-color:#909399 !default; -$vxe-table-tree-node-line-style: dotted !default; -$vxe-table-header-font-weight: 700 !default; - -$vxe-table-row-height-default: 48px !default; -$vxe-table-row-height-medium: 44px !default; -$vxe-table-row-height-small: 40px !default; -$vxe-table-row-height-mini: 36px !default; -$vxe-table-row-line-height: 22px !default; -$vxe-table-row-hover-background-color: #f5f7fa !default; -$vxe-table-row-striped-background-color: #fafafa !default; -$vxe-table-row-hover-striped-background-color: #f5f7fa !default; -$vxe-table-row-radio-checked-background-color: #fff3e0 !default; -$vxe-table-row-hover-radio-checked-background-color: #ffebbc !default; -$vxe-table-row-checkbox-checked-background-color: #fff3e0 !default; -$vxe-table-row-hover-checkbox-checked-background-color: #ffebbc !default; -$vxe-table-row-current-background-color: #e6f7ff !default; -$vxe-table-row-hover-current-background-color: #d7effb !default; - -$vxe-table-column-padding-default: 13px 0 !default; -$vxe-table-column-padding-medium: 11px 0 !default; -$vxe-table-column-padding-small: 9px 0 !default; -$vxe-table-column-padding-mini: 7px 0 !default; -$vxe-table-column-hover-background-color: #d7effb !default; -$vxe-table-column-current-background-color: #e6f7ff !default; -$vxe-table-column-icon-border-color: #c0c4cc !default; -$vxe-table-column-icon-border-hover-color: #515A6E !default; - -$vxe-table-cell-placeholder-color: #C0C4CC !default; -$vxe-table-cell-padding-left: 10px !default; -$vxe-table-cell-padding-right: 10px !default; -$vxe-table-cell-input-height-default: $vxe-table-row-height-default - 6 !default; -$vxe-table-cell-input-height-medium: $vxe-table-row-height-medium - 6 !default; -$vxe-table-cell-input-height-small: $vxe-table-row-height-small - 6 !default; -$vxe-table-cell-input-height-mini: $vxe-table-row-height-mini - 6 !default; -$vxe-table-cell-dirty-width: 5px !default; -$vxe-table-cell-dirty-update-color: #f56c6c !default; -$vxe-table-cell-dirty-insert-color: #19A15F !default; -$vxe-table-cell-area-border-color: $vxe-primary-color !default; -$vxe-table-cell-area-border-width: 1px !default; -$vxe-table-cell-main-area-extension-border-color: #fff; -$vxe-table-cell-main-area-extension-background-color: $vxe-primary-color !default; -$vxe-table-cell-extend-area-border-width: 2px !default; -$vxe-table-cell-copy-area-border-width: 3px !default; -$vxe-table-cell-active-area-border-width: 2px !default; -$vxe-table-cell-copy-area-border-color: $vxe-table-cell-area-border-color !default; -$vxe-table-cell-extend-area-border-color: $vxe-table-cell-area-border-color !default; -$vxe-table-cell-active-area-border-color: $vxe-table-cell-area-border-color !default; -$vxe-table-cell-area-background-color: rgba(64,158,255,0.2) !default; - -$vxe-table-checkbox-range-border-width: 1px !default; -$vxe-table-checkbox-range-border-color: #006af1 !default; -$vxe-table-checkbox-range-background-color: rgba(50,128,252,0.2) !default; - -$vxe-table-fixed-left-scrolling-box-shadow: 8px 0px 10px -5px rgba(0, 0, 0, 0.12) !default; -$vxe-table-fixed-right-scrolling-box-shadow: -8px 0px 10px -5px rgba(0, 0, 0, 0.12) !default; - -/*filter*/ -$vxe-table-filter-panel-background-color: #fff !default; - -/*menu*/ -$vxe-table-menu-item-width: 178px !default; -$vxe-table-menu-background-color: #fff !default; - -/*loading*/ -$vxe-loading-color: $vxe-primary-color !default; -$vxe-loading-background-color: rgba(255, 255, 255, 0.5) !default; -$vxe-loading-z-index: 999 !default; - -/*validate*/ -$vxe-table-validate-error-color: #f56c6c !default; -$vxe-table-validate-error-background-color: $vxe-table-body-background-color !default; - -/*grid*/ -$vxe-grid-maximize-background-color: #fff !default; - -/*toolbar*/ -$vxe-toolbar-background-color: #fff !default; -$vxe-toolbar-custom-active-background-color: #D9DADB !default; -$vxe-toolbar-panel-background-color: #fff !default; - -/*tooltip*/ -$vxe-tooltip-dark-color: #fff !default; -$vxe-tooltip-dark-background-color: #303133 !default; -$vxe-tooltip-light-background-color: #fff !default; - -/*pager*/ -$vxe-pager-background-color: #fff !default; -$vxe-pager-perfect-background-color: #fff !default; -$vxe-pager-perfect-button-background-color: #f4f4f5 !default; - -/*modal*/ -$vxe-modal-header-background-color: #F8F8F8 !default; -$vxe-modal-body-background-color: #fff !default; -$vxe-modal-border-color: #ebeef5 !default; - -/*checkbox*/ -$vxe-checkbox-font-size-default: 15px !default; -$vxe-checkbox-font-size-medium: 14px !default; -$vxe-checkbox-font-size-small: 13px !default; -$vxe-checkbox-font-size-mini: 12px !default; -$vxe-checkbox-checked-width: 0.32em !default; -$vxe-checkbox-checked-height: 0.64em !default; -$vxe-checkbox-indeterminate-width: 0.6em !default; -$vxe-checkbox-indeterminate-height: 2px !default; -$vxe-checkbox-border-width: 2px !default; -$vxe-checkbox-border-radius: 2px !default; -$vxe-checkbox-icon-background-color: #fff !default; -$vxe-checkbox-checked-icon-border-color: #fff !default; -$vxe-checkbox-indeterminate-icon-background-color: #fff !default; - -/*radio*/ -$vxe-radio-font-size-default: $vxe-checkbox-font-size-default !default; -$vxe-radio-font-size-medium: $vxe-checkbox-font-size-medium !default; -$vxe-radio-font-size-small: $vxe-checkbox-font-size-small !default; -$vxe-radio-font-size-mini: $vxe-checkbox-font-size-mini !default; -$vxe-radio-border-width: $vxe-checkbox-border-width !default; -$vxe-radio-icon-background-color: #fff !default; -$vxe-radio-checked-icon-background-color: #fff !default; -$vxe-radio-indeterminate-icon-background-color: #fff !default; -$vxe-radio-button-default-background-color: #fff !default; - -/*button*/ -$vxe-button-max-width: 500px !default; -$vxe-button-default-background-color: #fff !default; -$vxe-button-dropdown-panel-background-color: $vxe-button-default-background-color !default; -$vxe-button-height-default: 34px !default; -$vxe-button-height-medium: 32px !default; -$vxe-button-height-small: 30px !default; -$vxe-button-height-mini: 28px !default; -$vxe-button-round-border-radius-default: 17px !default; -$vxe-button-round-border-radius-medium: 16px !default; -$vxe-button-round-border-radius-small: 15px !default; -$vxe-button-round-border-radius-mini: 14px !default; - -/*input*/ -$vxe-input-background-color: #fff !default; -$vxe-input-panel-background-color: $vxe-input-background-color !default; -$vxe-input-number-disabled-color: #e4e7ed !default; -$vxe-input-date-festival-color: #999999 !default; -$vxe-input-date-festival-important-color: $vxe-primary-color !default; -$vxe-input-date-notice-background-color: #FF0000 !default; -$vxe-input-date-picker-hover-background-color: #f2f6fc !default; -$vxe-input-date-picker-selected-color: #fff !default; -$vxe-input-date-time-confirm-button-color: #fff !default; -$vxe-input-date-picker-festival-selected-color: $vxe-input-date-picker-selected-color !default; -$vxe-input-date-picker-notice-selected-background-color: $vxe-input-date-picker-selected-color !default; -$vxe-input-date-extra-color: #67c23a !default; -$vxe-input-date-extra-important-color: #fd2222 !default; -$vxe-input-date-title-height-default: 30px !default; -$vxe-input-date-title-height-medium: 29px !default; -$vxe-input-date-title-height-small: 28px !default; -$vxe-input-date-title-height-mini: 26px !default; -$vxe-input-date-time-week-row-height-default: 38px !default; -$vxe-input-date-time-week-row-height-medium: 36px !default; -$vxe-input-date-time-week-row-height-small: 34px !default; -$vxe-input-date-time-week-row-height-mini: 32px !default; -$vxe-input-date-month-year-row-height-default: 48px !default; -$vxe-input-date-month-year-row-height-medium: 46px !default; -$vxe-input-date-month-year-row-height-small: 44px !default; -$vxe-input-date-month-year-row-height-mini: 42px !default; -$vxe-input-date-quarter-row-height-default: 60px !default; -$vxe-input-date-quarter-row-height-medium: 58px !default; -$vxe-input-date-quarter-row-height-small: 56px !default; -$vxe-input-date-quarter-row-height-mini: 54px !default; -$vxe-input-height-default: $vxe-button-height-default !default; -$vxe-input-height-medium: $vxe-button-height-medium !default; -$vxe-input-height-small: $vxe-button-height-small !default; -$vxe-input-height-mini: $vxe-button-height-mini !default; -$vxe-input-count-color: #999 !default; -$vxe-input-count-background-color: #fff !default; -$vxe-input-count-error-color: $vxe-table-validate-error-color !default; - -/*textarea*/ -$vxe-textarea-line-height: 1.5715 !default; -$vxe-textarea-background-color: #fff !default; - -/*form*/ -$vxe-form-item-min-height-default: 36px !default; -$vxe-form-item-min-height-medium: 34px !default; -$vxe-form-item-min-height-small: 32px !default; -$vxe-form-item-min-height-mini: 30px !default; -$vxe-form-background-color: #fff !default; -$vxe-form-validate-error-color: $vxe-table-validate-error-color !default; -$vxe-form-validate-error-background-color: inherit !default; - -/*select*/ -$vxe-select-option-height-default: 30px !default; -$vxe-select-option-height-medium: 28px !default; -$vxe-select-option-height-small: 26px !default; -$vxe-select-option-height-mini: 24px !default; -$vxe-select-option-hover-background-color: #f5f7fa !default; -$vxe-select-panel-background-color: #fff !default; -$vxe-select-empty-color: #C0C4CC !default; -$vxe-optgroup-title-color:#909399 !default; - -/*switch*/ -$vxe-switch-font-color: #fff !default; -$vxe-switch-icon-background-color: #fff !default; -$vxe-switch-open-background-color: $vxe-primary-color !default; -$vxe-switch-close-background-color: rgba(0,0,0,0.35) !default; -$vxe-switch-disabled-background-color: rgba(0,0,0,0.15) !default; - -/*pulldown*/ -$vxe-pulldown-panel-background-color: #fff !default; +@import './base.scss'; \ No newline at end of file diff --git a/styles/vxe-table.scss b/styles/vxe-table.scss deleted file mode 100644 index 054a56ec75..0000000000 --- a/styles/vxe-table.scss +++ /dev/null @@ -1 +0,0 @@ -/**Variable**/ diff --git a/tsconfig.json b/tsconfig.json index 53d1ea97d4..ea7e5eeab7 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -4,6 +4,7 @@ "module": "esnext", "strict": true, "jsx": "preserve", + "jsxImportSource": "vue", "importHelpers": true, "moduleResolution": "node", "skipLibCheck": true, @@ -31,8 +32,8 @@ ] }, "include": [ - "packages/**/*.ts", - "packages/**/*.tsx", + "src/**/*.ts", + "src/**/*.tsx", "examples/**/*.ts", "examples/**/*.tsx", "examples/**/*.vue", diff --git a/types/all.d.ts b/types/all.d.ts index a5dc57dd72..2fe86fcfa2 100644 --- a/types/all.d.ts +++ b/types/all.d.ts @@ -1,115 +1,24 @@ -import { App } from 'vue' -import { VXETableConfigOptions, VXETableCore } from './v-x-e-table' - -import { Icon } from './icon' -import { Table } from './table' -import { Column } from './column' -import { Colgroup } from './colgroup' -import { Grid } from './grid' -import { Toolbar } from './toolbar' -import { Pager } from './pager' -import { Checkbox } from './checkbox' -import { CheckboxGroup } from './checkbox-group' -import { Radio } from './radio' -import { RadioGroup } from './radio-group' -import { RadioButton } from './radio-button' -import { Input } from './input' -import { Textarea } from './textarea' -import { Button } from './button' -import { ButtonGroup } from './button-group' -import { Select } from './select' -import { Optgroup } from './optgroup' -import { Option } from './option' -import { Modal } from './modal' -import { Drawer } from './drawer' -import { Tooltip } from './tooltip' -import { Form } from './form' -import { FormGather } from './form-gather' -import { FormItem } from './form-item' -import { Switch } from './switch' -import { List } from './list' -import { Pulldown } from './pulldown' - -export function install(app: App, options?: VXETableConfigOptions): void - -declare module '@vue/runtime-core' { - export interface GlobalComponents { - VXETable: VXETableCore - - VxeIcon: typeof Icon - VxeTable: typeof Table - VxeColumn: typeof Column - VxeColgroup: typeof Colgroup - VxeGrid: typeof Grid - VxeToolbar: typeof Toolbar - VxePager: typeof Pager - VxeCheckbox: typeof Checkbox - VxeCheckboxGroup: typeof CheckboxGroup - VxeRadio: typeof Radio - VxeRadioGroup: typeof RadioGroup - VxeRadioButton: typeof RadioButton - VxeInput: typeof Input - VxeTextarea: typeof Textarea - VxeButton: typeof Button - VxeButtonGroup: typeof ButtonGroup - VxeSelect: typeof Select - VxeOptgroup: typeof Optgroup - VxeOption: typeof Option - VxeModal: typeof Modal - VxeDrawer: typeof Drawer - VxeTooltip: typeof Tooltip - VxeForm: typeof Form - VxeFormGather: typeof FormGather - VxeFormItem: typeof FormItem - VxeSwitch: typeof Switch - VxeList: typeof List - VxePulldown: typeof Pulldown - } -} +import { VxeUIExport } from 'vxe-pc-ui' declare global { interface Window { - VXETable: VXETableCore; + /** + * @deprecated + */ + VXETable: VxeUIExport; } } -// Constructor -export * from './v-x-e-table' -export * from './component' - -// Component -export * from './icon' -export * from './loading' -export * from './table' -export * from './column' -export * from './colgroup' -export * from './grid' -export * from './toolbar' -export * from './pager' -export * from './checkbox' -export * from './checkbox-group' -export * from './radio' -export * from './radio-group' -export * from './radio-button' -export * from './input' -export * from './textarea' -export * from './button' -export * from './button-group' -export * from './select' -export * from './optgroup' -export * from './option' -export * from './modal' -export * from './drawer' -export * from './tooltip' -export * from './form' -export * from './form-gather' -export * from './form-item' -export * from './switch' -export * from './list' -export * from './pulldown' +/** + * 已废弃，请使用 VxeUI + * @deprecated + */ +export const VXETable: VxeUIExport -// Table module -export * from './module' +/** + * 已废弃，请使用 VxeUIExport + * @deprecated + */ +export type VXETableCore = VxeUIExport -// Table plugins -export * from './plugins' +export * from 'vxe-pc-ui' diff --git a/types/button-group.d.ts b/types/button-group.d.ts deleted file mode 100644 index 7cd9f8b832..0000000000 --- a/types/button-group.d.ts +++ /dev/null @@ -1,97 +0,0 @@ -import { SetupContext, RenderFunction, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, SizeType, VxeEvent, ValueOf } from './component' -import { VxeButtonPropTypes, VxeButtonProps } from './button' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 按钮组 - * @example import { VxeButtonGroup } from 'vxe-table' - */ -export const VxeButtonGroup: VXEComponent -/** - * 组件 - 按钮组 - */ -export const ButtonGroup: typeof VxeButtonGroup - -export type VxeButtonGroupInstance = ComponentPublicInstance - -export interface VxeButtonGroupConstructor extends VxeComponentBase, VxeButtonGroupMethods { - props: VxeButtonGroupProps - context: SetupContext - getComputeMaps(): ButtonPrivateComputed - renderVN: RenderFunction -} - -export type VxeButtonGroupProps = { - size?: VxeButtonGroupPropTypes.Size - options?: VxeButtonGroupPropTypes.Options - mode?: VxeButtonGroupPropTypes.Mode - status?: VxeButtonGroupPropTypes.Status - round?: VxeButtonGroupPropTypes.Round - circle?: VxeButtonGroupPropTypes.Circle - /** - * 是否禁用 - */ - disabled?: VxeButtonGroupPropTypes.Disabled - className?: VxeButtonGroupPropTypes.ClassName -} - -export namespace VxeButtonGroupPropTypes { - export type Size = SizeType - export type Options = VxeButtonProps[] - export type Round = boolean - export type Circle = boolean - export type Disabled = boolean - export type Mode = VxeButtonPropTypes.Mode - export type Status = VxeButtonPropTypes.Status - export type ClassName = string | ((params: { $buttonGroup: VxeButtonGroupConstructor }) => string) -} - -export interface ButtonPrivateComputed { -} - -export interface ButtonGroupMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void -} -export interface VxeButtonGroupMethods extends ButtonGroupMethods { } - -export interface ButtonGroupPrivateMethods { - handleClick(params: { - name: VxeButtonPropTypes.Name - }, evnt: Event): void -} -export interface VxeButtonGroupPrivateMethods extends ButtonGroupPrivateMethods { } - -export type VxeButtonGroupEmits = [ - 'click' -] - -export namespace VxeButtonGroupDefines { - interface ButtonGroupEventParams extends VxeEvent { - $buttonGroup: VxeButtonGroupConstructor - } - - export interface ClickEventParams extends ButtonGroupEventParams { } -} - -export type VxeButtonGroupEventProps = { - onClick?: VxeButtonGroupEvents.Click -} - -export interface VxeButtonGroupListeners { - click?: VxeButtonGroupEvents.Click -} - -export namespace VxeButtonGroupEvents { - export type Click = (params: VxeButtonGroupDefines.ClickEventParams) => void -} - -export interface VxeButtonGroupSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/button.d.ts b/types/button.d.ts deleted file mode 100644 index 5c29e0c085..0000000000 --- a/types/button.d.ts +++ /dev/null @@ -1,205 +0,0 @@ -import { SetupContext, RenderFunction, Ref, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, VNodeStyle } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 按钮 - * @example import { VxeButton } from 'vxe-table' - */ -export const VxeButton: VXEComponent -/** - * 组件 - 按钮 - */ -export const Button: typeof VxeButton - -export type VxeButtonInstance = ComponentPublicInstance - -export interface VxeButtonConstructor extends VxeComponentBase, VxeButtonMethods { - props: VxeButtonProps - context: SetupContext - reactData: ButtonReactData - internalData: ButtonInternalData - getRefMaps(): ButtonPrivateRef - renderVN: RenderFunction -} - -export interface ButtonPrivateRef { - refElem: Ref -} -export interface VxeButtonPrivateRef extends ButtonPrivateRef { } - -export interface ButtonReactData { - inited: boolean - showPanel: boolean - animatVisible: boolean - panelIndex: number - panelStyle: VNodeStyle - panelPlacement: any -} - -export interface ButtonInternalData { - showTime: any -} - -export namespace VxeButtonPropTypes { - export type Size = SizeType - export type Type = string - export type Mode = null | '' | 'button' | 'text' - export type ClassName = string | ((params: { $button: VxeButtonConstructor }) => string) - export type PopupClassName = string | ((params: { $button: VxeButtonConstructor }) => string) - export type Name = string | number - export type Content = string | number - export type Placement = string - export type Status = string - export type Title = string - export type Icon = string - export type Round = boolean - export type Circle = boolean - export type Disabled = boolean - export type Loading = boolean - export type DestroyOnClose = boolean - export type Transfer = boolean -} - -export type VxeButtonProps = { - size?: VxeButtonPropTypes.Size - /** - * 按钮类型 - */ - type?: VxeButtonPropTypes.Type - /** - * 按钮的模式 - */ - mode?: VxeButtonPropTypes.Mode - className?: VxeButtonPropTypes.ClassName - popupClassName?: VxeButtonPropTypes.PopupClassName - /** - * 用来标识这一项 - */ - name?: VxeButtonPropTypes.Name - title?: VxeButtonPropTypes.Title - /** - * 按钮内容 - */ - content?: VxeButtonPropTypes.Content - /** - * 固定显示下拉面板的方向 - */ - placement?: VxeButtonPropTypes.Placement - /** - * 按钮状态 - */ - status?: VxeButtonPropTypes.Status - /** - * 按钮的图标 - */ - icon?: VxeButtonPropTypes.Icon - /** - * 圆角边框 - */ - round?: VxeButtonPropTypes.Round - /** - * 圆角按钮 - */ - circle?: VxeButtonPropTypes.Circle - /** - * 是否禁用 - */ - disabled?: VxeButtonPropTypes.Disabled - /** - * 是否加载中 - */ - loading?: VxeButtonPropTypes.Loading - /** - * 在下拉面板关闭时销毁内容 - */ - destroyOnClose?: VxeButtonPropTypes.DestroyOnClose - /** - * 是否将弹框容器插入于 body 内 - */ - transfer?: VxeButtonPropTypes.Transfer -} - -export interface ButtonMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void - /** - * 获取焦点 - */ - focus(): Promise - /** - * 失去焦点 - */ - blur(): Promise -} -export interface VxeButtonMethods extends ButtonMethods { } - -export interface ButtonPrivateMethods { } -export interface VxeButtonPrivateMethods extends ButtonPrivateMethods { } - -export type VxeButtonEmits = [ - 'click', - 'mouseenter', - 'mouseleave', - 'dropdown-click' -] - -export namespace VxeButtonDefines { - interface ButtonEventParams extends VxeEvent { - $button: VxeButtonConstructor - } - - export interface ClickParams { } - export interface ClickEventParams extends ButtonEventParams, ClickParams { } - - export interface MouseenterParams { } - export interface MouseenterEventParams extends ButtonEventParams, MouseenterParams { } - - export interface MouseleaveParams { } - export interface MouseleaveEventParams extends ButtonEventParams, MouseleaveParams { } - - export interface DropdownClickParams { } - export interface DropdownClickEventParams extends ButtonEventParams, DropdownClickParams { } -} - -export type VxeButtonEventProps = { - onClick?: VxeButtonEvents.Click - onMouseenter?: VxeButtonEvents.Mouseenter - onMouseleave?: VxeButtonEvents.Mouseleave - onDropdownClick?: VxeButtonEvents.DropdownClick -} - -export interface VxeButtonListeners { - click?: VxeButtonEvents.Click - mouseenter?: VxeButtonEvents.Mouseenter - mouseleave?: VxeButtonEvents.Mouseleave - dropdownClick?: VxeButtonEvents.DropdownClick -} - -export namespace VxeButtonEvents { - export type Click = (params: VxeButtonDefines.ClickEventParams) => void - export type Mouseenter = (params: VxeButtonDefines.MouseenterEventParams) => void - export type Mouseleave = (params: VxeButtonDefines.MouseleaveEventParams) => void - export type DropdownClick = (params: VxeButtonDefines.DropdownClickParams) => void -} - -export interface VxeButtonSlots { - /** - * 自定义按钮内容 - */ - default: (params: { - [key: string]: any - }) => any - /** - * 自定义自定义图标 - */ - icon: (params: { - [key: string]: any - }) => any - /** - * 自定义下拉按钮 - */ - dropdowns: (params: { - [key: string]: any - }) => any -} diff --git a/types/checkbox-group.d.ts b/types/checkbox-group.d.ts deleted file mode 100644 index af4e3581fd..0000000000 --- a/types/checkbox-group.d.ts +++ /dev/null @@ -1,109 +0,0 @@ -import { SetupContext, RenderFunction, ComponentPublicInstance, ComputedRef } from 'vue' -import { VXEComponent, VxeComponentBase, SizeType, VxeEvent, ValueOf } from './component' -import { VxeGlobalRendererHandles } from './v-x-e-table' -import { VxeCheckboxPropTypes } from './checkbox' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 复选框组 - * @example import { VxeCheckboxGroup } from 'vxe-table' - */ -export const VxeCheckboxGroup: VXEComponent -/** - * 组件 - 复选框组 - */ -export const CheckboxGroup: typeof VxeCheckboxGroup - -export type VxeCheckboxGroupInstance = ComponentPublicInstance - -export interface VxeCheckboxGroupConstructor extends VxeComponentBase, VxeCheckboxGroupMethods { - props: VxeCheckboxGroupProps - context: SetupContext - getComputeMaps(): CheckboxPrivateComputed - renderVN: RenderFunction -} - -export type VxeCheckboxGroupProps = { - size?: VxeCheckboxGroupPropTypes.Size - options?: VxeCheckboxGroupPropTypes.Options - optionProps?: VxeCheckboxGroupPropTypes.OptionProps - /** - * 绑定值 - */ - modelValue?: VxeCheckboxGroupPropTypes.ModelValue - max?: VxeCheckboxGroupPropTypes.Max - /** - * 是否禁用 - */ - disabled?: VxeCheckboxGroupPropTypes.Disabled -} - -export namespace VxeCheckboxGroupPropTypes { - export type Size = SizeType - export type ModelValue = any[] - export type Options = { - value?: VxeCheckboxPropTypes.Label - label?: VxeCheckboxPropTypes.Content - - [key: string]: any - }[] - export type OptionProps = VxeGlobalRendererHandles.RenderOptionProps - export type Max = string | number - export type Disabled = boolean -} - -export interface CheckboxPrivateComputed { - computeIsMaximize: ComputedRef -} - -export interface CheckboxGroupMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void -} -export interface VxeCheckboxGroupMethods extends CheckboxGroupMethods { } - -export interface CheckboxGroupPrivateMethods { - handleChecked(params: { - checked: boolean - value: VxeCheckboxPropTypes.ModelValue - label: VxeCheckboxPropTypes.Label - }, evnt: Event): void -} -export interface VxeCheckboxGroupPrivateMethods extends CheckboxGroupPrivateMethods { } - -export type VxeCheckboxGroupEmits = [ - 'update:modelValue', - 'change' -] - -export namespace VxeCheckboxGroupDefines { - interface CheckboxGroupEventParams extends VxeEvent { - $checkboxGroup: VxeCheckboxGroupConstructor - } - - export type ChangeParams = { - checklist: any[] - } - export interface ChangeEventParams extends CheckboxGroupEventParams, ChangeParams { } -} - -export type VxeCheckboxGroupEventProps = { - onChange?: VxeCheckboxGroupEvents.Change -} - -export interface VxeCheckboxGroupListeners { - change?: VxeCheckboxGroupEvents.Change -} - -export namespace VxeCheckboxGroupEvents { - export type Change = (params: VxeCheckboxGroupDefines.ChangeEventParams) => void -} - -export interface VxeCheckboxGroupSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/checkbox.d.ts b/types/checkbox.d.ts deleted file mode 100644 index b10fdf985c..0000000000 --- a/types/checkbox.d.ts +++ /dev/null @@ -1,110 +0,0 @@ -import { SetupContext, RenderFunction, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 复选框 - * @example import { VxeCheckbox } from 'vxe-table' - */ -export const VxeCheckbox: VXEComponent -/** - * 组件 - 复选框 - */ -export const Checkbox: typeof VxeCheckbox - -export type VxeCheckboxInstance = ComponentPublicInstance - -export interface VxeCheckboxConstructor extends VxeComponentBase, VxeCheckboxMethods { - props: VxeCheckboxProps - context: SetupContext - renderVN: RenderFunction -} - -export type VxeCheckboxProps = { - size?: VxeCheckboxPropTypes.Size - /** - * 绑定值 - */ - modelValue?: VxeCheckboxPropTypes.ModelValue - /** - * 只对 checkbox-group 有效，值 - */ - label?: VxeCheckboxPropTypes.Label - /** - * 是否不确定状态 - */ - indeterminate?: VxeCheckboxPropTypes.Indeterminate - /** - * 原生 title 属性 - */ - title?: VxeCheckboxPropTypes.Title - checkedValue?: VxeCheckboxPropTypes.CheckedValue - uncheckedValue?: VxeCheckboxPropTypes.UncheckedValue - /** - * 内容 - */ - content?: VxeCheckboxPropTypes.Content - /** - * 是否禁用 - */ - disabled?: VxeCheckboxPropTypes.Disabled -} - -export namespace VxeCheckboxPropTypes { - export type Size = SizeType - export type ModelValue = string | number | boolean - export type Label = string | number - export type Indeterminate = boolean - export type Title = string | number - export type CheckedValue = string | number | boolean - export type UncheckedValue = string | number | boolean - export type Content = string | number - export type Disabled = boolean -} - -export interface CheckboxMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void -} -export interface VxeCheckboxMethods extends CheckboxMethods { } - -export interface CheckboxPrivateMethods { } -export interface VxeCheckboxPrivateMethods extends CheckboxPrivateMethods { } - -export type VxeCheckboxEmits = [ - 'update:modelValue', - 'change' -] - -export namespace VxeCheckboxDefines { - interface CheckboxEventParams extends VxeEvent { - $checkbox: VxeCheckboxConstructor - } - - export interface ChangeParams { - checked: boolean - label: any - } - export interface ChangeEventParams extends CheckboxEventParams, ChangeParams { } -} - -export type VxeCheckboxEventProps = { - onChange?: VxeCheckboxEvents.Change -} - -export interface VxeCheckboxListeners { - change?: VxeCheckboxEvents.Change -} - -export namespace VxeCheckboxEvents { - export type Change = (params: VxeCheckboxDefines.ChangeEventParams) => void -} - -export interface VxeCheckboxSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/colgroup.d.ts b/types/colgroup.d.ts deleted file mode 100644 index bfb0bd1a35..0000000000 --- a/types/colgroup.d.ts +++ /dev/null @@ -1,93 +0,0 @@ -import { VXEComponent } from './component' -import { VxeTableDataRow } from './table' -import { VxeColumnPropTypes, VxeColumnSlotTypes } from './column' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 表格分组列 - * @example import { VxeColgroup } from 'vxe-table' - */ -export const VxeColgroup: VXEComponent> -/** - * 组件 - 表格分组列 - */ -export const Colgroup: typeof VxeColgroup - -export type VxeColgroupProps = { - /** - * 渲染类型 - */ - type?: VxeColumnPropTypes.Type - /** - * 列字段名 - */ - field?: VxeColumnPropTypes.Field - /** - * 列标题 - */ - title?: VxeColumnPropTypes.Title - /** - * 列宽度 - */ - width?: VxeColumnPropTypes.Width - /** - * 列最小宽度，把剩余宽度按比例分配 - */ - minWidth?: VxeColumnPropTypes.MinWidth - /** - * 是否允许拖动列宽调整大小 - */ - resizable?: VxeColumnPropTypes.Resizable - /** - * 将列固定在左侧或者右侧 - */ - fixed?: VxeColumnPropTypes.Fixed - /** - * 列对其方式 - */ - align?: VxeColumnPropTypes.Align - /** - * 表头对齐方式 - */ - headerAlign?: VxeColumnPropTypes.HeaderAlign - /** - * 当内容过长时显示为省略号 - */ - showOverflow?: VxeColumnPropTypes.ShowOverflow - /** - * 当表头内容过长时显示为省略号 - */ - showHeaderOverflow?: VxeColumnPropTypes.ShowHeaderOverflow - /** - * 给单元格附加 className - */ - className?: VxeColumnPropTypes.ClassName - /** - * 给表头单元格附加 className - */ - headerClassName?: VxeColumnPropTypes.HeaderClassName - /** - * 是否可视 - */ - visible?: VxeColumnPropTypes.Visible - /** - * 额外的参数 - */ - params?: VxeColumnPropTypes.Params -} - -export type VxeColgroupEventProps = { - // -} - -export interface VxeColgroupSlots { - /** - * 自定义表头内容的模板 - */ - header: (params: VxeColumnSlotTypes.HeaderSlotParams) => any - /** - * 只对 type=checkbox,radio 有效，自定义标题模板 - */ - title: (params: VxeColumnSlotTypes.HeaderSlotParams) => any -} diff --git a/types/column.d.ts b/types/column.d.ts deleted file mode 100644 index 8c2a0caa2a..0000000000 --- a/types/column.d.ts +++ /dev/null @@ -1,506 +0,0 @@ -import { VXEComponent, SlotVNodeType } from './component' -import { VxeTableConstructor, VxeTableDataRow, VxeTableDefines, VxeTablePropTypes } from './table' -import { VxeGlobalRendererHandles } from './v-x-e-table' -import { VxeFilterPanel } from './module/filter' -import { VxeTooltipPropTypes } from './tooltip' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 表格列 - * @example import { VxeColumn } from 'vxe-table' - */ -export const VxeColumn: VXEComponent, VxeColumnEventProps, VxeColumnSlots> -/** - * 组件 - 表格列 - */ -export const Column: typeof VxeColumn - -export namespace VxeColumnPropTypes { - export type ColId = string | number - export type Type = 'seq' | 'radio' | 'checkbox' | 'expand' | 'html' | null - export type Field = string - export type Title = string - export type Width = number | string - export type MinWidth = number | string - export type MaxWidth = number | string - export type Resizable = boolean - export type Fixed = 'left' | 'right' | '' | null - export type Align = 'left' | 'center' | 'right' | '' | null - export type HeaderAlign = Align - export type FooterAlign = Align - export type ShowOverflow = VxeTablePropTypes.ShowOverflow - export type ShowHeaderOverflow = ShowOverflow - export type ShowFooterOverflow = ShowOverflow - export type ClassName = string | ((params: VxeGlobalRendererHandles.RenderCellParams) => string | any[] | { [key: string]: boolean }) - export type HeaderClassName = string | ((params: VxeGlobalRendererHandles.RenderHeaderParams) => string | any[] | { [key: string]: boolean }) - export type FooterClassName = string | ((params: VxeGlobalRendererHandles.RenderFooterParams) => string | any[] | { [key: string]: boolean }) - - export type Formatter = ((params: { - cellValue: any - column: VxeTableDefines.ColumnInfo - row: D - }) => string | number) | any[] | string - - export type Sortable = boolean - export type SortBy = string | ((params: { - row: D - column: VxeTableDefines.ColumnInfo - }) => string | number) - export type SortType = 'auto' | 'string' | 'number' | null - - export interface Filter { - label?: string | number - value?: any - data?: any - resetValue?: any - checked?: boolean - } - export type Filters = Filter[] - - export type FilterMultiple = boolean - - interface FilterMethodParams { - $table: VxeTableConstructor, - value: any - option: VxeTableDefines.FilterOption - cellValue: any - row: D - column: VxeTableDefines.ColumnInfo - } - export type FilterMethod = (params: FilterMethodParams) => boolean - - interface FilterResetMethodParams { - options: VxeTableDefines.FilterOption[] - column: VxeTableDefines.ColumnInfo - } - export type FilterResetMethod = (params: FilterResetMethodParams) => void - - interface FilterRecoverMethodParams { - option: VxeTableDefines.FilterOption - column: VxeTableDefines.ColumnInfo - } - export type FilterRecoverMethod = (params: FilterRecoverMethodParams) => void - - /** - * 筛选渲染配置项 - */ - export interface FilterRender extends VxeGlobalRendererHandles.RenderOptions { - options?: any[] - optionProps?: VxeGlobalRendererHandles.RenderOptionProps - optionGroups?: any[] - optionGroupProps?: VxeGlobalRendererHandles.RenderOptionGroupProps - content?: string - } - - export type TreeNode = boolean - export type Visible = boolean - - interface ExportMethodParams { - $table: VxeTableConstructor, - row: D - column: VxeTableDefines.ColumnInfo - } - export type ExportMethod = (params: ExportMethodParams) => string | number - - interface HeaderExportParams { - $table: VxeTableConstructor, - options: VxeTablePropTypes.ExportConfig - column: VxeTableDefines.ColumnInfo - } - export type HeaderExportMethod = (params: HeaderExportParams) => string | number - - interface FooterExportParams { - $table: VxeTableConstructor, - items: any[] - row: any - column: VxeTableDefines.ColumnInfo - _columnIndex: number - } - export type FooterExportMethod = (params: FooterExportParams) => string | number - - export interface TitlePrefix { - useHTML?: VxeTooltipPropTypes.UseHTML - content?: VxeTooltipPropTypes.Content - enterable?: VxeTooltipPropTypes.Enterable - theme?: VxeTooltipPropTypes.Theme - icon?: string - /** - * @deprecated 已废弃，请使用 content - */ - message?: string - } - - export interface TitleHelp extends TitlePrefix { } - - export interface TitleSuffix { - useHTML?: VxeTooltipPropTypes.UseHTML - content?: VxeTooltipPropTypes.Content - enterable?: VxeTooltipPropTypes.Enterable - theme?: VxeTooltipPropTypes.Theme - icon?: string - } - - export type CellType = 'auto' | 'number' | 'string' - - export interface CellRender extends VxeGlobalRendererHandles.RenderOptions { - events?: { [key: string]: (cellParams: VxeColumnSlotTypes.DefaultSlotParams, ...args: any[]) => any } - options?: any[] - optionProps?: VxeGlobalRendererHandles.RenderOptionProps - optionGroups?: any[] - optionGroupProps?: VxeGlobalRendererHandles.RenderOptionGroupProps - content?: string - } - - /** - * 编辑渲染配置项 - */ - export interface EditRender extends VxeGlobalRendererHandles.RenderOptions { - events?: { [key: string]: (cellParams: VxeColumnSlotTypes.EditSlotParams, ...args: any[]) => any } - enabled?: boolean - options?: any[] - optionProps?: VxeGlobalRendererHandles.RenderOptionProps - optionGroups?: any[] - optionGroupProps?: VxeGlobalRendererHandles.RenderOptionGroupProps - autofocus?: string - autoselect?: boolean - defaultValue?: ((params: { column: VxeTableDefines.ColumnInfo }) => any) | null | undefined | string | number | RegExp | object | any[] | Date - immediate?: boolean - content?: string - placeholder?: string - } - - /** - * 内容渲染配置项 - */ - export interface ContentRender extends VxeGlobalRendererHandles.RenderOptions { - options?: any[] - optionProps?: VxeGlobalRendererHandles.RenderOptionProps - optionGroups?: any[] - optionGroupProps?: VxeGlobalRendererHandles.RenderOptionGroupProps - } - - export type Params = any - - export type Slots = { - /** - * 只对 type=checkbox,radio 有效，自定义标题模板 - */ - title?: string | ((params: VxeColumnSlotTypes.HeaderSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 只对 type=radio 有效，自定义单选框模板 - */ - radio?: string | ((params: VxeColumnSlotTypes.RadioSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 只对 type=checkbox 有效，自定义复选框模板 - */ - checkbox?: string | ((params: VxeColumnSlotTypes.CheckboxSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 自定义显示内容模板 - */ - default?: string | ((params: VxeColumnSlotTypes.DefaultSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 自定义表头内容的模板 - */ - header?: string | ((params: VxeColumnSlotTypes.HeaderSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 自定义表尾内容的模板 - */ - footer?: string | ((params: VxeColumnSlotTypes.FooterSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 只对 type=expand 有效，自定义展开后的内容模板 - */ - content?: string | ((params: VxeColumnSlotTypes.ContentSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 只对 filter-render 启用时有效，自定义筛选模板 - */ - filter?: string | ((params: VxeColumnSlotTypes.FilterSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 只对 edit-render 启用时有效，自定义可编辑组件模板 - */ - edit?: string | ((params: VxeColumnSlotTypes.EditSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - /** - * 只对 edit-render 启用时有效，自定义可编辑组件模板 - */ - valid?: string | ((params: VxeColumnSlotTypes.ValidSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - - /** - * 已废弃 - * @deprecated - */ - icon?: string | ((params: VxeColumnSlotTypes.IconSlotParams) => SlotVNodeType[] | SlotVNodeType) | null - } -} - -export type VxeColumnProps = { - colId?: VxeColumnPropTypes.ColId - /** - * 渲染类型 - */ - type?: VxeColumnPropTypes.Type - /** - * 列字段名 - */ - field?: VxeColumnPropTypes.Field - /** - * 列标题 - */ - title?: VxeColumnPropTypes.Title - /** - * 列宽度 - */ - width?: VxeColumnPropTypes.Width - /** - * 列最小宽度，把剩余宽度按比例分配 - */ - minWidth?: VxeColumnPropTypes.MinWidth - /** - * 列最大宽度 - */ - maxWidth?: VxeColumnPropTypes.MaxWidth - /** - * 是否允许拖动列宽调整大小 - */ - resizable?: VxeColumnPropTypes.Resizable - /** - * 将列固定在左侧或者右侧 - */ - fixed?: VxeColumnPropTypes.Fixed - /** - * 列对其方式 - */ - align?: VxeColumnPropTypes.Align - /** - * 表头对齐方式 - */ - headerAlign?: VxeColumnPropTypes.HeaderAlign - /** - * 表尾列的对齐方式 - */ - footerAlign?: VxeColumnPropTypes.FooterAlign - /** - * 当内容过长时显示为省略号 - */ - showOverflow?: VxeColumnPropTypes.ShowOverflow - /** - * 当表头内容过长时显示为省略号 - */ - showHeaderOverflow?: VxeColumnPropTypes.ShowHeaderOverflow - /** - * 当表尾内容过长时显示为省略号 - */ - showFooterOverflow?: VxeColumnPropTypes.ShowFooterOverflow - /** - * 给单元格附加 className - */ - className?: VxeColumnPropTypes.ClassName - /** - * 给表头单元格附加 className - */ - headerClassName?: VxeColumnPropTypes.HeaderClassName - /** - * 给表尾单元格附加 className - */ - footerClassName?: VxeColumnPropTypes.FooterClassName - /** - * 格式化显示内容 - */ - formatter?: VxeColumnPropTypes.Formatter - /** - * 是否允许排序 - */ - sortable?: VxeColumnPropTypes.Sortable - /** - * 自定义排序的属性 - */ - sortBy?: VxeColumnPropTypes.SortBy - /** - * 排序的字段类型，比如字符串转数值等 - */ - sortType?: VxeColumnPropTypes.SortType - /** - * 配置筛选条件数组 - */ - filters?: VxeColumnPropTypes.Filter[] - /** - * 筛选是否允许多选 - */ - filterMultiple?: VxeColumnPropTypes.FilterMultiple - /** - * 自定义筛选方法 - */ - filterMethod?: VxeColumnPropTypes.FilterMethod - /** - * 筛选模板配置项 - */ - filterRender?: VxeColumnPropTypes.FilterRender - /** - * 指定为树节点 - */ - treeNode?: VxeColumnPropTypes.TreeNode - /** - * 是否可视 - */ - visible?: VxeColumnPropTypes.Visible - /** - * 自定义表尾单元格数据导出方法 - */ - headerExportMethod?: VxeColumnPropTypes.HeaderExportMethod - /** - * 自定义单元格数据导出方法 - */ - exportMethod?: VxeColumnPropTypes.ExportMethod - /** - * 自定义表尾单元格数据导出方法 - */ - footerExportMethod?: VxeColumnPropTypes.FooterExportMethod - /** - * 已废弃，被 titlePrefix 替换 - * @deprecated - */ - titleHelp?: VxeColumnPropTypes.TitleHelp - /** - * 标题前缀图标配置项 - */ - titlePrefix?: VxeColumnPropTypes.TitlePrefix - /** - * 标题后缀图标配置项 - */ - titleSuffix?: VxeColumnPropTypes.TitleSuffix - /** - * 单元格值类型 - */ - cellType?: VxeColumnPropTypes.CellType - /** - * 单元格渲染配置项 - */ - cellRender?: VxeColumnPropTypes.CellRender - /** - * 单元格编辑渲染配置项 - */ - editRender?: VxeColumnPropTypes.EditRender - /** - * 内容渲染配置项 - */ - contentRender?: VxeColumnPropTypes.ContentRender - /** - * 额外的参数 - */ - params?: VxeColumnPropTypes.Params -} - -export type VxeColumnEventProps = { - // -} - -export namespace VxeColumnSlotTypes { - export interface FilterSlotParams { - $panel: VxeFilterPanel - column: { - filters: VxeTableDefines.FilterOption[] - } & VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - $rowIndex: number - } - - export interface EditSlotParams { - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - row: D - rowIndex: number - $rowIndex: number - } - - export interface FooterSlotParams { - row: D - rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - _columnIndex: number - $columnIndex: number - $rowIndex: number - items: any[] - data: D[][] - } - - export interface HeaderSlotParams extends VxeTableDefines.CellRenderHeaderParams { } - - export interface ContentSlotParams { - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - row: D - rowIndex: number - $rowIndex: number - isHidden: boolean - fixed: VxeColumnPropTypes.Fixed - type: string - } - - export interface DefaultSlotParams extends VxeTableDefines.CellRenderBodyParams { } - - export interface CheckboxSlotParams extends DefaultSlotParams { - checked: boolean - indeterminate: boolean - } - export interface RadioSlotParams extends DefaultSlotParams { - checked: boolean - } - export interface IconSlotParams extends DefaultSlotParams { } - - export interface ValidSlotParams extends DefaultSlotParams { - rule: VxeTableDefines.ValidatorRule - content: string - } -} - -export interface VxeColumnSlots { - /** - * 自定义显示内容模板 - */ - default: (params: VxeColumnSlotTypes.DefaultSlotParams) => any - /** - * 自定义表头内容的模板 - */ - header: (params: VxeColumnSlotTypes.HeaderSlotParams) => any - /** - * 自定义表尾内容的模板 - */ - footer: (params: VxeColumnSlotTypes.FooterSlotParams) => any - /** - * 只对 type=checkbox,radio 有效，自定义标题模板 - */ - title: (params: VxeColumnSlotTypes.HeaderSlotParams) => any - /** - * 只对 type=checkbox 有效，自定义复选框模板 - */ - checkbox: (params: VxeColumnSlotTypes.CheckboxSlotParams) => any - /** - * 只对 type=radio 有效，自定义单选框模板 - */ - radio: (params: VxeColumnSlotTypes.RadioSlotParams) => any - /** - * 只对 type=expand 有效，自定义展开后的内容模板 - */ - content: (params: VxeColumnSlotTypes.ContentSlotParams) => any - /** - * 只对 filter-render 启用时有效，自定义筛选模板 - */ - filter: (params: VxeColumnSlotTypes.FilterSlotParams) => any - /** - * 只对 edit-render 启用时有效，自定义可编辑组件模板 - */ - edit: (params: VxeColumnSlotTypes.EditSlotParams) => any - /** - * 只对 edit-render 启用时有效，自定义展示错误校验模板 - */ - valid: (params: VxeColumnSlotTypes.ValidSlotParams) => any - - /** - * 已废弃 - * @deprecated - */ - icon: (params: VxeColumnSlotTypes.IconSlotParams) => any -} diff --git a/types/component.d.ts b/types/component.d.ts deleted file mode 100644 index 9c9c7e8c6f..0000000000 --- a/types/component.d.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { App, VNode } from 'vue' - -export type SizeType = null | '' | 'medium' | 'small' | 'mini' -export type ValueOf = T extends any[] ? T[number] : T[keyof T] - -export type VXEComponent< - P = { [key: string]: any }, - E = { [key: string]: any }, - S = { [key: string]: (...args: any[]) => any } -> = ({ - new (): { - $props: P & E, - $slots: S - } -} & { - install(app: App): void -}) - -export interface VxeComponentBase { - xID: string -} - -export interface VxeEvent { - $event: Event - [key: string]: any -} - -export type VNodeStyle = Record -export type VNodeClassName = Record - -export type SlotVNodeType = VNode | string | number diff --git a/types/drawer.d.ts b/types/drawer.d.ts deleted file mode 100644 index 065b4a416c..0000000000 --- a/types/drawer.d.ts +++ /dev/null @@ -1,244 +0,0 @@ -import { RenderFunction, SetupContext, ComponentPublicInstance, Ref } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, SlotVNodeType } from './component' - -/* eslint-disable no-use-before-define */ - -export declare const VxeDrawer: VXEComponent - -export type VxeDrawerInstance = ComponentPublicInstance - -export interface VxeDrawerConstructor extends VxeComponentBase, VxeDrawerMethods { - props: VxeDrawerProps - context: SetupContext - reactData: DrawerReactData - getRefMaps(): DrawerPrivateRef - getComputeMaps(): DrawerPrivateComputed - renderVN: RenderFunction -} - -export interface DrawerPrivateRef { - refElem: Ref -} -export interface VxeDrawerPrivateRef extends DrawerPrivateRef { } - -/** - * 窗口类型 - */ -export type DrawerPosition = 'top' | 'bottom' | 'left' | 'right' - -/** - * 窗口事件类型 - */ -export type DrawerEventTypes = 'model' | 'mask' | 'close' | 'confirm' | 'cancel' | 'exit' | 'exist' - -export namespace VxeDrawerPropTypes { - export type Size = SizeType - export type ModelValue = boolean - export type ID = string | null - export type Loading = boolean - export type ClassName = string - export type Position = DrawerPosition - export type Title = string | number - export type Content = number | string | null - export type ShowCancelButton = boolean | null - export type CancelButtonText = string - export type ShowConfirmButton = boolean | null - export type ConfirmButtonText = string - export type LockView = boolean - export type LockScroll = boolean - export type Mask = boolean - export type MaskClosable = boolean - export type EscClosable = boolean - export type ShowHeader = boolean - export type ShowFooter = boolean - export type ShowClose = boolean - export type Width = number | string - export type Height = number | string - export type ZIndex = number - export type DestroyOnClose = boolean - export type ShowTitleOverflow = boolean - export type Transfer = boolean - export type BeforeHideMethod = (params: DrawerVisibleParams) => Promise - export type Slots = VxeDrawerSlots -} - -export type VxeDrawerProps = { - size?: VxeDrawerPropTypes.Size - modelValue?: VxeDrawerPropTypes.ModelValue - id?: VxeDrawerPropTypes.ID - loading?: VxeDrawerPropTypes.Loading - className?: VxeDrawerPropTypes.ClassName - position?: VxeDrawerPropTypes.Position - title?: VxeDrawerPropTypes.Title - content?: VxeDrawerPropTypes.Content - showCancelButton?: VxeDrawerPropTypes.ShowCancelButton - cancelButtonText?: VxeDrawerPropTypes.CancelButtonText - showConfirmButton?: VxeDrawerPropTypes.ShowConfirmButton - confirmButtonText?: VxeDrawerPropTypes.ConfirmButtonText - lockView?: VxeDrawerPropTypes.LockView - lockScroll?: VxeDrawerPropTypes.LockScroll - mask?: VxeDrawerPropTypes.Mask - maskClosable?: VxeDrawerPropTypes.MaskClosable - escClosable?: VxeDrawerPropTypes.EscClosable - showHeader?: VxeDrawerPropTypes.ShowHeader - showFooter?: VxeDrawerPropTypes.ShowFooter - showClose?: VxeDrawerPropTypes.ShowClose - width?: VxeDrawerPropTypes.Width - height?: VxeDrawerPropTypes.Height - zIndex?: VxeDrawerPropTypes.ZIndex - destroyOnClose?: VxeDrawerPropTypes.DestroyOnClose - showTitleOverflow?: VxeDrawerPropTypes.ShowTitleOverflow - transfer?: VxeDrawerPropTypes.Transfer - beforeHideMethod?: VxeDrawerPropTypes.BeforeHideMethod - slots?: VxeDrawerPropTypes.Slots -} - -export interface DrawerPrivateComputed { -} -export interface VxeDrawerPrivateComputed extends DrawerPrivateComputed { } - -export interface DrawerReactData { - inited: boolean - visible: boolean - contentVisible: boolean - drawerZIndex: number - firstOpen: boolean -} - -export interface DrawerMethods { - dispatchEvent(type: ValueOf, params: any, evnt?: Event): void - /** - * 手动打开窗口 - */ - open(): Promise - /** - * 手动关闭窗口 - */ - close(): Promise - /** - * 获取当前窗口元素 - */ - getBox(): HTMLElement -} -export interface VxeDrawerMethods extends DrawerMethods { } - -export interface DrawerPrivateMethods { } -export interface VxeDrawerPrivateMethods extends DrawerPrivateMethods { } - -export type VxeDrawerEmits = [ - 'update:modelValue', - 'show', - 'hide', - 'before-hide', - 'close', - 'confirm', - 'cancel' -] - -export namespace VxeDrawerDefines { - export interface DrawerEventParams extends VxeComponentEvent { - $drawer: VxeDrawerConstructor - } - - export interface DrawerOptions extends VxeDrawerProps, VxeDrawerEventProps { - key?: string | number - } -} - -interface DrawerVisibleParams { -} - -export type VxeDrawerEventProps = { - onShow?: VxeDrawerEvents.Show - onHide?: VxeDrawerEvents.Hide - onBeforeHide?: VxeDrawerEvents.BeforeHide - onConfirm?: VxeDrawerEvents.Confirm - onCancel?: VxeDrawerEvents.Cancel - onClose?: VxeDrawerEvents.Close -} - -export interface VxeDrawerListeners { - show?: VxeDrawerEvents.Show - hide?: VxeDrawerEvents.Hide - beforeHide?: VxeDrawerEvents.BeforeHide - confirm?: VxeDrawerEvents.Confirm - cancel?: VxeDrawerEvents.Cancel - close?: VxeDrawerEvents.Close -} - -export namespace VxeDrawerEvents { - export type Show = (params: VxeDrawerDefines.ShowEventParams) => void - export type Hide = (params: VxeDrawerDefines.HideEventParams) => void - export type BeforeHide = (params: VxeDrawerDefines.BeforeHideEventParams) => void - export type Confirm = (params: VxeDrawerDefines.ConfirmEventParams) => void - export type Cancel = (params: VxeDrawerDefines.CancelEventParams) => void - export type Close = (params: VxeDrawerDefines.CloseEventParams) => void -} - -export namespace VxeDrawerSlotTypes { - interface DrawerEventParams extends VxeEvent { - $drawer: VxeDrawerConstructor & VxeDrawerMethods - } - - interface DrawerBaseParams extends DrawerVisibleParams { } - - export interface ShowParams extends DrawerBaseParams { } - export interface ShowEventParams extends DrawerEventParams, ShowParams { } - - export interface HideParams extends DrawerBaseParams { } - export interface HideEventParams extends DrawerEventParams, HideParams { } - - export interface BeforeHideParams extends DrawerBaseParams { } - export interface BeforeHideEventParams extends DrawerEventParams, BeforeHideParams { } - - export interface ConfirmParams extends DrawerBaseParams { } - export interface ConfirmEventParams extends DrawerEventParams, ConfirmParams { } - - export interface CancelParams extends DrawerBaseParams { } - export interface CancelEventParams extends DrawerEventParams, CancelParams { } - - export interface CloseParams extends DrawerBaseParams { } - export interface CloseEventParams extends DrawerEventParams, CloseParams { } - - export interface ZoomParams extends DrawerBaseParams { } - export interface ZoomEventParams extends DrawerEventParams, ZoomParams { } - - export interface ResizeParams extends DrawerBaseParams { } - export interface ResizeEventParams extends DrawerEventParams, ResizeParams { } - - export interface MoveParams extends DrawerBaseParams { } - export interface MoveEventParams extends DrawerEventParams, MoveParams { } - - export interface DefaultSlotParams { - $drawer: VxeDrawerConstructor & VxeDrawerMethods - } - export interface HeaderSlotParams extends DefaultSlotParams { } - export interface TitleSlotParams extends DefaultSlotParams { } - export interface FooterSlotParams extends DefaultSlotParams { } -} - -export interface VxeDrawerSlots { - /** - * 自定义窗口内容模板 - */ - default?(params: VxeDrawerSlotTypes.DefaultSlotParams): SlotVNodeType[] | SlotVNodeType - /** - * 自定义窗口头部的模板 - */ - header?(params: VxeDrawerSlotTypes.HeaderSlotParams): SlotVNodeType[] | SlotVNodeType - /** - * 自定义窗口标题的模板（如果使用了 header 插槽，则该插槽无效） - */ - title?(params: VxeDrawerSlotTypes.TitleSlotParams): SlotVNodeType[] | SlotVNodeType - /** - * 自定义窗口右上角的模板 - */ - corner?(params: VxeDrawerSlotTypes.TitleSlotParams): SlotVNodeType[] | SlotVNodeType - /** - * 自定义窗口底部的模板 - */ - footer?(params: VxeDrawerSlotTypes.FooterSlotParams): SlotVNodeType[] | SlotVNodeType -} - -export const Drawer: typeof VxeDrawer -export default VxeDrawer diff --git a/types/form-gather.d.ts b/types/form-gather.d.ts deleted file mode 100644 index 004a780f7c..0000000000 --- a/types/form-gather.d.ts +++ /dev/null @@ -1,34 +0,0 @@ -import { VXEComponent } from './component' -import { VxeFormItemPropTypes } from './form-item' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 表单项集合 - * @example import { VxeFormGather } from 'vxe-table' - */ -export const VxeFormGather: VXEComponent -/** - * 组件 - 表单项集合 - */ -export const FormGather: typeof VxeFormGather - -export interface VxeFormGatherProps { - /** - * 栅格占据的列数（共 24 分栏） - */ - span?: VxeFormItemPropTypes.Span - /** - * 给表单项附加 className - */ - className?: VxeFormItemPropTypes.ClassName -} - -export interface VxeFormGatherSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/form-item.d.ts b/types/form-item.d.ts deleted file mode 100644 index 81e49bc477..0000000000 --- a/types/form-item.d.ts +++ /dev/null @@ -1,285 +0,0 @@ -import { VXEComponent, VNodeStyle, SlotVNodeType } from './component' -import { VxeFormConstructor, VxeFormDefines, VxeFormPropTypes } from './form' -import { VxeGridConstructor } from './grid' -import { VxeTooltipPropTypes } from './tooltip' -import { VxeGlobalRendererHandles } from './v-x-e-table' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 表单项 - * @example import { VxeFormItem } from 'vxe-table' - */ -export const VxeFormItem: VXEComponent -/** - * 组件 - 表单项 - */ -export const FormItem: typeof VxeFormItem - -export interface VxeFormItemProps { - /** - * 标题 - */ - title?: VxeFormItemPropTypes.Title - /** - * 字段名 - */ - field?: VxeFormItemPropTypes.Field - /** - * 栅格占据的列数（共 24 分栏） - */ - span?: VxeFormItemPropTypes.Span - /** - * 内容对齐方式 - */ - align?: VxeFormItemPropTypes.Align - /** - * 标题对齐方式 - */ - titleAlign?: VxeFormItemPropTypes.TitleAlign - /** - * 标题宽度 - */ - titleWidth?: VxeFormItemPropTypes.TitleWidth - /** - * 是否显示标题冒号 - */ - titleColon?: VxeFormItemPropTypes.TitleColon - /** - * 是否显示必填字段的红色星号 - */ - titleAsterisk?: VxeFormItemPropTypes.TitleAsterisk - /** - * 是否显示标题 - */ - showTitle?: VxeFormItemPropTypes.ShowTitle - /** - * 使用垂直布局 - */ - vertical?: VxeFormItemPropTypes.Vertical - /** - * 给表单项附加 className - */ - className?: VxeFormItemPropTypes.ClassName - /** - * 给表单项内容附加 className - */ - contentClassName?: VxeFormItemPropTypes.ContentClassName - /** - * 给表单项内容附加样式 - */ - contentStyle?: VxeFormItemPropTypes.ContentStyle - /** - * 给表单项标题附加 className - */ - titleClassName?: VxeFormItemPropTypes.TitleClassName - /** - * 给表单项标题附加样式 - */ - titleStyle?: VxeFormItemPropTypes.TitleStyle - /** - * 前缀配置项 - */ - titlePrefix?: VxeFormItemPropTypes.TitlePrefix - /** - * 后缀配置项 - */ - titleSuffix?: VxeFormItemPropTypes.TitleSuffix - titleOverflow?: VxeFormItemPropTypes.TitleOverflow - /** - * 重置时的默认值 - */ - resetValue?: VxeFormItemPropTypes.ResetValue - /** - * 是否显示 - */ - visible?: VxeFormItemPropTypes.Visible - /** - * 该方法的返回值用来决定该项是否显示 - */ - visibleMethod?: VxeFormItemPropTypes.VisibleMethod - /** - * 默认收起 - */ - folding?: VxeFormItemPropTypes.Folding - /** - * 折叠节点 - */ - collapseNode?: VxeFormItemPropTypes.CollapseNode - /** - * 项渲染配置项 - */ - itemRender?: FormItemRenderOptions - rules?: VxeFormItemPropTypes.Rules - slots?: VxeFormItemPropTypes.Slots - children?: VxeFormItemProps[] -} - -export namespace VxeFormItemPropTypes { - export type Title = string - export type Field = string - export type Span = VxeFormPropTypes.Span - export type Align = VxeFormPropTypes.Align - export type TitleAlign = VxeFormPropTypes.TitleAlign - export type TitleWidth = VxeFormPropTypes.TitleWidth - export type TitleColon = VxeFormPropTypes.TitleColon - export type TitleAsterisk = VxeFormPropTypes.TitleAsterisk - export type ShowTitle = boolean - export type Vertical = boolean - - interface ClassNameParams { - $form: VxeFormConstructor - data: any - item: VxeFormDefines.ItemInfo - field: string - /** - * @deprecated - */ - property: string - } - export type ClassName = string | ((params: ClassNameParams) => string) - - interface ContentClassNameParams extends ClassNameParams{} - export type ContentClassName = string | ((params: ContentClassNameParams) => string) - - interface ContentStyleParams extends ClassNameParams{} - export type ContentStyle = VNodeStyle | ((params: ContentStyleParams) => VNodeStyle) - - interface TitleClassNameParams extends ClassNameParams{} - export type TitleClassName = string | ((params: TitleClassNameParams) => string) - - interface TitleStyleParams extends ClassNameParams{} - export type TitleStyle = VNodeStyle | ((params: TitleStyleParams) => VNodeStyle) - - export type Readonly = boolean - - interface PrefixOption { - useHTML?: VxeTooltipPropTypes.UseHTML - content?: VxeTooltipPropTypes.Content - enterable?: VxeTooltipPropTypes.Enterable - theme?: VxeTooltipPropTypes.Theme - icon?: string - /** - * @deprecated 已废弃，请使用 content - */ - message?: string - } - export type TitlePrefix = PrefixOption - export type TitleSuffix = PrefixOption - export type TitleOverflow = VxeFormPropTypes.TitleOverflow - - export type ResetValue = any - export type Visible = boolean - export type VisibleMethod = (params: FormItemVisibleParams) => boolean - export type Folding = boolean - export type CollapseNode = boolean - export type ItemRender = FormItemRenderOptions - export type Rules = VxeFormDefines.FormRule[] - export type Slots = { - title?: string | ((params: FormItemTitleRenderParams) => SlotVNodeType | SlotVNodeType[]) | null - default?: string | ((params: FormItemContentRenderParams) => SlotVNodeType | SlotVNodeType[]) | null - } -} - -/** - * 项渲染配置项 - */ -export interface FormItemRenderOptions extends VxeGlobalRendererHandles.RenderOptions { - /** - * 下拉选项列表（需要渲染器支持） - */ - options?: any[] - /** - * 下拉选项属性参数配置（需要渲染器支持） - */ - optionProps?: VxeGlobalRendererHandles.RenderOptionProps - /** - * 下拉分组选项列表（需要渲染器支持） - */ - optionGroups?: any[] - /** - * 下拉分组选项属性参数配置（需要渲染器支持） - */ - optionGroupProps?: VxeGlobalRendererHandles.RenderOptionGroupProps - /** - * 渲染组件的内容（需要渲染器支持） - */ - content?: string - autofocus?: string - defaultValue?: ((params: { item: VxeFormItemProps }) => any) | null | undefined | string | number | RegExp | object | any[] | Date -} - -/** - * 项标题渲染参数 - */ -export interface FormItemTitleRenderParams { - $form: VxeFormConstructor - $grid: VxeGridConstructor | null - data: any - item: VxeFormDefines.ItemInfo - field: string - /** - * @deprecated - */ - property: string -} - -/** - * 项内容渲染参数 - */ -export interface FormItemContentRenderParams { - $form: VxeFormConstructor - $grid: VxeGridConstructor | null - data: any - item: VxeFormDefines.ItemInfo - field: string - /** - * @deprecated - */ - property: string -} - -/** - * 项可视方法参数 - */ -export interface FormItemVisibleParams { - $form: VxeFormConstructor - $grid: VxeGridConstructor | null - data: any - item: VxeFormDefines.ItemInfo - field: string - /** - * @deprecated - */ - property: string -} - -/** - * 项重置方法参数 - */ -export interface FormItemResetParams { - $form: VxeFormConstructor - $grid: VxeGridConstructor | null - data: any - item: VxeFormDefines.ItemInfo - field: string - /** - * @deprecated - */ - property: string -} - -export interface VxeFormItemSlots { - /** - * 自定义内容模板 - */ - default: (params: { - [key: string]: any - }) => any - /** - * 自定义标题模板 - */ - title: (params: { - [key: string]: any - }) => any -} diff --git a/types/form.d.ts b/types/form.d.ts deleted file mode 100644 index 46f0412663..0000000000 --- a/types/form.d.ts +++ /dev/null @@ -1,357 +0,0 @@ -import { RenderFunction, SetupContext, ComponentPublicInstance, Ref, ComputedRef } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, SlotVNodeType } from './component' -import { VxeFormItemProps, VxeFormItemPropTypes } from './form-item' -import { VxeGridConstructor } from './grid' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 表单 - * @example import { VxeForm } from 'vxe-table' - */ -export const VxeForm: VXEComponent -/** - * 组件 - 表单 - */ -export const Form: typeof VxeForm - -export type VxeFormInstance = ComponentPublicInstance - -export interface VxeFormConstructor extends VxeComponentBase, VxeFormMethods { - props: VxeFormProps - context: SetupContext - reactData: FormReactData - internalData: FormInternalData - getRefMaps(): FormPrivateRef - getComputeMaps(): FormPrivateComputed - renderVN: RenderFunction - - xegrid: VxeGridConstructor | null -} - -export interface FormPrivateRef { - refElem: Ref -} -export interface VxeFormPrivateRef extends FormPrivateRef { } - -export interface FormPrivateComputed { - computeSize: ComputedRef - computeValidOpts: ComputedRef - computeTooltipOpts: ComputedRef -} -export interface VxeFormPrivateComputed extends FormPrivateComputed { } - -export interface FormReactData { - collapseAll: boolean - staticItems: any[] - formItems: VxeFormDefines.ItemInfo[] -} - -export interface FormInternalData { - tooltipTimeout: any - tooltipStore: { - item: VxeFormDefines.ItemInfo | null - visible: boolean - } -} - -export type VxeFormEmits = [ - 'update:collapseStatus', - 'collapse', - 'toggle-collapse', - 'submit', - 'submit-invalid', - 'reset' -] - -export namespace VxeFormPropTypes { - export type Size = SizeType - export type CollapseStatus = boolean - export type Loading = boolean - export type Data = any - export type Span = string | number - export type Align = 'left' | 'center' | 'right' | '' | null - export type TitleAlign = Align - export type TitleWidth = string | number - export type TitleColon = boolean - export type TitleAsterisk = boolean - export type TitleOverflow = boolean | 'ellipsis' | 'title' | 'tooltip' | '' | null - export type Vertical = boolean - - interface ClassNameParams { - $form: VxeFormConstructor - data: any - items: VxeFormDefines.ItemInfo[] - } - export type ClassName = string | ((params: ClassNameParams) => string) - - export type Items = VxeFormItemProps[] - - export type Readonly = boolean - - /** - * 校验规则配置项 - */ - export interface Rules { - [field: string]: VxeFormDefines.FormRule[] - } - - export type PreventSubmit = boolean - export type ValidConfig = { - autoPos?: boolean - showMessage?: boolean - } - export interface ValidOpts extends ValidConfig { } - - /** - * 提示信息配置项 - */ - export interface TooltipConfig { - theme?: 'dark' | 'light' - enterable?: boolean - leaveDelay?: number - leaveMethod?: (params: { $event: Event }) => boolean - } - export interface TooltipOpts extends TooltipConfig { } - - export type CustomLayout = boolean -} - -export type VxeFormProps = { - size?: VxeFormPropTypes.Size - collapseStatus?: VxeFormPropTypes.CollapseStatus - loading?: VxeFormPropTypes.Loading - data?: D - span?: VxeFormPropTypes.Span - align?: VxeFormPropTypes.Align - titleAlign?: VxeFormPropTypes.TitleAlign - titleWidth?: VxeFormPropTypes.TitleWidth - titleColon?: VxeFormPropTypes.TitleColon - titleAsterisk?: VxeFormPropTypes.TitleAsterisk - titleOverflow?: VxeFormPropTypes.TitleOverflow - vertical?: VxeFormPropTypes.Vertical - className?: VxeFormPropTypes.ClassName - readonly?: VxeFormPropTypes.Readonly - items?: VxeFormPropTypes.Items - rules?: VxeFormPropTypes.Rules - preventSubmit?: VxeFormPropTypes.PreventSubmit - validConfig?: VxeFormPropTypes.ValidConfig - tooltipConfig?: VxeFormPropTypes.TooltipConfig - customLayout?: VxeFormPropTypes.CustomLayout -} - -export interface FormMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void - /** - * 重置表单 - */ - reset(): Promise - /** - * 对表单进行校验，参数为一个回调函数。该回调函数会在校验结束后被调用 callback(errMap)。若不传入回调函数，则会返回一个 promise - * @param callback 回调函数 - */ - validate(callback?: (errMap?: VxeFormDefines.ValidateErrorMapParams) => void): Promise - /** - * 对表单指定项进行校验，参数为一个回调函数。该回调函数会在校验结束后被调用 callback(errMap)。若不传入回调函数，则会返回一个 promise - * @param callback 回调函数 - */ - validateField(field: VxeFormItemPropTypes.Field | VxeFormItemPropTypes.Field[] | VxeFormDefines.ItemInfo | VxeFormDefines.ItemInfo[], callback?: (errMap?: VxeFormDefines.ValidateErrorMapParams) => void): Promise - /** - * 手动清除校验状态，如果指定 field 则清除指定的项，否则清除整个表单 - * @param field 字段名 - */ - clearValidate(field?: VxeFormItemPropTypes.Field | VxeFormItemPropTypes.Field[] | VxeFormDefines.ItemInfo | VxeFormDefines.ItemInfo[]): Promise - /** - * 更新项状态 - * 当使用自定义渲染时可能会用到 - * @param params 插槽对象 - */ - updateStatus( - params: { - field: VxeFormItemPropTypes.Field - }, - itemValue?: any - ): void - /** - * 获取表单项列表 - */ - getItems(): VxeFormDefines.ItemInfo[] - /** - * 根据列的字段名获取表单项 - * @param field 字段名 - * - */ - getItemByField(field: VxeFormItemPropTypes.Field): VxeFormDefines.ItemInfo | null - /** - * 关闭 tooltip 提示 - */ - closeTooltip(): Promise - /** - * 手动切换折叠状态 - */ - toggleCollapse(): Promise -} -export interface VxeFormMethods extends FormMethods { } - -export interface FormPrivateMethods { - callSlot(slotFunc: ((params: T) => SlotVNodeType | SlotVNodeType[]) | string | null, params: T): SlotVNodeType[] - triggerItemEvent(evnt: Event | { type: string }, field: string, itemValue?: any): Promise - toggleCollapseEvent(evnt: Event): void - triggerTitleTipEvent(evnt: MouseEvent, params: { - item: VxeFormDefines.ItemInfo - }): void - handleTitleTipLeaveEvent(): void -} -export interface VxeFormPrivateMethods extends FormPrivateMethods { } - -export namespace VxeFormDefines { - export class ItemInfo { - id: string - - title: VxeFormItemPropTypes.Title - field: VxeFormItemPropTypes.Field - span: VxeFormItemPropTypes.Span - align: VxeFormItemPropTypes.Align - titleAlign: VxeFormItemPropTypes.TitleAlign - titleWidth: VxeFormItemPropTypes.TitleWidth - titleColon: VxeFormItemPropTypes.TitleColon - titleAsterisk: VxeFormItemPropTypes.TitleAsterisk - titlePrefix: VxeFormItemPropTypes.TitlePrefix - titleSuffix: VxeFormItemPropTypes.TitleSuffix - titleOverflow: VxeFormItemPropTypes.TitleOverflow - showTitle: VxeFormItemPropTypes.ShowTitle - vertical: VxeFormItemPropTypes.Vertical - resetValue: VxeFormItemPropTypes.ResetValue - visibleMethod: VxeFormItemPropTypes.VisibleMethod - visible: VxeFormItemPropTypes.Visible - folding: VxeFormItemPropTypes.Folding - collapseNode: VxeFormItemPropTypes.CollapseNode - className: VxeFormItemPropTypes.ClassName - contentClassName: VxeFormItemPropTypes.ContentClassName - contentStyle: VxeFormItemPropTypes.ContentStyle - titleClassName: VxeFormItemPropTypes.TitleClassName - titleStyle: VxeFormItemPropTypes.TitleStyle - readonly: VxeFormItemPropTypes.Readonly - itemRender: VxeFormItemPropTypes.ItemRender - // 渲染属性 - showError: boolean - errRule: any - slots: VxeFormItemPropTypes.Slots - children: ItemInfo[] - } - - export interface FormRule { - /** - * 是否必填 - */ - required?: boolean - /** - * 最小长度/值 - */ - min?: number - /** - * 最大长度/值 - */ - max?: number - /** - * 数据类型 - */ - type?: 'number' | 'string' | 'array' | '' | null - /** - * 使用正则表达式校验 - */ - pattern?: string | RegExp - /** - * 使用自定义校验函数，接收一个 Promise - * @param params 参数 - */ - validator?: string | ((params: RuleValidatorParams) => void | Error | Promise) - /** - * 提示消息 - */ - content?: string - trigger?: 'change' | '' | null - maxWidth?: number - /** - * @deprecated 已废弃，请使用 content - */ - message?: string - } - - export interface RuleValidatorParams { - $form: VxeFormConstructor - itemValue: any - rule: VxeFormDefines.FormRule - rules: VxeFormDefines.FormRule[] - data: any - field: string - } - export interface ValidateErrorParams { - $form: VxeFormConstructor, - rule: VxeFormDefines.FormRule - data: any - field: string - /** - * @deprecated - */ - property: string - } - - export interface ProvideItemInfo { - itemConfig: ItemInfo - } - - export interface ValidateErrorMapParams { - [field: string]: ValidateErrorParams[] - } - - interface FormEventParams extends VxeEvent { - $form: VxeFormConstructor - } - - interface FormBaseParams { - data: any - } - - export interface CollapseParams extends FormBaseParams { } - export interface CollapseEventParams extends FormEventParams, CollapseParams { } - - export interface SubmitParams extends FormBaseParams { } - export interface SubmitEventParams extends FormEventParams, SubmitParams { } - - export interface SubmitInvalidParams extends FormBaseParams { } - export interface SubmitInvalidEventParams extends FormEventParams, SubmitInvalidParams { } - - export interface ResetParams extends FormBaseParams { } - export interface ResetEventParams extends FormEventParams, ResetParams { } -} - -export type VxeFormEventProps = { - onCollapse?: VxeFormEvents.Collapse - onSubmit?: VxeFormEvents.Submit - onSubmitInvalid?: VxeFormEvents.SubmitInvalid - onReset?: VxeFormEvents.Reset -} - -export interface VxeFormListeners { - collapse?: VxeFormEvents.Collapse - submit?: VxeFormEvents.Submit - submitInvalid?: VxeFormEvents.SubmitInvalid - reset?: VxeFormEvents.Reset -} - -export namespace VxeFormEvents { - export type Collapse = (params: VxeFormDefines.CollapseEventParams) => void - export type Submit = (params: VxeFormDefines.SubmitEventParams) => void - export type SubmitInvalid = (params: VxeFormDefines.SubmitInvalidEventParams) => void - export type Reset = (params: VxeFormDefines.ResetEventParams) => void -} - -export interface VxeFormSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/grid.d.ts b/types/grid.d.ts deleted file mode 100644 index f5fe991816..0000000000 --- a/types/grid.d.ts +++ /dev/null @@ -1,641 +0,0 @@ -import { RenderFunction, SetupContext, Ref, ComputedRef, ComponentPublicInstance, ComponentInternalInstance } from 'vue' -import { VxeFormInstance, VxeFormProps, VxeFormDefines } from './form' -import { VxeFormItemProps } from './form-item' -import { VxeToolbarInstance, VxeToolbarProps, VxeToolbarPropTypes } from './toolbar' -import { VxePagerInstance, VxePagerProps, VxePagerDefines } from './pager' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, SlotVNodeType } from './component' -import { VxeTableDataRow, VxeTableDefines, VxeTableEmits, VxeTableConstructor, VxeTableProps, TablePublicMethods, VxeTableMethods, VxeTablePrivateMethods } from './table' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 配置式表格 - * @example import { VxeGrid } from 'vxe-table' - */ -export const VxeGrid: VXEComponent, VxeGridEventProps, VxeGridSlots> -/** - * 组件 - 配置式表格 - */ -export const Grid: typeof VxeGrid - -export type VxeGridInstance = ComponentPublicInstance, VxeGridConstructor> - -export interface VxeGridConstructor extends VxeComponentBase, VxeGridMethods { - props: Readonly> - context: SetupContext - instance: ComponentInternalInstance - reactData: GridReactData - getRefMaps(): GridPrivateRef - getComputeMaps(): GridPrivateComputed - renderVN: RenderFunction -} - -export interface GridPrivateRef { - refElem: Ref - refTable: Ref, VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods>> - refForm: Ref - refToolbar: Ref - refPager: Ref -} -export interface VxeGridPrivateRef extends GridPrivateRef { } - -export interface GridPrivateComputed { - computeProxyOpts: ComputedRef - computePagerOpts: ComputedRef - computeFormOpts: ComputedRef - computeToolbarOpts: ComputedRef - computeZoomOpts: ComputedRef -} - -export interface VxeGridPrivateComputed extends GridPrivateComputed { } - -export interface GridReactData { - tableLoading: boolean - proxyInited: boolean - isZMax: boolean - tableData: D[] - filterData: VxeTableDefines.FilterCheckedParams[] - formData: any - sortData: VxeTableDefines.SortCheckedParams[] - tZindex: number - tablePage: { - total: number - pageSize: number - currentPage: number - initedPages: Record - } -} - -export type VxeGridEmits = [ - ...VxeTableEmits, - - 'page-change', - 'form-submit', - 'form-submit-invalid', - 'form-reset', - 'form-collapse', - 'form-toggle-collapse', - 'proxy-query', - 'proxy-delete', - 'proxy-save', - 'toolbar-button-click', - 'toolbar-tool-click', - 'zoom' -] - -export interface GridMethods extends GridPublicMethods { - dispatchEvent(type: ValueOf, params: any, evnt?: Event): void -} - -export interface GridPublicMethods { - /** - * 给数据代理提交指令 - * @param code 指令编码 - */ - commitProxy(code: string | VxeToolbarPropTypes.ButtonConfig, ...args: any[]): Promise - /** - * 获取表单项列表 - */ - getFormItems(): VxeFormItemProps[] - getFormItems(itemIndex?: number): VxeFormItemProps - /** - * 切换表格最大化/还原 - */ - zoom(): Promise - /** - * 判断是否最大化显示 - */ - isMaximized(): boolean - /** - * 如果表格处于常规状态，则最大化表格 - */ - maximize(): Promise - /** - * 如果表格处于最大化状态，则还原表格 - */ - revert(): Promise - /** - * 获取数据代理信息 - */ - getProxyInfo(): { - data: D[] - filter: any - form: any - sort: VxeTableDefines.SortCheckedParams | { [key: string]: any } - sorts: VxeTableDefines.SortCheckedParams[] - pager: { - total: number - pageSize: number - currentPage: number - } - pendingRecords: D[] - } | null - /** - * 设置数据代理信息 - */ - // setProxyInfo(options: { - // /** - // * 修改表格数据 - // */ - // data?: any[] - // /** - // * 修改表单数据 - // */ - // form?: { - // [key: string]: any - // }, - // /** - // * 修改分页数据 - // */ - // pager?: { - // pageSize?: number - // currentPage?: number - // } - // }): Promise -} - -export interface VxeGridMethods extends GridMethods, TablePublicMethods { } - -export interface GridPrivateMethods { - callSlot(slotFunc: ((params: T) => SlotVNodeType | SlotVNodeType[]) | string | null, params: T): SlotVNodeType[] - extendTableMethods(methodKeys: T[]): any - triggerToolbarCommitEvent(params: VxeToolbarPropTypes.ButtonConfig | VxeToolbarPropTypes.ToolConfig, evnt: Event): Promise - triggerToolbarBtnEvent(button: VxeToolbarPropTypes.ButtonConfig, evnt: Event): void - triggerToolbarTolEvent(button: VxeToolbarPropTypes.ToolConfig, evnt: Event): void - triggerZoomEvent(evnt: Event): void - getParentHeight(): number - getExcludeHeight(): number -} - -export interface VxeGridPrivateMethods extends GridPrivateMethods { } - -export namespace VxeGridPropTypes { - export type Size = SizeType - - export type Layouts = ('Form' | 'Toolbar' | 'Top' | 'Table' | 'Bottom' | 'Pager')[] - - export type Columns = VxeTableDefines.ColumnOptions[] - - export interface PagerConfig extends VxePagerProps { - enabled?: boolean - slots?: any - } - export interface PagerOpts extends PagerConfig { } - - interface ProxyAjaxQueryPageParams { - total: number - pageSize: number - currentPage: number - } - - interface ProxyAjaxQuerySortCheckedParams { - column: VxeTableDefines.ColumnInfo - order: string - sortBy: string - field: string - property: string - } - - interface ProxyAjaxQueryParams { - $grid: VxeGridConstructor - page: ProxyAjaxQueryPageParams - sort: ProxyAjaxQuerySortCheckedParams - sorts: ProxyAjaxQuerySortCheckedParams[] - filters: VxeTableDefines.FilterCheckedParams[] - form: { - [key: string]: any - } - } - - interface ProxyAjaxQueryAllParams { - $table: VxeTableConstructor - $grid: VxeGridConstructor - sort: ProxyAjaxQuerySortCheckedParams - sorts: ProxyAjaxQuerySortCheckedParams[] - filters: VxeTableDefines.FilterCheckedParams[] - form: { - [key: string]: any - } - options: any - } - - interface ProxyAjaxDeleteParams { - $grid: VxeGridConstructor - body: { - removeRecords: D[] - } - } - - interface ProxyAjaxSaveParams { - $grid: VxeGridConstructor - body: { - insertRecords: D[] - updateRecords: D[] - removeRecords: D[] - pendingRecords: D[] - } - } - - export interface ProxyConfig { - enabled?: boolean - autoLoad?: boolean - message?: boolean - seq?: boolean - sort?: boolean - filter?: boolean - form?: boolean - response?: { - list?: string | null | ((params: { - data: any - $grid: VxeGridConstructor - }) => any[]) - result?: string | ((params: { - data: any - $grid: VxeGridConstructor - }) => any[]) - total?: string | ((params: { - data: any - $grid: VxeGridConstructor - }) => number) - message?: string | ((params: { - data: any - $grid: VxeGridConstructor - }) => string) - } - ajax?: { - query?(params: ProxyAjaxQueryParams, ...args: any[]): Promise - queryAll?(params: ProxyAjaxQueryAllParams, ...args: any[]): Promise - delete?(params: ProxyAjaxDeleteParams, ...args: any[]): Promise - save?(params: ProxyAjaxSaveParams, ...args: any[]): Promise - } - [key: string]: any - - /** - * 已废弃，请使用 proxy-config.response - * @deprecated - */ - props?: { - /** - * 已废弃，请使用 proxy-config.response.list - * @deprecated - */ - list?: string | null - /** - * 已废弃，请使用 proxy-config.response.result - * @deprecated - */ - result?: string - /** - * 已废弃，请使用 proxy-config.response.total - * @deprecated - */ - total?: string - /** - * 已废弃，请使用 proxy-config.response.message - * @deprecated - */ - message?: string - } - } - export interface ProxyOpts extends ProxyConfig { } - - export interface ToolbarOpts extends ToolbarConfig { } - export interface ToolbarConfig extends VxeToolbarProps { - enabled?: boolean - zoom?: boolean | { - escRestore?: boolean - iconIn?: string - iconOut?: string - } - slots?: { - buttons?: string | ((params: { [key: string]: any }) => SlotVNodeType | SlotVNodeType[]) - tools?: string | ((params: { [key: string]: any }) => SlotVNodeType | SlotVNodeType[]) - } - } - - export interface FormConfig extends VxeFormProps { - enabled?: boolean - items?: VxeFormItemProps[] - } - export interface FormOpts extends FormConfig { - inited?: boolean - } - - export interface ZoomConfig { - escRestore?: boolean - } - export interface ZoomOpts extends ZoomConfig { } -} - -export type VxeGridProps = VxeTableProps & { - layouts?: VxeGridPropTypes.Layouts - columns?: VxeGridPropTypes.Columns - pagerConfig?: VxeGridPropTypes.PagerConfig - proxyConfig?: VxeGridPropTypes.ProxyConfig - toolbarConfig?: VxeGridPropTypes.ToolbarConfig - formConfig?: VxeGridPropTypes.FormConfig - zoomConfig?: VxeGridPropTypes.ZoomConfig -} - -export namespace VxeGridDefines { - interface GridEventParams extends VxeEvent { - $grid: VxeGridConstructor - } - - export interface KeydownEventParams extends GridEventParams, VxeTableDefines.KeydownEventParams { } - export interface PasteEventParams extends GridEventParams, VxeTableDefines.PasteEventParams { } - export interface CopyEventParams extends GridEventParams, VxeTableDefines.CopyEventParams { } - export interface CutEventParams extends GridEventParams, VxeTableDefines.CutEventParams { } - export interface CurrentChangeEventParams extends GridEventParams, VxeTableDefines.CurrentChangeEventParams { } - export interface RadioChangeEventParams extends GridEventParams, VxeTableDefines.RadioChangeEventParams { } - export interface CheckboxChangeEventParams extends GridEventParams, VxeTableDefines.CheckboxChangeEventParams { } - export interface CheckboxAllEventParams extends GridEventParams, VxeTableDefines.CheckboxAllEventParams { } - export interface CheckboxRangeStartEventParams extends GridEventParams, VxeTableDefines.CheckboxRangeStartEventParams { } - export interface CheckboxRangeChangeEventParams extends GridEventParams, VxeTableDefines.CheckboxRangeChangeEventParams { } - export interface CheckboxRangeEndEventParams extends GridEventParams, VxeTableDefines.CheckboxRangeEndEventParams { } - export interface CellClickEventParams extends GridEventParams, VxeTableDefines.CellClickEventParams { } - export interface CellDblclickEventParams extends GridEventParams, VxeTableDefines.CellDblclickEventParams { } - export interface CellMenuEventParams extends GridEventParams, VxeTableDefines.CellMenuEventParams { } - export interface CellMouseenterEventParams extends GridEventParams, VxeTableDefines.CellMouseenterEventParams { } - export interface CellMouseleaveEventParams extends GridEventParams, VxeTableDefines.CellMouseleaveEventParams { } - export interface HeaderCellClickEventParams extends GridEventParams, VxeTableDefines.HeaderCellClickEventParams { } - export interface HeaderCellDblclickEventParams extends GridEventParams, VxeTableDefines.HeaderCellDblclickEventParams { } - export interface HeaderCellMenuEventParams extends GridEventParams, VxeTableDefines.HeaderCellMenuEventParams { } - export interface FooterCellClickEventParams extends GridEventParams, VxeTableDefines.FooterCellClickEventParams { } - export interface FooterCellDblclickEventParams extends GridEventParams, VxeTableDefines.FooterCellDblclickEventParams { } - export interface FooterCellMenuEventParams extends GridEventParams, VxeTableDefines.FooterCellMenuEventParams { } - export interface SortChangeEventParams extends GridEventParams, VxeTableDefines.SortChangeEventParams { } - export interface FilterChangeEventParams extends GridEventParams, VxeTableDefines.FilterChangeEventParams { } - export interface FilterVisibleEventParams extends GridEventParams, VxeTableDefines.FilterVisibleEventParams { } - export interface ResizableChangeEventParams extends GridEventParams, VxeTableDefines.ResizableChangeEventParams { } - export interface ToggleRowExpandEventParams extends GridEventParams, VxeTableDefines.ToggleRowExpandEventParams { } - export interface ToggleTreeExpandEventParams extends GridEventParams, VxeTableDefines.ToggleTreeExpandEventParams { } - export interface MenuClickEventParams extends GridEventParams, VxeTableDefines.MenuClickEventParams { } - export interface EditClosedEventParams extends GridEventParams, VxeTableDefines.EditClosedEventParams { } - export interface EditActivedEventParams extends GridEventParams, VxeTableDefines.EditActivedEventParams { } - export interface EditDisabledEventParams extends GridEventParams, VxeTableDefines.EditDisabledEventParams { } - export interface ValidErrorEventParams extends GridEventParams, VxeTableDefines.ValidErrorEventParams { } - export interface ScrollEventParams extends GridEventParams, VxeTableDefines.ScrollEventParams { } - export interface CustomEventParams extends GridEventParams, VxeTableDefines.CustomEventParams { } - - export interface ProxyQueryEventParams extends GridEventParams { - status: boolean - isReload: boolean - isInited: boolean - } - export interface ProxyDeleteEventParams extends GridEventParams { - status: boolean - } - export interface ProxySaveEventParams extends GridEventParams { - status: boolean - } - export interface PageChangeEventParams extends GridEventParams, VxePagerDefines.PageChangeEventParams { } - export interface FormSubmitEventParams extends GridEventParams, VxeFormDefines.SubmitEventParams { } - export interface FormSubmitInvalidEventParams extends GridEventParams, VxeFormDefines.SubmitInvalidParams { } - export interface FormResetEventParams extends GridEventParams, VxeFormDefines.ResetEventParams { } - export interface FormCollapseEventParams extends GridEventParams, VxeFormDefines.CollapseEventParams { } - - export interface ToolbarButtonClickParams { - code: string - button: VxeToolbarPropTypes.ButtonConfig - } - export interface ToolbarButtonClickEventParams extends GridEventParams, ToolbarButtonClickParams { } - - export interface ToolbarToolClickParams { - code: string - tool: VxeToolbarPropTypes.ToolConfig - } - export interface ToolbarToolClickEventParams extends GridEventParams, ToolbarToolClickParams { } - - export interface ZoomParams { - type: 'max' | 'revert' - } - export interface ZoomEventParams extends GridEventParams, ZoomParams { } -} - -export interface VxeGridEventProps { - onKeydown?: VxeGridEvents.Keydown - onPaste?: VxeGridEvents.Paste - onCopy?: VxeGridEvents.Copy - onCut?: VxeGridEvents.Cut - onCurrentChange?: VxeGridEvents.CurrentChange - onRadioChange?: VxeGridEvents.RadioChange - onCheckboxChange?: VxeGridEvents.CheckboxChange - onCheckboxAll?: VxeGridEvents.CheckboxAll - onCheckboxRangeStart?: VxeGridEvents.CheckboxRangeStart - onCheckboxRangeChange?: VxeGridEvents.CheckboxRangeChange - onCheckboxRangeEnd?: VxeGridEvents.CheckboxRangeEnd - onCellClick?: VxeGridEvents.CellClick - onCellDblclick?: VxeGridEvents.CellDblclick - onCellMenu?: VxeGridEvents.CellMenu - onCellMouseenter?: VxeGridEvents.CellMouseenter - onCellMouseleave?: VxeGridEvents.CellMouseleave - onHeaderCellClick?: VxeGridEvents.HeaderCellClick - onHeaderCellDblclick?: VxeGridEvents.HeaderCellDblclick - onHeaderCellMenu?: VxeGridEvents.HeaderCellMenu - onFooterCellClick?: VxeGridEvents.FooterCellClick - onFooterCellDblclick?: VxeGridEvents.FooterCellDblclick - onFooterCellMenu?: VxeGridEvents.FooterCellMenu - onSortChange?: VxeGridEvents.SortChange - onFilterChange?: VxeGridEvents.FilterChange - onFilterVisible?: VxeGridEvents.FilterVisible - onResizableChange?: VxeGridEvents.ResizableChange - onToggleRowExpand?: VxeGridEvents.ToggleRowExpand - onToggleTreeExpand?: VxeGridEvents.ToggleTreeExpand - onMenuClick?: VxeGridEvents.MenuClick - onEditClosed?: VxeGridEvents.EditClosed - onEditActived?: VxeGridEvents.EditActived - onEditDisabled?: VxeGridEvents.EditDisabled - onValidError?: VxeGridEvents.ValidError - onScroll?: VxeGridEvents.Scroll - onCustom?: VxeGridEvents.Custom - - // grid - onProxyQuery?: VxeGridEvents.ProxyQuery - onProxyDelete?: VxeGridEvents.ProxyDelete - onProxySave?: VxeGridEvents.ProxySave - onPageChange?: VxeGridEvents.PageChange - onFormSubmit?: VxeGridEvents.FormSubmit - onFormSubmitInvalid?: VxeGridEvents.FormSubmitInvalid - onFormReset?: VxeGridEvents.FormReset - onFormCollapse?: VxeGridEvents.FormCollapse - onToolbarButtonClick?: VxeGridEvents.ToolbarButtonClick - onToolbarToolClick?: VxeGridEvents.ToolbarToolClick - onZoom?: VxeGridEvents.Zoom -} - -export interface VxeGridListeners { - keydown?: VxeGridEvents.Keydown - paste?: VxeGridEvents.Paste - copy?: VxeGridEvents.Copy - cut?: VxeGridEvents.Cut - currentChange?: VxeGridEvents.CurrentChange - radioChange?: VxeGridEvents.RadioChange - checkboxChange?: VxeGridEvents.CheckboxChange - checkboxAll?: VxeGridEvents.CheckboxAll - checkboxRangeStart?: VxeGridEvents.CheckboxRangeStart - checkboxRangeChange?: VxeGridEvents.CheckboxRangeChange - checkboxRangeEnd?: VxeGridEvents.CheckboxRangeEnd - cellClick?: VxeGridEvents.CellClick - cellDblclick?: VxeGridEvents.CellDblclick - cellMenu?: VxeGridEvents.CellMenu - cellMouseenter?: VxeGridEvents.CellMouseenter - cellMouseleave?: VxeGridEvents.CellMouseleave - headerCellClick?: VxeGridEvents.HeaderCellClick - headerCellDblclick?: VxeGridEvents.HeaderCellDblclick - headerCellMenu?: VxeGridEvents.HeaderCellMenu - footerCellClick?: VxeGridEvents.FooterCellClick - footerCellDblclick?: VxeGridEvents.FooterCellDblclick - footerCellMenu?: VxeGridEvents.FooterCellMenu - sortChange?: VxeGridEvents.SortChange - filterChange?: VxeGridEvents.FilterChange - filterVisible?: VxeGridEvents.FilterVisible - resizableChange?: VxeGridEvents.ResizableChange - toggleRowExpand?: VxeGridEvents.ToggleRowExpand - toggleTreeExpand?: VxeGridEvents.ToggleTreeExpand - menuClick?: VxeGridEvents.MenuClick - editClosed?: VxeGridEvents.EditClosed - editActived?: VxeGridEvents.EditActived - editDisabled?: VxeGridEvents.EditDisabled - validError?: VxeGridEvents.ValidError - scroll?: VxeGridEvents.Scroll - custom?: VxeGridEvents.Custom - - // grid - proxyQuery?: VxeGridEvents.ProxyQuery - proxyDelete?: VxeGridEvents.ProxyDelete - proxySave?: VxeGridEvents.ProxySave - pageChange?: VxeGridEvents.PageChange - formSubmit?: VxeGridEvents.FormSubmit - formSubmitInvalid?: VxeGridEvents.FormSubmitInvalid - formReset?: VxeGridEvents.FormReset - formCollapse?: VxeGridEvents.FormCollapse - toolbarButtonClick?: VxeGridEvents.ToolbarButtonClick - toolbarToolClick?: VxeGridEvents.ToolbarToolClick - zoom?: VxeGridEvents.Zoom -} - -export namespace VxeGridEvents { - export type Keydown = (params: VxeGridDefines.KeydownEventParams) => void - export type Paste = (params: VxeGridDefines.PasteEventParams) => void - export type Copy = (params: VxeGridDefines.CopyEventParams) => void - export type Cut = (params: VxeGridDefines.CutEventParams) => void - export type CurrentChange = (params: VxeGridDefines.CurrentChangeEventParams) => void - export type RadioChange = (params: VxeGridDefines.RadioChangeEventParams) => void - export type CheckboxChange = (params: VxeGridDefines.CheckboxChangeEventParams) => void - export type CheckboxAll = (params: VxeGridDefines.CheckboxAllEventParams) => void - export type CheckboxRangeStart = (params: VxeGridDefines.CheckboxRangeStartEventParams) => void - export type CheckboxRangeChange = (params: VxeGridDefines.CheckboxRangeChangeEventParams) => void - export type CheckboxRangeEnd = (params: VxeGridDefines.CheckboxRangeEndEventParams) => void - export type CellClick = (params: VxeGridDefines.CellClickEventParams) => void - export type CellDblclick = (params: VxeGridDefines.CellDblclickEventParams) => void - export type CellMenu = (params: VxeGridDefines.CellMenuEventParams) => void - export type CellMouseenter = (params: VxeGridDefines.CellMouseenterEventParams) => void - export type CellMouseleave = (params: VxeGridDefines.CellMouseleaveEventParams) => void - export type HeaderCellClick = (params: VxeGridDefines.HeaderCellClickEventParams) => void - export type HeaderCellDblclick = (params: VxeGridDefines.HeaderCellDblclickEventParams) => void - export type HeaderCellMenu = (params: VxeGridDefines.HeaderCellMenuEventParams) => void - export type FooterCellClick = (params: VxeGridDefines.FooterCellClickEventParams) => void - export type FooterCellDblclick = (params: VxeGridDefines.FooterCellDblclickEventParams) => void - export type FooterCellMenu = (params: VxeGridDefines.FooterCellMenuEventParams) => void - export type SortChange = (params: VxeGridDefines.SortChangeEventParams) => void - export type FilterChange = (params: VxeGridDefines.FilterChangeEventParams) => void - export type FilterVisible = (params: VxeGridDefines.FilterVisibleEventParams) => void - export type ResizableChange = (params: VxeGridDefines.ResizableChangeEventParams) => void - export type ToggleRowExpand = (params: VxeGridDefines.ToggleRowExpandEventParams) => void - export type ToggleTreeExpand = (params: VxeGridDefines.ToggleTreeExpandEventParams) => void - export type MenuClick = (params: VxeGridDefines.MenuClickEventParams) => void - export type EditClosed = (params: VxeGridDefines.EditClosedEventParams) => void - export type EditActived = (params: VxeGridDefines.EditActivedEventParams) => void - export type EditDisabled = (params: VxeGridDefines.EditDisabledEventParams) => void - export type ValidError = (params: VxeGridDefines.ValidErrorEventParams) => void - export type Scroll = (params: VxeGridDefines.ScrollEventParams) => void - export type Custom = (params: VxeGridDefines.CustomEventParams) => void - - export type ProxyQuery = (params: VxeGridDefines.ProxyQueryEventParams) => void - export type ProxyDelete = (params: VxeGridDefines.ProxyDeleteEventParams) => void - export type ProxySave = (params: VxeGridDefines.ProxySaveEventParams) => void - export type PageChange = (params: VxeGridDefines.PageChangeEventParams) => void - export type FormSubmit = (params: VxeGridDefines.FormSubmitEventParams) => void - export type FormSubmitInvalid = (params: VxeGridDefines.FormSubmitInvalidEventParams) => void - export type FormReset = (params: VxeGridDefines.FormResetEventParams) => void - export type FormCollapse = (params: VxeGridDefines.FormCollapseEventParams) => void - export type ToolbarButtonClick = (params: VxeGridDefines.ToolbarButtonClickEventParams) => void - export type ToolbarToolClick = (params: VxeGridDefines.ToolbarToolClickEventParams) => void - export type Zoom = (params: VxeGridDefines.ZoomEventParams) => void -} - -export interface VxeGridSlots { - /** - * 自定义空数据时显示模板 - */ - empty?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any - /** - * 自定义加载中模板 - */ - loading?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any - /** - * 自定义表单模板 - */ - form?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any - /** - * 自定义工具栏模板 - */ - toolbar?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any - /** - * 自定义表格顶部模板 - */ - top?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any - /** - * 表格底部模板 - */ - bottom?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any - /** - * 自定义分页模板 - */ - pager?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any - - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - row: D - rowIndex: number - $rowIndex: number - _rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - - checked?: boolean - indeterminate?: boolean - - items: D[] - - [key: string]: any - }) => any) | undefined -} diff --git a/types/icon.d.ts b/types/icon.d.ts deleted file mode 100644 index 4d3dca5a80..0000000000 --- a/types/icon.d.ts +++ /dev/null @@ -1,59 +0,0 @@ -import { SetupContext } from 'vue' -import { VXEComponent, VxeComponentBase } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 图标 - * @example import { VxeIcon } from 'vxe-table' - */ -export const VxeIcon: VXEComponent<{ [key: string]: any }> -/** - * 组件 - 图标 - */ -export const Icon: VXEComponent<{ [key: string]: any }> - -export interface VxeIconConstructor extends VxeComponentBase, VxeIconMethods { - props: VxeIconProps - context: SetupContext -} - -export interface IconMethods {} - -export interface VxeIconMethods extends IconMethods { } - -export type VxeIconProps = { - name?: VxeIconPropTypes.Name - roll?: VxeIconPropTypes.Roll - status?: VxeIconPropTypes.Status -} - -export namespace VxeIconPropTypes { - export type Name = string - export type Roll = boolean - export type Status = string -} - -export type VxeIconEmits = [ - 'click' -] - -export namespace VxeIconDefines { - interface IconKeyboardEventParams { - $event: KeyboardEvent - } - export interface ClickParams {} - export interface ClickEventParams extends IconKeyboardEventParams, ClickParams { } -} - -export type VxeIconEventProps = { - onClick?: VxeIconEvents.Click -} - -export interface VxeIconListeners { - click?: VxeIconEvents.Click -} - -export namespace VxeIconEvents { - export type Click = (params: VxeIconDefines.ClickEventParams) => void -} diff --git a/types/index.d.ts b/types/index.d.ts index 4a16441a2d..fe3c35b5dd 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -1,9 +1,4 @@ -import * as VXETableExport from './all' - -/** - * 一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、贼灵活的配置项、扩展接口等... - */ -declare const VXETable: typeof VXETableExport +import * as VxeUITable from './all' export * from './all' -export default VXETable +export default VxeUITable diff --git a/types/input.d.ts b/types/input.d.ts deleted file mode 100644 index 4ce5a2a702..0000000000 --- a/types/input.d.ts +++ /dev/null @@ -1,377 +0,0 @@ -import { RenderFunction, SetupContext, ComponentPublicInstance, Ref } from 'vue' -import { VXEComponent, VxeComponentBase, SizeType, VNodeStyle, ValueOf } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 输入框 - * @example import { VxeInput } from 'vxe-table' - */ -export const VxeInput: VXEComponent -/** - * 组件 - 输入框 - */ -export const Input: typeof VxeInput - -export type VxeInputInstance = ComponentPublicInstance - -export interface VxeInputConstructor extends VxeComponentBase, VxeInputMethods { - props: VxeInputProps - context: SetupContext - reactData: InputReactData - getRefMaps(): InputPrivateRef - renderVN: RenderFunction -} - -export interface InputPrivateRef { - refElem: Ref - refInput: Ref -} -export interface VxeInputPrivateRef extends InputPrivateRef { } - -type DatePanelType = 'year' | 'quarter' | 'month' | 'week' | 'day' - -export interface InputReactData { - inited: boolean - panelIndex: number - showPwd: boolean - visiblePanel: boolean - animatVisible: boolean - panelStyle: VNodeStyle | null - panelPlacement: VxeInputPropTypes.Placement - isActivated: boolean - inputValue: any - datetimePanelValue: any - datePanelValue: Date | null - datePanelLabel: string - datePanelType: DatePanelType - selectMonth: any - currentDate: any -} - -export namespace VxeInputPropTypes { - export type Size = SizeType - export type ModelValue = string | number | Date | null - export type ClassName = string - export type Immediate = boolean - export type Name = string - export type Type = 'text' | 'search' | 'number' | 'integer' | 'float' | 'password' | 'date' | 'time' | 'datetime' | 'week' | 'month' | 'quarter' | 'year' - export type Clearable = boolean - export type Readonly = boolean - export type Disabled = boolean - export type Placeholder = string - export type Maxlength = string | number - export type Multiple = boolean - export type ShowWordCount = boolean - export type CountMethod = (params: { - value: string - }) => number - export type Autocomplete = string - export type Align = string - export type Form = string - export type Min = string | number - export type Max = string | number - export type Step = string | number - export type Exponential = boolean - export type Controls = boolean - export type Digits = string | number - export type StartDate = string | number | Date - export type EndDate = string | number | Date - export type MinDate = string | number | Date - export type MaxDate = string | number | Date - export type StartDay = 0 | 1 | 2 | 3 | 4 | 5 | 6 - export type SelectDay = 0 | 1 | 2 | 3 | 4 | 5 | 6 - export type LabelFormat = string - export type ValueFormat = string - export type Editable = boolean - export type FestivalMethod = (params: VxeInputDefines.DateFestivalParams) => VxeInputDefines.DateFestivalInfo | null | void - export type DisabledMethod = (params: VxeInputDefines.DateDisabledParams) => boolean - export type PrefixIcon = string - export type SuffixIcon = string - export type Placement = 'top' | 'bottom' | '' | null - export type Transfer = boolean -} - -export type VxeInputProps = { - size?: VxeInputPropTypes.Size - modelValue?: VxeInputPropTypes.ModelValue - className?: VxeInputPropTypes.ClassName - immediate?: VxeInputPropTypes.Immediate - name?: VxeInputPropTypes.Name - type?: VxeInputPropTypes.Type - clearable?: VxeInputPropTypes.Clearable - readonly?: VxeInputPropTypes.Readonly - disabled?: VxeInputPropTypes.Disabled - placeholder?: VxeInputPropTypes.Placeholder - maxlength?: VxeInputPropTypes.Maxlength - multiple?: VxeInputPropTypes.Multiple - /** - * 是否显示字数统计 - */ - showWordCount?: VxeInputPropTypes.ShowWordCount - /** - * 自定义字数统计方法 - */ - countMethod?: VxeInputPropTypes.CountMethod - autocomplete?: VxeInputPropTypes.Autocomplete - align?: VxeInputPropTypes.Align - form?: VxeInputPropTypes.Form - - // number、integer、float - min?: VxeInputPropTypes.Min - max?: VxeInputPropTypes.Max - step?: VxeInputPropTypes.Step - exponential?: VxeInputPropTypes.Exponential - - // number、integer、float、password - controls?: VxeInputPropTypes.Controls - - // float - digits?: VxeInputPropTypes.Digits - - // date、week、month、quarter、year - startDate?: VxeInputPropTypes.StartDate - endDate?: VxeInputPropTypes.EndDate - minDate?: VxeInputPropTypes.MinDate - maxDate?: VxeInputPropTypes.MaxDate - /** - * @deprecated - */ - startWeek?: VxeInputPropTypes.StartDay - startDay?: VxeInputPropTypes.StartDay - labelFormat?: VxeInputPropTypes.LabelFormat - valueFormat?: VxeInputPropTypes.ValueFormat - editable?: VxeInputPropTypes.Editable - festivalMethod?: VxeInputPropTypes.FestivalMethod - disabledMethod?: VxeInputPropTypes.DisabledMethod - - // week - selectDay?: VxeInputPropTypes.SelectDay - - prefixIcon?: VxeInputPropTypes.PrefixIcon - suffixIcon?: VxeInputPropTypes.SuffixIcon - placement?: VxeInputPropTypes.Placement - transfer?: VxeInputPropTypes.Transfer -} - -export interface InputMethods { - dispatchEvent: (type: ValueOf, params: any, evnt?: Event | { type: string }) => void - /** - * 获取焦点 - */ - focus(): Promise - /** - * 失去焦点 - */ - blur(): Promise - /** - * 选中内容 - */ - select(): Promise - /** - * 弹出面板，用于带下拉面板的功能， - */ - showPanel(): Promise - /** - * 关闭面板，用于带下拉面板的功能， - */ - hidePanel(): Promise - updatePlacement(): Promise -} -export interface VxeInputMethods extends InputMethods { } - -export interface InputPrivateMethods { } -export interface VxeInputPrivateMethods extends InputPrivateMethods { } - -export type VxeInputEmits = [ - 'update:modelValue', - 'input', - 'change', - 'keydown', - 'keyup', - 'wheel', - 'click', - 'focus', - 'blur', - 'clear', - 'search-click', - 'toggle-visible', - 'prev-number', - 'next-number', - 'prefix-click', - 'suffix-click', - 'date-prev', - 'date-today', - 'date-next' -] - -export namespace VxeInputDefines { - - interface DateFestivalItem { - /** - * 显示名称 - */ - label?: string - /** - * 标记为重要信息 - */ - important?: boolean - className?: string - style?: VNodeStyle - } - - /** - * 日期节日对象 - */ - export interface DateFestivalInfo extends DateFestivalItem { - /** - * 显示左上角小圆点通知 - */ - notice?: boolean - /** - * 显示右上角信息 - */ - extra?: string | DateFestivalItem - } - - export interface DateFestivalParams { - $input: VxeInputConstructor - type: string - viewType: DatePanelType - date: Date - } - - export interface DateDisabledParams { - $input: VxeInputConstructor - type: string - viewType: DatePanelType - date: Date - } - - interface InputKeyboardEventParams { - $input: VxeInputConstructor - $event: KeyboardEvent - } - - export interface InputParams { - value: string - } - export interface InputEventParams extends InputKeyboardEventParams, InputParams { } - - export interface ChangeParams extends InputParams {} - export interface ChangeEventParams extends InputKeyboardEventParams, ChangeParams { } - - export interface KeyupParams extends InputParams {} - export interface KeyupEventParams extends InputKeyboardEventParams, KeyupParams { } - - export interface KeydownParams extends InputParams {} - export interface KeydownEventParams extends InputKeyboardEventParams, KeydownParams { } - - export interface ClickParams extends InputParams {} - export interface ClickEventParams extends InputKeyboardEventParams, ClickParams { } - - export interface FocusParams extends InputParams {} - export interface FocusEventParams extends InputKeyboardEventParams, FocusParams { } - - export interface BlurParams extends InputParams {} - export interface BlurEventParams extends InputKeyboardEventParams, BlurParams { } - - export interface ClearParams extends InputParams {} - export interface ClearEventParams extends InputKeyboardEventParams, ClearParams { } - - export interface SearchClickParams extends InputParams {} - export interface SearchClickEventParams extends InputKeyboardEventParams, SearchClickParams { } - - export interface ToggleVisibleParams extends InputParams {} - export interface ToggleVisibleEventParams extends InputKeyboardEventParams, ToggleVisibleParams { } - - export interface PrevNumberParams extends InputParams {} - export interface PrevNumberEventParams extends InputKeyboardEventParams, PrevNumberParams { } - - export interface NextNumberParams extends InputParams {} - export interface NextNumberEventParams extends InputKeyboardEventParams, NextNumberParams { } - - export interface PrefixClickParams extends InputParams {} - export interface PrefixClickEventParams extends InputKeyboardEventParams, PrefixClickParams { } - - export interface SuffixClickParams extends InputParams {} - export interface SuffixClickEventParams extends InputKeyboardEventParams, SuffixClickParams { } - - export interface DatePrevParams extends InputParams {} - export interface DatePrevEventParams extends InputKeyboardEventParams, DatePrevParams { } - - export interface DateTodayParams extends InputParams {} - export interface DateTodayEventParams extends InputKeyboardEventParams, DateTodayParams { } - - export interface DateNextParams extends InputParams {} - export interface DateNextEventParams extends InputKeyboardEventParams, DateNextParams { } -} - -export type VxeInputEventProps = { - onInput?: VxeInputEvents.Input - onChange?: VxeInputEvents.Change - onKeydown?: VxeInputEvents.Keydown - onKeyup?: VxeInputEvents.Keyup - onClick?: VxeInputEvents.Click - onFocus?: VxeInputEvents.Focus - onBlur?: VxeInputEvents.Blur - onClear?: VxeInputEvents.Clear - onSearchClick?: VxeInputEvents.SearchClick - onToggleVisible?: VxeInputEvents.ToggleVisible - onPrevNumber?: VxeInputEvents.PrevNumber - onNextNumber?: VxeInputEvents.NextNumber - onPrefixClick?: VxeInputEvents.PrefixClick - onSuffixClick?: VxeInputEvents.SuffixClick - onDatePrev?: VxeInputEvents.DatePrev - onDateToday?: VxeInputEvents.DateToday - onDateNext?: VxeInputEvents.DateNext -} - -export interface VxeInputListeners { - input?: VxeInputEvents.Input - change?: VxeInputEvents.Change - keydown?: VxeInputEvents.Keydown - keyup?: VxeInputEvents.Keyup - click?: VxeInputEvents.Click - focus?: VxeInputEvents.Focus - blur?: VxeInputEvents.Blur - clear?: VxeInputEvents.Clear - searchClick?: VxeInputEvents.SearchClick - toggleVisible?: VxeInputEvents.ToggleVisible - prevNumber?: VxeInputEvents.PrevNumber - nextNumber?: VxeInputEvents.NextNumber - prefixClick?: VxeInputEvents.PrefixClick - suffixClick?: VxeInputEvents.SuffixClick - datePrev?: VxeInputEvents.DatePrev - dateToday?: VxeInputEvents.DateToday - dateNext?: VxeInputEvents.DateNext -} - -export namespace VxeInputEvents { - export type Input = (params: VxeInputDefines.InputEventParams) => void - export type Change = (params: VxeInputDefines.ChangeEventParams) => void - export type Keydown = (params: VxeInputDefines.KeydownEventParams) => void - export type Keyup = (params: VxeInputDefines.KeyupEventParams) => void - export type Click = (params: VxeInputDefines.ClickEventParams) => void - export type Focus = (params: VxeInputDefines.FocusEventParams) => void - export type Blur = (params: VxeInputDefines.BlurEventParams) => void - export type Clear = (params: VxeInputDefines.ClearEventParams) => void - export type SearchClick = (params: VxeInputDefines.SearchClickEventParams) => void - export type ToggleVisible = (params: VxeInputDefines.ToggleVisibleEventParams) => void - export type PrevNumber = (params: VxeInputDefines.PrevNumberEventParams) => void - export type NextNumber = (params: VxeInputDefines.NextNumberEventParams) => void - export type PrefixClick = (params: VxeInputDefines.PrefixClickEventParams) => void - export type SuffixClick = (params: VxeInputDefines.SuffixClickEventParams) => void - export type DatePrev = (params: VxeInputDefines.DatePrevEventParams) => void - export type DateToday = (params: VxeInputDefines.DateTodayEventParams) => void - export type DateNext = (params: VxeInputDefines.DateNextEventParams) => void -} - -export interface VxeInputSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/list.d.ts b/types/list.d.ts deleted file mode 100644 index 529f09d9ca..0000000000 --- a/types/list.d.ts +++ /dev/null @@ -1,167 +0,0 @@ -import { RenderFunction, SetupContext, ComponentPublicInstance, Ref } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 虚拟列表 - * @example import { VxeList } from 'vxe-table' - */ -export const VxeList: VXEComponent -/** - * 组件 - 虚拟列表 - */ -export const List: typeof VxeList - -export type VxeListInstance = ComponentPublicInstance - -export interface VxeListConstructor extends VxeComponentBase, VxeListMethods { - props: VxeListProps - context: SetupContext - reactData: ListReactData - internalData: ListInternalData - getRefMaps(): ListPrivateRef - renderVN: RenderFunction -} - -export interface ListPrivateRef { - refElem: Ref -} -export interface VxeListPrivateRef extends ListPrivateRef { } - -export interface ListReactData { - scrollYLoad: boolean - bodyHeight: number - rowHeight: number - topSpaceHeight: number - items: any[] -} - -export interface ListInternalData { - fullData: any[] - lastScrollLeft: number - lastScrollTop: number - scrollYStore: { - startIndex: number - endIndex: number - visibleSize: number - offsetSize: number - rowHeight: number - } -} - -export interface ListMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void - /** - * 加载数据 - * @param data 列表数据 - */ - loadData(data: any[]): Promise - - /** - * 加载数据 - * @param data 列表数据 - */ - reloadData(data: any[]): Promise - - /** - * 重新计算列表 - */ - recalculate(): Promise - - /** - * 如果有滚动条，则滚动到对应的位置 - * @param scrollLeft 左边距离 - * @param scrollTop 顶部距离 - */ - scrollTo(scrollLeft: number | null, scrollTop?: number | null): Promise - - /** - * 刷新滚动操作，手动同步滚动相关位置 - */ - refreshScroll(): Promise - - /** - * 手动清除滚动相关信息，还原到初始状态 - */ - clearScroll(): Promise -} -export interface VxeListMethods extends ListMethods { } - -export interface ListPrivateMethods { } -export interface VxeListPrivateMethods extends ListPrivateMethods { } - -export namespace VxeListPropTypes { - export type Size = SizeType - export type Data = any[] - export type Height = number | string - export type MaxHeight = number | string - export type Loading = boolean - export type AutoResize = boolean - export type ClassName = string | ((params: { $list: VxeListConstructor }) => string) - export type SyncResize = boolean | string | number - export interface ScrollY { - /** - * 指定大于指定行时自动启动纵向虚拟滚动，如果为 0 则总是启用，如果为 -1 则关闭 - */ - gt?: number - /** - * 指定每次渲染的数据偏移量，偏移量越大渲染次数就越少，但每次渲染耗时就越久 - */ - oSize?: number - /** - * 指定列表项的 className - */ - sItem?: string - /** - * 是否启用 - */ - enabled?: boolean - } -} - -export type VxeListProps = { - size?: VxeListPropTypes.Size - data?: D[] - height?: VxeListPropTypes.Height - maxHeight?: VxeListPropTypes.MaxHeight - loading?: VxeListPropTypes.Loading - autoResize?: VxeListPropTypes.AutoResize - syncResize?: VxeListPropTypes.SyncResize - className?: VxeListPropTypes.ClassName - scrollY?: VxeListPropTypes.ScrollY -} - -export type VxeListEmits = [ - 'scroll' -] - -export namespace VxeListDefines { - interface ListEventParams extends VxeEvent { - $list: VxeListConstructor - } - - export interface ScrollParams { } - export interface ScrollEventParams extends ListEventParams, ScrollParams { } -} - -export type VxeListEventProps = { - onScroll?: VxeListEvents.Scroll -} - -export interface VxeListListeners { - scroll?: VxeListEvents.Scroll -} - -export namespace VxeListEvents { - export type Scroll = (params: VxeListDefines.ScrollEventParams) => void -} - -export interface VxeListSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/loading.d.ts b/types/loading.d.ts deleted file mode 100644 index 12920bdcb5..0000000000 --- a/types/loading.d.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { VXEComponent } from './component' - -/** - * 组件 - 加载中 - */ -export const VxeLoading: VXEComponent<{[key: string]: any }> -/** - * 组件 - 加载中 - */ -export const Loading: VXEComponent<{ [key: string]: any }> diff --git a/types/modal.d.ts b/types/modal.d.ts deleted file mode 100644 index 67d3f3e48f..0000000000 --- a/types/modal.d.ts +++ /dev/null @@ -1,418 +0,0 @@ -import { RenderFunction, SetupContext, ComponentPublicInstance, Ref } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, SlotVNodeType } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 弹窗 - * @example import { VxeModal } from 'vxe-table' - */ -export const VxeModal: VXEComponent -/** - * 组件 - 弹窗 - */ -export const Modal: typeof VxeModal - -export type VxeModalInstance = ComponentPublicInstance - -export interface VxeModalConstructor extends VxeComponentBase, VxeModalMethods { - props: VxeModalProps - context: SetupContext - reactData: ModalReactData - getRefMaps(): ModalPrivateRef - renderVN: RenderFunction -} - -export interface ModalPrivateRef { - refElem: Ref -} -export interface VxeModalPrivateRef extends ModalPrivateRef { } - -export interface ModalReactData { - inited: boolean - visible: boolean - contentVisible: boolean - modalTop: number - modalZindex: number - zoomLocat: { - left: number - top: number - width: number - height: number - } | null - firstOpen: boolean -} - -export interface ModalMethods { - dispatchEvent(type: ValueOf, params: any, evnt?: Event): void - /** - * 手动打开窗口 - */ - open(): Promise - /** - * 手动关闭窗口 - */ - close(): Promise - /** - * 获取当前窗口元素 - */ - getBox(): HTMLElement - /** - * 获取窗口位置 - */ - getPosition(): { - top?: number - left?: number - } | null - /** - * 设置窗口位置 - */ - setPosition(top?: number, left?: number): Promise - /** - * 判断是否最大化显示 - */ - isMaximized(): boolean - /** - * 切换窗口最大化/还原 - */ - zoom(): Promise - /** - * 如果窗口处于常规状态，则最大化窗口 - */ - maximize(): Promise - /** - * 如果窗口处于最大化状态，则还原窗口 - */ - revert(): Promise -} -export interface VxeModalMethods extends ModalMethods { } - -export interface ModalPrivateMethods { } -export interface VxeModalPrivateMethods extends ModalPrivateMethods { } - -/** - * 窗口类型 - */ -export type ModalType = 'alert' | 'confirm' | 'message' | 'modal' -/** - * 窗口状态 - */ -export type ModalStatus = 'info' | 'success' | 'warning' | 'question' | 'error' | 'loading' - -export type ModalPosition = { - top?: number - left?: number -} - -/** - * 窗口事件类型 - */ -export type ModalEventTypes = 'model' | 'mask' | 'close' | 'confirm' | 'cancel' | 'exit' | 'exist' - -export namespace VxeModalPropTypes { - export type Size = SizeType - export type ModelValue = boolean - export type ID = string | null - export type Type = ModalType - export type Loading = boolean - export type Status = ModalStatus - export type IconStatus = string - export type ClassName = string - export type Top = number | string - export type Position = 'center' | ModalPosition - export type Title = string | number - export type Duration = number | string - export type Content = number | string | null - /** - * 请使用 content - * @deprecated - */ - export type Message = Content - export type ShowCancelButton = boolean | null - export type CancelButtonText = string - export type ShowConfirmButton = boolean | null - export type ConfirmButtonText = string - export type LockView = boolean - export type LockScroll = boolean - export type Mask = boolean - export type MaskClosable = boolean - export type EscClosable = boolean - export type Resize = boolean - export type ShowHeader = boolean - export type ShowFooter = boolean - export type ShowZoom = boolean - export type ShowClose = boolean - export type DblclickZoom = boolean - export type Width = number | string - export type Height = number | string - export type MinWidth = number | string - export type MinHeight = number | string - export type ZIndex = number - export type MarginSize = number | string - export type Fullscreen = boolean - export type Draggable = boolean - export type Remember = boolean - export type DestroyOnClose = boolean - export type ShowTitleOverflow = boolean - export type Transfer = boolean - export type Storage = boolean - export type StorageKey = string - export type Animat = boolean - export type BeforeHideMethod = (params: ModalVisibleParams) => Promise - export type Slots = ModalSlots -} - -export type VxeModalProps = { - size?: VxeModalPropTypes.Size - modelValue?: VxeModalPropTypes.ModelValue - id?: VxeModalPropTypes.ID - type?: VxeModalPropTypes.Type - loading?: VxeModalPropTypes.Loading - status?: VxeModalPropTypes.Status - iconStatus?: VxeModalPropTypes.IconStatus - className?: VxeModalPropTypes.ClassName - top?: VxeModalPropTypes.Top - position?: VxeModalPropTypes.Position - title?: VxeModalPropTypes.Title - duration?: VxeModalPropTypes.Duration - content?: VxeModalPropTypes.Content - showCancelButton?: VxeModalPropTypes.ShowCancelButton - cancelButtonText?: VxeModalPropTypes.CancelButtonText - showConfirmButton?: VxeModalPropTypes.ShowConfirmButton - confirmButtonText?: VxeModalPropTypes.ConfirmButtonText - lockView?: VxeModalPropTypes.LockView - lockScroll?: VxeModalPropTypes.LockScroll - mask?: VxeModalPropTypes.Mask - maskClosable?: VxeModalPropTypes.MaskClosable - escClosable?: VxeModalPropTypes.EscClosable - resize?: VxeModalPropTypes.Resize - showHeader?: VxeModalPropTypes.ShowHeader - showFooter?: VxeModalPropTypes.ShowFooter - showZoom?: VxeModalPropTypes.ShowZoom - showClose?: VxeModalPropTypes.ShowClose - dblclickZoom?: VxeModalPropTypes.DblclickZoom - draggable?: VxeModalPropTypes.Draggable - width?: VxeModalPropTypes.Width - height?: VxeModalPropTypes.Height - minWidth?: VxeModalPropTypes.MinWidth - minHeight?: VxeModalPropTypes.MinHeight - zIndex?: VxeModalPropTypes.ZIndex - marginSize?: VxeModalPropTypes.MarginSize - fullscreen?: VxeModalPropTypes.Fullscreen - remember?: VxeModalPropTypes.Remember - destroyOnClose?: VxeModalPropTypes.DestroyOnClose - showTitleOverflow?: VxeModalPropTypes.ShowTitleOverflow - transfer?: VxeModalPropTypes.Transfer - storage?: VxeModalPropTypes.Storage - storageKey?: VxeModalPropTypes.StorageKey - animat?: VxeModalPropTypes.Animat - beforeHideMethod?: VxeModalPropTypes.BeforeHideMethod - slots?: VxeModalPropTypes.Slots - /** - * @deprecated 已废弃，请使用 content - */ - message?: VxeModalPropTypes.Content -} - -export type ModalSlots = { - /** - * 自定义窗口内容模板 - */ - default?(params: ModalDefaultSlotParams): SlotVNodeType[] | SlotVNodeType - /** - * 自定义窗口头部的模板 - */ - header?(params: ModalHeaderSlotParams): SlotVNodeType[] | SlotVNodeType - /** - * 自定义窗口标题的模板（如果使用了 header 插槽，则该插槽无效） - */ - title?(params: ModalTitleSlotParams): SlotVNodeType[] | SlotVNodeType - /** - * 自定义窗口右上角的模板 - */ - corner?(params: ModalTitleSlotParams): SlotVNodeType[] | SlotVNodeType - /** - * 自定义窗口底部的模板 - */ - footer?(params: ModalFooterSlotParams): SlotVNodeType[] | SlotVNodeType -} - -export type VxeModalEmits = [ - 'update:modelValue', - 'show', - 'hide', - 'before-hide', - 'close', - 'confirm', - 'cancel', - 'zoom', - 'resize', - 'move' -] - -/** - * 全局窗口控制器 - */ -export interface ModalController { - /** - * 创建窗口 - * @param options 参数 - */ - open(options: VxeModalDefines.ModalOptions): Promise - /** - * 创建提示框 - * @param content 消息内容 - * @param title 标题 - * @param options 参数 - */ - alert(content: VxeModalPropTypes.Content, title?: VxeModalPropTypes.Title, options?: VxeModalDefines.ModalOptions): Promise - /** - * 创建提示框 - * @param options 参数 - */ - alert(options: VxeModalDefines.ModalOptions): Promise - /** - * 创建确认框 - * @param content 消息内容 - * @param title 标题 - * @param options 参数 - */ - confirm(content: VxeModalPropTypes.Content, title?: VxeModalPropTypes.Title, options?: VxeModalDefines.ModalOptions): Promise - /** - * 创建确认框 - * @param options 参数 - */ - confirm(options: VxeModalDefines.ModalOptions): Promise - /** - * 创建消息提示 - * @param content 消息内容 - * @param title 标题 - * @param options 参数 - */ - message(content: VxeModalPropTypes.Content, options?: VxeModalDefines.ModalOptions): Promise - /** - * 创建消息提示 - * @param options 参数 - */ - message(options: VxeModalDefines.ModalOptions): Promise - /** - * 获取动态的活动窗口 - * @param id 窗口唯一标识 - */ - get(id: string): VxeModalConstructor & VxeModalMethods - /** - * 关闭动态的活动窗口，如果为空则关闭所有 - * @param id 窗口唯一标识 - */ - close(id?: VxeModalPropTypes.ID): Promise -} - -export interface ModalDefaultSlotParams { - $modal: VxeModalConstructor & VxeModalMethods -} - -export interface ModalHeaderSlotParams extends ModalDefaultSlotParams { } -export interface ModalTitleSlotParams extends ModalDefaultSlotParams { } -export interface ModalFooterSlotParams extends ModalDefaultSlotParams { } - -interface ModalVisibleParams { - type: ModalEventTypes -} - -export namespace VxeModalDefines { - export interface ModalOptions extends VxeModalProps, VxeModalEventProps { - key?: string | number - } - - interface ModalEventParams extends VxeEvent { - $modal: VxeModalConstructor & VxeModalMethods - } - - interface ModalBaseParams extends ModalVisibleParams { } - - export interface ShowParams extends ModalBaseParams { } - export interface ShowEventParams extends ModalEventParams, ShowParams { } - - export interface HideParams extends ModalBaseParams { } - export interface HideEventParams extends ModalEventParams, HideParams { } - - export interface BeforeHideParams extends ModalBaseParams { } - export interface BeforeHideEventParams extends ModalEventParams, BeforeHideParams { } - - export interface ConfirmParams extends ModalBaseParams { } - export interface ConfirmEventParams extends ModalEventParams, ConfirmParams { } - - export interface CancelParams extends ModalBaseParams { } - export interface CancelEventParams extends ModalEventParams, CancelParams { } - - export interface CloseParams extends ModalBaseParams { } - export interface CloseEventParams extends ModalEventParams, CloseParams { } - - export interface ZoomParams extends ModalBaseParams { } - export interface ZoomEventParams extends ModalEventParams, ZoomParams { } - - export interface ResizeParams extends ModalBaseParams { } - export interface ResizeEventParams extends ModalEventParams, ResizeParams { } - - export interface MoveParams extends ModalBaseParams { } - export interface MoveEventParams extends ModalEventParams, MoveParams { } -} - -export type VxeModalEventProps = { - onShow?: VxeModalEvents.Show - onHide?: VxeModalEvents.Hide - onBeforeHide?: VxeModalEvents.BeforeHide - onConfirm?: VxeModalEvents.Confirm - onCancel?: VxeModalEvents.Cancel - onClose?: VxeModalEvents.Close - onZoom?: VxeModalEvents.Zoom - onResize?: VxeModalEvents.Resize - onMove?: VxeModalEvents.Move -} - -export interface VxeModalListeners { - show?: VxeModalEvents.Show - hide?: VxeModalEvents.Hide - beforeHide?: VxeModalEvents.BeforeHide - confirm?: VxeModalEvents.Confirm - cancel?: VxeModalEvents.Cancel - close?: VxeModalEvents.Close - zoom?: VxeModalEvents.Zoom - resize?: VxeModalEvents.Resize - move?: VxeModalEvents.Move -} - -export namespace VxeModalEvents { - export type Show = (params: VxeModalDefines.ShowEventParams) => void - export type Hide = (params: VxeModalDefines.HideEventParams) => void - export type BeforeHide = (params: VxeModalDefines.BeforeHideEventParams) => void - export type Confirm = (params: VxeModalDefines.ConfirmEventParams) => void - export type Cancel = (params: VxeModalDefines.CancelEventParams) => void - export type Close = (params: VxeModalDefines.CloseEventParams) => void - export type Zoom = (params: VxeModalDefines.ZoomEventParams) => void - export type Resize = (params: VxeModalDefines.ResizeEventParams) => void - export type Move = (params: VxeModalDefines.MoveEventParams) => void -} - -export interface VxeModalSlots { - /** - * 自定义窗口内容模板 - */ - default: (params: ModalDefaultSlotParams) => any - /** - * 自定义窗口头部的模板 - */ - header: (params: ModalHeaderSlotParams) => any - /** - * 自定义窗口标题的模板（如果使用了 header 插槽，则该插槽无效） - */ - title: (params: ModalTitleSlotParams) => any - /** - * 自定义窗口右上角的模板 - */ - corner: (params: ModalTitleSlotParams) => any - /** - * 自定义窗口底部的模板 - */ - footer: (params: ModalFooterSlotParams) => any -} diff --git a/types/module/custom.d.ts b/types/module/custom.d.ts deleted file mode 100644 index 24ee0560f0..0000000000 --- a/types/module/custom.d.ts +++ /dev/null @@ -1,45 +0,0 @@ -import { VXEComponent } from '../component' -import { VxeTableDefines, VxeTableDataRow } from '../table' -import { VxeColumnPropTypes } from '../column' - -/* eslint-disable no-use-before-define */ - -/** - * 表格模块 - 自定义列 - */ -export const VxeTableCustomModule: VXEComponent<{ [key: string]: any }> -/** - * 表格模块 - 自定义列 - */ -export const Custom: VXEComponent<{ [key: string]: any }> - -export interface VxeCustomPanel { -} - -export interface TableCustomMethods { - /** - * 打开自定义面板 - */ - openCustom(): Promise - /** - * 处理自定义面板 - */ - closeCustom(): Promise -} - -export interface TableCustomPrivateMethods { - checkCustomStatus(): void - emitCustomEvent(type: string, evnt: Event): void - triggerCustomEvent(evnt: MouseEvent): void - customOpenEvent (evnt: Event): void - customColseEvent (evnt: Event): void -} - -declare module '../grid' { - export interface VxeGridMethods extends TableCustomMethods { } -} - -declare module '../table' { - export interface VxeTableMethods extends TableCustomMethods { } - export interface VxeTablePrivateMethods extends TableCustomPrivateMethods { } -} diff --git a/types/module/edit.d.ts b/types/module/edit.d.ts deleted file mode 100644 index e7cd9af347..0000000000 --- a/types/module/edit.d.ts +++ /dev/null @@ -1,176 +0,0 @@ -import { VXEComponent } from '../component' -import { VxeTableDataRow, VxeTableDefines } from '../table' - -/* eslint-disable no-use-before-define */ - -/** - * 表格模块 - 可编辑 - */ -export const VxeTableEditModule: VXEComponent<{ [key: string]: any }> -/** - * 表格模块 - 可编辑 - */ -export const Edit: VXEComponent<{ [key: string]: any }> - -export interface TableEditMethods { - /** - * 往表格插入临时数据，从第一行新增一行或多行新数据 - * @param records 新数据 - */ - insert(records: any): Promise<{ row: D, rows: D[] }> - /** - * 往表格指定行中插入临时数据 - * 如果 row 为空则从插入到顶部，如果为树结构，则插入到目标节点顶部 - * 如果 row 为 -1 则从插入到底部，如果为树结构，则插入到目标节点底部 - * 如果 row 为有效行则插入到该行的位置，如果为树结构，则有插入到效的目标节点该行的位置 - * @param {Object/Array} records 新的数据 - * @param {Row} row 指定行 - */ - insertAt(records: any, row: any | -1 | null): Promise<{ row: D, rows: D[] }> - /** - * 往表格在指定行中的下一行插入临时数据 - * 如果 row 为空则从插入到顶部，如果为树结构，则插入到目标节点顶部 - * 如果 row 为 -1 则从插入到底部，如果为树结构，则插入到目标节点底部 - * 如果 row 为有效行则插入到该行的下一行位置，如果为树结构，则有插入到效的目标节点该行的下一行位置 - * @param records records 新的数据 - * @param row row 指定行 - */ - insertNextAt(records: any, row: any | -1 | null): Promise<{ row: D, rows: D[] }> - /** - * 删除指定行数据，指定 row 或 [row, ...] 删除多条数据，如果为空则删除所有数据 - * @param rows 指定行 - */ - remove(rows?: any | any[]): Promise<{ row: D, rows: D[] }> - /** - * 删除复选框选中的行数据 - */ - removeCheckboxRow(): Promise<{ row: D, rows: D[] }> - /** - * 删除单选框选中的行数据 - */ - removeRadioRow(): Promise<{ row: D, rows: D[] }> - /** - * 删除当前行选中的行数据 - */ - removeCurrentRow(): Promise<{ row: D, rows: D[] }> - /** - * 获取表格数据集 - * 获取新增、删除、更改的数据 - */ - getRecordset(): { - insertRecords: D[] - removeRecords: D[] - updateRecords: D[] - pendingRecords: D[] - } - /** - * 用于 edit-config，获取新增的临时数据 - */ - getInsertRecords(): D[] - /** - * 获取已删除的数据 - */ - getRemoveRecords(): D[] - /** - * 用于 edit-config，获取已修改的数据 - */ - getUpdateRecords(): D[] - /** - * 请使用 getEditRecord - * @deprecated - */ - getActiveRecord(): { - row: D - rowIndex: number - $rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - cell: HTMLElement - } - /** - * 用于 edit-config，获取已激活的行数据 - */ - getEditRecord(): { - row: D - rowIndex: number - $rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - cell: HTMLElement - } - /** - * 用于 mouse-config.selected，获取选中的单元格信息 - */ - getSelectedCell(): { - row: D - column: VxeTableDefines.ColumnInfo - } - /** - * 请使用 clearEdit() - * @deprecated - */ - clearActived(evnt?: Event): Promise - /** - * 手动清除单元格激活状态 - */ - clearEdit(evnt?: Event): Promise - /** - * 手动清除单元格选中状态 - */ - clearSelected(): Promise - /** - * 请使用 isEditByRow - * @deprecated - */ - isActiveByRow(row: any): boolean - /** - * 用于 edit-config，判断行是否为激活编辑状态 - * @param row 指定行 - */ - isEditByRow(row: any): boolean - /** - * 请使用 setEditRow - * @deprecated - */ - setActiveRow(row: any): Promise - /** - * 用于 edit-config，激活行编辑并默认激活第一个列，也可以指定列 - * @param row 指定行 - */ - setEditRow(row: any, fieldOrColumn?: string | VxeTableDefines.ColumnInfo): Promise - /** - * 请使用 setEditCell - * @deprecated - */ - setActiveCell(row: any, fieldOrColumn: string | VxeTableDefines.ColumnInfo): Promise - /** - * 用于 edit-config，激活单元格编辑 - * @param row 指定行 - * @param field 字段名 - */ - setEditCell(row: any, fieldOrColumn: string | VxeTableDefines.ColumnInfo): Promise - /** - * 用于 mouse-config.mouse-config，选中某个单元格 - * @param row 指定行 - * @param field 字段名 - */ - setSelectCell(row: any, fieldOrColumn: string | VxeTableDefines.ColumnInfo): Promise -} - -export interface TableEditPrivateMethods { - handleActived(params: any, evnt?: any): Promise - handleFocus(params: any, evnt?: any): void - handleSelected(params: any, evnt: any): Promise - addCellSelectedClass(): void -} - -declare module '../grid' { - export interface VxeGridMethods extends TableEditMethods { } -} - -declare module '../table' { - export interface VxeTableMethods extends TableEditMethods { } - export interface VxeTablePrivateMethods extends TableEditPrivateMethods { } -} diff --git a/types/module/export.d.ts b/types/module/export.d.ts deleted file mode 100644 index bb830639fe..0000000000 --- a/types/module/export.d.ts +++ /dev/null @@ -1,328 +0,0 @@ -import { VXEComponent } from '../component' -import { VxeTablePropTypes, VxeTableConstructor, VxeTableDataRow } from '../table' -import { VxeGridConstructor } from '../grid' - -/* eslint-disable no-use-before-define */ - -/** - * 表格模块 - 导出、导入、打印 - */ -export const VxeTableExportModule: VXEComponent<{ [key: string]: any }> -/** - * 表格模块 - 导出、导入、打印 - */ -export const Export: VXEComponent<{ [key: string]: any }> - -export interface TableExportMethods { - /** - * 打开高级导出 - * @param options 参数 - */ - openExport(options?: VxeTablePropTypes.ExportConfig): void - /** - * 将表格数据导出 - * @param options 参数 - */ - exportData(options?: VxeTablePropTypes.ExportConfig): Promise - /** - * 打开高级导入 - * @param options 参数 - */ - openImport(options?: VxeTablePropTypes.ImportConfig): void - /** - * 将数据导入表格 - * @param options 参数 - */ - importData(options?: VxeTablePropTypes.ImportConfig): Promise - /** - * 将一个文件的数据导入表格 - * @param file 文件流 - * @param options 参数 - */ - importByFile(file: File, options: VxeTablePropTypes.ImportConfig): Promise - /** - * 保存文件到本地 - * @param options - */ - saveFile: SaveFileFunction - /** - * 读取本地文件 - * @param options 参数 - */ - readFile: ReadFileFunction - /** - * 打印表格数据 - * @param options 参数 - */ - print: PrintFunction - /** - * 打开高级打印 - * @param options 参数 - */ - openPrint(options?: VxeTablePropTypes.PrintConfig): void -} - -export interface TableExportPrivateMethods { } - -declare module '../grid' { - export interface VxeGridMethods extends TableExportMethods { } -} - -declare module '../table' { - export interface VxeTableMethods extends TableExportMethods { } - export interface VxeTablePrivateMethods extends TableExportPrivateMethods { } - export namespace VxeTableDefines { - export interface ExtortSheetMethodParams { - $table: VxeTableConstructor - $grid?: VxeGridConstructor - options: VxeTablePropTypes.ExportHandleOptions - datas: any[] - columns: VxeTableDefines.ColumnInfo[] - colgroups: VxeTableDefines.ColumnInfo[][] - } - } - export namespace VxeTablePropTypes { - /** - * 导入参数 - */ - export interface ImportConfig { - /** - * 可选文件类型列表 - */ - types?: string[] - /** - * 导入数据的方式 - */ - mode?: string - modes?: string[] - /** - * 是否显示内置的消息提示 - */ - message?: boolean - /** - * 是否服务端导出 - */ - remote?: boolean - encoding?: string - /** - * 只对 remote=true 有效，用于自定义导入逻辑 - */ - importMethod?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor - file: File - options: ImportHandleOptions - }): Promise - beforeImportMethod?(params: { - $table: VxeTableConstructor - options: any - }): void - afterImportMethod?(params: { - $table: VxeTableConstructor - options: any - status: boolean - }): void - } - export interface ImportOpts extends ImportConfig { - modes: string[] - } - export interface ImportHandleOptions extends ImportConfig { - data: any[] - columns: VxeTableDefines.ColumnInfo[] - colgroups: VxeTableDefines.ColumnInfo[][] - } - - export interface ExportOrPrintColumnOption { - colid?: number - type?: string - field?: string - } - - /** - * 导出参数 - */ - export interface ExportConfig { - /** - * 文件名 - */ - filename?: string - /** - * 表名 - */ - sheetName?: string - /** - * 文件类型 - */ - type?: string - /** - * 可选文件类型列表 - */ - types?: string[] - /** - * 输出数据的方式 - */ - mode?: string - /** - * 输出数据的方式列表 - */ - modes?: string[] - /** - * 是否为源数据 - */ - original?: boolean - /** - * 是否显示内置的消息提示 - */ - message?: boolean - /** - * 是否需要表头 - */ - isHeader?: boolean - /** - * 是否需要表尾 - */ - isFooter?: boolean - isMerge?: boolean - isColgroup?: boolean - /** - * 是否马上下载，如果设置为 false 则通过返回结果为内容的 Promise - */ - download?: boolean - /** - * 自定义数据 - */ - data?: any[] - /** - * 自定义列 - */ - columns?: VxeTableDefines.ColumnInfo[] | ExportOrPrintColumnOption[] - /** - * 列过滤方法 - */ - columnFilterMethod?(params: { column: VxeTableDefines.ColumnInfo, $columnIndex: number }): boolean - /** - * 数据过滤方法 - */ - dataFilterMethod?(params: { row: any, $rowIndex: number }): boolean - /** - * 表尾过滤方法 - */ - footerFilterMethod?(params: { items: any[], $rowIndex: number }): boolean - /** - * 是否服务端导出 - */ - remote?: boolean - /** - * 只对 remote=html,xlsx 有效，是否使用样式 - */ - useStyle?: boolean - sheetMethod?(params: VxeTableDefines.ExtortSheetMethodParams): void - /** - * 只对 remote=true 有效，用于自定义导出逻辑 - */ - exportMethod?(params: { - $table: VxeTableConstructor - $grid?: VxeGridConstructor - options: ExportHandleOptions - }): Promise - beforeExportMethod?(params: { - options: ExportHandleOptions - }): void - afterExportMethod?(params: { - options: ExportHandleOptions - }): void - } - export interface ExportOpts extends ExportConfig { } - export interface ExportHandleOptions extends ExportConfig { - data: any[] - columns: VxeTableDefines.ColumnInfo[] - colgroups: VxeTableDefines.ColumnInfo[][] - } - - /** - * 打印参数 - */ - export interface PrintConfig { - /** - * 表名 - */ - sheetName?: string - /** - * 输出数据的方式 - */ - mode?: string - /** - * 输出数据的方式列表 - */ - modes?: string[] - /** - * 是否为源数据 - */ - original?: boolean - /** - * 是否需要表头 - */ - isHeader?: boolean - /** - * 是否需要表尾 - */ - isFooter?: boolean - /** - * 自定义数据 - */ - data?: any[] - /** - * 自定义列 - */ - columns?: VxeTableDefines.ColumnInfo[] | ExportOrPrintColumnOption[] - /** - * 打印样式 - */ - style?: string - /** - * 自定义打印内容 - */ - content?: string - /** - * 列过滤方法 - */ - columnFilterMethod?(params: { column: VxeTableDefines.ColumnInfo, $columnIndex: number }): boolean - /** - * 数据过滤方法 - */ - dataFilterMethod?(params: { row: any, $rowIndex: number }): boolean - /** - * 表尾过滤方法 - */ - footerFilterMethod?(params: { items: any[], $rowIndex: number }): boolean - /** - * 打印之前的方法，可以通过返回自定义打印的内容 - */ - beforePrintMethod?(params: { - $table: VxeTableConstructor | null - content: string - options: PrintHandleOptions - }): string - } - export interface PrintOpts extends PrintConfig { } - export interface PrintHandleOptions extends PrintConfig { } - } -} - -export type SaveFileFunction = (options: { - filename: string - type: string - content: string | Blob -}) => Promise - -export type ReadFileFunction = (options?: { - multiple?: boolean - types?: string[] - message?: boolean -}) => Promise<{ - status: boolean - files: FileList - file: File -}> - -export type PrintFunction = (options?: VxeTablePropTypes.PrintConfig) => any diff --git a/types/module/filter.d.ts b/types/module/filter.d.ts deleted file mode 100644 index 7c6a810003..0000000000 --- a/types/module/filter.d.ts +++ /dev/null @@ -1,89 +0,0 @@ -import { VXEComponent } from '../component' -import { VxeTableDefines, VxeTableDataRow } from '../table' -import { VxeColumnPropTypes } from '../column' - -/* eslint-disable no-use-before-define */ - -/** - * 表格模块 - 筛选 - */ -export const VxeTableFilterModule: VXEComponent<{ [key: string]: any }> -/** - * 表格模块 - 筛选 - */ -export const Filter: VXEComponent<{ [key: string]: any }> - -export interface VxeFilterPanel { - /** - * 筛选所有发生改变 - * @param evnt 事件 - * @param checked 是否选中 - */ - changeAllOption(evnt: Event | null, checked: boolean): void - /** - * 筛选选项发生改变 - * @param evnt 事件 - * @param checked 是否选中 - * @param option 选项对象 - */ - changeOption(evnt: Event | null, checked: boolean, option: VxeTableDefines.FilterOption): void - /** - * 确认筛选 - */ - confirmFilter(evnt?: Event): void - /** - * 重置筛选 - */ - resetFilter(evnt?: Event): void -} - -export interface TableFilterMethods { - /** - * 手动弹出筛选 - * @param fieldOrColumn - */ - openFilter(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo):Promise - /** - * 用于 filters，修改筛选列表 - * 在筛选条件更新之后可以调用 updateData 函数处理表格数据 - * @param columnOrField 列对象或字段名 - * @param options 选项列表 - */ - setFilter(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo, options: VxeColumnPropTypes.Filter[]): Promise - /** - * 手动清空筛选条件 - * 如果不传 column 则清空所有筛选条件，数据会恢复成未筛选的状态 - * @param column 字段名 - */ - clearFilter(column?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo | null): Promise - /** - * 获取当前筛选的所有列信息 - */ - getCheckedFilters(): VxeTableDefines.FilterCheckedParams[] -} - -export interface TableFilterPrivateMethods { - checkFilterOptions(): void - handleClearFilter(column: any): void - triggerFilterEvent(evnt: any, column: any, params: any): void - confirmFilterEvent(evnt: Event): void -} - -declare module '../grid' { - export interface VxeGridMethods extends TableFilterMethods { } -} - -declare module '../table' { - export interface VxeTableMethods extends TableFilterMethods { } - export interface VxeTablePrivateMethods extends TableFilterPrivateMethods { } - export namespace VxeTableDefines { - export interface FilterOption { - label: string | number - value: any - data: any - resetValue: any - checked: boolean - _checked: boolean - } - } -} diff --git a/types/module/index.d.ts b/types/module/index.d.ts deleted file mode 100644 index 0d342f5dd6..0000000000 --- a/types/module/index.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -export * from './filter' -export * from './menu' -export * from './edit' -export * from './export' -export * from './keyboard' -export * from './validator' -export * from './custom' diff --git a/types/module/keyboard.d.ts b/types/module/keyboard.d.ts deleted file mode 100644 index d629fd7902..0000000000 --- a/types/module/keyboard.d.ts +++ /dev/null @@ -1,32 +0,0 @@ -import { VXEComponent } from '../component' -import { VxeTableDataRow } from '../table' - -/* eslint-disable no-use-before-define */ - -/** - * 表格模块 - 键盘导航 - */ -export const VxeTableKeyboardModule: VXEComponent<{ [key: string]: any }> -/** - * 表格模块 - 键盘导航 - */ -export const Keyboard: VXEComponent<{ [key: string]: any }> - -export interface TableKeyboardMethods {} - -export interface TableKeyboardPrivateMethods { - moveTabSelected(args: any, isLeft: any, evnt: any): void - moveCurrentRow(isUpArrow: any, isDwArrow: any, evnt: any): void - moveSelected(args: any, isLeftArrow: any, isUpArrow: any, isRightArrow: any, isDwArrow: any, evnt: any): void - triggerHeaderCellMousedownEvent(evnt: any, params: any): void - triggerCellMousedownEvent(evnt: any, params: any): void - } - -declare module '../grid' { - export interface VxeGridMethods extends TableKeyboardMethods { } -} - -declare module '../table' { - export interface VxeTableMethods extends TableKeyboardMethods { } - export interface VxeTablePrivateMethods extends TableKeyboardPrivateMethods { } -} diff --git a/types/module/menu.d.ts b/types/module/menu.d.ts deleted file mode 100644 index 4c94bf6dae..0000000000 --- a/types/module/menu.d.ts +++ /dev/null @@ -1,87 +0,0 @@ -import { RenderFunction, SetupContext, Ref, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase } from '../component' -import { VxeTableDataRow } from '../table' - -/* eslint-disable no-use-before-define */ - -/** - * 表格模块 - 快捷菜单 - */ -export const VxeTableMenuModule: VXEComponent<{ [key: string]: any }> -/** - * 表格模块 - 快捷菜单 - */ -export const Menu: VXEComponent<{ [key: string]: any }> - -export type VxeTableMenuPanelInstance = ComponentPublicInstance - -export interface VxeTableMenuPanelConstructor extends VxeComponentBase, VxeTableMenuPanelMethods { - props: VxeTableMenuPanelProps - context: SetupContext - getRefMaps(): MenuPanelPrivateRef - renderVN: RenderFunction -} - -export interface MenuPanelPrivateRef { - refElem: Ref -} -export interface VxeTableMenuPanelPrivateRef extends MenuPanelPrivateRef { } - -export interface VxeTableMenuPanelMethods { } - -export type VxeTableMenuPanelProps = { - [key: string]: any -} - -export interface TableMenuMethods { - /** - * 手动关闭快捷菜单 - */ - closeMenu(): Promise -} - -export interface TableMenuPrivateMethods { - moveCtxMenu(evnt: any, ctxMenuStore: any, property: any, hasOper: boolean, operRest: any, menuList: any): void - handleOpenMenuEvent(evnt: Event, type: 'header' | 'body' | 'footer', params: any): void - handleGlobalContextmenuEvent(evnt: any): void - ctxMenuMouseoverEvent(evnt: any, item: any, child?: any): void - ctxMenuMouseoutEvent(evnt: any, item: any): void - ctxMenuLinkEvent(evnt: any, menu: any): void -} - -declare module '../grid' { - export interface VxeGridMethods extends TableMenuMethods { } -} - -declare module '../table' { - export interface VxeTableMethods extends TableMenuMethods { } - export interface VxeTablePrivateMethods extends TableMenuPrivateMethods { } - export namespace VxeTableDefines { - export interface MenuOptions { - disabled?: boolean - options?: MenuFirstOption[][] - } - export interface MenuFirstOption { - code?: string - name?: string - prefixIcon?: string - suffixIcon?: string - className?: string - visible?: boolean - disabled?: boolean - children?: MenuChildOption[] - params?: any - [key: string]: any - } - export interface MenuChildOption { - code?: string - name?: string - prefixIcon?: string - className?: string - visible?: boolean - disabled?: boolean - params?: any - [key: string]: any - } - } -} diff --git a/types/module/validator.d.ts b/types/module/validator.d.ts deleted file mode 100644 index 89f1d07b00..0000000000 --- a/types/module/validator.d.ts +++ /dev/null @@ -1,114 +0,0 @@ -import { VXEComponent } from '../component' -import { VxeTableDefines, VxeTableDataRow, VxeTableConstructor } from '../table' -import { VxeGridConstructor } from '../grid' -import { VxeColumnPropTypes } from '../column' - -/* eslint-disable no-use-before-define */ - -/** - * 表格模块 - 校验模块 - */ -export const VxeTableValidatorModule: VXEComponent<{ [key: string]: any }> -/** - * 表格模块 - 校验模块 - */ -export const Validator: VXEComponent<{ [key: string]: any }> - -export interface TableValidatorMethods { - /** - * 手动清除校验 - */ - clearValidate(rows?: any, fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo | VxeColumnPropTypes.Field[] | VxeTableDefines.ColumnInfo[]): Promise - /** - * 完整校验，默认校验当前表格数据，和 validate 的区别就是默认校验当前表格数据并且给有效数据中的每一行进行校验 - * @param rows 指定行 - */ - fullValidate(rows?: boolean | object | any[] | ((errMap: VxeTableDefines.ValidatorErrorMapParams) => void), callback?: (errMap: VxeTableDefines.ValidatorErrorMapParams) => void): Promise> - /** - * 快速校验，如果存在记录不通过的记录，则返回不再继续校验（异步校验除外）； - * 如果第一个参数为 true 则校验当前表格数据，如果指定 row 或 rows 则校验指定一行或多行，如果不指定数据，则默认只校验临时变动的数据，例如新增或修改。该回调函数会在校验结束后被调用 callback(errMap)。若不传入回调函数，则会返回一个 promise - * @param rows 指定行 - */ - validate(rows?: boolean | object | any[] | ((errMap?: VxeTableDefines.ValidatorErrorMapParams) => void), callback?: (errMap?: VxeTableDefines.ValidatorErrorMapParams) => void): Promise> -} - -export interface TableValidatorPrivateMethods { - validCellRules(type: any, row: any, column: VxeTableDefines.ColumnInfo, val?: any): Promise - hasCellRules(type: any, row: any, column: VxeTableDefines.ColumnInfo): boolean - triggerValidate(type: any): Promise - showValidTooltip(params: any): void -} - -declare module '../grid' { - export interface VxeGridMethods extends TableValidatorMethods { } -} - -declare module '../table' { - export interface VxeTableMethods extends TableValidatorMethods { } - export interface VxeTablePrivateMethods extends TableValidatorPrivateMethods { } - export namespace VxeTableDefines { - export interface ValidatorRule { - /** - * 是否必填 - */ - required?: boolean - /** - * 最小长度/值 - */ - min?: number | string - /** - * 最大长度/值 - */ - max?: number | string - /** - * 数据类型 - */ - type?: 'number' | 'string' | 'array' | '' | null - /** - * 使用正则表达式校验 - */ - pattern?: string | RegExp - /** - * 使用自定义校验函数，接收一个 Promise - * @param params 参数 - */ - validator?: string | ((params: RuleValidatorParams) => void | Error | Promise) - /** - * 提示消息 - */ - content?: string - trigger?: 'blur' | 'change' | 'manual' | '' | null - maxWidth?: number - /** - * @deprecated 已废弃，请使用 content - */ - message?: string - } - export interface RuleValidatorParams { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null - cellValue: any - rule: ValidatorRule - rules: ValidatorRule[] - column: VxeTableDefines.ColumnInfo - columnIndex: number - row: D - rowIndex: number - field: string - } - export interface ValidatorErrorParams { - $table: VxeTableConstructor - cellValue: any - rule: ValidatorRule - rules: ValidatorRule[] - column: VxeTableDefines.ColumnInfo - columnIndex: number - row: D - rowIndex: number - field: string - } - export interface ValidatorErrorMapParams { - [key: string]: VxeTableDefines.ValidatorErrorParams[] - } - } -} diff --git a/types/optgroup.d.ts b/types/optgroup.d.ts deleted file mode 100644 index a3a5951921..0000000000 --- a/types/optgroup.d.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { VXEComponent } from './component' -import { VxeOptionPropTypes } from './option' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 下拉框选项分组 - * @example import { VxeOptgroup } from 'vxe-table' - */ -export const VxeOptgroup: VXEComponent -/** - * 组件 - 下拉框选项分组 - */ -export const Optgroup: typeof VxeOptgroup - -export type VxeOptgroupProps = { - /** - * 显示内容 - */ - label?: VxeOptionPropTypes.Label - /** - * 是否禁用 - */ - visible?: VxeOptionPropTypes.Visible - className?: VxeOptionPropTypes.ClassName - /** - * 是否禁用 - */ - disabled?: VxeOptionPropTypes.Disabled -} - -export interface VxeOptgroupSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/option.d.ts b/types/option.d.ts deleted file mode 100644 index e629b0a7f2..0000000000 --- a/types/option.d.ts +++ /dev/null @@ -1,68 +0,0 @@ -import { VXEComponent, SlotVNodeType } from './component' -import { VxeSelectConstructor } from './select' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 下拉框选项 - * @example import { VxeOption } from 'vxe-table' - */ -export const VxeOption: VXEComponent -/** - * 组件 - 下拉框选项 - */ -export const Option: typeof VxeOption - -export type VxeOptionProps = { - /** - * 绑定值 - */ - value?: VxeOptionPropTypes.Value - /** - * 显示内容 - */ - label?: VxeOptionPropTypes.Label - /** - * 是否显示 - */ - visible?: VxeOptionPropTypes.Visible - className?: VxeOptionPropTypes.ClassName - /** - * 是否禁用 - */ - disabled?: VxeOptionPropTypes.Disabled - slots?: { - default?: string | ((params: { - option: any - $select: VxeSelectConstructor - }) => SlotVNodeType | SlotVNodeType[]) | null - } - - [key: string]: any -} - -export namespace VxeOptionPropTypes { - export type Value = any - export type Label = string | number | boolean - export type Visible = boolean - export type ClassName = string | ((params: { - option: any - $select: VxeSelectConstructor - }) => string) - export type Disabled = boolean - export type Slots = { - default?: string | ((params: { - option: any - $select: VxeSelectConstructor - }) => SlotVNodeType | SlotVNodeType[]) | null - } -} - -export interface VxeOptionSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/pager.d.ts b/types/pager.d.ts deleted file mode 100644 index dc740d0d65..0000000000 --- a/types/pager.d.ts +++ /dev/null @@ -1,211 +0,0 @@ -import { SetupContext, RenderFunction, Ref, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 分页 - * @example import { VxePager } from 'vxe-table' - */ -export const VxePager: VXEComponent -/** - * 组件 - 分页 - */ -export const Pager: typeof VxePager - -export type VxePagerInstance = ComponentPublicInstance - -export interface VxePagerConstructor extends VxeComponentBase, VxePagerMethods { - props: VxePagerProps - context: SetupContext - getRefMaps(): PagerPrivateRef - renderVN: RenderFunction -} - -export interface PagerPrivateRef { - refElem: Ref -} -export interface VxePagerPrivateRef extends PagerPrivateRef { } - -export interface PagerReactData { - inpCurrPage: string | number -} - -export type VxePagerProps = { - size?: VxePagerPropTypes.Size - /** - * 自定义布局 - */ - layouts?: VxePagerPropTypes.Layouts - /** - * 当前页 - */ - currentPage?: VxePagerPropTypes.CurrentPage - /** - * 加载中 - */ - loading?: VxePagerPropTypes.Loading - /** - * 每页大小 - */ - pageSize?: VxePagerPropTypes.PageSize - /** - * 总条数 - */ - total?: VxePagerPropTypes.Total - /** - * 显示页码按钮的数量 - */ - pagerCount?: VxePagerPropTypes.PagerCount - /** - * 每页大小选项列表 - */ - pageSizes?: VxePagerPropTypes.PageSizes - /** - * 列对其方式 - */ - align?: VxePagerPropTypes.Align - /** - * 带边框 - */ - border?: VxePagerPropTypes.Border - /** - * 带背景颜色 - */ - background?: VxePagerPropTypes.Background - /** - * 配套的样式 - */ - perfect?: VxePagerPropTypes.Perfect - /** - * 当只有一页时隐藏 - */ - autoHidden?: VxePagerPropTypes.AutoHidden - transfer?: VxePagerPropTypes.Transfer - className?: VxePagerPropTypes.ClassName - /** - * 自定义图标 - */ - iconPrevPage?: VxePagerPropTypes.IconPrevPage - iconJumpPrev?: VxePagerPropTypes.IconJumpPrev - iconJumpNext?: VxePagerPropTypes.IconJumpNext - iconNextPage?: VxePagerPropTypes.IconNextPage - iconJumpMore?: VxePagerPropTypes.IconJumpMore - iconHomePage?: VxePagerPropTypes.IconHomePage - iconEndPage?: VxePagerPropTypes.IconEndPage -} - -export namespace VxePagerPropTypes { - export type Size = SizeType - export type Layouts = Array<'Home' | 'PrevJump' | 'PrevPage' | 'Number' | 'JumpNumber' | 'NextPage' | 'NextJump' | 'End' | 'Sizes' | 'Jump' | 'FullJump' | 'PageCount' | 'Total'> - export type CurrentPage = number - export type Loading = boolean - export type PageSize = number - export type Total = number - export type PagerCount = number - export type PageSizes = PageSizeItemType[] - export type Align = string - export type Border = boolean - export type Background = boolean - export type Perfect = boolean - export type AutoHidden = boolean - export type Transfer = boolean - export type ClassName = string | ((params: { - $pager: VxePagerConstructor - }) => string) - export type IconPrevPage = string - export type IconJumpPrev = string - export type IconJumpNext = string - export type IconNextPage = string - export type IconJumpMore = string - export type IconHomePage = string - export type IconEndPage = string -} - -export type PageSizeItemType = number | { - label?: number | string - value?: number | string -} - -export interface PagerMethods { - dispatchEvent(type: ValueOf, params: any, evnt?: Event): void - /** - * 首页 - */ - homePage(): Promise - /** - * 末页 - */ - endPage(): Promise - /** - * 上一页 - */ - prevPage(): Promise - /** - * 下一页 - */ - nextPage(): Promise - /** - * 向上翻页 - */ - prevJump(): Promise - /** - * 向下翻页 - */ - nextJump(): Promise -} -export interface VxePagerMethods extends PagerMethods { } - -export interface PagerPrivateMethods { - handlePrevPage(evnt: Event): void - handleNextPage(evnt: Event): void - handlePrevJump(evnt: Event): void - handleNextJump(evnt: Event): void -} -export interface VxePagerPrivateMethods extends PagerPrivateMethods { } - -export type VxePagerEmits = [ - 'update:pageSize', - 'update:currentPage', - 'page-change' -] - -export namespace VxePagerDefines { - interface PagerEventParams extends VxeEvent { - $pager: VxePagerConstructor - } - - export type PageChangeParams = { - type: 'current' | 'size' - pageSize: number - currentPage: number - } - export interface PageChangeEventParams extends PagerEventParams, PageChangeParams { } -} - -export type VxePagerEventProps = { - onPageChange?: VxePagerEvents.PageChange -} - -export interface VxePagerListeners { - pageChange?: VxePagerEvents.PageChange -} - -export namespace VxePagerEvents { - export type PageChange = (params: VxePagerDefines.PageChangeEventParams) => void -} - -export interface VxePagerSlots { - /** - * 自定义左侧模板 - */ - left: (params: { - [key: string]: any - }) => any - /** - * 自定义右侧模板 - */ - right: (params: { - [key: string]: any - }) => any -} diff --git a/types/plugins/extend-cell-area.d.ts b/types/plugins/extend-cell-area.d.ts deleted file mode 100644 index 9c9fc64ea6..0000000000 --- a/types/plugins/extend-cell-area.d.ts +++ /dev/null @@ -1,601 +0,0 @@ -import { VxeEvent } from '../component' -import { VxeTableDefines, VxeTableConstructor, VxeTablePrivateMethods, VxeTableDataRow } from '../table' -import { VxeGridConstructor } from '../grid' - -/* eslint-disable no-use-before-define */ - -export interface VxeTableProMethods { - /** - * 用于 mouse-config.area，用于获取鼠标选择的区域 - */ - getCellAreas(): VxeTableProDefines.MouseCellArea[] - /** - * 用于 mouse-config.area，用于获取区域中的活动单元格 - */ - getActiveCellArea(): VxeTableProDefines.MouseActiveCellArea | null - /** - * @deprecated - */ - getCopyCellArea(): VxeTableProDefines.MouseCellArea | null - /** - * 用于 mouse-config.area，用于获取标记为复制粘贴的区域 - */ - getCopyCellAreas(): VxeTableProDefines.MouseCellArea[] - /** - * 用于 mouse-config.area，复制指定区域，返回转换后的文本 - */ - copyCellArea(): { text: string, html: string } - /** - * 用于 mouse-config.area，剪贴指定区域，返回转换后的文本 - */ - cutCellArea(): { text: string, html: string } - /** - * 用于 mouse-config.area，粘贴从表格中被复制的数据，如果不是从表格中操作，则无法粘贴 - */ - pasteCellArea(): Promise - /** - * 用于 mouse-config.area，用于清除鼠标选择的区域，可以指定清除的区域 - */ - clearCellAreas(area?: number | VxeTableProDefines.MouseCellArea): Promise - /** - * 用于 mouse-config.area，手动清除标记为复制粘贴的区域 - */ - clearCopyCellArea(): Promise - /** - * 用于 mouse-config.area，选取指定区域的单元格 - * @param areaConfigs 指定区域 - */ - setCellAreas(areaConfigs: VxeTableProDefines.CellAreaConfig[], activeArea?: { - area?: number | VxeTableProDefines.CellAreaConfig - column?: number | VxeTableDefines.ColumnInfo - row?: D | number - }): Promise - /** - * 用于 mouse-config.area，设置活动的区域的单元格 - * @param activeArea - */ - setActiveCellArea(activeArea: VxeTableProDefines.ActiveCellAreaConfig): Promise - /** - * 打开单元格查找窗口 - */ - openFind(): Promise - /** - * 打开单元格替换窗口 - */ - openReplace(): Promise - /** - * 手动打开查找与替换窗口 - */ - openFNR(options: { - type?: 'find' | 'replace' | '' | null - }): Promise - /** - * 手动关闭查找与替换窗口 - */ - closeFNR(): Promise -} -export type VxeProPluginMethods = VxeTableProMethods - -export interface VxeTableProPrivateMethods { - handleKeyboardEvent(evnt: KeyboardEvent): void - handleHeaderCellAreaEvent(evnt: KeyboardEvent, params: VxeTableDefines.HeaderCellClickEventParams): void - handleCellAreaEvent(evnt: MouseEvent, params: VxeTableDefines.CellClickEventParams): void - handleFilterEvent(evnt: Event, params: VxeTableDefines.FilterChangeEventParams): any - handleSortEvent(evnt: Event, params: VxeTableDefines.SortChangeEventParams): any - handleUpdateCellAreas(): any - handleCopyCellAreaEvent(evnt: ClipboardEvent): void - handlePasteCellAreaEvent(evnt: ClipboardEvent): void - handleCutCellAreaEvent(evnt: ClipboardEvent): void - triggerCellExtendMousedownEvent(evnt: MouseEvent, params: any): void - triggerCopyCellAreaEvent(evnt: MouseEvent): void - triggerCutCellAreaEvent(evnt: MouseEvent): void - triggerPasteCellAreaEvent(evnt: MouseEvent): void - triggerFNROpenEvent(evnt: MouseEvent, tab: 'find' | 'replace'): void -} -export type VxeProPluginPrivateMethods = VxeTableProPrivateMethods - -declare module '../table' { - export interface VxeTableMethods extends VxeTableProMethods { } - export interface VxeTablePrivateMethods extends VxeTableProPrivateMethods { } -} - -declare module '../grid' { - export interface VxeGridMethods extends VxeTableProMethods { } - export interface VxeGridPrivateMethods extends VxeTableProPrivateMethods { } -} - -export namespace VxeTableProDefines { - export interface CellAreaParams { - cols: VxeTableDefines.ColumnInfo[] - rows: D[] - } - - export interface FNRTab { - value: string - label: string - } - - export interface FNRSearch { - seq: number - row: number - col: number - isActived: boolean - value: string - } - - export interface MouseActiveCellArea { - el?: HTMLElement | null - type: CELL_AREA_TYPE - area: MouseCellArea - row: any - column: VxeTableDefines.ColumnInfo - top: number - left: number - width: number - height: number - } - - export interface MouseCellArea { - el?: HTMLElement | null - leftEl?: HTMLElement | null - rightEl?: HTMLElement | null - type: CELL_AREA_TYPE - rows: D[] - cols: VxeTableDefines.ColumnInfo[] - top: number - left: number - width: number - height: number - } - - export type CELL_AREA_TYPE = 'main' | 'copy' | 'extend' | 'multi' | 'active' - - export interface CellAreaConfig { - type?: CELL_AREA_TYPE - startColumn: VxeTableDefines.ColumnInfo | number - endColumn: VxeTableDefines.ColumnInfo | number - startRow: D | number - endRow: D | number - } - - export interface ActiveCellAreaConfig { - area: VxeTableProDefines.MouseCellArea | number - column: VxeTableDefines.ColumnInfo | number - row: D | number - } - - export type ExtendCellAreaDirection = 'up' | 'down' | 'left' | 'right' - - export interface ExtendCellAreaCalcBaseParams { - rows: D[] - cols: VxeTableDefines.ColumnInfo[] - targetValues: any[][] - targetRows: any[] - targetCols: VxeTableDefines.ColumnInfo[] - extendRows: any[] - extendCols: VxeTableDefines.ColumnInfo[] - direction: ExtendCellAreaDirection - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null | undefined - } - - interface EventParams extends VxeEvent { - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null | undefined - } - - type FnrTab = 'find' | 'replace' - - export interface OpenFnrParams { - tab: FnrTab - } - export interface OpenFnrEventParams extends EventParams, OpenFnrParams { } - - export type FnrChangeParams = OpenFnrParams - export interface FnrChangeEventParams extends EventParams, FnrChangeParams { } - - export interface FnrFindParams { - findValue: string - row: D - column: VxeTableDefines.ColumnInfo - } - export type FnrFindEventParams = FnrFindParams - - export interface FindAndReplaceResult { - row: D - _rowIndex: number - column: VxeTableDefines.ColumnInfo - _columnIndex: number - } - - export interface FnrFindAllParams { - findValue: string - result: FindAndReplaceResult[] - } - export type FnrFindAllEventParams = FnrFindAllParams - - export interface FnrReplaceParams { - findValue: string - replaceValue: string - row: any - column: VxeTableDefines.ColumnInfo - } - export type FnrReplaceEventParams = FnrReplaceParams - - export interface FnrReplaceAllParams { - findValue: string - replaceValue: string - result: FindAndReplaceResult[] - } - export type FnrReplaceAllEventParams = FnrReplaceAllParams - - export interface CellAreaCopyParams { - status: boolean - invalid: boolean - targetAreas: VxeTableProDefines.CellAreaParams[] - cellValues: string[][] - } - export interface CellAreaCopyEventParams extends EventParams, CellAreaCopyParams { } - - export interface CellAreaCutParams { - status: boolean - invalid: boolean - targetAreas: VxeTableProDefines.CellAreaParams[] - cellValues: string[][] - } - export interface CellAreaCutEventParams extends EventParams, CellAreaCutParams { } - - export interface CellAreaPasteParams { - status: boolean - invalid: boolean - targetAreas: VxeTableProDefines.CellAreaParams[] - } - export interface CellAreaPasteEventParams extends EventParams, CellAreaPasteParams { } - - export interface CellAreaMergeParams { - status: boolean - targetAreas: VxeTableProDefines.CellAreaParams[] - } - export interface CellAreaMergeEventParams extends EventParams, CellAreaMergeParams { } - - export interface ClearCellAreaMergeParams { - mergeCells: VxeTableDefines.MergeInfo[] - } - export interface ClearCellAreaMergeEventParams extends EventParams, ClearCellAreaMergeParams { } - - export interface HeaderCellAreaSelectionParams { - targetRows: D[] - targetCols: VxeTableDefines.ColumnInfo[] - column: VxeTableDefines.ColumnInfo - _columnIndex: number - } - export interface HeaderCellAreaSelectionEventParams extends EventParams, HeaderCellAreaSelectionParams { } - - export interface CellAreaSelectionInvalidParams { - row: D - column: VxeTableDefines.ColumnInfo - } - export interface CellAreaSelectionInvalidEventParams extends EventParams, CellAreaSelectionInvalidParams { } - - export interface CellAreaSelectionStartParams { - row: D - _rowIndex: number - $rowIndex: number - column: VxeTableDefines.ColumnInfo - _columnIndex: number - $columnIndex: number - cell: HTMLElement - } - export interface CellAreaSelectionStartEventParams extends EventParams, CellAreaSelectionStartParams { } - - export interface CellAreaSelectionDragParams { - rows: D[] - cols: VxeTableDefines.ColumnInfo[] - } - export interface CellAreaSelectionDragEventParams extends EventParams, CellAreaSelectionDragParams { } - - export interface CellAreaSelectionEndParams { - rows: D[] - cols: VxeTableDefines.ColumnInfo[] - } - export interface CellAreaSelectionEndEventParams extends EventParams, CellAreaSelectionEndParams { } - - export type CellAreaExtensionStartParams = CellAreaSelectionStartParams - export interface CellAreaExtensionStartEventParams extends EventParams, CellAreaExtensionStartParams { } - - export interface CellAreaExtensionDragParams { - rows: D[] - cols: VxeTableDefines.ColumnInfo[] - targetRows: D[] - targetCols: VxeTableDefines.ColumnInfo[] - } - export interface CellAreaExtensionDragEventParams extends EventParams, CellAreaExtensionDragParams { } - - export interface CellAreaExtensionEndParams { - rows: D[] - cols: VxeTableDefines.ColumnInfo[] - targetRows: D[] - targetCols: VxeTableDefines.ColumnInfo[] - } - export interface CellAreaExtensionEndEventParams extends EventParams, CellAreaExtensionEndParams { } - - export interface CellAreaSelectionAllStartParams { - } - export interface CellAreaSelectionAllStartEventParams extends EventParams, CellAreaSelectionAllStartParams { } - - export interface CellAreaSelectionAllEndParams { - rows: D[] - cols: VxeTableDefines.ColumnInfo[] - } - export interface CellAreaSelectionAllEndEventParams extends EventParams, CellAreaSelectionAllEndParams { } - - export interface CellAreaArrowsStartParams { - rows: D[] - cols: VxeTableDefines.ColumnInfo[] - isLeft: boolean - isUp: boolean - isRight: boolean - isDown: boolean - } - export interface CellAreaArrowsStartEventParams extends EventParams, CellAreaArrowsStartParams { } - - export interface CellAreaArrowsEndParams extends CellAreaArrowsStartParams { - targetRows: D[] - targetCols: VxeTableDefines.ColumnInfo[] - } - export interface CellAreaArrowsEndEventParams extends EventParams, CellAreaArrowsEndParams { } - - export interface ActiveCellChangeStartParams { - activeArea: VxeTableProDefines.MouseActiveCellArea - row: D - column: VxeTableDefines.ColumnInfo - isTab: boolean - isEnter: boolean - isLeft: boolean - isUp: boolean - isRight: boolean - isDown: boolean - } - export interface ActiveCellChangeStartEventParams extends EventParams, ActiveCellChangeStartParams { } - - export interface ActiveCellChangeEndParams extends ActiveCellChangeStartParams { - beforeActiveArea: VxeTableProDefines.MouseActiveCellArea - } - export interface ActiveCellChangeEndEventParams extends EventParams, ActiveCellChangeEndParams { } -} - -export type VxeTableProEmits = [ - 'change-fnr', // 废弃 - - 'open-fnr', - 'show-fnr', - 'hide-fnr', - 'fnr-change', - 'fnr-find', - 'fnr-find-all', - 'fnr-replace', - 'fnr-replace-all', - 'cell-area-copy', - 'cell-area-cut', - 'cell-area-paste', - 'cell-area-merge', - 'clear-cell-area-merge', - 'header-cell-area-selection', - 'cell-area-selection-invalid', - 'cell-area-selection-start', - 'cell-area-selection-drag', - 'cell-area-selection-end', - 'cell-area-extension-start', - 'cell-area-extension-drag', - 'cell-area-extension-end', - 'cell-area-selection-all-start', - 'cell-area-selection-all-end', - 'cell-area-arrows-start', - 'cell-area-arrows-end', - 'active-cell-change-start', - 'active-cell-change-end' -] - -declare module '../table' { - export interface VxeTableEventProps { - onOpenFnr?: VxeTableEvents.OpenFnr - onFnrChange?: VxeTableEvents.FnrChange - onFnrFind?: VxeTableEvents.FnrFind - onFnrFindAll?: VxeTableEvents.FnrFindAll - onFnrReplace?: VxeTableEvents.FnrReplace - onFnrReplaceAll?: VxeTableEvents.FnrReplaceAll - onCellAreaCopy?: VxeTableEvents.CellAreaCopy - onCellAreaCut?: VxeTableEvents.CellAreaCut - onCellAreaPaste?: VxeTableEvents.CellAreaPaste - onCellAreaMerge?: VxeTableEvents.CellAreaMerge - onClearCellAreaMerge?: VxeTableEvents.ClearCellAreaMerge - onHeaderCellAreaSelection?: VxeTableEvents.HeaderCellAreaSelection - onCellAreaSelectionInvalid?: VxeTableEvents.CellAreaSelectionInvalid - onCellAreaSelectionStart?: VxeTableEvents.CellAreaSelectionStart - onCellAreaSelectionDrag?: VxeTableEvents.CellAreaSelectionDrag - onCellAreaSelectionEnd?: VxeTableEvents.CellAreaSelectionEnd - onCellAreaExtensionStart?: VxeTableEvents.CellAreaExtensionStart - onCellAreaExtensionDrag?: VxeTableEvents.CellAreaExtensionDrag - onCellAreaExtensionEnd?: VxeTableEvents.CellAreaExtensionEnd - onCellAreaSelectionAllStart?: VxeTableEvents.CellAreaSelectionAllStart - onCellAreaSelectionAllEnd?: VxeTableEvents.CellAreaSelectionAllEnd - onCellAreaArrowsStart?: VxeTableEvents.CellAreaArrowsStart - onCellAreaArrowsEnd?: VxeTableEvents.CellAreaArrowsEnd - onActiveCellChangeStart?: VxeTableEvents.ActiveCellChangeStart - onActiveCellChangeEnd?: VxeTableEvents.ActiveCellChangeEnd - } - export interface VxeTableListeners { - /** - * 只对 keyboard-config.isFNR 配置时有效，在查找与替换弹框被打开时会触发该事件 - */ - openFnr?: VxeTableEvents.OpenFnr - /** - * 只对 keyboard-config.isFNR 配置时有效，在查找与替换弹框的 Tab 页被切换时会触发该事件 - */ - fnrChange?: VxeTableEvents.FnrChange - /** - * 只对 keyboard-config.isFNR 配置时有效，在点击查找时会触发该事件 - */ - fnrFind?: VxeTableEvents.FnrFind - /** - * 只对 keyboard-config.isFNR 配置时有效，在点击查找所有时会触发该事件 - */ - fnrFindAll?: VxeTableEvents.FnrFindAll - /** - * 只对 keyboard-config.isFNR 配置时有效，在点击替换时会触发该事件 - */ - fnrReplace?: VxeTableEvents.FnrReplace - /** - * 只对 keyboard-config.isFNR 配置时有效，在点击替换所有时会触发该事件 - */ - fnrReplaceAll?: VxeTableEvents.FnrReplaceAll - cellAreaCopy?: VxeTableEvents.CellAreaCopy - cellAreaCut?: VxeTableEvents.CellAreaCut - cellAreaPaste?: VxeTableEvents.CellAreaPaste - cellAreaMerge?: VxeTableEvents.CellAreaMerge - clearCellAreaMerge?: VxeTableEvents.ClearCellAreaMerge - headerCellAreaSelection?: VxeTableEvents.HeaderCellAreaSelection - cellAreaSelectionInvalidtart?: VxeTableEvents.CellAreaSelectionInvalid - cellAreaSelectionStart?: VxeTableEvents.CellAreaSelectionStart - cellAreaSelectionDrag?: VxeTableEvents.CellAreaSelectionDrag - cellAreaSelectionEnd?: VxeTableEvents.CellAreaSelectionEnd - cellAreaExtensionStart?: VxeTableEvents.CellAreaExtensionStart - cellAreaExtensionDrag?: VxeTableEvents.CellAreaExtensionDrag - cellAreaExtensionEnd?: VxeTableEvents.CellAreaExtensionEnd - cellAreaSelectionAllStart?: VxeTableEvents.CellAreaSelectionAllStart - cellAreaSelectionAllEnd?: VxeTableEvents.CellAreaSelectionAllEnd - cellAreaArrowsStart?: VxeTableEvents.CellAreaArrowsStart - cellAreaArrowsEnd?: VxeTableEvents.CellAreaArrowsEnd - activeCellChangeStart?: VxeTableEvents.ActiveCellChangeStart - activeCellChangeEnd?: VxeTableEvents.ActiveCellChangeEnd - } - export namespace VxeTableEvents { - export type OpenFnr = (params: VxeTableProDefines.OpenFnrParams) => void - export type FnrChange = (params: VxeTableProDefines.FnrChangeParams) => void - export type FnrFind = (params: VxeTableProDefines.FnrFindParams) => void - export type FnrFindAll = (params: VxeTableProDefines.FnrFindAllParams) => void - export type FnrReplace = (params: VxeTableProDefines.FnrReplaceParams) => void - export type FnrReplaceAll = (params: VxeTableProDefines.FnrReplaceAllParams) => void - export type CellAreaCopy = (params: VxeTableProDefines.CellAreaCopyParams) => void - export type CellAreaCut = (params: VxeTableProDefines.CellAreaCutParams) => void - export type CellAreaPaste = (params: VxeTableProDefines.CellAreaPasteParams) => void - export type CellAreaMerge = (params: VxeTableProDefines.CellAreaMergeEventParams) => void - export type ClearCellAreaMerge = (params: VxeTableProDefines.ClearCellAreaMergeEventParams) => void - export type HeaderCellAreaSelection = (params: VxeTableProDefines.HeaderCellAreaSelectionEventParams) => void - export type CellAreaSelectionInvalid = (params: VxeTableProDefines.CellAreaSelectionInvalidEventParams) => void - export type CellAreaSelectionStart = (params: VxeTableProDefines.CellAreaSelectionStartEventParams) => void - export type CellAreaSelectionDrag = (params: VxeTableProDefines.CellAreaSelectionDragEventParams) => void - export type CellAreaSelectionEnd = (params: VxeTableProDefines.CellAreaSelectionEndEventParams) => void - export type CellAreaExtensionStart = (params: VxeTableProDefines.CellAreaExtensionStartEventParams) => void - export type CellAreaExtensionDrag = (params: VxeTableProDefines.CellAreaExtensionDragEventParams) => void - export type CellAreaExtensionEnd = (params: VxeTableProDefines.CellAreaExtensionEndEventParams) => void - export type CellAreaSelectionAllStart = (params: VxeTableProDefines.CellAreaSelectionAllStartEventParams) => void - export type CellAreaSelectionAllEnd = (params: VxeTableProDefines.CellAreaSelectionAllEndEventParams) => void - export type CellAreaArrowsStart = (params: VxeTableProDefines.CellAreaArrowsStartEventParams) => void - export type CellAreaArrowsEnd = (params: VxeTableProDefines.CellAreaArrowsEndEventParams) => void - export type ActiveCellChangeStart = (params: VxeTableProDefines.ActiveCellChangeStartEventParams) => void - export type ActiveCellChangeEnd = (params: VxeTableProDefines.ActiveCellChangeEndEventParams) => void - } -} - -declare module '../grid' { - export interface VxeGridEventProps { - onOpenFnr?: VxeGridEvents.OpenFnr - onFnrChange?: VxeGridEvents.FnrChange - onFnrFind?: VxeGridEvents.FnrFind - onFnrFindAll?: VxeGridEvents.FnrFindAll - onFnrReplace?: VxeGridEvents.FnrReplace - onFnrReplaceAll?: VxeGridEvents.FnrReplaceAll - onCellAreaCopy?: VxeGridEvents.CellAreaCopy - onCellAreaCut?: VxeGridEvents.CellAreaCut - onCellAreaPaste?: VxeGridEvents.CellAreaPaste - onCellAreaMerge?: VxeGridEvents.CellAreaMerge - onClearCellAreaMerge?: VxeGridEvents.ClearCellAreaMerge - onHeaderCellAreaSelection?: VxeGridEvents.HeaderCellAreaSelection - onCellAreaSelectionInvalid?: VxeGridEvents.CellAreaSelectionInvalid - onCellAreaSelectionStart?: VxeGridEvents.CellAreaSelectionStart - onCellAreaSelectionDrag?: VxeGridEvents.CellAreaSelectionDrag - onCellAreaSelectionEnd?: VxeGridEvents.CellAreaSelectionEnd - onCellAreaExtensionStart?: VxeGridEvents.CellAreaExtensionStart - onCellAreaExtensionDrag?: VxeGridEvents.CellAreaExtensionDrag - onCellAreaExtensionEnd?: VxeGridEvents.CellAreaExtensionEnd - onCellAreaSelectionAllStart?: VxeGridEvents.CellAreaSelectionAllStart - onCellAreaSelectionAllEnd?: VxeGridEvents.CellAreaSelectionAllEnd - onCellAreaArrowsStart?: VxeGridEvents.CellAreaArrowsStart - onCellAreaArrowsEnd?: VxeGridEvents.CellAreaArrowsEnd - onActiveCellChangeStart?: VxeGridEvents.ActiveCellChangeStart - onActiveCellChangeEnd?: VxeGridEvents.ActiveCellChangeEnd - } - export interface VxeGridListeners { - /** - * 只对 keyboard-config.isFNR 配置时有效，在查找与替换弹框被打开时会触发该事件 - */ - openFnr?: VxeGridEvents.OpenFnr - /** - * 只对 keyboard-config.isFNR 配置时有效，在查找与替换弹框的 Tab 页被切换时会触发该事件 - */ - fnrChange?: VxeGridEvents.FnrChange - /** - * 只对 keyboard-config.isFNR 配置时有效，在点击查找时会触发该事件 - */ - fnrFind?: VxeGridEvents.FnrFind - /** - * 只对 keyboard-config.isFNR 配置时有效，在点击查找所有时会触发该事件 - */ - fnrFindAll?: VxeGridEvents.FnrFindAll - /** - * 只对 keyboard-config.isFNR 配置时有效，在点击替换时会触发该事件 - */ - fnrReplace?: VxeGridEvents.FnrReplace - /** - * 只对 keyboard-config.isFNR 配置时有效，在点击替换所有时会触发该事件 - */ - fnrReplaceAll?: VxeGridEvents.FnrReplaceAll - cellAreaCopy?: VxeGridEvents.CellAreaCopy - cellAreaCut?: VxeGridEvents.CellAreaCut - cellAreaPaste?: VxeGridEvents.CellAreaPaste - cellAreaMerge?: VxeGridEvents.CellAreaMerge - clearCellAreaMerge?: VxeGridEvents.ClearCellAreaMerge - headerCellAreaSelection?: VxeGridEvents.HeaderCellAreaSelection - cellAreaSelectionInvalid?: VxeGridEvents.CellAreaSelectionInvalid - cellAreaSelectionStart?: VxeGridEvents.CellAreaSelectionStart - cellAreaSelectionDrag?: VxeGridEvents.CellAreaSelectionDrag - cellAreaSelectionEnd?: VxeGridEvents.CellAreaSelectionEnd - cellAreaExtensionStart?: VxeGridEvents.CellAreaExtensionStart - cellAreaExtensionDrag?: VxeGridEvents.CellAreaExtensionDrag - cellAreaExtensionEnd?: VxeGridEvents.CellAreaExtensionEnd - cellAreaSelectionAllStart?: VxeGridEvents.CellAreaSelectionAllStart - cellAreaSelectionAllEnd?: VxeGridEvents.CellAreaSelectionAllEnd - cellAreaArrowsStart?: VxeGridEvents.CellAreaArrowsStart - cellAreaArrowsEnd?: VxeGridEvents.CellAreaArrowsEnd - activeCellChangeStart?: VxeGridEvents.ActiveCellChangeStart - activeCellChangeEnd?: VxeGridEvents.ActiveCellChangeEnd - } - export namespace VxeGridEvents { - export type OpenFnr = (params: VxeTableProDefines.OpenFnrParams) => void - export type FnrChange = (params: VxeTableProDefines.FnrChangeParams) => void - export type FnrFind = (params: VxeTableProDefines.FnrFindParams) => void - export type FnrFindAll = (params: VxeTableProDefines.FnrFindAllParams) => void - export type FnrReplace = (params: VxeTableProDefines.FnrReplaceParams) => void - export type FnrReplaceAll = (params: VxeTableProDefines.FnrReplaceAllParams) => void - export type CellAreaCopy = (params: VxeTableProDefines.CellAreaCopyParams) => void - export type CellAreaCut = (params: VxeTableProDefines.CellAreaCutParams) => void - export type CellAreaPaste = (params: VxeTableProDefines.CellAreaPasteParams) => void - export type CellAreaMerge = (params: VxeTableProDefines.CellAreaMergeParams) => void - export type ClearCellAreaMerge = (params: VxeTableProDefines.ClearCellAreaMergeParams) => void - export type HeaderCellAreaSelection = (params: VxeTableProDefines.HeaderCellAreaSelectionParams) => void - export type CellAreaSelectionInvalid = (params: VxeTableProDefines.CellAreaSelectionInvalidEventParams) => void - export type CellAreaSelectionStart = (params: VxeTableProDefines.CellAreaSelectionStartEventParams) => void - export type CellAreaSelectionDrag = (params: VxeTableProDefines.CellAreaSelectionDragEventParams) => void - export type CellAreaSelectionEnd = (params: VxeTableProDefines.CellAreaSelectionEndEventParams) => void - export type CellAreaExtensionStart = (params: VxeTableProDefines.CellAreaExtensionStartEventParams) => void - export type CellAreaExtensionDrag = (params: VxeTableProDefines.CellAreaExtensionDragEventParams) => void - export type CellAreaExtensionEnd = (params: VxeTableProDefines.CellAreaExtensionEndEventParams) => void - export type CellAreaArrowsStart = (params: VxeTableProDefines.CellAreaArrowsStartEventParams) => void - export type CellAreaSelectionAllStart = (params: VxeTableProDefines.CellAreaSelectionAllStartEventParams) => void - export type CellAreaSelectionAllEnd = (params: VxeTableProDefines.CellAreaSelectionAllEndEventParams) => void - export type CellAreaArrowsEnd = (params: VxeTableProDefines.CellAreaArrowsEndEventParams) => void - export type ActiveCellChangeStart = (params: VxeTableProDefines.ActiveCellChangeStartEventParams) => void - export type ActiveCellChangeEnd = (params: VxeTableProDefines.ActiveCellChangeEndEventParams) => void - } -} diff --git a/types/plugins/index.d.ts b/types/plugins/index.d.ts deleted file mode 100644 index 6d14acbd16..0000000000 --- a/types/plugins/index.d.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './extend-cell-area' diff --git a/types/pulldown.d.ts b/types/pulldown.d.ts deleted file mode 100644 index 1510c1a208..0000000000 --- a/types/pulldown.d.ts +++ /dev/null @@ -1,153 +0,0 @@ -import { RenderFunction, SetupContext, ComponentPublicInstance, Ref } from 'vue' -import { VXEComponent, VxeComponentBase, SizeType, VNodeStyle, VxeEvent, ValueOf } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 下拉容器 - * @example import { Pulldown as VxePulldown } from 'vxe-table' - */ -export const VxePulldown: VXEComponent -/** - * 组件 - 下拉容器 - */ -export const Pulldown: typeof VxePulldown - -export type VxePulldownEmits = [ - 'update:modelValue', - 'hide-panel' -] - -export namespace VxePulldownPropTypes { - export type ModelValue = boolean - export type Size = SizeType - export type Disabled = boolean - export type Placement = string - export type ClassName = string | ((params: { $pulldown: VxePulldownConstructor }) => string) - export type PopupClassName = string | ((params: { $pulldown: VxePulldownConstructor }) => string) - export type DestroyOnClose = boolean - export type Transfer = boolean -} - -export interface PulldownPrivateRef { - refElem: Ref -} -export type VxePulldownPrivateRef = PulldownPrivateRef - -export interface PulldownReactData { - inited: boolean - panelIndex: number - panelStyle: VNodeStyle | null - panelPlacement: string | null - visiblePanel: boolean - animatVisible: boolean - isActivated: boolean -} - -export interface PulldownPrivateMethods {} -export type VxePulldownPrivateMethods = PulldownPrivateMethods - -export type VxePulldownProps = { - size?: VxePulldownPropTypes.Size - modelValue?: VxePulldownPropTypes.ModelValue - /** - * 是否禁用 - */ - disabled?: VxePulldownPropTypes.Disabled - className?: VxePulldownPropTypes.ClassName - popupClassName?: VxePulldownPropTypes.PopupClassName - /** - * 固定显示下拉面板的方向 - */ - placement?: VxePulldownPropTypes.Placement - /** - * 在下拉容器关闭时销毁内容 - */ - destroyOnClose?: VxePulldownPropTypes.DestroyOnClose - /** - * 是否将弹框容器插入于 body 内（对于嵌入到表格或者弹窗中被遮挡时需要设置为 true） - */ - transfer?: VxePulldownPropTypes.Transfer -} - -export interface PulldownMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void - /** - * 判断下拉面板是否可视 - */ - isPanelVisible(): boolean - - /** - * 切换下拉面板 - */ - togglePanel(): Promise - - /** - * 显示下拉面板 - */ - showPanel(): Promise - - /** - * 隐藏下拉面板 - */ - hidePanel(): Promise -} -export type VxePulldownMethods = PulldownMethods - -export interface VxePulldownConstructor extends VxeComponentBase, VxePulldownMethods { - props: VxePulldownProps - context: SetupContext - reactData: PulldownReactData - getRefMaps(): PulldownPrivateRef - renderVN: RenderFunction -} - -export type VxePulldownInstance = ComponentPublicInstance - -export namespace VxePulldownDefines { - export interface PulldownEventParams extends VxeEvent { - $pulldown: VxePulldownConstructor - } - - export interface HidePanelParams { } - export type HidePanelEventParams = HidePanelParams -} - -export namespace VxePulldownEvents { - export type HidePanel = (params: VxePulldownDefines.HidePanelEventParams) => void -} - -export type VxePulldownEventProps = { - onHidePanel?: VxePulldownEvents.HidePanel -} - -export interface VxePulldownListeners { - hidePanel?: VxePulldownEvents.HidePanel -} - -export interface VxePulldownSlots { - /** - * 自定义弹窗容器头部模板 - */ - header: (params: { - [key: string]: any - }) => any - /** - * 自定义显示的内容 - */ - default: (params: { - [key: string]: any - }) => any - /** - * 自定义弹窗容器底部模板 - */ - footer: ((params: { - [key: string]: any - }) => any) | undefined - /** - * 自定义下拉面板显示的内容 - */ - dropdown: (params: { - [key: string]: any - }) => any -} diff --git a/types/radio-button.d.ts b/types/radio-button.d.ts deleted file mode 100644 index 4487bffe59..0000000000 --- a/types/radio-button.d.ts +++ /dev/null @@ -1,91 +0,0 @@ -import { SetupContext, RenderFunction, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, ValueOf } from './component' -import { VxeRadioPropTypes } from './radio' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 单选框按钮 - * @example import { VxeRadioButton } from 'vxe-table' - */ -export const VxeRadioButton: VXEComponent -/** - * 组件 - 单选框按钮 - */ -export const RadioButton: typeof VxeRadioButton - -export type VxeRadioButtonInstance = ComponentPublicInstance - -export interface VxeRadioButtonConstructor extends VxeComponentBase, VxeRadioButtonMethods { - props: VxeRadioButtonProps - context: SetupContext - renderVN: RenderFunction -} - -export interface RadioButtonMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void -} -export interface VxeRadioButtonMethods extends RadioButtonMethods { } - -export interface RadioButtonPrivateMethods { } -export interface VxeRadioButtonPrivateMethods extends RadioButtonPrivateMethods { } - -export type VxeRadioButtonEmits = [ - 'update:modelValue', - 'change' -] - -export type VxeRadioButtonProps = { - size?: VxeRadioButtonPropTypes.Size - modelValue?: VxeRadioButtonPropTypes.ModelValue - /** - * 严格模式，不允许取消 - */ - strict?: VxeRadioButtonPropTypes.Strict - label?: VxeRadioButtonPropTypes.Label - title?: VxeRadioButtonPropTypes.Title - content?: VxeRadioButtonPropTypes.Content - disabled?: VxeRadioButtonPropTypes.Disabled -} - -export namespace VxeRadioButtonPropTypes { - export type Size = VxeRadioPropTypes.Size - export type ModelValue = any - export type Strict = boolean - export type Label = VxeRadioPropTypes.Label - export type Title = string | number - export type Content = string | number - export type Disabled = boolean -} - -export namespace VxeRadioButtonDefines { - interface RadioButtonEventParams extends VxeEvent { - $radioButton: VxeRadioButtonConstructor - } - - export interface ChangeParams { - label: any - } - export interface ChangeEventParams extends RadioButtonEventParams, ChangeParams { } -} - -export type VxeRadioButtonEventProps = { - onChange?: VxeRadioButtonEvents.Change -} - -export interface VxeRadioButtonListeners { - change?: VxeRadioButtonEvents.Change -} - -export namespace VxeRadioButtonEvents { - export type Change = (params: VxeRadioButtonDefines.ChangeEventParams) => void -} - -export interface VxeRadioButtonSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/radio-group.d.ts b/types/radio-group.d.ts deleted file mode 100644 index 929eb472bf..0000000000 --- a/types/radio-group.d.ts +++ /dev/null @@ -1,100 +0,0 @@ -import { SetupContext, RenderFunction, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, SizeType, VxeEvent, ValueOf } from './component' -import { VxeGlobalRendererHandles } from './v-x-e-table' -import { VxeRadioPropTypes } from './radio' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 单选框组 - * @example import { VxeRadioGroup } from 'vxe-table' - */ -export const VxeRadioGroup: VXEComponent -/** - * 组件 - 单选框组 - */ -export const RadioGroup: typeof VxeRadioGroup - -export type VxeRadioGroupInstance = ComponentPublicInstance - -export interface VxeRadioGroupConstructor extends VxeComponentBase, VxeRadioGroupMethods { - name: string - props: VxeRadioGroupProps - context: SetupContext - renderVN: RenderFunction -} - -export type VxeRadioGroupEmits = [ - 'update:modelValue', - 'change' -] - -export type VxeRadioGroupProps = { - size?: VxeRadioGroupPropTypes.Size - type?: VxeRadioGroupPropTypes.Type - options?: VxeRadioGroupPropTypes.Options - optionProps?: VxeRadioGroupPropTypes.OptionProps - /** - * 严格模式，不允许取消 - */ - strict?: VxeRadioGroupPropTypes.Strict - modelValue?: VxeRadioGroupPropTypes.ModelValue - disabled?: VxeRadioGroupPropTypes.Disabled -} - -export namespace VxeRadioGroupPropTypes { - export type Size = SizeType - export type Type = 'button' | 'default' | '' | null - export type Options = { - value?: VxeRadioPropTypes.Label - label?: VxeRadioPropTypes.Content - - [key: string]: any - }[] - export type OptionProps = VxeGlobalRendererHandles.RenderOptionProps - export type ModelValue = any - export type Strict = boolean - export type Disabled = boolean -} - -export interface RadioGroupMethods { - dispatchEvent(type: ValueOf, params: any, evnt?: Event): void -} -export interface VxeRadioGroupMethods extends RadioGroupMethods { } - -export interface RadioGroupPrivateMethods { - handleChecked(params: { label: any }, evnt: Event): void -} -export interface VxeRadioGroupPrivateMethods extends RadioGroupPrivateMethods { } - -export namespace VxeRadioGroupDefines { - interface RadioGroupEventParams extends VxeEvent { - $radioGroup: VxeRadioGroupConstructor - } - - export interface ChangeParams { - label: any - } - export interface ChangeEventParams extends RadioGroupEventParams, ChangeParams { } -} - -export type VxeRadioGroupEventProps = { - onChange?: VxeRadioGroupEvents.Change -} - -export interface VxeRadioGroupListeners { - change?: VxeRadioGroupEvents.Change -} - -export namespace VxeRadioGroupEvents { - export type Change = (params: VxeRadioGroupDefines.ChangeEventParams) => void -} - -export interface VxeRadioGroupSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/radio.d.ts b/types/radio.d.ts deleted file mode 100644 index 0d23d12d82..0000000000 --- a/types/radio.d.ts +++ /dev/null @@ -1,110 +0,0 @@ -import { SetupContext, RenderFunction, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 单选框 - * @example import { VxeRadio } from 'vxe-table' - */ -export const VxeRadio: VXEComponent -/** - * 组件 - 单选框 - */ -export const Radio: typeof VxeRadio - -export type VxeRadioInstance = ComponentPublicInstance - -export interface VxeRadioConstructor extends VxeComponentBase, VxeRadioMethods { - props: VxeRadioProps - context: SetupContext - renderVN: RenderFunction -} - -export type VxeRadioProps = { - size?: VxeRadioPropTypes.Size - /** - * 严格模式，不允许取消 - */ - strict?: VxeRadioPropTypes.Strict - /** - * 绑定值 - */ - modelValue?: VxeRadioPropTypes.ModelValue - /** - * 值 - */ - label?: VxeRadioPropTypes.Label - /** - * 原生 title 属性 - */ - title?: VxeRadioPropTypes.Title - /** - * 内容 - */ - content?: VxeRadioPropTypes.Content - /** - * 是否禁用 - */ - disabled?: VxeRadioPropTypes.Disabled - /** - * 原生 title 属性 - */ - name?: VxeRadioPropTypes.Name -} - -export namespace VxeRadioPropTypes { - export type Size = SizeType - export type Strict = boolean - export type ModelValue = any - export type Label = any - export type Title = string | number - export type Content = string | number - export type Disabled = boolean - export type Name = string -} - -export interface RadioMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void -} -export interface VxeRadioMethods extends RadioMethods { } - -export interface RadioPrivateMethods { } -export interface VxeRadioPrivateMethods extends RadioPrivateMethods { } - -export type VxeRadioEmits = [ - 'update:modelValue', - 'change' -] - -export namespace VxeRadioDefines { - interface RadioEventParams extends VxeEvent { - $radio: VxeRadioConstructor - } - - export interface ChangeParams { - label: any - } - export interface ChangeEventParams extends RadioEventParams, ChangeParams { } -} - -export type VxeRadioEventProps = { - onChange?: VxeRadioEvents.Change -} - -export interface VxeRadioListeners { - change?: VxeRadioEvents.Change -} - -export namespace VxeRadioEvents { - export type Change = (params: VxeRadioDefines.ChangeEventParams) => void -} - -export interface VxeRadioSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/select.d.ts b/types/select.d.ts deleted file mode 100644 index 04b47278c5..0000000000 --- a/types/select.d.ts +++ /dev/null @@ -1,270 +0,0 @@ -import { SetupContext, RenderFunction, ComponentPublicInstance, Ref } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, VNodeStyle } from './component' -import { VxeGlobalRendererHandles } from './v-x-e-table' -import { VxeOptgroupProps } from './optgroup' -import { VxeOptionProps, VxeOptionPropTypes } from './option' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 下拉框 - * @example import { VxeSelect } from 'vxe-table' - */ -export const VxeSelect: VXEComponent -/** - * 组件 - 下拉框 - */ -export const Select: typeof VxeSelect - -export type VxeSelectInstance = ComponentPublicInstance - -export interface VxeSelectConstructor extends VxeComponentBase, VxeSelectMethods { - props: VxeSelectProps - context: SetupContext - reactData: SelectReactData - getRefMaps(): SelectPrivateRef - renderVN: RenderFunction -} - -export interface SelectPrivateRef { - refElem: Ref -} -export interface VxeSelectPrivateRef extends SelectPrivateRef { } - -export interface SelectReactData { - inited: boolean - staticOptions: VxeSelectDefines.OptionInfo[] - fullGroupList: any[] - fullOptionList: any[] - visibleGroupList: any[] - visibleOptionList: any[] - remoteValueList: { - key: string - result: any - }[] - panelIndex: number - panelStyle: VNodeStyle - panelPlacement: any - currentOption: any - currentValue: any - visiblePanel: boolean - animatVisible: boolean - isActivated: boolean - searchValue: string, - searchLoading: boolean -} - -export type VxeSelectProps = { - size?: VxeSelectPropTypes.Size - modelValue?: VxeSelectPropTypes.ModelValue - clearable?: VxeSelectPropTypes.Clearable - placeholder?: VxeSelectPropTypes.Placeholder - loading?: VxeSelectPropTypes.Loading - disabled?: VxeSelectPropTypes.Disabled - className?: VxeSelectPropTypes.ClassName - popupClassName?: VxeSelectPropTypes.PopupClassName - multiple?: VxeSelectPropTypes.Multiple - multiCharOverflow?: VxeSelectPropTypes.MultiCharOverflow - prefixIcon?: VxeSelectPropTypes.PrefixIcon - placement?: VxeSelectPropTypes.Placement - options?: VxeSelectPropTypes.Options - optionProps?: VxeSelectPropTypes.OptionProps - optionGroups?: VxeSelectPropTypes.OptionGroups - optionGroupProps?: VxeSelectPropTypes.OptionGroupProps - optionConfig?: VxeSelectPropTypes.OptionConfig - emptyText?: VxeSelectPropTypes.EmptyText - filterable?: VxeSelectPropTypes.Filterable - filterMethod?: VxeSelectPropTypes.FilterMethod - remote?: VxeSelectPropTypes.Remote - remoteMethod?: VxeSelectPropTypes.RemoteMethod - max?: VxeSelectPropTypes.Max - /** - * 已废弃，被 optionConfig.keyField 替换 - * @deprecated - */ - optionId?: VxeSelectPropTypes.OptionId - /** - * 已废弃，被 optionConfig.useKey 替换 - * @deprecated - */ - optionKey?: VxeSelectPropTypes.OptionKey - transfer?: VxeSelectPropTypes.Transfer -} - -export namespace VxeSelectPropTypes { - export type Size = SizeType - export type ModelValue = any - export type Clearable = boolean - export type Placeholder = string - export type Loading = boolean - export type Disabled = boolean - export type ClassName = string | ((params: { $select: VxeSelectConstructor }) => string) - export type PopupClassName = string | ((params: { $select: VxeSelectConstructor }) => string) - export type Multiple = boolean - export type MultiCharOverflow = number | string - export type PrefixIcon = string - export type Placement = string - export type Options = VxeSelectDefines.SelectOptions[] - export type OptionProps = VxeGlobalRendererHandles.RenderOptionProps - export type OptionGroups = VxeSelectDefines.SelectOptgroups[] - export type OptionGroupProps = VxeGlobalRendererHandles.RenderOptionGroupProps - export type Filterable = boolean - export type FilterMethod = (params: { group: any, option: any, searchValue: string }) => boolean - export type Remote = boolean - export type RemoteMethod = (params: { searchValue: string }) => Promise | void - export type Max = number | string - /** - * 选项配置项 - */ - export interface OptionConfig { - useKey?: boolean - keyField?: string - } - export type EmptyText = string - export type OptionId = string - export type OptionKey = boolean - export type Transfer = boolean -} - -export interface SelectMethods { - dispatchEvent(type: ValueOf, params: any, evnt?: Event): void - /** - * 判断下拉面板是否可视 - */ - isPanelVisible(): boolean - /** - * 切换下拉面板 - */ - togglePanel(): Promise - /** - * 显示下拉面板 - */ - showPanel(): Promise - /** - * 隐藏下拉面板 - */ - hidePanel(): Promise - /** - * 刷新选项，当选项被动态显示/隐藏时可能会用到 - */ - refreshOption(): Promise - /** - * 获取焦点 - */ - focus(): Promise - /** - * 失去焦点 - */ - blur(): Promise -} -export interface VxeSelectMethods extends SelectMethods { } - -export interface SelectPrivateMethods { } -export interface VxeSelectPrivateMethods extends SelectPrivateMethods { } - -export type VxeSelectEmits = [ - 'update:modelValue', - 'change', - 'clear', - 'blur', - 'focus' -] - -export namespace VxeSelectDefines { - export class OptionInfo { - id: string - - value: any - label: VxeOptionPropTypes.Label - visible: VxeOptionPropTypes.Visible - className: VxeOptionPropTypes.ClassName - disabled: VxeOptionPropTypes.Disabled - - options: OptionInfo[] - } - - export interface SelectOptions extends VxeOptionProps { - slots?: VxeOptionPropTypes.Slots - } - - export interface SelectOptgroups extends VxeOptgroupProps { - options?: VxeOptionProps[] - slots?: VxeOptionPropTypes.Slots - } - - interface SelectEventParams extends VxeEvent { - $select: VxeSelectConstructor - } - - export interface ChangeParams { - value: any - } - export interface ChangeEventParams extends SelectEventParams, ChangeParams { } - - export interface ClearParams { - value: any - } - export interface ClearEventParams extends SelectEventParams, ClearParams { } - - export interface FocusEventParams extends SelectEventParams { } - export interface BlurEventParams extends SelectEventParams { } -} - -export type VxeSelectEventProps = { - onChange?: VxeSelectEvents.Change - onClear?: VxeSelectEvents.Clear - onFocus?: VxeSelectEvents.Focus - onBlur?: VxeSelectEvents.Blur -} - -export interface VxeSelectListeners { - change?: VxeSelectEvents.Change - clear?: VxeSelectEvents.Clear - focus?: VxeSelectEvents.Focus - blur?: VxeSelectEvents.Blur -} - -export namespace VxeSelectEvents { - export type Change = (params: VxeSelectDefines.ChangeEventParams) => void - export type Clear = (params: VxeSelectDefines.ClearEventParams) => void - export type Focus = (params: VxeSelectDefines.FocusEventParams) => void - export type Blur = (params: VxeSelectDefines.BlurEventParams) => void -} - -export interface VxeSelectSlots { - /** - * 自定义前缀图标模板 - */ - prefix: (params: { - [key: string]: any - }) => any - /** - * 自定义弹窗容器头部模板 - */ - header: (params: { - [key: string]: any - }) => any - /** - * 自定义弹窗容器选项模板 - */ - option: ((params: { - option: any - group: any - [key: string]: any - }) => any) | undefined - /** - * 自定义弹窗容器底部模板 - */ - footer: ((params: { - [key: string]: any - }) => any) | undefined - - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - option: any - group: any - [key: string]: any - }) => any) | undefined -} diff --git a/types/switch.d.ts b/types/switch.d.ts deleted file mode 100644 index 740e4f5c21..0000000000 --- a/types/switch.d.ts +++ /dev/null @@ -1,117 +0,0 @@ -import { SetupContext, RenderFunction, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 开关 - * @example import { VxeSwitch } from 'vxe-table' - */ -export const VxeSwitch: VXEComponent -/** - * 组件 - 开关 - */ -export const Switch: typeof VxeSwitch - -export type VxeSwitchInstance = ComponentPublicInstance - -export interface VxeSwitchConstructor extends VxeComponentBase, VxeSwitchMethods { - props: VxeSwitchProps - context: SetupContext - reactData: SwitchReactData - renderVN: RenderFunction -} - -export interface SwitchReactData { - isActivated: boolean - hasAnimat: boolean - offsetLeft: number -} - -export type VxeSwitchProps = { - size?: VxeSwitchPropTypes.Size - modelValue?: VxeSwitchPropTypes.ModelValue - disabled?: VxeSwitchPropTypes.Disabled - openLabel?: VxeSwitchPropTypes.OpenLabel - closeLabel?: VxeSwitchPropTypes.CloseLabel - openValue?: VxeSwitchPropTypes.OpenValue - closeValue?: VxeSwitchPropTypes.CloseValue - openIcon?: VxeSwitchPropTypes.OpenIcon - closeIcon?: VxeSwitchPropTypes.CloseIcon - openActiveIcon?: VxeSwitchPropTypes.OpenActiveIcon - closeActiveIcon?: VxeSwitchPropTypes.CloseActiveIcon -} - -export namespace VxeSwitchPropTypes { - export type Size = SizeType - export type ModelValue = string | number | boolean - export type Disabled = boolean - export type OpenLabel = string - export type CloseLabel = string - export type OpenValue = string | number | boolean - export type CloseValue = string | number | boolean - export type OpenIcon = string - export type CloseIcon = string - export type OpenActiveIcon = string - export type CloseActiveIcon = string -} - -export interface SwitchMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void - /** - * 获取焦点 - */ - focus(): Promise - /** - * 失去焦点 - */ - blur(): Promise -} -export interface VxeSwitchMethods extends SwitchMethods { } - -export interface SwitchPrivateMethods { } -export interface VxeSwitchPrivateMethods extends SwitchPrivateMethods { } - -export type VxeSwitchEmits = [ - 'update:modelValue', - 'change', - 'focus', - 'blur' -] - -export namespace VxeSwitchDefines { - interface SwitchEventParams extends VxeEvent { - $switch: VxeSwitchConstructor - } - - export interface ChangeEventParams extends SwitchEventParams { } - export interface FocusEventParams extends SwitchEventParams { } - export interface BlurEventParams extends SwitchEventParams { } -} - -export type VxeSwitchEventProps = { - onChange?: VxeSwitchEvents.Change - onFocus?: VxeSwitchEvents.Focus - onBlur?: VxeSwitchEvents.Blur -} - -export interface VxeSwitchListeners { - change?: VxeSwitchEvents.Change - focus?: VxeSwitchEvents.Focus - blur?: VxeSwitchEvents.Blur -} - -export namespace VxeSwitchEvents { - export type Change = (params: VxeSwitchDefines.ChangeEventParams) => void - export type Focus = (params: VxeSwitchDefines.FocusEventParams) => void - export type Blur = (params: VxeSwitchDefines.BlurEventParams) => void -} - -export interface VxeSwitchSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/table.d.ts b/types/table.d.ts deleted file mode 100644 index 821f40f4aa..0000000000 --- a/types/table.d.ts +++ /dev/null @@ -1,3470 +0,0 @@ -import { RenderFunction, SetupContext, Ref, ComputedRef, ComponentPublicInstance, ComponentInternalInstance, VNode } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, VNodeStyle, SlotVNodeType } from './component' -import { VxeTableProEmits, VxeTableProDefines } from './plugins/extend-cell-area' -import { VxeColumnPropTypes, VxeColumnProps, VxeColumnSlotTypes } from './column' -import { VXETableConfigOptions, VxeGlobalRendererHandles } from './v-x-e-table' -import { VxeToolbarConstructor, VxeToolbarInstance } from './toolbar' -import { VxeTooltipInstance } from './tooltip' -import { VxeGridConstructor } from './grid' -import { VxeTableMenuPanelInstance } from './module/menu' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 表格 - * @example import { VxeTable } from 'vxe-table' - */ -export const VxeTable: VXEComponent, VxeTableEventProps, VxeTableSlots> -/** - * 组件 - 表格 - */ -export const Table: typeof VxeTable - -export type VxeTableInstance = ComponentPublicInstance, VxeTableConstructor> - -export type VxeTableDataRow = Record - -export interface VxeTableConstructor extends VxeComponentBase, VxeTableMethods { - props: Readonly> - context: SetupContext - instance: ComponentInternalInstance - reactData: TableReactData - internalData: TableInternalData - getRefMaps(): TablePrivateRef - getComputeMaps(): TablePrivateComputed - renderVN: RenderFunction - - xegrid: VxeGridConstructor | null -} - -export interface TablePrivateRef { - refElem: Ref - refTooltip: Ref - refValidTooltip: Ref - refTableFilter: Ref - refTableCustom: Ref - refTableMenu: Ref - refTableHeader: Ref - refTableBody: Ref - refTableFooter: Ref - refTableLeftHeader: Ref - refTableLeftBody: Ref - refTableLeftFooter: Ref - refTableRightHeader: Ref - refTableRightBody: Ref - refTableRightFooter: Ref - refLeftContainer: Ref - refRightContainer: Ref - refCellResizeBar: Ref -} -export interface VxeTablePrivateRef extends TablePrivateRef { } - -export interface TablePrivateComputed { - computeSize: ComputedRef - computeValidOpts: ComputedRef> - computeSXOpts: ComputedRef - computeSYOpts: ComputedRef - computeColumnOpts: ComputedRef - computeRowOpts: ComputedRef - computeResizeleOpts: ComputedRef - computeResizableOpts: ComputedRef> - computeSeqOpts: ComputedRef> - computeRadioOpts: ComputedRef> - computeCheckboxOpts: ComputedRef> - computeTooltipOpts: ComputedRef> - computeEditOpts: ComputedRef> - computeSortOpts: ComputedRef> - computeFilterOpts: ComputedRef> - computeMouseOpts: ComputedRef - computeAreaOpts: ComputedRef - computeKeyboardOpts: ComputedRef - computeClipOpts: ComputedRef> - computeFNROpts: ComputedRef> - computeHeaderMenu: ComputedRef - computeBodyMenu: ComputedRef - computeFooterMenu: ComputedRef - computeIsMenu: ComputedRef - computeMenuOpts: ComputedRef> - computeExportOpts: ComputedRef - computeImportOpts: ComputedRef - computePrintOpts: ComputedRef - computeExpandOpts: ComputedRef> - computeTreeOpts: ComputedRef> - computeEmptyOpts: ComputedRef - computeLoadingOpts: ComputedRef - computeCustomOpts: ComputedRef> - computeFixedColumnSize: ComputedRef - computeIsMaxFixedColumn: ComputedRef - computeIsAllCheckboxDisabled: ComputedRef -} - -export type VxeTablePrivateComputed = TablePrivateComputed - -export interface TableMethods extends TablePublicMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event | null): void -} - -export interface TablePublicMethods
{ - /** - * 手动清除表格所有条件，还原到初始状态 - * 对于增删改查的场景中可能会用到，比如在数据保存之后清除表格缓存 - */ - clearAll(): Promise - /** - * 该方法已废弃！！！ - * 同步 data 数据；如果用了该方法，那么组件将不再记录增删改的状态，只能自行实现对应逻辑 - * 对于某些特殊的场景，比如深层树节点元素发生变动时可能会用到 - * @deprecated - */ - syncData(): Promise - /** - * 手动处理数据，用于手动排序与筛选 - * 对于手动更改了排序、筛选...等条件后需要重新处理数据时可能会用到 - */ - updateData(): Promise - /** - * 加载数据 - * @param data 数据 - */ - loadData(data: any[]): Promise - /** - * 加载数据并恢复到初始状态 - * @param data 数据 - */ - reloadData(data: any[]): Promise - /** - * 局部加载行数据并恢复到初始状态 - * @param rows 行对象 - * @param record 新数据 - * @param field 指定字段名 - */ - reloadRow(rows: any | any[], record?: any, field?: string): Promise - /** - * 用于树结构，给行数据加载子节点 - * @param row 行对象 - * @param children 子节点 - */ - loadTreeChildren(row: any, children: any[]): Promise - /** - * 加载列配置 - * @param columns 列对象 - */ - loadColumn(columns: (VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo)[]): Promise - /** - * 加载列配置并恢复到初始状态 - * @param columns 列对象 - */ - reloadColumn(columns: (VxeTableDefines.ColumnOptions | VxeTableDefines.ColumnInfo)[]): Promise - /** - * 根据 tr 元素获取对应的 row 信息 - * @param tr 行节点元素 - */ - getRowNode(trElem: HTMLElement): { - rowid: string - item: any - items: any[] - index: number - parent?: any - } | null - /** - * 根据 th/td 元素获取对应的 column 信息 - * @param cell 单元格节点元素 - */ - getColumnNode(cellElem: HTMLElement): { - colid: string - item: VxeTableDefines.ColumnInfo
- items: VxeTableDefines.ColumnInfo
[] - index: number - parent?: VxeTableDefines.ColumnInfo
- } | null - /** - * 根据 row 获取行的序号 - * @param row 行对象 - */ - getRowSeq(row: any): string | number - /** - * 根据 row 获取相对于 data 中的索引 - * @param row 行对象 - */ - getRowIndex(row: any): number - /** - * 根据 row 获取相对于当前数据中的索引 - * @param row 行对象 - */ - getVTRowIndex(row: any): number - /** - * 根据 row 获取渲染中的虚拟索引 - * @param row 行对象 - */ - getVMRowIndex(row: any): number - /** - * 根据 column 获取相对于 columns 中的索引 - * @param column 列对象 - */ - getColumnIndex(column: VxeTableDefines.ColumnInfo): number - /** - * 根据 column 获取相对于当前表格列中的索引 - * @param column 列对象 - */ - getVTColumnIndex(column: VxeTableDefines.ColumnInfo): number - /** - * 根据 column 获取渲染中的虚拟索引 - * @param column 列对象 - */ - getVMColumnIndex(column: VxeTableDefines.ColumnInfo): number - /** - * 创建 data 对象 - * 对于某些特殊场景可能会用到，会自动对数据的字段名进行检测，如果不存在就自动定义 - * @param records 数据 - */ - createData(records: any[]): Promise - /** - * 创建 Row|Rows 对象 - * 对于某些特殊场景需要对数据进行手动插入时可能会用到 - * @param records 数据 - */ - createRow(records: any | any[]): Promise - /** - * 只对 keep-source 开启有效，还原指定行 row 或者整个表格的数据 - * @param rows 指定行 - * @param field 字段名 - */ - revertData(rows?: any | any[], field?: string): Promise - /** - * 手动清空单元格内容，如果不传参数，则清空整个表格内容，如果传了行则清空指定行内容，如果传了指定字段，则清空该字段内容 - * @param rows 指定行 - * @param field 字段名 - */ - clearData(rows?: any | any[], field?: string): Promise - /** - * 用于 edit-config，判断行是否为新增的临时数据 - * @param row 指定行 - */ - isInsertByRow(row: any | null): boolean - /** - * 删除所有新增的临时数据 - */ - removeInsertRow(): Promise<{ row: any, rows: any[] }> - /** - * 只对 keep-source 开启有效，判断行数据是否发生改变 - * @param row 指定行 - * @param field 指定字段 - */ - isUpdateByRow(row: any, field?: string | null): boolean - /** - * 获取表格的可视列，也可以指定索引获取列 - * @param columnIndex 列索引 - */ - getColumns(): VxeTableDefines.ColumnInfo
[] - getColumns(columnIndex?: number): VxeTableDefines.ColumnInfo
- /** - * 根据列的唯一主键获取列 - * @param colid 列主键 - */ - getColumnById(colid: string | null): VxeTableDefines.ColumnInfo
| null - /** - * 根据列的字段名获取列 - * @param field 字段名 - */ - getColumnByField(field: string | null): VxeTableDefines.ColumnInfo
| null - /** - * 获取当前表格的列 - * 收集到的全量列、全量表头列、处理条件之后的全量表头列、当前渲染中的表头列 - */ - getTableColumn(): { - collectColumn: VxeTableDefines.ColumnInfo
[] - fullColumn: VxeTableDefines.ColumnInfo
[] - visibleColumn: VxeTableDefines.ColumnInfo
[] - tableColumn: VxeTableDefines.ColumnInfo
[] - } - /** - * 获取数据，和 data 的行为一致，也可以指定索引获取数据 - */ - getData(): DT[] - getData(rowIndex: number): DT - /** - * 用于 type=checkbox，获取已选中的行数据 - */ - getCheckboxRecords(isFull?: boolean): DT[] - /** - * 只对 tree-config 有效，获取行的父级 - */ - getParentRow(rowOrRowid: any): DT | null - /** - * 根据行的唯一主键获取行 - * @param rowid 行主键 - */ - getRowById(rowid: string | number | null): DT | null - /** - * 根据行获取行的唯一主键 - * @param row 行对象 - */ - getRowid(row: any | null): string - /** - * 获取当前表格的数据 - * 完整的全量表体数据、处理条件之后的全量表体数据、当前渲染中的表体数据、当前渲染中的表尾数据 - */ - getTableData(): { - fullData: DT[] - visibleData: DT[] - tableData: DT[] - footerData: DT[][] - } - /** - * 设置指定列为固定列 - * @param columnOrField 列对象或字段名 - */ - setColumnFixed(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo, fixed: VxeColumnPropTypes.Fixed): Promise - /** - * 取消指定的固定列 - * @param columnOrField 列对象或字段名 - */ - clearColumnFixed(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise - /** - * 隐藏指定列 - * @param columnOrField 列对象或字段名 - */ - hideColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise - /** - * 显示指定列 - * @param columnOrField 列对象或字段名 - */ - showColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise - /** - * 设置列宽 - * @param fieldOrColumn 列对象或字段名 - * @param width 宽度 %，px - */ - setColumnWidth(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo, width: number | string): Promise - /** - * 获取列宽 - * @param fieldOrColumn 列对象或字段名 - */ - getColumnWidth(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): number; - /** - * 手动重置列的显示隐藏、列宽拖动的状态；如果为 true 则重置所有状态 - * 如果已关联工具栏，则会同步更新 - * @param options 可选参数 - */ - resetColumn(options?: boolean | { - visible?: boolean - resizable?: boolean - fixed?: boolean - order?: boolean - }): Promise - /** - * 刷新列配置 - * 对于动态修改属性、显示/隐藏列等场景下可能会用到 - * 如果传 true 则会检查列顺序并排序 - */ - refreshColumn(resiveOrder?: boolean): Promise - /** - * 刷新滚动操作，手动同步滚动相关位置 - * 对于某些特殊的操作，比如滚动条错位、固定列不同步 - */ - refreshScroll(): Promise - /** - * 重新计算表格，如果传 true 则进行完整计算 - * 对于某些特殊场景可能会用到，比如隐藏的表格、重新计算列宽...等 - */ - recalculate(refull?: boolean): Promise - /** - * 打开 tooltip 提示 - * @param target 目标元素 - * @param content 内容 - */ - openTooltip(target: HTMLElement, content: string | number): Promise - /** - * 关闭 tooltip 提示 - */ - closeTooltip(): Promise - /** - * 用于 type=checkbox，设置行为选中状态，第二个参数为选中与否 - * @param rows 指定行 - * @param checked 是否选中 - */ - setCheckboxRow(rows: any | any[], checked: boolean): Promise - /** - * 用于 type=checkbox，判断列头复选框是否被选中 - */ - isAllCheckboxChecked(): boolean - /** - * 用于 type=checkbox，判断列头复选框是否被半选 - */ - isAllCheckboxIndeterminate(): boolean - /** - * 用于 type=checkbox，判断复选行数据是否勾选 - * @param row 指定行 - */ - isCheckedByCheckboxRow(row: any): boolean - /** - * 用于 type=checkbox，判断复选行数据是否半选 - * @param row 指定行 - */ - isIndeterminateByCheckboxRow(row: any): boolean - /** - * 用于 type=checkbox，切换某一行的选中状态 - * @param row 指定行 - */ - toggleCheckboxRow(row: any): Promise - /** - * 用于 type=checkbox，设置所有行的选中状态 - * @param checked 是否选中 - */ - setAllCheckboxRow(checked: boolean): Promise - /** - * 用于 radio-config.reserve，获取已保留选中的行数据 - */ - getRadioReserveRecord(isFull?: boolean): any[] - /** - * 用于 radio-config.reserve，手动清空用户保留选中的行数据 - */ - clearRadioReserve(): Promise - /** - * 用于 checkbox-config.reserve，获取已保留选中的行数据 - */ - getCheckboxReserveRecords(isFull?: boolean): any[] - /** - * 用于 type=checkbox，获取半选状态的行数据 - */ - getCheckboxIndeterminateRecords(isFull?: boolean): any[] - /** - * 用于 checkbox-config.reserve，手动清空用户保留选中的行数据 - */ - clearCheckboxReserve(): Promise - /** - * 用于 type=checkbox，切换所有行的选中状态 - */ - toggleAllCheckboxRow(): Promise - /** - * 用于 type=checkbox，手动清空用户的选择 - */ - clearCheckboxRow(): Promise - /** - * 用于 row-config.isCurrent，设置某一行为高亮状态 - * @param row 指定行 - */ - setCurrentRow(row: any): Promise - /** - * 用于 type=radio，判断单选行数据是否勾选 - * @param row 指定行 - */ - isCheckedByRadioRow(row: any | null): boolean - /** - * 用于 type=radio，设置某一行为选中状态 - * @param row 指定行 - */ - setRadioRow(row: any): Promise - /** - * 将指定行设置为取消/标记待删除状态 - */ - setPendingRow(rows: any | any[], status: boolean): Promise - /** - * 切换指定行的取消/标记待删除状态 - */ - togglePendingRow(rows: any | any[]): Promise - /** - * 获取待删除状态的数据 - */ - getPendingRecords(): DT[] - /** - * 判断行是否为待删除状态 - * @param row 指定行 - */ - hasPendingByRow(row: any): boolean - /** - * 清除所有标记状态 - */ - clearPendingRow(): Promise - /** - * 手动清除临时合并的单元格 - */ - clearMergeCells(): Promise - /** - * 手动清除临时合并的表尾 - */ - clearMergeFooterItems(): Promise - /** - * 用于 row-config.isCurrent，手动清空当前高亮的状态 - */ - clearCurrentRow(): Promise - /** - * 用于 type=radio，手动清空用户的选择 - */ - clearRadioRow(): Promise - /** - * 获取临时合并的单元格 - */ - getMergeCells(): VxeTableDefines.MergeInfo[] - /** - * 获取临时合并的表尾 - */ - getMergeFooterItems(): VxeTableDefines.MergeInfo[] - /** - * 用于 column-config.isCurrent，获取当前列 - */ - getCurrentColumn(): VxeTableDefines.ColumnInfo
| null - /** - * 用于 row-config.isCurrent，获取当前行的行数据 - */ - getCurrentRecord(): DT | null - /** - * 用于 type=radio，获取当已选中的行数据 - */ - getRadioRecord(isFull?: boolean): DT | null - /** - * 用于 column-config.isCurrent，设置某列行为高亮状态 - * @param columnOrField 列对象或字段名 - */ - setCurrentColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise - /** - * 用于 column-config.isCurrent，手动清空当前高亮的状态 - */ - clearCurrentColumn(): Promise - /** - * 手动对表格进行排序 - * @param sortConfs 字段名、多列排序 - * @param order 排序方式 - */ - sort(field: string, order?: VxeTablePropTypes.SortOrder): Promise - sort(sortConfs: VxeTableDefines.SortConfs, order?: VxeTablePropTypes.SortOrder): Promise - sort(sortConfs: VxeTableDefines.SortConfs[], order?: VxeTablePropTypes.SortOrder): Promise - /** - * 手动清空排序条件，数据会恢复成未排序的状态 - * @param columnOrField 列对象或字段名 - */ - clearSort(fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo | null): Promise - /** - * 判断指定列是否为排序状态，如果为空则判断所有列 - * @param columnOrField 列对象或字段名 - */ - isSort(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): boolean - /** - * 获取当前排序的列信息 - */ - getSortColumns(): VxeTableDefines.SortCheckedParams[] - /** - * 手动关闭筛选面板 - */ - closeFilter(): Promise - /** - * 已废弃，请使用 isActiveFilterByColumn - * @deprecated - */ - isFilter(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo | null): boolean - /** - * 判断指定列是否为筛选状态，如果为空则判断所有列 - * @param columnOrField 列对象或字段名 - */ - isActiveFilterByColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo | null): boolean - /** - * 用于 expand-config.lazy，用于懒加载展开行，判断展开行是否懒加载完成 - * @param row 指定行 - */ - isRowExpandLoaded(row: any | null): boolean - /** - * 用于 expand-config.lazy，手动清空懒加载展开行的状态，数据会恢复成未展开的状态，当再次展开时会重新加载 - */ - clearRowExpandLoaded(row: any): Promise - /** - * 重新懒加载展开行，并展开内容 - * @param row 指定行 - */ - reloadRowExpand(row: any): Promise - /** - * @deprecated 已废弃，请使用 reloadRowExpand - */ - reloadExpandContent(row: any): Promise - /** - * 用于 type=expand，切换展开行的状态 - * @param row 指定行 - */ - toggleRowExpand(row: any): Promise - /** - * 用于 expand-config，设置所有行的展开与否 - * 如果是关闭所有行，可以使用 clearRowExpand 快速清除 - * @param checked 是否选中 - */ - setAllRowExpand(checked: boolean): Promise - /** - * 用于 expand-config，设置展开行，二个参数设置这一行展开与否 - * @param rows 指定行 - * @param checked 是否选中 - */ - setRowExpand(rows: any | any[], checked: boolean): Promise - /** - * 用于 expand-config，判断行是否为展开状态 - * @param row 指定行 - */ - isRowExpandByRow(row: any | null): boolean - /** - * @deprecated 已废弃，请使用 isRowExpandByRow - */ - isExpandByRow(row: any | null): boolean - /** - * 用于 type=expand，手动清空展开行状态，数据会恢复成未展开的状态 - */ - clearRowExpand(): Promise - /** - * 用于 type=expand，手动清空用户保留行的展开状态 - */ - clearRowExpandReserve(): Promise - /** - * 用于 expand-config，用于展开行，获取已展开的行数据 - */ - getRowExpandRecords(): DT[] - /** - * 用于 tree-config，用于树表格，获取已展开的节点 - * 注意，即使父节点被收起，只要该节点还处于展开状态都能获取到 - */ - getTreeExpandRecords(): DT[] - /** - * 用于 tree-config.lazy，用于懒加载树表格，判断树节点是否懒加载完成 - */ - isTreeExpandLoaded(row: any | null): boolean - /** - * 用于 tree-config.lazy，手动清空懒加载树节点的状态，数据会恢复成未展开的状态，当再次展开时会重新加载 - */ - clearTreeExpandLoaded(row: any): Promise - /** - * 重新懒加载树节点，并展开该节点 - * @param rows 指定行 - */ - reloadTreeExpand(row: any): Promise - /** - * @deprecated 已废弃，请使用 reloadTreeExpand - */ - reloadTreeChilds(row: any): Promise - /** - * 用于 tree-config，切换展开树形节点的状态 - * @param row 指定行 - */ - toggleTreeExpand(row: any): Promise - /** - * 用于 tree-config，设置所有树节点的展开与否 - * 如果是关闭所有树节点，可以使用 clearTreeExpand 快速清除 - * @param checked 是否选中 - */ - setAllTreeExpand(checked: boolean): Promise - /** - * 用于 tree-config，设置展开树形节点，二个参数设置这一行展开与否 - * @param rows 指定行 - * @param checked 是否选中 - */ - setTreeExpand(rows: any | any[], checked: boolean): Promise - /** - * 用于 tree-config，判断行是否为树形节点展开状态 - * @param row 指定行 - */ - isTreeExpandByRow(row: any | null): boolean - /** - * 用于 tree-config，手动清空树形节点的展开状态，数据会恢复成未展开的状态 - */ - clearTreeExpand(): Promise - /** - * 用于 tree-config.reserve，手动清空用户保留树节点的展开状态 - */ - clearTreeExpandReserve(): Promise - /** - * 获取表格的滚动状态 - */ - getScroll(): { - virtualX: boolean - virtualY: boolean - scrollTop: number - scrollLeft: number - } - /** - * 如果有滚动条，则滚动到对应的位置 - * @param scrollLeft 左边距离 - * @param scrollTop 顶部距离 - */ - scrollTo(scrollLeft: number | null, scrollTop?: number | null): Promise - /** - * 如果有滚动条，则滚动到对应的行 - * @param row 指定行 - * @param columnOrField 列对象或字段名 - */ - scrollToRow(row: any, fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise - /** - * 如果有滚动条，则滚动到对应的列 - * @param columnOrField 列对象或字段名 - */ - scrollToColumn(fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo): Promise - /** - * 手动清除滚动相关信息，还原到初始状态 - */ - clearScroll(): Promise - /** - * 手动更新表尾 - */ - updateFooter(): Promise - /** - * 更新单元格状态 - * @param params 插槽对象 - */ - updateStatus( - params: { - row: DT - column: VxeTableDefines.ColumnInfo
- }, - cellValue?: any - ): Promise - /** - * 取消单元格的临时合并状态，如果为数组，则取消多个合并 - */ - removeMergeCells(merges: VxeTableDefines.MergeOptions | VxeTableDefines.MergeOptions[]): Promise - /** - * 取消表尾的临时合并状态，如果为数组，则取消多个合并 - */ - removeMergeFooterItems(merges: VxeTableDefines.MergeOptions | VxeTableDefines.MergeOptions[]): Promise - /** - * 临时合并单元格，如果为数组则合并多个 - */ - setMergeCells(merges: VxeTableDefines.MergeOptions | VxeTableDefines.MergeOptions[]): Promise - /** - * 临时合并表尾，如果为数组则合并多个 - */ - setMergeFooterItems(merges: VxeTableDefines.MergeOptions | VxeTableDefines.MergeOptions[]): Promise - /** - * 用于 mouse-config.area，更新已选区域的单元格样式 - */ - updateCellAreas(): Promise - /** - * 连接工具栏 - * @param toolbar 工具栏组件实例 - */ - connect(toolbar: VxeToolbarConstructor | VxeToolbarInstance): Promise - /** - * 使表格获取焦点 - */ - focus(): Promise - /** - * 使表格失去焦点 - */ - blur(): Promise -} - -export interface VxeTableMethods extends TableMethods { } - -export interface TablePrivateMethods { - getSetupOptions(): Required - updateAfterDataIndex(): void - callSlot(slotFunc: ((params: T) => SlotVNodeType | SlotVNodeType[]) | string | null, params: T): SlotVNodeType[] - getParentElem(): Element | null - getParentHeight(): number - getExcludeHeight(): number - defineField(records: any[]): any[] - handleTableData(force?: boolean): Promise - cacheRowMap(isSource?: boolean): void - cacheSourceMap(fullData: any[]): void - saveCustomResizable(isReset?: boolean): void - saveCustomSort(isReset?: boolean): void - saveCustomVisible(): void - saveCustomFixed(): void - analyColumnWidth(): void - checkSelectionStatus(): void - handleSelectRow(params: any, value: any, isForce?: boolean): void - handleCustom(): Promise - handleUpdateDataQueue(): void - handleRefreshColumnQueue(): void - preventEvent(evnt: any, type: any, args?: any, next?: any, end?: any): any - triggerHeaderTitleEvent(evnt: MouseEvent, iconParams: VxeColumnPropTypes.TitlePrefix | VxeColumnPropTypes.TitleSuffix, params: VxeTableDefines.CellRenderHeaderParams): void - triggerHeaderTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams): void - triggerBodyTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams): void - triggerFooterTooltipEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderFooterParams): void - handleTargetLeaveEvent(evnt: MouseEvent): void - triggerHeaderCellClickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams): void - triggerHeaderCellDblclickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams): void - triggerCellClickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams): void - triggerCellDblclickEvent(evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams): void - handleToggleCheckRowEvent(evnt: Event | null, params: { row: any }): void - triggerCheckRowEvent(evnt: Event, params: { row: any }, value: boolean): void - triggerCheckAllEvent(evnt: MouseEvent | null, value: boolean): void - triggerRadioRowEvent(evnt: Event, params: { row: any }): void - triggerCurrentRowEvent(evnt: Event, params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: any - rowIndex: number - $rowIndex: number - }): void - triggerRowExpandEvent(evnt: Event, params: VxeTableDefines.CellRenderBodyParams): void - triggerTreeExpandEvent(evnt: Event, params: VxeTableDefines.CellRenderBodyParams): void - triggerSortEvent(evnt: Event, column: VxeTableDefines.ColumnInfo, order: VxeTablePropTypes.SortOrder): void - triggerScrollXEvent(evnt: Event): void - triggerScrollYEvent(evnt: Event): void - scrollToTreeRow(row: any): Promise - updateScrollYStatus(fullData?: any[]): boolean - updateScrollXSpace(): void - updateScrollYSpace(): void - updateScrollXData(): void - updateScrollYData(): void - checkScrolling(): void - updateZindex(): void - handleCheckedCheckboxRow(rows: any, value: boolean, isForce?: boolean): Promise - triggerHoverEvent(evnt: any, params: any): void - setHoverRow(row: any): void - clearHoverRow(): void - getCell(row: any, column: VxeTableDefines.ColumnInfo): HTMLTableDataCellElement | null - getCellLabel(row: any, column: VxeTableDefines.ColumnInfo): any - findRowIndexOf(list: any[], row: any): number - eqRow(row1: any, row2: any): boolean -} - -export interface VxeTablePrivateMethods extends TablePrivateMethods { } - -export interface TableReactData { - // 低性能的静态列 - staticColumns: any[] - // 渲染的列分组 - tableGroupColumn: any[] - // 可视区渲染的列 - tableColumn: any[] - // 渲染中的数据 - tableData: D[] - // 是否启用了横向 X 可视渲染方式加载 - scrollXLoad: boolean - // 是否启用了纵向 Y 可视渲染方式加载 - scrollYLoad: boolean - // 是否存在纵向滚动条 - overflowY: boolean - // 是否存在横向滚动条 - overflowX: boolean - // 纵向滚动条的宽度 - scrollbarWidth: number - // 横向滚动条的高度 - scrollbarHeight: number - // 最后滚动时间戳 - lastScrollTime: number - // 行高 - rowHeight: number - // 表格父容器的高度 - parentHeight: number - // 是否使用分组表头 - isGroup: boolean - isAllOverflow: boolean - // 复选框属性，是否全选 - isAllSelected: boolean - // 复选框属性，有选中且非全选状态 - isIndeterminate: boolean - // 复选框属性，已选中的行集合 - selectCheckboxMaps: Record - // 当前行 - currentRow: D | null - // 单选框属性，选中列 - currentColumn: any - // 单选框属性，选中行 - selectRadioRow: D | null - // 表尾合计数据 - footerTableData: any[][] - // 展开列信息 - expandColumn: any - hasFixedColumn: boolean - // 已展开的行 - rowExpandedMaps: Record - // 懒加载中的展开行 - rowExpandLazyLoadedMaps: Record - // 树节点列信息 - treeNodeColumn: any - // 已展开树节点 - treeExpandedMaps: Record - // 懒加载中的树节点的集合 - treeExpandLazyLoadedMaps: Record - // 树节点不确定状态的集合 - treeIndeterminateMaps: Record - // 合并单元格的对象集 - mergeList: VxeTableDefines.MergeItem[] - // 合并表尾数据的对象集 - mergeFooterList: VxeTableDefines.MergeItem[] - // 刷新列标识，当列筛选被改变时，触发表格刷新数据 - upDataFlag: number - // 刷新列标识，当列的特定属性被改变时，触发表格刷新列 - reColumnFlag: number - // 已标记的对象集 - pendingRowMaps: Record - // 已标记的行 - pendingRowList: any[], - // 初始化标识 - initStore: { - filter: boolean - import: boolean - export: boolean - custom: boolean - }, - // 自定义列相关的信息 - customStore: VxeTableCustomStoreObj, - customColumnList: VxeTableDefines.ColumnInfo[] - // 当前选中的筛选列 - filterStore: { - isAllSelected: boolean - isIndeterminate: boolean - style: any - options: any[] - column: any - multiple: boolean - visible: boolean - maxHeight: number | null - [key: string]: any - }, - // 存放列相关的信息 - columnStore: { - leftList: VxeTableDefines.ColumnInfo[] - centerList: VxeTableDefines.ColumnInfo[] - rightList: VxeTableDefines.ColumnInfo[] - resizeList: VxeTableDefines.ColumnInfo[] - pxList: VxeTableDefines.ColumnInfo[] - pxMinList: VxeTableDefines.ColumnInfo[] - scaleList: VxeTableDefines.ColumnInfo[] - scaleMinList: VxeTableDefines.ColumnInfo[] - autoList: VxeTableDefines.ColumnInfo[] - }, - // 存放快捷菜单的信息 - ctxMenuStore: { - selected: any - visible: boolean - showChild: boolean - selectChild: any - list: any[][] - style: any - [key: string]: any - }, - // 存放可编辑相关信息 - editStore: { - indexs: { - columns: any[] - }, - titles: { - columns: any[] - }, - // 选中源 - selected: { - row: D | null - column: any - [key: string]: any - }, - // 已复制源 - copyed: { - cut: boolean - rows: D[] - columns: any[] - [key: string]: any - }, - // 激活 - actived: { - row: D | null - column: any - [key: string]: any - }, - // 当前被强制聚焦单元格，只会在鼠标点击后算聚焦 - focused: { - row: D | null - column: any - [key: string]: any - }, - insertMaps: { - [key: string]: any - } - removeMaps: { - [key: string]: any - } - }, - // 存放 tooltip 相关信息 - tooltipStore: { - row: D | null - column: any - content: any - visible: boolean - } - // 存放数据校验相关信息 - validStore: { - visible: boolean - }, - validErrorMaps: { - [key: string]: { - row: D | null - column: any - rule: any - content: any - } - }, - // 导入相关信息 - importStore: { - inited: boolean - file: any - type: any - modeList: any[] - typeList: any[] - filename: any - visible: boolean - }, - importParams: { - mode: any - types: any - message: boolean - }, - // 导出相关信息 - exportStore: { - inited: boolean - name: any - modeList: any[] - typeList: any[] - columns: any[] - isPrint: boolean - hasFooter: boolean - hasMerge: boolean - hasTree: boolean - hasColgroup: boolean - visible: boolean - }, - exportParams: { - filename: any - sheetName: any - mode: any - type: any - isColgroup: boolean - isMerge: boolean - isAllExpand: boolean - useStyle: boolean - original: boolean - message: boolean - isHeader: boolean - isFooter: boolean - }, - scrollVMLoading: boolean - _isResize: boolean -} - -export interface VxeTableCustomStoreObj { - btnEl: HTMLDivElement | null - isAll: boolean - isIndeterminate: boolean - activeBtn: boolean - activeWrapper: boolean - visible: boolean - maxHeight: number -} - -export interface VxeTableCustomStorageObj { - visible?: boolean - resizable?: boolean - fixed?: boolean - sort?: boolean -} - -export interface TableInternalData { - tZindex: number - elemStore: { - [key: string]: Ref | null - } - // 存放横向 X 虚拟滚动相关的信息 - scrollXStore: { - offsetSize: number - visibleSize: number - startIndex: number - endIndex: number - } - // 存放纵向 Y 虚拟滚动相关信息 - scrollYStore: { - adaptive?: boolean - rowHeight: number - offsetSize: number - visibleSize: number - startIndex: number - endIndex: number - } - // 表格宽度 - tableWidth: number - // 表格高度 - tableHeight: number - // 表头高度 - headerHeight: number - // 表尾高度 - footerHeight: number - customHeight: number - customMinHeight: number - customMaxHeight: number - // 当前 hover 行 - hoverRow: any - // 最后滚动位置 - lastScrollLeft: number - lastScrollTop: number - // 单选框属性，已选中保留的行 - radioReserveRow: any - // 复选框属性，已选中保留的行 - checkboxReserveRowMap: any - // 行数据，已展开保留的行集合 - rowExpandedReserveRowMap: Record - // 树结构数据，已展开保留的行集合 - treeExpandedReserveRowMap: Record - // 树结构数据，不确定状态的集合 - treeIndeterminateRowMaps: Record - // 列表完整数据、条件处理后 - tableFullData: D[] - afterFullData: D[] - afterTreeFullData: D[] - // 列表条件处理后数据集合 - afterFullRowMaps: Record - tableSynchData: D[] - tableSourceData: D[] - // 树的全量数据、条件处理后 - tableFullTreeData: D[] - // 收集的列配置（带分组） - collectColumn: VxeTableDefines.ColumnInfo[], - // 完整所有列（不带分组） - tableFullColumn: VxeTableDefines.ColumnInfo[] - // 渲染所有列 - visibleColumn: VxeTableDefines.ColumnInfo[] - // 缓存数据集 - fullAllDataRowIdData: { - [key: string]: { - row: D - rowid: string - seq: string | number - index: number - $index: number - _index: number - items: any[] - parent: any - level: number - treeLoaded?: boolean - expandLoaded?: boolean - formatData?: { - [key: string]: { - value: any - label: any - } - } - } - } - sourceDataRowIdData: Record - fullDataRowIdData: { - [key: string]: { - row: D - rowid: string - seq: string | number - index: number - $index: number - _index: number - items: any[] - parent: any - level: number - } - } - fullColumnIdData: { - [key: string]: { - column: VxeTableDefines.ColumnInfo - colid: string - index: number - $index: number - _index: number - items: VxeTableDefines.ColumnInfo[] - parent: VxeTableDefines.ColumnInfo - } - } - fullColumnFieldData: { - [key: string]: { - column: VxeTableDefines.ColumnInfo - colid: string - index: number - items: VxeTableDefines.ColumnInfo[] - parent: VxeTableDefines.ColumnInfo - } - } - - // 特殊标识 - inited: boolean - tooltipTimeout: any - initStatus: boolean - isActivated: boolean - - // 内部属性 - _lastResizeTime?: any - _keyCtx?: any - _lastCallTime?: any - _importResolve?: ((...args: any[]) => any) | null - _importReject?: ((...args: any[]) => any) | null - _currFilterParams?: any - _currMenuParams?: any -} - -export namespace VxeTablePropTypes { - export type Size = SizeType - export type ID = string - export type Data = T[] - export type Height = number | string - export type MinHeight = number | string - export type MaxHeight = number | string - export type Resizable = boolean - export type Stripe = boolean - export type Round = boolean - export type Border = boolean | 'default' | 'full' | 'outer' | 'inner' | 'none' | '' - export type Loading = boolean - export type Align = 'left' | 'center' | 'right' | '' | null - export type HeaderAlign = Align - export type FooterAlign = Align - export type ShowHeader = boolean - export type HighlightCurrentRow = boolean - export type HighlightHoverRow = boolean - export type HighlightCurrentColumn = boolean - export type HighlightHoverColumn = boolean - export type HighlightCell = boolean - export type ShowFooter = boolean - export type FooterData = Record[] - - export type FooterMethod = (params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null | undefined - columns: VxeTableDefines.ColumnInfo[] - data: D[] - }) => Array[] | VxeTableDataRow[] - - export type RowClassName = string | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - rowIndex: number - $rowIndex: number - _rowIndex: number - }) => void | null | string | { [key: string]: boolean }) - - export type CellClassName = string | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - rowIndex: number - $rowIndex: number - _rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - }) => void | null | string | { [key: string]: boolean }) - - export type HeaderRowClassName = string | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - $rowIndex: number - fixed: VxeColumnPropTypes.Fixed - type: string - }) => void | null | string | { [key: string]: boolean }) - - export type HeaderCellClassName = string | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - $rowIndex: number - column: VxeTableDefines.ColumnInfo - fixed: VxeColumnPropTypes.Fixed - type: string - }) => void | null | string | { [key: string]: boolean }) - - export type FooterRowClassName = string | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - $rowIndex: number - _rowIndex: number - fixed: VxeColumnPropTypes.Fixed - type: string - }) => void | null | string | { [key: string]: boolean }) - - export type FooterCellClassName = string | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - $rowIndex: number - _rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - }) => void | null | string | { [key: string]: boolean }) - - export type CellStyle = VNodeStyle | ((params: { - row: D - rowIndex: number - $rowIndex: number - _rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - }) => void | null | VNodeStyle) - - export type HeaderCellStyle = VNodeStyle | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - $rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - _columnIndex: number - }) => void | null | VNodeStyle) - - export type FooterCellStyle = VNodeStyle | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - $rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - }) => void | null | VNodeStyle) - - export type RowStyle = VNodeStyle | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - rowIndex: number - $rowIndex: number - _rowIndex: number - }) => void | null | VNodeStyle) - - export type HeaderRowStyle = VNodeStyle | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - $rowIndex: number - fixed: VxeColumnPropTypes.Fixed - type: string - }) => void | null | VNodeStyle) - - export type FooterRowStyle = VNodeStyle | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - $rowIndex: number - _rowIndex: number - fixed: VxeColumnPropTypes.Fixed - type: string - }) => void | null | VNodeStyle) - - export type MergeCell = VxeTableDefines.MergeOptions - export type MergeCells = MergeCell[] - export type MergeFooterItem = VxeTableDefines.MergeOptions - export type MergeFooterItems = MergeFooterItem[] - - export type SpanMethod = (params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - row: D - rowIndex: number - $rowIndex: number - _rowIndex: number - isHidden: boolean - fixed: VxeColumnPropTypes.Fixed - type: string - visibleData: D[] - }) => void | { rowspan: number, colspan: number } - - export type FooterSpanMethod = (params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - column: VxeTableDefines.ColumnInfo - columnIndex: number - _columnIndex: number - $columnIndex: number - row: D - $rowIndex: number - _rowIndex: number - items: any[] - data: D[][] - }) => void | { rowspan: number, colspan: number } - - export type ShowOverflow = boolean | 'ellipsis' | 'title' | 'tooltip' | '' | null - export type ShowHeaderOverflow = ShowOverflow - export type ShowFooterOverflow = ShowOverflow - export type ColumnKey = boolean - export type RowKey = boolean - export type RowId = string - export type KeepSource = boolean - export type AutoResize = boolean - export type SyncResize = boolean | string | number - - /** - * 响应式布局配置项 - */ - export interface ResizeConfig { - refreshDelay?: number - } - export interface ResizeOpts extends ResizeConfig { } - - /** - * 列配置信息 - */ - export interface ColumnConfig { - /** - * 是否需要为每一列的 VNode 设置 key 属性 - */ - useKey?: boolean - /** - * 当鼠标点击列头时，是否要高亮当前列 - */ - isCurrent?: boolean - /** - * 当鼠标移到列头时，是否要高亮当前头 - */ - isHover?: boolean - /** - * 每一列是否启用列宽调整 - */ - resizable?: VxeColumnPropTypes.Resizable - /** - * 每一列的宽度 - */ - width?: VxeColumnPropTypes.Width - /** - * 每一列的最小宽度 - */ - minWidth?: VxeColumnPropTypes.MinWidth - /** - * 每一列的最大宽度 - */ - maxWidth?: VxeColumnPropTypes.MaxWidth - /** - * 固定列允许设置的最大数量（如果是分组，则一个分组算一个） - */ - maxFixedSize?: number - /** - * 每一列的自定义表头单元格数据导出方法，返回自定义的标题 - */ - headerExportMethod?: VxeColumnPropTypes.HeaderExportMethod - /** - * 每一列的自定义单元格数据导出方法，返回自定义的值 - */ - exportMethod?: VxeColumnPropTypes.ExportMethod - /** - * 每一列的自定义表尾单元格数据导出方法，返回自定义的值 - */ - footerExportMethod?: VxeColumnPropTypes.FooterExportMethod - } - export interface ColumnOpts extends ColumnConfig { } - - /** - * 行配置信息 - */ - export interface RowConfig { - /** - * 是否需要为每一行的 VNode 设置 key 属性 - */ - useKey?: boolean - /** - * 自定义行数据唯一主键的字段名（默认自动生成） - */ - keyField?: string - /** - * 当鼠标点击行时，是否要高亮当前行 - */ - isCurrent?: boolean - /** - * 当鼠标移到行时，是否要高亮当前行 - */ - isHover?: boolean - /** - * 每一行开启调整行高度 - */ - resizable?: boolean - /** - * 只对 show-overflow 有效，每一行的高度 - */ - height?: number - } - export interface RowOpts extends RowConfig { } - - /** - * 自定义列配置项 - */ - export interface CustomConfig { - /** - * 是否启用 localStorage 本地保存，会将列操作状态保留在本地（需要有 id） - */ - storage?: boolean | VxeTableCustomStorageObj - mode?: 'simple' | 'popup' | '' | null - trigger?: string, - immediate?: boolean - /** - * 自定义列是否允许列选中的方法，该方法的返回值用来决定这一列的 checkbox 是否可以选中 - */ - checkMethod?(params: { column: VxeTableDefines.ColumnInfo }): boolean - /** - * 自定义列是否的方法，该方法的返回值用来决定这一列是否显示 - */ - visibleMethod?(params: { column: VxeTableDefines.ColumnInfo }): boolean - allowFixed?: boolean - showFooter?: boolean - icon?: string - resetButtonText?: string - confirmButtonText?: string - } - export interface CustomOpts extends CustomConfig { } - - /** - * 列调整配置项 - */ - export interface ResizableConfig { - /** - * 列宽拖动的最小宽度 - */ - minWidth?: number | string | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - $rowIndex: number - cell: HTMLElement - }) => number | string) - /** - * 列宽拖动的最大宽度 - */ - maxWidth?: number | string | ((params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - $rowIndex: number - cell: HTMLElement - }) => number | string) - } - export interface ResizableOpts extends ResizableConfig { } - - /** - * 序号配置项 - */ - export interface SeqConfig { - startIndex?: number - seqMethod?(params: { - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - row: D - rowIndex: number - $rowIndex: number - }): number | string - } - export interface SeqOpts extends SeqConfig { } - - interface SortConfigDefaultSort { - field: string - order: SortOrder - } - - /** - * 排序配置项 - */ - export interface SortConfig { - defaultSort?: SortConfigDefaultSort | SortConfigDefaultSort[] - orders?: SortOrder[] - sortMethod?(params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - data: D[] - sortList: VxeTableDefines.SortCheckedParams[] - }): any[] - remote?: boolean - multiple?: boolean - chronological?: boolean - trigger?: 'default' | 'cell' - showIcon?: boolean - iconLayout?: 'horizontal' | 'vertical' - iconAsc?: string - iconDesc?: string - } - export type SortOrder = 'asc' | 'desc' | '' | null - export interface SortOpts extends SortConfig { - orders: SortOrder[] - } - - /** - * 筛选配置项 - */ - export interface FilterConfig { - filterMethod?:(params: { - options: VxeTableDefines.FilterOption[] - values: any[] - cellValue: any - row: D - column: VxeTableDefines.ColumnInfo - }) => any - remote?: boolean - showIcon?: boolean - iconNone?: string - iconMatch?: string - confirmButtonText?: string - resetButtonText?: string - } - export interface FilterOpts extends FilterConfig { } - - /** - * 单选框配置 - */ - export interface RadioConfig { - reserve?: boolean - labelField?: string - checkRowKey?: string | number - checkMethod?(params: { - row: D - }): boolean - visibleMethod?(params: { - row: D - }): boolean - trigger?: 'default' | 'cell' | 'row' | '' | null - highlight?: boolean - strict?: boolean - } - export interface RadioOpts extends RadioConfig { } - - /** - * 复选框配置项 - */ - export interface CheckboxConfig { - reserve?: boolean - labelField?: string - checkField?: string - indeterminateField?: string - showHeader?: boolean - checkAll?: boolean - checkRowKeys?: string[] | number[] - checkStrictly?: boolean - strict?: boolean - isShiftKey?: boolean - checkMethod?(params: { - row: D - }): boolean - visibleMethod?(params: { - row: D - }): boolean - trigger?: 'default' | 'cell' | 'row' | '' | null - highlight?: boolean - range?: boolean - - /** - * 请使用 indeterminateField - * @deprecated - */ - halfField?: string - } - export interface CheckboxOpts extends CheckboxConfig { } - - /** - * 提示信息配置项 - */ - export interface TooltipConfig { - showAll?: boolean - theme?: 'dark' | 'light' | '' | null - enterable?: boolean - enterDelay?: number - leaveDelay?: number - contentMethod?(params: { - items: any[] - row: D - rowIndex: number - $rowIndex: number - _rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - type: 'header' | 'body' | 'footer' | '' | null - cell: HTMLElement - $event: any - }): string | null | void - } - export interface TooltipOpts extends TooltipConfig { } - - /** - * 展开行配置项 - */ - export interface ExpandConfig { - labelField?: string - expandAll?: boolean - expandRowKeys?: string[] | number[] - accordion?: boolean - trigger?: 'default' | 'cell' | 'row' | '' | null - lazy?: boolean - reserve?: boolean - height?: number - loadMethod?(params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - rowIndex: number - $rowIndex: number - }): Promise - toggleMethod?(params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - expanded: boolean - row: D - rowIndex: number - $rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - }): boolean - visibleMethod?(params: VxeTableDefines.CellRenderBodyParams): boolean - showIcon?: boolean - iconOpen?: string - iconClose?: string - iconLoaded?: string - } - export interface ExpandOpts extends ExpandConfig { } - - /** - * 树形结构配置项 - */ - export interface TreeConfig { - /** - * 自动将列表转为树结构 - */ - transform?: boolean - /** - * 用于 tree-config.transform，树节点的字段名 - */ - rowField?: string - /** - * 用于 tree-config.transform，树父节点的字段名 - */ - parentField?: string - /** - * 树子节点的字段名 - */ - childrenField?: string - /** - * 用于 tree-config.transform，树子节点映射的字段名 - */ - mapChildrenField?: string - /** - * 树节点的缩进 - */ - indent?: number - /** - * 树节点的连接线（启用连接线会降低渲染性能） - */ - showLine?: boolean - /** - * 默认展开所有子孙树节点（只会在初始化时被触发一次） - */ - expandAll?: boolean - /** - * 默认展开指定树节点（只会在初始化时被触发一次，需要有 row-config.keyField） - */ - expandRowKeys?: string[] | number[] - /** - * 对于同一级的节点，每次只能展开一个 - */ - accordion?: boolean - /** - * 触发方式（注：当多种功能重叠时，会同时触发） - */ - trigger?: 'default' | 'cell' | 'row' | '' | null - /** - * 是否使用懒加载（启用后只有指定 hasChildField 字段的节点才允许被点击） - */ - lazy?: boolean - /** - * 只对 lazy 启用后有效，标识是否存在子节点，从而控制是否允许被点击 - */ - hasChildField?: string - /** - * 是否保留展开状态，对于某些场景可能会用到，比如数据被刷新之后还保留之前展开的状态（需要有 row-config.keyField） - */ - reserve?: boolean - /** - * 该方法用于异步加载子节点 - */ - loadMethod?(params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - row: D - }): Promise - /** - * 该方法在展开或关闭触发之前调用，可以通过返回值来决定是否允许继续执行 - */ - toggleMethod?(params: { - $table: VxeTableConstructor & VxeTablePrivateMethods - expanded: boolean - row: D - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - }): boolean - /** - * 是否显示图标按钮 - */ - showIcon?: boolean - /** - * 自定义展开后显示的图标 - */ - iconOpen?: string - /** - * 自定义收起后显示的图标 - */ - iconClose?: string - /** - * 自定义懒加载中显示的图标 - */ - iconLoaded?: string - - /** - * 已废弃，请使用 showLine - * @deprecated - */ - line?: boolean - /** - * 已废弃，请使用 hasChildField - * @deprecated - */ - hasChild?: string - /** - * 已废弃，请使用 childrenField - * @deprecated - */ - children?: string - } - export type TreeOpts = Required> - - /** - * 快捷菜单配置项 - */ - export interface MenuConfig { - /** - * 是否启用 - */ - enabled?: boolean - /** - * 表头的右键菜单 - */ - header?: VxeTableDefines.MenuOptions - /** - * 内容的右键菜单 - */ - body?: VxeTableDefines.MenuOptions - /** - * 表尾的右键菜单 - */ - footer?: VxeTableDefines.MenuOptions - /** - * 触发方式 - * default（默认右键表格触发）, cell（右键单元格触发） - */ - trigger?: 'default' | 'cell' | '' | null - /** - * 菜单面板的 className - */ - className?: string - /** - * 该函数的返回值用来决定是否允许显示右键菜单（对于需要对菜单进行权限控制时可能会用到） - */ - visibleMethod?(params: { - type: string - options: VxeTableDefines.MenuFirstOption[][] - columns: VxeTableDefines.ColumnInfo[] - row?: D - rowIndex?: number - column?: VxeTableDefines.ColumnInfo - columnIndex?: number - }): boolean - } - export type MenuOpts = Required> - - /** - * 鼠标配置项 - */ - export interface MouseConfig { - /** - * 开启单元格选中功能（只对 edit-config.mode=cell 有效） - */ - selected?: boolean - /** - * 如果功能被支持，则开启单元格区域选取功能，非连续的区域，按住 Ctrl 键，用鼠标逐一选取 - */ - area?: boolean - /** - * 只对 area 启用后有效，是否开启区域扩展选取功能，开启后可以通过鼠标左键按住区域内右下角扩展按钮，将区域横向或纵向扩大（支持扩大区域并复制值） - */ - extension?: boolean - } - export interface MouseOpts extends MouseConfig { } - - /** - * 区域配置项 - */ - export interface AreaConfig { - /** - * 只对 mouse-config.area 启用后有效，启用多区域选取功能 - */ - multiple?: boolean - /** - * 用于指定哪些列允许被选取 - */ - includeFields?: string[] - /** - * 用于排除指定列允许不允许被选取 - */ - excludeFields?: string[] - /** - * 只对 mouse-config.area 启用后有效，点击列头是否选取当前列的所有单元格 - */ - selectCellByHeader?: boolean - /** - * 只对 mouse-config.extension 启用后有效，将被选取区域的值复制到扩展区域中 - */ - extendByCopy?: boolean - /** - * 只对 mouse-config.extension 启用后有效，扩展区域时将自动识别数字规则进行计算 - */ - extendByCalc?: boolean - /** - * 当点击表格之外，是否自动清除单元格的选取状态 - */ - autoClear?: boolean - /** - * 只对 extendByCalc 启用后有效，重写单元格扩展区域计算值的方法 - * @param params - */ - extendCalcMethod?(params: VxeTableProDefines.ExtendCellAreaCalcBaseParams): any[][] - /** - * 只对 extendByCopy | extendByCalc 启用后有效，重写单元格扩展区域赋值的方法 - * @param params - */ - extendSetMethod?(params: { - cellValue: any - row: D - column: VxeTableDefines.ColumnInfo - } & VxeTableProDefines.ExtendCellAreaCalcBaseParams): void - /** - * 只对 extendByCopy | extendByCalc 启用后有效，自定义单元格扩展区域赋值之前的方法，可以通过返回 false 阻止扩展行为 - * @param params - */ - beforeExtendSetMethod?(params: VxeTableProDefines.ExtendCellAreaCalcBaseParams): boolean - /** - * 只对 extendByCopy | extendByCalc 启用后有效，自定义单元格扩展区域赋值之后的方法 - * @param params - */ - afterExtendSetMethod?(params: { - extendValues: any[][] - } & VxeTableProDefines.ExtendCellAreaCalcBaseParams): boolean - } - export interface AreaOpts extends AreaConfig { } - - /** - * 按键配置项 - */ - export interface KeyboardConfig { - /** - * 是否开启非编辑状态下，上下左右移动功能 - */ - isArrow?: boolean - /** - * 是否开启Esc键退出编辑功能 - */ - isEsc?: boolean - /** - * 是否开启删除键功能 - */ - isDel?: boolean - /** - * 是否开启回车移动上下行移动 - */ - isEnter?: boolean - /** - * 如果功能被支持，用于 mouse-config.area，开启同时按住方向键以活动区域为起始，向指定方向延伸单元格区域 - */ - isShift?: boolean - /** - * 是否开启TAB键左右移动功能 - */ - isTab?: boolean - /** - * 是否开启单元格选择编辑 - */ - isEdit?: boolean - /** - * 用于 mouse-config.area，开启合并和取消合并功能 - */ - isMerge?: boolean - /** - * 用于 mouse-config.area，开启复制/剪贴/粘贴功能 - */ - isClip?: boolean - /** - * 如果功能被支持，用于 mouse-config.area，开启查找和替换功能 - */ - isFNR?: boolean - /** - * 用于 mouse-config.area & column.type=checkbox|radio，开启空格键切换复选框或单选框状态功能 - */ - isChecked?: boolean - /** - * 用于 mouse-config.area，方向键光标锁，开启后将支持两种状态 - * 非聚焦式输入状态：默认情况下，可以按方向键移动单元格。 - * 聚焦式输入状态：如果需要移动光标，可以按 F2 键或者鼠标左键点击输入框，切换为聚焦输入状态，就可以用方向键左右移动光标 - */ - arrowCursorLock?: boolean - /** - * 用于 mouse-config.area，是否将回车键行为改成 Tab 键行为 - */ - enterToTab?: boolean - /** - * 只对 isDel=true 有效，用于删除键清空单元格内容方法 - */ - delMethod?(params: { - row: D - rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $table: VxeTableConstructor & VxeTablePrivateMethods - }): void - /** - * 只对 isDel=true 有效，用于重写回退键清空单元格内容并激活为编辑状态方法 - */ - backMethod?(params: { - row: D - rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $table: VxeTableConstructor & VxeTablePrivateMethods - }): void - /** - * 只对 isEdit=true 有效，用于重写编辑单元格方法 - */ - editMethod?(params: { - row: D - rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null | undefined - }): boolean - } - export interface KeyboardOpts extends KeyboardConfig { } - - /** - * 复制/粘贴配置项 - */ - export interface ClipConfig
{ - /** - * 是否启用复制功能 - */ - isCopy?: boolean - /** - * 是否启用剪贴功能 - */ - isCut?: boolean - /** - * 是否启用粘贴功能 - */ - isPaste?: boolean - /** - * 是否填充粘贴，如果启用了，当被选取的粘贴单元格与粘贴单元格的行与列数量不匹配时，会将内容强制粘贴所选的单元格 - */ - isFillPaste?: boolean - /** - * 是否启用行自增，当粘贴的行数超出表格时自动插入新行 - */ - isRowIncrement?: boolean - /** - * 是否启用列自增，当粘贴的列数超出表格时自动插入新列（需要注意自增的列自字段是否定义，否则将无法响应） - */ - isColumnIncrement?: boolean - /** - * 用于指定哪些列允许被复制粘贴 - */ - includeFields?: string[] - /** - * 用于排除指定列允许不允许被复制粘贴 - */ - excludeFields?: string[] - /** - * 重写单元格复制取值的方法，将单元格复制到剪贴板 - */ - copyMethod?(params: { - isCut: boolean - row: DT - column: VxeTableDefines.ColumnInfo
- cellValue: any - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): string - /** - * 自定义单元格复制取值之前的方法，可以通过返回 false 阻止复制行为 - */ - beforeCopyMethod?(params: { - isCut: boolean - activeArea: VxeTableProDefines.MouseActiveCellArea - targetAreas: VxeTableProDefines.CellAreaParams
[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): boolean - /** - * 自定义单元格复制到剪贴板之后的方法 - */ - afterCopyMethod?(params: { - isCut: boolean - targetAreas: VxeTableProDefines.CellAreaParams
[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): boolean - /** - * 重写单元格剪贴值清除的方法，将剪贴单元格的值清除 - */ - cutMethod?:(params: { - row: DT, - column: VxeTableDefines.ColumnInfo
- cellValue: any - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }) => void - /** - * 自定义单元格剪贴值清除之前的方法，可以通过返回 false 阻止清除行为 - */ - beforeCutMethod?:(params: { - activeArea: VxeTableProDefines.MouseActiveCellArea - cutAreas: VxeTableProDefines.CellAreaParams
[] - currentAreas: VxeTableProDefines.CellAreaParams
[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }) => boolean - /** - * 自定义单元格剪贴值清除之后的方法 - */ - afterCutMethod?:(params: { - cutAreas: VxeTableProDefines.CellAreaParams
[] - currentAreas: VxeTableProDefines.CellAreaParams
[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }) => void - /** - * 重写单元格粘贴赋值的方法，从剪贴板赋值到单元格 - */ - pasteMethod?(params: { - isCut: boolean - row: DT, - column: VxeTableDefines.ColumnInfo
- cellValue: any - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): void - /** - * 自定义单元格粘贴赋值之前的方法，可以通过返回 false 阻止复制行为 - */ - beforePasteMethod?(params: { - isCut: boolean - activeArea: VxeTableProDefines.MouseActiveCellArea - cutAreas: VxeTableProDefines.CellAreaParams
[] - currentAreas: VxeTableProDefines.CellAreaParams
[] - targetAreas: VxeTableProDefines.CellAreaParams
[] - cellValues: string[][] - pasteCells: string[][] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): boolean - /** - * 自定义单元格粘贴赋值之后的方法 - */ - afterPasteMethod?(params: { - isCut: boolean - currentAreas: VxeTableProDefines.CellAreaParams
[] - cutAreas: VxeTableProDefines.CellAreaParams
[] - targetAreas: VxeTableProDefines.CellAreaParams
[] - cellValues: any[][] - pasteCells: string[][] - insertRows: DT[] - insertColumns: VxeTableDefines.ColumnInfo
[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): boolean - /** - * 只对 isRowIncrement 有效，自定义创建自增行数据的方法 - */ - createRowsMethod?(params: { - currentAreas: VxeTableProDefines.CellAreaParams
[] - targetAreas: VxeTableProDefines.CellAreaParams
[] - cellValues: any[][] - pasteCells: string[][] - insertRows: DT[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): DT[] - /** - * 只对 isColumnIncrement 有效，自定义创建自增列配置的方法 - */ - createColumnsMethod?(params: { - currentAreas: VxeTableProDefines.CellAreaParams
[] - targetAreas: VxeTableProDefines.CellAreaParams
[] - cellValues: any[][] - pasteCells: string[][] - insertColumns: VxeTableDefines.ColumnOptions[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): VxeTableDefines.ColumnOptions
[] - } - export interface ClipOpts extends ClipConfig { } - - /** - * 查找/替换配置项 - */ - export interface FNRConfig
{ - /** - * 是否启用查找功能 - */ - isFind?: boolean - /** - * 自定义单元格查找方法 - */ - findMethod?(params: { - cellValue: any - isWhole: boolean - isRE: boolean - isSensitive: boolean - findValue: string | null - findRE: RegExp | null - }): boolean - /** - * 自定义单元格查找之前的方法，可以通过返回 false 阻止查找行为 - */ - beforeFindMethod?(params: { - isAll: boolean - findValue: string | null - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): boolean - /** - * 自定义单元格查找之后的方法 - */ - afterFindMethod?(params: { - isAll: boolean - findValue: string | null - result: VxeTableProDefines.FindAndReplaceResult[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): void - /** - * 是否启用替换功能 - */ - isReplace?: boolean - /** - * 自定义单元格替换方法 - */ - replaceMethod?:(params: { - row: DT - column: VxeTableDefines.ColumnInfo
- cellValue: any - }) => void - /** - * 自定义单元格替换之前的方法，可以通过返回 false 阻止替换行为 - */ - beforeReplaceMethod?:(params: { - isAll: boolean - findValue: string | null - replaceValue: string - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }) => boolean - /** - * 自定义单元格替换之后的方法 - */ - afterReplaceMethod?:(params: { - isAll: boolean - findValue: string | null - replaceValue: string - result: VxeTableProDefines.FindAndReplaceResult[] - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }) => void - } - export interface FNROpts extends FNRConfig { } - - /** - * 编辑配置项 - */ - export interface EditConfig
{ - /** - * 触发方式 - * - manual（手动触发方式，只能用于 mode=row） - * - click（点击触发编辑） - * - dblclick（双击触发编辑） - */ - trigger?: 'manual' | 'click' | 'dblclick' | '' | null - /** - * 是否启用 - */ - enabled?: boolean - /** - * 编辑模式 - * - cell（单元格编辑模式） - * - row（行编辑模式） - */ - mode?: 'cell' | 'row' | '' | null - /** - * 自定义可编辑列的状态图标 - */ - icon?: string - /** - * 是否显示列头编辑图标 - */ - showIcon?: boolean - /** - * 只对 keep-source 开启有效，是否显示单元格新增与修改状态 - */ - showStatus?: boolean - /** - * 只对 keep-source 开启有效，是否显示单元格修改状态 - */ - showUpdateStatus?: boolean - /** - * 只对 keep-source 开启有效，是否显示单元格新增状态 - */ - showInsertStatus?: boolean - /** - * 是否显示必填字段的红色星号 - */ - showAsterisk?: boolean - /** - * 当点击表格之外或者非编辑列之后，是否自动清除单元格的激活状态 - */ - autoClear?: boolean - /** - * 自定义编辑之前逻辑，该方法的返回值用来决定该单元格是否允许编辑 - */ - beforeEditMethod?(params: { - row: DT - rowIndex: number - column: VxeTableDefines.ColumnInfo
- columnIndex: number - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): boolean - /** - * 自定义编辑之后逻辑 - */ - afterEditMethod?(params: { - row: DT - rowIndex: number - column: VxeTableDefines.ColumnInfo
- columnIndex: number - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): void - - /** - * 请使用 beforeEditMethod - * @deprecated - */ - activeMethod?(params: { - row: DT - rowIndex: number - column: VxeTableDefines.ColumnInfo
- columnIndex: number - $table: VxeTableConstructor
& VxeTablePrivateMethods
- $grid: VxeGridConstructor
| null | undefined - }): boolean - } - export interface EditOpts extends EditConfig { } - - /** - * 校验配置项 - */ - export interface ValidConfig { - /** - * 是否自动定位到校验不通过的单元格 - */ - autoPos?: boolean - /** - * 是否显示错误显示 - */ - showMessage?: boolean - /** - * 校验消息提示方式 - * - single 单个提示 - * - full - 全量提示 - */ - msgMode?: 'single' | 'full' | null | '' - /** - * 当点击表格之外或者其他列之后，是否自动清除单元格的校验消息 - */ - autoClear?: boolean - /** - * 校验提示框的最大宽度 - */ - maxWidth?: number - /** - * 给校验提示框附加 class - */ - className?: string | ((params: VxeColumnSlotTypes.ValidSlotParams) => string) - - /** - * 不建议使用，已废弃 - * @deprecated - */ - message?: 'inline' | 'default' | 'tooltip' | '' | null - } - export interface ValidOpts extends ValidConfig { } - - /** - * 校验规则配置项 - */ - export interface EditRules { - [field: string]: VxeTableDefines.ValidatorRule[] - } - - export type ZIndex = number - export type EmptyText = string - - export interface LoadingConfig { - /** - * 显示图标 - */ - icon?: string - /** - * 显示文字 - */ - text?: string - } - export interface LoadingOpts extends LoadingConfig { } - - export interface EmptyRender extends VxeGlobalRendererHandles.RenderOptions { } - export interface EmptyOpts extends EmptyRender { } - - export type Fit = boolean - export type Animat = boolean - export type DelayHover = number - - export interface ScrollX { - /** - * 指定大于指定列时自动启动横向虚拟滚动，如果为 0 则总是启用；如果需要关闭，可以设置 enabled 为 false - */ - gt?: number - /** - * 指定每次渲染的数据偏移量，偏移量越大渲染次数就越少，但每次渲染耗时就越久（对于低性能浏览器可以设置大一点，减低渲染次数） - */ - oSize?: number - /** - * 是否启用 - */ - enabled?: boolean - /** - * 当数据源被更改时，自动将横向滚动条滚动到左侧 - */ - scrollToLeftOnChange?: boolean - } - export interface SXOpts extends ScrollX { - gt: number - oSize: number - } - - export interface ScrollY { - /** - * 滚动模式 - */ - mode?: 'default' | 'wheel' - /** - * 指定大于指定行时自动启动纵向虚拟滚动，如果为 0 则总是启用；如果需要关闭，可以设置 enabled 为 false（注：启用纵向虚拟滚动之后将不能支持动态行高） - */ - gt?: number - /** - * 指定每次渲染的数据偏移量，偏移量越大渲染次数就越少，但每次渲染耗时就越久（对于低性能浏览器可以设置大一点，减低渲染次数） - */ - oSize?: number - /** - * 是否启用 - */ - enabled?: boolean - /** - * 当数据源被更改时，自动将纵向滚动条滚动到顶部 - */ - scrollToTopOnChange?: boolean - - /** - * 请使用 row-config.height - * @deprecated - */ - rHeight?: number - /** - * 不建议使用 - * @deprecated - */ - adaptive?: boolean - } - export interface SYOpts extends ScrollY { - gt: number - oSize: number - } - - export type Params = any -} - -export type VxeTableProps = { - size?: VxeTablePropTypes.Size - /** - * 唯一标识 - * 当使用某个特定功能时，需要设置才能生效 - */ - id?: VxeTablePropTypes.ID - /** - * 表格数据 - * 与 loadData 行为一致，更新数据是不会重置状态 - */ - data?: VxeTablePropTypes.Data - /** - * 表格的高度；支持铺满父容器或者固定高度，如果设置 auto 为铺满父容器（如果设置为 auto，则必须确保存在父节点且不允许存在相邻元素） - */ - height?: VxeTablePropTypes.Height - /** - * 表格最小高度 - */ - minHeight?: VxeTablePropTypes.MinHeight - /** - * max-height - */ - maxHeight?: VxeTablePropTypes.MaxHeight - /** - * 是否带有斑马纹（需要注意的是，在可编辑表格场景下，临时插入的数据不会有斑马纹样式） - */ - stripe?: VxeTablePropTypes.Stripe - /** - * 是否为圆角边框 - */ - round?: VxeTablePropTypes.Round - /** - * 是否带有边框 - */ - border?: VxeTablePropTypes.Border - /** - * 表格是否显示加载中 - */ - loading?: VxeTablePropTypes.Loading - /** - * 所有的列对齐方式 - */ - align?: VxeTablePropTypes.Align - /** - * 所有的表头列的对齐方式 - */ - headerAlign?: VxeTablePropTypes.HeaderAlign - /** - * 所有的表尾列的对齐方式 - */ - footerAlign?: VxeTablePropTypes.FooterAlign - /** - * 是否显示表头 - */ - showHeader?: VxeTablePropTypes.ShowHeader - /** - * 是否显示表尾 - */ - showFooter?: VxeTablePropTypes.ShowFooter - /** - * 表尾数据 - */ - footerData?: VxeTablePropTypes.FooterData - /** - * 表尾的数据获取方法，返回一个二维数组 - */ - footerMethod?: VxeTablePropTypes.FooterMethod - /** - * 给行附加 className - */ - rowClassName?: VxeTablePropTypes.RowClassName - /** - * 给单元格附加 className - */ - cellClassName?: VxeTablePropTypes.CellClassName - /** - * 给表头的行附加 className - */ - headerRowClassName?: VxeTablePropTypes.HeaderRowClassName - /** - * 给表头的单元格附加 className - */ - headerCellClassName?: VxeTablePropTypes.HeaderCellClassName - /** - * 给表尾的行附加 className - */ - footerRowClassName?: VxeTablePropTypes.FooterRowClassName - /** - * 给表尾的单元格附加 className - */ - footerCellClassName?: VxeTablePropTypes.FooterCellClassName - /** - * 给单元格附加样式 - */ - cellStyle?: VxeTablePropTypes.CellStyle - /** - * 给行附加样式，也可以是函数 - */ - rowStyle?: VxeTablePropTypes.RowStyle - /** - * 给表头单元格附加样式 - */ - headerCellStyle?: VxeTablePropTypes.HeaderCellStyle - /** - * 给表头行附加样式 - */ - headerRowStyle?: VxeTablePropTypes.HeaderRowStyle - /** - * 给表尾行附加样式 - */ - footerRowStyle?: VxeTablePropTypes.FooterRowStyle - /** - * 给表尾单元格附加样式 - */ - footerCellStyle?: VxeTablePropTypes.FooterCellStyle - /** - * 临时合并指定的单元格 (不能用于展开行，不建议用于固定列、树形结构) - */ - mergeCells?: VxeTablePropTypes.MergeCells - /** - * 临时合并表尾 (不能用于展开行，不建议用于固定列、树形结构) - */ - mergeFooterItems?: VxeTablePropTypes.MergeFooterItems - /** - * 自定义合并函数，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构) - */ - spanMethod?: VxeTablePropTypes.SpanMethod - /** - * 表尾合并行或列，返回计算后的值 (不能用于虚拟滚动、展开行，不建议用于固定列、树形结构) - */ - footerSpanMethod?: VxeTablePropTypes.FooterSpanMethod - /** - * 设置所有内容过长时显示为省略号（如果是固定列建议设置该值，提升渲染速度） - */ - showOverflow?: VxeTablePropTypes.ShowOverflow - /** - * 设置表头所有内容过长时显示为省略号 - */ - showHeaderOverflow?: VxeTablePropTypes.ShowHeaderOverflow - /** - * 设置表尾所有内容过长时显示为省略号 - */ - showFooterOverflow?: VxeTablePropTypes.ShowFooterOverflow - /** - * 保持原始值的状态，被某些功能所依赖，比如编辑状态、还原数据等 - */ - keepSource?: VxeTablePropTypes.KeepSource - /** - * 自动监听父元素的变化去重新计算表格（对于父元素可能存在动态变化、显示隐藏的容器中、列宽异常等场景中的可能会用到） - */ - autoResize?: VxeTablePropTypes.AutoResize - /** - * 自动跟随某个属性的变化去重新计算表格，和手动调用 recalculate 方法是一样的效果（对于通过某个属性来控制显示/隐藏切换时可能会用到） - */ - syncResize?: VxeTablePropTypes.SyncResize - /** - * 列配置信息 - */ - columnConfig?: VxeTablePropTypes.ColumnConfig - /** - * 行配置信息 - */ - rowConfig?: VxeTablePropTypes.RowConfig - /** - * 个性化信息配置项 - */ - customConfig?: VxeTablePropTypes.CustomConfig - /** - * 响应式布局配置项 - */ - resizeConfig?: VxeTablePropTypes.ResizeConfig - /** - * 列宽拖动配置项 - */ - resizableConfig?: VxeTablePropTypes.ResizableConfig - /** - * 序号配置项 - */ - seqConfig?: VxeTablePropTypes.SeqConfig - /** - * 排序配置项 - */ - sortConfig?: VxeTablePropTypes.SortConfig - /** - * 筛选配置项 - */ - filterConfig?: VxeTablePropTypes.FilterConfig - /** - * 单选框配置项 - */ - radioConfig?: VxeTablePropTypes.RadioConfig - /** - * 复选框配置项 - */ - checkboxConfig?: VxeTablePropTypes.CheckboxConfig - /** - * 工具提示配置项 - */ - tooltipConfig?: VxeTablePropTypes.TooltipConfig - /** - * 导出配置项 - */ - exportConfig?: VxeTablePropTypes.ExportConfig - /** - * 导入配置项 - */ - importConfig?: VxeTablePropTypes.ImportConfig - /** - * 打印配置项 - */ - printConfig?: VxeTablePropTypes.PrintConfig - /** - * 展开行配置项 - */ - expandConfig?: VxeTablePropTypes.ExpandConfig - /** - * 树形结构配置项 - */ - treeConfig?: VxeTablePropTypes.TreeConfig - /** - * 右键菜单配置项 - */ - menuConfig?: VxeTablePropTypes.MenuConfig - /** - * 鼠标配置项 - */ - mouseConfig?: VxeTablePropTypes.MouseConfig - /** - * 区域选取配置项 - */ - areaConfig?: VxeTablePropTypes.AreaConfig - /** - * 查找/替换配置项 - */ - fnrConfig?: VxeTablePropTypes.FNRConfig - /** - * 按键配置项 - */ - keyboardConfig?: VxeTablePropTypes.KeyboardConfig - /** - * 复制/粘贴配置项 - */ - clipConfig?: VxeTablePropTypes.ClipConfig - /** - * 可编辑配置项 - */ - editConfig?: VxeTablePropTypes.EditConfig - /** - * 校验配置项 - */ - validConfig?: VxeTablePropTypes.ValidConfig - /** - * 校验规则配置项 - */ - editRules?: VxeTablePropTypes.EditRules - /** - * 空数据时显示的内容 - */ - emptyText?: VxeTablePropTypes.EmptyText - /** - * 空内容渲染配置项，empty-render 的优先级大于 empty-text - */ - emptyRender?: VxeTablePropTypes.EmptyRender - /** - * 加载中配置项 - */ - loadingConfig?: VxeTablePropTypes.LoadingConfig - /** - * 横向虚拟滚动配置 - */ - scrollX?: VxeTablePropTypes.ScrollX - /** - * 纵向虚拟滚动配置 - */ - scrollY?: VxeTablePropTypes.ScrollY - /** - * 自定义参数（可以用来存放一些自定义的数据） - */ - params?: VxeTablePropTypes.Params - - /** - * 已废弃，不建议使用，被 column-config.resizable 替换 - * @deprecated - */ - resizable?: VxeTablePropTypes.Resizable - /** - * 已废弃，不建议使用，被 row-config.isCurrent 替换 - * @deprecated - */ - highlightCurrentRow?: VxeTablePropTypes.HighlightCurrentRow - /** - * 已废弃，不建议使用，被 row-config.isHover 替换 - * @deprecated - */ - highlightHoverRow?: VxeTablePropTypes.HighlightHoverRow - /** - * 已废弃，不建议使用，被 column-config.isCurrent 替换 - * @deprecated - */ - highlightCurrentColumn?: VxeTablePropTypes.HighlightCurrentColumn - /** - * 已废弃，不建议使用，被 column-config.isHover 替换 - * @deprecated - */ - highlightHoverColumn?: VxeTablePropTypes.HighlightHoverColumn - /** - * 已废弃 - * @deprecated - */ - highlightCell?: VxeTablePropTypes.HighlightCell - /** - * 已废弃，请使用 column-config.useKey - * @deprecated - */ - columnKey?: VxeTablePropTypes.ColumnKey - /** - * 已废弃，请使用 row-config.useKey - * @deprecated - */ - rowKey?: VxeTablePropTypes.RowKey - /** - * 已废弃，请使用 row-config.keyField - * @deprecated - */ - rowId?: VxeTablePropTypes.RowId - /** - * 已废弃，已废弃 - * @deprecated - */ - fit?: VxeTablePropTypes.Fit - /** - * 已废弃，已废弃 - * @deprecated - */ - animat?: VxeTablePropTypes.Animat - /** - * 已废弃，已废弃 - * @deprecated - */ - delayHover?: VxeTablePropTypes.DelayHover -} - -export type VxeTableEmits = [ - 'update:data', - 'keydown-start', - 'keydown', - 'keydown-end', - 'paste', - 'copy', - 'cut', - 'current-change', - 'radio-change', - 'checkbox-change', - 'checkbox-all', - 'checkbox-range-start', - 'checkbox-range-change', - 'checkbox-range-end', - 'checkbox-range-select', - 'cell-click', - 'cell-dblclick', - 'cell-menu', - 'cell-mouseenter', - 'cell-mouseleave', - 'cell-selected', - 'cell-delete-value', - 'header-cell-click', - 'header-cell-dblclick', - 'header-cell-menu', - 'footer-cell-click', - 'footer-cell-dblclick', - 'footer-cell-menu', - 'clear-merge', - 'sort-change', - 'clear-sort', - 'filter-change', - 'filter-visible', - 'clear-filter', - 'resizable-change', - 'toggle-row-expand', - 'toggle-tree-expand', - 'menu-click', - 'edit-closed', - - 'edit-actived', // 已废弃 - - 'edit-activated', - 'edit-disabled', - 'valid-error', - 'scroll', - 'custom', - ...VxeTableProEmits, - 'load-table-data' -] - -export namespace VxeTableDefines { - export interface SortConfs { - field: string - order?: VxeTablePropTypes.SortOrder - } - - export interface MergeOptions { - row: any | number - col: VxeTableDefines.ColumnInfo | number - rowspan: number - colspan: number - } - - export interface MergeInfo { - row: number - col: number - rowspan: number - colspan: number - } - - export interface MergeItem extends MergeInfo { - _row: any - _col: VxeTableDefines.ColumnInfo - _rowspan: number - _colspan: number - } - - export interface ColumnOptions extends VxeColumnProps { - children?: ColumnOptions[] - slots?: VxeColumnPropTypes.Slots - } - - /** - * 列对象 - */ - export class ColumnInfo { - /** - * 该属性已废弃，该属性被 field 替换 - * @deprecated - */ - property: VxeColumnPropTypes.Field - - /** - * 公开属性 - */ - type: VxeColumnPropTypes.Type - field: VxeColumnPropTypes.Field - title: VxeColumnPropTypes.Title - width: VxeColumnPropTypes.Width - minWidth: VxeColumnPropTypes.MinWidth - maxWidth: VxeColumnPropTypes.MaxWidth - resizable: VxeColumnPropTypes.Resizable - fixed: VxeColumnPropTypes.Fixed - align: VxeColumnPropTypes.Align - headerAlign: VxeColumnPropTypes.HeaderAlign - footerAlign: VxeColumnPropTypes.FooterAlign - showOverflow: VxeColumnPropTypes.ShowOverflow - showHeaderOverflow: VxeColumnPropTypes.ShowHeaderOverflow - showFooterOverflow: VxeColumnPropTypes.ShowFooterOverflow - className: VxeColumnPropTypes.ClassName - headerClassName: VxeColumnPropTypes.HeaderClassName - footerClassName: VxeColumnPropTypes.FooterClassName - formatter: VxeColumnPropTypes.Formatter - sortable: VxeColumnPropTypes.Sortable - sortBy: VxeColumnPropTypes.SortBy - sortType: VxeColumnPropTypes.SortType - filters: VxeColumnPropTypes.Filter[] - filterMultiple: VxeColumnPropTypes.FilterMultiple - filterMethod: VxeColumnPropTypes.FilterMethod - filterRender: VxeColumnPropTypes.FilterRender - treeNode: VxeColumnPropTypes.TreeNode - visible: VxeColumnPropTypes.Visible - exportMethod: VxeColumnPropTypes.ExportMethod - footerExportMethod: VxeColumnPropTypes.FooterExportMethod - /** - * 已废弃，请使用 titlePrefix - * @deprecated - */ - titleHelp: VxeColumnPropTypes.TitleHelp - titlePrefix: VxeColumnPropTypes.TitlePrefix - titleSuffix: VxeColumnPropTypes.TitleSuffix - cellType: VxeColumnPropTypes.CellType - cellRender: VxeColumnPropTypes.CellRender - editRender: VxeColumnPropTypes.EditRender - contentRender: VxeColumnPropTypes.ContentRender - params: VxeColumnPropTypes.Params - slots: VxeColumnPropTypes.Slots - - /** - * 以下内部属性 - * 内部属性随时都会调整，不应该被使用 - */ - id: string - parentId: string - level: number - rowSpan: number - colSpan: number - halfVisible: boolean - defaultVisible: any - defaultFixed: any - checked: boolean - halfChecked: boolean - disabled: boolean - - // 数据排序 - order: VxeTablePropTypes.SortOrder - sortTime: number - - // 列排序 - sortNumber: number - renderSortNumber: number - - renderWidth: number - renderHeight: number - resizeWidth: number - model: { - update: boolean - value: any - } - - children: ColumnInfo[] - - renderHeader(params: CellRenderHeaderParams): VNode[] - renderCell(params: CellRenderCellParams): VNode[] - renderData(params: CellRenderDataParams): VNode[] - renderFooter(params: CellRenderFooterParams): VNode[] - - getTitle(): string - getKey(): string - } - - export interface CellRenderHeaderParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null - $rowIndex: number - column: ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - fixed: VxeColumnPropTypes.Fixed - type: string - isHidden: boolean - hasFilter: boolean - - checked?: boolean - indeterminate?: boolean - } - - export interface CellRenderBodyParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null - seq: string | number - rowid: string - row: D - rowIndex: number - $rowIndex: number - _rowIndex: number - column: ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - fixed: VxeColumnPropTypes.Fixed - type: string - isHidden: boolean - level: number - visibleData: D[] - data: D[] - items: any[] - } - - export interface CellRenderDataParams extends CellRenderBodyParams { } - export interface CellRenderCellParams extends CellRenderBodyParams { } - - export interface CellRenderFooterParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null - row: D - rowIndex: number - _rowIndex: number - $rowIndex: number - column: ColumnInfo - columnIndex: number - $columnIndex: number - _columnIndex: number - fixed: VxeColumnPropTypes.Fixed - type: string - data: any[][] - - // 兼容旧 - itemIndex: number - items: any[] - } - - interface TableEventParams extends VxeEvent { - $table: VxeTableConstructor & VxeTablePrivateMethods - } - - interface TableBaseHeaderCellParams { - $rowIndex: number - column: ColumnInfo - columnIndex: number - $columnIndex: number - } - - interface TableBaseCellParams { - row: D - rowIndex: number - $rowIndex: number - column: ColumnInfo - columnIndex: number - $columnIndex: number - } - - interface TableBaseFooterCellParams { - $rowIndex: number - column: ColumnInfo - columnIndex: number - $columnIndex: number - } - - export interface KeydownStartParams { } - export interface KeydownStartEventParams extends TableEventParams, KeydownStartParams { } - - export interface KeydownParams { } - export interface KeydownEventParams extends TableEventParams, KeydownParams { } - - export interface KeydownEndParams { } - export interface KeydownEndEventParams extends TableEventParams, KeydownEndParams { } - - export interface PasteParams { } - export interface PasteEventParams extends TableEventParams, PasteParams { } - - export interface CopyParams { } - export interface CopyEventParams extends TableEventParams, CopyParams { } - - export interface CutParams { } - export interface CutEventParams extends TableEventParams, CutParams { } - - export interface CurrentChangeParams extends TableBaseCellParams { - newValue: any - oldValue: any - } - export interface CurrentChangeEventParams extends TableEventParams, CurrentChangeParams { } - - export interface RadioChangeParams extends TableBaseCellParams { - newValue: any - oldValue: any - } - export interface RadioChangeEventParams extends TableEventParams, RadioChangeParams { } - - export interface CheckboxChangeParams extends TableBaseCellParams { - checked: boolean - /** - * 请调用方法 getCheckboxRecords() 获取 - * @deprecated - */ - records: D[] - /** - * 请调用方法 getCheckboxReserveRecords() 获取 - * @deprecated - */ - reserves: D[] - /** - * 请调用方法 getCheckboxIndeterminateRecords() 获取 - * @deprecated - */ - indeterminates: D[] - } - export interface CheckboxChangeEventParams extends TableEventParams, CheckboxChangeParams { } - - export interface CheckboxAllParams extends CheckboxChangeParams { } - export interface CheckboxAllEventParams extends TableEventParams, CheckboxAllParams { } - - export interface CheckboxRangeStartParams { - /** - * 请调用方法 getCheckboxRecords() 获取 - * @deprecated - */ - records: D[] - /** - * 请调用方法 getCheckboxReserveRecords() 获取 - * @deprecated - */ - reserves: D[] - } - export interface CheckboxRangeStartEventParams extends TableEventParams, CheckboxRangeStartParams { } - - export interface CheckboxRangeChangeParams extends CheckboxRangeStartParams { } - export interface CheckboxRangeChangeEventParams extends TableEventParams, CheckboxRangeChangeParams { } - - export interface CheckboxRangeEndParams extends CheckboxRangeStartParams { } - - export interface CheckboxRangeEndEventParams extends TableEventParams, CheckboxRangeEndParams { } - - export interface CheckboxRangeSelectParams { - rangeRecords: D[] - } - export interface CheckboxRangeSelectEventParams extends TableEventParams, CheckboxRangeSelectParams { } - - export interface CellClickParams extends TableBaseCellParams { - triggerRadio: boolean - triggerCheckbox: boolean - triggerTreeNode: boolean - triggerExpandNode: boolean - } - export interface CellClickEventParams extends TableEventParams, CellClickParams { } - - export interface CellDblclickParams extends TableEventParams, CellClickParams { } - export interface CellDblclickEventParams extends TableEventParams, CellDblclickParams { } - - export interface CellMenuParams extends TableBaseCellParams { } - export interface CellMenuEventParams extends TableEventParams, CellMenuParams { } - - export interface CellMouseenterParams extends TableBaseCellParams { } - export interface CellMouseenterEventParams extends TableEventParams, CellMouseenterParams { } - - export interface CellMouseleaveParams extends TableBaseCellParams { } - export interface CellMouseleaveEventParams extends TableEventParams, CellMouseleaveParams { } - - export interface CellDeleteValueParams { - row: D - rowIndex: number - column: VxeTableDefines.ColumnInfo - columnIndex: number - activeArea: VxeTableProDefines.MouseActiveCellArea - cellAreas: VxeTableProDefines.MouseCellArea[] - } - export interface CellDeleteValueEventParams extends TableEventParams, CellDeleteValueParams { } - - export interface HeaderCellClickParams extends TableBaseHeaderCellParams { - triggerResizable: boolean - triggerSort: boolean - triggerFilter: boolean - } - export interface HeaderCellClickEventParams extends TableEventParams, HeaderCellClickParams { } - - export interface HeaderCellDblclickParams extends TableBaseHeaderCellParams { } - export interface HeaderCellDblclickEventParams extends TableEventParams, HeaderCellDblclickParams { } - - export interface HeaderCellMenuParams extends TableBaseHeaderCellParams { } - export interface HeaderCellMenuEventParams extends TableEventParams, HeaderCellMenuParams { } - - export interface FooterCellClickParams extends TableBaseFooterCellParams { } - export interface FooterCellClickEventParams extends TableEventParams, FooterCellClickParams { } - - export interface FooterCellDblclickParams extends TableBaseFooterCellParams { } - export interface FooterCellDblclickEventParams extends TableEventParams, FooterCellDblclickParams { } - - export interface FooterCellMenuParams extends TableBaseFooterCellParams { } - export interface FooterCellMenuEventParams extends TableEventParams, FooterCellMenuParams { } - - export interface SortCheckedParams { - column: VxeTableDefines.ColumnInfo - field: VxeColumnPropTypes.Field - property: VxeColumnPropTypes.Field - order: VxeTablePropTypes.SortOrder - sortTime: number - } - export interface SortChangeParams extends SortCheckedParams { - sortList: SortCheckedParams[] - } - export interface SortChangeEventParams extends TableEventParams, SortChangeParams { } - - export interface FilterCheckedParams { - column: VxeTableDefines.ColumnInfo - field: VxeColumnPropTypes.Field - property: VxeColumnPropTypes.Field - values: any[] - datas: any[] - } - export interface FilterChangeParams extends FilterCheckedParams { - filterList: FilterCheckedParams[] - } - export interface FilterChangeEventParams extends TableEventParams, FilterChangeParams { } - - export interface FilterVisibleParams { - column: VxeTableDefines.ColumnInfo - field: VxeColumnPropTypes.Field - property: VxeColumnPropTypes.Field - filterList: FilterCheckedParams[] - visible: boolean - } - export interface FilterVisibleEventParams extends TableEventParams, FilterVisibleParams { } - - export interface ResizableChangeParams extends TableBaseHeaderCellParams { } - export interface ResizableChangeEventParams extends TableEventParams, ResizableChangeParams { - resizeWidth: number - } - - export interface ToggleRowExpandParams extends TableBaseCellParams { } - export interface ToggleRowExpandEventParams extends TableEventParams, ToggleRowExpandParams { } - - export interface ToggleTreeExpandParams extends TableBaseCellParams { } - export interface ToggleTreeExpandEventParams extends TableEventParams, ToggleTreeExpandParams { } - - export interface MenuClickParams extends TableBaseCellParams { - menu: VxeTableDefines.MenuFirstOption | VxeTableDefines.MenuChildOption - type: string - } - export interface MenuClickEventParams extends TableEventParams, MenuClickParams { } - - export interface EditClosedParams extends TableBaseCellParams { } - export interface EditClosedEventParams extends TableEventParams, EditClosedParams { } - - export interface EditActivedParams extends TableBaseCellParams { } - export interface EditActivedEventParams extends TableEventParams, EditActivedParams { } - - export interface EditDisabledParams extends TableBaseCellParams { } - export interface EditDisabledEventParams extends TableEventParams, EditDisabledParams { } - - export interface ValidErrorParams extends TableBaseCellParams { - rule: any - } - export interface ValidErrorEventParams extends TableEventParams, ValidErrorParams { } - - export interface ScrollParams { - type: string - scrollTop: number - scrollLeft: number - scrollHeight: number - scrollWidth: number - bodyWidth: number - bodyHeight: number - isX: boolean - isY: boolean - } - export interface ScrollEventParams extends TableEventParams, ScrollParams { - target: HTMLDivElement - } - - export interface CustomParams { - type: string - } - export interface CustomEventParams extends TableEventParams, CustomParams { } -} - -export interface VxeTableEventProps { - onKeydownStart?: VxeTableEvents.KeydownStart - onKeydown?: VxeTableEvents.Keydown - onKeydownEnd?: VxeTableEvents.KeydownEnd - onPaste?: VxeTableEvents.Paste - onCopy?: VxeTableEvents.Copy - onCut?: VxeTableEvents.Cut - onCurrentChange?: VxeTableEvents.CurrentChange - onRadioChange?: VxeTableEvents.RadioChange - onCheckboxChange?: VxeTableEvents.CheckboxChange - onCheckboxAll?: VxeTableEvents.CheckboxAll - onCheckboxRangeStart?: VxeTableEvents.CheckboxRangeStart - onCheckboxRangeChange?: VxeTableEvents.CheckboxRangeChange - onCheckboxRangeEnd?: VxeTableEvents.CheckboxRangeEnd - onCheckboxRangeSelect?: VxeTableEvents.CheckboxRangeSelect - onCellClick?: VxeTableEvents.CellClick - onCellDblclick?: VxeTableEvents.CellDblclick - onCellMenu?: VxeTableEvents.CellMenu - onCellMouseenter?: VxeTableEvents.CellMouseenter - onCellMouseleave?: VxeTableEvents.CellMouseleave - onCellDeleteValue?: VxeTableEvents.CellDeleteValue - onHeaderCellClick?: VxeTableEvents.HeaderCellClick - onHeaderCellDblclick?: VxeTableEvents.HeaderCellDblclick - onHeaderCellMenu?: VxeTableEvents.HeaderCellMenu - onFooterCellClick?: VxeTableEvents.FooterCellClick - onFooterCellDblclick?: VxeTableEvents.FooterCellDblclick - onFooterCellMenu?: VxeTableEvents.FooterCellMenu - onSortChange?: VxeTableEvents.SortChange - onFilterChange?: VxeTableEvents.FilterChange - onFilterVisible?: VxeTableEvents.FilterVisible - onResizableChange?: VxeTableEvents.ResizableChange - onToggleRowExpand?: VxeTableEvents.ToggleRowExpand - onToggleTreeExpand?: VxeTableEvents.ToggleTreeExpand - onMenuClick?: VxeTableEvents.MenuClick - onEditClosed?: VxeTableEvents.EditClosed - onEditActived?: VxeTableEvents.EditActived - onEditDisabled?: VxeTableEvents.EditDisabled - onValidError?: VxeTableEvents.ValidError - onScroll?: VxeTableEvents.Scroll - onCustom?: VxeTableEvents.Custom -} - -export interface VxeTableListeners { - /** - * 当表格被激活且键盘被按下开始时会触发的事件 - */ - keydownStart?: VxeTableEvents.KeydownStart - /** - * 当表格被激活且键盘被按下时会触发的事件 - */ - keydown?: VxeTableEvents.Keydown - /** - * 当表格被激活且键盘被按下结束时会触发的事件 - */ - keydownEnd?: VxeTableEvents.KeydownEnd - paste?: VxeTableEvents.Paste - copy?: VxeTableEvents.Copy - cut?: VxeTableEvents.Cut - currentChange?: VxeTableEvents.CurrentChange - radioChange?: VxeTableEvents.RadioChange - checkboxChange?: VxeTableEvents.CheckboxChange - checkboxAll?: VxeTableEvents.CheckboxAll - checkboxRangeStart?: VxeTableEvents.CheckboxRangeStart - checkboxRangeChange?: VxeTableEvents.CheckboxRangeChange - checkboxRangeEnd?: VxeTableEvents.CheckboxRangeEnd - checkboxRangeSelect?: VxeTableEvents.CheckboxRangeSelect - cellClick?: VxeTableEvents.CellClick - cellDblclick?: VxeTableEvents.CellDblclick - cellMenu?: VxeTableEvents.CellMenu - cellMouseenter?: VxeTableEvents.CellMouseenter - cellMouseleave?: VxeTableEvents.CellMouseleave - cellDeleteValue?: VxeTableEvents.CellDeleteValue - headerCellClick?: VxeTableEvents.HeaderCellClick - headerCellDblclick?: VxeTableEvents.HeaderCellDblclick - headerCellMenu?: VxeTableEvents.HeaderCellMenu - footerCellClick?: VxeTableEvents.FooterCellClick - footerCellDblclick?: VxeTableEvents.FooterCellDblclick - footerCellMenu?: VxeTableEvents.FooterCellMenu - sortChange?: VxeTableEvents.SortChange - filterChange?: VxeTableEvents.FilterChange - resizableChange?: VxeTableEvents.ResizableChange - toggleRowExpand?: VxeTableEvents.ToggleRowExpand - toggleTreeExpand?: VxeTableEvents.ToggleTreeExpand - menuClick?: VxeTableEvents.MenuClick - editClosed?: VxeTableEvents.EditClosed - editActived?: VxeTableEvents.EditActived - editDisabled?: VxeTableEvents.EditDisabled - /** - * 只对 edit-rules 配置时有效，当数据校验不通过时会触发该事件 - */ - validError?: VxeTableEvents.ValidError - /** - * 表格滚动时会触发该事件 - */ - scroll?: VxeTableEvents.Scroll - /** - * 如果与工具栏关联，在自定义列按钮被手动点击后会触发该事件 - */ - custom?: VxeTableEvents.Custom -} - -export namespace VxeTableEvents { - export type KeydownStart = (params: VxeTableDefines.KeydownStartEventParams) => void - export type Keydown = (params: VxeTableDefines.KeydownEventParams) => void - export type KeydownEnd = (params: VxeTableDefines.KeydownEndEventParams) => void - export type Paste = (params: VxeTableDefines.PasteEventParams) => void - export type Copy = (params: VxeTableDefines.CopyEventParams) => void - export type Cut = (params: VxeTableDefines.CutEventParams) => void - export type CurrentChange = (params: VxeTableDefines.CurrentChangeEventParams) => void - export type RadioChange = (params: VxeTableDefines.RadioChangeEventParams) => void - export type CheckboxChange = (params: VxeTableDefines.CheckboxChangeEventParams) => void - export type CheckboxAll = (params: VxeTableDefines.CheckboxAllEventParams) => void - export type CheckboxRangeStart = (params: VxeTableDefines.CheckboxRangeStartEventParams) => void - export type CheckboxRangeChange = (params: VxeTableDefines.CheckboxRangeChangeEventParams) => void - export type CheckboxRangeEnd = (params: VxeTableDefines.CheckboxRangeEndEventParams) => void - export type CheckboxRangeSelect = (params: VxeTableDefines.CheckboxRangeSelectEventParams) => void - export type CellClick = (params: VxeTableDefines.CellClickEventParams) => void - export type CellDblclick = (params: VxeTableDefines.CellDblclickEventParams) => void - export type CellMenu = (params: VxeTableDefines.CellMenuEventParams) => void - export type CellMouseenter = (params: VxeTableDefines.CellMouseenterEventParams) => void - export type CellMouseleave = (params: VxeTableDefines.CellMouseleaveEventParams) => void - export type CellDeleteValue = (params: VxeTableDefines.CellDeleteValueEventParams) => void - export type HeaderCellClick = (params: VxeTableDefines.HeaderCellClickEventParams) => void - export type HeaderCellDblclick = (params: VxeTableDefines.HeaderCellDblclickEventParams) => void - export type HeaderCellMenu = (params: VxeTableDefines.HeaderCellMenuEventParams) => void - export type FooterCellClick = (params: VxeTableDefines.FooterCellClickEventParams) => void - export type FooterCellDblclick = (params: VxeTableDefines.FooterCellDblclickEventParams) => void - export type FooterCellMenu = (params: VxeTableDefines.FooterCellMenuEventParams) => void - export type SortChange = (params: VxeTableDefines.SortChangeEventParams) => void - export type FilterChange = (params: VxeTableDefines.FilterChangeEventParams) => void - export type FilterVisible = (params: VxeTableDefines.FilterVisibleEventParams) => void - export type ResizableChange = (params: VxeTableDefines.ResizableChangeEventParams) => void - export type ToggleRowExpand = (params: VxeTableDefines.ToggleRowExpandEventParams) => void - export type ToggleTreeExpand = (params: VxeTableDefines.ToggleTreeExpandEventParams) => void - export type MenuClick = (params: VxeTableDefines.MenuClickEventParams) => void - export type EditClosed = (params: VxeTableDefines.EditClosedEventParams) => void - export type EditActived = (params: VxeTableDefines.EditActivedEventParams) => void - export type EditDisabled = (params: VxeTableDefines.EditDisabledEventParams) => void - export type ValidError = (params: VxeTableDefines.ValidErrorEventParams) => void - export type Scroll = (params: VxeTableDefines.ScrollEventParams) => void - export type Custom = (params: VxeTableDefines.CustomEventParams) => void -} - -export interface VxeTableSlots { - /** - * 自定义空数据时显示模板 - */ - empty?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any - /** - * 自定义加载中模板 - */ - loading?(params: { - $table: VxeTableConstructor - $grid: VxeGridConstructor | null | undefined - }): any -} diff --git a/types/textarea.d.ts b/types/textarea.d.ts deleted file mode 100644 index 97bc61e51b..0000000000 --- a/types/textarea.d.ts +++ /dev/null @@ -1,211 +0,0 @@ -import { RenderFunction, SetupContext, ComponentPublicInstance, Ref } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 文本域 - * @example import { VxeTextarea } from 'vxe-table' - */ -export const VxeTextarea: VXEComponent -/** - * 组件 - 文本域 - */ -export const Textarea: typeof VxeTextarea - -export type VxeTextareaInstance = ComponentPublicInstance - -export interface VxeTextareaConstructor extends VxeComponentBase, VxeTextareaMethods { - props: VxeTextareaProps - context: SetupContext - reactData: TextareaReactData - getRefMaps(): TextareaPrivateRef - renderVN: RenderFunction -} - -export interface TextareaReactData { - inputValue: any -} - -export interface TextareaPrivateRef { - refElem: Ref - refTextarea: Ref -} -export interface VxeTextareaPrivateRef extends TextareaPrivateRef { } - -export type VxeTextareaProps = { - size?: VxeTextareaPropTypes.Size - /** - * 绑定值 - */ - modelValue?: VxeTextareaPropTypes.ModelValue - className?: VxeTextareaPropTypes.ClassName - immediate?: VxeTextareaPropTypes.Immediate - /** - * 原生 name 属性 - */ - name?: VxeTextareaPropTypes.Name - /** - * 是否只读 - */ - readonly?: VxeTextareaPropTypes.Readonly - /** - * 是否禁用 - */ - disabled?: VxeTextareaPropTypes.Disabled - /** - * 当值为空时，显示的占位符 - */ - placeholder?: VxeTextareaPropTypes.Placeholder - /** - * 最大长度 - */ - maxlength?: VxeTextareaPropTypes.Maxlength - /** - * 原生 rows 属性 - */ - rows?: VxeTextareaPropTypes.Rows - /** - * 原生 cols 属性 - */ - cols?: VxeTextareaPropTypes.Cols - /** - * 是否显示字数统计 - */ - showWordCount?: VxeTextareaPropTypes.ShowWordCount - /** - * 自定义字数统计方法 - */ - countMethod?: VxeTextareaPropTypes.CountMethod - /** - * 自适应文本高度 - */ - autosize?: VxeTextareaPropTypes.Autosize - /** - * 原生 form 属性 - */ - form?: VxeTextareaPropTypes.Form - /** - * 调整文本域大小的方式 - */ - resize?: VxeTextareaPropTypes.Resize -} - -export namespace VxeTextareaPropTypes { - export type Size = SizeType - export type ModelValue = string | number - export type ClassName = string - export type Immediate = boolean - export type Name = string - export type Readonly = boolean - export type Disabled = boolean - export type Placeholder = string - export type Maxlength = string | number - export type Rows = string | number - export type Cols = string | number - export type ShowWordCount = boolean - export type CountMethod = (params: { - value: string - }) => number - export type Autosize = { - minRows?: number - maxRows?: number - } - export type Form = string - export type Resize = string -} - -export interface TextareaMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void - /** - * 获取焦点 - */ - focus(): Promise - /** - * 失去焦点 - */ - blur(): Promise -} -export interface VxeTextareaMethods extends TextareaMethods { } - -export interface TextareaPrivateMethods { } -export interface VxeTextareaPrivateMethods extends TextareaPrivateMethods { } - -export type VxeTextareaEmits = [ - 'update:modelValue', - 'input', - 'keydown', - 'keyup', - 'click', - 'change', - 'focus', - 'blur' -] - -export namespace VxeTextareaDefines { - interface TextareaEventParams extends VxeEvent { - $textarea: VxeTextareaConstructor - } - - export interface InputParams { - value: string - } - export interface InputEventParams extends TextareaEventParams, InputParams { } - - export interface ChangeParams extends InputParams {} - export interface ChangeEventParams extends TextareaEventParams, ChangeParams { } - - export interface KeyupParams extends InputParams {} - export interface KeyupEventParams extends TextareaEventParams, KeyupParams { } - - export interface KeydownParams extends InputParams {} - export interface KeydownEventParams extends TextareaEventParams, KeydownParams { } - - export interface ClickParams extends InputParams {} - export interface ClickEventParams extends TextareaEventParams, ClickParams { } - - export interface FocusParams extends InputParams {} - export interface FocusEventParams extends TextareaEventParams, FocusParams { } - - export interface BlurParams extends InputParams {} - export interface BlurEventParams extends TextareaEventParams, BlurParams { } -} - -export type VxeTextareaEventProps = { - onInput?: VxeTextareaEvents.Input - onChange?: VxeTextareaEvents.Change - onKeydown?: VxeTextareaEvents.Keydown - onKeyup?: VxeTextareaEvents.Keyup - onClick?: VxeTextareaEvents.Click - onFocus?: VxeTextareaEvents.Focus - onBlur?: VxeTextareaEvents.Blur -} - -export interface VxeTextareaListeners { - input?: VxeTextareaEvents.Input - change?: VxeTextareaEvents.Change - keydown?: VxeTextareaEvents.Keydown - keyup?: VxeTextareaEvents.Keyup - click?: VxeTextareaEvents.Click - focus?: VxeTextareaEvents.Focus - blur?: VxeTextareaEvents.Blur -} - -export namespace VxeTextareaEvents { - export type Input = (params: VxeTextareaDefines.InputEventParams) => void - export type Change = (params: VxeTextareaDefines.ChangeEventParams) => void - export type Keydown = (params: VxeTextareaDefines.KeydownEventParams) => void - export type Keyup = (params: VxeTextareaDefines.KeyupEventParams) => void - export type Click = (params: VxeTextareaDefines.ClickEventParams) => void - export type Focus = (params: VxeTextareaDefines.FocusEventParams) => void - export type Blur = (params: VxeTextareaDefines.BlurEventParams) => void -} - -export interface VxeTextareaSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/toolbar.d.ts b/types/toolbar.d.ts deleted file mode 100644 index f428f84c38..0000000000 --- a/types/toolbar.d.ts +++ /dev/null @@ -1,253 +0,0 @@ -import { RenderFunction, SetupContext, Ref, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf } from './component' -import { VxeGlobalRendererHandles } from './v-x-e-table' -import { VxeTableDefines, VxeTableConstructor, VxeTablePrivateMethods } from './table' -import { VxeButtonProps } from './button' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 工具栏 - * @example import { VxeToolbar } from 'vxe-table' - */ -export const VxeToolbar: VXEComponent -/** - * 组件 - 工具栏 - */ -export const Toolbar: typeof VxeToolbar - -export type VxeToolbarInstance = ComponentPublicInstance - -export interface VxeToolbarConstructor extends VxeComponentBase, VxeToolbarMethods { - props: VxeToolbarProps - context: SetupContext - reactData: ToolbarReactData - getRefMaps(): ToolbarPrivateRef - renderVN: RenderFunction -} - -export interface ToolbarPrivateRef { - refElem: Ref -} -export interface VxeToolbarPrivateRef extends ToolbarPrivateRef { } - -export namespace VxeToolbarPropTypes { - export type Size = SizeType - export type Id = string - export type Loading = boolean - - interface ResizableConfig { - storage?: boolean - } - export type Resizable = boolean | ResizableConfig - export interface ResizableOpts extends ResizableConfig { } - - interface RefreshConfig { - queryMethod?(params: { [key: string]: any }): any - code?: 'query' | 'reload' | '' | null - icon?: string - iconLoading?: string - /** - * @deprecated 请使用 queryMethod - */ - query?(params: { [key: string]: any }): Promise - } - export type Refresh = boolean | RefreshConfig - export interface RefreshOpts extends RefreshConfig { } - - interface ImportConfig { - icon?: string - } - export type Import = boolean | ImportConfig - export interface ImportOpts extends ImportConfig { } - - interface ExportConfig { - icon?: string - } - export type Export = boolean | ExportConfig - export interface ExportOpts extends ExportConfig { } - - export interface PrintConfig { - icon?: string - } - export type Print = boolean | PrintConfig - export interface PrintOpts extends PrintConfig { } - - interface ZoomConfig { - iconIn?: string - iconOut?: string - } - export type Zoom = boolean | ZoomConfig - export interface ZoomOpts extends ZoomConfig { } - - interface CustomConfig { - icon?: string - - /** - * 已废弃，请使用 custom-config.trigger - * @deprecated - */ - trigger?: string, - /** - * 已废弃，请使用 custom-config.immediate - * @deprecated - */ - immediate?: boolean - /** - * 已废弃，请使用 custom-config.storage - * @deprecated - */ - storage?: boolean - /** - * 已废弃，请使用 custom-config.checkMethod - * @deprecated - */ - checkMethod?(params: { column: VxeTableDefines.ColumnInfo }): boolean - /** - * 已废弃，请使用 custom-config.showFooter - * @deprecated - */ - showFooter?: boolean - /** - * 已废弃，请使用 custom-config.allowFixed - * @deprecated - */ - allowFixed?: boolean - /** - * 已废弃，请使用 custom-config.resetButtonText - * @deprecated - */ - resetButtonText?: string - /** - * 已废弃，请使用 custom-config.confirmButtonText - * @deprecated - */ - confirmButtonText?: string - /** - * 已废弃，请使用 custom-config.showFooter - * @deprecated - */ - isFooter?: boolean - } - export type Custom = boolean | CustomConfig - export interface CustomOpts extends CustomConfig { } - - interface ButtonAndToolConfig extends VxeButtonProps { - code?: string - visible?: boolean - params?: any - } - - export interface ButtonConfig extends ButtonAndToolConfig { - dropdowns?: ButtonConfig[] - buttonRender?: VxeGlobalRendererHandles.RenderButtonOptions - } - export type Buttons = ButtonConfig[] - - export interface ToolConfig extends ButtonAndToolConfig { - dropdowns?: ToolConfig[] - toolRender?: VxeGlobalRendererHandles.RenderToolOptions - } - export type Tools = ToolConfig[] - - export type Perfect = boolean - - export type ClassName = string | ((params: { - $toolbar: VxeToolbarConstructor - }) => string) -} - -export type VxeToolbarProps = { - size?: VxeToolbarPropTypes.Size - /** - * 唯一 ID 标识 - */ - id?: VxeToolbarPropTypes.Id - /** - * 是否加载中 - */ - loading?: VxeToolbarPropTypes.Loading - /** - * 列宽拖动配置 - */ - resizable?: VxeToolbarPropTypes.Resizable - /** - * 刷新按钮配置 - */ - refresh?: VxeToolbarPropTypes.Refresh - /** - * 导入按钮配置 - */ - import?: VxeToolbarPropTypes.Import - /** - * 导出按钮配置 - */ - export?: VxeToolbarPropTypes.Export - print?: VxeToolbarPropTypes.Print - zoom?: VxeToolbarPropTypes.Zoom - /** - * 自定义列配置 - */ - custom?: VxeToolbarPropTypes.Custom - /** - * 按钮列表 - */ - buttons?: VxeToolbarPropTypes.Buttons - tools?: VxeToolbarPropTypes.Tools - /** - * 配套的样式 - */ - perfect?: VxeToolbarPropTypes.Perfect - className?: VxeToolbarPropTypes.ClassName -} - -export interface ToolbarReactData { - isRefresh: boolean - columns: VxeTableDefines.ColumnInfo[] -} - -export interface ToolbarMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void - syncUpdate(params: { - collectColumn: VxeTableDefines.ColumnInfo[] - $table: VxeTableConstructor & VxeTablePrivateMethods - }): void -} -export interface VxeToolbarMethods extends ToolbarMethods { } - -export interface ToolbarPrivateMethods { } -export interface VxeToolbarPrivateMethods extends ToolbarPrivateMethods { } - -export type VxeToolbarEmits = [ - 'button-click', - 'tool-click' -] - -export namespace VxeToolbarDefines { - export interface ToolbarEventParams extends VxeEvent { - $toolbar: VxeToolbarConstructor - } -} - -export type VxeToolbarEventProps = { - [key: string]: any -} - -export interface VxeToolbarListeners { } - -export namespace VxeToolbarEvents { } - -export interface VxeToolbarSlots { - /** - * 自定义左侧按钮列表 - */ - buttons: (params: { - [key: string]: any - }) => any - /** - * 自定义右侧工具列表 - */ - tools: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/tooltip.d.ts b/types/tooltip.d.ts deleted file mode 100644 index 58701c7ae3..0000000000 --- a/types/tooltip.d.ts +++ /dev/null @@ -1,125 +0,0 @@ -import { SetupContext, RenderFunction, Ref, ComponentPublicInstance } from 'vue' -import { VXEComponent, VxeComponentBase, VxeEvent, SizeType, ValueOf, VNodeStyle } from './component' - -/* eslint-disable no-use-before-define */ - -/** - * 组件 - 工具提示 - * @example import { VxeTooltip } from 'vxe-table' - */ -export const VxeTooltip: VXEComponent -/** - * 组件 - 工具提示 - */ -export const Tooltip: typeof VxeTooltip - -export type VxeTooltipInstance = ComponentPublicInstance - -export interface VxeTooltipConstructor extends VxeComponentBase, VxeTooltipMethods { - props: VxeTooltipProps - context: SetupContext - reactData: TooltipReactData - getRefMaps(): TooltipPrivateRef - renderVN: RenderFunction -} - -export interface TooltipPrivateRef { - refElem: Ref -} -export interface VxeTooltipPrivateRef extends TooltipPrivateRef { } - -export interface TooltipReactData { - target: HTMLElement | null - isUpdate: boolean - visible: boolean - tipContent: string | number | undefined, - tipActive: boolean - tipTarget: HTMLElement | null - tipZindex: number - tipStore: { - style: VNodeStyle - placement: any - arrowStyle: VNodeStyle - } -} - -export namespace VxeTooltipPropTypes { - export type Size = SizeType - export type ModelValue = boolean - export type Trigger = 'hover' | 'click' | 'manual' | '' | null - export type Theme = string - export type Content = string | number - export type UseHTML = boolean - export type ZIndex = string | number - export type PopupClassName = string | ((params: { $tooltip: VxeTooltipConstructor }) => string) - export type IsArrow = boolean - export type Enterable = boolean - export type EnterDelay = number - export type LeaveDelay = number - export type LeaveMethod = (params: { $event: MouseEvent }) => boolean -} - -export type VxeTooltipProps = { - size?: VxeTooltipPropTypes.Size - modelValue?: VxeTooltipPropTypes.ModelValue - trigger?: VxeTooltipPropTypes.Trigger - theme?: VxeTooltipPropTypes.Theme - content?: VxeTooltipPropTypes.Content - useHTML?: VxeTooltipPropTypes.UseHTML - popupClassName?: VxeTooltipPropTypes.PopupClassName - zIndex?: VxeTooltipPropTypes.ZIndex - isArrow?: VxeTooltipPropTypes.IsArrow - enterable?: VxeTooltipPropTypes.Enterable - enterDelay?: VxeTooltipPropTypes.EnterDelay - leaveDelay?: VxeTooltipPropTypes.LeaveDelay - leaveMethod?: VxeTooltipPropTypes.LeaveMethod -} - -export interface TooltipMethods { - dispatchEvent(type: ValueOf, params: any, evnt: Event): void - /** - * 显示 - * @param target 自定义目标元素 - * @param content 自定义内容 - */ - open(target?: any, content?: VxeTooltipPropTypes.Content): Promise - toVisible(target?: HTMLElement, content?: VxeTooltipPropTypes.Content): Promise - /** - * 隐藏 - */ - close(): Promise - updatePlacement(): Promise - isActived(): boolean - setActived(actived: boolean): void -} -export interface VxeTooltipMethods extends TooltipMethods { } - -export interface TooltipPrivateMethods { } -export interface VxeTooltipPrivateMethods extends TooltipPrivateMethods { } - -export type VxeTooltipEmits = [ - 'update:modelValue' -] - -export namespace VxeTooltipDefines { - export interface TooltipEventParams extends VxeEvent { - $tooltip: VxeTooltipConstructor - } -} - -export type VxeTooltipEventProps = { - [key: string]: any -} - -export interface VxeTooltipListeners { } - -export namespace VxeTooltipEvents { } - -export interface VxeTooltipSlots { - /** - * 自定义插槽模板 - */ - [key: string]: ((params: { - [key: string]: any - }) => any) | undefined -} diff --git a/types/v-x-e-table/commands.d.ts b/types/v-x-e-table/commands.d.ts deleted file mode 100644 index d2a13d399c..0000000000 --- a/types/v-x-e-table/commands.d.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { VxeGridConstructor } from '../grid' -import { VxeToolbarPropTypes } from '../toolbar' -import { VxeTableConstructor, VxeTableDataRow } from '../table' - -/* eslint-disable no-use-before-define */ - -export namespace VxeGlobalCommandsHandles { - export interface CommandsOptions { - commandMethod?: (params: CommandMethodParams, ...args: any[]) => void - } - export interface CommandMethodParams { - $grid: VxeGridConstructor | null - $table: VxeTableConstructor - code: string - button?: VxeToolbarPropTypes.ButtonConfig | null - } -} - -/** - * 全局格式化 - */ -export interface VxeGlobalCommands { - mixin(opts: { - [name: string]: VxeGlobalCommandsHandles.CommandsOptions | ((params: VxeGlobalCommandsHandles.CommandMethodParams, ...args: any[]) => void) - }): VxeGlobalCommands - has(name: string): boolean - get(name: string): VxeGlobalCommandsHandles.CommandsOptions - add(name: string, options: VxeGlobalCommandsHandles.CommandsOptions | ((params: VxeGlobalCommandsHandles.CommandMethodParams, ...args: any[]) => void)): VxeGlobalCommands - delete(name: string): void - forEach(callback: (options: VxeGlobalCommandsHandles.CommandsOptions, name: string) => void): void -} diff --git a/types/v-x-e-table/formats.d.ts b/types/v-x-e-table/formats.d.ts deleted file mode 100644 index cc78ae23aa..0000000000 --- a/types/v-x-e-table/formats.d.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { VxeTableDefines, VxeTableDataRow } from '../table' - -/* eslint-disable no-use-before-define */ - -export namespace VxeGlobalFormatsHandles { - export interface FormatsOptions { - cellFormatMethod?: (params: FormatMethodParams, ...args: any[]) => string | number - } - export interface FormatMethodParams { - cellValue: any - row: D - column: VxeTableDefines.ColumnInfo - } -} - -/** - * 全局格式化 - */ -export interface VxeGlobalFormats { - mixin(opts: { - [name: string]: VxeGlobalFormatsHandles.FormatsOptions | ((params: VxeGlobalFormatsHandles.FormatMethodParams, ...args: any[]) => string | number) - }): VxeGlobalFormats - has(name: string): boolean - get(name: string): VxeGlobalFormatsHandles.FormatsOptions - add(name: string, options: VxeGlobalFormatsHandles.FormatsOptions | ((params: VxeGlobalFormatsHandles.FormatMethodParams, ...args: any[]) => string | number)): VxeGlobalFormats - delete(name: string): void - forEach(callback: (options: VxeGlobalFormatsHandles.FormatsOptions, name: string) => void): void -} diff --git a/types/v-x-e-table/hooks.d.ts b/types/v-x-e-table/hooks.d.ts deleted file mode 100644 index 340febc445..0000000000 --- a/types/v-x-e-table/hooks.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { VxeTableConstructor, VxeTableMethods, VxeTablePrivateMethods } from '../table' -import { VxeGridConstructor, VxeGridPrivateMethods } from '../grid' - -export namespace VxeGlobalHooksHandles { - export type Name = 'VxeGrid' | 'VxeTable' - export interface HookOptions { - setupTable?($table: VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods): void | { [key: string]: any } - setupGrid?($grid: VxeGridConstructor & VxeGridPrivateMethods): void | { [key: string]: any } - } -} - -export interface VxeGlobalHooks { - mixin(options: { - [type: string]: VxeGlobalHooksHandles.HookOptions - }): VxeGlobalHooks - has(type: string): boolean - get(type: string): VxeGlobalHooksHandles.HookOptions - add(type: string, options: VxeGlobalHooksHandles.HookOptions): VxeGlobalHooks - delete(type: string): void - forEach(callback: (options: VxeGlobalHooksHandles.HookOptions, type: string) => void): void -} diff --git a/types/v-x-e-table/index.d.ts b/types/v-x-e-table/index.d.ts deleted file mode 100644 index 42534fce03..0000000000 --- a/types/v-x-e-table/index.d.ts +++ /dev/null @@ -1,294 +0,0 @@ -import { SaveFileFunction, ReadFileFunction, PrintFunction } from '../module/export' -import { SizeType } from '../component' -import { VxeTableProps } from '../table' -import { VxeGridProps } from '../grid' -import { VxeToolbarProps } from '../toolbar' -import { VxeTooltipProps } from '../tooltip' -import { VxePagerProps } from '../pager' -import { VxeModalProps, ModalController } from '../modal' -import { VxeDrawerProps, DrawerController } from '../drawer' -import { VxeFormProps } from '../form' -import { VxeListProps } from '../list' -import { VxeSwitchProps } from '../switch' -import { VxeSelectProps } from '../select' -import { VxeInputProps } from '../input' -import { VxeTextareaProps } from '../textarea' -import { VxeButtonProps } from '../button' -import { VxeButtonGroupProps } from '../button-group' -import { VxeCheckboxProps } from '../checkbox' -import { VxeCheckboxGroupProps } from '../checkbox-group' -import { VxeRadioProps } from '../radio' -import { VxeRadioButtonProps } from '../radio-button' -import { VxeRadioGroupProps } from '../radio-group' - -import { VxeGlobalRenderer } from './renderer' -import { VxeGlobalInterceptor } from './interceptor' -import { VxeGlobalCommands } from './commands' -import { VxeGlobalFormats } from './formats' -import { VxeGlobalMenus } from './menus' -import { VxeGlobalValidators } from './validators' -import { VxeGlobalHooks } from './hooks' - -/* eslint-disable no-use-before-define */ - -export interface VXETableConfigOptions { - /** - * 扩展插件授权码 - */ - authId?: string - onauth?(event: { - status: boolean - code: number - msg: string - - [key: string]: any - }): void - - theme?: null | '' | 'default' | 'dark' - - size?: SizeType - zIndex?: number - version?: number - emptyCell?: string - icon?: VxeGlobalIcon - table?: VxeTableProps - grid?: VxeGridProps - export?: { - types?: { - [key: string]: 0 | 1 | 2 - } - [key: string]: any - } - tooltip?: VxeTooltipProps - pager?: VxePagerProps - form?: VxeFormProps - input?: VxeInputProps - textarea?: VxeTextareaProps - select?: VxeSelectProps - toolbar?: VxeToolbarProps - button?: VxeButtonProps - buttonGroup?: VxeButtonGroupProps - radio?: VxeRadioProps - radioButton?: VxeRadioButtonProps - radioGroup?: VxeRadioGroupProps - checkbox?: VxeCheckboxProps - checkboxGroup?: VxeCheckboxGroupProps - switch?: VxeSwitchProps - modal?: VxeModalProps - drawer?: VxeDrawerProps - list?: VxeListProps - translate?(key: string, args?: any): string - i18n?(key: string, args?: any): string - - /** - * 还原旧的单元格校验模式，已废弃 - * @deprecated - */ - cellVaildMode?: 'obsolete' | '' | null - - [key: string]: any -} - -export interface VxeGlobalIcon { - [ket: string]: string -} - -export type VxeGlobalConfigMethod = (options?: VXETableConfigOptions) => VXETableCore - -/** - * 请使用 setConfig - * @deprecated - */ -export type VxeGlobalSetup = (options?: VXETableConfigOptions) => Required -/** - * @deprecated - */ -export type VXETableGlobalConfig = (options?: VXETableConfigOptions) => Required -/** - * 请使用 setConfig - * @deprecated - */ -export type VXETableSetupOptions = (options?: VXETableConfigOptions) => Required - -export class VXETableConfig { - clipboard: { - text: string - html: string - } - - get zIndex(): number - get nextZIndex(): number - /** - * 获取导出的所有文件类型 - */ - get exportTypes(): string[] - /** - * 获取导入的所有文件类型 - */ - get importTypes(): string[] -} - -export type VxeGlobalI18n = (key: string, args?: any) => string -export type VxeGlobalTranslate = (key: string, args?: any) => string -export type VxeGlobalUse = (plugin: VXETablePluginObject, ...options: any[]) => VXETableCore - -export const setConfig: VxeGlobalConfigMethod -export const interceptor: VxeGlobalInterceptor -export const renderer: VxeGlobalRenderer -export const commands: VxeGlobalCommands -export const formats: VxeGlobalFormats -export const menus: VxeGlobalMenus -export const validators: VxeGlobalValidators -export const hooks: VxeGlobalHooks -export const modal: ModalController -export const drawer: DrawerController -export const saveFile: SaveFileFunction -export const readFile: ReadFileFunction -export const print: PrintFunction -export const t: VxeGlobalI18n -export const _t: VxeGlobalTranslate -export const use: VxeGlobalUse -/** - * 请使用 setConfig - * @deprecated - */ -export const config: VXETableGlobalConfig -/** - * 请使用 setConfig - * @deprecated - */ -export const setup: VXETableSetupOptions -/** - * 已废弃 - * @deprecated - */ -export const globalConfs: VXETableConfig - -export function setIcon(options?: VxeGlobalIcon): VXETableCore - -export interface VXETablePluginObject { - install(vxetable: VXETableCore, ...options: any[]): void - [key: string]: any -} - -export interface VxeGlobalStore { - [key: string]: any - clipboard?: { - text: string - html: string - } -} -export const globalStore: VxeGlobalStore - -export type VXETableVersion = 'v1' | 'v2' | 'v3' | 'v4' - -export const v: VXETableVersion - -export interface VXETableCore { - tooltip?: boolean - /** - * 版本号 - */ - version: string - /** - * 设置全局参数/获取所有参数 - */ - setConfig: VxeGlobalConfigMethod - setIcon: typeof setIcon - /** - * 读取内部数据 - */ - globalStore: VxeGlobalStore - /** - * Table interceptor - */ - interceptor: VxeGlobalInterceptor - /** - * Table renderer - */ - renderer: VxeGlobalRenderer - /** - * Table commands - */ - commands: VxeGlobalCommands - /** - * Table column formatter - */ - formats: VxeGlobalFormats - /** - * Table context menu - */ - menus: VxeGlobalMenus - /** - * Validators table/form - */ - validators: VxeGlobalValidators - /** - * Table VxeGlobalHooks API - */ - hooks: VxeGlobalHooks - /** - * 弹窗 - */ - modal: ModalController - drawer: DrawerController - /** - * 读取本地文件 - */ - saveFile: SaveFileFunction - /** - * 读取本地文件 - */ - readFile: ReadFileFunction - /** - * 打印 - */ - print: PrintFunction - /** - * 安装插件 - * @param plugin - * @param options - */ - use: VxeGlobalUse - /** - * 读取内置国际化 - */ - t: VxeGlobalI18n - _t: VxeGlobalTranslate - - /** - * 请使用 setConfig - * @deprecated - */ - config: VXETableGlobalConfig - /** - * @deprecated 已废弃 - */ - globalConfs: VXETableConfig - /** - * 已被 version 替换 - * @deprecated - */ - v: VXETableVersion - /** - * 请使用 setConfig - * @deprecated - */ - setup: VXETableSetupOptions -} - -/** - * 一个基于 vue 的 PC 端表单/表格组件，支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、JSON 配置式... - */ -export const VXETable: VXETableCore -export const VxeUI: VXETableCore - -export * from './renderer' -export * from './interceptor' -export * from './commands' -export * from './formats' -export * from './menus' -export * from './validators' -export * from './hooks' - -export default VXETable diff --git a/types/v-x-e-table/interceptor.d.ts b/types/v-x-e-table/interceptor.d.ts deleted file mode 100644 index 6e1d2a1d73..0000000000 --- a/types/v-x-e-table/interceptor.d.ts +++ /dev/null @@ -1,57 +0,0 @@ -import { VxeTableConstructor, VxeTableDefines, VxeTablePropTypes, VxeTablePrivateMethods } from '../table' -import { VxeGridConstructor, VxeGridPrivateMethods } from '../grid' - -export namespace VxeGlobalInterceptorHandles { - export type HookType = 'created' | 'mounted' | 'activated' | 'beforeUnmount' | 'unmounted' - export type EventType = 'event.clearEdit' | 'event.clearActived' | 'event.clearFilter' | 'event.clearAreas' | 'event.showMenu' | 'event.keydown' | 'event.export' | 'event.import' - export type Type = HookType | EventType - - export type InterceptorCallback = (params: any) => any - - interface InterceptorParams { - $grid?: VxeGridConstructor & VxeGridPrivateMethods - $table: VxeTableConstructor & VxeTablePrivateMethods - $event: Event - } - - export interface InterceptorKeydownParams extends InterceptorParams { } - export interface InterceptorClearFilterParams extends InterceptorParams { } - export interface InterceptorClearEditParams extends InterceptorParams { } - export interface InterceptorClearAreasParams extends InterceptorParams { } - - export interface InterceptorExportParams extends InterceptorParams { - options: VxeTablePropTypes.ExportHandleOptions - columns: VxeTableDefines.ColumnInfo[] - colgroups: VxeTableDefines.ColumnInfo[][] - datas: any[] - } - - export interface InterceptorImportParams extends InterceptorParams { - file: File - options: VxeTablePropTypes.ExportHandleOptions - columns: VxeTableDefines.ColumnInfo[] - datas: any[] - } - - export interface InterceptorShowMenuParams extends InterceptorParams { - type: 'header' | 'body' | 'footer' - options: VxeTableDefines.MenuFirstOption[][] - columns: VxeTableDefines.ColumnInfo[] - row?: any - rowIndex?: number - column?: VxeTableDefines.ColumnInfo - columnIndex?: number - } -} - -/** - * 全局事件拦截器 - */ -export interface VxeGlobalInterceptor { - mixin(options: { - [type: string]: VxeGlobalInterceptorHandles.InterceptorCallback - }): VxeGlobalInterceptor - get(type: VxeGlobalInterceptorHandles.Type): VxeGlobalInterceptorHandles.InterceptorCallback[] - add(type: VxeGlobalInterceptorHandles.Type, callback: VxeGlobalInterceptorHandles.InterceptorCallback): VxeGlobalInterceptor - delete(type: VxeGlobalInterceptorHandles.Type, callback?: VxeGlobalInterceptorHandles.InterceptorCallback): void -} diff --git a/types/v-x-e-table/menus.d.ts b/types/v-x-e-table/menus.d.ts deleted file mode 100644 index 5882fe98fe..0000000000 --- a/types/v-x-e-table/menus.d.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { VxeTableConstructor, VxeTableDefines, VxeTableDataRow, VxeTablePrivateMethods } from '../table' -import { VxeGridConstructor } from '../grid' -import { VxeGlobalRendererHandles } from './renderer' - -/* eslint-disable no-use-before-define */ - -export namespace VxeGlobalMenusHandles { - export type MenusOption = { - menuMethod?: (params: MenuMethodParams, event: Event) => any - } - export interface MenuMethodParams extends VxeGlobalRendererHandles.RenderCellParams { - $grid: VxeGridConstructor | null - $table: VxeTableConstructor & VxeTablePrivateMethods - $event: MouseEvent - menu: VxeTableDefines.MenuFirstOption | VxeTableDefines.MenuChildOption - } -} - -/** - * 全局快捷菜单 - */ -export interface VxeGlobalMenus { - mixin(opts: { - [code: string]: VxeGlobalMenusHandles.MenusOption | ((params: VxeGlobalMenusHandles.MenuMethodParams, event: Event) => any) - }): VxeGlobalMenus - has(code: string): boolean - get(code: string): VxeGlobalMenusHandles.MenusOption - add(code: string, options: VxeGlobalMenusHandles.MenusOption | ((params: VxeGlobalMenusHandles.MenuMethodParams, event: Event) => any)): VxeGlobalMenus - delete(code: string): void - forEach(callback: (options: VxeGlobalMenusHandles.MenusOption, code: string) => void): void -} diff --git a/types/v-x-e-table/renderer.d.ts b/types/v-x-e-table/renderer.d.ts deleted file mode 100644 index 1e13b5d5cc..0000000000 --- a/types/v-x-e-table/renderer.d.ts +++ /dev/null @@ -1,281 +0,0 @@ -import { SlotVNodeType, VNodeStyle, VNodeClassName } from '../component' -import { VxeTableDefines, VxeTableConstructor, VxeTablePrivateMethods, VxeTablePropTypes, VxeTableDataRow } from '../table' -import { VxeGridConstructor } from '../grid' -import { VxeColumnPropTypes } from '../column' -import { VxeFilterPanel } from '../module/filter' -import { VxeToolbarPropTypes } from '../toolbar' -import { FormItemRenderOptions, FormItemTitleRenderParams, FormItemContentRenderParams, FormItemVisibleParams, FormItemResetParams } from '../form-item' - -/* eslint-disable no-use-before-define */ - -type RendererOptions = DefineRendererOption - -export interface DefineRendererOption { - /** - * @deprecated 已废弃 - */ - className?: string - - // 筛选渲染 - filterClassName?: string | ((params: VxeGlobalRendererHandles.RenderFilterParams) => string | VNodeClassName) - showFilterFooter?: boolean - renderFilter?(renderOpts: VxeGlobalRendererHandles.RenderFilterOptions, params: VxeGlobalRendererHandles.RenderFilterParams): T - filterMethod?(params: VxeGlobalRendererHandles.FilterMethodParams): boolean - filterRemoteMethod?(params: VxeGlobalRendererHandles.FilterRemoteMethod): boolean - filterResetMethod?(params: VxeGlobalRendererHandles.FilterResetMethodParams): void - filterRecoverMethod?(params: VxeGlobalRendererHandles.FilterRecoverMethodParams): void - // 默认行为 - defaultFilterMethod?(params: VxeGlobalRendererHandles.FilterMethodParams): boolean - - // 单元格渲染 - cellClassName?: string | ((params: VxeGlobalRendererHandles.RenderDefaultParams) => string | VNodeClassName) - cellStyle?: VNodeStyle | ((params: VxeGlobalRendererHandles.RenderDefaultParams) => VNodeStyle) - renderHeader?(renderOpts: VxeGlobalRendererHandles.RenderHeaderOptions, params: VxeGlobalRendererHandles.RenderHeaderParams): T - renderDefault?(renderOpts: VxeGlobalRendererHandles.RenderDefaultOptions, params: VxeGlobalRendererHandles.RenderDefaultParams): T - renderFooter?(renderOpts: VxeGlobalRendererHandles.RenderFooterOptions, params: VxeGlobalRendererHandles.RenderFooterParams): T - exportMethod?(params: VxeGlobalRendererHandles.ExportMethodParams): string - footerExportMethod?(params: VxeGlobalRendererHandles.FooterExportMethodParams): string - - // 编辑渲染 - autofocus?: string | ((params: VxeGlobalRendererHandles.RenderEditParams | VxeGlobalRendererHandles.RenderCellParams) => HTMLElement | null) - autoselect?: boolean - renderEdit?(renderOpts: VxeGlobalRendererHandles.RenderEditOptions, params: VxeGlobalRendererHandles.RenderEditParams): T - renderCell?(renderOpts: VxeGlobalRendererHandles.RenderCellOptions, params: VxeGlobalRendererHandles.RenderCellParams): T - - // 内容渲染 - renderExpand?(renderOpts: VxeGlobalRendererHandles.RenderExpandOptions, params: VxeGlobalRendererHandles.RenderExpandParams): T - - // 工具栏-按钮渲染 - toolbarButtonClassName?: string | ((params: VxeGlobalRendererHandles.RenderButtonParams) => string | VNodeClassName) - renderToolbarButton?(renderOpts: VxeGlobalRendererHandles.RenderButtonOptions, params: VxeGlobalRendererHandles.RenderButtonParams): T - toolbarToolClassName?: string | ((params: VxeGlobalRendererHandles.RenderToolParams) => string | VNodeClassName) - renderToolbarTool?(renderOpts: VxeGlobalRendererHandles.RenderToolOptions, params: VxeGlobalRendererHandles.RenderToolParams): T - - // 表单-项渲染 - itemClassName?: string | ((params: VxeGlobalRendererHandles.RenderItemTitleParams) => string | VNodeClassName) - itemStyle?: VNodeStyle | ((params: VxeGlobalRendererHandles.RenderItemTitleParams) => VNodeStyle) - itemContentClassName?: string | ((params: VxeGlobalRendererHandles.RenderItemTitleParams) => string | VNodeClassName) - itemContentStyle?: VNodeStyle | ((params: VxeGlobalRendererHandles.RenderItemTitleParams) => VNodeStyle) - itemTitleClassName?: string | ((params: VxeGlobalRendererHandles.RenderItemTitleParams) => string | VNodeClassName) - itemTitleStyle?: VNodeStyle | ((params: VxeGlobalRendererHandles.RenderItemTitleParams) => VNodeStyle) - renderItemTitle?(renderOpts: VxeGlobalRendererHandles.RenderItemTitleOptions, params: VxeGlobalRendererHandles.RenderItemTitleParams): T - renderItemContent?(renderOpts: VxeGlobalRendererHandles.RenderItemContentOptions, params: VxeGlobalRendererHandles.RenderItemContentParams): T - itemVisibleMethod?(params: VxeGlobalRendererHandles.ItemVisibleMethodParams): boolean - itemResetMethod?(params: VxeGlobalRendererHandles.ItemResetMethodParams): void - - // 空内容渲染 - renderTableEmptyView?(renderOpts: VxeGlobalRendererHandles.RenderTableEmptyViewOptions, params: VxeGlobalRendererHandles.RenderEmptyParams): T - - /** - * 已废弃，请使用 renderTableEmptyView - * @deprecated - */ - renderEmpty?(renderOpts: VxeGlobalRendererHandles.RenderTableEmptyViewOptions, params: VxeGlobalRendererHandles.RenderEmptyParams): T -} - -export namespace VxeGlobalRendererHandles { - export type RenderResult = SlotVNodeType | SlotVNodeType[] - - export interface RenderFilterOptions extends VxeColumnPropTypes.FilterRender {} - - export interface RenderParams {} - - export type RenderFilterParams = { - $table: VxeTableConstructor & VxeTablePrivateMethods - $panel: VxeFilterPanel - column: { - filters: VxeTableDefines.FilterOption[] - } & VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - $rowIndex: number - } - - export type FilterMethodParams = { - $table: VxeTableConstructor & VxeTablePrivateMethods - value: any - option: VxeTableDefines.FilterOption - cellValue: any - row: any - column: VxeTableDefines.ColumnInfo - } - - export interface FilterRemoteMethod extends VxeTableDefines.FilterChangeParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - } - - export interface FilterResetMethodParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - options: VxeTableDefines.FilterOption[] - column: VxeTableDefines.ColumnInfo - } - - export interface FilterRecoverMethodParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - option: VxeTableDefines.FilterOption - column: VxeTableDefines.ColumnInfo - } - - export interface RenderHeaderOptions extends VxeGlobalRendererHandles.RenderOptions { } - - export interface RenderHeaderParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - $rowIndex: number - } - - export type RenderDefaultOptions = VxeColumnPropTypes.EditRender - export type RenderDefaultParams = RenderEditParams - - export interface RenderFooterOptions extends VxeGlobalRendererHandles.RenderOptions { } - - export interface RenderFooterParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - column: VxeTableDefines.ColumnInfo - columnIndex: number - _columnIndex: number - $columnIndex: number - $rowIndex: number - items: any[] - data: D[][] - } - - export interface ExportMethodParams { - row: D - column: VxeTableDefines.ColumnInfo - options: VxeTablePropTypes.ExportHandleOptions - } - - export interface FooterExportMethodParams { - items: any[] - _columnIndex: number - column: VxeTableDefines.ColumnInfo - options: VxeTablePropTypes.ExportHandleOptions - } - - export type RenderEditOptions = VxeColumnPropTypes.EditRender - - export interface RenderEditParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - rowid: string - row: D - rowIndex: number - $rowIndex: number - isHidden: boolean - fixed: VxeColumnPropTypes.Fixed - type: string - } - - export type RenderCellOptions = VxeColumnPropTypes.EditRender - export type RenderCellParams = { - $table: VxeTableConstructor & VxeTablePrivateMethods - $grid: VxeGridConstructor | null - column: VxeTableDefines.ColumnInfo - columnIndex: number - $columnIndex: number - rowid: string - row: D - rowIndex: number - $rowIndex: number - isHidden: boolean - fixed: VxeColumnPropTypes.Fixed - type: string - } - - export interface RenderExpandOptions extends VxeColumnPropTypes.ContentRender { } - export type RenderExpandParams = RenderEditParams - - export interface RenderButtonOptions extends VxeGlobalRendererHandles.RenderOptions { } - export interface RenderButtonParams { - $grid: VxeGridConstructor | null - $table: VxeTableConstructor & VxeTablePrivateMethods - button: VxeToolbarPropTypes.ButtonConfig - } - - export interface RenderToolOptions extends VxeGlobalRendererHandles.RenderOptions { } - export interface RenderToolParams { - $grid: VxeGridConstructor | null - $table: VxeTableConstructor & VxeTablePrivateMethods - tool: VxeToolbarPropTypes.ToolConfig - } - - export type RenderItemTitleOptions = FormItemRenderOptions - export type RenderItemTitleParams = FormItemTitleRenderParams - export type RenderItemContentOptions = FormItemRenderOptions - export type RenderItemContentParams = FormItemContentRenderParams - export type ItemVisibleMethodParams = FormItemVisibleParams - export type ItemResetMethodParams = FormItemResetParams - - export type RenderTableEmptyViewOptions = VxeTablePropTypes.EmptyRender - - export interface RenderEmptyParams { - $table: VxeTableConstructor & VxeTablePrivateMethods - } - - /** - * 渲染选项 - */ - export interface RenderOptions { - /** - * 渲染器名称 - */ - name?: string - /** - * 目标组件渲染的参数 - */ - props?: { [key: string]: any } - /** - * 目标组件渲染的属性 - */ - attrs?: { [key: string]: any } - /** - * 目标组件渲染的事件 - */ - events?: { [key: string]: (...args: any[]) => any } - /** - * 多目标渲染 - */ - children?: any[] - /** - * 渲染类型 - */ - cellType?: 'string' | 'number' - } - - /** - * 选项参数 - */ - export interface RenderOptionProps { - value?: string - label?: string - disabled?: string - key?: string - } - - /** - * 分组选项参数 - */ - export interface RenderOptionGroupProps { - options?: string - label?: string - key?: string - } -} - -/** - * 渲染器 - */ -export interface VxeGlobalRenderer { - mixin(options: { - [name: string]: RendererOptions - }): VxeGlobalRenderer - get(name: string | null | undefined): DefineRendererOption - add(name: string, options: RendererOptions): VxeGlobalRenderer - delete(name: string): void -} diff --git a/types/v-x-e-table/validators.d.ts b/types/v-x-e-table/validators.d.ts deleted file mode 100644 index c2b82d3455..0000000000 --- a/types/v-x-e-table/validators.d.ts +++ /dev/null @@ -1,30 +0,0 @@ -import { VxeTableDefines, VxeTableDataRow } from '../table' -import { VxeFormDefines } from '../form' - -/* eslint-disable no-use-before-define */ - -export namespace VxeGlobalValidatorsHandles { - export interface ValidatorsOptions { - itemValidatorMethod?: ItemValidatorMethod - cellValidatorMethod?: CellValidatorMethod - } - - export type ItemValidatorMethod = (params: ItemValidatorParams, ...args: any[]) => void | Error | Promise - export type CellValidatorMethod = (params: CellValidatorParams, ...args: any[]) => void | Error | Promise - export interface ItemValidatorParams extends VxeFormDefines.RuleValidatorParams {} - export interface CellValidatorParams extends VxeTableDefines.RuleValidatorParams {} -} - -/** - * 全局快捷菜单 - */ -export interface VxeGlobalValidators { - mixin(options: { - [code: string]: VxeGlobalValidatorsHandles.ValidatorsOptions - }): VxeGlobalValidators - has(code: string): boolean - get(code: string): VxeGlobalValidatorsHandles.ValidatorsOptions - add(code: string, callback: VxeGlobalValidatorsHandles.ValidatorsOptions): VxeGlobalValidators - delete(code: string): void - forEach(callback: (options: VxeGlobalValidatorsHandles.ValidatorsOptions, code: string) => void): void -} diff --git a/vue.config.js b/vue.config.js index cbaae8bf59..ca5261b760 100644 --- a/vue.config.js +++ b/vue.config.js @@ -6,14 +6,34 @@ function resolve (dir) { return path.join(__dirname, '.', dir) } -process.env.VUE_APP_VXE_TABLE_VERSION = pkg.version -process.env.VUE_APP_VXE_TABLE_ENV = 'development' +process.env.VUE_APP_VXE_VERSION = pkg.version +process.env.VUE_APP_VXE_ENV = 'development' + +const externalMaps = { + 'xe-utils': 'XEUtils', + 'vxe-pc-ui': 'VxeUI' +} + +const externals = {} +if (process.env.npm_lifecycle_event && process.env.npm_lifecycle_event.indexOf('lib') === 0) { + for (const key in externalMaps) { + const name = externalMaps[key] + const item = { + root: name, + commonjs: key, + commonjs2: key, + amd: key + } + externals[key] = item + } +} module.exports = defineConfig({ transpileDependencies: true, productionSourceMap: false, pages: { index: { + title: 'Vxe PC Table', entry: 'examples/main.ts', template: 'public/index.html', filename: 'index.html' @@ -30,25 +50,7 @@ module.exports = defineConfig({ }, output: { library: 'VXETable' - } - }, - chainWebpack (config) { - const XEUtils = { - root: 'XEUtils', - commonjs: 'xe-utils', - commonjs2: 'xe-utils', - amd: 'xe-utils' - } - if (process.env.npm_lifecycle_event && process.env.npm_lifecycle_event.indexOf('lib') === 0) { - if (config.has('externals')) { - config.externals - .set('xe-utils', XEUtils) - } else { - config - .set('externals', { - 'xe-utils': XEUtils - }) - } - } + }, + externals } })