fix(auth): 退出登录改为真实退出(整页跳转 + 二次确认)
沿用远端的账户菜单与个人信息实现(AccountPanel + useAccountPanel),
仅补齐它缺的退出部分:
- 二次确认后再注销,避免误点直接下线
- 退出改为整页跳转 window.location.replace('/login'):SPA 内跳转只清得掉
store 里被显式重置过的字段,模块级缓存、其余 store 与页面组件持有的数据
都会留在内存里;整页重载一次才叫真正的退出(与 utils/request.ts 的 401 同款)
- 配套的 clearSession() 重置跨账号内存态(院区列表与选中项)见前序提交
This commit is contained in:
@@ -1,12 +1,12 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue'
|
||||
import AccountPanel from './AccountPanel.vue'
|
||||
import { RouterLink, useRouter } from 'vue-router'
|
||||
import { RouterLink } from 'vue-router'
|
||||
import { ElMessageBox } from 'element-plus'
|
||||
|
||||
import { useLoginStore } from '@/stores/login'
|
||||
|
||||
const loginStore = useLoginStore()
|
||||
const router = useRouter()
|
||||
const accountPanel = ref<InstanceType<typeof AccountPanel>>()
|
||||
const accountMenuOpen = ref(false)
|
||||
const loggingOut = ref(false)
|
||||
@@ -46,18 +46,43 @@ const visibleMenuGroups = computed(() =>
|
||||
.filter((group) => group.items.length),
|
||||
)
|
||||
|
||||
/**
|
||||
* 退出登录:二次确认 → 注销服务端会话 → 清掉本地身份数据 → **整页**回登录页。
|
||||
*
|
||||
* 为什么最后一步是 `window.location.replace` 而不是 `router.push`:
|
||||
* SPA 内跳转只清得掉 store 里被显式重置过的字段,而模块级缓存
|
||||
* (如文档库的「哈希 → 正文」缓存)、其余 Pinia store、各页面组件持有的数据
|
||||
* 都会留在内存里。整页重载一次把这些一并清空,才算真正的退出 ——
|
||||
* 与 `utils/request.ts` 收到 401 时的处理是同一套。
|
||||
*
|
||||
* 本地身份数据(token / tokenExpiresAt / userInfo,其中 userInfo 里含 permissions)
|
||||
* 由 `loginStore.logout()` → `clearSession()` → `clearAuthStorage()` 删除。
|
||||
*/
|
||||
async function handleLogout() {
|
||||
if (loggingOut.value) return
|
||||
loggingOut.value = true
|
||||
accountMenuOpen.value = false
|
||||
|
||||
try {
|
||||
await ElMessageBox.confirm('退出后需要重新登录才能继续使用,确定退出当前账号吗?', '退出登录', {
|
||||
confirmButtonText: '退出登录',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
confirmButtonClass: 'logout-confirm-button',
|
||||
})
|
||||
} catch {
|
||||
// 用户点了取消,保持在当前页面
|
||||
return
|
||||
}
|
||||
|
||||
loggingOut.value = true
|
||||
try {
|
||||
await loginStore.logout()
|
||||
} catch {
|
||||
// 即使服务暂时不可用,也要清理本地会话。
|
||||
} finally {
|
||||
loggingOut.value = false
|
||||
await router.push('/login')
|
||||
// 服务端注销失败不阻断退出:本地会话已在 logout() 的 finally 里清理
|
||||
}
|
||||
|
||||
// 用 replace 而不是 assign:退出后按浏览器后退不该再回到已登录页面
|
||||
window.location.replace('/login')
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user