refactor: 优化权限管理与登录流程,修复细节问题

1.  调整仪表盘图标从DeviceOutlined为MonitorOutlined
2.  新增403无权访问页面与路由配置
3.  完善权限存储与路由守卫逻辑
4.  修复用户信息获取与token持久化问题
5.  补充普通管理员权限初始化与补丁脚本
6.  优化后端用户服务与认证控制器逻辑
7.  调整登录表单交互与请求流程
This commit is contained in:
andyesfly committed 2026-05-28 16:25:26 +08:00
1 parent 3d7eb12103
commit 2534723842
9 files changed
+259 -50

No files matched your search

+31 -17
View File
@@ -20,7 +20,7 @@
<a-form ref="formRef" :model="formState" :rules="rules" size="large" @finish="handleLogin">
<a-form-item name="username">
<a-input ref="usernameInputRef" v-model:value="formState.username" placeholder="请输入用户名" allow-clear
:disabled="loading" @pressEnter="focusPassword">
:disabled="loading" @pressEnter="handlePasswordEnter">
<template #prefix>
<UserOutlined class="input-icon" />
</template>
@@ -29,7 +29,7 @@
<a-form-item name="password">
<a-input-password ref="passwordInputRef" v-model:value="formState.password" placeholder="请输入密码" allow-clear
:disabled="loading" @pressEnter="submitForm">
:disabled="loading" @pressEnter="handleLogin">
<template #prefix>
<LockOutlined class="input-icon" />
</template>
@@ -68,6 +68,7 @@
import { reactive, ref, onMounted, nextTick } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { message } from 'ant-design-vue'
import axios from 'axios'
import {
UserOutlined,
LockOutlined,
@@ -112,33 +113,46 @@ onMounted(() => {
})
})
function focusPassword() {
function handlePasswordEnter() {
passwordInputRef.value?.focus()
}
function submitForm() {
formRef.value?.submit()
}
async function handleLogin() {
try {
loading.value = true
await permissionStore.login(formState.username, formState.password)
const response = await axios.post('/api/auth/login', {
username: formState.username,
password: formState.password
})
if (formState.rememberMe) {
localStorage.setItem('remembered_username', formState.username)
} else {
localStorage.removeItem('remembered_username')
}
const res = response.data
message.success('登录成功!')
if (res.code === 200) {
const { accessToken, refreshToken, userInfo } = res.data
localStorage.setItem('access_token', accessToken)
localStorage.setItem('refresh_token', refreshToken)
permissionStore.setToken(accessToken)
permissionStore.setUserInfo(userInfo)
permissionStore.setPermissions(userInfo.permissions || [])
if (formState.rememberMe) {
localStorage.setItem('remembered_username', formState.username)
} else {
localStorage.removeItem('remembered_username')
}
message.success('登录成功!')
setTimeout(() => {
const redirect = (route.query.redirect as string) || '/'
router.push(redirect)
}, 500)
} else {
throw new Error(res.message || '登录失败')
}
} catch (error: any) {
console.error('登录失败:', error)
message.error(error.message || '登录失败,请检查用户名和密码')
formState.password = ''
nextTick(() => {
@@ -344,4 +358,4 @@ async function handleLogin() {
color: rgba(255, 255, 255, 0.5);
}
}
</style>
</style>