This commit is contained in:
lb
2024-01-25 09:10:00 +08:00
parent d6f9744ded
commit be5fbe1c01
6 changed files with 208 additions and 135 deletions

View File

@@ -2,93 +2,14 @@ import cls from "./index.module.scss";
import Container from "../../Container";
import TechSplitline from "../TechSplitline";
import EnergyCostChart from "./EnergyCostChart";
import { useSelector } from "react-redux";
import EnergyCostRealtime from "./EnergeCostRealtime";
function EnergyCost(props) {
const energyInfo = useSelector((state) => state.energy?.info);
return (
<Container title="能耗" icon="battery" className={cls.energyCost}>
<div className={`flex flex-col`}>
<div className={`${cls.cost__info} flex`}>
<div
className={`${cls.info__item} flex flex-col justify-center items-center`}
style={{ width: "112px", padding: 0 }}
>
<span
style={{
fontSize: "20px",
letterSpacing: "2px",
lineHeight: 1.5,
}}
>
余热发电
</span>
<span
style={{ fontSize: "20px", color: "#3ce8ff", lineHeight: 1.5 }}
>
{(+energyInfo?.elecQty1)?.toFixed(2) || 0}kWh
</span>
</div>
<div className={cls.info__item_groups}>
<div className={cls.info__item}>
<i
style={{
fontSize: "18px",
fontStyle: "normal",
paddingRight: "6px",
}}
>
水耗量
</i>
<span style={{ fontSize: "17px", color: "#3ce8ff" }}>
{(+energyInfo?.waterQty)?.toFixed(2) || 0}Km³
</span>
</div>
<div className={cls.info__item}>
<i
style={{
fontSize: "18px",
fontStyle: "normal",
paddingRight: "6px",
}}
>
天然气I
</i>
<span style={{ fontSize: "17px", color: "#3ce8ff" }}>
{energyInfo?.ngQty1 || "0Nm³"}
</span>
</div>
<div className={cls.info__item}>
<i
style={{
fontSize: "18px",
fontStyle: "normal",
paddingRight: "6px",
}}
>
电耗量
</i>
<span style={{ fontSize: "17px", color: "#3ce8ff" }}>
{(+energyInfo?.elecQty2)?.toFixed(2) || 0}kWh
</span>
</div>
<div className={cls.info__item}>
<i
style={{
fontSize: "18px",
fontStyle: "normal",
paddingRight: "6px",
}}
>
天然气II
</i>
<span style={{ fontSize: "17px", color: "#3ce8ff" }}>
{energyInfo?.ngQty2 || "0Nm³"}
</span>
</div>
</div>
</div>
<EnergyCostRealtime />
<TechSplitline />