Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Hooke
/
data-table
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Graphs
Network
Create a new issue
Commits
Issue Boards
Authored by
hookehuyr
2025-11-25 17:26:45 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
4b6d4c8ef062deab82436cbaaa85249d9e0f5f99
4b6d4c8e
1 parent
c571afbf
refactor(分页): 优化过滤分页逻辑并同步导航配置
过滤分页时移除空页并保持导航配置同步,确保仅对有内容的页显示导航
Show whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
34 additions
and
3 deletions
src/composables/usePagination.js
src/composables/usePagination.js
View file @
4b6d4c8
...
...
@@ -18,20 +18,26 @@ export function usePagination(formDataRef, options = {}) {
// 每一页的导航配置(由相邻的 paginator 控件决定)
const
page_nav_props_by_index
=
ref
([])
// 过滤后的分页:剔除被隐藏(disabled)的字段,但保留空页占位,确保分页总数与 paginator 一致
/**
* 过滤后的分页
* @description 剔除被隐藏(disabled)的字段,并移除过滤后为空的页,确保分页总数只计算有内容的页
*/
const
filtered_pages
=
computed
(()
=>
{
// 未构建分页时,直接按当前可见字段返回单页
if
(
!
pages_raw
.
value
.
length
)
{
const
keys
=
formDataRef
.
value
.
filter
(
i
=>
!
i
.
component_props
?.
disabled
&&
i
.
component_props
?.
tag
!==
'paginator'
)
.
map
(
i
=>
i
.
key
)
return
[
keys
]
}
// 根据原始分页分组过滤出可见字段,并移除空页
const
result
=
pages_raw
.
value
.
map
(
keys
=>
keys
.
filter
(
k
=>
{
const
f
=
formDataRef
.
value
.
find
(
i
=>
i
.
key
===
k
)
return
f
&&
!
f
.
component_props
?.
disabled
}))
// 不再删除空页,以保证总页数符合分页符定义
.
filter
(
keys
=>
keys
.
length
>
0
)
// 兜底:若全部为空,则保留一个空页以维持形态
return
result
.
length
?
result
:
[[]]
})
...
...
@@ -129,9 +135,34 @@ export function usePagination(formDataRef, options = {}) {
* @description 根据当前页索引读取对应的分页符导航文案与返回控制
* @returns {{prev_text: string, next_text: string, prev_disabled: boolean}}
*/
/**
* 过滤后的分页导航
* @description 与 filtered_pages 同步,仅为有内容的页保留对应的导航配置
*/
const
filtered_nav_props_by_index
=
computed
(()
=>
{
// 未构建分页时使用默认导航
if
(
!
pages_raw
.
value
.
length
)
{
return
[
normalizePaginatorProps
()]
}
// 与过滤页一一对应:仅保留含可见字段的页的导航
const
visible_navs
=
[]
pages_raw
.
value
.
forEach
((
keys
,
idx
)
=>
{
const
hasVisible
=
keys
.
some
(
k
=>
{
const
f
=
formDataRef
.
value
.
find
(
i
=>
i
.
key
===
k
)
return
f
&&
!
f
.
component_props
?.
disabled
})
if
(
hasVisible
)
visible_navs
.
push
(
page_nav_props_by_index
.
value
[
idx
]
||
normalizePaginatorProps
())
})
return
visible_navs
.
length
?
visible_navs
:
[
normalizePaginatorProps
()]
})
/**
* 分页导航配置(与过滤后页索引一致)
* @returns {{prev_text: string, next_text: string, prev_disabled: boolean}}
*/
const
page_nav
=
computed
(()
=>
{
const
def
=
normalizePaginatorProps
()
return
page
_nav_props_by_index
.
value
[
current_page_index
.
value
]
||
def
return
filtered
_nav_props_by_index
.
value
[
current_page_index
.
value
]
||
def
})
/**
...
...
Please
register
or
login
to post a comment