fix: 参数配置表格添加分页器
This commit is contained in:
@@ -274,6 +274,31 @@ function listEditOk() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**表格分页器参数 */
|
||||||
|
let tablePagination = reactive({
|
||||||
|
/**当前页数 */
|
||||||
|
current: 1,
|
||||||
|
/**每页条数 */
|
||||||
|
pageSize: 20,
|
||||||
|
/**默认的每页条数 */
|
||||||
|
defaultPageSize: 20,
|
||||||
|
/**指定每页可以显示多少条 */
|
||||||
|
pageSizeOptions: ['10', '20', '50', '100'],
|
||||||
|
/**只有一页时是否隐藏分页器 */
|
||||||
|
hideOnSinglePage: true,
|
||||||
|
/**是否可以快速跳转至某页 */
|
||||||
|
showQuickJumper: true,
|
||||||
|
/**是否可以改变 pageSize */
|
||||||
|
showSizeChanger: true,
|
||||||
|
/**数据总数 */
|
||||||
|
total: 0,
|
||||||
|
showTotal: (total: number) => t('common.tablePaginationTotal', { total }),
|
||||||
|
onChange: (page: number, pageSize: number) => {
|
||||||
|
tablePagination.current = page;
|
||||||
|
tablePagination.pageSize = pageSize;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
/**多列列表状态类型 */
|
/**多列列表状态类型 */
|
||||||
type ArrayStateType = {
|
type ArrayStateType = {
|
||||||
/**紧凑型 */
|
/**紧凑型 */
|
||||||
@@ -1200,7 +1225,7 @@ onMounted(() => {
|
|||||||
<a-card
|
<a-card
|
||||||
size="small"
|
size="small"
|
||||||
:bordered="false"
|
:bordered="false"
|
||||||
:body-style="{ maxHeight: '650px', 'overflow-y': 'scroll' }"
|
:body-style="{ maxHeight: '650px', 'overflow-y': 'auto' }"
|
||||||
:loading="treeState.selectLoading"
|
:loading="treeState.selectLoading"
|
||||||
>
|
>
|
||||||
<template #title>
|
<template #title>
|
||||||
@@ -1235,9 +1260,9 @@ onMounted(() => {
|
|||||||
:size="listState.size"
|
:size="listState.size"
|
||||||
:columns="listState.columns"
|
:columns="listState.columns"
|
||||||
:data-source="listState.data"
|
:data-source="listState.data"
|
||||||
:pagination="false"
|
:pagination="tablePagination"
|
||||||
:bordered="true"
|
:bordered="true"
|
||||||
:scroll="{ x: true }"
|
:scroll="{ x: true, y: '500px' }"
|
||||||
>
|
>
|
||||||
<template #bodyCell="{ column, text, record }">
|
<template #bodyCell="{ column, text, record }">
|
||||||
<template v-if="column.dataIndex === 'value'">
|
<template v-if="column.dataIndex === 'value'">
|
||||||
@@ -1341,9 +1366,9 @@ onMounted(() => {
|
|||||||
:columns="treeState.selectNode.method === 'get' ? arrayState.columnsDnd.filter((s:any)=>s.key !== 'index') : arrayState.columnsDnd"
|
:columns="treeState.selectNode.method === 'get' ? arrayState.columnsDnd.filter((s:any)=>s.key !== 'index') : arrayState.columnsDnd"
|
||||||
:data-source="arrayState.columnsData"
|
:data-source="arrayState.columnsData"
|
||||||
:size="arrayState.size"
|
:size="arrayState.size"
|
||||||
:pagination="false"
|
:pagination="tablePagination"
|
||||||
:bordered="true"
|
:bordered="true"
|
||||||
:scroll="{ x: arrayState.columnsDnd.length * 200, y: 450 }"
|
:scroll="{ x: arrayState.columnsDnd.length * 200, y: 480 }"
|
||||||
@resizeColumn="(w:number, col:any) => (col.width = w)"
|
@resizeColumn="(w:number, col:any) => (col.width = w)"
|
||||||
:show-expand-column="false"
|
:show-expand-column="false"
|
||||||
v-model:expanded-row-keys="arrayState.arrayChildExpandKeys"
|
v-model:expanded-row-keys="arrayState.arrayChildExpandKeys"
|
||||||
@@ -1432,11 +1457,11 @@ onMounted(() => {
|
|||||||
:columns="arrayChildState.columnsDnd"
|
:columns="arrayChildState.columnsDnd"
|
||||||
:data-source="arrayChildState.columnsData"
|
:data-source="arrayChildState.columnsData"
|
||||||
:size="arrayChildState.size"
|
:size="arrayChildState.size"
|
||||||
:pagination="false"
|
:pagination="tablePagination"
|
||||||
:bordered="true"
|
:bordered="true"
|
||||||
:scroll="{
|
:scroll="{
|
||||||
x: arrayChildState.columnsDnd.length * 200,
|
x: arrayChildState.columnsDnd.length * 200,
|
||||||
y: 450,
|
y: 200,
|
||||||
}"
|
}"
|
||||||
@resizeColumn="(w:number, col:any) => (col.width = w)"
|
@resizeColumn="(w:number, col:any) => (col.width = w)"
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in New Issue
Block a user