ele-admin-plus 1.2.1-beta.2 → 1.2.1-beta.4

package/lib/ele-data-table/index.cjs

@@ -2,13 +2,16 @@
 const vue = require("vue");
 const elementPlus = require("element-plus");
 const core = require("../utils/core");
+const TableColumns = require("./components/table-columns");
 const util = require("./util");
 const props = require("./props");
-const index = vue.defineComponent({
+const ownSlots = ["default", "append", "empty"];
+const _sfc_main = vue.defineComponent({
   name: "EleDataTable",
+  components: { ElTable: elementPlus.ElTable, ElEmpty: elementPlus.ElEmpty, TableColumns },
   props: props.dataTableProps,
   emits: props.dataTableEmits,
-  setup(props$1, { emit, slots, expose }) {
+  setup(props$1, { emit }) {
     const events = util.useEmits(emit);
     const methods = util.useMethods(() => tableRef.value);
     const { isLayoutFixedHead, isLayoutMaximized } = util.useStickyHeader();
@@ -33,6 +36,78 @@ const index = vue.defineComponent({
       var _a;
       return ((_a = props$1.treeProps) == null ? void 0 : _a.children) || "children";
     });
+    const tableProps = vue.computed(() => {
+      const propKeys = props.tablePropKeys.filter(
+        (k) => ![
+          "currentRowKey",
+          "showOverflowTooltip",
+          "tooltipOptions",
+          "tooltipEffect"
+        ].includes(k)
+      );
+      return {
+        ...core.pick(props$1, propKeys),
+        ...core.omit(events, [
+          "onUpdate:currentRowKey",
+          "onUpdate:selectedRowKeys",
+          "onRowClick",
+          "onHeaderClick",
+          "onSortChange",
+          "onFilterChange",
+          "onCurrentChange",
+          "onSelect",
+          "onSelectAll",
+          "onSelectionChange"
+        ])
+      };
+    });
+    const handleRowClick = (row, column, event) => {
+      if (props$1.rowClickChecked && !util.isDisableRow(row, props$1.data.indexOf(row), props$1.columns)) {
+        const selections = methods.getSelectionRows();
+        if (props$1.rowClickChecked === "smart" && (!selections || !selections.length || selections.length === 1)) {
+          const key = core.getValue(row, props$1.rowKey);
+          updateCheckedState(key == null ? [] : [key]);
+        } else {
+          toggleRowSelection(row);
+        }
+      }
+      events.onRowClick(row, column, event);
+    };
+    const handleHeaderClick = (column, e) => {
+      if (column.sortable && column.filters) {
+        const el = e.currentTarget;
+        if (el) {
+          const caretEl = el.querySelector(".caret-wrapper");
+          caretEl && caretEl.dispatchEvent(new MouseEvent("click"));
+        }
+      }
+      events.onHeaderClick(column, e);
+    };
+    const handleSortChange = (sorter) => {
+      const currentSorter = tableState.sorter;
+      if (currentSorter && sorter.prop === currentSorter.prop && sorter.order === currentSorter.order) {
+        return;
+      }
+      tableState.sorter = sorter;
+      events.onSortChange(sorter);
+    };
+    const handleFilterChange = (filter) => {
+      tableState.filter = util.getTableFilter(tableRef.value) ?? filter;
+      events.onFilterChange(tableState.filter);
+    };
+    const handleCurrentChange = (row, old) => {
+      if (row != null && row !== old) {
+        updateSelectedState(core.getValue(row, props$1.rowKey), row);
+      }
+    };
+    const handleSelect = (selection, row) => {
+      events.onSelect(selection, row);
+      updateCheckedState(util.getRowKeys(selection, props$1.rowKey), selection);
+    };
+    const handleSelectAll = (selection) => {
+      updateCheckedState(util.getRowKeys(selection, props$1.rowKey), selection);
+      events.onSelectAll(selection);
+    };
     const updateScrollBar = () => {
       var _a;
       const scrollBarRef = (_a = tableRef.value) == null ? void 0 : _a.scrollBarRef;
@@ -63,7 +138,11 @@ const index = vue.defineComponent({
     };
     const setSelectedRows = (rows) => {
       if (rows) {
-        updateCheckedState(util.getRowKeys(rows, props$1.rowKey), rows, !!rows.length);
+        updateCheckedState(
+          util.getRowKeys(rows, props$1.rowKey),
+          rows,
+          !!rows.length
+        );
       }
     };
     const setSelectedRowKeys = (keys) => {
@@ -95,7 +174,12 @@ const index = vue.defineComponent({
         return;
       }
       if (key != null) {
-        const row = util.getRowByKey(key, props$1.data, props$1.rowKey, childKey.value);
+        const row = util.getRowByKey(
+          key,
+          props$1.data,
+          props$1.rowKey,
+          childKey.value
+        );
         if (row != null || props$1.reserveCurrent) {
           tableState.oldRow = tableState.row;
           tableState.row = row || item || void 0;
@@ -138,7 +222,9 @@ const index = vue.defineComponent({
         childKey.value
       );
       const itemKeys = items ? items.map((d) => core.getValue(d, props$1.rowKey)) : [];
-      const oldKeys = tableState.checked.map((d) => core.getValue(d, props$1.rowKey));
+      const oldKeys = tableState.checked.map(
+        (d) => core.getValue(d, props$1.rowKey)
+      );
       const checkedKeys = [];
       const checked = [];
       keys.forEach((key) => {
@@ -189,7 +275,12 @@ const index = vue.defineComponent({
     const updateSelectedAndChecked = () => {
       const key = tableState.key;
       if (key != null) {
-        const row = util.getRowByKey(key, props$1.data, props$1.rowKey, childKey.value);
+        const row = util.getRowByKey(
+          key,
+          props$1.data,
+          props$1.rowKey,
+          childKey.value
+        );
         if (row != null) {
           updateSelectedState(key, row);
         } else if (!props$1.reserveCurrent) {
@@ -238,7 +329,10 @@ const index = vue.defineComponent({
             methods.doLayout();
             updateScrollBar();
             if (sorter) {
-              methods.sort(sorter.prop, sorter.order || "ascending");
+              methods.sort(
+                sorter.prop,
+                sorter.order || "ascending"
+              );
             }
           });
         }
@@ -271,8 +365,24 @@ const index = vue.defineComponent({
         updateCheckedState(props$1.selectedRowKeys);
       }
     });
-    const exposeValue = {
+    return {
+      ownSlots,
+      getBodyRowClass: util.getBodyRowClass,
+      getHeadRowClass: util.getHeadRowClass,
       ...methods,
+      isLayoutFixedHead,
+      isLayoutMaximized,
+      tableRef,
+      tableCols,
+      tableOverflowTooltip,
+      tableProps,
+      handleRowClick,
+      handleHeaderClick,
+      handleSortChange,
+      handleFilterChange,
+      handleCurrentChange,
+      handleSelect,
+      handleSelectAll,
       clearSort,
       clearSelection,
       toggleRowSelection,
@@ -282,116 +392,88 @@ const index = vue.defineComponent({
       setSelectedRows,
       setSelectedRowKeys,
       toggleRowExpansionAll,
-      updateSelectedAndChecked,
-      tableRef
-    };
-    expose(exposeValue);
-    return () => {
-      return vue.h(
-        elementPlus.ElTable,
-        {
-          ...core.pick(props$1, props.tablePropKeys),
-          ...core.omit(events, [
-            "onUpdate:currentRowKey",
-            "onUpdate:selectedRowKeys"
-          ]),
-          ref: tableRef,
-          class: [
-            "ele-data-table",
-            { "is-sticky": props$1.sticky },
-            { "is-layout-fixed-head": props$1.sticky && isLayoutFixedHead.value },
-            { "is-layout-maximized": props$1.sticky && isLayoutMaximized.value },
-            { "is-sticky": props$1.sticky },
-            { "hide-header": !props$1.showHeader },
-            { "hide-bottom-line": !props$1.bottomLine }
-          ],
-          currentRowKey: void 0,
-          emptyText: props$1.errorText || props$1.emptyText,
-          rowClassName: (param) => {
-            return util.getBodyRowClass(props$1.rowClassName, param);
-          },
-          headerRowClassName: (param) => {
-            return util.getHeadRowClass(
-              props$1.headerRowClassName,
-              param,
-              props$1.headerEllipsis
-            );
-          },
-          onRowClick: (row, column, event) => {
-            if (props$1.rowClickChecked && !util.isDisableRow(row, props$1.data.indexOf(row), props$1.columns)) {
-              const selections = methods.getSelectionRows();
-              if (props$1.rowClickChecked === "smart" && (!selections || !selections.length || selections.length === 1)) {
-                const key = core.getValue(row, props$1.rowKey);
-                updateCheckedState(key == null ? [] : [key]);
-              } else {
-                toggleRowSelection(row);
-              }
-            }
-            events.onRowClick(row, column, event);
-          },
-          onHeaderClick: (column, e) => {
-            if (column.sortable && column.filters) {
-              const el = e.currentTarget;
-              if (el) {
-                const caretEl = el.querySelector(".caret-wrapper");
-                caretEl && caretEl.dispatchEvent(new MouseEvent("click"));
-              }
-            }
-            events.onHeaderClick(column, e);
-          },
-          onSortChange: (sorter) => {
-            const currentSorter = tableState.sorter;
-            if (currentSorter && sorter.prop === currentSorter.prop && sorter.order === currentSorter.order) {
-              return;
-            }
-            tableState.sorter = sorter;
-            events.onSortChange(sorter);
-          },
-          onFilterChange: (filter) => {
-            tableState.filter = util.getTableFilter(tableRef.value) ?? filter;
-            events.onFilterChange(tableState.filter);
-          },
-          // 重写选中逻辑
-          onCurrentChange: (row, old) => {
-            if (row != null && row !== old) {
-              updateSelectedState(core.getValue(row, props$1.rowKey), row);
-            }
-          },
-          onSelect: (selection, row) => {
-            events.onSelect(selection, row);
-            updateCheckedState(util.getRowKeys(selection, props$1.rowKey), selection);
-          },
-          onSelectAll: (selection) => {
-            updateCheckedState(util.getRowKeys(selection, props$1.rowKey), selection);
-            events.onSelectAll(selection);
-          },
-          onSelectionChange: () => {
-          },
-          // 移除提示组件相关属性
-          showOverflowTooltip: void 0,
-          tooltipOptions: void 0,
-          tooltipEffect: void 0
-        },
-        {
-          default: () => {
-            return util.getCols(
-              tableCols.value,
-              props$1.pageIndex,
-              slots,
-              props$1.slotNormalize,
-              tableOverflowTooltip.value
-            );
-          },
-          append: slots.append,
-          empty: util.getEmptySlot(
-            slots,
-            props$1.emptyProps,
-            props$1.emptyText,
-            props$1.errorText
-          )
-        }
-      );
+      updateSelectedAndChecked
     };
   }
 });
+const _export_sfc = (sfc, props2) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props2) {
+    target[key] = val;
+  }
+  return target;
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_TableColumns = vue.resolveComponent("TableColumns");
+  const _component_ElEmpty = vue.resolveComponent("ElEmpty");
+  const _component_ElTable = vue.resolveComponent("ElTable");
+  return vue.openBlock(), vue.createBlock(_component_ElTable, vue.mergeProps(_ctx.tableProps, {
+    ref: "tableRef",
+    emptyText: _ctx.errorText || _ctx.emptyText,
+    rowClassName: (param) => _ctx.getBodyRowClass(_ctx.rowClassName, param),
+    headerRowClassName: (param) => _ctx.getHeadRowClass(_ctx.headerRowClassName, param, _ctx.headerEllipsis),
+    class: [
+      "ele-data-table",
+      { "is-sticky": _ctx.sticky },
+      { "is-layout-fixed-head": _ctx.sticky && _ctx.isLayoutFixedHead },
+      { "is-layout-maximized": _ctx.sticky && _ctx.isLayoutMaximized },
+      { "is-sticky": _ctx.sticky },
+      { "hide-header": !_ctx.showHeader },
+      { "hide-bottom-line": !_ctx.bottomLine }
+    ],
+    onRowClick: _ctx.handleRowClick,
+    onHeaderClick: _ctx.handleHeaderClick,
+    onSortChange: _ctx.handleSortChange,
+    onFilterChange: _ctx.handleFilterChange,
+    onCurrentChange: _ctx.handleCurrentChange,
+    onSelect: _ctx.handleSelect,
+    onSelectAll: _ctx.handleSelectAll
+  }), vue.createSlots({
+    default: vue.withCtx(() => [
+      _ctx.tableCols && _ctx.tableCols.length ? (vue.openBlock(), vue.createBlock(_component_TableColumns, {
+        key: 0,
+        columns: _ctx.tableCols,
+        pageIndex: _ctx.pageIndex,
+        slotNormalize: _ctx.slotNormalize,
+        globalTooltip: _ctx.tableOverflowTooltip
+      }, vue.createSlots({ _: 2 }, [
+        vue.renderList(Object.keys(_ctx.$slots).filter((k) => !_ctx.ownSlots.includes(k)), (name) => {
+          return {
+            name,
+            fn: vue.withCtx((slotProps) => [
+              vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(slotProps || {})))
+            ])
+          };
+        })
+      ]), 1032, ["columns", "pageIndex", "slotNormalize", "globalTooltip"])) : vue.createCommentVNode("", true)
+    ]),
+    _: 2
+  }, [
+    _ctx.$slots.append ? {
+      name: "append",
+      fn: vue.withCtx((slotProps) => [
+        vue.renderSlot(_ctx.$slots, "append", vue.normalizeProps(vue.guardReactiveProps(slotProps || {})))
+      ]),
+      key: "0"
+    } : void 0,
+    _ctx.$slots.empty || _ctx.emptyProps ? {
+      name: "empty",
+      fn: vue.withCtx(() => [
+        _ctx.$slots.empty ? vue.renderSlot(_ctx.$slots, "empty", {
+          key: 0,
+          text: _ctx.emptyText,
+          error: _ctx.errorText
+        }) : _ctx.emptyProps ? (vue.openBlock(), vue.createBlock(_component_ElEmpty, vue.mergeProps({
+          key: 1,
+          imageSize: 68
+        }, !_ctx.emptyProps || _ctx.emptyProps === true ? {} : _ctx.emptyProps, {
+          description: _ctx.errorText || _ctx.emptyText,
+          class: "ele-table-empty"
+        }), null, 16, ["description"])) : vue.createCommentVNode("", true)
+      ]),
+      key: "1"
+    } : void 0
+  ]), 1040, ["emptyText", "rowClassName", "headerRowClassName", "class", "onRowClick", "onHeaderClick", "onSortChange", "onFilterChange", "onCurrentChange", "onSelect", "onSelectAll"]);
+}
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 module.exports = index;