<script setup>
|
import FlexLayout from "@/components/FlexLayout.vue";
|
import SlideMenu from "@/views/mainLayout/components/SlideMenu.vue";
|
import PageHeader from "@/views/mainLayout/components/PageHeader.vue";
|
</script>
|
|
<template>
|
<div class="main-layout-wrapper">
|
<div class="main-layout-menu">
|
<slide-menu></slide-menu>
|
</div>
|
<div class="main-layout-content">
|
<div class="main-layout-absolute">
|
<flex-layout no-bg>
|
<template v-slot:header>
|
<page-header></page-header>
|
</template>
|
<div class="page-content">
|
<router-view></router-view>
|
</div>
|
</flex-layout>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<style lang="less" scoped>
|
.main-layout-wrapper {
|
position: relative;
|
display: flex;
|
height: 100%;
|
flex-direction: row;
|
background-image: url("@/assets/images/dw_bg.jpg");
|
background-size: 100% 100%;
|
background-repeat: no-repeat;
|
overflow: hidden;
|
|
.main-layout-menu {
|
overflow-y: auto;
|
}
|
|
.main-layout-content {
|
position: relative;
|
flex: 1;
|
height: 100%;
|
.main-layout-absolute {
|
position: absolute;
|
top: 0;
|
left: 0;
|
right: 0;
|
bottom: 0;
|
}
|
}
|
}
|
.page-content {
|
height: 100%;
|
}
|
</style>
|
