生产管理系统前端-1.修复两处滚动条 2.尽可能缩小菜单收缩，并且删除面包屑

crop-x/src/components/layouts/SideBar/SideBarOld.tsx

@@ -229,44 +229,30 @@ export function SideBarOld({
     // 使用 Next.js 标准路由跳转
     router.push(path);
   };
-
-  // 获取当前页面的面包屑
-  const getCurrentBreadcrumb = () => {
-    const allItems: { label: string; path?: string }[] = [];
-
-    menus.forEach(menu => {
-      if (menu.children?.some(child => child.path === currentPath)) {
-        allItems.push({ label: menu.label });
-        const activeChild = menu.children.find(child => child.path === currentPath);
-        if (activeChild) {
-          allItems.push({ label: activeChild.label });
-        }
-      }
-    });
-
-    return allItems;
-  };
   return (
-    <div className="flex h-screen bg-gray-100 bodySon2">
+    <div className="flex h-full bg-gray-100">
-      {/* 左侧导航栏 */}
+      {/* 左侧导航栏 - 独立滚动 */}
-      <LeftSidebar
+      <div className="sidebarScroll">
-        menus={menus}
+        <LeftSidebar
-        activePath={currentPath}
+          menus={menus}
-        onNavigate={handleNavigate}
+          activePath={currentPath}
-        isMobile={isMobile}
+          onNavigate={handleNavigate}
-        isCollapsed={!isMobile && isCollapsed}
+          isMobile={isMobile}
-        onToggleCollapse={() => setIsCollapsed(!isCollapsed)}
+          isCollapsed={!isMobile && isCollapsed}
-      />
+          onToggleCollapse={() => setIsCollapsed(!isCollapsed)}
+        />
+      </div>
 
-      {/* 右侧主内容 */}
+      {/* 右侧主内容 - 独立滚动 */}
-      <MainContent
+      <div className="flex-1 contentScroll">
-        breadcrumb={getCurrentBreadcrumb()}
+        <MainContent
-        isMobile={isMobile}
+          isMobile={isMobile}
-        sidebarOpen={!isCollapsed}
+          sidebarOpen={!isCollapsed}
-        onToggleSidebar={() => setIsCollapsed(!isCollapsed)}
+          onToggleSidebar={() => setIsCollapsed(!isCollapsed)}
-      >
+        >
-        {children}
+          {children}
-      </MainContent>
+        </MainContent>
+      </div>
     </div>
   );
 }

