renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 退出登录

Browse Source
This commit is contained in:
rd
2025-07-01 17:52:41 +08:00
parent 9ad8e35305
commit d1589ba12b
3 changed files with 138 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/components/_base/navbar/index.vue
View File

@ -8,6 +8,7 @@ import { useSidebarStore } from '@/stores/modules/side-bar';
import { MENU_GROUP_IDS } from '@/router/constants';
import router from '@/router';
import { useRoute } from 'vue-router';
import ExitAccountModal from '@/components/_base/exit-account-modal/index.vue';
interface MenuItem {
name: string;
@ -20,7 +21,7 @@ interface MenuItem {
const lists = ref<MenuItem[]>([]);
const sidebarStore = useSidebarStore();
const route = useRoute();
const exitAccountModalRef = ref(null);
const selectedKey = computed(() => {
// 判断是否为工作台页面（假设路由名为 'Home' 或 path 为 '/'）
if (route.name === 'Home' || route.path === '/') {
@ -31,10 +32,7 @@ const selectedKey = computed(() => {
});
const clickExit = async () => {
const { code } = await fetchLogOut();
if (code === 200) {
handleUserLogout();
}
exitAccountModalRef.value?.open();
};
const getMenus = async () => {
const res = await fetchMenusTree();
@ -112,31 +110,37 @@ const handleDopdownClick = (index: any, ind: any) => {
</div>
<ul class="right-side">
<li>
<a-dropdown trigger="click">
<a-dropdown trigger="click" class="layout-avatar-dropdown">
<a-avatar class="cursor-pointer" :size="32">
<img alt="avatar" src="@/assets/avatar.svg" />
</a-avatar>
<template #content>
<div style="padding: 14px">
<div>
<a-doption>
<a-space @click="setServerMenu">
<img src="@/assets/option.svg" style="width: 16px; height: 16px" />
<span style="width: 140px; font-size: 12px">管理中心</span>
<icon-right />
<a-space class="flex justify-between w-100%" @click="setServerMenu">
<div class="flex items-center">
<img src="@/assets/option.svg" class="w-16px h-16px mr-8px" />
<span>管理中心</span>
</div>
<icon-right size="12" />
</a-space>
</a-doption>
<a-doption>
<a-space>
<img src="@/assets/change.svg" style="width: 16px; height: 16px" />
<span style="width: 140px; font-size: 12px">切换企业账号</span>
<icon-right />
<!-- <a-doption>
<a-space class="flex justify-between w-100%">
<div class="flex items-center">
<img src="@/assets/change.svg" class="w-16px h-16px mr-8px" />
<span>切换企业账号</span>
</div>
<icon-right size="12" />
</a-space>
</a-doption>
</a-doption> -->
<a-doption>
<a-space @click="clickExit">
<img src="@/assets/exit.svg" style="width: 16px; height: 16px" />
<span style="width: 140px; font-size: 12px">退出登录</span>
<icon-right />
<a-space class="flex justify-between w-100%" @click="clickExit">
<div class="flex items-center">
<img src="@/assets/exit.svg" class="w-16px h-16px mr-8px" />
<span>退出登录</span>
</div>
<icon-right size="12" />
</a-space>
</a-doption>
</div>
@ -144,6 +148,7 @@ const handleDopdownClick = (index: any, ind: any) => {
</a-dropdown>
</li>
</ul>
<ExitAccountModal ref="exitAccountModalRef" />
</div>
</template>
@ -237,7 +242,8 @@ const handleDopdownClick = (index: any, ind: any) => {
</style>
<style lang="scss">
.layout-menu-item-dropdown {
.layout-menu-item-dropdown,
.layout-avatar-dropdown {
.arco-dropdown {
border-radius: 8px;
border: 1px solid var(--BG-300, #e6e6e8);
@ -271,4 +277,16 @@ const handleDopdownClick = (index: any, ind: any) => {
}
}
}
.layout-avatar-dropdown {
width: 200px;
.arco-dropdown {
padding: 12px 4px;
.arco-dropdown-option {
padding: 0 !important;
&-content {
padding: 0 12px !important;
}
}
}
}
</style>