update layout

This commit is contained in:
lb 2023-11-01 16:13:56 +08:00
parent d56becaf05
commit 75f8d75a7b
2 changed files with 119 additions and 7 deletions

View File

@ -23,11 +23,12 @@ export default function index() {
<NavMenu active={navActive} onChangeActive={(v) => setNavActive(v)} /> <NavMenu active={navActive} onChangeActive={(v) => setNavActive(v)} />
<Head /> <Head />
<SocketContextProvider> <SocketContextProvider>
{navActive == '窑炉总览' && <Home />}
{navActive == '质检统计' && <CheckInfo />}
{navActive == '退火监测' && <FireCheck />}
{navActive == '能耗分析' && <EnergyAnalysis />} {navActive == '能耗分析' && <EnergyAnalysis />}
{navActive == '窑炉内部' && <KilnInner />} {navActive != '能耗分析' && <Home active={navActive} />}
{/* {navActive == '窑炉总览' && <Home />} */}
{/* {navActive == '质检统计' && <CheckInfo />}
{navActive == '退火监测' && <FireCheck />}
{navActive == '窑炉内部' && <KilnInner />} */}
</SocketContextProvider> </SocketContextProvider>
</div> </div>
<Slider value={value} setValue={setValue} /> <Slider value={value} setValue={setValue} />

View File

@ -5,10 +5,116 @@ import CenterTopData from '../../components/模块组件/总览/CenterTop';
import V3DBG from '../../assets/V3DBG.png'; import V3DBG from '../../assets/V3DBG.png';
export default function Home() { const KilnTotalLeft = (props) => {
return (
<div
style={{
marginLeft: '40px',
width: '625px',
height: '100%',
background: '#fff3',
}}
>
窑炉总览LEFT
</div>
);
};
const KilnInnerLeft = (props) => {
return (
<div
className=""
style={{
marginLeft: '40px',
width: '625px',
height: '100%',
background: '#f003',
}}
>
窑炉内部LEFT
</div>
);
};
const FireCheckLeft = (props) => {
return (
<div
className=""
style={{
marginLeft: '40px',
width: '625px',
height: '100%',
background: '#00f3',
}}
>
退火监测LEFT
</div>
);
};
const QualityCheckLeft = (props) => {
return (
<div
className=""
style={{
marginLeft: '40px',
width: '625px',
height: '100%',
background: '#0f03',
}}
>
质检统计LEFT
</div>
);
};
const KilnTotalRight = (props) => {
return (
<div style={{ width: '625px', height: '100%', background: '#fff3' }}>
窑炉总览 Right
</div>
);
};
const KilnInnerRight = (props) => {
return (
<div
className=""
style={{ width: '625px', height: '100%', background: '#f003' }}
>
窑炉内部LEFT
</div>
);
};
const FireCheckRight = (props) => {
return (
<div
className=""
style={{ width: '625px', height: '100%', background: '#00f3' }}
>
退火监测LEFT
</div>
);
};
const QualityCheckRight = (props) => {
return (
<div
className=""
style={{ width: '625px', height: '100%', background: '#0f03' }}
>
质检统计LEFT
</div>
);
};
export default function Home({ active }) {
console.log('home', active);
return ( return (
<div className="Main"> <div className="Main">
<LeftBar /> {/* {active == '窑炉总览' && <KilnTotalLeft />} */}
{active == '窑炉总览' && <LeftBar />}
{active == '窑炉内部' && <KilnInnerLeft />}
{active == '退火监测' && <FireCheckLeft />}
{active == '质检统计' && <QualityCheckLeft />}
{/* <LeftBar /> */}
<div className="Center"> <div className="Center">
<div className="CenterData"> <div className="CenterData">
<CenterTopData /> <CenterTopData />
@ -19,7 +125,12 @@ export default function Home() {
<BottomBar /> <BottomBar />
</div> </div>
</div> </div>
<RightBar />
{active == '窑炉总览' && <RightBar />}
{active == '窑炉内部' && <KilnInnerRight />}
{active == '退火监测' && <FireCheckRight />}
{active == '质检统计' && <QualityCheckRight />}
{/* <RightBar /> */}
</div> </div>
); );
} }