@gct-paas/v-ben 0.1.6-dev.9 → 6.0.0-dev.2

package/es/components/v-ben-table/src/hooks/usePagination.mjs

@@ -0,0 +1,63 @@
+import { isBoolean } from "../../../../utils/is.mjs";
+import { PAGE_SIZE_OPTIONS } from "../const.mjs";
+import { LeftOutlined, RightOutlined } from "@ant-design/icons-vue";
+import { computed, h, ref, unref, watch } from "vue";
+import { t } from "@gct-paas/core";
+//#region src/components/v-ben-table/src/hooks/usePagination.ts
+function itemRender({ page, type, originalElement }) {
+	if (type === "prev") return page === 0 ? null : h(LeftOutlined);
+	if (type === "next") return page === 1 ? null : h(RightOutlined);
+	return originalElement;
+}
+function usePagination(refProps) {
+	const configRef = ref({});
+	const show = ref(true);
+	watch(() => unref(refProps).pagination, (pagination) => {
+		if (!isBoolean(pagination) && pagination) configRef.value = {
+			...unref(configRef),
+			...pagination
+		};
+	}, { deep: true });
+	const getPaginationInfo = computed(() => {
+		const { pagination } = unref(refProps);
+		if (!unref(show) || isBoolean(pagination) && !pagination) return false;
+		return {
+			current: 1,
+			pageSize: 20,
+			size: "small",
+			defaultPageSize: 20,
+			showTotal: (total) => t("sys.component.table.total", { total }),
+			showSizeChanger: true,
+			pageSizeOptions: PAGE_SIZE_OPTIONS,
+			itemRender,
+			showQuickJumper: true,
+			...isBoolean(pagination) ? {} : pagination ?? {},
+			...unref(configRef)
+		};
+	});
+	function setPagination(info) {
+		const paginationInfo = unref(getPaginationInfo);
+		configRef.value = {
+			...!isBoolean(paginationInfo) ? paginationInfo : {},
+			...info
+		};
+	}
+	function getPagination() {
+		return unref(getPaginationInfo);
+	}
+	function getShowPagination() {
+		return unref(show);
+	}
+	async function setShowPagination(flag) {
+		show.value = flag;
+	}
+	return {
+		getPagination,
+		getPaginationInfo,
+		setShowPagination,
+		getShowPagination,
+		setPagination
+	};
+}
+//#endregion
+export { usePagination };

package/es/components/v-ben-table/src/hooks/useTable.d.ts

@@ -0,0 +1,6 @@
+import { TableActionType } from '../types/table';
+export type UseTableMethods = Pick<TableActionType, 'expandAll'>;
+export declare function useTable(): [
+    (instance: TableActionType, formInstance?: unknown) => void,
+    UseTableMethods
+];

package/es/components/v-ben-table/src/hooks/useTable.mjs

@@ -0,0 +1,21 @@
+import { onUnmounted, ref, unref } from "vue";
+//#region src/components/v-ben-table/src/hooks/useTable.ts
+function useTable() {
+	const tableRef = ref(null);
+	function register(instance, _formInstance) {
+		onUnmounted(() => {
+			tableRef.value = null;
+		});
+		tableRef.value = instance;
+	}
+	function getTableInstance() {
+		const table = unref(tableRef);
+		if (!table) console.error("The table instance has not been obtained yet, please make sure the table is presented when performing the table operation!");
+		return table;
+	}
+	return [register, { expandAll: () => {
+		getTableInstance().expandAll();
+	} }];
+}
+//#endregion
+export { useTable };

package/es/components/v-ben-table/src/hooks/useTableExpand.d.ts

@@ -0,0 +1,9 @@
+import { ComputedRef } from 'vue';
+import { BasicTableProps } from '../types/table';
+export declare function useTableExpand(propsRef: ComputedRef<BasicTableProps>, tableData: ComputedRef<Recordable[]>, hasExpandableSlot: ComputedRef<boolean>, emit: (event: 'expanded-rows-change', keys: string[]) => void): {
+    getExpandOption: ComputedRef<IObject>;
+    expandedRowKeys: import('vue').Ref<string[], string[]>;
+    expandAll: () => void;
+    expandRows: (keys: string[]) => void;
+    collapseAll: () => void;
+};

package/es/components/v-ben-table/src/hooks/useTableExpand.mjs

