feat: ui调整,echart 变为折线图

src/views/screen/ScreenViewBlack/components/ContinueData.vue

@@ -46,18 +46,18 @@ const getLineOptions = ({xAxisData, seriesData}) => {
       type: "line",
       smooth: true,
       symbol: 'none',
-      areaStyle: {
-        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-          {
-            offset: 0,
-            color,
-          },
-          {
-            offset: 1,
-            color: "rgba(255, 255, 255, 0.3)",
-          },
-        ]),
-      },
+      // areaStyle: {
+      //   color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+      //     {
+      //       offset: 0,
+      //       color,
+      //     },
+      //     {
+      //       offset: 1,
+      //       color: "rgba(255, 255, 255, 0.3)",
+      //     },
+      //   ]),
+      // },
       itemStyle: { color },
       lineStyle: {
         width: '2',

src/views/screen/ScreenViewBlack/components/WaterQuality.vue

@@ -33,18 +33,18 @@ const createEchart = ({ xAxisData, seriesData, chart, title }) => {
       type: "line",
       smooth: true,
       symbol: 'none',
-      areaStyle: {
-        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-          {
-            offset: 0,
-            color,
-          },
-          {
-            offset: 1,
-            color: "rgba(255, 255, 255, 0.3)",
-          },
-        ]),
-      },
+      // areaStyle: {
+      //   color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+      //     {
+      //       offset: 0,
+      //       color,
+      //     },
+      //     {
+      //       offset: 1,
+      //       color: "rgba(255, 255, 255, 0.3)",
+      //     },
+      //   ]),
+      // },
       itemStyle: { color },
       lineStyle: {
         width: '2',

src/views/screen/ScreenViewBlack/components/WaterYield.vue

@@ -252,8 +252,20 @@ onUnmounted(() => {
             width: 28px;
             height: 38px;
             border-radius: 3px;
-            border: 1px solid rgba(79, 211, 255, 0.24);
             background: linear-gradient(0deg, rgba(17, 88, 138, 0.00) 0%, rgba(18, 89, 139, 0.01) 19%, rgba(22, 94, 143, 0.05) 32%, rgba(29, 103, 150, 0.11) 44%, rgba(38, 116, 160, 0.20) 54%, rgba(51, 132, 173, 0.31) 64%, rgba(66, 152, 190, 0.44) 74%, rgba(84, 175, 209, 0.61) 83%, rgba(104, 202, 230, 0.79) 92%, #80E8FF 100%);
+            z-index: 2;
+
+            &::after {
+              position: absolute;
+              content: '';
+              top: 0;
+              left: 0;
+              width: 28px;
+              height: 38px;
+              border-radius: 3px;
+              border: 1px solid rgba(79, 211, 255, 0.2);
+              z-index: -1;
+            }
 
             .num {
               position: relative;

src/views/screen/ScreenViewBlack/index.vue

@@ -345,7 +345,7 @@ $primary-bg-color: #040d1c;
       transform: translateY(0);
     }
     50% {
-      transform: translateY(-20px); /* 调整这个值来控制跳跃的高度 */
+      transform: translateY(-10px); /* 调整这个值来控制跳跃的高度 */
     }
   }