fix(ui): 统一 payment 和 settlement 模块浮动底栏为 fixed 定位

- payment 模块所有表单页底栏按钮顺序及布局全量对齐,取消居中改为右对齐浮动
- settlement 模块弹窗及独立页 footer 添加 sticky 浮动,主操作按钮样式调整为 plain
- 彻底修复浮动底栏不吸底问题,所有相关 footer 由 position: sticky 改为 position: fixed
- 统一 fixed 底栏样式模板,包含左偏移支持侧栏折叠和横向布局切换
- 更新项目文档,明确浮动底栏必须用 fixed 定位,避免 overflow:hidden 祖先导致 sticky 失效
- 清理所有残留 sticky 样式,确保底栏始终固定在视口底部,提升用户体验
This commit is contained in:
2026-08-26 18:49:13 +08:00
parent 84c46b9312
commit 7f70052afd
12 changed files with 176 additions and 18 deletions
@@ -1549,12 +1549,21 @@ export default {
padding: 12px 24px;
border-top: 1px solid #eff1f7;
gap: 12px;
position: sticky;
position: fixed;
right: 0;
left: 230px;
bottom: 0;
z-index: 10;
margin: 0;
background: #fff;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
}
:global(.avue--collapse) .formal-editor__page-actions {
left: 60px;
}
:global(.avue-layout--horizontal) .formal-editor__page-actions {
left: 0;
}
.formal-editor__links {
display: flex;
flex-wrap: wrap;
@@ -1532,8 +1532,11 @@ export default {
padding: 12px 24px;
border-top: 1px solid #eff1f7;
gap: 12px;
position: sticky;
position: fixed;
right: 0;
left: 230px;
bottom: 0;
margin: 0;
z-index: 10;
background: #fff;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
@@ -1651,4 +1654,10 @@ export default {
:deep(.pre-settlement-candidate-dialog .el-table__body tr:nth-child(even) > td.el-table__cell) {
background: #fafafa;
}
:global(.avue--collapse .pre-settlement-editor__page-actions) {
left: 60px;
}
:global(.avue-layout--horizontal .pre-settlement-editor__page-actions) {
left: 0;
}
</style>