更新 @riwa/api-types 依赖至 0.0.23,调整分页接口参数,优化表格组件的类型定义
This commit is contained in:
@@ -5,19 +5,23 @@ import type { InternalRowData } from 'naive-ui/es/data-table/src/interface';
|
||||
import type { safeClient } from '@/service/api';
|
||||
import type TableBase from './table-base.vue';
|
||||
|
||||
type TableBaseColumn<T = InternalRowData> = DataTableColumn<T> & {
|
||||
export type TableBaseExpandColumn<T = InternalRowData> = {
|
||||
operations?: (row: T) => Array<Partial<ButtonProps> & { contentText: string }>;
|
||||
key: string;
|
||||
title: string;
|
||||
};
|
||||
|
||||
type TableBaseColumn<T = InternalRowData> = DataTableColumn<T> & TableBaseExpandColumn<T>;
|
||||
|
||||
export type TableBaseColumns<T = InternalRowData> = Array<TableBaseColumn<T>>;
|
||||
|
||||
export type TableInst = InstanceType<typeof TableBase>;
|
||||
|
||||
export interface Pagination {
|
||||
limit: number;
|
||||
offset: number;
|
||||
pageIndex: number;
|
||||
pageSize: number;
|
||||
total?: number;
|
||||
[key: string]: any;
|
||||
}
|
||||
|
||||
export type TableFetchData = (page: Pagination) => ReturnType<typeof safeClient>;
|
||||
|
||||
@@ -29,8 +29,8 @@ async function loadData() {
|
||||
const page = pagination.value.page || 1;
|
||||
const pageSize = pagination.value.pageSize || 10;
|
||||
const { data } = await props.fetchData({
|
||||
limit: pageSize,
|
||||
offset: (page - 1) * pageSize
|
||||
pageIndex: page,
|
||||
pageSize
|
||||
});
|
||||
|
||||
tableData.value = (data.value as any).data;
|
||||
@@ -41,6 +41,10 @@ function handlePageChange(curPage: number) {
|
||||
pagination.value.page = curPage;
|
||||
loadData();
|
||||
}
|
||||
function handlePageSizeChange(curPageSize: number) {
|
||||
pagination.value.pageSize = curPageSize;
|
||||
loadData();
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadData();
|
||||
@@ -66,6 +70,7 @@ defineExpose({
|
||||
:pagination="pagination"
|
||||
:bordered="false"
|
||||
:on-update:page="handlePageChange"
|
||||
:on-update:page-size="handlePageSizeChange"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user