@@ -0,0 +1,62 @@
+import { computed, ref, toRaw, unref, watch } from "vue";
+//#region src/components/v-ben-table/src/hooks/useTableExpand.ts
+var NO_TREE_CHILDREN_COLUMN = "__NO_TREE_CHILDREN__";
+function useTableExpand(propsRef, tableData, hasExpandableSlot, emit) {
+	const { expandedRowKeys: propsExpandedRowKeys = [] } = unref(propsRef);
+	const expandedRowKeys = ref([...propsExpandedRowKeys]);
+	const shouldManageExpand = computed(() => {
+		return !!unref(propsRef).isTreeTable || unref(hasExpandableSlot);
+	});
+	const getAutoCreateKey = computed(() => {
+		return unref(propsRef).autoCreateKey && !unref(propsRef).rowKey;
+	});
+	const getRowKey = computed(() => {
+		const { rowKey } = unref(propsRef);
+		return unref(getAutoCreateKey) ? "key" : rowKey;
+	});
+	watch(() => unref(propsRef).expandedRowKeys, (val) => {
+		if (val !== void 0 && val !== null) expandedRowKeys.value = [...val];
+	});
+	watch(expandedRowKeys, (keys) => {
+		if (unref(shouldManageExpand)) emit("expanded-rows-change", keys);
+	}, { deep: true });
+	const getExpandOption = computed(() => {
+		if (!unref(shouldManageExpand)) return {};
+		const { isTreeTable, childrenColumnName } = unref(propsRef);
+		const options = {};
+		if (unref(hasExpandableSlot) && !isTreeTable && !childrenColumnName) options.childrenColumnName = NO_TREE_CHILDREN_COLUMN;
+		return options;
+	});
+	function expandAll() {
+		expandedRowKeys.value = getAllKeys();
+	}
+	function expandRows(keys) {
+		if (!unref(shouldManageExpand)) return;
+		expandedRowKeys.value = [...expandedRowKeys.value, ...keys];
+	}
+	function getAllKeys(data) {
+		const keys = [];
+		const { isTreeTable, childrenColumnName } = unref(propsRef);
+		const childrenField = childrenColumnName || "children";
+		toRaw(data || unref(tableData)).forEach((item) => {
+			keys.push(String(item[unref(getRowKey)]));
+			if (isTreeTable) {
+				const children = item[childrenField];
+				if (children?.length) keys.push(...getAllKeys(children));
+			}
+		});
+		return keys;
+	}
+	function collapseAll() {
+		expandedRowKeys.value = [];
+	}
+	return {
+		getExpandOption,
+		expandedRowKeys,
+		expandAll,
+		expandRows,
+		collapseAll
+	};
+}
+//#endregion
+export { useTableExpand };

package/es/components/v-ben-table/src/hooks/useTableHeader.d.ts

@@ -0,0 +1,4 @@
+import { Slots } from 'vue';
+export declare function useTableHeader(slots: Slots): {
+    getHeaderProps: import('vue').ComputedRef<Recordable<unknown>>;
+};

package/es/components/v-ben-table/src/hooks/useTableHeader.mjs

@@ -0,0 +1,11 @@
+import TableHeader_default from "../components/TableHeader.vue.mjs";
+import { getSlot } from "../utils/tsxHelper.mjs";
+import { computed, h } from "vue";
+//#region src/components/v-ben-table/src/hooks/useTableHeader.ts
+function useTableHeader(slots) {
+	return { getHeaderProps: computed(() => {
+		return { title: !slots.headerTop ? null : () => h(TableHeader_default, {}, { ...slots.headerTop ? { headerTop: () => getSlot(slots, "headerTop") } : {} }) };
+	}) };
+}
+//#endregion
+export { useTableHeader };

package/es/components/v-ben-table/src/hooks/useTableRowDrag.d.ts

@@ -0,0 +1,7 @@
+import { BasicColumn, BasicTableProps, RowDragEndPayload } from '../types/table';
+import { ComputedRef, Ref, Slots } from 'vue';
+export declare function useTableRowDrag(wrapRef: Ref<HTMLElement | null>, getProps: ComputedRef<BasicTableProps>, getBindValues: ComputedRef<IObject>, getViewColumns: ComputedRef<BasicColumn[]>, expandedRowKeys: Ref<string[]>, slots: Slots, emit: (event: 'row-drag-end', payload: RowDragEndPayload) => void): {
+    showDragIcon: (slotName: string, data: IObject) => boolean;
+    initRowDrag: () => void;
+    destroyRowDrag: () => void;
+};

