ele-admin-plus 1.1.9-beta.9 → 1.2.0-beta.1

package/lib/ele-virtual-table/components/body-cell.d.ts

@@ -1,47 +1,65 @@
-import type { PropType } from 'vue';
+import { BodyColumn, CustomRenderProps, ColSize } from '../types';
+import { DataItem, Column } from '../../ele-data-table/types';
 import { StyleValues } from '../../ele-app/types';
-import type { DataItem, Column } from '../../ele-data-table/types';
-import type { CustomRenderProps, ColSize } from '../types';
-declare const _default: import("vue").DefineComponent<{
-    /** 当前列配置 */
-    column: PropType<Partial<import("element-plus").Column<DataItem>>>;
-    /** 当前列索引 */
-    columnIndex: NumberConstructor;
-    /** 当前行索引 */
-    rowIndex: NumberConstructor;
-    /** 当前行数据 */
-    rowData: PropType<DataItem>;
-    /** 表格主体列宽 */
-    colSizes: PropType<ColSize[]>;
-    /** 表格尺寸 */
-    tableSize: PropType<"" | "default" | "small" | "large" | undefined>;
+import { PropType } from 'vue';
+
+declare const _default: import('vue').DefineComponent<{
+    /** 列配置 */
+    column: {
+        type: PropType<BodyColumn>;
+        required: true;
+    };
+    /** 列索引 */
+    columnIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /** 行索引 */
+    rowIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /** 行数据 */
+    rowData: {
+        type: PropType<DataItem>;
+        required: true;
+    };
+    /** 所有列的列宽 */
+    colSizes: {
+        type: PropType<ColSize[]>;
+        required: true;
+    };
     /** 单元格类名自定义 */
-    bodyCellClass: PropType<import("element-plus/es/components/table/src/table/defaults").CellCls<DataItem> | undefined>;
+    bodyCellClass: PropType<import('element-plus').CellCls<DataItem> | undefined>;
     /** 单元格样式自定义 */
-    bodyCellStyle: PropType<import("element-plus/es/components/table/src/table/defaults").CellStyle<DataItem> | undefined>;
+    bodyCellStyle: PropType<import('element-plus').CellStyle<DataItem> | undefined>;
     /** 单元格合并行列方法 */
     spanMethod: PropType<((data: {
         row: DataItem;
         rowIndex: number;
-        column: import("element-plus/es/components/table/src/table-column/defaults").TableColumnCtx<DataItem>;
+        column: import('element-plus').TableColumnCtx<DataItem>;
         columnIndex: number;
     }) => number[] | {
         rowspan: number;
         colspan: number;
     } | undefined) | undefined>;
     /** 溢出提示组件全局属性 */
-    tableTooltipProps: PropType<boolean | Partial<Pick<import("element-plus").ElTooltipProps, "offset" | "effect" | "placement" | "popperOptions" | "popperClass" | "showArrow" | "appendTo" | "transition" | "enterable" | "showAfter" | "hideAfter">> | undefined>;
+    tableTooltipProps: PropType<boolean | Partial<Pick<import('element-plus').ElTooltipProps, "offset" | "effect" | "placement" | "popperOptions" | "popperClass" | "showArrow" | "appendTo" | "transition" | "enterable" | "showAfter" | "hideAfter">> | undefined>;
     /** 序号列起始编号 */
     pageIndex: NumberConstructor;
     /** 表格行高 */
     rowHeight: NumberConstructor;
-    /** 树表格展开图标的列 */
-    expandColumnKey: StringConstructor;
     /** 多选当前行是否选中 */
     isChecked: BooleanConstructor;
+    /** 多选当前行是否禁用 */
+    isDisabled: BooleanConstructor;
+    /** 表格尺寸 */
+    tableSize: PropType<"" | "default" | "small" | "large" | undefined>;
+    /** 树表格展开图标的列 */
+    expandColumnKey: StringConstructor;
     /** 树表格当前行是否有子级 */
     hasChildren: BooleanConstructor;
-    /** 当前行缩进 */
+    /** 树表格当前行缩进 */
     rowIndent: StringConstructor;
     /** 树表格当前行是否折叠 */
     isCollapse: BooleanConstructor;
@@ -52,12 +70,12 @@ declare const _default: import("vue").DefineComponent<{
     /** 表格是否是自适应行高 */
     autoRowHeight: BooleanConstructor;
 }, {
-    colType: import("vue").ComputedRef<string | undefined>;
-    cellClass: import("vue").ComputedRef<string>;
-    cellStyle: import("vue").ComputedRef<StyleValues | undefined>;
-    cellText: import("vue").ComputedRef<string | undefined>;
-    isExpandCol: import("vue").ComputedRef<boolean>;
-    renderOpt: import("vue").ComputedRef<CustomRenderProps>;
+    colType: import('vue').ComputedRef<string>;
+    cellClass: import('vue').ComputedRef<string>;
+    cellStyle: import('vue').ComputedRef<StyleValues | undefined>;
+    cellText: import('vue').ComputedRef<string | undefined>;
+    isExpandCol: import('vue').ComputedRef<boolean>;
+    renderOpt: import('vue').ComputedRef<CustomRenderProps>;
     onTextClick: (e: MouseEvent) => void;
     onCheckedChange: (checked: boolean) => void;
     onExpandChange: () => void;
@@ -66,61 +84,78 @@ declare const _default: import("vue").DefineComponent<{
     onContextmenu: (e: MouseEvent) => void;
     onMouseenter: (e: MouseEvent) => void;
     onMouseleave: (e: MouseEvent) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     /** 多选框选中改变事件 */
-    checkedChange: (_row: DataItem, _checked: boolean) => true;
+    checkedChange: (_checked: boolean) => true;
     /** 展开状态改变事件 */
-    expandChange: (_row: DataItem, _expanded: boolean) => true;
+    expandChange: (_expanded: boolean) => true;
     /** 点击事件 */
-    click: (_row: DataItem, _col: Column, _e: MouseEvent) => true;
+    click: (_col: Column, _e: MouseEvent) => true;
     /** 双击事件 */
-    dblclick: (_row: DataItem, _col: Column, _e: MouseEvent) => true;
+    dblclick: (_col: Column, _e: MouseEvent) => true;
     /** 右键事件 */
-    contextmenu: (_row: DataItem, _col: Column, _e: MouseEvent) => true;
+    contextmenu: (_col: Column, _e: MouseEvent) => true;
     /** 鼠标移入事件 */
-    mouseenter: (_row: DataItem, _col: Column, _e: MouseEvent) => true;
+    mouseenter: (_col: Column, _e: MouseEvent) => true;
     /** 鼠标移出事件 */
-    mouseleave: (_row: DataItem, _col: Column, _e: MouseEvent) => true;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    /** 当前列配置 */
-    column: PropType<Partial<import("element-plus").Column<DataItem>>>;
-    /** 当前列索引 */
-    columnIndex: NumberConstructor;
-    /** 当前行索引 */
-    rowIndex: NumberConstructor;
-    /** 当前行数据 */
-    rowData: PropType<DataItem>;
-    /** 表格主体列宽 */
-    colSizes: PropType<ColSize[]>;
-    /** 表格尺寸 */
-    tableSize: PropType<"" | "default" | "small" | "large" | undefined>;
+    mouseleave: (_col: Column, _e: MouseEvent) => true;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    /** 列配置 */
+    column: {
+        type: PropType<BodyColumn>;
+        required: true;
+    };
+    /** 列索引 */
+    columnIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /** 行索引 */
+    rowIndex: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /** 行数据 */
+    rowData: {
+        type: PropType<DataItem>;
+        required: true;
+    };
+    /** 所有列的列宽 */
+    colSizes: {
+        type: PropType<ColSize[]>;
+        required: true;
+    };
     /** 单元格类名自定义 */
-    bodyCellClass: PropType<import("element-plus/es/components/table/src/table/defaults").CellCls<DataItem> | undefined>;
+    bodyCellClass: PropType<import('element-plus').CellCls<DataItem> | undefined>;
     /** 单元格样式自定义 */
-    bodyCellStyle: PropType<import("element-plus/es/components/table/src/table/defaults").CellStyle<DataItem> | undefined>;
+    bodyCellStyle: PropType<import('element-plus').CellStyle<DataItem> | undefined>;
     /** 单元格合并行列方法 */
     spanMethod: PropType<((data: {
         row: DataItem;
         rowIndex: number;
-        column: import("element-plus/es/components/table/src/table-column/defaults").TableColumnCtx<DataItem>;
+        column: import('element-plus').TableColumnCtx<DataItem>;
         columnIndex: number;
     }) => number[] | {
         rowspan: number;
         colspan: number;
     } | undefined) | undefined>;
     /** 溢出提示组件全局属性 */
-    tableTooltipProps: PropType<boolean | Partial<Pick<import("element-plus").ElTooltipProps, "offset" | "effect" | "placement" | "popperOptions" | "popperClass" | "showArrow" | "appendTo" | "transition" | "enterable" | "showAfter" | "hideAfter">> | undefined>;
+    tableTooltipProps: PropType<boolean | Partial<Pick<import('element-plus').ElTooltipProps, "offset" | "effect" | "placement" | "popperOptions" | "popperClass" | "showArrow" | "appendTo" | "transition" | "enterable" | "showAfter" | "hideAfter">> | undefined>;
     /** 序号列起始编号 */
     pageIndex: NumberConstructor;
     /** 表格行高 */
     rowHeight: NumberConstructor;
-    /** 树表格展开图标的列 */
-    expandColumnKey: StringConstructor;
     /** 多选当前行是否选中 */
     isChecked: BooleanConstructor;
+    /** 多选当前行是否禁用 */
+    isDisabled: BooleanConstructor;
+    /** 表格尺寸 */
+    tableSize: PropType<"" | "default" | "small" | "large" | undefined>;
+    /** 树表格展开图标的列 */
+    expandColumnKey: StringConstructor;
     /** 树表格当前行是否有子级 */
     hasChildren: BooleanConstructor;
-    /** 当前行缩进 */
+    /** 树表格当前行缩进 */
     rowIndent: StringConstructor;
     /** 树表格当前行是否折叠 */
     isCollapse: BooleanConstructor;
@@ -131,15 +166,16 @@ declare const _default: import("vue").DefineComponent<{
     /** 表格是否是自适应行高 */
     autoRowHeight: BooleanConstructor;
 }>> & {
-    onMouseenter?: ((_row: DataItem, _col: Column, _e: MouseEvent) => any) | undefined;
-    onMouseleave?: ((_row: DataItem, _col: Column, _e: MouseEvent) => any) | undefined;
-    onClick?: ((_row: DataItem, _col: Column, _e: MouseEvent) => any) | undefined;
-    onContextmenu?: ((_row: DataItem, _col: Column, _e: MouseEvent) => any) | undefined;
-    onExpandChange?: ((_row: DataItem, _expanded: boolean) => any) | undefined;
-    onDblclick?: ((_row: DataItem, _col: Column, _e: MouseEvent) => any) | undefined;
-    onCheckedChange?: ((_row: DataItem, _checked: boolean) => any) | undefined;
+    onMouseenter?: ((_col: Column, _e: MouseEvent) => any) | undefined;
+    onMouseleave?: ((_col: Column, _e: MouseEvent) => any) | undefined;
+    onClick?: ((_col: Column, _e: MouseEvent) => any) | undefined;
+    onContextmenu?: ((_col: Column, _e: MouseEvent) => any) | undefined;
+    onExpandChange?: ((_expanded: boolean) => any) | undefined;
+    onDblclick?: ((_col: Column, _e: MouseEvent) => any) | undefined;
+    onCheckedChange?: ((_checked: boolean) => any) | undefined;
 }, {
     loading: boolean;
+    isDisabled: boolean;
     isChecked: boolean;
     hasChildren: boolean;
     isCollapse: boolean;

package/lib/ele-virtual-table/components/body-row.cjs

@@ -6,17 +6,29 @@ const _sfc_main = vue.defineComponent({
   components: { BodyCell },
   props: {
     /** 主体列配置 */
-    bodyCols: Array,
+    bodyCols: {
+      type: Array,
+      required: true
+    },
     /** 表格主体列宽 */
-    colSizes: Array,
+    colSizes: {
+      type: Array,
+      required: true
+    },
     /** 当前行索引 */
-    rowIndex: Number,
-    /** 当前行数据 */
-    rowData: Object,
+    rowIndex: {
+      type: Number,
+      required: true
+    },
+    /** 当前行对象 */
+    rowItem: {
+      type: Object,
+      required: true
+    },
+    /** 当前行数据唯一值 */
+    rowId: [String, Number],
     /** 表格多选选中的值 */
     checkedRowKeys: Set,
-    /** 是否禁用表头选择框 */
-    tableSize: String,
     /** 单元格类名自定义 */
     bodyCellClass: [String, Function],
     /** 单元格样式自定义 */
@@ -29,19 +41,19 @@ const _sfc_main = vue.defineComponent({
     pageIndex: Number,
     /** 表格行高 */
     rowHeight: Number,
+    /** 表格尺寸 */
+    tableSize: String,
     /** 树表格展开图标的列 */
     expandColumnKey: String,
     /** 表格展开行的值 */
     expandedRowKeys: Array,
-    /** 嵌套数据是否有子级字段名称 */
-    hasChildrenName: String,
     /** 树表格是否懒加载子级 */
     lazy: Boolean,
     /** 树表格懒加载方法 */
     load: Function,
-    /** 树表格行数据级别 */
+    /** 树表格行数据缩进级别 */
     level: Number,
-    /** 树表格行缩进 */
+    /** 树表格每一级行缩进大小 */
     indent: Number,
     /** 是否需要固定单元格高度 */
     fixedCellHeight: Boolean,
@@ -52,7 +64,7 @@ const _sfc_main = vue.defineComponent({
     /** 多选框选中改变事件 */
     cellCheckedChange: (_row, _checked) => true,
     /** 展开状态改变事件 */
-    cellExpandChange: (_row, _expanded, _data) => true,
+    cellExpandChange: (_row, _expanded, _children) => true,
     /** 单元格点击事件 */
     cellClick: (_row, _col, _e) => true,
     /** 单元格双击事件 */
@@ -66,21 +78,18 @@ const _sfc_main = vue.defineComponent({
   },
   setup(props, { emit }) {
     const loading = vue.ref(false);
-    const rowDataKey = vue.computed(() => {
-      return props.rowData ? props.rowData._rowKey : void 0;
-    });
     const isChecked = vue.computed(() => {
-      if (!props.checkedRowKeys || !rowDataKey.value) {
+      if (!props.checkedRowKeys || props.rowId == null) {
         return false;
       }
-      return props.checkedRowKeys.has(rowDataKey.value);
+      return props.checkedRowKeys.has(props.rowId);
     });
     const hasChildren = vue.computed(() => {
-      if (props.rowData) {
-        if (props.rowData.children) {
-          return !!props.rowData.children.length;
+      if (props.rowItem) {
+        if (props.rowItem.children) {
+          return !!props.rowItem.children.length;
         }
-        if (props.lazy && props.hasChildrenName && props.rowData[props.hasChildrenName] === true) {
+        if (props.lazy && props.rowItem.hasChildren) {
           return true;
         }
       }
@@ -93,45 +102,41 @@ const _sfc_main = vue.defineComponent({
       return props.level * props.indent + "px";
     });
     const isCollapse = vue.computed(() => {
-      if (!props.expandedRowKeys || rowDataKey.value == null) {
+      if (!props.expandedRowKeys || props.rowId == null) {
         return true;
       }
-      return !props.expandedRowKeys.includes(rowDataKey.value);
+      return !props.expandedRowKeys.includes(props.rowId);
     });
-    const getKey = (column, columnIndex) => {
-      const key = rowDataKey.value ?? props.rowIndex;
-      return key + "-" + (column.key ?? columnIndex);
-    };
-    const onCellCheckedChange = (row, checked) => {
-      emit("cellCheckedChange", row, checked);
+    const onCellCheckedChange = (checked) => {
+      emit("cellCheckedChange", props.rowItem, checked);
     };
-    const onCellExpandChange = (row, expanded) => {
-      if (expanded && props.lazy && !row.children) {
+    const onCellExpandChange = (expanded) => {
+      if (expanded && props.lazy && !props.rowItem.children) {
         if (props.load) {
           loading.value = true;
-          props.load(row, null, (data) => {
+          props.load(props.rowItem.rowData, null, (data) => {
             loading.value = false;
-            emit("cellExpandChange", row, expanded, data);
+            emit("cellExpandChange", props.rowItem, expanded, data);
           });
         }
         return;
       }
-      emit("cellExpandChange", row, expanded);
+      emit("cellExpandChange", props.rowItem, expanded);
     };
-    const onCellClick = (row, col, e) => {
-      emit("cellClick", row, col, e);
+    const onCellClick = (col, e) => {
+      emit("cellClick", props.rowItem, col, e);
     };
-    const onCellDblclick = (row, col, e) => {
-      emit("cellDblclick", row, col, e);
+    const onCellDblclick = (col, e) => {
+      emit("cellDblclick", props.rowItem, col, e);
     };
-    const onCellContextmenu = (row, col, e) => {
-      emit("cellContextmenu", row, col, e);
+    const onCellContextmenu = (col, e) => {
+      emit("cellContextmenu", props.rowItem, col, e);
     };
-    const onCellMouseenter = (row, col, e) => {
-      emit("cellMouseenter", row, col, e);
+    const onCellMouseenter = (col, e) => {
+      emit("cellMouseenter", props.rowItem, col, e);
     };
-    const onCellMouseleave = (row, col, e) => {
-      emit("cellMouseleave", row, col, e);
+    const onCellMouseleave = (col, e) => {
+      emit("cellMouseleave", props.rowItem, col, e);
     };
     return {
       loading,
@@ -139,7 +144,6 @@ const _sfc_main = vue.defineComponent({
       hasChildren,
       rowIndent,
       isCollapse,
-      getKey,
       onCellCheckedChange,
       onCellExpandChange,
       onCellClick,
@@ -159,23 +163,24 @@ const _export_sfc = (sfc, props) => {
 };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_BodyCell = vue.resolveComponent("BodyCell");
-  return vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.bodyCols, (column, index) => {
+  return vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.bodyCols, (column, columnIndex) => {
     return vue.openBlock(), vue.createBlock(_component_BodyCell, {
-      key: _ctx.getKey(column, index),
+      key: (_ctx.rowId ?? _ctx.rowIndex) + "-" + (column.key ?? columnIndex),
       column,
-      columnIndex: index,
+      columnIndex,
       rowIndex: _ctx.rowIndex,
-      rowData: _ctx.rowData,
+      rowData: _ctx.rowItem.rowData,
       colSizes: _ctx.colSizes,
-      tableSize: _ctx.tableSize,
       bodyCellClass: _ctx.bodyCellClass,
       bodyCellStyle: _ctx.bodyCellStyle,
       spanMethod: _ctx.spanMethod,
       tableTooltipProps: _ctx.tableTooltipProps,
       pageIndex: _ctx.pageIndex,
       rowHeight: _ctx.rowHeight,
-      expandColumnKey: _ctx.expandColumnKey,
       isChecked: _ctx.isChecked,
+      isDisabled: _ctx.rowItem.isDisabled,
+      tableSize: _ctx.tableSize,
+      expandColumnKey: _ctx.expandColumnKey,
       hasChildren: _ctx.hasChildren,
       rowIndent: _ctx.rowIndent,
       isCollapse: _ctx.isCollapse,
@@ -198,7 +203,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           ])
         };
       })
-    ]), 1032, ["column", "columnIndex", "rowIndex", "rowData", "colSizes", "tableSize", "bodyCellClass", "bodyCellStyle", "spanMethod", "tableTooltipProps", "pageIndex", "rowHeight", "expandColumnKey", "isChecked", "hasChildren", "rowIndent", "isCollapse", "loading", "fixedCellHeight", "autoRowHeight", "onCheckedChange", "onExpandChange", "onClick", "onDblclick", "onContextmenu", "onMouseenter", "onMouseleave"]);
+    ]), 1032, ["column", "columnIndex", "rowIndex", "rowData", "colSizes", "bodyCellClass", "bodyCellStyle", "spanMethod", "tableTooltipProps", "pageIndex", "rowHeight", "isChecked", "isDisabled", "tableSize", "expandColumnKey", "hasChildren", "rowIndent", "isCollapse", "loading", "fixedCellHeight", "autoRowHeight", "onCheckedChange", "onExpandChange", "onClick", "onDblclick", "onContextmenu", "onMouseenter", "onMouseleave"]);
   }), 128);
 }
 const bodyRow = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);