feat(components): 新增分页、选择器和标签栏组件并优化插件页面

- 添加 pagination-plugin 组件,包含完整的分页功能和页面跳转选择
- 添加 select-plugin 组件,支持单选和多选模式的选择弹窗
- 添加 tab-bar-plugin 组件,提供底部导航栏功能
- 在 page-plugin 中集成 t-loading 组件替换原有的加载逻辑
- 移除页面中的登录状态监听逻辑和相关订阅功能
- 修改页面样式传递方式,将 style 属性改为 customStyle
- 更新组件依赖配置文件,添加新的组件引用
This commit is contained in:
zhengw
2026-01-12 16:29:53 +08:00
parent f0c68126dc
commit 0d58fc80f4
15 changed files with 365 additions and 25 deletions

View File

@@ -0,0 +1,102 @@
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 });
},
},
});