fix(menu): fix button permission card height with flex layout

- Outer div: flex column, fills tab-pane height
- .menu-scan-btn: fixed height ~44px
- MenuButtonCom with .menu-btn-fill: flex:1 fills remaining space
- MenuButtonCom inner: height:100% instead of 72vh
- Fixes pagination/selected-count being covered by overflow
- Also i18n "自动扫描" button text with scan.title key

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
H0nGzA1
2026-04-09 20:56:32 +08:00
committed by Lewis_yan
co-authored by Claude Opus 4.6
parent 03df05633c
commit a092dce896
2 changed files with 16 additions and 5 deletions
@@ -1,5 +1,5 @@
<template>
<div style="height: 72vh">
<div style="height: 100%">
<fs-crud ref="crudRef" v-bind="crudBinding">
<template #pagination-left>
<el-tooltip :content="t('message.pages.menu.buttons.batchDelete')">
+15 -4
View File
@@ -15,15 +15,15 @@
<el-col :span="18">
<el-tabs type="border-card">
<el-tab-pane label="按钮权限配置" >
<div style="height: 72vh">
<el-tab-pane :label="$t('message.pages.menu.dialog.buttonPermission')" >
<div class="menu-btn-pane">
<div class="menu-scan-btn">
<el-button type="primary" @click="handleOpenScanModal">
<el-icon><Monitor /></el-icon>
自动扫描
{{ $t('message.pages.menu.scan.title') }}
</el-button>
</div>
<MenuButtonCom ref="menuButtonRef" />
<MenuButtonCom ref="menuButtonRef" class="menu-btn-fill" />
</div>
</el-tab-pane>
<el-tab-pane label="列权限配置">
@@ -192,4 +192,15 @@ onMounted(() => {
justify-content: flex-end;
margin-bottom: 8px;
}
.menu-btn-pane {
display: flex;
flex-direction: column;
height: 100%;
.menu-btn-fill {
flex: 1;
overflow: hidden;
}
}
</style>