修改分页定义

This commit is contained in:
2024-11-01 09:10:37 +08:00
parent b207bc0e68
commit 998b30d153
5 changed files with 37 additions and 9 deletions

View File

@@ -23,8 +23,14 @@ interface Pageable {
total: number;
}
interface ResPageable {
current: number;
size: number;
total: number;
}
interface PaginationProps {
pageable: Pageable;
pageable: ResPageable;
handleSizeChange: (size: number) => void;
handleCurrentChange: (currentPage: number) => void;
}

View File

@@ -94,7 +94,7 @@
<slot name='pagination'>
<Pagination
v-if='pagination'
:pageable='pageable'
:pageable='resPageable'
:handle-size-change='handleSizeChange'
:handle-current-change='handleCurrentChange'
/>
@@ -173,6 +173,7 @@ const { selectionChange, selectedList, selectedListIds, isSelected } = useSelect
const {
tableData,
pageable,
resPageable,
searchParam,
searchInitParam,
getTableList,
@@ -190,7 +191,7 @@ const clearSelection = () => tableRef.value!.clearSelection()
onMounted(() => {
dragSort()
props.requestAuto && getTableList()
props.data && (pageable.value.total = props.data.length)
props.data && (resPageable.value.total = props.data.length)
})
// 处理表格数据
@@ -198,8 +199,8 @@ const processTableData = computed(() => {
if (!props.data) return tableData.value
if (!props.pagination) return props.data
return props.data.slice(
(pageable.value.pageNum - 1) * pageable.value.pageSize,
pageable.value.pageSize * pageable.value.pageNum,
(resPageable.value.current - 1) * resPageable.value.size,
resPageable.value.size * resPageable.value.current,
)
})

View File

@@ -4,9 +4,17 @@ export namespace Table {
pageSize: number;
total: number;
}
export interface ResPageable {
current: number;
size: number;
total: number;
}
export interface StateProps {
tableData: any[];
pageable: Pageable;
resPageable: ResPageable;
searchParam: {
[key: string]: any;
};

View File

@@ -20,6 +20,15 @@ export const useTable = (
tableData: [],
// 分页数据
pageable: {
// 当前页数
pageNum: 1,
// 每页显示条数
pageSize: 10,
// 总条数
total: 0,
},
// 响应分页
resPageable: {
// 当前页数
current: 1,
// 每页显示条数
@@ -71,9 +80,9 @@ export const useTable = (
state.tableData = isPageable ? data.records : data;
// 解构后台返回的分页数据 (如果有分页更新分页信息)
if (isPageable) {
state.pageable.total = data.total;
state.pageable.current = data.current;
state.pageable.size = data.size;
state.resPageable.total = data.total;
state.resPageable.current = data.current;
state.resPageable.size = data.size;
}
} catch (error) {
requestError && requestError(error);

View File

@@ -2,7 +2,11 @@
<el-dialog class='table-box' v-model='dialogVisible1' top='114px'
:style="{ height: height, maxHeight: height, overflow: 'hidden' }" :title='title1' :width='width' :modal='false'>
<div class="table-box">
<ProTable :columns="columns" :data="data">
<ProTable
ref='proTable'
:columns="columns"
:data="data"
>
<template #tableHeader="scope">
<el-button type="primary" :icon="CirclePlus" @click="openDrawer('新增')">新增</el-button>
<el-button type="primary" :icon="Upload" plain @click="batchAdd">批量添加</el-button>