884054fb
“wangming”
项目初始化
|
1
2
3
4
|
import React from 'react';
import { ChevronRight } from 'lucide-react';
import { Sidebar } from './Sidebar';
import { Header } from './Header';
|
699ea6e8
杨鑫
完善打印逻辑
|
5
|
import type { CurrentUserMenuNodeDto } from '../../types/authSession';
|
884054fb
“wangming”
项目初始化
|
6
7
8
9
10
|
interface LayoutProps {
children: React.ReactNode;
currentView: string;
setCurrentView: (view: string) => void;
|
699ea6e8
杨鑫
完善打印逻辑
|
11
12
|
menus?: CurrentUserMenuNodeDto[];
onLogout?: () => void;
|
ef6b3255
杨鑫
修改BUG
|
13
14
|
/** 点击顶栏右上角当前用户区域 */
onProfileClick?: () => void;
|
63289723
杨鑫
提交
|
15
16
|
/** 标签模板编辑器全屏:隐藏侧栏与顶栏,主内容占满视口 */
hideAppChrome?: boolean;
|
884054fb
“wangming”
项目初始化
|
17
18
|
}
|
63289723
杨鑫
提交
|
19
20
21
22
23
24
|
export function Layout({
children,
currentView,
setCurrentView,
menus,
onLogout,
|
ef6b3255
杨鑫
修改BUG
|
25
|
onProfileClick,
|
63289723
杨鑫
提交
|
26
27
|
hideAppChrome = false,
}: LayoutProps) {
|
884054fb
“wangming”
项目初始化
|
28
29
|
return (
<div className="flex h-screen bg-gray-50 overflow-hidden font-sans">
|
63289723
杨鑫
提交
|
30
31
32
|
{!hideAppChrome && (
<Sidebar currentView={currentView} setCurrentView={setCurrentView} menus={menus} onLogout={onLogout} />
)}
|
6ce07406
杨鑫
提交
|
33
34
35
36
37
38
39
40
41
42
43
|
<div
className="flex min-w-0 flex-1 flex-col overflow-hidden"
style={{
flex: "1 1 0%",
minHeight: 0,
minWidth: 0,
display: "flex",
flexDirection: "column",
overflow: "hidden",
}}
>
|
63289723
杨鑫
提交
|
44
45
|
{!hideAppChrome && (
<>
|
ef6b3255
杨鑫
修改BUG
|
46
47
|
<Header
title={currentView}
|
540ac0e3
杨鑫
前端修改bug
|
48
49
|
menus={menus}
onNavigate={setCurrentView}
|
ef6b3255
杨鑫
修改BUG
|
50
51
52
|
onSettingsClick={() => setCurrentView('Support')}
onProfileClick={onProfileClick}
/>
|
63289723
杨鑫
提交
|
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
<div className="mt-8 shrink-0 px-8">
<nav className="flex items-center gap-2 text-sm font-normal" aria-label="Breadcrumb">
<button
type="button"
onClick={() => setCurrentView('Dashboard')}
className="text-gray-500 transition-colors hover:text-gray-700"
>
Home
</button>
<ChevronRight className="h-4 w-4 shrink-0 text-gray-500" />
<span style={{ color: 'rgb(43, 50, 143)' }}>{currentView}</span>
</nav>
</div>
</>
)}
<main
className={
hideAppChrome
|
6ce07406
杨鑫
提交
|
71
72
73
74
75
76
77
78
79
80
81
82
83
84
|
? "flex flex-1 flex-col overflow-hidden p-0"
: "flex-1 overflow-y-auto p-8"
}
style={
hideAppChrome
? {
flex: "1 1 0%",
minHeight: 0,
display: "flex",
flexDirection: "column",
overflow: "hidden",
padding: 0,
}
: { flex: "1 1 0%", minHeight: 0, minWidth: 0 }
|
63289723
杨鑫
提交
|
85
86
|
}
>
|
6ce07406
杨鑫
提交
|
87
88
89
90
91
92
93
94
95
96
97
98
99
|
<div
className="flex w-full min-w-0 flex-1 flex-col"
style={{
flex: "1 1 0%",
minHeight: 0,
minWidth: 0,
width: "100%",
display: "flex",
flexDirection: "column",
}}
>
{children}
</div>
|
884054fb
“wangming”
项目初始化
|
100
101
102
103
104
|
</main>
</div>
</div>
);
}
|