perf: 用户部门树超出高度后添加滚动条

This commit is contained in:
xingyu 2023-01-19 13:36:21 +08:00
parent 372de7a4d5
commit fbb154f93d
2 changed files with 16 additions and 13 deletions

View File

@ -51,6 +51,7 @@ declare module '@vue/runtime-core' {
ElRadioButton: typeof import('element-plus/es')['ElRadioButton'] ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup'] ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow'] ElRow: typeof import('element-plus/es')['ElRow']
ElScroll: typeof import('element-plus/es')['ElScroll']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar'] ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElSelect: typeof import('element-plus/es')['ElSelect'] ElSelect: typeof import('element-plus/es')['ElSelect']
ElSkeleton: typeof import('element-plus/es')['ElSkeleton'] ElSkeleton: typeof import('element-plus/es')['ElSkeleton']

View File

@ -8,6 +8,7 @@
</div> </div>
</template> </template>
<el-input v-model="filterText" placeholder="搜索部门" /> <el-input v-model="filterText" placeholder="搜索部门" />
<el-scrollbar height="650">
<el-tree <el-tree
ref="treeRef" ref="treeRef"
node-key="id" node-key="id"
@ -19,6 +20,7 @@
:expand-on-click-node="false" :expand-on-click-node="false"
@node-click="handleDeptNodeClick" @node-click="handleDeptNodeClick"
/> />
</el-scrollbar>
</el-card> </el-card>
<el-card class="w-4/5 user" style="margin-left: 10px" :gutter="12" shadow="hover"> <el-card class="w-4/5 user" style="margin-left: 10px" :gutter="12" shadow="hover">
<template #header> <template #header>
@ -534,8 +536,8 @@ onMounted(async () => {
<style scoped> <style scoped>
.user { .user {
height: 900px; height: 780px;
max-height: 960px; max-height: 800px;
} }
.card-header { .card-header {
display: flex; display: flex;