vxe-table 3.9.0-rc.2 → 3.9.0-rc.21

package/es/table/module/custom/panel.js

@@ -3,7 +3,7 @@ import { formatText } from '../../../ui/src/utils';
 import { addClass, removeClass } from '../../../ui/src/dom';
 import { errLog } from '../../../ui/src/log';
 import XEUtils from 'xe-utils';
-const { getI18n, getIcon } = VxeUI;
+const { getI18n, getIcon, renderEmptyElement } = VxeUI;
 function updateDropHint(_vm, evnt) {
     const { $refs } = _vm;
     const dragHintEl = $refs.dragHintElemRef;
@@ -267,7 +267,11 @@ const renderSimplePanel = (h, _vm) => {
         : []);
 };
 const renderPopupPanel = (h, _vm) => {
+    const VxeUIModalComponent = VxeUI.getComponent('VxeModal');
     const VxeUIButtonComponent = VxeUI.getComponent('VxeButton');
+    const VxeUIInputComponent = VxeUI.getComponent('VxeInput');
+    const VxeUITooltipComponent = VxeUI.getComponent('VxeTooltip');
+    const $xeTableCustomPanel = _vm;
     const { _e, $xetable, customStore } = _vm;
     const { customOpts, customColumnList, columnOpts, isMaxFixedColumn } = $xetable;
     const { modalOptions, allowVisible, allowSort, allowFixed, allowResizable, checkMethod, visibleMethod } = customOpts;
@@ -375,18 +379,20 @@ const renderPopupPanel = (h, _vm) => {
                     }, [
                         column.children && column.children.length
                             ? h('span', '-')
-                            : h('vxe-input', {
-                                props: {
-                                    type: 'integer',
-                                    disabled: isHidden,
-                                    value: column.renderResizeWidth
-                                },
-                                on: {
-                                    modelValue(value) {
-                                        column.renderResizeWidth = Math.max(0, Number(value));
+                            : (VxeUIInputComponent
+                                ? h(VxeUIInputComponent, {
+                                    props: {
+                                        type: 'integer',
+                                        disabled: isHidden,
+                                        value: column.renderResizeWidth
+                                    },
+                                    on: {
+                                        modelValue(value) {
+                                            column.renderResizeWidth = Math.max(0, Number(value));
+                                        }
                                     }
-                                }
-                            })
+                                })
+                                : renderEmptyElement($xeTableCustomPanel))
                     ])
                     : _e(),
                 allowFixed
@@ -420,177 +426,181 @@ const renderPopupPanel = (h, _vm) => {
     });
     const isAllChecked = customStore.isAll;
     const isAllIndeterminate = customStore.isIndeterminate;
