From 3838f68fa93f70f8ef9a1113ad2267b366042571 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Wed, 12 Nov 2025 17:58:01 +0800
Subject: [PATCH] perf: Optimize the display of the header username

---
 ui/src/layout/layout-header/avatar/index.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/ui/src/layout/layout-header/avatar/index.vue b/ui/src/layout/layout-header/avatar/index.vue
index 7a71d08d3..e82e61908 100644
--- a/ui/src/layout/layout-header/avatar/index.vue
+++ b/ui/src/layout/layout-header/avatar/index.vue
@@ -19,7 +19,7 @@
             </el-avatar>
           </div>
           <div style="width: 90%">
-            <p class="bold mb-4" style="font-size: 14px">{{ user.userInfo?.nick_name }}({{ user.userInfo?.username }})</p>
+            <p class="bold mb-4" style="font-size: 14px">{{ user.userInfo?.nick_name }} <span class="color-secondary lighter">({{ user.userInfo?.username }})</span></p>
             <template v-if="user.userInfo?.role_name && user.userInfo.role_name.length > 0">
               <TagGroup
                 size="small"
@@ -222,6 +222,7 @@ onMounted(() => {
 <style lang="scss" scoped>
 .avatar-dropdown {
   min-width: 210px;
+  max-width: 400px;
 
   .userInfo {
     padding: 12px 11px;