czh-20260610-右上角显示用户名称

src/layouts/default/header/index.vue

@@ -11,9 +11,12 @@
       />
       <!-- <LayoutBreadcrumb v-if="getShowContent && getShowBread" :theme="getHeaderTheme" /> -->
       <!-- 欢迎语 -->
-      <span v-if="getShowContent && getShowBreadTitle && !getIsMobile" :class="[prefixCls, `${prefixCls}--${getHeaderTheme}`,'headerIntroductionClass']">
+      <span
+        v-if="getShowContent && getShowBreadTitle && !getIsMobile"
+        :class="[prefixCls, `${prefixCls}--${getHeaderTheme}`, 'headerIntroductionClass']"
+      >
         <img src="../../../assets/images/header-brand.png" class="header-logo" />
-        {{t('layout.header.welcomeIn')}} {{ title }}
+        {{ t('layout.header.welcomeIn') }} {{ title }}
       </span>
     </div>
     <!-- left end -->
@@ -42,6 +45,7 @@
       <!-- ai助手 -->
       <Aide v-if="false"></Aide>
 
+      <span v-if="realname" :class="`${prefixCls}-action__item header-username`">{{ realname }}</span>
       <UserDropDown :theme="getHeaderTheme" />
     </div>
   </Header>
@@ -108,7 +112,7 @@
       const { prefixCls } = useDesign('layout-header');
       const userStore = useUserStore();
       const { getShowTopMenu, getShowHeaderTrigger, getSplit, getIsMixMode, getMenuWidth, getIsMixSidebar } = useMenuSetting();
-      const { getUseErrorHandle, /* getShowSettingButton, getSettingButtonPosition, getAiIconShow */ } = useRootSetting();
+      const { getUseErrorHandle /* getShowSettingButton, getSettingButtonPosition, getAiIconShow */ } = useRootSetting();
       const { title } = useGlobSetting();
 
       const {
@@ -167,6 +171,10 @@
         return unref(getSplit) ? MenuModeEnum.HORIZONTAL : null;
       });
 
+      const realname = computed(() => {
+        return userStore.getUserInfo?.realname || '';
+      });
+
       /**
        * 首页多租户部门弹窗逻辑
        */
@@ -210,6 +218,7 @@
         getUseErrorHandle,
         getLogoWidth,
         getIsMixSidebar,
+        realname,
         // getShowSettingButton,
         // getShowSetting,
         // getShowSearch,
@@ -228,7 +237,7 @@
   //update-begin---author:scott ---date:2022-09-30  for：默认隐藏顶部菜单面包屑-----------
   //顶部欢迎语展示样式
   @prefix-cls: ~'@{namespace}-layout-header';
-  
+
   .ant-layout .@{prefix-cls} {
     display: flex;
     padding: 0 8px;
@@ -236,7 +245,7 @@
     height: @header-height;
     // update-end--author:liaozhiyang---date:20240407---for：【QQYUN-8762】顶栏高度
     align-items: center;
-    
+
     .headerIntroductionClass {
       margin-right: 4px;
       margin-bottom: 2px;
@@ -251,7 +260,26 @@
       height: 32px;
       width: auto;
     }
-    
+
+    .header-username {
+      font-size: 13px;
+      font-weight: 500;
+      cursor: default;
+      pointer-events: none;
+    }
+
+    &--light {
+      .header-username {
+        color: #1677ff;
+      }
+    }
+
+    &--dark {
+      .header-username {
+        color: rgba(255, 255, 255, 0.85);
+      }
+    }
+
     &--light {
       .headerIntroductionClass {
         color: #000;
@@ -262,7 +290,8 @@
       .headerIntroductionClass {
         color: rgba(255, 255, 255, 1);
       }
-      .anticon, .truncate {
+      .anticon,
+      .truncate {
         color: rgba(255, 255, 255, 1);
       }
     }