1.0.20 组件显示用户名称

src/layout/components/Navbar.vue

@@ -65,7 +65,7 @@
       <div class="avatar-container">
         <el-dropdown class="right-menu-item hover-effect" trigger="click" @command="handleCommand">
           <div class="avatar-wrapper">
-            <img :src="userStore.avatar" class="user-avatar" />
+            <span class="user-name">{{ userStore.nickname }}</span>
             <el-icon><caret-bottom /></el-icon>
           </div>
           <template #dropdown>
@@ -280,25 +280,25 @@ watch(
     }
 
     .avatar-container {
-      margin-right: 40px;
+      margin-right: 10px;
 
       .avatar-wrapper {
         margin-top: 5px;
         position: relative;
+        display: flex;
+        align-items: center;
+        gap: 5px;
 
-        .user-avatar {
+        .user-name {
           cursor: pointer;
-          width: 40px;
+          font-size: 14px;
-          height: 40px;
+          color: #5a5e66;
-          border-radius: 10px;
+          font-weight: 500;
-          margin-top: 10px;
+          white-space: nowrap;
         }
 
         i {
           cursor: pointer;
-          position: absolute;
-          right: -20px;
-          top: 25px;
           font-size: 12px;
         }
       }