package/es/components/v-ben-table/src/hooks/useTableRowDrag.mjs

@@ -0,0 +1,148 @@
+import { unref } from "vue";
+import { cloneDeep } from "lodash-es";
+import SortableJs from "sortablejs";
+//#region src/components/v-ben-table/src/hooks/useTableRowDrag.ts
+function useTableRowDrag(wrapRef, getProps, getBindValues, getViewColumns, expandedRowKeys, slots, emit) {
+	let sortableEl = null;
+	function getTargetIndex(list, id, arr = []) {
+		return list.reduce((total, item, index) => {
+			if (String(item.id) === id) return [...total, index];
+			const children = item.children;
+			if (children?.length) {
+				let childArr = getTargetIndex(children, id, [...arr, index]);
+				if (childArr.length === [...arr, index].length) childArr = total;
+				return childArr;
+			}
+			return total;
+		}, arr);
+	}
+	function getRecordKey(record) {
+		const { rowKey } = unref(getProps);
+		if (typeof rowKey === "function") return rowKey(record);
+		if (rowKey) return record[rowKey];
+		return record.id ?? record.key;
+	}
+	function showDragIcon(slotName, data) {
+		const { rowDraggable } = unref(getProps);
+		if (!rowDraggable) return false;
+		const slotKeys = Object.keys(slots);
+		const firstDataIndex = unref(getViewColumns)?.[0]?.dataIndex;
+		return slotKeys.includes("expandIcon") && slotName === "expandIcon" || !slotKeys.includes("expandIcon") && slotName === "bodyCell" && data.column?.dataIndex === firstDataIndex;
+	}
+	function destroyRowDrag() {
+		sortableEl?.destroy();
+		sortableEl = null;
+	}
+	function initRowDrag() {
+		if (!unref(getProps).rowDraggable) return;
+		destroyRowDrag();
+		setTimeout(() => {
+			const tbody = unref(wrapRef)?.querySelector("tbody.ant-table-tbody");
+			if (!tbody) return;
+			let savedExpandKeysList = [];
+			let targetRowKey;
+			let relatedRowKey;
+			let dragIndexArr = [];
+			let isInsertAfter = false;
+			let parentMenu;
+			sortableEl = SortableJs.create(tbody, {
+				group: "basic-table-rows",
+				animation: 150,
+				handle: ".gct-handle",
+				dataIdAttr: "data-row-key",
+				filter: ".unsortable",
+				onStart({ item }) {
+					targetRowKey = item?.dataset?.rowKey;
+					if (!unref(getProps).isTreeTable || !targetRowKey) return;
+					dragIndexArr = [];
+					savedExpandKeysList = cloneDeep(unref(expandedRowKeys));
+					dragIndexArr = getTargetIndex(unref(getBindValues).dataSource, targetRowKey.toString());
+					if (dragIndexArr.length > 1) {
+						const dataSource = unref(getBindValues).dataSource;
+						const parentChildren = dataSource[dragIndexArr[0]]?.children;
+						parentMenu = dragIndexArr.length === 2 ? dataSource[dragIndexArr[0]] : parentChildren?.[dragIndexArr[1]];
+						const siblingChildren = parentMenu?.children;
+						expandedRowKeys.value = unref(expandedRowKeys).filter((key) => {
+							return !siblingChildren?.map((n) => n.id).includes(key);
+						});
+					} else {
+						parentMenu = void 0;
+						expandedRowKeys.value = [];
+					}
+				},
+				onMove(evt) {
+					const { related, willInsertAfter } = evt;
+					if (unref(getProps).isTreeTable) {
+						if (!related?.dataset?.rowKey) return false;
+						const relatedIndexArr = getTargetIndex(unref(getBindValues).dataSource, related.dataset.rowKey.toString());
+						const canMove = relatedIndexArr.length === dragIndexArr.length && relatedIndexArr.slice(0, -1).every((item, index) => item === dragIndexArr[index]);
+						if (canMove) {
+							relatedRowKey = related.dataset.rowKey;
+							isInsertAfter = !!willInsertAfter;
+						}
+						return canMove;
+					}
+					if ((related?.children?.[0]?.outerHTML ?? "").indexOf("unsortable") > -1) return false;
+					if (related?.dataset?.rowKey) {
+						relatedRowKey = related.dataset.rowKey;
+						isInsertAfter = !!willInsertAfter;
+					}
+					return true;
+				},
+				onEnd: async () => {
+					const isTreeTable = unref(getProps).isTreeTable;
+					const dataSource = unref(getBindValues).dataSource;
+					let relatedItem;
+					let targetItem;
+					if (isTreeTable) {
+						expandedRowKeys.value = savedExpandKeysList;
+						if (parentMenu?.children) parentMenu.children.forEach((item) => {
+							if (String(item.id) === relatedRowKey) relatedItem = item;
+							if (String(item.id) === targetRowKey) targetItem = item;
+						});
+						else dataSource.forEach((item) => {
+							if (String(item.id) === relatedRowKey) relatedItem = item;
+							if (String(item.id) === targetRowKey) targetItem = item;
+						});
+					} else dataSource.forEach((item) => {
+						const id = getRecordKey(item);
+						if (String(id) === relatedRowKey) relatedItem = item;
+						if (String(id) === targetRowKey) targetItem = item;
+					});
+					if (!relatedItem || !targetItem) return;
+					const ids = dataSource.map((item) => item.id);
+					const tempList = sortableEl?.toArray()?.filter((i) => ids.includes(i));
+					const reqParams = isTreeTable ? {
+						id: targetItem.id,
+						parentId: parentMenu?.id || "ROOT",
+						sortNum: isInsertAfter ? relatedItem.sortNum : relatedItem.sortNum + 1
+					} : {
+						id: getRecordKey(targetItem),
+						targetSortNum: isInsertAfter ? relatedItem.sortNum : relatedItem.sortNum + 1,
+						sortList: tempList
+					};
+					const { rowDragApi } = unref(getProps);
+					if (rowDragApi && typeof rowDragApi === "function") await rowDragApi(reqParams);
+					const dragEndList = [];
+					sortableEl?.toArray()?.forEach((key) => {
+						const dataItem = dataSource.find((item) => String(getRecordKey(item)) === String(key));
+						if (dataItem) dragEndList.push(dataItem);
+					});
+					emit("row-drag-end", {
+						dragEndList,
+						expandKeysList: unref(expandedRowKeys),
+						dragItemKey: targetRowKey,
+						showMessage: true
+					});
+				}
+			});
+		}, 0);
+	}
+	return {
+		showDragIcon,
+		initRowDrag,
+		destroyRowDrag
+	};
+}
+//#endregion
+export { useTableRowDrag };

