添加列表刷新组件

cool/hooks/index.ts

@@ -1,5 +1,6 @@
 export * from "./refs";
 export * from "./page";
+export * from "./pager";
 export * from "./long-press";
 export * from "./cache";
 export * from "./parent";

cool/hooks/pager.ts

@@ -0,0 +1,94 @@
+import { ref } from "vue";
+import { assign, parse } from "../utils";
+import type { Response } from "../service";
+
+type Pagination = {
+	page: number;
+	size: number;
+	total: number;
+};
+
+type PagerResponse = {
+	list: UTSJSONObject[];
+	pagination: Pagination;
+};
+
+type PagerCallback = (params: UTSJSONObject) => Promise<UTSJSONObject>;
+
+export class Pager {
+	public page = 1;
+	public size = 20;
+	public total = 0;
+	public list = ref<UTSJSONObject[]>([]);
+	public loading = ref(false);
+	public refreshing = ref(false);
+	public finished = ref(false);
+	public params = {} as UTSJSONObject;
+	public cb: PagerCallback | null = null;
+
+	constructor(cb: PagerCallback) {
+		this.cb = cb;
+	}
+
+	done() {
+		this.loading.value = false;
+	}
+
+	clear() {
+		this.list.value = [];
+		this.finished.value = false;
+		this.refreshing.value = false;
+		this.loading.value = false;
+	}
+
+	public refresh = async (params: UTSJSONObject): Promise<UTSJSONObject> => {
+		return new Promise((resolve, reject) => {
+			assign(this.params, params);
+
+			const data = {
+				page: this.page,
+				size: this.size,
+				...this.params
+			};
+
+			this.loading.value = true;
+
+			this.cb!(data)
+				.then((res) => {
+					const { list, pagination } = parse<PagerResponse>(res)!;
+
+					this.page = pagination.page;
+					this.size = pagination.size;
+					this.total = pagination.total;
+					this.finished.value = this.list.value.length >= this.total;
+
+					if (data.page == 1) {
+						this.list.value = list;
+					} else {
+						this.list.value.push(...list);
+					}
+
+					resolve(res);
+				})
+				.catch((err) => {
+					reject(err);
+				})
+				.finally(() => {
+					this.loading.value = false;
+				});
+		});
+	};
+
+	public loadMore = () => {
+		if (this.loading.value || this.finished.value) {
+			return;
+		}
+
+		this.page += 1;
+		this.refresh({});
+	};
+}
+
+export function usePager(cb: PagerCallback) {
+	return new Pager(cb);
+}