merge bugfix

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

@@ -1,21 +1,23 @@
 import cls from "./index.module.css";
 import GradientText from "../../../Common/GradientText";
 import { useSelector } from "react-redux";
+import eIcon1 from '../../../../assets/Icon/oilstation.png';
 
 function SmokeHandle(props) {
   const smokeInfo = useSelector((state) => state.smoke?.info);
   return (
     <div className={" " + cls.smoke} style={{ color: "#fff" }}>
       <span
-        className={cls.shadowBorder}
+        className={cls.shadowBorder + " " + cls.border}
         style={{
           gridRow: "1 / 3",
           paddingTop: "96px",
-          paddingLeft: "32px",
           userSelect: "none",
+          textAlign: "center",
         }}
       >
-        <GradientText text="烟气处理" />
+        <img src={eIcon1} width={32} alt="eIcon1" />
+        <GradientText text={"\u2002\u2002烟气处理"} />
       </span>
       <span
         className={cls.shadowBorder + " " + cls.infoText}
@@ -32,13 +34,13 @@ function SmokeHandle(props) {
           {(+smokeInfo?.NOX_float)?.toFixed(2) || 0}
         </span>
       </span>
-      <span className={cls.shadowBorder + " " + cls.infoText}>
+      <span className={cls.shadowBorder + " " + cls.infoText + " " + cls.border}>
         <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}>
+      <span className={cls.shadowBorder + " " + cls.infoText + " " + cls.border}>
         <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

@@ -3,7 +3,8 @@
   gap: 6px;
   grid-template-columns: 187px 347px 347px;
   /* grid-template-rows: 60px 60px; */
-  grid-template-rows: 129px 129px;
+  /* grid-template-rows: 129px 129px; */
+  grid-template-rows: auto;
   height: 100%;
 }
 
@@ -13,6 +14,29 @@
   padding: 4px;
 }
 
+.shadowBorder.border {
+  position: relative;
+  border-bottom: 2px solid #00fff7;
+}
+
+.shadowBorder.border::before,
+.shadowBorder.border::after {
+  content: "";
+  position: absolute;
+  bottom: 0;
+  display: inline-block;
+  height: 100%;
+  width: 2px;
+  background: linear-gradient(to top, #00fff7, #00fff708, transparent);
+}
+
+.shadowBorder.border::before {
+  left: 0;
+}
+.shadowBorder.border::after {
+  right: 0;
+}
+
 .infoText {
   text-align: center;
   font-size: 24px;