package/es/components/v-ben-table/src/hooks/useTableScroll.d.ts

@@ -0,0 +1,17 @@
+import { PaginationProps } from '../types/pagination';
+import { BasicColumn, BasicTableProps, TableRowSelection } from '../types/table';
+import { ComputedRef, Ref } from 'vue';
+type TableComponentRef = {
+    $el: HTMLElement;
+} | null;
+type FormComponentRef = {
+    $el: HTMLElement;
+} | null;
+export declare function useTableScroll(propsRef: ComputedRef<BasicTableProps>, tableElRef: Ref<TableComponentRef>, columnsRef: ComputedRef<BasicColumn[]>, rowSelectionRef: ComputedRef<TableRowSelection | null>, getPaginationRef: ComputedRef<PaginationProps | boolean>, getDataSourceRef: ComputedRef<Recordable[]>, wrapRef: Ref<HTMLElement | null>, formRef: Ref<FormComponentRef>): {
+    getScrollRef: ComputedRef<{
+        x?: number | string | true;
+        y?: number | string;
+    } | undefined>;
+    redoHeight: () => void;
+};
+export {};

package/es/components/v-ben-table/src/hooks/useTableScroll.mjs

@@ -0,0 +1,126 @@
+import { isBoolean } from "../../../../utils/is.mjs";
+import { getViewportOffset } from "../utils/dom-utils.mjs";
+import { computed, nextTick, onActivated, onMounted, ref, unref, watch } from "vue";
+import { useDebounceFn, useEventListener } from "@vueuse/core";
+//#region src/components/v-ben-table/src/hooks/useTableScroll.ts
+function useTableScroll(propsRef, tableElRef, columnsRef, rowSelectionRef, getPaginationRef, getDataSourceRef, wrapRef, formRef) {
+	const tableHeightRef = ref(215);
+	const debounceRedoHeight = useDebounceFn(redoHeight, 100);
+	const getCanResize = computed(() => {
+		const { canResize, scroll } = unref(propsRef);
+		return canResize && !(scroll || {}).y;
+	});
+	watch(() => [unref(getCanResize), unref(getDataSourceRef)?.length], () => {
+		debounceRedoHeight();
+	}, { flush: "post" });
+	function redoHeight() {
+		nextTick(() => {
+			calcTableHeight();
+		});
+	}
+	function setHeight(height) {
+		tableHeightRef.value = height;
+	}
+	let paginationEl = null;
+	let footerEl = null;
+	let bodyEl = null;
+	async function calcTableHeight() {
+		const { resizeHeightOffset, maxHeight, isCanResizeParent, useSearchForm } = unref(propsRef);
+		const pagination = unref(getPaginationRef);
+		const tableData = unref(getDataSourceRef);
+		const table = unref(tableElRef);
+		if (!table) return;
+		const tableEl = table.$el;
+		if (!tableEl) return;
+		if (!bodyEl) {
+			bodyEl = tableEl.querySelector(".ant-table-body");
+			if (!bodyEl) return;
+		}
+		const hasScrollBarY = bodyEl.scrollHeight > bodyEl.clientHeight;
+		const hasScrollBarX = bodyEl.scrollWidth > bodyEl.clientWidth;
+		if (hasScrollBarY) {
+			if (tableEl.classList.contains("hide-scrollbar-y")) tableEl.classList.remove("hide-scrollbar-y");
+		} else if (!tableEl.classList.contains("hide-scrollbar-y")) tableEl.classList.add("hide-scrollbar-y");
+		if (hasScrollBarX) {
+			if (tableEl.classList.contains("hide-scrollbar-x")) tableEl.classList.remove("hide-scrollbar-x");
+		} else if (!tableEl.classList.contains("hide-scrollbar-x")) tableEl.classList.add("hide-scrollbar-x");
+		bodyEl.style.height = "unset";
+		if (!unref(getCanResize) || !unref(tableData) || tableData.length === 0) return;
+		await nextTick();
+		const headEl = tableEl.querySelector(".ant-table-thead ");
+		if (!headEl) return;
+		let paddingHeight = 32;
+		let paginationHeight = 12;
+		if (!isBoolean(pagination)) {
+			paginationEl = tableEl.querySelector(".ant-pagination");
+			if (paginationEl) {
+				const offsetHeight = paginationEl.offsetHeight;
+				paginationHeight += offsetHeight || 0;
+			} else paginationHeight += 24;
+		} else paginationHeight = -8;
+		let footerHeight = 0;
+		if (!isBoolean(pagination)) if (!footerEl) footerEl = tableEl.querySelector(".ant-table-footer");
+		else {
+			const offsetHeight = footerEl.offsetHeight;
+			footerHeight += offsetHeight || 0;
+		}
+		let headerHeight = 0;
+		if (headEl) headerHeight = headEl.offsetHeight;
+		let bottomIncludeBody = 0;
+		if (unref(wrapRef) && isCanResizeParent) {
+			const tablePadding = 12;
+			const formMargin = 16;
+			let paginationMargin = 10;
+			const wrapHeight = unref(wrapRef)?.offsetHeight ?? 0;
+			let formHeight = unref(formRef)?.$el.offsetHeight ?? 0;
+			if (formHeight) formHeight += formMargin;
+			if (isBoolean(pagination) && !pagination) paginationMargin = 0;
+			if (isBoolean(useSearchForm) && !useSearchForm) paddingHeight = 0;
+			const headerCellHeight = tableEl.querySelector(".ant-table-title")?.offsetHeight ?? 0;
+			bottomIncludeBody = wrapHeight - formHeight - headerCellHeight - tablePadding - paginationMargin;
+		} else bottomIncludeBody = getViewportOffset(headEl).bottomIncludeBody;
+		let height = bottomIncludeBody - (resizeHeightOffset || 0) - paddingHeight - paginationHeight - footerHeight - headerHeight;
+		height = (height > maxHeight ? maxHeight : height) ?? height;
+		setHeight(height);
+		if (pagination && !isBoolean(pagination)) {
+			const body = tableEl.querySelector(".ant-table-body");
+			if (body) body.style.height = `${height}px`;
+		}
+	}
+	useEventListener(window, "resize", useDebounceFn(calcTableHeight, 280));
+	function mountCalcHeight() {
+		calcTableHeight();
+		nextTick(() => {
+			debounceRedoHeight();
+		});
+	}
+	onMounted(mountCalcHeight);
+	onActivated(mountCalcHeight);
+	const getScrollX = computed(() => {
+		let width = 0;
+		if (unref(rowSelectionRef)) width += 60;
+		const NORMAL_WIDTH = 150;
+		const columns = unref(columnsRef).filter((item) => !item.defaultHidden);
+		columns.forEach((item) => {
+			width += Number.parseFloat(String(item.width)) || 0;
+		});
+		const len = columns.filter((item) => !Reflect.has(item, "width")).length;
+		if (len !== 0) width += len * NORMAL_WIDTH;
+		return (unref(tableElRef)?.$el?.offsetWidth ?? 0) > width ? void 0 : width;
+	});
+	return {
+		getScrollRef: computed(() => {
+			const tableHeight = unref(tableHeightRef);
+			const { canResize, scroll } = unref(propsRef);
+			return {
+				x: unref(getScrollX),
+				y: canResize ? tableHeight : null,
+				scrollToFirstRowOnChange: false,
+				...scroll
+			};
+		}),
+		redoHeight
+	};
+}
+//#endregion
+export { useTableScroll };

