103 lines
2.2 KiB
TypeScript
103 lines
2.2 KiB
TypeScript
|
import { getDataSet, toNumber } from "@/utils/util";
|
||
|
|
|
||
|
|
Component({
|
||
|
|
options: { multipleSlots: true },
|
||
|
|
/**
|
||
|
|
* 组件的属性列表
|
||
|
|
*/
|
||
|
|
properties: {
|
||
|
|
curr_page: {
|
||
|
|
type: Number,
|
||
|
|
value: 1,
|
||
|
|
observer() {
|
||
|
|
this.page();
|
||
|
|
},
|
||
|
|
},
|
||
|
|
total: {
|
||
|
|
type: Number,
|
||
|
|
value: 0,
|
||
|
|
observer() {
|
||
|
|
this.page();
|
||
|
|
},
|
||
|
|
},
|
||
|
|
page_count: {
|
||
|
|
type: Number,
|
||
|
|
value: 20,
|
||
|
|
observer() {
|
||
|
|
this.page();
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 组件的初始数据
|
||
|
|
*/
|
||
|
|
data: {
|
||
|
|
pages: [] as number[],
|
||
|
|
totalPage: 0,
|
||
|
|
open: false,
|
||
|
|
pickerPages: [] as any[],
|
||
|
|
},
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 组件的方法列表
|
||
|
|
*/
|
||
|
|
methods: {
|
||
|
|
page() {
|
||
|
|
const totalPage = Math.ceil(
|
||
|
|
toNumber(this.data.total) / toNumber(this.data.page_count)
|
||
|
|
);
|
||
|
|
const showPageNum = 3;
|
||
|
|
|
||
|
|
// 计算显示的页码范围
|
||
|
|
let startPage = Math.max(
|
||
|
|
1,
|
||
|
|
toNumber(this.data.curr_page) - Math.floor(showPageNum / 2)
|
||
|
|
);
|
||
|
|
let endPage = Math.min(totalPage, startPage + showPageNum - 1);
|
||
|
|
|
||
|
|
// 调整起始页码，确保显示的页码数量不超过最大值
|
||
|
|
if (endPage - startPage + 1 < showPageNum) {
|
||
|
|
startPage = Math.max(1, endPage - showPageNum + 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
// 生成页码数组
|
||
|
|
const pages = [];
|
||
|
|
for (let i = startPage; i <= endPage; i++) {
|
||
|
|
pages.push(i);
|
||
|
|
}
|
||
|
|
|
||
|
|
this.setData({ pages, totalPage });
|
||
|
|
},
|
||
|
|
pageChange(e: any) {
|
||
|
|
let curr_page = getDataSet(e).page;
|
||
|
|
// if (curr_page == this.data.curr_page) {
|
||
|
|
// return;
|
||
|
|
// }
|
||
|
|
if (curr_page == "prev") {
|
||
|
|
curr_page = this.data.curr_page - 1;
|
||
|
|
} else if (curr_page == "next") {
|
||
|
|
curr_page = this.data.curr_page + 1;
|
||
|
|
}
|
||
|
|
this.triggerEvent("change", { curr_page });
|
||
|
|
},
|
||
|
|
pageSelect() {
|
||
|
|
this.setData({
|
||
|
|
open: true,
|
||
|
|
pickerPages: Array.from({ length: this.data.totalPage }, (_, i) => ({
|
||
|
|
value: i + 1,
|
||
|
|
label: `第 ${i + 1} 页`,
|
||
|
|
})),
|
||
|
|
});
|
||
|
|
},
|
||
|
|
onConfirm(e: any) {
|
||
|
|
const curr_page = e.detail.value[0];
|
||
|
|
// if (curr_page == this.data.curr_page) {
|
||
|
|
// return;
|
||
|
|
// }
|
||
|
|
this.triggerEvent("change", { curr_page: curr_page });
|
||
|
|
},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
|