feat: 优化头像下拉菜单展示
将个人中心调整为商户中心并替换图标,移除文档与 GitHub 菜单项,套餐徽章改为展示用户套餐名称(默认标准版)。
This commit is contained in:
@@ -3,18 +3,33 @@ import type { UserInfo } from '@vben/types';
|
|||||||
import { requestClient } from '#/api/request';
|
import { requestClient } from '#/api/request';
|
||||||
|
|
||||||
const TENANT_STORAGE_KEY = 'sys-tenant-id';
|
const TENANT_STORAGE_KEY = 'sys-tenant-id';
|
||||||
|
const PACKAGE_NAME_STORAGE_KEY = 'sys-package-name';
|
||||||
|
|
||||||
interface TenantUserProfile {
|
interface TenantUserProfile {
|
||||||
account?: string;
|
account?: string;
|
||||||
avatar?: string;
|
avatar?: string;
|
||||||
displayName?: string;
|
displayName?: string;
|
||||||
merchantId?: null | number | string;
|
merchantId?: null | number | string;
|
||||||
|
packageName?: string;
|
||||||
permissions?: string[];
|
permissions?: string[];
|
||||||
roles?: string[];
|
roles?: string[];
|
||||||
|
subscriptionPackageName?: string;
|
||||||
tenantId?: number | string;
|
tenantId?: number | string;
|
||||||
|
planName?: string;
|
||||||
userId?: number | string;
|
userId?: number | string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function resolvePackageName(profile: TenantUserProfile) {
|
||||||
|
const packageName =
|
||||||
|
profile.packageName ??
|
||||||
|
profile.subscriptionPackageName ??
|
||||||
|
profile.planName ??
|
||||||
|
localStorage.getItem(PACKAGE_NAME_STORAGE_KEY) ??
|
||||||
|
'标准版';
|
||||||
|
|
||||||
|
return packageName.trim() || '标准版';
|
||||||
|
}
|
||||||
|
|
||||||
function normalizeId(value: null | number | string | undefined) {
|
function normalizeId(value: null | number | string | undefined) {
|
||||||
if (value === null || value === undefined) {
|
if (value === null || value === undefined) {
|
||||||
return '';
|
return '';
|
||||||
@@ -25,7 +40,7 @@ function normalizeId(value: null | number | string | undefined) {
|
|||||||
function mapProfileToUserInfo(profile: TenantUserProfile): UserInfo {
|
function mapProfileToUserInfo(profile: TenantUserProfile): UserInfo {
|
||||||
return {
|
return {
|
||||||
avatar: profile.avatar ?? '',
|
avatar: profile.avatar ?? '',
|
||||||
desc: '',
|
desc: resolvePackageName(profile),
|
||||||
homePath: '',
|
homePath: '',
|
||||||
realName: profile.displayName ?? profile.account ?? '',
|
realName: profile.displayName ?? profile.account ?? '',
|
||||||
roles: profile.roles ?? [],
|
roles: profile.roles ?? [],
|
||||||
@@ -40,6 +55,7 @@ function mapProfileToUserInfo(profile: TenantUserProfile): UserInfo {
|
|||||||
*/
|
*/
|
||||||
export async function getUserInfoApi() {
|
export async function getUserInfoApi() {
|
||||||
const profile = await requestClient.get<TenantUserProfile>('/auth/profile');
|
const profile = await requestClient.get<TenantUserProfile>('/auth/profile');
|
||||||
|
localStorage.setItem(PACKAGE_NAME_STORAGE_KEY, resolvePackageName(profile));
|
||||||
if (profile.tenantId !== null && profile.tenantId !== undefined) {
|
if (profile.tenantId !== null && profile.tenantId !== undefined) {
|
||||||
localStorage.setItem(TENANT_STORAGE_KEY, String(profile.tenantId));
|
localStorage.setItem(TENANT_STORAGE_KEY, String(profile.tenantId));
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -5,9 +5,9 @@ import { computed, ref, watch } from 'vue';
|
|||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
|
import { AuthenticationLoginExpiredModal } from '@vben/common-ui';
|
||||||
import { VBEN_DOC_URL, VBEN_GITHUB_URL } from '@vben/constants';
|
import { VBEN_GITHUB_URL } from '@vben/constants';
|
||||||
import { useWatermark } from '@vben/hooks';
|
import { useWatermark } from '@vben/hooks';
|
||||||
import { BookOpenText, CircleHelp, SvgGithubIcon } from '@vben/icons';
|
import { CircleHelp } from '@vben/icons';
|
||||||
import {
|
import {
|
||||||
BasicLayout,
|
BasicLayout,
|
||||||
LockScreen,
|
LockScreen,
|
||||||
@@ -89,26 +89,8 @@ const menus = computed(() => [
|
|||||||
handler: () => {
|
handler: () => {
|
||||||
router.push({ name: 'Profile' });
|
router.push({ name: 'Profile' });
|
||||||
},
|
},
|
||||||
icon: 'lucide:user',
|
icon: 'lucide:store',
|
||||||
text: $t('page.auth.profile'),
|
text: '商户中心',
|
||||||
},
|
|
||||||
{
|
|
||||||
handler: () => {
|
|
||||||
openWindow(VBEN_DOC_URL, {
|
|
||||||
target: '_blank',
|
|
||||||
});
|
|
||||||
},
|
|
||||||
icon: BookOpenText,
|
|
||||||
text: $t('ui.widgets.document'),
|
|
||||||
},
|
|
||||||
{
|
|
||||||
handler: () => {
|
|
||||||
openWindow(VBEN_GITHUB_URL, {
|
|
||||||
target: '_blank',
|
|
||||||
});
|
|
||||||
},
|
|
||||||
icon: SvgGithubIcon,
|
|
||||||
text: 'GitHub',
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
handler: () => {
|
handler: () => {
|
||||||
@@ -125,6 +107,10 @@ const avatar = computed(() => {
|
|||||||
return userStore.userInfo?.avatar ?? preferences.app.defaultAvatar;
|
return userStore.userInfo?.avatar ?? preferences.app.defaultAvatar;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const packageTagText = computed(() => {
|
||||||
|
return userStore.userInfo?.desc?.trim() || '标准版';
|
||||||
|
});
|
||||||
|
|
||||||
async function handleLogout() {
|
async function handleLogout() {
|
||||||
await authStore.logout(false);
|
await authStore.logout(false);
|
||||||
}
|
}
|
||||||
@@ -176,8 +162,8 @@ watch(
|
|||||||
:avatar
|
:avatar
|
||||||
:menus
|
:menus
|
||||||
:text="userStore.userInfo?.realName"
|
:text="userStore.userInfo?.realName"
|
||||||
description="ann.vben@gmail.com"
|
:description="userStore.userInfo?.username"
|
||||||
tag-text="Pro"
|
:tag-text="packageTagText"
|
||||||
@logout="handleLogout"
|
@logout="handleLogout"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
Reference in New Issue
Block a user