vxe-table 4.2.8 → 4.3.0-beta.2

package/es/button/src/button.js

@@ -157,16 +157,16 @@ export default defineComponent({
                             btnLeft = marginSize;
                         }
                         Object.assign(panelStyle, {
-                            left: btnLeft + "px",
+                            left: "".concat(btnLeft, "px"),
                             right: 'auto',
-                            top: btnTop + "px",
-                            minWidth: targetWidth + "px"
+                            top: "".concat(btnTop, "px"),
+                            minWidth: "".concat(targetWidth, "px")
                         });
                     }
                     else {
                         if (placement === 'top') {
                             panelPlacement = 'top';
-                            panelStyle.bottom = targetHeight + "px";
+                            panelStyle.bottom = "".concat(targetHeight, "px");
                         }
                         else if (!placement) {
                             // 如果下面不够放，则向上
@@ -174,7 +174,7 @@ export default defineComponent({
                                 // 如果上面不够放，则向下（优先）
                                 if (boundingTop - targetHeight - panelHeight > marginSize) {
                                     panelPlacement = 'top';
-                                    panelStyle.bottom = targetHeight + "px";
+                                    panelStyle.bottom = "".concat(targetHeight, "px");
                                 }
                             }
                         }
@@ -339,15 +339,15 @@ export default defineComponent({
                 return h('div', {
                     ref: refElem,
                     class: ['vxe-button--dropdown', className, (_a = {},
-                            _a["size--" + vSize] = vSize,
+                            _a["size--".concat(vSize)] = vSize,
                             _a['is--active'] = showPanel,
                             _a)]
                 }, [
                     h('button', {
                         ref: refButton,
-                        class: ['vxe-button', "type--" + btnType, (_b = {},
-                                _b["size--" + vSize] = vSize,
-                                _b["theme--" + status] = status,
+                        class: ['vxe-button', "type--".concat(btnType), (_b = {},
+                                _b["size--".concat(vSize)] = vSize,
+                                _b["theme--".concat(status)] = status,
                                 _b['is--round'] = round,
                                 _b['is--circle'] = circle,
                                 _b['is--disabled'] = disabled || loading,
@@ -361,7 +361,7 @@ export default defineComponent({
                         onClick: clickEvent
                     }, renderContent().concat([
                         h('i', {
-                            class: "vxe-button--dropdown-arrow " + GlobalConfig.icon.BUTTON_DROPDOWN
+                            class: "vxe-button--dropdown-arrow ".concat(GlobalConfig.icon.BUTTON_DROPDOWN)
                         })
                     ])),
                     h(Teleport, {
@@ -371,7 +371,7 @@ export default defineComponent({
                         h('div', {
                             ref: refBtnPanel,
                             class: ['vxe-button--dropdown-panel', (_c = {},
-                                    _c["size--" + vSize] = vSize,
+                                    _c["size--".concat(vSize)] = vSize,
                                     _c['animat--leave'] = reactData.animatVisible,
                                     _c['animat--enter'] = showPanel,
                                     _c)],
@@ -391,9 +391,9 @@ export default defineComponent({
             }
             return h('button', {
                 ref: refButton,
-                class: ['vxe-button', "type--" + btnType, (_d = {},
-                        _d["size--" + vSize] = vSize,
-                        _d["theme--" + status] = status,
+                class: ['vxe-button', "type--".concat(btnType), (_d = {},
+                        _d["size--".concat(vSize)] = vSize,
+                        _d["theme--".concat(status)] = status,
                         _d['is--round'] = round,
                         _d['is--circle'] = circle,
                         _d['is--disabled'] = disabled || loading,

package/es/button/style.css

@@ -46,8 +46,6 @@
   .vxe-button:not(.is--disabled) {
     color: #606266;
     cursor: pointer; }
-    .vxe-button:not(.is--disabled) .vxe-button--icon.vxe-icon--zoomin {
-      border-color: #606266; }
   .vxe-button.is--loading {
     cursor: progress; }
     .vxe-button.is--loading:before {
@@ -62,8 +60,6 @@
       pointer-events: none; }
   .vxe-button.is--disabled {
     color: #BFBFBF; }
-    .vxe-button.is--disabled .vxe-button--icon.vxe-icon--zoomin {
-      border-color: #BFBFBF; }
     .vxe-button.is--disabled:not(.is--loading) {
       cursor: no-drop; }
   .vxe-button.type--text {
@@ -128,8 +124,6 @@
       padding: 0 1em; }
     .vxe-button.type--button:not(.is--disabled):hover {
       color: #5faeff; }
-      .vxe-button.type--button:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin {
-        border-color: #5faeff; }
     .vxe-button.type--button:not(.is--disabled):focus {
       border-color: #409eff;
       box-shadow: 0 0 0.25em 0 #409eff; }
@@ -137,14 +131,8 @@
       color: #3196ff;
       border-color: #3196ff;
       background-color: #f7f7f7; }
-      .vxe-button.type--button:not(.is--disabled):active .vxe-button--icon.vxe-icon--zoomin {
-        background-color: #f7f7f7; }
-      .vxe-button.type--button:not(.is--disabled):active .vxe-button--icon.vxe-icon--zoomout:after {
-        background-color: #f7f7f7; }
     .vxe-button.type--button.theme--primary {
       color: #fff; }
-      .vxe-button.type--button.theme--primary .vxe-button--icon.vxe-icon--zoomin {
-        border-color: #fff; }
       .vxe-button.type--button.theme--primary:not(.is--disabled) {
         border-color: #409eff;
         background-color: #409eff; }
@@ -152,16 +140,10 @@
           color: #fff;
           background-color: #5faeff;
           border-color: #5faeff; }
-          .vxe-button.type--button.theme--primary:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin {
-            border-color: #5faeff; }
         .vxe-button.type--button.theme--primary:not(.is--disabled):active {
           color: #fff;
           background-color: #3196ff;
           border-color: #3196ff; }
-          .vxe-button.type--button.theme--primary:not(.is--disabled):active.vxe-icon--zoomin {
-            background-color: #3196ff; }
-          .vxe-button.type--button.theme--primary:not(.is--disabled):active.vxe-icon--zoomout:after {
-            background-color: #3196ff; }
       .vxe-button.type--button.theme--primary.is--disabled {
         border-color: #a6d2ff;
         background-color: #a6d2ff; }
@@ -170,8 +152,6 @@
         background-color: #409eff; }
     .vxe-button.type--button.theme--success {
       color: #fff; }
-      .vxe-button.type--button.theme--success .vxe-button--icon.vxe-icon--zoomin {
-        border-color: #fff; }
       .vxe-button.type--button.theme--success:not(.is--disabled) {
         border-color: #67c23a;
         background-color: #67c23a; }
@@ -179,16 +159,10 @@
           color: #fff;
           background-color: #79cb50;
           border-color: #79cb50; }
-          .vxe-button.type--button.theme--success:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin {
-            border-color: #79cb50; }
         .vxe-button.type--button.theme--success:not(.is--disabled):active {
           color: #fff;
           background-color: #61b636;
           border-color: #61b636; }
-          .vxe-button.type--button.theme--success:not(.is--disabled):active.vxe-icon--zoomin {
-            background-color: #61b636; }
-          .vxe-button.type--button.theme--success:not(.is--disabled):active.vxe-icon--zoomout:after {
-            background-color: #61b636; }
       .vxe-button.type--button.theme--success.is--disabled {
         border-color: #a3db87;
         background-color: #a3db87; }
@@ -197,8 +171,6 @@
         background-color: #67c23a; }
     .vxe-button.type--button.theme--info {
       color: #fff; }
-      .vxe-button.type--button.theme--info .vxe-button--icon.vxe-icon--zoomin {
-        border-color: #fff; }
       .vxe-button.type--button.theme--info:not(.is--disabled) {
         border-color: #909399;
         background-color: #909399; }
@@ -206,16 +178,10 @@
           color: #fff;
           background-color: #a0a3a8;
           border-color: #a0a3a8; }
-          .vxe-button.type--button.theme--info:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin {
-            border-color: #a0a3a8; }
         .vxe-button.type--button.theme--info:not(.is--disabled):active {
           color: #fff;
           background-color: #888b92;
           border-color: #888b92; }
-          .vxe-button.type--button.theme--info:not(.is--disabled):active.vxe-icon--zoomin {
-            background-color: #888b92; }
-          .vxe-button.type--button.theme--info:not(.is--disabled):active.vxe-icon--zoomout:after {
-            background-color: #888b92; }
       .vxe-button.type--button.theme--info.is--disabled {
         border-color: #c5c7ca;
         background-color: #c5c7ca; }
@@ -224,8 +190,6 @@
         background-color: #909399; }
     .vxe-button.type--button.theme--warning {
       color: #fff; }
-      .vxe-button.type--button.theme--warning .vxe-button--icon.vxe-icon--zoomin {
-        border-color: #fff; }
       .vxe-button.type--button.theme--warning:not(.is--disabled) {
         border-color: #e6a23c;
         background-color: #e6a23c; }
@@ -233,16 +197,10 @@
           color: #fff;
           background-color: #e9af57;
           border-color: #e9af57; }
-          .vxe-button.type--button.theme--warning:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin {
-            border-color: #e9af57; }
         .vxe-button.type--button.theme--warning:not(.is--disabled):active {
           color: #fff;
           background-color: #e49c2e;
           border-color: #e49c2e; }
-          .vxe-button.type--button.theme--warning:not(.is--disabled):active.vxe-icon--zoomin {
-            background-color: #e49c2e; }
-          .vxe-button.type--button.theme--warning:not(.is--disabled):active.vxe-icon--zoomout:after {
-            background-color: #e49c2e; }
       .vxe-button.type--button.theme--warning.is--disabled {
         border-color: #f2cd96;
         background-color: #f2cd96; }
@@ -251,8 +209,6 @@
         background-color: #e6a23c; }
     .vxe-button.type--button.theme--danger {
       color: #fff; }
-      .vxe-button.type--button.theme--danger .vxe-button--icon.vxe-icon--zoomin {
-        border-color: #fff; }
       .vxe-button.type--button.theme--danger:not(.is--disabled) {
         border-color: #f56c6c;
         background-color: #f56c6c; }
@@ -260,16 +216,10 @@
           color: #fff;
           background-color: #f78989;
           border-color: #f78989; }
-          .vxe-button.type--button.theme--danger:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin {
-            border-color: #f78989; }
         .vxe-button.type--button.theme--danger:not(.is--disabled):active {
           color: #fff;
           background-color: #f45e5e;
           border-color: #f45e5e; }
-          .vxe-button.type--button.theme--danger:not(.is--disabled):active.vxe-icon--zoomin {
-            background-color: #f45e5e; }
-          .vxe-button.type--button.theme--danger:not(.is--disabled):active.vxe-icon--zoomout:after {
-            background-color: #f45e5e; }
       .vxe-button.type--button.theme--danger.is--disabled {
         border-color: #fbcccc;
         background-color: #fbcccc; }
@@ -278,8 +228,6 @@
         background-color: #f56c6c; }
     .vxe-button.type--button.theme--perfect {
       color: #606266; }
-      .vxe-button.type--button.theme--perfect .vxe-button--icon.vxe-icon--zoomin {
-        border-color: #606266; }
       .vxe-button.type--button.theme--perfect:not(.is--disabled) {
         border-color: #f8f8f9;
         background-color: #f8f8f9; }
@@ -287,16 +235,10 @@
           color: #606266;
           background-color: white;
           border-color: white; }
-          .vxe-button.type--button.theme--perfect:not(.is--disabled):hover .vxe-button--icon.vxe-icon--zoomin {
-            border-color: white; }
         .vxe-button.type--button.theme--perfect:not(.is--disabled):active {
           color: #606266;
           background-color: #f0f0f2;
           border-color: #f0f0f2; }
-          .vxe-button.type--button.theme--perfect:not(.is--disabled):active.vxe-icon--zoomin {
-            background-color: #f0f0f2; }
-          .vxe-button.type--button.theme--perfect:not(.is--disabled):active.vxe-icon--zoomout:after {
-            background-color: #f0f0f2; }
       .vxe-button.type--button.theme--perfect.is--disabled {
         border-color: white;
         background-color: white; }
@@ -413,6 +355,7 @@
     transform: rotate(180deg); }
 
 .vxe-button--dropdown-arrow {
+  display: inline-block;
   font-size: 12px;
   margin-left: 4px;
   transition: transform 0.2s ease-in-out; }

package/es/checkbox/src/checkbox.js

@@ -69,11 +69,14 @@ export default defineComponent({
             var _a;
             var vSize = computeSize.value;
             var isDisabled = computeDisabled.value;
+            var isChecked = computeChecked.value;
+            var indeterminate = props.indeterminate;
             return h('label', {
                 class: ['vxe-checkbox', (_a = {},
-                        _a["size--" + vSize] = vSize,
-                        _a['is--indeterminate'] = props.indeterminate,
+                        _a["size--".concat(vSize)] = vSize,
+                        _a['is--indeterminate'] = indeterminate,
                         _a['is--disabled'] = isDisabled,
+                        _a['is--checked'] = isChecked,
                         _a)],
                 title: props.title
             }, [
@@ -81,11 +84,11 @@ export default defineComponent({
                     class: 'vxe-checkbox--input',
                     type: 'checkbox',
                     disabled: isDisabled,
-                    checked: computeChecked.value,
+                    checked: isChecked,
                     onChange: changeEvent
                 }),
                 h('span', {
-                    class: 'vxe-checkbox--icon'
+                    class: ['vxe-checkbox--icon', indeterminate ? 'vxe-icon-checkbox-indeterminate' : (isChecked ? 'vxe-icon-checkbox-checked' : 'vxe-icon-checkbox-unchecked')]
                 }),
                 h('span', {
                     class: 'vxe-checkbox--label'

package/es/checkbox/style.css

@@ -177,6 +177,38 @@
 .is--animat .vxe-radio > input:checked + span {
   transition: background-color 0.1s ease-in-out; }
 
+.vxe-checkbox .vxe-checkbox--icon {
+  font-size: 1.16em; }
+
+.vxe-checkbox .vxe-checkbox--icon {
+  color: #dcdfe6;
+  vertical-align: middle;
+  font-weight: 700;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none; }
+
+.is--checked.vxe-checkbox, .is--indeterminate.vxe-checkbox {
+  color: #409eff; }
+  .is--checked.vxe-checkbox .vxe-checkbox--icon, .is--indeterminate.vxe-checkbox .vxe-checkbox--icon {
+    color: #409eff; }
+
+.vxe-checkbox:not(.is--disabled) {
+  cursor: pointer; }
+  .vxe-checkbox:not(.is--disabled):hover .vxe-checkbox--icon {
+    color: #409eff; }
+
+.is--disabled.vxe-checkbox {
+  color: #BFBFBF;
+  cursor: not-allowed; }
+  .is--disabled.vxe-checkbox .vxe-checkbox--icon {
+    color: #dcdfe6; }
+
+.vxe-checkbox .vxe-checkbox--label {
+  padding-left: 0.5em;
+  vertical-align: middle; }
+
 /*checkbox-group*/
 .vxe-checkbox-group {
   display: inline-block;
@@ -188,13 +220,7 @@
   display: inline-block;
   vertical-align: middle;
   white-space: nowrap;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
-  line-height: 1;
-  cursor: pointer;
-  color: #606266; }
+  line-height: 1; }
   .vxe-checkbox + .vxe-checkbox {
     margin-left: 10px; }
   .vxe-checkbox > input[type="checkbox"] {
@@ -205,60 +231,21 @@
     -webkit-appearance: none;
        -moz-appearance: none;
             appearance: none; }
-  .vxe-checkbox > input + .vxe-checkbox--icon {
-    position: relative;
-    display: inline-block;
-    width: 1em;
-    height: 1em;
-    background-color: #fff;
-    vertical-align: middle;
-    border-radius: 2px;
-    border: 2px solid #dcdfe6; }
-    .vxe-checkbox > input + .vxe-checkbox--icon:before {
-      content: "";
-      position: absolute; }
-  .vxe-checkbox > input:checked + .vxe-checkbox--icon {
-    background-color: #409eff;
-    border-color: #409eff; }
-    .vxe-checkbox > input:checked + .vxe-checkbox--icon:before {
-      height: 0.64em;
-      width: 0.32em;
-      left: 50%;
-      top: 50%;
-      border: 2px solid #fff;
-      border-left: 0;
-      border-top: 0;
-      transform: translate(-50%, -50%) rotate(45deg); }
-    .vxe-checkbox > input:checked + .vxe-checkbox--icon + .vxe-checkbox--label {
-      color: #409eff; }
   .vxe-checkbox.is--indeterminate > input:not(:checked) + .vxe-checkbox--icon {
-    background-color: #409eff;
-    border-color: #409eff; }
-    .vxe-checkbox.is--indeterminate > input:not(:checked) + .vxe-checkbox--icon:before {
-      border: 0;
-      left: 50%;
-      top: 50%;
-      height: 2px;
-      width: 0.6em;
-      background-color: #fff;
-      transform: translate(-50%, -50%); }
+    color: #409eff; }
   .vxe-checkbox:not(.is--disabled) > input:focus + .vxe-checkbox--icon {
-    border-color: #409eff;
+    color: #409eff;
     box-shadow: 0 0 0.2em 0 #409eff; }
   .vxe-checkbox:not(.is--disabled):hover > input + .vxe-checkbox--icon {
     border-color: #409eff; }
   .vxe-checkbox.is--disabled {
     cursor: not-allowed; }
     .vxe-checkbox.is--disabled > input + .vxe-checkbox--icon {
-      border-color: #dcdfe6;
-      background-color: #f3f3f3; }
-      .vxe-checkbox.is--disabled > input + .vxe-checkbox--icon:before {
-        border-color: #c0c4cc; }
+      color: #dcdfe6; }
       .vxe-checkbox.is--disabled > input + .vxe-checkbox--icon + .vxe-checkbox--label {
         color: #BFBFBF; }
     .vxe-checkbox.is--disabled > input:checked + .vxe-checkbox--icon {
-      border-color: #dcdfe6;
-      background-color: #f3f3f3; }
+      color: #dcdfe6; }
   .vxe-checkbox .vxe-checkbox--label {
     padding-left: 0.5em;
     vertical-align: middle;
@@ -267,17 +254,9 @@
 
 .vxe-checkbox {
   font-size: 14px; }
-  .vxe-checkbox .vxe-checkbox--icon {
-    font-size: 16px; }
   .vxe-checkbox.size--medium {
     font-size: 14px; }
-    .vxe-checkbox.size--medium .vxe-checkbox--icon {
-      font-size: 15px; }
   .vxe-checkbox.size--small {
     font-size: 13px; }
-    .vxe-checkbox.size--small .vxe-checkbox--icon {
-      font-size: 14px; }
   .vxe-checkbox.size--mini {
     font-size: 12px; }
-    .vxe-checkbox.size--mini .vxe-checkbox--icon {
-      font-size: 14px; }

package/es/edit/src/hook.js

@@ -9,10 +9,14 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 import { nextTick } from 'vue';
 import XEUtils from 'xe-utils';
@@ -180,7 +184,7 @@ var editHook = {
                                     if (process.env.NODE_ENV === 'development') {
                                         if (item[treeOpts.parentField]) {
                                             if (parentRow_1 && item[treeOpts.parentField] !== parentRow_1[rowField]) {
-                                                errLog('vxe.error.errProp', [treeOpts.parentField + "=" + item[treeOpts.parentField], treeOpts.parentField + "=" + parentRow_1[rowField]]);
+                                                errLog('vxe.error.errProp', ["".concat(treeOpts.parentField, "=").concat(item[treeOpts.parentField]), "".concat(treeOpts.parentField, "=").concat(parentRow_1[rowField])]);
                                             }
                                         }
                                     }
@@ -217,8 +221,8 @@ var editHook = {
                             if (afIndex_1 === -1) {
                                 throw new Error(errLog('vxe.error.unableInsert'));
                             }
-                            afterFullData.splice.apply(afterFullData, __spreadArray([afIndex_1, 0], newRecords));
-                            tableFullData.splice.apply(tableFullData, __spreadArray([$xetable.findRowIndexOf(tableFullData, row), 0], newRecords));
+                            afterFullData.splice.apply(afterFullData, __spreadArray([afIndex_1, 0], newRecords, false));
+                            tableFullData.splice.apply(tableFullData, __spreadArray([$xetable.findRowIndexOf(tableFullData, row), 0], newRecords, false));
                             // 刷新单元格合并
                             mergeList.forEach(function (mergeItem) {
                                 var mergeRowIndex = mergeItem.row, mergeRowspan = mergeItem.rowspan;
@@ -339,7 +343,7 @@ var editHook = {
                 }
                 // 如果当前行被激活编辑，则清除激活状态
                 if (actived.row && $xetable.findRowIndexOf(rows, actived.row) > -1) {
-                    editMethods.clearActived();
+                    editMethods.clearEdit();
                 }
                 // 从新增中移除已删除的数据
                 rows.forEach(function (row) {
@@ -572,7 +576,14 @@ var editHook = {
                     return $xetable.scrollToRow(row, column).then(function () {
                         var cell = $xetable.getCell(row, column);
                         if (cell) {
-                            editPrivateMethods.handleActived({ row: row, rowIndex: $xetable.getRowIndex(row), column: column, columnIndex: $xetable.getColumnIndex(column), cell: cell, $table: $xetable });
+                            editPrivateMethods.handleActived({
+                                row: row,
+                                rowIndex: $xetable.getRowIndex(row),
+                                column: column,
+                                columnIndex: $xetable.getColumnIndex(column),
+                                cell: cell,
+                                $table: $xetable
+                            });
                             internalData._lastCallTime = Date.now();
                         }
                         return nextTick();
@@ -585,14 +596,19 @@ var editHook = {
              */
             setSelectCell: function (row, fieldOrColumn) {
                 var tableData = reactData.tableData;
-                var visibleColumn = internalData.visibleColumn;
                 var editOpts = computeEditOpts.value;
                 var column = XEUtils.isString(fieldOrColumn) ? $xetable.getColumnByField(fieldOrColumn) : fieldOrColumn;
                 if (row && column && editOpts.trigger !== 'manual') {
                     var rowIndex = $xetable.findRowIndexOf(tableData, row);
                     if (rowIndex > -1 && column) {
                         var cell = $xetable.getCell(row, column);
-                        var params = { row: row, rowIndex: rowIndex, column: column, columnIndex: visibleColumn.indexOf(column), cell: cell };
+                        var params = {
+                            row: row,
+                            rowIndex: rowIndex,
+                            column: column,
+                            columnIndex: $xetable.getColumnIndex(column),
+                            cell: cell
+                        };
                         $xetable.handleSelected(params, {});
                     }
                 }
@@ -628,7 +644,7 @@ var editHook = {
                             }
                             $xetable.closeTooltip();
                             if (actived.column) {
-                                editMethods.clearActived(evnt);
+                                editMethods.clearEdit(evnt);
                             }
                             type = 'edit-actived';
                             column.renderHeight = cell.offsetHeight;
@@ -739,7 +755,7 @@ var editHook = {
                 var selectMethod = function () {
                     if (isMouseSelected && (selected.row !== row || selected.column !== column)) {
                         if (actived.row !== row || (editOpts.mode === 'cell' ? actived.column !== column : false)) {
-                            editMethods.clearActived(evnt);
+                            editMethods.clearEdit(evnt);
                             editMethods.clearSelected();
                             if ($xetable.clearCellAreas) {
                                 $xetable.clearCellAreas();

package/es/export/src/export-panel.js

@@ -134,7 +134,7 @@ export default defineComponent({
         };
         var renderVN = function () {
             var defaultOptions = props.defaultOptions, storeData = props.storeData;
-            var isAll = reactData.isAll, isIndeterminate = reactData.isIndeterminate;
+            var isAllChecked = reactData.isAll, isAllIndeterminate = reactData.isIndeterminate;
             var hasTree = storeData.hasTree, hasMerge = storeData.hasMerge, isPrint = storeData.isPrint, hasColgroup = storeData.hasColgroup;
             var isHeader = defaultOptions.isHeader;
             var cols = [];
@@ -145,11 +145,13 @@ export default defineComponent({
             XEUtils.eachTree(storeData.columns, function (column) {
                 var colTitle = formatText(column.getTitle(), 1);
                 var isColGroup = column.children && column.children.length;
+                var isChecked = column.checked;
+                var indeterminate = column.halfChecked;
                 cols.push(h('li', {
-                    class: ['vxe-export--panel-column-option', "level--" + column.level, {
+                    class: ['vxe-export--panel-column-option', "level--".concat(column.level), {
                             'is--group': isColGroup,
-                            'is--checked': column.checked,
-                            'is--indeterminate': column.halfChecked,
+                            'is--checked': isChecked,
+                            'is--indeterminate': indeterminate,
                             'is--disabled': column.disabled
                         }],
                     title: colTitle,
@@ -160,13 +162,7 @@ export default defineComponent({
                     }
                 }, [
                     h('span', {
-                        class: 'vxe-checkbox--icon vxe-checkbox--checked-icon'
-                    }),
-                    h('span', {
-                        class: 'vxe-checkbox--icon vxe-checkbox--unchecked-icon'
-                    }),
-                    h('span', {
-                        class: 'vxe-checkbox--icon vxe-checkbox--indeterminate-icon'
+                        class: ['vxe-checkbox--icon', indeterminate ? GlobalConfig.icon.TABLE_CHECKBOX_INDETERMINATE : (isChecked ? GlobalConfig.icon.TABLE_CHECKBOX_CHECKED : GlobalConfig.icon.TABLE_CHECKBOX_UNCHECKED)]
                     }),
                     h('span', {
                         class: 'vxe-checkbox--label'
@@ -274,20 +270,14 @@ export default defineComponent({
                                                 }, [
                                                     h('li', {
                                                         class: ['vxe-export--panel-column-option', {
-                                                                'is--checked': isAll,
-                                                                'is--indeterminate': isIndeterminate
+                                                                'is--checked': isAllChecked,
+                                                                'is--indeterminate': isAllIndeterminate
                                                             }],
                                                         title: GlobalConfig.i18n('vxe.table.allTitle'),
                                                         onClick: allColumnEvent
                                                     }, [
                                                         h('span', {
-                                                            class: 'vxe-checkbox--icon vxe-checkbox--checked-icon'
-                                                        }),
-                                                        h('span', {
-                                                            class: 'vxe-checkbox--icon vxe-checkbox--unchecked-icon'
-                                                        }),
-                                                        h('span', {
-                                                            class: 'vxe-checkbox--icon vxe-checkbox--indeterminate-icon'
+                                                            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'