|
@@ -1,41 +1,28 @@
|
|
|
<template>
|
|
|
<div class="navbar">
|
|
|
- <span class="title">万达数字化运维平台</span>
|
|
|
+ <span class="title" v-show="sidebar.opened">万达数字化运维平台</span>
|
|
|
<hamburger
|
|
|
id="hamburger-container"
|
|
|
:is-active="sidebar.opened"
|
|
|
class="hamburger-container"
|
|
|
@toggle-click="toggleSideBar"
|
|
|
/>
|
|
|
- <breadcrumb
|
|
|
- id="breadcrumb-container"
|
|
|
- class="breadcrumb-container"
|
|
|
- />
|
|
|
+
|
|
|
<div class="right-menu">
|
|
|
<el-dropdown
|
|
|
class="avatar-container right-menu-item hover-effect"
|
|
|
- trigger="click"
|
|
|
>
|
|
|
<div class="avatar-wrapper">
|
|
|
- <img
|
|
|
- src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2853553659,1775735885&fm=26&gp=0.jpg"
|
|
|
- class="user-avatar"
|
|
|
- >
|
|
|
- <i class="el-icon-caret-bottom"/>
|
|
|
+ <span> yanruolan </span>
|
|
|
+ <i class="el-icon-user-solid"/>
|
|
|
</div>
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
<router-link to="/">
|
|
|
<el-dropdown-item>
|
|
|
- Home
|
|
|
+ 退出
|
|
|
</el-dropdown-item>
|
|
|
</router-link>
|
|
|
|
|
|
- <el-dropdown-item divided>
|
|
|
- <span
|
|
|
- style="display:block;"
|
|
|
- @click="logout"
|
|
|
- >LogOut</span>
|
|
|
- </el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
</el-dropdown>
|
|
|
</div>
|
|
@@ -70,13 +57,12 @@ export default class extends Vue {
|
|
|
}
|
|
|
|
|
|
private toggleSideBar() {
|
|
|
-
|
|
|
AppModule.ToggleSideBar(false)
|
|
|
}
|
|
|
|
|
|
private async logout() {
|
|
|
await UserModule.LogOut()
|
|
|
- this.$router.push(`/login?redirect=${this.$route.fullPath}`)
|
|
|
+ // this.$router.push(`/login?redirect=${this.$route.fullPath}`)
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
@@ -86,7 +72,7 @@ export default class extends Vue {
|
|
|
height: 50px;
|
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
|
- background-color: rgb(48, 65, 86);
|
|
|
+ background-color: #2b3643;
|
|
|
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
|
|
|
|
|
|
.title {
|
|
@@ -95,14 +81,16 @@ export default class extends Vue {
|
|
|
margin: 0 auto;
|
|
|
line-height: 46px;
|
|
|
height: 100%;
|
|
|
- color:#fff;
|
|
|
+ color: #fff;
|
|
|
}
|
|
|
|
|
|
.hamburger-container {
|
|
|
+ color: #fff;
|
|
|
line-height: 46px;
|
|
|
height: 100%;
|
|
|
float: left;
|
|
|
- padding: 0 15px;
|
|
|
+ width: 60px;
|
|
|
+ //padding: 0 15px;
|
|
|
cursor: pointer;
|
|
|
transition: background .3s;
|
|
|
-webkit-tap-highlight-color: transparent;
|
|
@@ -112,9 +100,6 @@ export default class extends Vue {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .breadcrumb-container {
|
|
|
- float: left;
|
|
|
- }
|
|
|
|
|
|
.right-menu {
|
|
|
float: right;
|
|
@@ -147,9 +132,9 @@ export default class extends Vue {
|
|
|
margin-right: 30px;
|
|
|
|
|
|
.avatar-wrapper {
|
|
|
- margin-top: 5px;
|
|
|
position: relative;
|
|
|
-
|
|
|
+ color: #409eff;
|
|
|
+ font-size: 18px;
|
|
|
.user-avatar {
|
|
|
cursor: pointer;
|
|
|
width: 40px;
|