ele-admin-plus 1.2.1-beta.1 → 1.2.1-beta.3

package/lib/ele-pro-table/components/table-tools.cjs

@@ -9,11 +9,14 @@ const EleTool = require("../../ele-tool/index");
 const ToolColumn = require("./tool-column");
 const ToolExport = require("./tool-export");
 const ToolPrint = require("./tool-print");
+const ownSlots = ["default", "printTop", "printBottom"];
 const _sfc_main = vue.defineComponent({
   name: "TableTools",
   components: {
     ElIcon: elementPlus.ElIcon,
     ReloadOutlined: icons.ReloadOutlined,
+    DownloadOutlined: icons.DownloadOutlined,
+    PrinterOutlined: icons.PrinterOutlined,
     ColumnHeightOutlined: icons.ColumnHeightOutlined,
     FullscreenOutlined: icons.FullscreenOutlined,
     FullscreenExitOutlined: icons.FullscreenExitOutlined,
@@ -85,14 +88,14 @@ const _sfc_main = vue.defineComponent({
   emits: {
     reload: () => true,
     "update:size": (_size) => true,
-    "update:columns": (_columns) => true,
+    "update:columns": (_columns, _tableColumns) => true,
     "update:maximized": (_maximized) => true
   },
   setup(props, { emit }) {
     const { lang } = receiver.useLocale("table", props);
-    const placement = vue.computed(() => {
-      return props.maximized ? "bottom" : "top";
-    });
+    const toolExportRef = vue.ref(null);
+    const toolPrintRef = vue.ref(null);
+    const placement = vue.computed(() => props.maximized ? "bottom" : "top");
     const reload = () => {
       emit("reload");
     };
@@ -102,19 +105,49 @@ const _sfc_main = vue.defineComponent({
       }
       emit("update:size", size);
     };
-    const updateColumns = (columns) => {
-      emit("update:columns", columns);
+    const updateColumns = (columns, tableColumns) => {
+      emit("update:columns", columns, tableColumns);
     };
     const toggleMaximized = () => {
       emit("update:maximized", !props.maximized);
     };
+    const openExportModal = () => {
+      if (toolExportRef.value) {
+        toolExportRef.value.openModal();
+      }
+    };
+    const openPrintModal = () => {
+      if (toolPrintRef.value) {
+        toolPrintRef.value.openModal();
+      }
+    };
+    const printData = (params) => {
+      if (toolPrintRef.value) {
+        toolPrintRef.value.printData(params);
+      }
+    };
+    const exportData = (params) => {
+      if (toolExportRef.value) {
+        toolExportRef.value.exportData(params);
+      }
+    };
     return {
+      ownSlots,
+      SizeSlackOutlined: icons.SizeSlackOutlined,
+      MenuOutlined: icons.MenuOutlined,
+      SizeCompactOutlined: icons.SizeCompactOutlined,
       lang,
+      toolExportRef,
+      toolPrintRef,
       placement,
       reload,
       updateSize,
       updateColumns,
-      toggleMaximized
+      toggleMaximized,
+      openExportModal,
+      openPrintModal,
+      printData,
+      exportData
     };
   }
 });
@@ -126,156 +159,199 @@ const _export_sfc = (sfc, props) => {
   return target;
 };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_ToolExport = vue.resolveComponent("ToolExport");
+  const _component_ToolPrint = vue.resolveComponent("ToolPrint");
   const _component_ReloadOutlined = vue.resolveComponent("ReloadOutlined");
   const _component_ElIcon = vue.resolveComponent("ElIcon");
   const _component_EleTool = vue.resolveComponent("EleTool");
+  const _component_DownloadOutlined = vue.resolveComponent("DownloadOutlined");
+  const _component_PrinterOutlined = vue.resolveComponent("PrinterOutlined");
   const _component_ColumnHeightOutlined = vue.resolveComponent("ColumnHeightOutlined");
   const _component_EleDropdown = vue.resolveComponent("EleDropdown");
   const _component_ToolColumn = vue.resolveComponent("ToolColumn");
   const _component_FullscreenExitOutlined = vue.resolveComponent("FullscreenExitOutlined");
   const _component_FullscreenOutlined = vue.resolveComponent("FullscreenOutlined");
-  const _component_ToolExport = vue.resolveComponent("ToolExport");
-  const _component_ToolPrint = vue.resolveComponent("ToolPrint");
-  return vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.tools, (tool, index) => {
-    return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
-      tool === "reload" ? (vue.openBlock(), vue.createBlock(_component_EleTool, {
-        key: index + "-reload",
-        placement: _ctx.placement,
-        title: _ctx.lang.refresh,
-        onClick: _ctx.reload
-      }, {
-        default: vue.withCtx(() => [
-          vue.createVNode(_component_ElIcon, null, {
-            default: vue.withCtx(() => [
-              vue.createVNode(_component_ReloadOutlined)
-            ]),
-            _: 1
-          })
-        ]),
-        _: 2
-      }, 1032, ["placement", "title", "onClick"])) : tool === "size" ? (vue.openBlock(), vue.createBlock(_component_EleTool, {
-        key: index + "-size",
-        placement: _ctx.placement,
-        title: _ctx.lang.sizes
-      }, {
-        default: vue.withCtx(() => [
-          vue.createVNode(_component_EleDropdown, {
-            trigger: "click",
-            placement: "bottom",
-            popperClass: "ele-tool-size-popper",
-            modelValue: _ctx.size,
-            items: [
-              { title: _ctx.lang.sizeLarge, command: "large" },
-              { title: _ctx.lang.sizeDefault, command: "default" },
-              { title: _ctx.lang.sizeSmall, command: "small" }
-            ],
-            popperOptions: {
-              modifiers: [{ name: "offset", options: { offset: [0, 10] } }]
-            },
-            onCommand: _ctx.updateSize
-          }, {
-            default: vue.withCtx(() => [
-              vue.createVNode(_component_ElIcon, null, {
-                default: vue.withCtx(() => [
-                  vue.createVNode(_component_ColumnHeightOutlined)
-                ]),
-                _: 1
-              })
-            ]),
-            _: 1
-          }, 8, ["modelValue", "items", "onCommand"])
-        ]),
-        _: 2
-      }, 1032, ["placement", "title"])) : tool === "columns" ? (vue.openBlock(), vue.createBlock(_component_ToolColumn, {
-        key: index + "-columns",
-        title: _ctx.lang.columns,
-        placement: _ctx.placement,
-        checkAllText: _ctx.lang.columnTitle,
-        resetText: _ctx.lang.columnReset,
-        untitledText: _ctx.lang.columnUntitled,
-        fixedLeftText: _ctx.lang.columnFixedLeft,
-        fixedRightText: _ctx.lang.columnFixedRight,
-        columns: _ctx.columns,
-        sortable: _ctx.columnSortable,
-        allowFixed: _ctx.columnFixed,
-        cacheKey: _ctx.cacheKey,
-        "onUpdate:columns": _ctx.updateColumns
-      }, null, 8, ["title", "placement", "checkAllText", "resetText", "untitledText", "fixedLeftText", "fixedRightText", "columns", "sortable", "allowFixed", "cacheKey", "onUpdate:columns"])) : tool === "maximized" ? (vue.openBlock(), vue.createBlock(_component_EleTool, {
-        key: index + "-maximized",
-        placement: _ctx.placement,
-        title: _ctx.lang.maximized,
-        onClick: _ctx.toggleMaximized
-      }, {
-        default: vue.withCtx(() => [
-          vue.createVNode(_component_ElIcon, null, {
-            default: vue.withCtx(() => [
-              _ctx.maximized ? (vue.openBlock(), vue.createBlock(_component_FullscreenExitOutlined, { key: 0 })) : (vue.openBlock(), vue.createBlock(_component_FullscreenOutlined, { key: 1 }))
-            ]),
-            _: 1
-          })
-        ]),
-        _: 2
-      }, 1032, ["placement", "title", "onClick"])) : tool === "export" ? (vue.openBlock(), vue.createBlock(_component_ToolExport, {
-        key: index + "-export",
-        placement: _ctx.placement,
-        locale: _ctx.lang,
-        modalProps: _ctx.exportConfig.modalProps,
-        columns: _ctx.columns,
-        selections: _ctx.selections,
-        pageData: _ctx.pageData,
-        datasource: _ctx.exportConfig.datasource,
-        spanMethod: _ctx.spanMethod,
-        tableHeader: _ctx.tableHeader,
-        showSummary: _ctx.showSummary,
-        sumText: _ctx.sumText,
-        summaryMethod: _ctx.summaryMethod,
-        pageIndex: _ctx.pageIndex,
-        treeProps: _ctx.treeProps,
-        fetch: _ctx.fetch,
-        defaultFileName: _ctx.exportConfig.fileName,
-        defaultDataType: _ctx.exportConfig.dataType,
-        beforeExport: _ctx.exportConfig.beforeExport
-      }, null, 8, ["placement", "locale", "modalProps", "columns", "selections", "pageData", "datasource", "spanMethod", "tableHeader", "showSummary", "sumText", "summaryMethod", "pageIndex", "treeProps", "fetch", "defaultFileName", "defaultDataType", "beforeExport"])) : tool === "print" ? (vue.openBlock(), vue.createBlock(_component_ToolPrint, {
-        key: index + "-print",
-        placement: _ctx.placement,
-        locale: _ctx.lang,
-        modalProps: _ctx.printConfig.modalProps,
-        printerProps: _ctx.printConfig.printerProps,
-        tableProps: _ctx.printConfig.tableProps,
-        columns: _ctx.columns,
-        selections: _ctx.selections,
-        pageData: _ctx.pageData,
-        datasource: _ctx.printConfig.datasource,
-        spanMethod: _ctx.spanMethod,
-        tableHeader: _ctx.tableHeader,
-        showSummary: _ctx.showSummary,
-        sumText: _ctx.sumText,
-        summaryMethod: _ctx.summaryMethod,
-        cellStyle: _ctx.cellStyle,
-        cellClassName: _ctx.cellClassName,
-        headerCellStyle: _ctx.headerCellStyle,
-        headerCellClassName: _ctx.headerCellClassName,
-        pageIndex: _ctx.pageIndex,
-        treeProps: _ctx.treeProps,
-        fetch: _ctx.fetch,
-        defaultDataType: _ctx.printConfig.dataType,
-        beforePrint: _ctx.printConfig.beforePrint
-      }, vue.createSlots({ _: 2 }, [
-        vue.renderList(Object.keys(_ctx.$slots), (name) => {
-          return {
-            name,
-            fn: vue.withCtx((slotProps) => [
-              vue.renderSlot(_ctx.$slots, name, vue.mergeProps({ ref_for: true }, slotProps || {}))
-            ])
-          };
-        })
-      ]), 1032, ["placement", "locale", "modalProps", "printerProps", "tableProps", "columns", "selections", "pageData", "datasource", "spanMethod", "tableHeader", "showSummary", "sumText", "summaryMethod", "cellStyle", "cellClassName", "headerCellStyle", "headerCellClassName", "pageIndex", "treeProps", "fetch", "defaultDataType", "beforePrint"])) : tool && !["default", "printTop", "printBottom"].includes(tool) && _ctx.$slots[tool] ? vue.renderSlot(_ctx.$slots, tool, {
-        key: 6,
-        pageIndex: _ctx.pageIndex,
-        fetch: _ctx.fetch
-      }) : vue.createCommentVNode("", true)
-    ], 64);
-  }), 256);
+  return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
+    vue.createVNode(_component_ToolExport, {
+      ref: "toolExportRef",
+      locale: _ctx.lang,
+      cacheKey: _ctx.cacheKey,
+      modalProps: _ctx.exportConfig.modalProps,
+      columns: _ctx.exportConfig.columns || _ctx.columns,
+      selections: _ctx.selections,
+      pageData: _ctx.pageData,
+      datasource: _ctx.exportConfig.datasource,
+      spanMethod: _ctx.spanMethod,
+      tableHeader: _ctx.exportConfig.showHeader ?? _ctx.tableHeader,
+      showSummary: _ctx.showSummary,
+      sumText: _ctx.sumText,
+      summaryMethod: _ctx.summaryMethod,
+      pageIndex: _ctx.pageIndex,
+      treeProps: _ctx.treeProps,
+      fetch: _ctx.fetch,
+      defaultFileName: _ctx.exportConfig.fileName,
+      defaultDataType: _ctx.exportConfig.dataType,
+      defaultShowFooter: _ctx.exportConfig.showFooter,
+      defaultShowTreeIndex: _ctx.exportConfig.showTreeIndex,
+      beforeExport: _ctx.exportConfig.beforeExport
+    }, null, 8, ["locale", "cacheKey", "modalProps", "columns", "selections", "pageData", "datasource", "spanMethod", "tableHeader", "showSummary", "sumText", "summaryMethod", "pageIndex", "treeProps", "fetch", "defaultFileName", "defaultDataType", "defaultShowFooter", "defaultShowTreeIndex", "beforeExport"]),
+    vue.createVNode(_component_ToolPrint, {
+      ref: "toolPrintRef",
+      locale: _ctx.lang,
+      cacheKey: _ctx.cacheKey,
+      modalProps: _ctx.printConfig.modalProps,
+      printerProps: _ctx.printConfig.printerProps,
+      tableProps: _ctx.printConfig.tableProps,
+      columns: _ctx.printConfig.columns || _ctx.columns,
+      selections: _ctx.selections,
+      pageData: _ctx.pageData,
+      datasource: _ctx.printConfig.datasource,
+      spanMethod: _ctx.spanMethod,
+      tableHeader: _ctx.printConfig.showHeader ?? _ctx.tableHeader,
+      showSummary: _ctx.showSummary,
+      sumText: _ctx.sumText,
+      summaryMethod: _ctx.summaryMethod,
+      cellStyle: _ctx.cellStyle,
+      cellClassName: _ctx.cellClassName,
+      headerCellStyle: _ctx.headerCellStyle,
+      headerCellClassName: _ctx.headerCellClassName,
+      pageIndex: _ctx.pageIndex,
+      treeProps: _ctx.treeProps,
+      fetch: _ctx.fetch,
+      defaultDataType: _ctx.printConfig.dataType,
+      defaultShowFooter: _ctx.printConfig.showFooter,
+      defaultShowTreeIndex: _ctx.printConfig.showTreeIndex,
+      beforePrint: _ctx.printConfig.beforePrint
+    }, vue.createSlots({ _: 2 }, [
+      vue.renderList(Object.keys(_ctx.$slots), (name) => {
+        return {
+          name,
+          fn: vue.withCtx((slotProps) => [
+            vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.guardReactiveProps(slotProps || {})))
+          ])
+        };
+      })
+    ]), 1032, ["locale", "cacheKey", "modalProps", "printerProps", "tableProps", "columns", "selections", "pageData", "datasource", "spanMethod", "tableHeader", "showSummary", "sumText", "summaryMethod", "cellStyle", "cellClassName", "headerCellStyle", "headerCellClassName", "pageIndex", "treeProps", "fetch", "defaultDataType", "defaultShowFooter", "defaultShowTreeIndex", "beforePrint"]),
+    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.tools, (tool, index) => {
+      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
+        tool === "reload" ? (vue.openBlock(), vue.createBlock(_component_EleTool, {
+          key: index + "-reload",
+          placement: _ctx.placement,
+          title: _ctx.lang.refresh,
+          onClick: _ctx.reload
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(_component_ElIcon, null, {
+              default: vue.withCtx(() => [
+                vue.createVNode(_component_ReloadOutlined)
+              ]),
+              _: 1
+            })
+          ]),
+          _: 2
+        }, 1032, ["placement", "title", "onClick"])) : tool === "export" ? (vue.openBlock(), vue.createBlock(_component_EleTool, {
+          key: index + "-export",
+          title: _ctx.lang.export,
+          placement: _ctx.placement,
+          clickHideTooltip: true,
+          onClick: _ctx.openExportModal
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(_component_ElIcon, { style: { "transform": "scale(1.1)", "transform-origin": "bottom" } }, {
+              default: vue.withCtx(() => [
+                vue.createVNode(_component_DownloadOutlined)
+              ]),
+              _: 1
+            })
+          ]),
+          _: 2
+        }, 1032, ["title", "placement", "onClick"])) : tool === "print" ? (vue.openBlock(), vue.createBlock(_component_EleTool, {
+          key: index + "-print",
+          title: _ctx.lang.print,
+          placement: _ctx.placement,
+          clickHideTooltip: true,
+          onClick: _ctx.openPrintModal
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(_component_ElIcon, null, {
+              default: vue.withCtx(() => [
+                vue.createVNode(_component_PrinterOutlined)
+              ]),
+              _: 1
+            })
+          ]),
+          _: 2
+        }, 1032, ["title", "placement", "onClick"])) : tool === "size" ? (vue.openBlock(), vue.createBlock(_component_EleTool, {
+          key: index + "-size",
+          placement: _ctx.placement,
+          title: _ctx.lang.sizes
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(_component_EleDropdown, {
+              trigger: "click",
+              placement: "bottom",
+              popperClass: "ele-tool-size-popper",
+              modelValue: _ctx.size,
+              items: [
+                { title: _ctx.lang.sizeLarge, command: "large", icon: _ctx.SizeSlackOutlined },
+                {
+                  title: _ctx.lang.sizeDefault,
+                  command: "default",
+                  icon: _ctx.MenuOutlined,
+                  iconStyle: { transform: "scale(0.94)", transformOrigin: "left" }
+                },
+                { title: _ctx.lang.sizeSmall, command: "small", icon: _ctx.SizeCompactOutlined }
+              ],
+              popperOptions: {
+                modifiers: [{ name: "offset", options: { offset: [0, 10] } }]
+              },
+              onCommand: _ctx.updateSize
+            }, {
+              default: vue.withCtx(() => [
+                vue.createVNode(_component_ElIcon, null, {
+                  default: vue.withCtx(() => [
+                    vue.createVNode(_component_ColumnHeightOutlined)
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue", "items", "onCommand"])
+          ]),
+          _: 2
+        }, 1032, ["placement", "title"])) : tool === "columns" ? (vue.openBlock(), vue.createBlock(_component_ToolColumn, {
+          key: index + "-columns",
+          placement: _ctx.placement,
+          locale: _ctx.lang,
+          columns: _ctx.columns,
+          sortable: _ctx.columnSortable,
+          allowFixed: _ctx.columnFixed,
+          cacheKey: _ctx.cacheKey,
+          "onUpdate:columns": _ctx.updateColumns
+        }, null, 8, ["placement", "locale", "columns", "sortable", "allowFixed", "cacheKey", "onUpdate:columns"])) : tool === "maximized" ? (vue.openBlock(), vue.createBlock(_component_EleTool, {
+          key: index + "-maximized",
+          placement: _ctx.placement,
+          title: _ctx.lang.maximized,
+          clickHideTooltip: true,
+          onClick: _ctx.toggleMaximized
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(_component_ElIcon, null, {
+              default: vue.withCtx(() => [
+                _ctx.maximized ? (vue.openBlock(), vue.createBlock(_component_FullscreenExitOutlined, { key: 0 })) : (vue.openBlock(), vue.createBlock(_component_FullscreenOutlined, { key: 1 }))
+              ]),
+              _: 1
+            })
+          ]),
+          _: 2
+        }, 1032, ["placement", "title", "onClick"])) : tool && !_ctx.ownSlots.includes(tool) && _ctx.$slots[tool] ? vue.renderSlot(_ctx.$slots, tool, {
+          key: 6,
+          pageIndex: _ctx.pageIndex,
+          fetch: _ctx.fetch
+        }) : vue.createCommentVNode("", true)
+      ], 64);
+    }), 256))
+  ], 64);
 }
 const tableTools = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 module.exports = tableTools;