perf: 更新导航栏样式和布局

- 优化右侧面板的样式，添加下拉菜单展开时的图标旋转效果
- 调整头像组件的布局和样式，增强视觉一致性
- 修正 `TextOverTips` 组件的拼写错误

src/layouts/components/navbar/components/right-side/index.vue

@@ -20,12 +20,22 @@
 
     <!-- 头像设置 -->
     <Dropdown trigger="click" overlayClassName="layout-avatar-dropdown">
-      <div class="cursor-pointer">
+      <div
-        <Avatar :src="userInfo.head_image" :size="32" v-if="userInfo.head_image" />
+        class="w-126px h-32px flex items-center justify-between px-4px pl-4px pr-8px rounded-30px bg-white bg-opacity-60 group"
-        <div v-else class="w-32px h-32px rounded-50% bg-#6D4CFE flex items-center justify-center">
+      >
-          <span class="color-#FFF text-14px font-400 lh-22px">{{ userInfo.mobile?.slice(-3) }}</span>
+        <div class="flex mr-4px overflow-hidden h-24px lh-24px items-center">
+          <div class="cursor-pointer mr-4px">
+            <Avatar v-if="userInfo.head_image" :size="24" :src="userInfo.head_image" />
+            <div v-else class="w-24px h-24px rounded-50% bg-#6D4CFE flex items-center justify-center">
+              <span class="color-#FFF text-11px font-400 lh-20px">{{ userInfo.mobile?.slice(-3) }}</span>
+            </div>
+          </div>
+          <TextOverTips :context="userInfo.name || userInfo.mobile" />
         </div>
+
+        <icon-caret-down class="icon-caret color-#939499" size="14" />
       </div>
+
       <template #overlay>
         <Menu>
           <MenuItem>
@@ -83,7 +93,7 @@
                           class="flex items-center w-100% flex-1 overflow-hidden"
                           :class="enterpriseInfo?.id === item.id ? '!color-#6D4CFE' : ''"
                         >
-                          <TextoverTips :context="item.name" />
+                          <TextOverTips :context="item.name" />
                           <img :src="icon4" width="12" height="12" class="ml-4px" />
                         </div>
                         <div
@@ -145,7 +155,7 @@ import icon1 from '@/assets/option.svg';
 import icon2 from '@/assets/exit.svg';
 import icon3 from '@/assets/change.svg';
 import icon4 from './img/admin.png';
-import TextoverTips from '@/components/text-over-tips/index.vue';
+import TextOverTips from '@/components/text-over-tips/index.vue';
 
 const props = defineProps({
   isAgentRoute: {

src/layouts/components/navbar/components/right-side/style.scss

@@ -31,4 +31,17 @@
       background: #fff;
     }
   }
+
+  .group {
+    &.ant-dropdown-open {
+      .icon-caret {
+        color: #6D4CFE;
+        transform: rotate(180deg);
+      }
+
+      :deep(.overflow-text) {
+        color: #6D4CFE;
+      }
+    }
+  }
 }