|
@@ -3,24 +3,40 @@ import "./index.css"; |
|
|
import Head from "./components/Common/Company"; |
|
|
import Head from "./components/Common/Company"; |
|
|
import useSlider, { Slider } from "./hooks/useSlider"; |
|
|
import useSlider, { Slider } from "./hooks/useSlider"; |
|
|
import NavMenu from "./components/Common/NavMenu"; |
|
|
import NavMenu from "./components/Common/NavMenu"; |
|
|
import { useState } from "react"; |
|
|
|
|
|
|
|
|
import { useEffect, useState } from "react"; |
|
|
import Home from "./pages/Home"; |
|
|
import Home from "./pages/Home"; |
|
|
import EnergyAnalysis from "./pages/EnergyCostAnalysis"; |
|
|
import EnergyAnalysis from "./pages/EnergyCostAnalysis"; |
|
|
import RulerContainer from "./components/Tools/Ruler"; |
|
|
import RulerContainer from "./components/Tools/Ruler"; |
|
|
import { createPortal } from "react-dom"; |
|
|
import { createPortal } from "react-dom"; |
|
|
|
|
|
|
|
|
|
|
|
const Menus = ["窑炉总览", "窑炉内部", "退火监测", "质检统计", "能耗分析"]; |
|
|
|
|
|
|
|
|
function App() { |
|
|
function App() { |
|
|
const { styles, value, setValue } = useSlider(100); |
|
|
const { styles, value, setValue } = useSlider(100); |
|
|
const [navActive, setNavActive] = useState("窑炉总览"); |
|
|
const [navActive, setNavActive] = useState("窑炉总览"); |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
|
const timer = setInterval(() => { |
|
|
|
|
|
handleMenuChange(Menus[(Menus.indexOf(navActive) + 1) % Menus.length]); |
|
|
|
|
|
}, 10000); |
|
|
|
|
|
|
|
|
|
|
|
return () => { |
|
|
|
|
|
clearInterval(timer); |
|
|
|
|
|
}; |
|
|
|
|
|
}, [navActive]); |
|
|
|
|
|
|
|
|
|
|
|
function handleMenuChange(value) { |
|
|
|
|
|
setNavActive(value); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
<> |
|
|
<> |
|
|
<div id="FullScreen" style={{ ...styles, overflow: "hidden" }}> |
|
|
<div id="FullScreen" style={{ ...styles, overflow: "hidden" }}> |
|
|
<NavMenu active={navActive} onChangeActive={(v) => setNavActive(v)} /> |
|
|
|
|
|
|
|
|
<NavMenu active={navActive} onChangeActive={handleMenuChange} /> |
|
|
<Head /> |
|
|
<Head /> |
|
|
|
|
|
|
|
|
{navActive == "能耗分析" && <EnergyAnalysis />} |
|
|
{navActive == "能耗分析" && <EnergyAnalysis />} |
|
|
{navActive == "能耗分析" && <div className='bgDitu'></div>} |
|
|
|
|
|
|
|
|
{navActive == "能耗分析" && <div className="bgDitu"></div>} |
|
|
{navActive != "能耗分析" && <Home active={navActive} />} |
|
|
{navActive != "能耗分析" && <Home active={navActive} />} |
|
|
</div> |
|
|
</div> |
|
|
<Slider value={value} setValue={setValue} /> |
|
|
<Slider value={value} setValue={setValue} /> |
|
|