fix: 预付结算单与结算调整单分页固定底部,搜索label不再换行
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user