style: 调整layout布局

This commit is contained in:
张传龙 2022-04-18 22:01:30 +08:00
parent 238bceb500
commit 967ae1c483

View File

@ -1,18 +1,16 @@
<template> <template>
<div class="layout"> <n-layout has-sider style="height: 100%">
<n-layout has-sider position="absolute">
<n-layout-sider bordered :width="200" :collapsed-width="0" :native-scrollbar="false"> <n-layout-sider bordered :width="200" :collapsed-width="0" :native-scrollbar="false">
<SideBar /> <SideBar />
</n-layout-sider> </n-layout-sider>
<n-layout> <n-layout>
<n-layout-header :style="{ height: useTheme.header.height + 'px' }" style="border-left: none"> <n-layout-header :style="{ height: useTheme.header.height + 'px' }">
<AppHeader /> <AppHeader />
</n-layout-header> </n-layout-header>
<n-layout <n-layout
position="absolute"
style="background-color: #f5f6fb" style="background-color: #f5f6fb"
:style="{ top: useTheme.header.height + 'px' }" :style="`height: calc(100% - ${useTheme.header.height}px)`"
:native-scrollbar="false" :native-scrollbar="false"
> >
<AppTags v-if="useTheme.tags.visible" /> <AppTags v-if="useTheme.tags.visible" />
@ -20,7 +18,6 @@
</n-layout> </n-layout>
</n-layout> </n-layout>
</n-layout> </n-layout>
</div>
</template> </template>
<script setup> <script setup>