qiangyanwen
/
monitoring
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

添加布局

This commit is contained in:
qiangyanwen 2022-06-06 13:34:23 +08:00
parent b667fa8701
commit 3aecb970ea
3 changed files with 65 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
web/monit_web/src/components/Header.vue Normal file
View File

@ -0,0 +1,16 @@
<template>
<el-header>Header</el-header>
</template>
<script>
export default {
name: "Header"
}
</script>
<style scoped>
.el-header{
background-color: #282C34;
}
</style>

13
web/monit_web/src/components/Sidebar.vue Normal file
View File

@ -0,0 +1,13 @@
<template>
</template>
<script>
export default {
name: "Sidebar.vue"
}
</script>
<style scoped>
</style>

37
web/monit_web/src/view/home/Home.vue
View File

@ -1,6 +1,19 @@
<template> <template>
<div> <div class="common-layout">
我是home组件 <el-container>
<el-header>
<div class="icon">
图标
</div>
</el-header>
<el-container>
<el-aside width="200px">Aside</el-aside>
<el-container>
<el-main>Main</el-main>
<el-footer>Footer</el-footer>
</el-container>
</el-container>
</el-container>
</div> </div>
</template> </template>
@ -14,5 +27,25 @@ export default {
</script> </script>
<style scoped> <style scoped>
.el-header{
background-color: #67C23A;
height: 75px;
}
.el-aside{
width: 10%;
height: 1000px;
background-color: #324157;
}
.icon{
margin-top: 5px;
margin-left: 0px;
background-color: #dddddd;
height: 50px;
width: 50px;
line-height: 45px;
text-align: center;
border-radius: 5px;
border:1px solid #42b983;
}
</style> </style>