基于 shiy-temp分支修改

app/components/layout/Sidebar.tsx

@@ -23,7 +23,7 @@ interface SidebarProps {
 const APP_MENU_MAP = {
   'contract': ['home', 'contract-template', 'file-management', 'rule-management', 'system-settings'],
   'record': ['home', 'file-management', 'rule-management', 'system-settings'],
-  'model': ['home']
+  'model': ['chat-with-llm']
 };
 
 // 应用模块名称映射
@@ -45,7 +45,7 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
   const [expandedMenus, setExpandedMenus] = useState<Record<string, boolean>>({});
   const [currentApp, setCurrentApp] = useState<string>(selectedApp);
   const navigate = useNavigate();
-  
+
   // 组件挂载后从 sessionStorage 读取初始 reviewType
   useEffect(() => {
     try {
@@ -58,7 +58,7 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
       console.error('读取 reviewType 失败:', error);
     }
   }, []);
-  
+
   // 从 sessionStorage 获取 reviewType 并设置当前应用模块
   useEffect(() => {
     // 监听 sessionStorage 变化（主要用于多标签页情况）
@@ -67,15 +67,15 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
         setCurrentApp(e.newValue);
       }
     };
-    
+
     // 添加事件监听器
     window.addEventListener('storage', handleStorageChange);
-    
+
     return () => {
       window.removeEventListener('storage', handleStorageChange);
     };
   }, []);
-  
+
   // 监听路由变化，重新检查 reviewType
   useEffect(() => {
     try {
@@ -88,14 +88,14 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
       console.error('路由变化时读取 reviewType 失败:', error);
     }
   }, [location.pathname]);
-  
+
   // 监听 selectedApp 属性变化
   useEffect(() => {
     if (selectedApp) {
       setCurrentApp(selectedApp);
     }
   }, [selectedApp]);
-  
+
   const menuItems: MenuItem[] = [
     {
       id: 'home',
@@ -103,6 +103,12 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
       path: '/home',
       icon: 'ri-home-line'
     },
+    {
+      id: 'chat-with-llm',
+      title: 'AI对话',
+      path: '/chat-with-llm',
+      icon: 'ri-chat-smile-2-line'
+    },
     {
       id: 'file-management',
       title: '文件管理',
@@ -116,10 +122,10 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
           icon: 'ri-upload-cloud-line'
         },
         {
-          id:'documents',
-          title:'文档列表',
-          path:'/documents',
-          icon:'ri-file-list-3-line'
+          id: 'documents',
+          title: '文档列表',
+          path: '/documents',
+          icon: 'ri-file-list-3-line'
         }
       ]
     },
@@ -219,7 +225,7 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
       ]
     }
   ];
-  
+
   // 初始化展开状态，默认全部展开
   useEffect(() => {
     const initialExpandedState: Record<string, boolean> = {};
@@ -230,23 +236,23 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
     });
     setExpandedMenus(initialExpandedState);
   }, []);
-  
+
   const toggleMenu = (id: string, e: React.MouseEvent) => {
     // 我们只防止事件冒泡，不阻止默认行为
     e.stopPropagation();
-    
+
     // console.log('父菜单展开/折叠:', id);
-    
+
     setExpandedMenus(prev => ({
       ...prev,
       [id]: !prev[id]
     }));
   };
-  
+
   const isActive = (path: string) => {
     return location.pathname === path || location.pathname.startsWith(`${path}/`);
   };
-  
+
   // 处理侧边栏切换事件
   const handleToggleSidebar = (e: React.MouseEvent) => {
     // console.log('侧边栏折叠/展开');
@@ -254,7 +260,7 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
     e.stopPropagation();
     onToggle();
   };
-  
+
   // 处理子菜单项点击事件
   const handleSubMenuClick = (child: MenuItem, e: React.MouseEvent) => {
     // 只需要阻止冒泡，不阻止默认行为
@@ -272,15 +278,15 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
     if (item.requiredRole && item.requiredRole !== userRole) {
       return false;
     }
-    
+
     // 检查当前菜单是否在所选应用模式中显示
     if (!visibleMenuIds.includes(item.id)) {
       return false;
     }
-    
+
     return true;
   });
-  
+
   return (
     <div className={`sidebar ${collapsed ? 'collapsed' : ''}`}>
       <div className="py-6 px-4 border-b border-gray-100 flex justify-between items-center">
@@ -300,7 +306,7 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
           <img src="/logo.svg" alt="智慧法务" className="w-12 h-12 mr-2" />
           {!collapsed && <h2 className="text-lg font-medium">智慧法务</h2>}
         </div>
-        <button 
+        <button
           className="sidebar-toggle"
           onClick={handleToggleSidebar}
           aria-label={collapsed ? "展开侧边栏" : "折叠侧边栏"}
@@ -309,7 +315,7 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
           <i className={`${collapsed ? 'ri-menu-unfold-line' : 'ri-menu-fold-line'}`}></i>
         </button>
       </div>
-      
+
       {!collapsed && (
         <div className="px-4 py-3 border-b border-gray-100">
           <div className="flex items-center text-green-700">
@@ -318,7 +324,7 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
           </div>
         </div>
       )}
-      
+
       <div className="py-4 px-[10px]">
         {filteredMenuItems.map((item) => (
           <div key={item.id} className={`${collapsed ? 'px-0' : ''}`}>
@@ -337,7 +343,7 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
               </Link>
             ) : (
               <>
-                <div 
+                <div
                   className={`sidebar-menu-item flex items-center ${collapsed ? 'justify-center' : 'justify-between'} cursor-pointer z-10`}
                   onClick={(e) => {
                     // console.log('%c父菜单点击 ===> ', 'background: #722ed1; color: white; padding: 2px 4px; border-radius: 2px;', item.title);
@@ -362,25 +368,25 @@ export function Sidebar({ onToggle, collapsed, userRole, selectedApp = 'contract
                     <i className={`ri-arrow-${expandedMenus[item.id] ? 'down' : 'right'}-s-line`}></i>
                   )}
                 </div>
-                
+
                 {(expandedMenus[item.id] || collapsed) && (
-                  <div 
+                  <div
                     className={`submenu-container ${collapsed ? 'border-l-0 pl-0' : 'border-l border-gray-100 ml-4 pl-3'} z-20`}
                     id={`submenu-${item.id}`}
                   >
                     {item.children
                       .filter(child => !child.requiredRole || child.requiredRole === userRole)
                       .map((child) => (
-                      <Link
-                        key={child.id}
-                        to={child.path}
-                        className={`sidebar-menu-item ${isActive(child.path) ? 'active' : ''} flex items-center ${collapsed ? 'justify-center' : ''}`}
-                        onClick={(e) => handleSubMenuClick(child, e)}
-                      >
-                        <i className={`${child.icon} ${collapsed ? 'text-xl' : 'mr-3'}`}></i>
-                        {!collapsed && <span>{child.title}</span>}
-                      </Link>
-                    ))}
+                        <Link
+                          key={child.id}
+                          to={child.path}
+                          className={`sidebar-menu-item ${isActive(child.path) ? 'active' : ''} flex items-center ${collapsed ? 'justify-center' : ''}`}
+                          onClick={(e) => handleSubMenuClick(child, e)}
+                        >
+                          <i className={`${child.icon} ${collapsed ? 'text-xl' : 'mr-3'}`}></i>
+                          {!collapsed && <span>{child.title}</span>}
+                        </Link>
+                      ))}
                   </div>
                 )}
               </>