fix:修改设备告警ui

hx-ai-intelligent/src/view/alarmManagement/energyAlarm/look.vue

@@ -11,9 +11,7 @@
     <div style="width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden">
       <!-- top -->
       <div class="boxstyle">
-        <div
-          class="ns-title-extra-box"
-          style="left: 5px; position: absolute; height: 35px; line-height: 30px">
+        <div class="ns-title-extra-box" style="position: absolute; height: 35px; line-height: 30px">
           告警编号：{{ infoObject.alarmCode }}
         </div>
         <div style="right: 20px; position: absolute; height: 35px; line-height: 30px">
@@ -21,7 +19,7 @@
         </div>
       </div>
       <!-- center -->
-      <div style="width: 100%; height: 400px">
+      <div style="width: 100%; height: 300px">
         <div style="width: 100%; height: 100%" ref="graphChart"></div>
       </div>
       <!-- bottom -->
@@ -213,11 +211,6 @@
       ],
       //滑块样式
       dataZoom: [
-        {
-          type: 'inside',
-          start: 0,
-          end: 100,
-        },
         {
           type: 'slider',
           // backgroundColor: 'yellow',
@@ -225,8 +218,8 @@
           height: 12, // 设置slider的高度为15
           start: 0,
           end: 100,
-          right: 60,
-          left: 60,
+          right: 11,
+          left: 10,
           bottom: 10,
           handleIcon:
             'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5M36.9,35.8h-1.3z M27.8,35.8 h-1.3H27L27.8,35.8L27.8,35.8z', // 使用类似 axisPointer 的图标
@@ -257,15 +250,20 @@
           name: '电压值',
           type: 'line',
           itemStyle: {
+            color: '#fff',
+            borderColor: 'rgba(67, 136, 251, 1)',
+            borderWidth: 2,
+          },
+          lineStyle: {
             normal: {
-              barBorderRadius: 0,
-              color: '#2778FF',
+              color: 'rgba(67, 136, 251, 1)',
+              width: 2,
             },
           },
           symbol: 'circle', // 数据点的形状，这里设置为圆形
           symbolSize: 8,
           label: {
-            show: true,
+            show: false,
             color: 'rgb(89, 89, 89)',
             position: 'top',
             top: '10',
@@ -273,6 +271,29 @@
               return Number(energyAlarm[value.dataIndex]) + 'V';
             },
           },
+          areaStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(
+                0,
+                0,
+                0,
+                1,
+                [
+                  {
+                    offset: 0,
+                    color: 'rgba(22, 127, 255, 0.4)',
+                  },
+                  {
+                    offset: 1,
+                    color: 'rgba(22, 127, 255, 0)',
+                  },
+                ],
+                false,
+              ),
+              shadowColor: 'rgba(22, 127, 255, 0.4)',
+              shadowBlur: 20,
+            },
+          },
           data: energyAlarm,
         },
       ],