修复权限验证问题：普通用户无法访问后台管理页面

demo/frontend/src/router/index.js

@@ -1,38 +1,42 @@
 import { createRouter, createWebHistory } from 'vue-router'
 import { useUserStore } from '@/stores/user'
+import { ElMessage } from 'element-plus'
 
-// 路由组件
-import Home from '@/views/Home.vue'
-import Login from '@/views/Login.vue'
-import Register from '@/views/Register.vue'
-import Orders from '@/views/Orders.vue'
-import OrderDetail from '@/views/OrderDetail.vue'
-import OrderCreate from '@/views/OrderCreate.vue'
-import Payments from '@/views/Payments.vue'
-import PaymentCreate from '@/views/PaymentCreate.vue'
-import AdminOrders from '@/views/AdminOrders.vue'
-import AdminUsers from '@/views/AdminUsers.vue'
-import AdminDashboard from '@/views/AdminDashboard.vue'
-import Dashboard from '@/views/Dashboard.vue'
-import Welcome from '@/views/Welcome.vue'
-import Profile from '@/views/Profile.vue'
-import Subscription from '@/views/Subscription.vue'
-import MyWorks from '@/views/MyWorks.vue'
-import VideoDetail from '@/views/VideoDetail.vue'
-import TextToVideo from '@/views/TextToVideo.vue'
-import TextToVideoCreate from '@/views/TextToVideoCreate.vue'
-import ImageToVideo from '@/views/ImageToVideo.vue'
-import ImageToVideoCreate from '@/views/ImageToVideoCreate.vue'
-import StoryboardVideo from '@/views/StoryboardVideo.vue'
-import StoryboardVideoCreate from '@/views/StoryboardVideoCreate.vue'
-import MemberManagement from '@/views/MemberManagement.vue'
+// 路由组件 - 使用懒加载优化性能
+const Home = () => import('@/views/Home.vue')
+const Login = () => import('@/views/Login.vue')
+const Register = () => import('@/views/Register.vue')
+const Orders = () => import('@/views/Orders.vue')
+const OrderDetail = () => import('@/views/OrderDetail.vue')
+const OrderCreate = () => import('@/views/OrderCreate.vue')
+const Payments = () => import('@/views/Payments.vue')
+const PaymentCreate = () => import('@/views/PaymentCreate.vue')
+const AdminOrders = () => import('@/views/AdminOrders.vue')
+const AdminUsers = () => import('@/views/AdminUsers.vue')
+const AdminDashboard = () => import('@/views/AdminDashboard.vue')
+const Dashboard = () => import('@/views/Dashboard.vue')
+const Welcome = () => import('@/views/Welcome.vue')
+const Profile = () => import('@/views/Profile.vue')
+const Subscription = () => import('@/views/Subscription.vue')
+const MyWorks = () => import('@/views/MyWorks.vue')
+const VideoDetail = () => import('@/views/VideoDetail.vue')
+const TextToVideo = () => import('@/views/TextToVideo.vue')
+const TextToVideoCreate = () => import('@/views/TextToVideoCreate.vue')
+const ImageToVideo = () => import('@/views/ImageToVideo.vue')
+const ImageToVideoCreate = () => import('@/views/ImageToVideoCreate.vue')
+const StoryboardVideo = () => import('@/views/StoryboardVideo.vue')
+const StoryboardVideoCreate = () => import('@/views/StoryboardVideoCreate.vue')
+const MemberManagement = () => import('@/views/MemberManagement.vue')
+const SystemSettings = () => import('@/views/SystemSettings.vue')
+const GenerateTaskRecord = () => import('@/views/GenerateTaskRecord.vue')
+const HelloWorld = () => import('@/views/HelloWorld.vue')
 
 const routes = [
   {
     path: '/works',
     name: 'MyWorks',
     component: MyWorks,
-    meta: { title: '我的作品', requiresAuth: true }
+    meta: { title: '我的作品', requiresAuth: true, keepAlive: true }
   },
   {
     path: '/video/:id',
@@ -44,7 +48,7 @@ const routes = [
     path: '/text-to-video',
     name: 'TextToVideo',
     component: TextToVideo,
-    meta: { title: '文生视频', requiresAuth: true }
+    meta: { title: '文生视频', requiresAuth: true, keepAlive: true }
   },
   {
     path: '/text-to-video/create',
@@ -56,7 +60,7 @@ const routes = [
     path: '/image-to-video',
     name: 'ImageToVideo',
     component: ImageToVideo,
-    meta: { title: '图生视频', requiresAuth: true }
+    meta: { title: '图生视频', requiresAuth: true, keepAlive: true }
   },
   {
     path: '/image-to-video/create',
@@ -68,7 +72,7 @@ const routes = [
     path: '/storyboard-video',
     name: 'StoryboardVideo',
     component: StoryboardVideo,
-    meta: { title: '分镜视频', requiresAuth: true }
+    meta: { title: '分镜视频', requiresAuth: true, keepAlive: true }
   },
   {
     path: '/storyboard-video/create',
@@ -78,7 +82,7 @@ const routes = [
   },
   {
     path: '/',
-    redirect: '/welcome' // 重定向到欢迎页面
+    redirect: '/profile' // 重定向到个人主页
   },
   {
     path: '/welcome',
@@ -169,7 +173,31 @@ const routes = [
     name: 'MemberManagement',
     component: MemberManagement,
     meta: { title: '会员管理', requiresAuth: true, requiresAdmin: true }
-  }
+  },
+  {
+    path: '/system-settings',
+    name: 'SystemSettings',
+    component: SystemSettings,
+    meta: { title: '系统设置', requiresAuth: true, requiresAdmin: true }
+  },
+  {
+    path: '/generate-task-record',
+    name: 'GenerateTaskRecord',
+    component: GenerateTaskRecord,
+    meta: { title: '生成任务记录', requiresAuth: true, requiresAdmin: true }
+  },
+  {
+    path: '/api-management',
+    name: 'ApiManagement',
+    component: () => import('@/views/ApiManagement.vue'),
+    meta: { title: 'API管理', requiresAuth: true, requiresAdmin: true }
+  },
+  {
+    path: '/hello',
+    name: 'HelloWorld',
+    component: HelloWorld,
+    meta: { title: 'Hello World' }
+  },
 ]
 
 const router = createRouter({
@@ -190,7 +218,7 @@ router.beforeEach(async (to, from, next) => {
   try {
     const userStore = useUserStore()
     
-    // 初始化用户状态
+    // 优化：只在首次访问时初始化用户状态
     if (!userStore.initialized) {
       await userStore.init()
     }
@@ -208,8 +236,9 @@ router.beforeEach(async (to, from, next) => {
       
       // 检查管理员权限
       if (to.meta.requiresAdmin && !userStore.isAdmin) {
-        // 权限不足，跳转到首页
-        next('/home')
+        // 权限不足，跳转到个人主页并显示警告
+        ElMessage.warning('权限不足，只有管理员才能访问此页面')
+        next('/profile')
         return
       }
     }