vxe-table 3.15.22 → 3.15.24

package/es/table/src/cell.js

@@ -10,7 +10,7 @@ function renderTitlePrefixIcon(h, params) {
     const titlePrefix = column.titlePrefix || column.titleHelp;
     if (titlePrefix) {
         return h('i', {
-            class: ['vxe-cell-title-prefix-icon', titlePrefix.iconStatus ? `theme--${titlePrefix.iconStatus}` : '', titlePrefix.icon || getIcon().TABLE_TITLE_PREFIX],
+            class: ['vxe-cell-title-prefix-icon', titlePrefix.iconStatus ? `theme--${titlePrefix.iconStatus}` : ''],
             on: {
                 mouseenter(evnt) {
                     $table.triggerHeaderTitleEvent(evnt, titlePrefix, params);
@@ -19,7 +19,11 @@ function renderTitlePrefixIcon(h, params) {
                     $table.handleTargetLeaveEvent(evnt);
                 }
             }
-        });
+        }, [
+            h('i', {
+                class: titlePrefix.icon || getIcon().TABLE_TITLE_PREFIX
+            })
+        ]);
     }
     return renderEmptyElement($table);
 }
@@ -28,7 +32,7 @@ function renderTitleSuffixIcon(h, params) {
     const titleSuffix = column.titleSuffix;
     if (titleSuffix) {
         return h('i', {
-            class: ['vxe-cell-title-suffix-icon', titleSuffix.iconStatus ? `theme--${titleSuffix.iconStatus}` : '', titleSuffix.icon || getIcon().TABLE_TITLE_SUFFIX],
+            class: ['vxe-cell-title-suffix-icon', titleSuffix.iconStatus ? `theme--${titleSuffix.iconStatus}` : ''],
             on: {
                 mouseenter(evnt) {
                     $table.triggerHeaderTitleEvent(evnt, titleSuffix, params);
@@ -37,7 +41,11 @@ function renderTitleSuffixIcon(h, params) {
                     $table.handleTargetLeaveEvent(evnt);
                 }
             }
-        });
+        }, [
+            h('i', {
+                class: titleSuffix.icon || getIcon().TABLE_TITLE_SUFFIX
+            })
+        ]);
     }
     return renderEmptyElement($table);
 }
@@ -1019,12 +1027,18 @@ export const Cell = {
                 isRequired && editOpts.showAsterisk
                     ? h('i', {
                         class: 'vxe-cell--required-icon'
-                    })
+                    }, [
+                        h('i', {
+                            class: 'vxe-cell--required-icon'
+                        })
+                    ])
                     : renderEmptyElement($table),
                 isEnableConf(editRender) && editOpts.showIcon
                     ? h('i', {
-                        class: ['vxe-cell--edit-icon', editOpts.icon || getIcon().TABLE_EDIT]
-                    })
+                        class: 'vxe-cell--edit-icon'
+                    }, [
+                        h('i')
+                    ])
                     : renderEmptyElement($table)
             ];
         }

package/es/table/src/util.js

@@ -1,6 +1,6 @@
 import XEUtils from 'xe-utils';
 import { ColumnInfo } from './columnInfo';
-import { isScale, isPx } from '../../ui/src/dom';
+import { isScale, isPx, queryElement } from '../../ui/src/dom';
 import { warnLog, errLog } from '../../ui/src/log';
 import { eqEmptyValue } from '../../ui/src/utils';
 const getAllConvertColumns = (columns, parentColumn) => {
@@ -154,7 +154,7 @@ function getPaddingLeftRightSize(elem) {
     }
     return 0;
 }
