update
This commit is contained in:
rodzic
4ce50704f3
commit
296a39c7f8
@ -1,6 +1,7 @@
|
||||
import { useCallback, useState } from 'react';
|
||||
import cls from './index.module.less';
|
||||
|
||||
export default function CenterMenu() {
|
||||
export default function CenterMenu({ active, onChangeActive }) {
|
||||
const menuList = [
|
||||
['窑炉总览', '/kilnSummary'],
|
||||
['窑炉内部', '/kilnInner'],
|
||||
@ -11,7 +12,11 @@ export default function CenterMenu() {
|
||||
return (
|
||||
<div className={`${cls.centerMenu} flex`}>
|
||||
{menuList.map((menu) => (
|
||||
<div key={menu[0]} className={cls.menuItem}>
|
||||
<div
|
||||
key={menu[0]}
|
||||
className={`${cls.menuItem} ${active == menu[0] ? cls.active : ''}`}
|
||||
onClick={() => onChangeActive(menu[0])}
|
||||
>
|
||||
{menu[0]}
|
||||
</div>
|
||||
))}
|
||||
|
@ -23,6 +23,7 @@
|
||||
'Source Han Sans SC', 'Noto Sans CJK SC', 'WenQuanYi Micro Hei', sans-serif;
|
||||
}
|
||||
|
||||
.menuItem.active,
|
||||
.menuItem:hover {
|
||||
color: #00fff7;
|
||||
}
|
||||
|
@ -1,5 +1,4 @@
|
||||
import React from 'react';
|
||||
import NavMenu from '../../../公共组件/导航菜单';
|
||||
import Item2 from './RightTable';
|
||||
import Item1 from './LeftBoxes';
|
||||
|
||||
@ -8,7 +7,6 @@ import cls from './index.module.less';
|
||||
export default function index() {
|
||||
return (
|
||||
<>
|
||||
<NavMenu />
|
||||
<div className="flex justify-between w-full h-full">
|
||||
<div className={cls.leftGrid}>
|
||||
<Item1 />
|
||||
|
@ -44,5 +44,5 @@ export default function useSlider(defaultSize) {
|
||||
};
|
||||
}, [value]);
|
||||
|
||||
return { styles, setValue };
|
||||
return { styles, value, setValue };
|
||||
}
|
||||
|
@ -7,17 +7,25 @@ import RightBar from '../components/模块组件/总览/RightSide';
|
||||
import CenterTopData from '../components/模块组件/总览/CenterTop';
|
||||
import { SocketContextProvider } from '../store/socket-data-provider';
|
||||
import useSlider, { Slider } from '../hooks/useSlider';
|
||||
|
||||
import NavMenu from '../components/公共组件/导航菜单';
|
||||
import V3DBG from '../assets/V3DBG.png';
|
||||
import { useState } from 'react';
|
||||
// import V3D from './V3D';
|
||||
import Home from './总览';
|
||||
import CheckInfo from './质检统计';
|
||||
import FireCheck from './退火监测';
|
||||
import EnergyAnalysis from './能耗分析';
|
||||
import KilnInner from './窑炉内部';
|
||||
|
||||
export default function index() {
|
||||
const { styles, setValue } = useSlider(75);
|
||||
const { styles, value, setValue } = useSlider(75);
|
||||
const [navActive, setNavActive] = useState('窑炉总览');
|
||||
|
||||
return (
|
||||
<>
|
||||
<SocketContextProvider>
|
||||
<div id="FullScreen" style={styles}>
|
||||
<div id="FullScreen" style={styles}>
|
||||
<NavMenu active={navActive} onChangeActive={(v) => setNavActive(v)} />
|
||||
<SocketContextProvider>
|
||||
<Head />
|
||||
<div className="Main">
|
||||
<LeftBar />
|
||||
@ -33,9 +41,9 @@ export default function index() {
|
||||
</div>
|
||||
<RightBar />
|
||||
</div>
|
||||
</div>
|
||||
<Slider setValue={setValue} />
|
||||
</SocketContextProvider>
|
||||
</SocketContextProvider>
|
||||
</div>
|
||||
<Slider value={value} setValue={setValue} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
3
src/pages/总览/index.jsx
Normal file
3
src/pages/总览/index.jsx
Normal file
@ -0,0 +1,3 @@
|
||||
export default function Home() {
|
||||
return <div>Home</div>;
|
||||
}
|
@ -1 +0,0 @@
|
||||
1
|
3
src/pages/窑炉内部/index.jsx
Normal file
3
src/pages/窑炉内部/index.jsx
Normal file
@ -0,0 +1,3 @@
|
||||
export default function KilnInner() {
|
||||
return <div>KilnInner</div>;
|
||||
}
|
@ -1 +0,0 @@
|
||||
1
|
3
src/pages/能耗分析/index.jsx
Normal file
3
src/pages/能耗分析/index.jsx
Normal file
@ -0,0 +1,3 @@
|
||||
export default function EnergyAnalysis() {
|
||||
return <div>EnergyAnalysis</div>;
|
||||
}
|
@ -1,2 +0,0 @@
|
||||
1
|
||||
1
|
3
src/pages/质检统计/index.jsx
Normal file
3
src/pages/质检统计/index.jsx
Normal file
@ -0,0 +1,3 @@
|
||||
export default function CheckInfo() {
|
||||
return <div>CheckInfo</div>;
|
||||
}
|
@ -1 +0,0 @@
|
||||
1
|
3
src/pages/退火监测/index.jsx
Normal file
3
src/pages/退火监测/index.jsx
Normal file
@ -0,0 +1,3 @@
|
||||
export default function FireCheck() {
|
||||
return <div>FireCheck</div>;
|
||||
}
|
Ładowanie…
Reference in New Issue
Block a user