You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
shop-admin/src/layouts/default.vue

54 lines
1.4 KiB

<template>
<div class="layout-container layout-default">
<div class="layout-left">
<layout-aside />
</div>
<div class="layout-center">
<layout-menu />
</div>
<div class="layout-right">
<layout-header />
<layout-tabs />
<layout-main />
<layout-footer />
</div>
</div>
</template>
<script setup>
import LayoutAside from './components/aside.vue';
import LayoutFooter from './components/footer.vue';
import LayoutHeader from './components/header.vue';
import LayoutMain from './components/main.vue';
import LayoutMenu from './components/menu.vue';
import LayoutTabs from './components/tabs.vue';
</script>
<style lang="less" scoped>
.layout-container {
width: 100vw;
height: 100vh;
min-width: 1200px;
background-color: @color-white-dark;
}
.layout-default {
display: flex;
.layout-left {
display: flex;
flex-direction: column;
box-shadow: @layout-shadow;
z-index: 9;
}
.layout-center {
box-shadow: @layout-shadow;
z-index: 9;
}
.layout-right {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
}
}
</style>