-function getElementMarginWidth(elem) {
+function getElementMarginAndWidth(elem) {
     if (elem) {
         const computedStyle = getComputedStyle(elem);
         const marginLeft = XEUtils.toNumber(computedStyle.marginLeft);
@@ -232,9 +232,6 @@ export function getRootColumn($xeTable, column) {
     }
     return column;
 }
-function queryCellElement(cell, selector) {
-    return cell.querySelector('.vxe-cell' + selector);
-}
 export function toFilters(filters) {
     if (filters && XEUtils.isArray(filters)) {
         return filters.map(({ label, value, data, resetValue, checked }) => {
@@ -262,19 +259,19 @@ export function getColReMinWidth(params) {
     const showTitle = headOverflow === 'title';
     const showTooltip = headOverflow === true || headOverflow === 'tooltip';
     const hasEllipsis = showTitle || showTooltip || showEllipsis;
-    const minTitleWidth = XEUtils.floor((XEUtils.toNumber(getComputedStyle(cell).fontSize) || 14) * 1.6);
-    const paddingLeftRight = getPaddingLeftRightSize(cell) + getPaddingLeftRightSize(queryCellElement(cell, ''));
+    const minTitleWidth = XEUtils.floor((XEUtils.toNumber(getComputedStyle(cell).fontSize) || 14) * 1.8);
+    const paddingLeftRight = getPaddingLeftRightSize(cell) + getPaddingLeftRightSize(queryElement(cell, '.vxe-cell'));
     let mWidth = minTitleWidth + paddingLeftRight;
     // 默认最小宽处理
     if (hasEllipsis) {
-        const dragIconWidth = getPaddingLeftRightSize(queryCellElement(cell, '>.vxe-cell--drag-handle'));
-        const checkboxIconWidth = getPaddingLeftRightSize(queryCellElement(cell, '>.vxe-cell--checkbox'));
-        const requiredIconWidth = getElementMarginWidth(queryCellElement(cell, '>.vxe-cell--required-icon'));
-        const editIconWidth = getElementMarginWidth(queryCellElement(cell, '>.vxe-cell--edit-icon'));
-        const prefixIconWidth = getElementMarginWidth(queryCellElement(cell, '>.vxe-cell-title-prefix-icon'));
-        const suffixIconWidth = getElementMarginWidth(queryCellElement(cell, '>.vxe-cell-title-suffix-icon'));
-        const sortIconWidth = getElementMarginWidth(queryCellElement(cell, '>.vxe-cell--sort'));
-        const filterIconWidth = getElementMarginWidth(queryCellElement(cell, '>.vxe-cell--filter'));
+        const dragIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--drag-handle'));
+        const checkboxIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--checkbox'));
+        const requiredIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--required-icon'));
+        const editIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--edit-icon'));
+        const prefixIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell-title-prefix-icon'));
+        const suffixIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell-title-suffix-icon'));
+        const sortIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--sort'));
+        const filterIconWidth = getElementMarginAndWidth(queryElement(cell, '.vxe-cell--filter'));
         mWidth += dragIconWidth + checkboxIconWidth + requiredIconWidth + editIconWidth + prefixIconWidth + suffixIconWidth + filterIconWidth + sortIconWidth;
     }
     // 如果设置最小宽

package/es/table/style.css

@@ -2291,29 +2291,38 @@
   position: relative;
   font-weight: var(--vxe-ui-table-header-font-weight);
 }
-.vxe-header--column.col--ellipsis > .vxe-cell {
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper {
   display: flex;
   align-items: center;
 }
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper .vxe-cell--drag-handle,
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper .vxe-cell--sort,
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper .vxe-cell--filter,
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper .vxe-cell-title-prefix-icon,
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper .vxe-cell-title-suffix-icon,
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper .vxe-cell--checkbox,
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper .vxe-cell-title-suffix-icon,
+.vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--wrapper .vxe-cell--required-icon {
+  flex-shrink: 0;
+}
 .vxe-header--column.col--ellipsis > .vxe-cell .vxe-cell--title {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.vxe-header--column.col--ellipsis > .vxe-cell > i:not(.vxe-cell--title), .vxe-header--column.col--ellipsis > .vxe-cell > span:not(.vxe-cell--title) {
-  flex-shrink: 0;
-}
 .vxe-header--column .vxe-cell--required-icon {
   display: inline-block;
   color: var(--vxe-ui-table-validate-error-color);
   width: 0.8em;
   height: 1em;
   line-height: 1em;
+  position: relative;
+}
+.vxe-header--column .vxe-cell--required-icon > i {
   font-family: Verdana, Arial, Tahoma;
   font-weight: normal;
-  position: relative;
 }
-.vxe-header--column .vxe-cell--required-icon:before {
+.vxe-header--column .vxe-cell--required-icon > i:before {
   content: "*";
   position: absolute;
   left: 0;