修改分页定义
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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,
|
||||
)
|
||||
})
|
||||
|
||||
|
||||
@@ -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;
|
||||
};
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user