andyesfly
2534723842
1. 调整仪表盘图标从DeviceOutlined为MonitorOutlined 2. 新增403无权访问页面与路由配置 3. 完善权限存储与路由守卫逻辑 4. 修复用户信息获取与token持久化问题 5. 补充普通管理员权限初始化与补丁脚本 6. 优化后端用户服务与认证控制器逻辑 7. 调整登录表单交互与请求流程
81 lines
1.6 KiB
Vue
81 lines
1.6 KiB
Vue
<template>
|
||
<div class="forbidden-container">
|
||
<div class="forbidden-content">
|
||
<div class="forbidden-icon">
|
||
<LockOutlined />
|
||
</div>
|
||
<h1 class="forbidden-title">403</h1>
|
||
<p class="forbidden-desc">抱歉，您没有访问此页面的权限</p>
|
||
<p class="forbidden-hint">如需访问，请联系管理员分配相应权限</p>
|
||
<a-button type="primary" @click="goBack">
|
||
<ArrowLeftOutlined />
|
||
返回登录
|
||
</a-button>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { useRouter } from 'vue-router'
|
||
import { LockOutlined, ArrowLeftOutlined } from '@ant-design/icons-vue'
|
||
import { Button } from 'ant-design-vue'
|
||
|
||
const router = useRouter()
|
||
|
||
function goBack() {
|
||
router.push('/login')
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
.forbidden-container {
|
||
min-height: 100vh;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background: #f5f5f5;
|
||
}
|
||
|
||
.forbidden-content {
|
||
text-align: center;
|
||
padding: 60px 40px;
|
||
background: #fff;
|
||
border-radius: 12px;
|
||
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
|
||
}
|
||
|
||
.forbidden-icon {
|
||
width: 120px;
|
||
height: 120px;
|
||
margin: 0 auto 24px;
|
||
background: #fff2f0;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
:deep(.anticon) {
|
||
font-size: 64px;
|
||
color: #ff4d4f;
|
||
}
|
||
}
|
||
|
||
.forbidden-title {
|
||
font-size: 72px;
|
||
font-weight: 700;
|
||
color: #1f1f1f;
|
||
margin: 0 0 16px 0;
|
||
}
|
||
|
||
.forbidden-desc {
|
||
font-size: 16px;
|
||
color: #666;
|
||
margin: 0 0 8px 0;
|
||
}
|
||
|
||
.forbidden-hint {
|
||
font-size: 14px;
|
||
color: #999;
|
||
margin: 0 0 32px 0;
|
||
}
|
||
</style> |