82 lines
2.3 KiB
JavaScript
82 lines
2.3 KiB
JavaScript
/*
|
|
* @Author: zhp
|
|
* @Date: 2024-08-20 14:09:17
|
|
* @LastEditTime: 2024-09-09 14:58:53
|
|
* @LastEditors: zhp
|
|
* @Description:
|
|
*/
|
|
import "./global.css";
|
|
import "./index.css";
|
|
import Head from "./components/Common/Company";
|
|
import useSlider, { Slider } from "./hooks/useSlider";
|
|
import NavMenu from "./components/Common/NavMenu";
|
|
import { useEffect, useState } from "react";
|
|
import Home from "./pages/Home";
|
|
import EnergyAnalysis from "./pages/EnergyCostAnalysis";
|
|
import RulerContainer from "./components/Tools/Ruler";
|
|
import { Switch } from "antd";
|
|
import { createPortal } from "react-dom";
|
|
|
|
const Menus = ["窑炉总览", "窑炉内部", "AI窑炉","退火监测", "质检统计", "能耗分析"];
|
|
const LUNBO_INTERVAL = 60 * 1000;
|
|
function App() {
|
|
const { styles, value, setValue } = useSlider(100);
|
|
const [navActive, setNavActive] = useState("窑炉总览");
|
|
const [lunbo, setlunbo] = useState(false);
|
|
|
|
useEffect(() => {
|
|
let timer;
|
|
if (lunbo) {
|
|
timer = setInterval(() => {
|
|
handleMenuChange(Menus[(Menus.indexOf(navActive) + 1) % Menus.length]);
|
|
}, LUNBO_INTERVAL);
|
|
}
|
|
return () => {
|
|
clearInterval(timer);
|
|
};
|
|
}, [lunbo, navActive]);
|
|
|
|
function handleSwitchChange(val) {
|
|
setlunbo(val);
|
|
}
|
|
|
|
function handleMenuChange(value) {
|
|
setNavActive(value);
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<div id="FullScreen" style={{ ...styles, overflow: "hidden" }}>
|
|
<NavMenu active={navActive} onChangeActive={handleMenuChange} />
|
|
<Head />
|
|
<div
|
|
className="lunbo-setting"
|
|
style={{
|
|
position: "fixed",
|
|
top: "48px",
|
|
right: "680px",
|
|
display: "flex",
|
|
alignItems: "center",
|
|
gap: "16px",
|
|
}}
|
|
>
|
|
<span style={{ fontSize: "20px", color: "#00fff7" }}>模块轮播</span>
|
|
<Switch
|
|
className="lunbo-btn"
|
|
size="small"
|
|
value={lunbo}
|
|
onChange={handleSwitchChange}
|
|
/>
|
|
</div>
|
|
{navActive == "能耗分析" && <EnergyAnalysis />}
|
|
{navActive == "能耗分析" && <div className="bgDitu"></div>}
|
|
{navActive != "能耗分析" && <Home active={navActive} />}
|
|
</div>
|
|
<Slider value={value} setValue={setValue} />
|
|
{createPortal(<RulerContainer />, document.body)}
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default App;
|