fix : 修改右上角用户样式

src/layout/navbar/index.vue

@@ -6,8 +6,12 @@
       <!--        <bell-socket/>-->
       <div class="user-box">
         <div>
-          <!--         <img :src="userInfo.avatar" alt="" @click.stop="handleVisitedP">-->
-          <span @click.stop="handleVisitedP">欢迎回来，{{ userInfo.nickName }}</span>
+          <el-avatar>{{ userInfo.nickName }}</el-avatar>
+          <div @click.stop="handleVisitedP">{{ userInfo.nickName }}
+            <el-icon style="margin-left: 5px">
+              <ArrowDownBold/>
+            </el-icon>
+          </div>
         </div>
         <div class="person" v-if="visitedP">
           <ul>
@@ -90,8 +94,6 @@ const handleVisitedP = () => {
       visitedP.value = !visitedP.value
     })
   })
-
-
 }
 
 const accountChange = (userId) => {
@@ -123,6 +125,11 @@ const handleLogout = () => {
 </script>
 
 <style lang="scss" scoped>
+:deep(.el-avatar--circle) {
+  margin-right: 10px;
+  background-color: #8a7243;
+}
+
 .navbar {
   height: 65px;
   padding: 0 15px 0 0;
@@ -147,8 +154,9 @@ const handleLogout = () => {
         display: flex;
         align-items: center;
 
-        > span {
-          margin-left: 5px;
+        > div {
+          display: flex;
+          align-items: center;
         }
 
         img {
@@ -168,7 +176,7 @@ const handleLogout = () => {
         width: 280px;
         right: 0;
         z-index: 300;
-        top: 46px;
+        top: 54px;
         padding: 5px 0;
         border-radius: 4px;
         background-color: #fff;
@@ -214,10 +222,6 @@ const handleLogout = () => {
             }
           }
 
-          :deep(.el-avatar--circle) {
-            margin-right: 10px;
-            background-color: #8a7243;
-          }
 
         }