-    return h('vxe-modal', {
-        key: 'modal',
-        props: {
-            className: ['vxe-table-custom-popup-wrapper', 'vxe-table--ignore-clear', modalOpts.className || ''].join(' '),
-            value: customStore.visible,
-            title: modalOpts.title || getI18n('vxe.custom.cstmTitle'),
-            width: modalOpts.width || Math.min(880, document.documentElement.clientWidth),
-            minWidth: modalOpts.minWidth || 700,
-            height: modalOpts.height || Math.min(680, document.documentElement.clientHeight),
-            minHeight: modalOpts.minHeight || 400,
-            showZoom: !!modalOpts.showZoom,
-            mask: !!modalOpts.mask,
-            lockView: !!modalOpts.lockView,
-            resize: !!modalOpts.resize,
-            escClosable: !!modalOpts.escClosable,
-            destroyOnClose: true,
-            showFooter: true
-        },
-        on: {
-            input(value) {
-                customStore.visible = value;
-            }
-        },
-        scopedSlots: {
-            default: () => {
-                return h('div', {
-                    ref: 'bodyElemRef',
-                    class: 'vxe-table-custom-popup--body'
-                }, [
-                    h('div', {
-                        class: 'vxe-table-custom-popup--table-wrapper'
+    return VxeUIModalComponent
+        ? h(VxeUIModalComponent, {
+            key: 'modal',
+            props: {
+                className: ['vxe-table-custom-popup-wrapper', 'vxe-table--ignore-clear', modalOpts.className || ''].join(' '),
+                value: customStore.visible,
+                title: modalOpts.title || getI18n('vxe.custom.cstmTitle'),
+                width: modalOpts.width || Math.min(880, document.documentElement.clientWidth),
+                minWidth: modalOpts.minWidth || 700,
+                height: modalOpts.height || Math.min(680, document.documentElement.clientHeight),
+                minHeight: modalOpts.minHeight || 400,
+                showZoom: !!modalOpts.showZoom,
+                mask: !!modalOpts.mask,
+                lockView: !!modalOpts.lockView,
+                resize: !!modalOpts.resize,
+                escClosable: !!modalOpts.escClosable,
+                destroyOnClose: true,
+                showFooter: true
+            },
+            on: {
+                input(value) {
+                    customStore.visible = value;
+                }
+            },
+            scopedSlots: {
+                default: () => {
+                    return h('div', {
+                        ref: 'bodyElemRef',
+                        class: 'vxe-table-custom-popup--body'
                     }, [
-                        h('table', {}, [
-                            h('colgroup', {}, [
-                                allowVisible
-                                    ? h('col', {
-                                        style: {
-                                            width: '80px'
-                                        }
-                                    })
-                                    : _e(),
-                                allowSort
-                                    ? h('col', {
-                                        style: {
-                                            width: '80px'
-                                        }
-                                    })
-                                    : _e(),
-                                h('col', {
-                                    style: {
-                                        minWidth: '120px'
-                                    }
-                                }),
-                                allowResizable
-                                    ? h('col', {
-                                        style: {
-                                            width: '140px'
-                                        }
-                                    })
-                                    : _e(),
-                                allowFixed
-                                    ? h('col', {
-                                        style: {
-                                            width: '200px'
-                                        }
-                                    })
-                                    : _e()
-                            ]),
-                            h('thead', {}, [
-                                h('tr', {}, [
+                        h('div', {
+                            class: 'vxe-table-custom-popup--table-wrapper'
+                        }, [
+                            h('table', {}, [
+                                h('colgroup', {}, [
                                     allowVisible
-                                        ? h('th', {}, [
-                                            h('div', {
-                                                class: ['vxe-table-custom--checkbox-option', {
-                                                        'is--checked': isAllChecked,
-                                                        'is--indeterminate': isAllIndeterminate
-                                                    }],
-                                                attrs: {
-                                                    title: getI18n('vxe.table.allTitle')
-                                                },
-                                                on: {
-                                                    click: _vm.allOptionEvent
-                                                }
-                                            }, [
-                                                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('col', {
+                                            style: {
+                                                width: '80px'
+                                            }
+                                        })
                                         : _e(),
                                     allowSort
-                                        ? h('th', {}, [
-                                            h('span', {
-                                                class: 'vxe-table-custom-popup--table-sort-help-title'
-                                            }, getI18n('vxe.custom.setting.colSort')),
-                                            h('vxe-tooltip', {
-                                                props: {
-                                                    enterable: true,
-                                                    content: getI18n('vxe.custom.setting.sortHelpTip'),
-                                                    popupClassName: 'vxe-table--ignore-clear'
-                                                },
-                                                scopedSlots: {
-                                                    default: () => {
-                                                        return h('i', {
-                                                            class: 'vxe-table-custom-popup--table-sort-help-icon vxe-icon-question-circle-fill'
-                                                        });
-                                                    }
-                                                }
-                                            })
-                                        ])
+                                        ? h('col', {
+                                            style: {
+                                                width: '80px'
+                                            }
+                                        })
                                         : _e(),
-                                    h('th', {}, getI18n('vxe.custom.setting.colTitle')),
+                                    h('col', {
+                                        style: {
+                                            minWidth: '120px'
+                                        }
+                                    }),
                                     allowResizable
-                                        ? h('th', {}, getI18n('vxe.custom.setting.colResizable'))
+                                        ? h('col', {
+                                            style: {
+                                                width: '140px'
+                                            }
+                                        })
                                         : _e(),
                                     allowFixed
-                                        ? h('th', {}, getI18n(`vxe.custom.setting.${maxFixedSize ? 'colFixedMax' : 'colFixed'}`, [maxFixedSize]))
+                                        ? h('col', {
+                                            style: {
+                                                width: '200px'
+                                            }
+                                        })
                                         : _e()
-                                ])
-                            ]),
-                            h('transition-group', {
-                                class: 'vxe-table-custom--body',
-                                props: {
-                                    tag: 'tbody',
-                                    name: 'vxe-table-custom--list'
-                                }
-                            }, trVNs)
-                        ])
-                    ]),
-                    h('div', {
-                        ref: 'dragHintElemRef',
-                        class: 'vxe-table-custom-popup--drag-hint'
-                    }, getI18n('vxe.custom.cstmDragTarget', [_vm.dragColumn ? _vm.dragColumn.getTitle() : '']))
-                ]);
-            },
-            footer: () => {
-                return h('div', {
-                    class: 'vxe-table-custom-popup--footer'
-                }, [
-                    h(VxeUIButtonComponent, {
-                        props: {
-                            content: customOpts.resetButtonText || getI18n('vxe.custom.cstmRestore')
-                        },
-                        on: {
-                            click: _vm.resetCustomEvent
-                        }
-                    }),
-                    h(VxeUIButtonComponent, {
-                        props: {
-                            content: customOpts.resetButtonText || getI18n('vxe.custom.cstmCancel')
-                        },
-                        on: {
-                            click: _vm.cancelCustomEvent
-                        }
-                    }),
-                    h(VxeUIButtonComponent, {
-                        props: {
-                            status: 'primary',
-                            content: customOpts.confirmButtonText || getI18n('vxe.custom.cstmConfirm')
-                        },
-                        on: {
-                            click: _vm.confirmCustomEvent
-                        }
-                    })
-                ]);
+                                ]),
+                                h('thead', {}, [
+                                    h('tr', {}, [
+                                        allowVisible
+                                            ? h('th', {}, [
+                                                h('div', {
+                                                    class: ['vxe-table-custom--checkbox-option', {
+                                                            'is--checked': isAllChecked,
+                                                            'is--indeterminate': isAllIndeterminate
+                                                        }],
+                                                    attrs: {
+                                                        title: getI18n('vxe.table.allTitle')
+                                                    },
+                                                    on: {
+                                                        click: _vm.allOptionEvent
+                                                    }
+                                                }, [
+                                                    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'))
+                                                ])
+                                            ])
+                                            : _e(),
+                                        allowSort
+                                            ? h('th', {}, [
+                                                h('span', {
+                                                    class: 'vxe-table-custom-popup--table-sort-help-title'
+                                                }, getI18n('vxe.custom.setting.colSort')),
+                                                VxeUITooltipComponent
+                                                    ? h(VxeUITooltipComponent, {
+                                                        props: {
+                                                            enterable: true,
+                                                            content: getI18n('vxe.custom.setting.sortHelpTip'),
+                                                            popupClassName: 'vxe-table--ignore-clear'
+                                                        },
+                                                        scopedSlots: {
+                                                            default: () => {
+                                                                return h('i', {
+                                                                    class: 'vxe-table-custom-popup--table-sort-help-icon vxe-icon-question-circle-fill'
+                                                                });
+                                                            }
+                                                        }
+                                                    })
+                                                    : renderEmptyElement($xeTableCustomPanel)
+                                            ])
+                                            : _e(),
+                                        h('th', {}, getI18n('vxe.custom.setting.colTitle')),
+                                        allowResizable
+                                            ? h('th', {}, getI18n('vxe.custom.setting.colResizable'))
+                                            : _e(),
+                                        allowFixed
+                                            ? h('th', {}, getI18n(`vxe.custom.setting.${maxFixedSize ? 'colFixedMax' : 'colFixed'}`, [maxFixedSize]))
+                                            : _e()
+                                    ])
+                                ]),
+                                h('transition-group', {
+                                    class: 'vxe-table-custom--body',
+                                    props: {
+                                        tag: 'tbody',
+                                        name: 'vxe-table-custom--list'
+                                    }
+                                }, trVNs)
+                            ])
+                        ]),
+                        h('div', {
+                            ref: 'dragHintElemRef',
+                            class: 'vxe-table-custom-popup--drag-hint'
+                        }, getI18n('vxe.custom.cstmDragTarget', [_vm.dragColumn ? _vm.dragColumn.getTitle() : '']))
+                    ]);
+                },
+                footer: () => {
+                    return h('div', {
+                        class: 'vxe-table-custom-popup--footer'
+                    }, [
+                        h(VxeUIButtonComponent, {
+                            props: {
+                                content: customOpts.resetButtonText || getI18n('vxe.custom.cstmRestore')
+                            },
+                            on: {
+                                click: _vm.resetCustomEvent
+                            }
+                        }),
+                        h(VxeUIButtonComponent, {
+                            props: {
+                                content: customOpts.resetButtonText || getI18n('vxe.custom.cstmCancel')
+                            },
+                            on: {
+                                click: _vm.cancelCustomEvent
+                            }
+                        }),
+                        h(VxeUIButtonComponent, {
+                            props: {
+                                status: 'primary',
+                                content: customOpts.confirmButtonText || getI18n('vxe.custom.cstmConfirm')
+                            },
+                            on: {
+                                click: _vm.confirmCustomEvent
+                            }
+                        })
+                    ]);
+                }
             }
-        }
-    });
+        })
+        : renderEmptyElement($xeTableCustomPanel);
 };
 export default {
     name: 'VxeTableCustomPanel',

package/es/table/module/edit/mixin.js

@@ -33,7 +33,7 @@ function insertTreeRow(_vm, newRecords, isAppend) {
             fullAllDataRowIdData[rowid] = rest;
         }
         else {
-            if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+            if (process.env.NODE_ENV === 'development') {
                 if (parentRowId) {
                     warnLog('vxe.error.unableInsert');
                 }
@@ -100,7 +100,7 @@ function handleInsertRowAt(_vm, records, row, isInsertNextRow) {
                     const parentLevel = parentRest ? parentRest.level : 0;
                     newRecords.forEach((item, i) => {
                         const rowid = getRowid(_vm, item);
-                        if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+                        if (process.env.NODE_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]}`]);
@@ -133,7 +133,7 @@ function handleInsertRowAt(_vm, records, row, isInsertNextRow) {
                     }
                 }
                 else {
-                    if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+                    if (process.env.NODE_ENV === 'development') {
                         warnLog('vxe.error.unableInsert');
                     }
                     insertTreeRow(_vm, newRecords, true);
@@ -561,7 +561,7 @@ export default {
             }
         },
         _clearActived(evnt) {
-            if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+            if (process.env.NODE_ENV === 'development') {
                 warnLog('vxe.error.delFunc', ['clearActived', 'clearEdit']);
             }
             // 即将废弃
@@ -599,7 +599,7 @@ export default {
             return this.$nextTick();
         },
         _getActiveRecord() {
-            if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+            if (process.env.NODE_ENV === 'development') {
                 warnLog('vxe.error.delFunc', ['getActiveRecord', 'getEditRecord']);
             }
             // 即将废弃
@@ -615,7 +615,7 @@ export default {
             return null;
         },
         _isActiveByRow(row) {
-            if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+            if (process.env.NODE_ENV === 'development') {
                 warnLog('vxe.error.delFunc', ['isActiveByRow', 'isEditByRow']);
             }
             // 即将废弃
@@ -632,6 +632,7 @@ export default {
          * 处理聚焦
          */
         handleFocus(params) {
+            const { editOpts } = this;
             const { row, column, cell } = params;
             const { editRender } = column;
             if (isEnableConf(editRender)) {
@@ -639,20 +640,23 @@ export default {
                 let autoFocus = editRender.autofocus || editRender.autoFocus;
                 let autoSelect = editRender.autoSelect || editRender.autoselect;
                 let inputElem;
-                if (!autoFocus && compRender) {
-                    autoFocus = compRender.tableAutoFocus || compRender.tableAutofocus || compRender.autoFocus || compRender.autofocus;
-                }
-                if (!autoSelect && compRender) {
-                    autoSelect = compRender.tableAutoSelect || compRender.autoSelect || compRender.autoselect;
-                }
-                // 如果指定了聚焦 class
-                if (XEUtils.isFunction(autoFocus)) {
-                    inputElem = autoFocus.call(this, params);
-                }
-                else if (autoFocus) {
-                    inputElem = cell.querySelector(autoFocus);
-                    if (inputElem) {
-                        inputElem.focus();
+                // 是否启用聚焦
+                if (editOpts.autoFocus) {
+                    if (!autoFocus && compRender) {
+                        autoFocus = compRender.tableAutoFocus || compRender.tableAutofocus || compRender.autoFocus || compRender.autofocus;
+                    }
+                    if (!autoSelect && compRender) {
+                        autoSelect = compRender.tableAutoSelect || compRender.autoSelect || compRender.autoselect;
+                    }
+                    // 如果指定了聚焦 class
+                    if (XEUtils.isFunction(autoFocus)) {
+                        inputElem = autoFocus.call(this, params);
+                    }
+                    else if (autoFocus) {
+                        inputElem = cell.querySelector(autoFocus);
+                        if (inputElem) {
+                            inputElem.focus();
+                        }
                     }
                 }
                 if (inputElem) {
@@ -669,13 +673,18 @@ export default {
                     }
                 }
                 else {
-                    // 显示到可视区中
-                    this.scrollToRow(row, column);
+                    // 是否自动定位
+                    if (editOpts.autoPos) {
+                        if (!column.fixed) {
+                            // 显示到可视区中
+                            this.scrollToRow(row, column);
+                        }
+                    }
                 }
             }
         },
         _setActiveRow(row) {
-            if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+            if (process.env.NODE_ENV === 'development') {
                 warnLog('vxe.error.delFunc', ['setActiveRow', 'setEditRow']);
             }
             // 即将废弃
@@ -692,7 +701,7 @@ export default {
             return this.setEditCell(row, column);
         },
         _setActiveCell(row, fieldOrColumn) {
-            if (process.env.VUE_APP_VXE_TABLE_ENV === 'development') {
+            if (process.env.NODE_ENV === 'development') {
                 warnLog('vxe.error.delFunc', ['setActiveCell', 'setEditCell']);
             }
             // 即将废弃

package/es/table/module/export/export-panel.js

@@ -1,9 +1,13 @@
 import { VxeUI } from '../../../ui';
 import XEUtils from 'xe-utils';
 import { formatText } from '../../../ui/src/utils';
-const { getI18n, getIcon } = VxeUI;
+import { errLog } from '../../../ui/src/log';
+const { getI18n, getIcon, globalMixins } = VxeUI;
 export default {
     name: 'VxeTableExportPanel',
+    mixins: [
+        globalMixins.sizeMixin
+    ],
     props: {
         defaultOptions: Object,
         storeData: Object
@@ -23,9 +27,6 @@ export default {
         };
     },
     computed: {
-        vSize() {
-            return this.size || this.$parent.size || this.$parent.vSize;
-        },
         checkedAll() {
             return this.storeData.columns.every((column) => column.checked);
         },
@@ -41,6 +42,33 @@ export default {
             return !defaultOptions.original && ['xlsx'].indexOf(defaultOptions.type) > -1;
         }
     },
+    created() {
+        const $xeTableExportPanel = this;
+        if (process.env.NODE_ENV === 'development') {
+            const VxeUIModalComponent = VxeUI.getComponent('VxeModal');
+            const VxeUIButtonComponent = VxeUI.getComponent('VxeButton');
+            const VxeUISelectComponent = VxeUI.getComponent('VxeSelect');
+            const VxeUIInputComponent = VxeUI.getComponent('VxeInput');
+            const VxeUICheckboxComponent = VxeUI.getComponent('VxeCheckbox');
+            $xeTableExportPanel.$nextTick(() => {
+                if (!VxeUIModalComponent) {
+                    errLog('vxe.error.reqComp', ['vxe-modal']);
+                }
+                if (!VxeUIButtonComponent) {
+                    errLog('vxe.error.reqComp', ['vxe-button']);
+                }
+                if (!VxeUISelectComponent) {
+                    errLog('vxe.error.reqComp', ['vxe-select']);
+                }
+                if (!VxeUIInputComponent) {
+                    errLog('vxe.error.reqComp', ['vxe-input']);
+                }
+                if (!VxeUICheckboxComponent) {
+                    errLog('vxe.error.reqComp', ['vxe-checkbox']);
+                }
+            });
+        }
+    },
     render(h) {
         const { _e, checkedAll, isAll: isAllChecked, isIndeterminate: isAllIndeterminate, showSheet, supportMerge, supportStyle, defaultOptions, storeData } = this;
         const { hasTree, hasMerge, isPrint, hasColgroup } = storeData;

package/es/table/module/export/import-panel.js

@@ -1,10 +1,13 @@
 import { VxeUI } from '../../../ui';
 import XEUtils from 'xe-utils';
 import { parseFile } from '../../../ui/src/utils';
-// import { errLog } from '../../../ui/src/log'
-const { getI18n, getIcon } = VxeUI;
+import { errLog } from '../../../ui/src/log';
+const { getI18n, getIcon, globalMixins } = VxeUI;
 export default {
     name: 'VxeTableImportPanel',
+    mixins: [
+        globalMixins.sizeMixin
+    ],
     props: {
         defaultOptions: Object,
         storeData: Object
@@ -19,9 +22,6 @@ export default {
         };
     },
     computed: {
-        vSize() {
-            return this.size || this.$parent.size || this.$parent.vSize;
-        },
         selectName() {
             return `${this.storeData.filename}.${this.storeData.type}`;
         },
@@ -38,6 +38,25 @@ export default {
             return `*.${typeList.map((item) => item.value).join(', *.')}`;
         }
     },
+    created() {
+        const $xeTableImportPanel = this;
+        if (process.env.NODE_ENV === 'development') {
+            const VxeUIModalComponent = VxeUI.getComponent('VxeModal');
+            const VxeUIButtonComponent = VxeUI.getComponent('VxeButton');
+            const VxeUISelectComponent = VxeUI.getComponent('VxeSelect');
+            $xeTableImportPanel.$nextTick(() => {
+                if (!VxeUIModalComponent) {
+                    errLog('vxe.error.reqComp', ['vxe-modal']);
+                }
+                if (!VxeUIButtonComponent) {
+                    errLog('vxe.error.reqComp', ['vxe-button']);
+                }
+                if (!VxeUISelectComponent) {
+                    errLog('vxe.error.reqComp', ['vxe-select']);
+                }
+            });
+        }
+    },
     render(h) {
         const { hasFile, parseTypeLabel, defaultOptions, storeData, selectName } = this;
         return h('vxe-modal', {