vxe-table 4.23.8 → 4.23.9

package/lib/table/src/header.js

@@ -218,60 +218,75 @@ var header_default = (0, import_comp.defineVxeComponent)({
           });
           tcStyle.width = `${childWidth}px`;
         }
-        return (0, import_vue.h)("th", {
-          class: [
-            "vxe-table--column vxe-header--column",
-            colid,
-            fixedHiddenColumn ? "fixed--hidden" : "fixed--visible",
-            {
-              [`col--${headAlign}`]: headAlign,
-              [`col--${type}`]: type,
-              "col--last": isLastColumn,
-              "col--fixed": column.fixed,
-              "col--group": isColGroup,
-              "col--ellipsis": hasEllipsis,
-              "fixed--width": !isAutoCellWidth,
-              "is--pg-top": isCellPaddingTop,
-              "is--pg-bottom": isCellPaddingBottom,
-              "is--pg-left": isCellPaddingLeft,
-              "is--pg-right": isCellPaddingRight,
-              "is--sortable": column.sortable,
-              "col--filter": !!filters,
-              "is--filter-active": hasFilter,
-              "is--drag-active": columnOpts.drag && !column.fixed && !isDisabledDrag && (isCrossDrag || isPeerDrag || !column.parentId),
-              "is--drag-disabled": columnOpts.drag && isDisabledDrag,
-              "col--current": currColFlag && currentCol === column
-            },
-            headerClassName ? import_xe_utils.default.isFunction(headerClassName) ? headerClassName(cellParams) : headerClassName : "",
-            headerCellClassName ? import_xe_utils.default.isFunction(headerCellClassName) ? headerCellClassName(cellParams) : headerCellClassName : ""
-          ],
-          style: headerCellStyle ? import_xe_utils.default.isFunction(headerCellStyle) ? headerCellStyle(cellParams) : headerCellStyle : null,
-          ...thAttrs,
-          ...thOns,
-          key: showCustomHeader ? `${colid}${$columnIndex}` : columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
-        }, [
-          (0, import_vue.h)("div", {
-            class: ["vxe-cell", {
-              "c--title": showTitle,
-              "c--tooltip": showTooltip,
-              "c--ellipsis": showEllipsis
-            }],
-            style: tcStyle
-          }, isVNPreEmptyStatus || isOptimizeMode && fixedHiddenColumn ? [] : [
-            (0, import_vue.h)("div", {
+        return (0, import_vue.h)(
+          "th",
+          {
+            class: [
+              "vxe-table--column vxe-header--column",
               colid,
-              class: "vxe-cell--wrapper vxe-header-cell--wrapper"
-            }, column.renderHeader(cellParams))
-          ]),
-          /**
-           * 列宽拖动
-           */
-          !fixedHiddenColumn && showResizable && (!showCustomHeader || isLastRow) ? (0, import_vue.h)("div", {
-            class: "vxe-cell--col-resizable",
-            onMousedown: (evnt) => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
-            onDblclick: (evnt) => $xeTable.handleColResizeDblclickEvent(evnt, cellParams)
-          }) : renderEmptyElement($xeTable)
-        ]);
+              fixedHiddenColumn ? "fixed--hidden" : "fixed--visible",
+              {
+                [`col--${headAlign}`]: headAlign,
+                [`col--${type}`]: type,
+                "col--last": isLastColumn,
+                "col--fixed": column.fixed,
+                "col--group": isColGroup,
+                "col--ellipsis": hasEllipsis,
+                "fixed--width": !isAutoCellWidth,
+                "is--pg-top": isCellPaddingTop,
+                "is--pg-bottom": isCellPaddingBottom,
+                "is--pg-left": isCellPaddingLeft,
+                "is--pg-right": isCellPaddingRight,
+                "is--sortable": column.sortable,
+                "col--filter": !!filters,
+                "is--filter-active": hasFilter,
+                "is--drag-active": columnOpts.drag && !column.fixed && !isDisabledDrag && (isCrossDrag || isPeerDrag || !column.parentId),
+                "is--drag-disabled": columnOpts.drag && isDisabledDrag,
+                "col--current": currColFlag && currentCol === column
+              },
+              headerClassName ? import_xe_utils.default.isFunction(headerClassName) ? headerClassName(cellParams) : headerClassName : "",
+              headerCellClassName ? import_xe_utils.default.isFunction(headerCellClassName) ? headerCellClassName(cellParams) : headerCellClassName : ""
+            ],
+            style: headerCellStyle ? import_xe_utils.default.isFunction(headerCellStyle) ? headerCellStyle(cellParams) : headerCellStyle : null,
+            ...thAttrs,
+            ...thOns,
+            key: showCustomHeader ? `${colid}${$columnIndex}` : columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
+          },
+          [
+            (0, import_vue.h)(
+              "div",
+              {
+                class: [
+                  "vxe-cell",
+                  {
+                    "c--title": showTitle,
+                    "c--tooltip": showTooltip,
+                    "c--ellipsis": showEllipsis
+                  }
+                ],
+                style: tcStyle
+              },
+              isVNPreEmptyStatus || isOptimizeMode && fixedHiddenColumn ? [] : [
+                (0, import_vue.h)(
+                  "div",
+                  {
+                    colid,
+                    class: "vxe-cell--wrapper vxe-header-cell--wrapper"
+                  },
+                  column.renderHeader(cellParams)
+                )
+              ]
+            ),
+            /**
+             * 列宽拖动
+             */
+            !fixedHiddenColumn && showResizable && (!showCustomHeader || isLastRow) ? (0, import_vue.h)("div", {
+              class: "vxe-cell--col-resizable",
+              onMousedown: (evnt) => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
+              onDblclick: (evnt) => $xeTable.handleColResizeDblclickEvent(evnt, cellParams)
+            }) : renderEmptyElement($xeTable)
+          ]
+        );
       });
     };
     const renderFilterRows = (isOptimizeMode, cols) => {
@@ -340,40 +355,56 @@ var header_default = (0, import_comp.defineVxeComponent)({
         } else {
           tcStyle.minHeight = `${currCellHeight}px`;
         }
-        return (0, import_vue.h)("th", {
-          class: [
-            "vxe-table--column vxe-header--column is--floating-filters",
-            colid,
-            fixedHiddenColumn ? "fixed--hidden" : "fixed--visible",
-            {
-              [`col--${headAlign}`]: headAlign,
-              [`col--${type}`]: type,
-              "col--last": isLastColumn,
-              "col--fixed": column.fixed,
-              "col--ellipsis": hasEllipsis,
-              "fixed--width": !isAutoCellWidth,
-              "is--padding": isPadding,
-              "is--sortable": column.sortable,
-              "col--current": currColFlag && currentCol === column
-            }
-          ],
-          key: colid,
-          ...thAttrs
-        }, [
-          (0, import_vue.h)("div", {
-            class: ["vxe-cell", "" + (cellClassName || ""), {
-              "c--title": showTitle,
-              "c--tooltip": showTooltip,
-              "c--ellipsis": showEllipsis
-            }],
-            style: tcStyle
-          }, isOptimizeMode && fixedHiddenColumn && !floatingFilters ? [] : [
-            (0, import_vue.h)("div", {
+        return (0, import_vue.h)(
+          "th",
+          {
+            class: [
+              "vxe-table--column vxe-header--column is--floating-filters",
               colid,
-              class: "vxe-cell--wrapper vxe-header-cell--wrapper"
-            }, flSlot ? $xeTable.callSlot(flSlot, cellParams) : rtFloatingFilter && firstFilterOption ? (0, import_vn.getSlotVNs)(rtFloatingFilter(filterRender, cellParams)) : [])
-          ])
-        ]);
+              fixedHiddenColumn ? "fixed--hidden" : "fixed--visible",
+              {
+                [`col--${headAlign}`]: headAlign,
+                [`col--${type}`]: type,
+                "col--last": isLastColumn,
+                "col--fixed": column.fixed,
+                "col--ellipsis": hasEllipsis,
+                "fixed--width": !isAutoCellWidth,
+                "is--padding": isPadding,
+                "is--sortable": column.sortable,
+                "col--current": currColFlag && currentCol === column
+              }
+            ],
+            key: colid,
+            ...thAttrs
+          },
+          [
+            (0, import_vue.h)(
+              "div",
+              {
+                class: [
+                  "vxe-cell",
+                  "" + (cellClassName || ""),
+                  {
+                    "c--title": showTitle,
+                    "c--tooltip": showTooltip,
+                    "c--ellipsis": showEllipsis
+                  }
+                ],
+                style: tcStyle
+              },
+              isOptimizeMode && fixedHiddenColumn && !floatingFilters ? [] : [
+                (0, import_vue.h)(
+                  "div",
+                  {
+                    colid,
+                    class: "vxe-cell--wrapper vxe-header-cell--wrapper"
+                  },
+                  flSlot ? $xeTable.callSlot(flSlot, cellParams) : rtFloatingFilter && firstFilterOption ? (0, import_vn.getSlotVNs)(rtFloatingFilter(filterRender, cellParams)) : []
+                )
+              ]
+            )
+          ]
+        );
       });
     };
     const renderHeads = (isGroup, isOptimizeMode, headerGroups, renderColumnList) => {
@@ -382,24 +413,26 @@ var header_default = (0, import_comp.defineVxeComponent)({
       const floatingFilterOpts = computeFloatingFilterOpts.value;
       const rowVNs = headerGroups.map((cols, _rowIndex) => {
         const params = { $table: $xeTable, rowIndex: _rowIndex, _rowIndex, $rowIndex: _rowIndex, fixed: fixedType, type: renderType };
-        return (0, import_vue.h)("tr", {
-          key: _rowIndex,
-          class: [
-            "vxe-header--row",
-            headerRowClassName ? import_xe_utils.default.isFunction(headerRowClassName) ? headerRowClassName(params) : headerRowClassName : ""
-          ],
-          style: headerRowStyle ? import_xe_utils.default.isFunction(headerRowStyle) ? headerRowStyle(params) : headerRowStyle : null
-        }, renderRows(isGroup, isOptimizeMode, headerGroups, _rowIndex, cols));
+        return (0, import_vue.h)(
+          "tr",
+          {
+            key: _rowIndex,
+            class: ["vxe-header--row", headerRowClassName ? import_xe_utils.default.isFunction(headerRowClassName) ? headerRowClassName(params) : headerRowClassName : ""],
+            style: headerRowStyle ? import_xe_utils.default.isFunction(headerRowStyle) ? headerRowStyle(params) : headerRowStyle : null
+          },
+          renderRows(isGroup, isOptimizeMode, headerGroups, _rowIndex, cols)
+        );
       });
       if (floatingFilterOpts.enabled) {
         rowVNs.push(
-          (0, import_vue.h)("tr", {
-            key: "ff",
-            class: [
-              "vxe-header--row is--floating-filters",
-              "" + (floatingFilterOpts.rowClassName || "")
-            ]
-          }, renderFilterRows(isOptimizeMode, renderColumnList))
+          (0, import_vue.h)(
+            "tr",
+            {
+              key: "ff",
+              class: ["vxe-header--row is--floating-filters", "" + (floatingFilterOpts.rowClassName || "")]
+            },
+            renderFilterRows(isOptimizeMode, renderColumnList)
+          )
         );
       }
       return rowVNs;
@@ -452,77 +485,101 @@ var header_default = (0, import_comp.defineVxeComponent)({
           }
         }
       }
-      return (0, import_vue.h)("div", {
-        ref: refElem,
-        class: ["vxe-table--header-wrapper", fixedType ? `fixed-${fixedType}--wrapper` : "body--wrapper"],
-        xid: xID
-      }, [
-        (0, import_vue.h)("div", {
-          ref: refHeaderScroll,
-          class: "vxe-table--header-inner-wrapper",
-          onScroll(evnt) {
-            $xeTable.triggerHeaderScrollEvent(evnt, fixedType);
-          }
-        }, [
-          fixedType ? renderEmptyElement($xeTable) : (0, import_vue.h)("div", {
-            ref: refHeaderXSpace,
-            class: "vxe-body--x-space"
-          }),
-          (0, import_vue.h)("table", {
-            ref: refHeaderTable,
-            class: "vxe-table--header",
-            xid: xID,
-            cellspacing: 0,
-            cellpadding: 0,
-            border: 0,
-            xvm: isOptimizeMode ? "1" : null
-          }, [
-            /**
-             * 列宽
-             */
-            (0, import_vue.h)("colgroup", {
-              ref: refHeaderColgroup
-            }, renderColumnList.map((column, $columnIndex) => {
-              return (0, import_vue.h)("col", {
-                name: column.id,
-                key: $columnIndex,
-                style: {
-                  width: `${column.renderWidth}px`
-                }
-              });
-            })),
-            /**
-             * 头部
-             */
-            (0, import_vue.h)("thead", {
-              ref: refHeaderTHead
-            }, renderHeads(isGroup, isOptimizeMode, renderHeaderList, renderColumnList))
-          ]),
-          (0, import_utils.hasEnableConf)(mouseConfig, mouseOpts) && mouseOpts.area ? (0, import_vue.h)("div", {
-            class: "vxe-table--cell-area",
-            xid: xID
-          }, [
-            (0, import_vue.h)("span", {
-              class: "vxe-table--cell-main-area"
-            }),
-            (0, import_vue.h)("span", {
-              class: "vxe-table--cell-clip-area"
-            }),
-            (0, import_vue.h)("span", {
-              class: "vxe-table--cell-extend-area"
-            }),
-            (0, import_vue.h)("span", {
-              class: "vxe-table--cell-multi-area"
-            }),
-            (0, import_vue.h)("span", {
-              class: "vxe-table--cell-active-area"
-            }),
-            (0, import_vue.h)("span", {
-              class: "vxe-table--cell-col-status-area"
-            })
-          ]) : renderEmptyElement($xeTable)
-        ])
-      ]);
+      return (0, import_vue.h)(
+        "div",
+        {
+          ref: refElem,
+          class: ["vxe-table--header-wrapper", fixedType ? `fixed-${fixedType}--wrapper` : "body--wrapper"],
+          xid: xID
+        },
+        [
+          (0, import_vue.h)(
+            "div",
+            {
+              ref: refHeaderScroll,
+              class: "vxe-table--header-inner-wrapper",
+              onScroll(evnt) {
+                $xeTable.triggerHeaderScrollEvent(evnt, fixedType);
+              }
+            },
+            [
+              fixedType ? renderEmptyElement($xeTable) : (0, import_vue.h)("div", {
+                ref: refHeaderXSpace,
+                class: "vxe-body--x-space"
+              }),
+              (0, import_vue.h)(
+                "table",
+                {
+                  ref: refHeaderTable,
+                  class: "vxe-table--header",
+                  xid: xID,
+                  cellspacing: 0,
+                  cellpadding: 0,
+                  border: 0,
+                  xvm: isOptimizeMode ? "1" : null
+                },
+                [
+                  /**
+                   * 列宽
+                   */
+                  (0, import_vue.h)(
+                    "colgroup",
+                    {
+                      ref: refHeaderColgroup
+                    },
+                    renderColumnList.map((column, $columnIndex) => {
+                      return (0, import_vue.h)("col", {
+                        name: column.id,
+                        key: $columnIndex,
+                        style: {
+                          width: `${column.renderWidth}px`
+                        }
+                      });
+                    })
+                  ),
+                  /**
+                   * 头部
+                   */
+                  (0, import_vue.h)(
+                    "thead",
+                    {
+                      ref: refHeaderTHead
+                    },
+                    renderHeads(isGroup, isOptimizeMode, renderHeaderList, renderColumnList)
+                  )
+                ]
+              ),
+              (0, import_utils.hasEnableConf)(mouseConfig, mouseOpts) && mouseOpts.area ? (0, import_vue.h)(
+                "div",
+                {
+                  class: "vxe-table--cell-area",
+                  xid: xID
+                },
+                [
+                  (0, import_vue.h)("span", {
+                    class: "vxe-table--cell-main-area"
+                  }),
+                  (0, import_vue.h)("span", {
+                    class: "vxe-table--cell-clip-area"
+                  }),
+                  (0, import_vue.h)("span", {
+                    class: "vxe-table--cell-extend-area"
+                  }),
+                  (0, import_vue.h)("span", {
+                    class: "vxe-table--cell-multi-area"
+                  }),
+                  (0, import_vue.h)("span", {
+                    class: "vxe-table--cell-active-area"
+                  }),
+                  (0, import_vue.h)("span", {
+                    class: "vxe-table--cell-col-status-area"
+                  })
+                ]
+              ) : renderEmptyElement($xeTable)
+            ]
+          )
+        ]
+      );
     };
     (0, import_vue.watch)(() => props.tableColumn, uploadColumn);
     (0, import_vue.onMounted)(() => {