update 烟气处理

src/components/Common/SmokeHandle/SmokeHandleTable/index.jsx

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

src/components/Common/SmokeHandle/index.module.scss

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

src/components/Modules/EnergyCostAnalysis/Energy/index.module.css

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

src/components/Modules/EnergyCostAnalysis/SmokeHandle/index.jsx

@@ -1,7 +1,7 @@
 import cls from "./index.module.css";
 import GradientText from "../../../Common/GradientText";
 import { useSelector } from "react-redux";
-import eIcon1 from '../../../../assets/Icon/oilstation.png';
+import eIcon1 from "../../../../assets/Icon/oilstation.png";
 
 function SmokeHandle(props) {
   const smokeInfo = useSelector((state) => state.smoke?.info);
@@ -34,13 +34,26 @@ function SmokeHandle(props) {
           {(+smokeInfo?.NOX_float)?.toFixed(2) || 0}
         </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 }}>
           {(+smokeInfo?.SO2_float)?.toFixed(2) || 0}
         </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 }}>
           {(+smokeInfo?.dust_float)?.toFixed(2) || 0}

src/components/Modules/EnergyCostAnalysis/SmokeHandle/index.module.css

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