package/es/components/v-ben-table/src/props.d.ts

@@ -38,6 +38,11 @@ export declare const basicProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    /** 是否开启列宽拖拽（ant-design-vue resizable） */
+    resizable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     api: {
         type: PropType<(...arg: unknown[]) => Promise<unknown>>;
         default: null;
@@ -166,7 +171,7 @@ export declare const basicProps: {
      * 拖拽完成自动请求的api
      */
     rowDragApi: {
-        type: FunctionConstructor;
+        type: PropType<Fn>;
         default: null;
     };
     /**
@@ -184,3 +189,5 @@ export declare const basicProps: {
         default: boolean;
     };
 };
+/** BasicTable 自有配置，不传给 ant-design-vue Table */
+export declare const basicTableInternalPropKeys: readonly ["clickToRowSelect", "isTreeTable", "tableSetting", "inset", "showTableSetting", "autoCreateKey", "striped", "showSummary", "summaryFunc", "summaryData", "indentSize", "canColDrag", "resizable", "api", "beforeFetch", "afterFetch", "handleSearchInfoFn", "immediate", "emptyDataIsShowTable", "searchInfo", "defSort", "useSearchForm", "showIndexColumn", "indexColumnProps", "actionColumn", "ellipsis", "isCanResizeParent", "canResize", "clearSelectOnPageChange", "resizeHeightOffset", "titleHelpMessage", "beforeEditSubmit", "rowDraggable", "supportSameLevel", "rowDragApi", "emptyFull", "expandedRowKeys"];

package/es/components/v-ben-table/src/props.mjs

@@ -36,6 +36,11 @@ var basicProps = {
 		type: Boolean,
 		default: true
 	},
+	/** 是否开启列宽拖拽（ant-design-vue resizable） */
+	resizable: {
+		type: Boolean,
+		default: true
+	},
 	api: {
 		type: Function,
 		default: null
@@ -168,5 +173,45 @@ var basicProps = {
 		default: false
 	}
 };
+/** BasicTable 自有配置，不传给 ant-design-vue Table */
+var basicTableInternalPropKeys = [
+	"clickToRowSelect",
+	"isTreeTable",
+	"tableSetting",
+	"inset",
+	"showTableSetting",
+	"autoCreateKey",
+	"striped",
+	"showSummary",
+	"summaryFunc",
+	"summaryData",
+	"indentSize",
+	"canColDrag",
+	"resizable",
+	"api",
+	"beforeFetch",
+	"afterFetch",
+	"handleSearchInfoFn",
+	"immediate",
+	"emptyDataIsShowTable",
+	"searchInfo",
+	"defSort",
+	"useSearchForm",
+	"showIndexColumn",
+	"indexColumnProps",
+	"actionColumn",
+	"ellipsis",
+	"isCanResizeParent",
+	"canResize",
+	"clearSelectOnPageChange",
+	"resizeHeightOffset",
+	"titleHelpMessage",
+	"beforeEditSubmit",
+	"rowDraggable",
+	"supportSameLevel",
+	"rowDragApi",
+	"emptyFull",
+	"expandedRowKeys"
+];
 //#endregion
-export { basicProps };
+export { basicProps, basicTableInternalPropKeys };

package/es/components/v-ben-table/src/types/pagination.d.ts

@@ -66,7 +66,7 @@ export interface PaginationProps {
      * to display the total number and range
      * @type Function
      */
-    showTotal?: (total: number, range: [number, number]) => IObject;
+    showTotal?: (total: number, range?: [number, number]) => string;
     /**
      * specify the size of Pagination, can be set to small
      * @default ''

package/es/components/v-ben-table/src/types/table.d.ts

@@ -40,6 +40,12 @@ export interface TableCustomRecord<T = Recordable> {
     record?: T;
     index?: number;
 }
+export interface RowDragEndPayload {
+    dragEndList: Recordable[];
+    expandKeysList: string[];
+    dragItemKey?: string;
+    showMessage?: boolean;
+}
 export interface SorterResult {
     column: ColumnProps;
     order: SortOrder;
@@ -120,6 +126,7 @@ export interface BasicTableProps<T = unknown> {
     summaryData?: Recordable[];
     showSummary?: boolean;
     canColDrag?: boolean;
+    resizable?: boolean;
     api?: (...arg: unknown[]) => Promise<IObject>;
     beforeFetch?: Fn;
     afterFetch?: Fn;
@@ -291,6 +298,12 @@ export interface BasicTableProps<T = unknown> {
         key: string | number;
         value: unknown;
     }) => Promise<IObject>;
+    /** 行拖拽 */
+    rowDraggable?: boolean;
+    /** 仅支持同层级拖拽 */
+    supportSameLevel?: boolean;
+    /** 拖拽完成自动请求的 api */
+    rowDragApi?: Fn | null;
     /**
      * Callback executed when pagination, filters or sorter is changed
      * @param pagination
@@ -317,6 +330,9 @@ export type CellFormat = string | ((text: string, record: Recordable, index: num
 export interface BasicColumn extends ColumnProps<Recordable> {
     children?: BasicColumn[];
     filters?: ColumnFilterItem[];
+    resizable?: boolean;
+    minWidth?: number;
+    maxWidth?: number;
     flag?: 'INDEX' | 'DEFAULT' | 'CHECKBOX' | 'RADIO' | 'ACTION';
     customTitle?: VueNode;
     slots?: Recordable;

package/es/components/v-ben-table/src/utils/dom-utils.d.ts

@@ -0,0 +1,13 @@
+export interface IViewportOffsetResult {
+    left: number;
+    top: number;
+    right: number;
+    bottom: number;
+    rightIncludeBody: number;
+    bottomIncludeBody: number;
+}
+export declare function getBoundingClientRect(element: Element): DOMRect | number;
+/**
+ * 获取元素相对视口的偏移，用于计算表格可用高度
+ */
+export declare function getViewportOffset(element: Element): IViewportOffsetResult;

package/es/components/v-ben-table/src/utils/dom-utils.mjs

@@ -0,0 +1,36 @@
+//#region src/components/v-ben-table/src/utils/dom-utils.ts
+function getBoundingClientRect(element) {
+	if (!element || !element.getBoundingClientRect) return 0;
+	return element.getBoundingClientRect();
+}
+/**
+* 获取元素相对视口的偏移，用于计算表格可用高度
+*/
+function getViewportOffset(element) {
+	const doc = document.documentElement;
+	const docScrollLeft = doc.scrollLeft;
+	const docScrollTop = doc.scrollTop;
+	const docClientLeft = doc.clientLeft;
+	const docClientTop = doc.clientTop;
+	const pageXOffset = window.pageXOffset;
+	const pageYOffset = window.pageYOffset;
+	const { left: retLeft, top: rectTop, width: rectWidth, height: rectHeight } = getBoundingClientRect(element);
+	const scrollLeft = (pageXOffset || docScrollLeft) - (docClientLeft || 0);
+	const scrollTop = (pageYOffset || docScrollTop) - (docClientTop || 0);
+	const offsetLeft = retLeft + pageXOffset;
+	const offsetTop = rectTop + pageYOffset;
+	const left = offsetLeft - scrollLeft;
+	const top = offsetTop - scrollTop;
+	const clientWidth = window.document.documentElement.clientWidth;
+	const clientHeight = window.document.documentElement.clientHeight;
+	return {
+		left,
+		top,
+		right: clientWidth - rectWidth - left,
+		bottom: clientHeight - rectHeight - top,
+		rightIncludeBody: clientWidth - left,
+		bottomIncludeBody: clientHeight - top
+	};
+}
+//#endregion
+export { getViewportOffset };