mt-fe-group/xuchang-new
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update 烟气处理

Browse Source
This commit is contained in:
lb 2024-04-25 10:52:46 +08:00
parent 7ddae1b3a4
commit 28c9c1906e
5 changed files with 55 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Common/SmokeHandle/SmokeHandleTable/index.jsx
View File

@ -11,10 +11,10 @@ const SmokeHandleTable = () => {
<div className={cls.info__item}> <div className={cls.info__item}>
氮氧化物浓度: {(+smokeInfo?.NOX_float)?.toFixed(2) || 0}mg/m³ 氮氧化物浓度: {(+smokeInfo?.NOX_float)?.toFixed(2) || 0}mg/m³
</div> </div>
<div className={cls.info__item}> <div className={cls.info__item} style={{ gridColumn: "span 2" }}>
二氧化硫浓度: {(+smokeInfo?.SO2_float)?.toFixed(2) || 0}mg/m³ 二氧化硫浓度: {(+smokeInfo?.SO2_float)?.toFixed(2) || 0}mg/m³
</div> </div>
<div className={cls.info__item}> <div className={cls.info__item + " " + cls.disabled}>
颗粒物浓度: {(+smokeInfo?.dust_float)?.toFixed(2) || 0}mg/m³ 颗粒物浓度: {(+smokeInfo?.dust_float)?.toFixed(2) || 0}mg/m³
</div> </div>
</div> </div>

49
src/components/Common/SmokeHandle/index.module.scss
View File

@ -1,29 +1,36 @@
.smokeHandle { .smokeHandle {
// background: #b730305c; // background: #b730305c;
background: url(../../../assets/smoke.png) no-repeat; background: url(../../../assets/smoke.png) no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
width: 626px; width: 626px;
height: 490px; height: 490px;
.smokeHandle__content { .smokeHandle__content {
margin-top: 8px; margin-top: 8px;
} }
} }
.info__item { .info__item {
border-radius: 2px; border-radius: 2px;
color: hsl(0, 0%, 100%, 0.9); color: hsl(0, 0%, 100%, 0.9);
box-shadow: inset 0 0 17px 0px hsla(0, 0%, 100%, 0.15); box-shadow: inset 0 0 17px 0px hsla(0, 0%, 100%, 0.15);
height: 32px; height: 32px;
font-size: 16px; font-size: 16px;
letter-spacing: 1.43px; letter-spacing: 1.43px;
line-height: 32px; line-height: 32px;
text-align: center; text-align: center;
user-select: none; user-select: none;
} }
.info__item_groups { .info__item_groups {
margin-bottom: 12px; margin-bottom: 12px;
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
gap: 4px; gap: 4px;
}
.disabled {
display: none;
pointer-events: none;
opacity: 0.5;
color: transparent;
} }

1
src/components/Modules/EnergyCostAnalysis/Energy/index.module.css
View File

@ -12,6 +12,7 @@
box-shadow: inset 0 0 12px 3px #fff2; box-shadow: inset 0 0 12px 3px #fff2;
border-radius: 4px; border-radius: 4px;
padding: 4px; padding: 4px;
backdrop-filter: blur(3px);
} }
.shadowBorder.border { .shadowBorder.border {

19
src/components/Modules/EnergyCostAnalysis/SmokeHandle/index.jsx
View File

@ -1,7 +1,7 @@
import cls from "./index.module.css"; import cls from "./index.module.css";
import GradientText from "../../../Common/GradientText"; import GradientText from "../../../Common/GradientText";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
import eIcon1 from '../../../../assets/Icon/oilstation.png'; import eIcon1 from "../../../../assets/Icon/oilstation.png";
function SmokeHandle(props) { function SmokeHandle(props) {
const smokeInfo = useSelector((state) => state.smoke?.info); const smokeInfo = useSelector((state) => state.smoke?.info);
@ -34,13 +34,26 @@ function SmokeHandle(props) {
{(+smokeInfo?.NOX_float)?.toFixed(2) || 0} {(+smokeInfo?.NOX_float)?.toFixed(2) || 0}
</span> </span>
</span> </span>
<span className={cls.shadowBorder + " " + cls.infoText + " " + cls.border}> <span
className={cls.shadowBorder + " " + cls.infoText + " " + cls.border}
style={{ gridColumn: "span 2" }}
>
<span style={{ lineHeight: 1.5 }}>二氧化硫浓度 mg/m³</span> <span style={{ lineHeight: 1.5 }}>二氧化硫浓度 mg/m³</span>
<span style={{ lineHeight: 1.5 }}> <span style={{ lineHeight: 1.5 }}>
{(+smokeInfo?.SO2_float)?.toFixed(2) || 0} {(+smokeInfo?.SO2_float)?.toFixed(2) || 0}
</span> </span>
</span> </span>
<span className={cls.shadowBorder + " " + cls.infoText + " " + cls.border}> <span
className={
cls.shadowBorder +
" " +
cls.infoText +
" " +
cls.border +
" " +
cls.disabled
}
>
<span style={{ lineHeight: 1.5 }}>颗粒物浓度 mg/m³</span> <span style={{ lineHeight: 1.5 }}>颗粒物浓度 mg/m³</span>
<span style={{ lineHeight: 1.5 }}> <span style={{ lineHeight: 1.5 }}>
{(+smokeInfo?.dust_float)?.toFixed(2) || 0} {(+smokeInfo?.dust_float)?.toFixed(2) || 0}

8
src/components/Modules/EnergyCostAnalysis/SmokeHandle/index.module.css
View File

@ -12,6 +12,7 @@
box-shadow: inset 0 0 12px 3px #fff2; box-shadow: inset 0 0 12px 3px #fff2;
border-radius: 4px; border-radius: 4px;
padding: 4px; padding: 4px;
backdrop-filter: blur(3px);
} }
.shadowBorder.border { .shadowBorder.border {
@ -54,3 +55,10 @@
color: #00fff7; color: #00fff7;
font-size: 28px; font-size: 28px;
} }
.disabled {
display: none;
pointer-events: none;
opacity: 0.5;
color: transparent;
}