修改

src/pages/Home/index.jsx

@@ -8,24 +8,37 @@ import KilnInnerLeft from "../../components/Modules/KilnInner/LeftSide"; // 窑
 import KilnInnerRight from "../../components/Modules/KilnInner/RightSide"; // 窑炉内部右侧内容
 import OptimizeCenter from "../../components/Modules/KilnOptimize/Center"; // 窑炉优化
 import KilnOptimizeLeft from "../../components/Modules/KilnOptimize/LeftSide"; // 窑炉优化左侧内容
+import KilnOptimizeLeftForecast from "../../components/Modules/KilnOptimize/LeftSide/indexForecast"; // 窑炉优化左侧内容
 import KilnOptimizeRight from "../../components/Modules/KilnOptimize/RightSide"; // 窑炉优化右侧内容
+import KilnOptimizeRightForecast from "../../components/Modules/KilnOptimize/forecastRightSide"; // 窑炉优化右侧内容
 import FireCheckLeft from "../../components/Modules/FireCheck/LeftSide";  // 退火监测 - 左边
 import QualityCheckLeft from "../../components/Modules/QualityCheck/LeftSide";  // 质检统计 - 左边
 import FireCheckRight from "../../components/Modules/FireCheck/RightSide";// 退火监测 - 右边
 import QualityCheckRight from "../../components/Modules/QualityCheck/RightSide";// 质检统计 - 右边
 import { useSelector } from "react-redux";
-import { useEffect, useRef } from "react";
+import { useEffect, useRef,useState,createContext } from "react";
 import useRefresh from "../../hooks/useRefresh";
 import TimeFireDir from "../../components/Common/TimeFireDir";
 
 import WarnAlertList from "../../components/Common/WarnAlert/ListContainer";
 
+export const HomeContext = createContext();
 export default function Home({ active }) {
   useRefresh(true);
 
   const videoUp = useRef(null);
   const videoDown = useRef(null);
+   const [floor, setFloor] = useState(null);
+  const handleFloorChangeFromKilnCenter = (newFloor) => {
+   console.log(newFloor)
+    setFloor(newFloor);
+  };
+   const [modelFlag, setModelFlag] = useState(false);
 
+  const handleValueFromGrandChild = (value) => {
+    setModelFlag(value);
+    console.log(modelFlag);
+  };
   const ctx = useSelector((state) => state.fireInfo);
   const fireDir = ctx.fireDirection || null;
 
@@ -66,13 +79,23 @@ export default function Home({ active }) {
         >
           {active == "窑炉总览" && <LeftBar key="kiln-total" />}
           {active == "窑炉内部" && <KilnInnerLeft key="kiln-inner" />}
-          {active == "窑炉优化" && <KilnOptimizeLeft key="kiln-optimize" />}
+            {active == "窑炉优化" && (
+          <>
+            {floor !== 4 && <KilnOptimizeLeft key="kiln-optimize" />}
+              {floor !== 0 &&
+                <KilnOptimizeLeftForecast onGetValueFromGrandChild={handleValueFromGrandChild} key="kiln-optimize-forecast" />
+              }
+          </>
+            )}
+          {/* {active == "窑炉优化" && <KilnOptimizeLeft key="kiln-optimize" />} */}
           {active == "退火监测" && <FireCheckLeft key="fire-check" />}
           {active == "质检统计" && <QualityCheckLeft key="quality-check" />}
         </div>
       </AnimatePresence>
 
-      <div className="Center">
+      <div    className={
+           (floor === 4 && active === '窑炉优化' ? 'InputCenter' : "Center")
+          }>
         {active == "窑炉总览" && (
           <>
             <div id="alarm-list-container">
@@ -135,7 +158,7 @@ export default function Home({ active }) {
 
         {active == "窑炉内部" && <KilnCenter />}
 
-        {active == "窑炉优化" && <OptimizeCenter />}
+        {active == "窑炉优化" && <OptimizeCenter onFloorChange={handleFloorChangeFromKilnCenter} />}
 
         {active == "退火监测" && <div className="bgFire"></div>}
 
@@ -144,7 +167,15 @@ export default function Home({ active }) {
 
       {active == "窑炉总览" && <RightBar key="right-bar" />}
       {active == "窑炉内部" && <KilnInnerRight key="kiln-inner-right" />}
-      {active == "窑炉优化" && <KilnOptimizeRight key="kiln-optimize-right" />}
+        {active == "窑炉优化" && (
+          <>
+          {floor !== 4 && <KilnOptimizeRight key="kiln-optimize-right" />}
+          <HomeContext.Provider value={modelFlag}>
+            {floor === 4 && <KilnOptimizeRightForecast value={modelFlag} key="kiln-optimize-right-forecast" />}
+          </HomeContext.Provider>
+          </>
+            )}
+      {/* {active == "窑炉优化" && <KilnOptimizeRight key="kiln-optimize-right" />} */}
       {active == "退火监测" && <FireCheckRight key="kiln-fire-check-right" />}
       {active == "质检统计" && <QualityCheckRight key="kiln-quality-right" />}
     </div>