crop-x/src/components/layouts/SideBar/components/LeftSidebar.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useState, useEffect } from 'react';
-import { ChevronDown, ChevronRight, Menu, X } from 'lucide-react';
+import { ChevronDown, ChevronLeft, ChevronRight, Menu, X } from 'lucide-react';
 import { cn } from '@/lib/utils';
 
 interface MenuItem {
@@ -82,23 +82,29 @@ export function LeftSidebar({
         isCollapsed ? "w-16" : "w-64"
       )}
     >
-      {/* 头部 */}
+      {/* 头部 - 缩小高度 */}
-      <div className="p-4 border-b border-gray-200">
+      <div className="px-2 py-1 border-b border-gray-200">
         <div className="flex items-center justify-between">
           <h2 className={cn(
-            "font-semibold text-gray-900 transition-all duration-300",
+            "font-medium text-gray-900 text-sm transition-all duration-300",
             isCollapsed ? "hidden" : "block"
           )}>
             导航菜单
           </h2>
           {isMobile ? (
-            <X className="w-5 h-5 text-gray-600" />
+            <X className="w-4 h-4 text-gray-600" />
           ) : (
+            /* 根据侧边栏状态显示不同按钮 */
             <button
               onClick={onToggleCollapse}
-              className="p-1 rounded-md hover:bg-gray-100 transition-colors"
+              className="p-1 rounded hover:bg-gray-100 transition-colors"
+              title={isCollapsed ? "展开菜单" : "收起菜单"}
             >
-              <Menu className="w-5 h-5 text-gray-600" />
+              {isCollapsed ? (
+                <ChevronRight className="w-4 h-4 text-gray-600" />
+              ) : (
+                <ChevronLeft className="w-4 h-4 text-gray-600" />
+              )}
             </button>
           )}
         </div>

crop-x/src/components/layouts/SideBar/components/MainContent.tsx

@@ -1,28 +1,21 @@
 'use client';
 
 import { useState } from 'react';
-import { Menu, X, ChevronRight, Home, FileText, Settings } from 'lucide-react';
+import { ChevronLeft, ChevronRight, X } from 'lucide-react';
 import { cn } from '@/lib/utils';
 
 interface MainContentProps {
-  title?: string;
   children: React.ReactNode;
   isMobile?: boolean;
   sidebarOpen?: boolean;
   onToggleSidebar?: () => void;
-  breadcrumb?: {
-    label: string;
-    path?: string;
-  }[];
 }
 
 export function MainContent({
-  title = "当前页面",
   children,
   isMobile = false,
   sidebarOpen = false,
   onToggleSidebar,
-  breadcrumb = []
 }: MainContentProps) {
   const [showMobileSidebar, setShowMobileSidebar] = useState(false);
 
@@ -44,65 +37,11 @@ export function MainContent({
         />
       )}
 
-      {/* 主内容区域 */}
+      {/* 主内容区域 - 去掉顶部白色横条 */}
-      <div className="flex-1 flex flex-col bg-gray-50">
+      <div className="flex-1 flex flex-col">
-        {/* 顶部导航栏 */}
+        <div className="p-6">
-        <header className="bg-white border-b border-gray-200 px-4 py-3">
+          {children}
-          <div className="flex items-center justify-between">
+        </div>
-            <div className="flex items-center gap-3">
-              {/* 菜单按钮 */}
-              <button
-                onClick={handleToggleSidebar}
-                className="p-2 rounded-md hover:bg-gray-100 transition-colors"
-              >
-                {isMobile ? (
-                  showMobileSidebar ? (
-                    <X className="w-5 h-5 text-gray-600" />
-                  ) : (
-                    <Menu className="w-5 h-5 text-gray-600" />
-                  )
-                ) : (
-                  <Menu className="w-5 h-5 text-gray-600" />
-                )}
-              </button>
-
-              {/* 面包屑导航 */}
-              <div className="flex items-center gap-2">
-                <Home className="w-4 h-4 text-gray-500" />
-                {breadcrumb.length > 0 ? (
-                  breadcrumb.map((item, index) => (
-                    <div key={index} className="flex items-center gap-2">
-                      <ChevronRight className="w-4 h-4 text-gray-400" />
-                      {item.path ? (
-                        <a
-                          href={item.path}
-                          className="text-sm text-gray-600 hover:text-gray-900 transition-colors"
-                        >
-                          {item.label}
-                        </a>
-                      ) : (
-                        <span className="text-sm text-gray-900 font-medium">
-                          {item.label}
-                        </span>
-                      )}
-                    </div>
-                  ))
-                ) : (
-                  <span className="text-sm text-gray-900 font-medium">{title}</span>
-                )}
-              </div>
-            </div>
-
-          </div>
-        </header>
-
-        {/* 主内容区域 */}
-        <main className="flex-1 overflow-auto">
-          <div className="p-6">
-            {/* 页面内容 */}
-            {children}
-          </div>
-        </main>
       </div>
     </>
   );

crop-x/src/styles/body.css

@@ -6,5 +6,16 @@
 
 .bodySon2{
     flex: 1;
-    overflow: auto;
+    min-height: 0;
+    /* 移除整体滚动，让子元素独立滚动 */
+}
+
+.sidebarScroll{
+    height: 100%;
+    overflow-y: auto;
+}
+
+.contentScroll{
+    height: 100%;
+    overflow-y: auto;
 }