feat(web-admin): add list table viewport height formula

Pure calc keeps pagination visible with a 10px bottom gap for main list scroll UX.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
zlwuandCursor committed 2026-09-01 18:45:15 +08:00
1 parent 0e8f244bc3
commit 7d78f76129
2 files changed
+87

No files matched your search

@@ -0,0 +1,55 @@
import assert from 'node:assert/strict'
import {
LIST_TABLE_VIEWPORT_BOTTOM_GAP,
LIST_TABLE_VIEWPORT_MIN_HEIGHT,
calcListTableViewportHeight
} from '../src/composables/listTableViewportHeight'
assert.equal(LIST_TABLE_VIEWPORT_BOTTOM_GAP, 10)
assert.equal(LIST_TABLE_VIEWPORT_MIN_HEIGHT, 240)
// contentBottom=1000, tableTop=200, pager=48 → 1000-200-48-10 = 742
assert.equal(
calcListTableViewportHeight({
contentViewportBottom: 1000,
tableTop: 200,
pagerHeight: 48
}),
742
)
// 无分页
assert.equal(
calcListTableViewportHeight({
contentViewportBottom: 800,
tableTop: 100,
pagerHeight: 0
}),
690
)
// 过矮时夹到 minHeight
assert.equal(
calcListTableViewportHeight({
contentViewportBottom: 400,
tableTop: 300,
pagerHeight: 48,
minHeight: 240,
bottomGap: 10
}),
240
)
// 自定义 min / gap
assert.equal(
calcListTableViewportHeight({
contentViewportBottom: 1000,
tableTop: 100,
pagerHeight: 40,
minHeight: 100,
bottomGap: 16
}),
844
)
console.log('check-list-table-viewport-height: ok')