Showing
1 changed file
with
8 additions
and
5 deletions
| @@ -2,10 +2,12 @@ | @@ -2,10 +2,12 @@ | ||
| 2 | <Dropdown placement="bottomLeft" :overlayClassName="`${prefixCls}-dropdown-overlay`"> | 2 | <Dropdown placement="bottomLeft" :overlayClassName="`${prefixCls}-dropdown-overlay`"> |
| 3 | <span :class="[prefixCls, `${prefixCls}--${theme}`]" class="flex"> | 3 | <span :class="[prefixCls, `${prefixCls}--${theme}`]" class="flex"> |
| 4 | <img :class="`${prefixCls}__header`" :src="getUserInfo.avatar" /> | 4 | <img :class="`${prefixCls}__header`" :src="getUserInfo.avatar" /> |
| 5 | - <span :class="`${prefixCls}__info hidden md:block w-30 truncate`"> | ||
| 6 | - <span :class="`${prefixCls}__name `" class="truncate"> | ||
| 7 | - {{ getUserInfo.realName }} | ||
| 8 | - </span> | 5 | + <span :class="`${prefixCls}__info hidden md:block truncate`"> |
| 6 | + <Tooltip :trigger="['click']" :title="getUserInfo.realName"> | ||
| 7 | + <span :class="`${prefixCls}__name `" class="truncate"> | ||
| 8 | + {{ getUserInfo.realName?.slice(0, 10) }} | ||
| 9 | + </span> | ||
| 10 | + </Tooltip> | ||
| 9 | </span> | 11 | </span> |
| 10 | </span> | 12 | </span> |
| 11 | 13 | ||
| @@ -53,7 +55,7 @@ | @@ -53,7 +55,7 @@ | ||
| 53 | </template> | 55 | </template> |
| 54 | <script lang="ts"> | 56 | <script lang="ts"> |
| 55 | // components | 57 | // components |
| 56 | - import { Dropdown, Menu } from 'ant-design-vue'; | 58 | + import { Dropdown, Menu, Tooltip } from 'ant-design-vue'; |
| 57 | import { defineComponent, computed, ref, reactive } from 'vue'; | 59 | import { defineComponent, computed, ref, reactive } from 'vue'; |
| 58 | import { useUserStore } from '/@/store/modules/user'; | 60 | import { useUserStore } from '/@/store/modules/user'; |
| 59 | import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting'; | 61 | import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting'; |
| @@ -83,6 +85,7 @@ | @@ -83,6 +85,7 @@ | ||
| 83 | LockAction: createAsyncComponent(() => import('../lock/LockModal.vue')), | 85 | LockAction: createAsyncComponent(() => import('../lock/LockModal.vue')), |
| 84 | PersonalChild: createAsyncComponent(() => import('../personal/index.vue')), | 86 | PersonalChild: createAsyncComponent(() => import('../personal/index.vue')), |
| 85 | AboutSoftwareModal, | 87 | AboutSoftwareModal, |
| 88 | + Tooltip, | ||
| 86 | }, | 89 | }, |
| 87 | props: { | 90 | props: { |
| 88 | theme: propTypes.oneOf(['dark', 'light']), | 91 | theme: propTypes.oneOf(['dark', 'light']), |