ele-admin-plus 1.1.9-beta.1 → 1.1.9-beta.11

package/es/ele-pro-table/style/index.scss

@@ -107,7 +107,12 @@
 }
 
 /* 列配置 */
-.ele-tool-column.ele-popover {
+.ele-tool-column-popover.ele-popover {
+  width: eleVar('tool-column', 'width');
+  max-width: 100%;
+}
+
+.ele-tool-column {
   width: eleVar('tool-column', 'width');
   max-width: 100%;
 }
@@ -131,7 +136,8 @@
   }
 }
 
-.ele-tool-column.ele-popover.ele-popper.el-popper {
+.ele-tool-column .ele-tool-column-item .ele-tool-column-item-body,
+.ele-tool-column .ele-tool-column-header .ele-tool-column-label {
   .el-checkbox {
     height: eleVar('tool-column', 'item-height');
     line-height: eleVar('tool-column', 'item-height');
@@ -153,7 +159,7 @@
   box-sizing: border-box;
 }
 
-.ele-popover-body > .ele-tool-column-list {
+.ele-tool-column > .ele-tool-column-list {
   padding: eleVar('tool-column', 'body-padding');
   max-height: eleVar('tool-column', 'max-height');
   box-sizing: border-box;
@@ -182,6 +188,7 @@
 
   &.sortable-chosen {
     background: eleVar('tool-column', 'item-hover-bg');
+    opacity: 1 !important;
 
     & > .ele-tool-column-item-body {
       background: none;
@@ -189,7 +196,7 @@
   }
 
   &.sortable-ghost {
-    opacity: 0;
+    opacity: 0 !important;
   }
 
   & > .ele-tool-column-list {
@@ -230,9 +237,13 @@
     color: eleVar('tool-column', 'btn-active-color');
     background: eleVar('tool-column', 'btn-active-bg');
   }
+
+  & > .el-icon > svg {
+    stroke-width: 5;
+  }
 }
 
-.ele-popover-body.is-sortable {
+.ele-tool-column.is-sortable {
   .ele-tool-column-item-body {
     padding-left: 6px;
   }
@@ -241,3 +252,20 @@
     padding-left: calc(22px - #{eleVar('tool-column', 'item-padding')});
   }
 }
+
+/* 导出和打印的列选择 */
+.ele-tool-export-form,
+.ele-tool-print-form {
+  .ele-tool-column {
+    border: 1px solid elVar('border-color', 'light');
+    border-radius: elVar('border-radius', 'base');
+    line-height: normal;
+    width: 100%;
+  }
+
+  .ele-tool-column-header {
+    background: elVar('fill-color', 'lighter');
+    border-top-left-radius: elVar('border-radius', 'base');
+    border-top-right-radius: elVar('border-radius', 'base');
+  }
+}

package/es/ele-pro-table/types.d.ts

@@ -1,8 +1,12 @@
 import type {
   EleDataTableInstance,
   EleVirtualTableInstance,
-  ElePaginationProps
+  ElePaginationProps,
+  EleModalProps,
+  ElePrinterProps,
+  EleTableProps
 } from '../ele-app/plus';
+import type { PaginationTotal } from '../ele-pagination/types';
 import type {
   DataItem,
   Column,
@@ -13,6 +17,7 @@ import type {
   TableSize,
   ResolveFunction
 } from '../ele-data-table/types';
+import type { BodyColumns } from '../ele-virtual-table/types';
 export type {
   DataItem,
   Column,
@@ -137,7 +142,7 @@ export interface ResponseOption {
 }
 
 /**
- * 响应数据解析
+ * 响应数据解析方法
  */
 export type ParseData = (data: unknown) => DatasourceResult;
 
@@ -159,10 +164,10 @@ export interface OrderItem {
 export interface DoneParams<T> {
   /** 当前页数据 */
   data: T[];
+  /** 总数量 */
+  total?: PaginationTotal;
   /** 当前页码 */
   page?: number;
-  /** 总数量 */
-  total?: number;
   /** 数据源原始数据 */
   response?: any;
 }
@@ -188,7 +193,14 @@ export interface TablePagination extends ElePaginationProps {
 /**
  * 内置工具按钮
  */
-export type TableTool = 'reload' | 'size' | 'columns' | 'maximized' | string;
+export type TableTool =
+  | 'reload'
+  | 'size'
+  | 'columns'
+  | 'maximized'
+  | 'export'
+  | 'print'
+  | string;
 
 /**
  * 列配置
@@ -211,6 +223,11 @@ export interface ColItem {
  */
 export type FetchCallback = (options: DatasourceParams) => void;
 
+/**
+ * 请求方法
+ */
+export type FetchFunction = (callback: FetchCallback) => void;
+
 /**
  * 前端分页排序方法返回结果
  */
@@ -258,6 +275,122 @@ export type TableViewInstance =
   | EleVirtualTableInstance
   | null;
 
+/**
+ * 导出的数据来源类型
+ */
+export type ExportDataType = 'selections' | 'pageData' | 'data';
+
+/**
+ * 导出的数据每一项
+ */
+export interface ExportDataItem {
+  /** 唯一值 */
+  key?: string;
+  /** 行数据 */
+  row?: DataItem;
+  /** 行索引 */
+  index: number;
+  /** 列配置 */
+  column?: Column;
+  /** 文本 */
+  text?: string;
+  /** 所占列数 */
+  colspan?: number;
+  /** 所占行数 */
+  rowspan?: number;
+}
+
+/**
+ * 导出数据封装返回结果
+ */
+export interface ExportDataResult {
+  /** 表头数据 */
+  headerData: ExportDataItem[][];
+  /** 主体数据 */
+  bodyData: ExportDataItem[][];
+  /** 表尾数据 */
+  footerData: ExportDataItem[][];
+  /** 主体列配置 */
+  bodyCols: BodyColumns;
+}
+
+/**
+ * 导出数据前的钩子函数的参数
+ */
+export interface BeforeExportParams {
+  /** 导出的数据 */
+  data: DataItem[];
+  /** 导出的列配置 */
+  columns?: Columns;
+  /** 导出的表头数据封装 */
+  headerData: ExportDataItem[][];
+  /** 导出的主体数据封装 */
+  bodyData: ExportDataItem[][];
+  /** 导出的页脚数据封装 */
+  footerData: ExportDataItem[][];
+  /** 主体列配置 */
+  bodyCols: BodyColumns;
+  /** 文件名 */
+  fileName?: string;
+  /** 关闭确定按钮的加载状态 */
+  hideLoading: () => void;
+  /** 关闭弹窗 */
+  closeModal: () => void;
+}
+
+/**
+ * 导出数据前的钩子函数
+ */
+export type BeforeExport = (params: BeforeExportParams) => boolean | void;
+
+/**
+ * 导出配置
+ */
+export interface ExportConfig {
+  /** 弹窗参数 */
+  modalProps?: EleModalProps;
+  /** 表格全部数据 */
+  datasource?: Datasource;
+  /** 导出前的钩子函数 */
+  beforeExport?: BeforeExport;
+  /** 默认数据类型 */
+  dataType?: ExportDataType;
+  /** 默认文件名 */
+  fileName?: string;
+}
+
+/**
+ * 打印配置
+ */
+export interface PrintConfig {
+  /** 弹窗参数 */
+  modalProps?: EleModalProps;
+  /** 打印组件参数 */
+  printerProps?: ElePrinterProps;
+  /** 打印表格参数 */
+  tableProps?: EleTableProps;
+  /** 表格全部数据 */
+  datasource?: Datasource;
+  /** 打印前的钩子函数 */
+  beforePrint?: BeforeExport;
+  /** 默认数据类型 */
+  dataType?: ExportDataType;
+}
+
+/**
+ * 打印参数
+ */
+export interface TablePrintOptions extends ExportDataResult {
+  /** 是否开始打印 */
+  printing: boolean;
+  /** 是否有表头 */
+  hasHeader: boolean;
+  /** 是否有表尾 */
+  hasFooter: boolean;
+  /** 打印的数据 */
+  data: DataItem[];
+}
+
 /**
  * 国际化
  */
@@ -266,6 +399,8 @@ export interface TableLocale {
   sizes: string;
   columns: string;
   maximized: string;
+  export: string;
+  print: string;
   sizeLarge: string;
   sizeDefault: string;
   sizeSmall: string;
@@ -274,4 +409,13 @@ export interface TableLocale {
   columnUntitled: string;
   columnFixedLeft: string;
   columnFixedRight: string;
+  exportOk: string;
+  exportCancel: string;
+  exportFileName: string;
+  exportFileNamePlaceholder: string;
+  exportSelectData: string;
+  exportSelectColumn: string;
+  exportDataTypePage: string;
+  exportDataTypeSelected: string;
+  exportDataTypeAll: string;
 }

package/es/ele-pro-table/util.d.ts

@@ -1,6 +1,7 @@
-import type { ElePaginationProps } from '../ele-app/plus';
-import type { DataItem, Column, Columns, Sorter, Filter, TableSize, TreeProps, RowKey } from '../ele-data-table/types';
-import type { Orders, Filters, OrderItem, RequestOption, ResponseOption, TablePagination, DatasourceResult, ResponseResult, ReloadDataResult, ColItem, ProProps } from './types';
+import { Orders, Filters, OrderItem, RequestOption, ResponseOption, TablePagination, DatasourceResult, ResponseResult, ReloadDataResult, ColItem, ProProps, ExportDataItem, ExportDataResult } from './types';
+import { DataItem, Column, Columns, Sorter, Filter, TableSize, TreeProps, RowKey, SpanMethod, SummaryMethod } from '../ele-data-table/types';
+import { ElePaginationProps } from '../ele-app/plus';
+
 /**
  * 合并复合属性
  * @param props 属性
@@ -26,7 +27,7 @@ export declare function getTableLimit(pagination: boolean | TablePagination | un
  * @param globalPagination 全局配置分页组件属性
  * @param pageProps 分页相关的属性
  */
-export declare function getPaginationProps(size: TableSize, pagination: boolean | TablePagination | undefined, globalPagination: boolean | TablePagination | undefined, pageProps?: Pick<ElePaginationProps, 'total' | 'pageSize' | 'currentPage'>): ElePaginationProps | null;
+export declare function getPaginationProps(size: TableSize, pagination: boolean | TablePagination | undefined, globalPagination: boolean | TablePagination | undefined, pageProps?: Pick<ElePaginationProps, 'total' | 'pageSize' | 'currentPage' | 'hasNext'>): ElePaginationProps | null;
 /**
  * 判断是否开启自动修正页码
  * @param pagination 分页组件属性
@@ -108,7 +109,7 @@ export declare function sortData(datasource?: DataItem[], sorter?: Sorter): Data
  * 获取列配置标识
  * @param column 列数据
  */
-export declare function getColId(column?: Column): string | undefined;
+export declare function getColId(column: Column): string | undefined;
 /**
  * 获取初始显示的列数据
  * @param columns 列数据
@@ -127,7 +128,16 @@ export declare function getInitCacheColumns(columns: Columns, cacheKey?: string,
  * @param cols 列配置数据
  * @param sortable 是否进行排序
  */
-export declare function getCheckedColumns(columns: Columns | undefined, cols: ColItem[], sortable?: boolean): Columns;
+export declare function getCheckedColumns(columns: Columns | undefined, cols: ColItem[], sortable?: boolean, filter?: (item: Column) => boolean): Columns;
+/**
+ * 获取列展示列表数据
+ * @param columns 列配置
+ * @param untitledText 未命名列文字
+ * @param filter 过滤列的方法
+ * @param sortFixed 是否对固定列排序
+ * @param cancelFixed 是否取消固定列
+ */
+export declare function getColItems(columns?: Columns, untitledText?: string, filter?: (item: Column) => boolean, sortFixed?: boolean, cancelFixed?: boolean): ColItem[];
 /**
  * 获取列配置
  * @param columns 列数据
@@ -170,3 +180,45 @@ export declare function getRowKey(rowKey?: RowKey): string | ((row: DataItem) =>
  * @param page 页码
  */
 export declare function addDefaultRowKey(data: DataItem[], rowKey: string | undefined, page: number): DataItem[];
+/**
+ * 导出获取单元格文本
+ * @param column 列配置
+ * @param row 行数据
+ * @param index 行索引
+ * @param pageIndex 序号列起始索引
+ */
+export declare function getCellText(column: Column | undefined, row: DataItem, index: number, pageIndex?: number): string;
+/**
+ * 导出获取表头单元格文本
+ * @param column 列配置
+ * @param index 行索引
+ */
+export declare function getHeaderCellText(column: Column | undefined, index: number): string;
+/**
+ * 获取导出的数据
+ * @param data 元数据
+ * @param columns 列配置
+ * @param spanMethod 单元格合并方法
+ * @param pageIndex 序号列起始索引
+ * @param showSummary 是否显示合计行
+ * @param sumText 合计行文本
+ * @param summaryMethod 合计行自定义方法
+ */
+export declare function getExportData(data: DataItem[], columns: Columns, spanMethod?: SpanMethod, pageIndex?: number, showSummary?: boolean, sumText?: string, summaryMethod?: SummaryMethod): ExportDataResult;
+/**
+ * 导出csv文件
+ * @param fileName 文件名
+ * @param headerData 表头数据
+ * @param bodyData 主体数据
+ */
+export declare function exportCSV(fileName: string, headerData: ExportDataItem[][], bodyData: ExportDataItem[][], footerData: ExportDataItem[][]): void;
+/**
+ * 导出判断列是否显示
+ * @param item 列配置
+ */
+export declare function columnsExportFilter(item: Column): boolean;
+/**
+ * 打印判断列是否显示
+ * @param item 列配置
+ */
+export declare function columnsPrintFilter(item: Column): boolean;

package/es/ele-pro-table/util.js

@@ -1,5 +1,6 @@
-import { getValue } from "../ele-data-table/util";
-import { omit, eachTree, uuid, mapTree } from "../utils/core";
+import { omit, eachTree, findTree, uuid, mapTree } from "../utils/core";
+import { getValue, getColFixedNumber } from "../ele-data-table/util";
+import { getIndexValue, analyseColumns, getCellSpan, getUserSums, getSumValue } from "../ele-virtual-table/util";
 function mergeProps(props, globalProps) {
   if (props == null) {
     return globalProps ?? true;
@@ -204,7 +205,10 @@ function sortData(datasource, sorter) {
   return data;
 }
 function getColId(column) {
-  return column ? column.columnKey || column.prop : void 0;
+  if (column.columnKey == null || column.columnKey === "") {
+    return column.prop;
+  }
+  return column.columnKey;
 }
 function getInitColumns(columns) {
   const data = [];
@@ -230,7 +234,7 @@ function getInitCacheColumns(columns, cacheKey, sortable) {
   }
   return getCheckedColumns(columns, cache, sortable);
 }
-function getCheckedColumns(columns, cols, sortable) {
+function getCheckedColumns(columns, cols, sortable, filter) {
   const data = [];
   if (!columns || !columns.length) {
     return data;
@@ -240,26 +244,23 @@ function getCheckedColumns(columns, cols, sortable) {
     if (colId == null) {
       return;
     }
-    let temp;
-    eachTree(cols, (t) => {
-      if (t.uid === colId) {
-        temp = t;
-        return false;
-      }
-    });
+    if (filter && !filter(d)) {
+      return;
+    }
+    const temp = findTree(cols, (t) => t.uid === colId);
     if (temp && !temp.checked) {
       return;
     }
     const fixed = (temp == null ? void 0 : temp.fixed) ?? d.fixed;
     const uid = uuid(8);
-    if (d.children) {
-      const children = getCheckedColumns(d.children, cols, sortable);
+    if (d.children && d.children.length) {
+      const children = getCheckedColumns(d.children, cols, sortable, filter);
       if (children.length) {
         data.push({ ...d, fixed, uid, children });
       }
-    } else {
-      data.push({ ...d, fixed, uid });
+      return;
     }
+    data.push({ ...d, fixed, uid });
   });
   if (!sortable || !data.length) {
     return data;
@@ -305,6 +306,28 @@ function getCheckedColumns(columns, cols, sortable) {
   });
   return data;
 }
+function getColItems(columns, untitledText, filter, sortFixed, cancelFixed) {
+  const temp = columns == null ? [] : [...columns];
+  if (sortFixed) {
+    temp.sort((a, b) => {
+      return getColFixedNumber(a.fixed) - getColFixedNumber(b.fixed);
+    });
+  }
+  return mapTree(temp, (d, _i, parent) => {
+    const colId = getColId(d);
+    if (colId == null || filter && !filter(d)) {
+      return;
+    }
+    return {
+      uid: colId,
+      //prop: d.prop,
+      //columnKey: d.columnKey,
+      label: d.label || untitledText,
+      checked: !d.hideInTable,
+      fixed: cancelFixed ? false : parent == null ? d.fixed : false
+    };
+  });
+}
 function getSettingCols(columns, untitledText, cacheKey) {
   const cacheResult = getCacheCols(cacheKey);
   if (cacheResult) {
@@ -360,30 +383,131 @@ function getCacheSize(cacheKey) {
   }
 }
 function getDefaultRowKey(rowKey) {
-  return rowKey ? void 0 : "_rowKey";
+  return rowKey == null ? "_rowKey" : void 0;
 }
 function getRowKey(rowKey) {
   return rowKey ?? getDefaultRowKey();
 }
 function addDefaultRowKey(data, rowKey, page) {
-  if (rowKey == null) {
-    return data;
+  if (rowKey != null && typeof rowKey === "string" && rowKey) {
+    data.forEach((d, i) => {
+      if (d[rowKey] == null) {
+        d[rowKey] = `${page}-${i}`;
+      }
+    });
+  }
+  return data;
+}
+function getCellText(column, row, index, pageIndex) {
+  if (!column) {
+    return "";
   }
-  return data.map((d, i) => {
-    const item = { ...d };
-    item[rowKey] = `${page}-${i}`;
-    return item;
+  if (column.type === "index") {
+    return getIndexValue(index, column.index, pageIndex);
+  }
+  const propValue = getValue(row, column.prop);
+  if (typeof column.formatter === "function") {
+    return column.formatter(row, column, propValue, index);
+  }
+  return propValue == null ? "" : String(propValue);
+}
+function getHeaderCellText(column, index) {
+  if (!column) {
+    return "";
+  }
+  if (typeof column.renderHeader === "function") {
+    return column.renderHeader({ column, $index: index });
+  }
+  return column.label == null ? "" : String(column.label);
+}
+function getExportData(data, columns, spanMethod, pageIndex, showSummary, sumText, summaryMethod) {
+  const { rows: headerRows, cols: bodyCols } = analyseColumns(columns);
+  const bodyData = [];
+  data.forEach((row, index) => {
+    const bodyRowData = [];
+    bodyCols.forEach((col, columnIndex) => {
+      const { key, originalCol: column } = col;
+      const { colspan, rowspan } = getCellSpan(
+        { column, columnIndex, row, rowIndex: index },
+        spanMethod
+      );
+      const isNone = colspan == 0 || rowspan == 0;
+      const text = isNone ? "" : getCellText(column, row, index, pageIndex);
+      bodyRowData.push({ key, row, index, column, text, colspan, rowspan });
+    });
+    bodyData.push(bodyRowData);
   });
+  const headerData = [];
+  headerRows.forEach((headerCols, index) => {
+    const headerRowData = [];
+    headerCols.forEach((col) => {
+      const { key, colspan, rowspan, originalCol: column } = col;
+      const isNone = colspan == 0 || rowspan == 0;
+      const text = isNone ? "" : getHeaderCellText(column, index);
+      headerRowData.push({ key, index, column, text, colspan, rowspan });
+    });
+    headerData.push(headerRowData);
+  });
+  const footerData = [];
+  if (showSummary && data.length) {
+    const footerRowData = [];
+    const userSums = getUserSums(summaryMethod, bodyCols, data);
+    bodyCols.forEach((col, i) => {
+      const { key, dataKey, originalCol: column } = col;
+      const sumValue = getSumValue(data, dataKey);
+      footerRowData.push({
+        key,
+        column,
+        text: userSums == null ? i === 0 ? sumText : sumValue : userSums[i],
+        index: 0
+      });
+    });
+    footerData.push(footerRowData);
+  }
+  return { headerData, bodyData, footerData, bodyCols };
+}
+function exportCSV(fileName, headerData, bodyData, footerData) {
+  const csvRows = [];
+  [...headerData, ...bodyData, ...footerData].forEach((item) => {
+    csvRows.push(item.map((d) => d.text ?? "").join(","));
+  });
+  const content = encodeURIComponent(csvRows.join("\n"));
+  const a = document.createElement("a");
+  a.href = "data:text/csv;charset=utf-8," + content;
+  a.download = fileName + ".csv";
+  a.style.display = "none";
+  document.body.appendChild(a);
+  a.click();
+  document.body.removeChild(a);
+}
+function columnsExportFilter(item) {
+  if (item.hideInExport) {
+    return false;
+  }
+  return !item.type || !["selection", "expand"].includes(item.type);
+}
+function columnsPrintFilter(item) {
+  if (item.hideInPrint) {
+    return false;
+  }
+  return !item.type || !["selection", "expand"].includes(item.type);
 }
 export {
   addDefaultRowKey,
+  columnsExportFilter,
+  columnsPrintFilter,
+  exportCSV,
   getCacheCols,
   getCacheSize,
+  getCellText,
   getCheckedColumns,
   getColId,
+  getColItems,
   getColsCacheKey,
   getDefaultFilter,
   getDefaultRowKey,
+  getExportData,
+  getHeaderCellText,
   getInitCacheColumns,
   getInitColumns,
   getOrderItems,

package/es/ele-qr-code/index.d.ts

@@ -1,5 +1,6 @@
-import type { StyleValues } from '../ele-app/types';
-declare const _default: import("vue").DefineComponent<{
+import { StyleValues } from '../ele-app/types';
+
+declare const _default: import('vue').DefineComponent<{
     value: StringConstructor;
     size: {
         type: NumberConstructor;

package/es/ele-qr-code/props.d.ts

@@ -1,5 +1,6 @@
-import type { PropType, ExtractPropTypes } from 'vue';
-import type { Level, ImageSettings } from './types';
+import { Level, ImageSettings } from './types';
+import { PropType, ExtractPropTypes } from 'vue';
+
 /**
  * 属性
  */
@@ -34,7 +35,7 @@ export declare const qrCodeProps: {
     /** 自定义图片 */
     imageSettings: PropType<ImageSettings>;
     /** 自定义样式 */
-    customStyle: PropType<Partial<import("vue").CSSProperties>>;
+    customStyle: PropType<Partial<import('vue').CSSProperties>>;
 };
 export type QrCodeProps = ExtractPropTypes<typeof qrCodeProps>;
 /**

package/es/ele-qr-code/util.d.ts

@@ -1,5 +1,6 @@
-import qrcodegen from './qrcodegen';
-import type { ImageSettings, Modules, Excavation } from './types';
+import { ImageSettings, Modules, Excavation } from './types';
+import { default as qrcodegen } from './qrcodegen';
+
 export declare const ERROR_LEVEL_MAP: {
     L: qrcodegen.QrCode.Ecc;
     M: qrcodegen.QrCode.Ecc;

package/es/ele-qr-code-svg/index.d.ts

@@ -1,4 +1,4 @@
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import('vue').DefineComponent<{
     value: StringConstructor;
     size: {
         type: NumberConstructor;

package/es/ele-segmented/index.d.ts

@@ -1,5 +1,6 @@
-import type { ElTabsInstance } from '../ele-app/el';
-declare const _default: import("vue").DefineComponent<{
+import { ElTabsInstance } from '../ele-app/el';
+
+declare const _default: import('vue').DefineComponent<{
     modelValue: (StringConstructor | NumberConstructor)[];
     block: BooleanConstructor;
     disabled: BooleanConstructor;
@@ -24,8 +25,8 @@ declare const _default: import("vue").DefineComponent<{
     };
     size: import("vue").PropType<import("./types").SegmentedSize>;
 }>> & {
-    "onUpdate:modelValue"?: ((_value: string | number) => any) | undefined;
     onChange?: ((_active: string | number) => any) | undefined;
+    "onUpdate:modelValue"?: ((_value: string | number) => any) | undefined;
 }, {
     disabled: boolean;
     block: boolean;