From ce10677f47a14879424e7f562f78442cc03cfda1 Mon Sep 17 00:00:00 2001
From: lishifeng <10326849@qq.com>
Date: 星期二, 15 九月 2020 08:51:45 +0800
Subject: [PATCH] 提交5
---
src/components/PageHeader.vue | 69 ++++++++++++++++++++++++++++++++--
1 files changed, 64 insertions(+), 5 deletions(-)
diff --git a/src/components/PageHeader.vue b/src/components/PageHeader.vue
index 1c16c82..38bffe5 100644
--- a/src/components/PageHeader.vue
+++ b/src/components/PageHeader.vue
@@ -6,10 +6,22 @@
<img src="../assets/images/yuanchang_logo.png">
<span>钃勭數姹犵洃鎺у钩鍙�</span>
</div>
- <!-- <div class="info-banner">
- <div class="info-banner-text">鏈烘埧鍋滅數鏁帮細</div>
- <div class="info-banner-val">123</div>
- </div> -->
+ <div class="page-header-right" slot="footer">
+ <div class="hdw-avatar">
+ <span class="hdw-avatar-icon">
+ <i class="iconfont el-icon-Userselect"></i>
+ </span>
+ <el-dropdown @command="commandClick">
+ <span class="hdw-avatar-text">
+ {{username}}<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 command="outSystem">瀹夊叏閫�鍑�</el-dropdown-item>
+ </el-dropdown-menu>
+ </el-dropdown>
+ </div>
+ </div>
</flex-layout>
</div>
</div>
@@ -17,7 +29,26 @@
<script>
export default {
-
+ data() {
+ return {
+ username: sessionStorage.getItem('username'),
+ }
+ },
+ methods: {
+ outSystem() {
+ this.$router.push('/login');
+ },
+ commandClick(name) {
+ switch(name) {
+ case 'outSystem':
+ this.outSystem();
+ break;
+ default:
+ this.$layer.msg('璇ュ姛鑳芥殏鏈紑鏀撅紒');
+ break;
+ }
+ }
+ }
}
</script>
@@ -46,6 +77,34 @@
padding-top: 8px;
padding-bottom: 8px;
}
+.hdw-avatar {
+ margin-top: 10px;
+ margin-right: 16px;
+ cursor: pointer;
+ color: #e4e3e3;
+}
+.hdw-avatar:hover {
+ color: #FFFFFF;
+}
+.hdw-avatar:hover .el-icon-arrow-down {
+ transform: rotate(180deg);
+}
+.hdw-avatar-icon {
+ display: inline-block;
+ padding: 8px;
+ border-radius: 16px;
+ background-color: #87d068;
+}
+.hdw-avatar-icon .iconfont {
+ font-size: 16px;
+}
+.hdw-avatar-text {
+ color: #FFFFFF;
+ margin-left: 8px;
+}
+.hdw-avatar-text .el-icon-arrow-down {
+ margin-left: 4px;
+}
</style>
--
Gitblit v1.9.1