菜单权限

src/components/Layout/Header.jsx

@@ -20,11 +20,11 @@ const Header = ({ collapsed, setCollapsed }) => {
   };
 
   const userMenuItems = [
-    {
-      key: "profile",
-      icon: <UserOutlined />,
-      label: "个人信息",
-    },
+    // {
+    //   key: "profile",
+    //   icon: <UserOutlined />,
+    //   label: "个人信息",
+    // },
     {
       key: "logout",
       icon: <LogoutOutlined />,

src/components/Layout/Sidebar.jsx

@@ -1,8 +1,8 @@
-import React, { useMemo } from "react";
+import React, { useMemo,useEffect } from "react";
 import { Layout, Menu } from "antd";
 import { useNavigate, useLocation } from "react-router-dom";
 import { useTheme } from "@/contexts/ThemeContext";
-import { getMenuItems } from "@/utils/menuUtils";
+import {  getMenuItems } from "@/utils/menuUtils";
 import { Logo } from "@/components/Layout/Logo";
 import { useAuth } from "@/contexts/AuthContext";
 
@@ -14,12 +14,13 @@ const Sidebar = ({ collapsed }) => {
   const { isDarkMode } = useTheme();
   const { user } = useAuth();
 
-  const menuItems = useMemo(() => {
-    if (!user?.id) return [];
-    const { adminRole: role } = user;
-    return getMenuItems(role);
+  const menuClient = useMemo(() => {
+    if (!user?.id||user.menukeys?.length===0) return [];
+    return getMenuItems(user?.menukeys || []);
   }, [user]);
-
+useEffect(()=>{
+  console.log(menuClient,'menuClient');
+},[menuClient])
   const defaultOpenKeys = useMemo(() => {
     const pathSegments = location.pathname.split("/").filter(Boolean);
     return pathSegments.reduce((acc, _, index) => {
@@ -29,7 +30,6 @@ const Sidebar = ({ collapsed }) => {
     }, []);
   }, [location.pathname]);
 
-  // Handle menu item click
   const handleMenuClick = ({ key }) => {
     navigate(key);
   };
@@ -41,8 +41,8 @@ const Sidebar = ({ collapsed }) => {
       collapsed={collapsed}
       theme={isDarkMode ? "dark" : "light"}
       width={256}
-      collapsedWidth={80} // 添加这个属性
-      className={`app-sidebar ${collapsed ? "collapsed" : ""}`} // 添加collapsed类名
+      collapsedWidth={80} 
+      className={`app-sidebar ${collapsed ? "collapsed" : ""}`} 
     >
       <Logo collapsed={collapsed} isDarkMode={isDarkMode} />
       <Menu
@@ -50,7 +50,7 @@ const Sidebar = ({ collapsed }) => {
         mode="inline"
         selectedKeys={[location.pathname]}
         defaultOpenKeys={defaultOpenKeys}
-        items={menuItems}
+        items={menuClient}
         onClick={handleMenuClick}
       />
     </Sider>

src/components/auth/ProtectedRoute.jsx

@@ -1,24 +1,27 @@
 import React from "react";
 import { Navigate, useLocation } from "react-router-dom";
 import { useAuth } from "@/contexts/AuthContext";
-import { Spin } from "antd";
 
+const PUBLIC_PATHS = ['login', '404'];
 export const ProtectedRoute = ({ children }) => {
-  const { user, loading } = useAuth();
+  const { user } = useAuth();
   const location = useLocation();
-  if (loading) {
-    return (
-      <div className="min-h-screen flex items-center justify-center">
-        <Spin size="large" />
-      </div>
-    );
+  const currentPath = location.pathname.replace(/^\//, '');
+  if (PUBLIC_PATHS.includes(currentPath) || currentPath === '*') {
+    return children;
+  }
+  if (user?.id) {
+    const hasPermission = user.menukeys?.some(key => {
+      return currentPath === key || currentPath.startsWith(`${key}/`);
+    });
+
+    if (!hasPermission ) {
+      return <Navigate to="/404" replace />;
+    }
+
+    return children;
   }
 
-  if (!user?.id) {
-    return (
-      <Navigate to={`/login?redirectTo=${location.pathname || ""}`} replace />
-    );
-  }
-
-  return children;
+  // 如果用户未登录，重定向到登录页
+  return <Navigate to="/login" state={{ from: location }} replace />;
 };