mirror of
https://github.com/huge-dream/django-vue3-admin.git
synced 2026-10-17 06:55:31 +00:00
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:
committed by
Lewis_yan
co-authored by
Claude Opus 4.6
parent
03df05633c
commit
a092dce896
@@ -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,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>
|
||||
|
||||
Reference in New Issue
Block a user