Blame view

美国版/Food Labeling Management Platform/src/components/layout/Layout.tsx 1.33 KB
884054fb   “wangming”   项目初始化
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
  import React from 'react';
  import { ChevronRight } from 'lucide-react';
  import { Sidebar } from './Sidebar';
  import { Header } from './Header';
  
  interface LayoutProps {
    children: React.ReactNode;
    currentView: string;
    setCurrentView: (view: string) => void;
  }
  
  export function Layout({ children, currentView, setCurrentView }: LayoutProps) {
    return (
      <div className="flex h-screen bg-gray-50 overflow-hidden font-sans">
        <Sidebar currentView={currentView} setCurrentView={setCurrentView} />
        <div className="flex-1 flex flex-col min-w-0 overflow-hidden">
          <Header title={currentView} />
          <div className="px-8 mt-8 shrink-0">
            <nav className="flex items-center gap-2 text-sm font-normal" aria-label="Breadcrumb">
              <button
                type="button"
                onClick={() => setCurrentView('Dashboard')}
                className="text-gray-500 hover:text-gray-700 transition-colors"
              >
                Home
              </button>
              <ChevronRight className="w-4 h-4 text-gray-500 shrink-0" />
              <span style={{ color: 'rgb(43, 50, 143)' }}>{currentView}</span>
            </nav>
          </div>
          <main className="flex-1 overflow-y-auto p-8">
            <div className="w-full h-full">
              {children}
            </div>
          </main>
        </div>
      </div>
    );
  }