update
This commit is contained in:
parent
c3511e1bfe
commit
bb541962dd
@ -9,7 +9,7 @@ function EnergyCost(props) {
|
|||||||
if (energyInfo) {
|
if (energyInfo) {
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<Container title="能耗" icon="charger" className={cls.energyCost}>
|
<Container title="能耗" icon="charger" className={cls.energyCost} pending={true}>
|
||||||
<div className={`flex flex-col`}>
|
<div className={`flex flex-col`}>
|
||||||
<div className={`${cls.cost__info} flex`}>
|
<div className={`${cls.cost__info} flex`}>
|
||||||
<div
|
<div
|
||||||
|
@ -7,7 +7,7 @@ export default function CenterMenu({ active, onChangeActive }) {
|
|||||||
['窑炉内部', '/kilnInner'],
|
['窑炉内部', '/kilnInner'],
|
||||||
['退火监测', '/stopFire'],
|
['退火监测', '/stopFire'],
|
||||||
['质检统计', '/quailtyCheck'],
|
['质检统计', '/quailtyCheck'],
|
||||||
['能耗分析', '/energyCost'],
|
// ['能耗分析', '/energyCost'],
|
||||||
];
|
];
|
||||||
return (
|
return (
|
||||||
<div className={`${cls.centerMenu} flex`}>
|
<div className={`${cls.centerMenu} flex`}>
|
||||||
|
@ -1,7 +1,8 @@
|
|||||||
.centerMenu {
|
.centerMenu {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 120px;
|
top: 120px;
|
||||||
left: 1340px;
|
// left: 1340px;
|
||||||
|
left: 1460px;
|
||||||
color: white;
|
color: white;
|
||||||
z-index: 10000;
|
z-index: 10000;
|
||||||
}
|
}
|
||||||
|
@ -5,7 +5,7 @@ import SmokeTrendChart from './SmokeTrendChart';
|
|||||||
|
|
||||||
function SmokeHandle(props) {
|
function SmokeHandle(props) {
|
||||||
return (
|
return (
|
||||||
<Container title="烟气处理" icon="smoke" className={cls.smokeHandle}>
|
<Container title="烟气处理" icon="smoke" className={cls.smokeHandle} pending={true}>
|
||||||
<div className={`${cls.smokeHandle__content} flex flex-col`}>
|
<div className={`${cls.smokeHandle__content} flex flex-col`}>
|
||||||
<div className={cls.info__item_groups}>
|
<div className={cls.info__item_groups}>
|
||||||
<div className={cls.info__item}>氧 气 含 量 : 72%</div>
|
<div className={cls.info__item}>氧 气 含 量 : 72%</div>
|
||||||
|
@ -19,11 +19,11 @@ const TodayTableData = (props) => {
|
|||||||
headerHeight: 40,
|
headerHeight: 40,
|
||||||
hoverPause: false,
|
hoverPause: false,
|
||||||
data: [
|
data: [
|
||||||
["产线1", "37%", "62%", "97%", "7%"],
|
["Y61", "37%", "62%", "97%", "7%"],
|
||||||
["产线2", "95%", "10%", "99%", "3%"],
|
["Y62", "95%", "10%", "99%", "3%"],
|
||||||
["产线3", "68%", "1%", "92%", "4%"],
|
["Y63", "68%", "1%", "92%", "4%"],
|
||||||
["产线4", "94%", "21%", "97%", "2%"],
|
["Y64", "94%", "21%", "97%", "2%"],
|
||||||
["产线5", "99%", "30%", "95%", "5%"],
|
["Y65", "99%", "30%", "95%", "5%"],
|
||||||
],
|
],
|
||||||
});
|
});
|
||||||
return (
|
return (
|
||||||
|
@ -1,21 +1,39 @@
|
|||||||
import { useEffect, useRef } from 'react';
|
import { useEffect, useRef } from "react";
|
||||||
import useIcon from '../hooks/useIcon';
|
import useIcon from "../hooks/useIcon";
|
||||||
import cls from './container.module.scss';
|
import cls from "./container.module.scss";
|
||||||
|
|
||||||
const Container = (props) => {
|
const Container = (props) => {
|
||||||
let icon = useIcon(props.icon);
|
let icon = useIcon(props.icon);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`${cls.container} ${props.className}`} style={props.style}>
|
<div
|
||||||
|
className={`${cls.container} ${props.className}`}
|
||||||
|
style={props.pending ? { filter: "grayscale(100%)" } : props.style}
|
||||||
|
>
|
||||||
<div className={cls.container__head}>
|
<div className={cls.container__head}>
|
||||||
<img
|
<img
|
||||||
src={icon}
|
src={icon}
|
||||||
alt="#"
|
alt="#"
|
||||||
className={props.icon == 'kiln' ? cls.bigger : ''}
|
className={props.icon == "kiln" ? cls.bigger : ""}
|
||||||
/>
|
/>
|
||||||
<h2>{props.title}</h2>
|
<h2>{props.title}</h2>
|
||||||
</div>
|
</div>
|
||||||
<div className={cls.container__content}>{props.children}</div>
|
<div className={cls.container__content}>{props.children}</div>
|
||||||
|
{props.pending && (
|
||||||
|
<div
|
||||||
|
className={`${cls.container__content} pending-modal`}
|
||||||
|
style={{
|
||||||
|
position: "absolute",
|
||||||
|
top: 0,
|
||||||
|
left: 0,
|
||||||
|
width: "100%",
|
||||||
|
height: "100%",
|
||||||
|
borderRadius: "20px",
|
||||||
|
userSelect: "none",
|
||||||
|
cursor: "not-allowed",
|
||||||
|
}}
|
||||||
|
></div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -11,9 +11,9 @@ export default function index() {
|
|||||||
<div className={cls.leftGrid}>
|
<div className={cls.leftGrid}>
|
||||||
<Item1 />
|
<Item1 />
|
||||||
</div>
|
</div>
|
||||||
<div className={cls.rightTable}>
|
{/* <div className={cls.rightTable}>
|
||||||
<Item2 />
|
<Item2 />
|
||||||
</div>
|
</div> */}
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
@ -44,7 +44,7 @@ function KilnCenter() {
|
|||||||
}
|
}
|
||||||
onClick={() => onFloorUpdate(1)}
|
onClick={() => onFloorUpdate(1)}
|
||||||
>
|
>
|
||||||
一层
|
碹顶
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
className={
|
className={
|
||||||
@ -52,7 +52,7 @@ function KilnCenter() {
|
|||||||
}
|
}
|
||||||
onClick={() => onFloorUpdate(2)}
|
onClick={() => onFloorUpdate(2)}
|
||||||
>
|
>
|
||||||
二层
|
池底
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -4,6 +4,7 @@
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
.container__head {
|
.container__head {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -14,6 +14,7 @@ html,
|
|||||||
body {
|
body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
overflow-y: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
#FullScreen {
|
#FullScreen {
|
||||||
|
@ -10,11 +10,11 @@ import FireCheckLeft from "../../components/Modules/FireCheck/LeftSide";
|
|||||||
import QualityCheckLeft from "../../components/Modules/QualityCheck/LeftSide";
|
import QualityCheckLeft from "../../components/Modules/QualityCheck/LeftSide";
|
||||||
import FireCheckRight from "../../components/Modules/FireCheck/RightSide";
|
import FireCheckRight from "../../components/Modules/FireCheck/RightSide";
|
||||||
import QualityCheckRight from "../../components/Modules/QualityCheck/RightSide";
|
import QualityCheckRight from "../../components/Modules/QualityCheck/RightSide";
|
||||||
|
import { useSelector } from "react-redux";
|
||||||
|
|
||||||
export default function Home({ active }) {
|
export default function Home({ active }) {
|
||||||
const ctx = null;
|
const ctx = useSelector((state) => state.fireInfo);
|
||||||
|
const fireDir = ctx.fireDirection || null;
|
||||||
const fireDir = ctx?.runState?.fireDirection || null;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="Main">
|
<div className="Main">
|
||||||
|
Loading…
Reference in New Issue
Block a user