<template>
|
<div id="app">
|
<el-container class="container">
|
<el-aside class="leftMenu">
|
<left-menu></left-menu>
|
</el-aside>
|
<el-main class="contMain">
|
<el-container class="contBox">
|
<el-header class="header">
|
<menu-header></menu-header>
|
</el-header>
|
<el-main class="mainBox">
|
<router-view />
|
</el-main>
|
</el-container>
|
</el-main>
|
</el-container>
|
</div>
|
</template>
|
|
<script>
|
import leftMenu from "./views/menu/leftMenu.vue";
|
import menuHeader from "./views/header/header.vue";
|
export default {
|
components: {
|
leftMenu,
|
menuHeader
|
},
|
data() {
|
return {};
|
},
|
methods: {}
|
};
|
</script>
|
<style>
|
#app {
|
width: 100vw;
|
height: 100vh;
|
overflow: hidden;
|
}
|
.container {
|
width: 100%;
|
height: 100%;
|
padding: 39px 40px 39px 0px !important;
|
|
position: absolute;
|
}
|
.leftMenu {
|
width: 62px !important;
|
height: 100%;
|
}
|
.contMain {
|
width: calc(100% - 62px);
|
height: 100%;
|
padding: 0px !important;
|
border-radius:5px !important ;
|
}
|
.contBox {
|
width: 100%;
|
height: 100%;
|
}
|
.header {
|
width: 100%;
|
height: 36px !important;
|
|
padding: 0px !important;
|
}
|
.mainBox {
|
width: 100%;
|
height: calc(100% - 36px) !important;
|
padding: 0px !important;
|
}
|
</style>
|
