@byan99/vue-base-table 0.2.0 → 0.3.0

package/dist/index.css

@@ -1,2 +1,2 @@
-.base-table[data-v-7d862b68]{width:100%}
+.base-table[data-v-e3b643d1]{width:100%}
 /*$vite$:1*/

package/dist/index.js

@@ -14,38 +14,57 @@ var p = /*#__PURE__*/ ((e, t) => {
 		loading: { type: Boolean },
 		emptyText: {},
 		stripe: { type: Boolean },
-		bordered: { type: Boolean }
+		bordered: { type: Boolean },
+		defaultSort: {}
 	},
-	setup(i) {
-		function p(e, t) {
+	emits: ["sortChange"],
+	setup(i, { emit: p }) {
+		let m = p;
+		function h(e, t) {
 			let n = e[t];
 			return n == null ? "" : String(n);
 		}
-		return (m, h) => (a(), t(l(d), {
+		function g(e) {
+			m("sortChange", {
+				prop: e.prop,
+				order: e.order
+			});
+		}
+		return (p, m) => (a(), t(l(d), {
 			class: "base-table",
 			data: i.data,
 			stripe: i.stripe,
 			border: i.bordered,
 			loading: i.loading,
-			"empty-text": i.emptyText ?? "暂无数据"
+			"empty-text": i.emptyText ?? "暂无数据",
+			"default-sort": i.defaultSort,
+			onSortChange: g
 		}, {
 			default: u(() => [(a(!0), n(e, null, o(i.columns, (e) => (a(), t(l(f), {
 				key: e.key,
 				prop: e.key,
 				label: e.label,
 				width: e.width,
-				align: e.align ?? "left"
+				align: e.align ?? "left",
+				sortable: e.sortable,
+				"sort-method": e.sortMethod,
+				"sort-by": e.sortBy,
+				"sort-orders": e.sortOrders
 			}, {
-				default: u(({ row: t }) => [s(m.$slots, e.key, {
+				default: u(({ row: t }) => [s(p.$slots, e.key, {
 					row: t,
 					value: t[e.key]
-				}, () => [r(c(p(t, e.key)), 1)], !0)]),
+				}, () => [r(c(h(t, e.key)), 1)], !0)]),
 				_: 2
 			}, 1032, [
 				"prop",
 				"label",
 				"width",
-				"align"
+				"align",
+				"sortable",
+				"sort-method",
+				"sort-by",
+				"sort-orders"
 			]))), 128))]),
 			_: 3
 		}, 8, [
@@ -53,9 +72,10 @@ var p = /*#__PURE__*/ ((e, t) => {
 			"stripe",
 			"border",
 			"loading",
-			"empty-text"
+			"empty-text",
+			"default-sort"
 		]));
 	}
-}), [["__scopeId", "data-v-7d862b68"]]);
+}), [["__scopeId", "data-v-e3b643d1"]]);
 //#endregion
 export { p as BaseTable };

package/dist/src/components/Table/BaseTable.vue.d.ts

@@ -1,20 +1,23 @@
-import { TableColumn } from './types';
+import { TableColumn, TableDefaultSort, TableSortChangePayload } from './types';
 declare const _default: <T extends object>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, never> & {
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly onSortChange?: ((payload: TableSortChangePayload) => any) | undefined;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onSortChange"> & {
         columns: TableColumn<T>[];
         data: T[];
         loading?: boolean;
         emptyText?: string;
         stripe?: boolean;
         bordered?: boolean;
+        defaultSort?: TableDefaultSort;
     } & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: Partial<Record<NonNullable<keyof T & string>, (_: {
-        row: import('element-plus/es/components/table/src/table/defaults.mjs').DefaultRow;
-        value: import('element-plus/es/components/table/src/table/defaults.mjs').DefaultRow[keyof T & string];
+        row: T;
+        value: T[keyof T & string];
     }) => any>>;
-    emit: {};
+    emit: (evt: "sortChange", payload: TableSortChangePayload) => void;
 }>) => import('vue').VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/src/components/Table/index.d.ts

@@ -1,2 +1,2 @@
 export { default as BaseTable } from './BaseTable.vue';
-export type { TableAlign, TableColumn, TableProps } from './types';
+export type { TableAlign, TableColumn, TableDefaultSort, TableProps, TableSortChangePayload, TableSortOrder, } from './types';

package/dist/src/components/Table/types.d.ts

@@ -1,9 +1,26 @@
 export type TableAlign = 'left' | 'center' | 'right';
+export type TableSortOrder = 'ascending' | 'descending';
 export interface TableColumn<T extends object = Record<string, unknown>> {
     key: keyof T & string;
     label: string;
     width?: string;
     align?: TableAlign;
+    /** 是否可排序；`custom` 表示远程排序，需监听 sort-change */
+    sortable?: boolean | 'custom';
+    /** 本地排序比较函数，sortable 为 true 时生效 */
+    sortMethod?: (a: T, b: T) => number;
+    /** 排序字段，默认使用 key */
+    sortBy?: string | string[];
+    /** 排序策略循环顺序，默认 ['ascending', 'descending', null] */
+    sortOrders?: (TableSortOrder | null)[];
+}
+export interface TableDefaultSort {
+    prop: string;
+    order: TableSortOrder;
+}
+export interface TableSortChangePayload {
+    prop: string | null;
+    order: TableSortOrder | null;
 }
 export interface TableProps<T extends object = Record<string, unknown>> {
     columns: TableColumn<T>[];
@@ -12,4 +29,5 @@ export interface TableProps<T extends object = Record<string, unknown>> {
     emptyText?: string;
     stripe?: boolean;
     bordered?: boolean;
+    defaultSort?: TableDefaultSort;
 }

package/dist/src/index.d.ts

@@ -1,2 +1,2 @@
 export { BaseTable } from './components/Table';
-export type { TableAlign, TableColumn, TableProps } from './components/Table';
+export type { TableAlign, TableColumn, TableDefaultSort, TableProps, TableSortChangePayload, TableSortOrder, } from './components/Table';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@byan99/vue-base-table",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "A reusable Vue 3 table component based on Element Plus with TypeScript support",
   "type": "module",
   "keywords": [