ele-admin-plus 1.4.1 → 1.5.0-beta.2

package/lib/ele-pro-table/exceljs-plugin.cjs

@@ -14,7 +14,6 @@ function getExportWorkbook(params) {
     const sheetCols = [];
     const rowStyles = [];
     item.forEach((d, colIndex) => {
-      var _a;
       if (!d.isTreeCell || !d.indent) {
         sheetCols.push(d.text ?? "");
       } else {
@@ -25,7 +24,7 @@ function getExportWorkbook(params) {
         font: { size: 12, bold: index < headerData.length },
         alignment: {
           vertical: d.isTreeIndex && d.rowspan !== 1 ? "top" : "middle",
-          horizontal: d.isExpandCell ? "left" : ((_a = d.column) == null ? void 0 : _a.align) || "left",
+          horizontal: d.isExpandCell ? "left" : d.column?.align || "left",
           wrapText: d.isExpandCell ? true : false,
           indent: d.isExpandCell ? 1 : 0
         },
@@ -48,7 +47,7 @@ function getExportWorkbook(params) {
     sheetRows.push(sheetCols);
     sheetStyles.push(rowStyles);
     const expandCell = item.find((d) => d.isExpandCell && d.colspan);
-    const lines = String((expandCell == null ? void 0 : expandCell.text) ?? "").split("\n").length || 1;
+    const lines = String(expandCell?.text ?? "").split("\n").length || 1;
     sheetRowHeight.push(lines * 20);
   });
   sheet.addRows(sheetRows).forEach((row, index) => {
@@ -66,7 +65,7 @@ function getExportWorkbook(params) {
   });
   return workbook;
 }
-const exceljsPlugin = function(params) {
+const exceljsExportPlugin = function(params) {
   return new Promise((resolve, reject) => {
     getExportWorkbook(params).xlsx.writeBuffer().then((data) => {
       common.download(data, `${params.fileName}.xlsx`);
@@ -77,5 +76,5 @@ const exceljsPlugin = function(params) {
     });
   });
 };
-exports.exceljsPlugin = exceljsPlugin;
+exports.exceljsExportPlugin = exceljsExportPlugin;
 exports.getExportWorkbook = getExportWorkbook;

package/lib/ele-pro-table/exceljs-plugin.d.ts

@@ -9,4 +9,4 @@ export declare function getExportWorkbook(params: BeforeExportParams): ExcelJS.W
 /**
  * 使用 ExcelJS 进行导出的插件
  */
-export declare const exceljsPlugin: ExportPlugin;
+export declare const exceljsExportPlugin: ExportPlugin;

package/lib/ele-pro-table/html-plugin.cjs

@@ -0,0 +1,117 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const common = require("../utils/common");
+function getTableHtml(params) {
+  const { headerData, bodyData, footerData, bodyCols } = params;
+  const tdPadding = "padding: 9px 12px;";
+  const tableHtml = [
+    '<table style="width: 100%;border-collapse: collapse;" border="1">',
+    "<colgroup>",
+    ...bodyCols.map(
+      (c) => c.width == null ? "<col/>" : `<col width="${c.width}"/>`
+    ),
+    "</colgroup>",
+    ...headerData.length ? [
+      "<thead>",
+      ...headerData.map(
+        (item) => [
+          "<tr>",
+          ...item.map((d) => {
+            if (d.rowspan === 0 || d.colspan === 0) {
+              return "";
+            }
+            if (d.isTreeIndex) {
+              return `<th colspan="${d.colspan}" rowspan="${d.rowspan}" style="${tdPadding}"></th>`;
+            }
+            const align = d.column?.headerAlign || d.column?.align || "left";
+            return `<td colspan="${d.colspan}" rowspan="${d.rowspan}" style="${tdPadding}text-align: ${align};">${d.text ?? ""}</td>`;
+          }),
+          "</tr>"
+        ].join("")
+      ),
+      "</thead>"
+    ] : [],
+    "<tbody>",
+    ...bodyData.map(
+      (item) => [
+        "<tr>",
+        ...item.map((d) => {
+          if (d.rowspan === 0 || d.colspan === 0) {
+            return "";
+          }
+          if (d.isExpandCell) {
+            return `<td colspan="${d.colspan}" rowspan="${d.rowspan}" style="${tdPadding}padding-left: 0;padding-right: 0;">${d.text ?? ""}</td>`;
+          }
+          if (d.isTreeIndex) {
+            return `<td colspan="${d.colspan}" rowspan="${d.rowspan}" style="${tdPadding}padding-left: 0;padding-right: 0;text-align: center;vertical-align: top;${d.hideLeftBorder ? "border-left-color: transparent;" : ""}">${d.text ?? ""}</td>`;
+          }
+          const align = d.column?.align || "left";
+          const tdHtml = [
+            `<td colspan="${d.colspan}" rowspan="${d.rowspan}" style="${tdPadding}text-align: ${align};">`
+          ];
+          if ("expand" === d.column?.type) {
+            if (d.text != null && d.text !== "") {
+              tdHtml.push(String(d.text));
+            } else {
+              tdHtml.push(
+                `<i style="height: 1em;width: 1em;line-height: 1em;display: inline-flex;justify-content: center;align-items: center;position: relative;fill: currentColor;color: inherit;font-size: inherit;">
+                   <svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round">
+                     <path d="M10 17 24 31 38 17"></path>
+                   </svg>
+                 </i>`
+              );
+            }
+            tdHtml.push("</td>");
+            return tdHtml.join("");
+          }
+          if (d.isTreeCell) {
+            if (d.indent) {
+              tdHtml.push(
+                `<span style="padding-left: ${d.indent * 16}px;"></span>`
+              );
+            }
+            tdHtml.push(
+              `<i style="height: 1em;width: 1em;line-height: 1em;display: inline-flex;justify-content: center;align-items: center;position: relative;fill: currentColor;color: inherit;font-size: inherit;vertical-align: middle;margin-right: 2px;${d.isTreeLeaf ? "visibility: hidden;" : ""}">
+                 <svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round">
+                   <path d="M10 17 24 31 38 17"></path>
+                 </svg>
+               </i>`
+            );
+          }
+          tdHtml.push(String(d.text ?? ""));
+          tdHtml.push("</td>");
+          return tdHtml.join("");
+        }),
+        "</tr>"
+      ].join("")
+    ),
+    "</tbody>",
+    ...footerData.length ? [
+      "<tfoot>",
+      ...footerData.map(
+        (item) => [
+          "<tr>",
+          ...item.map((d) => {
+            if (d.rowspan === 0 || d.colspan === 0) {
+              return "";
+            }
+            return `<td colspan="${d.colspan}" rowspan="${d.rowspan}" style="${tdPadding}">${d.isExpandCell ? "" : d.text ?? ""}</td>`;
+          }),
+          "</tr>"
+        ].join("")
+      ),
+      "</tfoot>"
+    ] : [],
+    "</table>"
+  ].join("");
+  return tableHtml;
+}
+const htmlExportPlugin = function(params) {
+  return new Promise((resolve) => {
+    const tableHtml = getTableHtml(params);
+    common.download(tableHtml, `${params.fileName}.html`, "text/html;charset=UTF-8");
+    resolve();
+  });
+};
+exports.getTableHtml = getTableHtml;
+exports.htmlExportPlugin = htmlExportPlugin;

package/lib/ele-pro-table/html-plugin.d.ts

@@ -0,0 +1,11 @@
+import { ExportPlugin, BeforeExportParams } from './types';
+
+/**
+ * 生成表格 HTML
+ * @param params 参数
+ */
+export declare function getTableHtml(params: BeforeExportParams): string;
+/**
+ * 导出为 html 格式的插件
+ */
+export declare const htmlExportPlugin: ExportPlugin;

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

@@ -73,7 +73,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const tableSize = vue.ref(
       util.getTableSize(props2.cacheKey, props2.size, globalProps.value.size)
     );
-    const tableMaximized = vue.ref(false);
+    const tableMaximized = vue.ref(props2.maximized);
     const errorText = vue.ref("");
     const cacheData = vue.ref();
     const tableRowKey = vue.shallowRef(util.getRowKey(props2.rowKey));
@@ -142,10 +142,11 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       return tools || [];
     });
     const tableToolbarProps = vue.computed(() => {
-      return util.mergeProps(
+      const result = util.mergeProps(
         props2.toolbar,
         globalProps.value.toolbar
       );
+      return result === true ? {} : result;
     });
     const toolExportConfig = vue.computed(() => {
       const globalExportConfig = globalProps.value.exportConfig || {};
@@ -179,6 +180,42 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         }
       };
     });
+    const getRequestParams = (parent) => {
+      const { sorter, filter } = tableState;
+      const orders = util.getRequestOrders(
+        sorter,
+        props2.request,
+        globalProps.value.request
+      );
+      return {
+        page: tablePage.value,
+        limit: tableLimit.value,
+        pages: util.getRequestPages(
+          tablePage.value,
+          tableLimit.value,
+          props2.request,
+          globalProps.value.request
+        ),
+        where: Object.assign({}, tableState.where),
+        orders,
+        filters: util.getRequestFilters(filter),
+        sorter,
+        filter,
+        parent,
+        columns: tableCols.value
+      };
+    };
+    const getDatasourceResult = (response) => {
+      const parseData = props2.parseData ?? globalProps.value.parseData;
+      const result = parseData ? parseData(response) : response;
+      return util.getResponseResult(
+        result,
+        props2.response,
+        globalProps.value.response,
+        props2.lazy,
+        props2.treeProps
+      );
+    };
     const reload = (option, parent, resolve) => {
       if (option) {
         if (option.page) {
@@ -218,46 +255,18 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       if (!parent) {
         tableLoading.value = true;
       }
-      const filter = tableState.filter;
-      const orders = util.getRequestOrders(
-        sorter,
-        props2.request,
-        globalProps.value.request
-      );
-      props2.datasource({
-        page: tablePage.value,
-        limit: tableLimit.value,
-        pages: util.getRequestPages(
-          tablePage.value,
-          tableLimit.value,
-          props2.request,
-          globalProps.value.request
-        ),
-        where: Object.assign({}, tableState.where),
-        orders,
-        filters: util.getRequestFilters(filter),
-        sorter,
-        filter,
-        parent
-      }).then((response) => {
+      const params = getRequestParams(parent);
+      props2.datasource(params).then((response) => {
         if (tableState.reloadId !== tempId) {
           return;
         }
-        const parseData = props2.parseData ?? globalProps.value.parseData;
-        const result = parseData ? parseData(response) : response;
-        const { data, total } = util.getResponseResult(
-          result,
-          props2.response,
-          globalProps.value.response,
-          props2.lazy,
-          props2.treeProps
-        );
+        const { data, total, result } = getDatasourceResult(response);
         requestCallback(data, total, parent, result, resolve);
       }).catch((e) => {
         if (tableState.reloadId !== tempId) {
           return;
         }
-        const errorMsg = e == null ? void 0 : e.message;
+        const errorMsg = e?.message;
         requestCallback(
           errorMsg == null ? errorMsg : String(errorMsg),
           void 0,
@@ -269,11 +278,10 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       });
     };
     const requestCallback = (data, total, parent, response, resolve) => {
-      var _a, _b;
       if (data == null || !Array.isArray(data)) {
         if (resolve) {
           if (parent != null) {
-            parent[((_a = props2.treeProps) == null ? void 0 : _a.children) || "children"] = [];
+            parent[props2.treeProps?.children || "children"] = [];
           }
           resolve([]);
         } else {
@@ -295,7 +303,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }
       if (resolve) {
         if (parent != null) {
-          parent[((_b = props2.treeProps) == null ? void 0 : _b.children) || "children"] = data;
+          parent[props2.treeProps?.children || "children"] = data;
         }
         resolve(data);
       } else {
@@ -337,6 +345,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             util$1.getRowKeys(props2.selections, tableRowKey.value)
           );
         }
+        if (getTableRef()) {
+          methods.setScrollTop(0);
+        }
       });
       emit("done", result, parent);
     };
@@ -357,6 +368,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
     const handleMaximizedChange = (maximized) => {
       tableMaximized.value = maximized;
+      if (props2.maximized !== maximized) {
+        emit("update:maximized", maximized);
+      }
       emit("maximizedChange", maximized);
     };
     const handlePageSizeChange = (limit) => {
@@ -441,27 +455,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }
     };
     const fetch = (callback) => {
-      const { sorter, filter } = tableState;
-      const orders = util.getRequestOrders(
-        sorter,
-        props2.request,
-        globalProps.value.request
-      );
-      callback({
-        page: tablePage.value,
-        limit: tableLimit.value,
-        pages: util.getRequestPages(
-          tablePage.value,
-          tableLimit.value,
-          props2.request,
-          globalProps.value.request
-        ),
-        where: Object.assign({}, tableState.where),
-        orders,
-        filters: util.getRequestFilters(filter),
-        sorter,
-        filter
-      });
+      callback(getRequestParams());
     };
     const openPrintModal = () => {
       if (toolPrintRef.value) {
@@ -542,12 +536,19 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       },
       { deep: true }
     );
+    vue.watch(
+      () => props2.maximized,
+      (maximized) => {
+        if (tableMaximized.value !== maximized) {
+          handleMaximizedChange(maximized);
+        }
+      }
+    );
     vue.onMounted(() => {
-      var _a;
       if (props2.current != null) {
         methods.setCurrentRowKey(common.getValue(props2.current, tableRowKey.value));
       }
-      if ((_a = props2.selections) == null ? void 0 : _a.length) {
+      if (props2.selections?.length) {
         methods.setSelectedRowKeys(
           util$1.getRowKeys(props2.selections, tableRowKey.value)
         );
@@ -559,34 +560,37 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     __expose({
       ...methods,
       tableViewRef,
-      tableData,
-      tableLoading,
-      tableProps,
       reload,
-      reloadTable,
-      getTableRef,
       getData,
       setData,
-      goPageByRowKey,
       fetch,
       openPrintModal,
       printData,
       openExportModal,
-      exportData
+      exportData,
+      getTableRef,
+      // 兼容旧版导出
+      tableData,
+      tableLoading,
+      tableProps,
+      reloadTable,
+      goPageByRowKey
     });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(EleLoading, vue.mergeProps(props2.loadingProps || {}, {
         loading: tableLoading.value,
-        class: [
-          "ele-pro-table",
+        class: ["ele-pro-table", [
           { "is-maximized": tableMaximized.value },
-          { "is-border": tableProps.value.border }
-        ],
+          { "is-border": tableProps.value.border },
+          {
+            "is-default-toolbar": tableToolbarProps.value && tableToolbarProps.value.theme === "default"
+          }
+        ]],
         style: tableMaximized.value ? { zIndex: _ctx.maximizedIndex ?? vue.unref(globalProps).maximizedIndex } : void 0
       }), {
         default: vue.withCtx(() => [
           vue.renderSlot(_ctx.$slots, "topExtra"),
-          tableToolbarProps.value ? (vue.openBlock(), vue.createBlock(EleToolbar, vue.normalizeProps(vue.mergeProps({ key: 0 }, tableToolbarProps.value === true ? {} : tableToolbarProps.value)), {
+          tableToolbarProps.value ? (vue.openBlock(), vue.createBlock(EleToolbar, vue.normalizeProps(vue.mergeProps({ key: 0 }, tableToolbarProps.value)), {
             tools: vue.withCtx(() => [
               vue.renderSlot(_ctx.$slots, "tools"),
               toolNames.value && toolNames.value.length ? (vue.openBlock(), vue.createBlock(TableTools, {
@@ -699,7 +703,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             defaultShowFooter: toolExportConfig.value.showFooter,
             defaultShowTreeIndex: toolExportConfig.value.showTreeIndex,
             beforeExport: toolExportConfig.value.beforeExport,
-            exportPlugin: toolExportConfig.value.exportPlugin
+            exportPlugin: toolExportConfig.value.exportPlugin,
+            getDatasourceResult
           }, null, 8, ["locale", "cacheKey", "modalProps", "columns", "selections", "pageData", "datasource", "spanMethod", "tableHeader", "showSummary", "sumText", "summaryMethod", "pageIndex", "treeProps", "defaultFileName", "defaultDataType", "defaultShowFooter", "defaultShowTreeIndex", "beforeExport", "exportPlugin"]),
           vue.createVNode(ToolPrint, {
             ref_key: "toolPrintRef",
@@ -730,7 +735,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             defaultShowFooter: toolPrintConfig.value.showFooter,
             defaultShowTreeIndex: toolPrintConfig.value.showTreeIndex,
             beforePrint: toolPrintConfig.value.beforePrint,
-            printPlugin: toolPrintConfig.value.printPlugin
+            printPlugin: toolPrintConfig.value.printPlugin,
+            getDatasourceResult
           }, vue.createSlots({ _: 2 }, [
             vue.renderList(Object.keys(_ctx.$slots).filter(
               (k) => !toolsSlotExcludes.includes(k)