no message
Former-commit-id: d0b2365f079402451410424ed468fb1c4e24576c Former-commit-id: 010d8b45561b74779c03f12b47a089eac5a06a04 Former-commit-id: 4393708426882f6fea510c3fd6290f4d396b950d
This commit is contained in:
@@ -45,6 +45,17 @@ $color: #409EFF;
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
// 顶栏按钮
|
||||||
|
.btn-group {
|
||||||
|
float: right;
|
||||||
|
height: 60px;
|
||||||
|
display: flex;
|
||||||
|
// justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
.btn-text {
|
||||||
|
color: $color-text-normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
// 顶栏下面
|
// 顶栏下面
|
||||||
.el-container {
|
.el-container {
|
||||||
|
|||||||
32
src/components/core/MainLayout/_headerRight.vue
Normal file
32
src/components/core/MainLayout/_headerRight.vue
Normal file
@@ -0,0 +1,32 @@
|
|||||||
|
<template>
|
||||||
|
<div class="btn-group">
|
||||||
|
<el-button
|
||||||
|
class="dd-mr btn-text"
|
||||||
|
type="text"
|
||||||
|
@click="toggleFullScreen">
|
||||||
|
<Icon name="arrows-alt"></Icon>
|
||||||
|
</el-button>
|
||||||
|
<el-dropdown class="dd-mr">
|
||||||
|
<span class="el-dropdown-link">
|
||||||
|
用户
|
||||||
|
<i class="el-icon-arrow-down el-icon--right"></i>
|
||||||
|
</span>
|
||||||
|
<el-dropdown-menu slot="dropdown">
|
||||||
|
<el-dropdown-item>注销</el-dropdown-item>
|
||||||
|
<el-dropdown-item>个人中心</el-dropdown-item>
|
||||||
|
</el-dropdown-menu>
|
||||||
|
</el-dropdown>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { mapMutations } from 'vuex'
|
||||||
|
export default {
|
||||||
|
methods: {
|
||||||
|
...mapMutations([
|
||||||
|
'toggleFullScreen'
|
||||||
|
])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
@@ -5,7 +5,7 @@
|
|||||||
<img src="@/assets/image/logo/header.png">
|
<img src="@/assets/image/logo/header.png">
|
||||||
</div>
|
</div>
|
||||||
<HeaderMenu></HeaderMenu>
|
<HeaderMenu></HeaderMenu>
|
||||||
<span @click="toggleFullScreen">全屏</span>
|
<HeaderRight></HeaderRight>
|
||||||
</el-header>
|
</el-header>
|
||||||
<el-container>
|
<el-container>
|
||||||
<el-aside style="width: 200px;">
|
<el-aside style="width: 200px;">
|
||||||
@@ -19,23 +19,19 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { mapMutations } from 'vuex'
|
import SiderMenu from './_siderMenu'
|
||||||
import SiderMenu from '@/components/core/MainLayout/_siderMenu.vue'
|
import HeaderMenu from './_headerMenu'
|
||||||
import HeaderMenu from '@/components/core/MainLayout/_headerMenu.vue'
|
import HeaderRight from './_headerRight'
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
SiderMenu,
|
SiderMenu,
|
||||||
HeaderMenu
|
HeaderMenu,
|
||||||
|
HeaderRight
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
theme: 'default'
|
theme: 'default'
|
||||||
}
|
}
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
...mapMutations([
|
|
||||||
'toggleFullScreen'
|
|
||||||
])
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user