通用三页表格防坍塌

Co-authored-by: multica-agent <github@multica.ai>
This commit is contained in:
2026-05-03 23:00:51 +08:00
parent 0f694e8463
commit 345860af14
5 changed files with 132 additions and 7 deletions
+26
View File
@@ -539,3 +539,29 @@
- 风险与影响:
- 影响范围限定在 `/admin/users``/admin/roles` 页面样式行为,不涉及接口、权限与数据写入链路。
- 样式作用域使用页面专用 class,避免影响其他 AntD 表格。
## Work Log - 系统参数/系统日志/文件管理页表格防坍塌(2026-05-03)
- 背景:
- 在菜单、用户、角色页完成“筛选数据较少时表格高度不坍塌”后,新增需求要求将该体验同步到系统参数、系统日志、文件管理页面。
- 本次改动(最小闭环):
- 文件:`web/src/app/admin/system-params/page.tsx`
- 表格外层新增 `admin-system-params-table-anchor`,注入动态 `min-height` 变量。
- 分页补齐 `style: { marginBottom: 0 }`,收敛底部留白。
- 文件:`web/src/app/admin/syslog/page.tsx`
- 表格外层新增 `admin-syslog-table-anchor`,注入动态 `min-height` 变量。
- 文件:`web/src/app/admin/files/page.tsx`
- 新增与其他管理页一致的动态表格高度计算(`tableScrollY` + `ResizeObserver` + `resize` 监听)。
- 表格滚动从 `scroll={{ x: 1100 }}` 调整为 `scroll={{ x: 1100, y: tableScrollY }}`
- 表格外层新增 `admin-files-table-anchor`,注入动态 `min-height` 变量。
- 文件:`web/src/app/globals.css`
- 新增三个局部样式:
- `.admin-system-params-table-anchor .ant-table-body`
- `.admin-syslog-table-anchor .ant-table-body`
- `.admin-files-table-anchor .ant-table-body`
- 三者均使用页面注入变量作为 `min-height`,保证少量数据时表格不坍塌。
- 风险与影响:
- 影响范围限定在上述三页的前端展示层,不涉及接口契约和后端逻辑。
- 样式均使用页面专用作用域,避免对其他页面表格产生副作用。