diff --git a/src/assets/icons/svg/more-up.svg b/src/assets/icons/svg/more-up.svg new file mode 100644 index 0000000..d30ac11 --- /dev/null +++ b/src/assets/icons/svg/more-up.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index a7b467a..ca671f0 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -29,26 +29,25 @@ -
- -
- - -
- -
+ + +
+ + {{ userStore.nickName }} +
+ +
+
+
@@ -161,7 +160,7 @@ function toggleTheme() { padding: 0 8px; height: 100%; font-size: 18px; - color: var(--navbar-text); + color: #5a5e66; vertical-align: text-bottom; &.hover-effect { @@ -188,17 +187,27 @@ function toggleTheme() { } .avatar-container { - margin-right: 40px; + margin-right: 0px; + padding-right: 0px; .avatar-wrapper { - margin-top: 5px; + margin-top: 10px; + right: 5px; position: relative; .user-avatar { cursor: pointer; - width: 40px; - height: 40px; - border-radius: 10px; + width: 30px; + height: 30px; + border-radius: 50%; + } + + .user-nickname{ + position: relative; + left: 5px; + bottom: 10px; + font-size: 14px; + font-weight: bold; } i { diff --git a/src/store/modules/user.js b/src/store/modules/user.js index 996a568..0fee168 100644 --- a/src/store/modules/user.js +++ b/src/store/modules/user.js @@ -10,6 +10,7 @@ const useUserStore = defineStore( token: getToken(), id: '', name: '', + nickName: '', avatar: '', roles: [], permissions: [] @@ -46,6 +47,7 @@ const useUserStore = defineStore( } this.id = user.userId this.name = user.userName + this.nickName = user.nickName this.avatar = avatar resolve(res) }).catch(error => {