78 lines
2.2 KiB
Vue
78 lines
2.2 KiB
Vue
<script lang="ts" name="UserInfo" setup>
|
|
import { ElMessageBox } from 'element-plus'
|
|
|
|
import { CACHE_KEY } from '@/hooks/web/useCache'
|
|
import { useDesign } from '@/hooks/web/useDesign'
|
|
import avatarImg from '@/assets/imgs/avatar.gif'
|
|
import { useUserStore } from '@/store/modules/user'
|
|
import { useTagsViewStore } from '@/store/modules/tagsView'
|
|
import { getTenantId, getAppId } from '@/utils/auth'
|
|
import cache from '@/plugins/cache'
|
|
|
|
import { Setting } from '@/layout/components/Setting'
|
|
|
|
const { t } = useI18n()
|
|
|
|
const { push, replace } = useRouter()
|
|
|
|
const userStore = useUserStore()
|
|
|
|
const tagsViewStore = useTagsViewStore()
|
|
|
|
const { getPrefixCls } = useDesign()
|
|
|
|
const prefixCls = getPrefixCls('user-info')
|
|
|
|
const user = cache.local.get(CACHE_KEY.USER)
|
|
|
|
const avatar = user.user.avatar ? user.user.avatar : avatarImg
|
|
|
|
const userName = user.user.nickname ? user.user.nickname : 'Admin'
|
|
|
|
const loginOut = () => {
|
|
ElMessageBox.confirm(t('common.loginOutMessage'), t('common.reminder'), {
|
|
confirmButtonText: t('common.ok'),
|
|
cancelButtonText: t('common.cancel'),
|
|
type: 'warning'
|
|
})
|
|
.then(async () => {
|
|
const tenantId = getTenantId()
|
|
const appId = getAppId()
|
|
await userStore.loginOut()
|
|
tagsViewStore.delAllViews()
|
|
replace(`/login?tenantId=${tenantId}&appId=${appId}`)
|
|
})
|
|
.catch(() => {})
|
|
}
|
|
const toProfile = async () => {
|
|
push('/user/profile')
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<ElDropdown :class="prefixCls" trigger="click">
|
|
<div class="flex items-center">
|
|
<img :src="avatar" alt="" class="w-[calc(var(--logo-height)-25px)] rounded-[50%]" />
|
|
<span class="<lg:hidden text-14px pl-[5px] text-[var(--top-header-text-color)]">
|
|
{{ userName }}
|
|
</span>
|
|
</div>
|
|
<template #dropdown>
|
|
<ElDropdownMenu>
|
|
<ElDropdownItem>
|
|
<Icon icon="ep:tools" />
|
|
<Setting />
|
|
</ElDropdownItem>
|
|
<ElDropdownItem>
|
|
<Icon icon="ep:tools" />
|
|
<div @click="toProfile">{{ t('common.profile') }}</div>
|
|
</ElDropdownItem>
|
|
<ElDropdownItem divided @click="loginOut">
|
|
<Icon icon="ep:switch-button" />
|
|
<div>{{ t('common.loginOut') }}</div>
|
|
</ElDropdownItem>
|
|
</ElDropdownMenu>
|
|
</template>
|
|
</ElDropdown>
|
|
</template>
|