fix: 预付结算单与结算调整单分页固定底部,搜索label不再换行

This commit is contained in:
刘泉佳
2026-11-05 15:01:28 +08:00
parent 8057e860de
commit 2fd927a90c
3 changed files with 62 additions and 2 deletions
+1 -1
View File
@@ -118,7 +118,7 @@ export const formalSettlementOption = (settlementType = '') => ({
emptyBtnText: '重置',
searchShow: true,
searchIcon: true,
searchLabelWidth: 88,
searchLabelWidth: 100,
// 查询/重置紧跟首行 4 个条件(4×5 + 菜单 4 = 24),不再独占下一整行
searchMenuSpan: 4,
searchIndex: 4,
+31 -1
View File
@@ -1,7 +1,7 @@
<template>
<basic-container class="pre-settlement-page">
<section v-show="searchVisible" class="pre-settlement-page__search">
<el-form :model="query" label-position="right" label-width="88px" @submit.prevent>
<el-form :model="query" label-position="right" label-width="100px" @submit.prevent>
<div class="pre-settlement-page__search-grid">
<template v-for="field in visibleSearchFields" :key="field.prop">
<el-form-item :label="field.label">
@@ -108,6 +108,7 @@
:data="rows"
:size="tableSize"
border
height="100%"
class="pre-settlement-page__table"
@selection-change="handleSelectionChange"
>
@@ -768,8 +769,27 @@ export default {
</script>
<style lang="scss" scoped>
// 页面固定在视口内:搜索区/工具栏/分页固定,仅表格内部滚动(与付款结算单 avue 高度自适应对齐)
// 100vh - 50(top) - 40(tags) - 24(avue-view padding)
$pre_page_height: calc(100vh - 114px);
.pre-settlement-page {
height: $pre_page_height;
:deep(.basic-container__card) {
height: 100%;
overflow: hidden;
}
:deep(.el-card__body) {
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
}
&__search {
flex-shrink: 0;
padding: 12px 12px 4px;
background: #fff;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
@@ -801,6 +821,10 @@ export default {
}
&__table-panel {
display: flex;
flex: 1;
flex-direction: column;
min-height: 0;
margin-top: 8px;
}
@@ -823,8 +847,14 @@ export default {
justify-content: center;
}
&__table {
flex: 1;
min-height: 0;
}
&__pagination {
display: flex;
flex-shrink: 0;
justify-content: flex-end;
padding: 12px;
}
@@ -69,6 +69,8 @@
:data="rows"
:size="tableSize"
border
height="100%"
class="settlement-adjustment-page__table"
@selection-change="selection = $event"
>
<el-table-column type="selection" width="52" fixed="left" align="center" /><el-table-column
@@ -389,8 +391,27 @@ export default {
</script>
<style scoped lang="scss">
// 页面固定在视口内:搜索区/工具栏/分页固定,仅表格内部滚动(与付款结算单对齐)
// 100vh - 50(top) - 40(tags) - 24(avue-view padding)
$adjustment_page_height: calc(100vh - 114px);
.settlement-adjustment-page {
height: $adjustment_page_height;
:deep(.basic-container__card) {
height: 100%;
overflow: hidden;
}
:deep(.el-card__body) {
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
}
&__search {
flex-shrink: 0;
padding: 12px 12px 4px;
background: #fff;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
@@ -417,6 +438,10 @@ export default {
margin-bottom: 8px;
}
&__table-panel {
display: flex;
flex: 1;
flex-direction: column;
min-height: 0;
margin-top: 8px;
}
&__toolbar {
@@ -431,8 +456,13 @@ export default {
justify-content: center;
gap: 8px;
}
&__table {
flex: 1;
min-height: 0;
}
&__pagination {
display: flex;
flex-shrink: 0;
justify-content: flex-end;
padding: 12px;
}