GithubBackup/MyGoNavi
1
0
Fork 0
mirror of https://github.com/Syngnat/GoNavi.git synced 2026-05-31 13:39:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

✨ feat(DataGrid): 大数据表虚拟滚动性能优化及UI一致性修复

Browse Source 
- 启用动态虚拟滚动（数据量≥500行自动切换），解决万行数据表卡顿问题
- 虚拟模式下EditableCell改用div渲染，CSS选择器从元素级改为类级适配虚拟DOM
- 修复虚拟模式双水平滚动条：样式化rc-virtual-list内置滚动条为胶囊外观，禁用自定义外部滚动条
- 为rc-virtual-list水平滚动条添加鼠标滚轮支持（MutationObserver + marginLeft驱动）
- 修复白色主题透明模式下列名悬浮Tooltip对比度不足的问题
- 新增白色主题全局滚动条样式适配透明模式（App.css）
- App.tsx主题token与组件样式优化
- refs #147
This commit is contained in:
Syngnat
2026-03-03 13:49:31 +08:00
parent b904c0b107
commit e76e174bfe
5 changed files with 844 additions and 196 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
frontend/src/App.css
View File

@@ -57,6 +57,29 @@ body[data-theme='dark'] ::-webkit-scrollbar-thumb:hover {
background: #666;
}
/* Scrollbar styling for light mode (transparent-friendly) */
body[data-theme='light'] ::-webkit-scrollbar {
width: 10px;
height: 10px;
}
body[data-theme='light'] ::-webkit-scrollbar-track {
background: transparent;
}
body[data-theme='light'] ::-webkit-scrollbar-corner {
background: transparent;
}
body[data-theme='light'] ::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.18);
border-radius: 4px;
border: 2px solid transparent;
background-clip: content-box;
}
body[data-theme='light'] ::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.30);
border: 2px solid transparent;
background-clip: content-box;
}
/* Ensure body background matches theme to avoid white flashes, but kept transparent for window composition */
body {
transition: color 0.3s;
@@ -102,11 +125,13 @@ body[data-theme='dark'] .ant-switch.ant-switch-checked {
background: #d8a93b !important;
}
body[data-theme='dark'] .ant-table-tbody > tr.ant-table-row-selected > td {
body[data-theme='dark'] .ant-table-tbody > tr.ant-table-row-selected > td,
body[data-theme='dark'] .ant-table-tbody .ant-table-row.ant-table-row-selected > .ant-table-cell {
background: rgba(246, 196, 83, 0.18) !important;
}
body[data-theme='dark'] .ant-table-tbody > tr.ant-table-row-selected:hover > td {
body[data-theme='dark'] .ant-table-tbody > tr.ant-table-row-selected:hover > td,
body[data-theme='dark'] .ant-table-tbody .ant-table-row.ant-table-row-selected:hover > .ant-table-cell {
background: rgba(246, 196, 83, 0.26) !important;
}