diff --git a/mock/echarts.ts b/mock/echarts.ts
new file mode 100644
index 0000000..e69de29
diff --git a/mock/pools/echartsData.ts b/mock/pools/echartsData.ts
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/Charts/appearanceDailyAlertChart.vue b/src/components/Charts/appearanceDailyAlertChart.vue
index cd8de85..e202adb 100644
--- a/src/components/Charts/appearanceDailyAlertChart.vue
+++ b/src/components/Charts/appearanceDailyAlertChart.vue
@@ -2,7 +2,7 @@
  * @Author: donghao donghao@supervision.ltd
  * @Date: 2025-08-14 10:33:46
  * @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2025-08-18 17:03:28
+ * @LastEditTime: 2025-08-20 14:35:52
  * @FilePath: \5G-Web\src\components\Charts\appearanceDailyAlertChart.vue
  * @Description: 外观日告警统计
 -->
@@ -37,7 +37,7 @@ function initChart() {
       data: [
         80, 30, 120, 80, 100, 60, 70, 50, 40, 60, 110, 30, 80, 100, 120, 150,
       ],
-      color: "rgba(212, 145, 20, 1)",
+      color: "rgba(212, 145, 20, 0.9)",
       color1: "rgba(212, 145, 20, 0.3)",
     },
     {
@@ -46,7 +46,7 @@ function initChart() {
         100, 20, 220, 180, 120, 180, 100, 120, 100, 140, 160, 20, 180, 140, 80,
         170,
       ],
-      color: "rgba(0, 157, 255, 1)",
+      color: "rgba(0, 157, 255, 0.9)",
       color1: "rgba(0, 157, 255, 0.3)",
     },
     {
@@ -55,7 +55,7 @@ function initChart() {
         150, 180, 200, 190, 180, 50, 80, 100, 80, 140, 120, 190, 150, 60, 100,
         120,
       ],
-      color: "rgba(44, 188, 204, 1)",
+      color: "rgba(44, 188, 204, 0.9)",
       color1: "rgba(44, 188, 204, 0.3)",
     },
     {
@@ -64,7 +64,7 @@ function initChart() {
         120, 140, 180, 170, 80, 140, 130, 110, 140, 100, 100, 140, 120, 80, 140,
         140,
       ],
-      color: "rgba(13, 233, 138, 1)",
+      color: "rgba(13, 233, 138, 0.9)",
       color1: "rgba(13, 233, 138, 0.3)",
     },
     {
@@ -73,7 +73,7 @@ function initChart() {
         100, 120, 80, 100, 50, 70, 150, 120, 100, 140, 60, 100, 60, 150, 120,
         170,
       ],
-      color: "rgba(198, 81, 14, 1)",
+      color: "rgba(198, 81, 14, 0.9)",
       color1: "rgba(198, 81, 14, 0.3)",
     },
     {
@@ -82,7 +82,7 @@ function initChart() {
         150, 160, 180, 170, 150, 80, 100, 140, 120, 80, 140, 80, 120, 80, 100,
         150,
       ],
-      color: "rgba(255, 209, 92, 1)",
+      color: "rgba(255, 209, 92, 0.9)",
       color1: "rgba(255, 209, 92, 0.3)",
     },
   ];
@@ -95,7 +95,7 @@ function initChart() {
     seriesOptions.push({
       name: item.name,
       type: "line",
-      color: item.color1,
+      color: item.color,
       symbolSize: 9,
       symbol: "none",
       areaStyle: {
@@ -132,9 +132,6 @@ function initChart() {
       right: 0,
       top: "5%",
       icon: "rect",
-      // itemWidth: 16,
-      // itemHeight: 16,
-      // itemGap: 32,
       textStyle: {
         fontFamily: "PingFangSC-Semibold",
         fontSize: 14,
@@ -144,10 +141,10 @@ function initChart() {
       data: legendData,
     },
     grid: {
-      top: "25%",
-      left: "2%",
-      right: "2%",
+      left: "1%",
+      right: "1%",
       bottom: "5%",
+      top: "25%",
       containLabel: true,
     },
     xAxis: {
diff --git a/src/components/Charts/appearanceDailyDetectionChart.vue b/src/components/Charts/appearanceDailyDetectionChart.vue
index ca13eb2..eb6bee0 100644
--- a/src/components/Charts/appearanceDailyDetectionChart.vue
+++ b/src/components/Charts/appearanceDailyDetectionChart.vue
@@ -2,7 +2,7 @@
  * @Author: donghao donghao@supervision.ltd
  * @Date: 2025-08-14 10:33:22
  * @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2025-08-18 17:00:57
+ * @LastEditTime: 2025-08-20 16:03:07
  * @FilePath: \5G-Web\src\components\Charts\appearanceDailyDetectionChart.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -18,7 +18,7 @@ const props = defineProps({
 function initChart() {
   const chartDom = document.getElementById("appearanceDailyDetectionChart");
   const mainChart = echarts.init(chartDom);
-   const data1 = [
+  const data1 = [
     {
       name: "1日",
       value: 175,
@@ -117,23 +117,25 @@ function initChart() {
   const barWidth = 16;
   const DOMURL = window.URL || window.webkitURL || window;
   const insetShadowUrl = DOMURL.createObjectURL(svg);
-    let xAxisData = [];
+  let xAxisData = [];
   let seriesData1 = [];
   data1.forEach((item) => {
     xAxisData.push(item.name);
     seriesData1.push(item.value);
   });
 
-
   const option = {
     backgroundColor: "",
-     grid: {
-    left: "1%",
-    right: "1%",
-    bottom: "2%",
-    top: "15%",
-    containLabel: true,
-  },
+    tooltip: {
+      trigger: "axis",
+    },
+    grid: {
+      left: "1%",
+      right: "1%",
+      bottom: "5%",
+      top: "15%",
+      containLabel: true,
+    },
     xAxis: {
       type: "category",
       axisLine: {
@@ -166,7 +168,7 @@ function initChart() {
         lineStyle: {
           type: "dashed",
           color: "rgba(255,255,255,0.1)",
-          width: 2,
+          width: 1,
         },
       },
     },
@@ -176,14 +178,18 @@ function initChart() {
         type: "pictorialBar",
         symbol: "image://" + insetShadowUrl,
         barWidth: barWidth,
+        legendHoverLink: false,
       },
       {
+        tooltip: {
+          show: false,
+        },
         data: seriesData1,
         type: "bar",
         barWidth: barWidth,
         itemStyle: {
           color: "transparent",
-          borderWidth: 3,
+          borderWidth: 1,
           borderColor: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
             {
               offset: 0,
diff --git a/src/components/Charts/diggerDailyDistanceChart.vue b/src/components/Charts/diggerDailyDistanceChart.vue
index c435f54..76663d6 100644
--- a/src/components/Charts/diggerDailyDistanceChart.vue
+++ b/src/components/Charts/diggerDailyDistanceChart.vue
@@ -89,9 +89,10 @@ function initChart() {
       borderWidth: 1,
     },
     grid: {
-      left: "2%",
-      right: "0%",
+     left: "1%",
+      right: "1%",
       bottom: "5%",
+        top: "15%",
       containLabel: true,
     },
     toolbox: {
@@ -172,42 +173,12 @@ function initChart() {
           shadowOffsetY: 10,
         },
         itemStyle: {
-          normal: {
-            color: "rgba(255, 209, 92, 1)",
+           color: "rgba(255, 209, 92, 1)",
             borderColor: "",
             borderWidth: 3,
             shadowColor: "rgba(255, 209, 92, 01)",
             shadowBlur: 5,
-          },
         },
-        // areaStyle: {
-        //   //区域填充样式
-        //   normal: {
-        //     //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
-        //     color: new echarts.graphic.LinearGradient(
-        //       0,
-        //       0,
-        //       0,
-        //       1,
-        //       [
-        //         {
-        //           offset: 0,
-        //           color: "rgba(165, 170, 247, 1)",
-        //         },
-        //         {
-        //           offset: 0.5,
-        //           color: "rgba(165, 170, 247, 0.2)",
-        //         },
-        //         {
-        //           offset: 1,
-        //           color: "rgba(165, 170, 247, 0)",
-        //         },
-        //       ],
-        //       false
-        //     ),
-        //     shadowBlur: 0, //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
-        //   },
-        // },
       },
     ],
   };
diff --git a/src/components/Charts/diggerHourlyDistanceChart.vue b/src/components/Charts/diggerHourlyDistanceChart.vue
index 9e89538..7d2de45 100644
--- a/src/components/Charts/diggerHourlyDistanceChart.vue
+++ b/src/components/Charts/diggerHourlyDistanceChart.vue
@@ -8,10 +8,8 @@ function generateData(totalNum, bigvalue, smallvalue, color) {
         name: (i + 1).toString(),
         value: bigvalue,
         itemStyle: {
-          normal: {
-            color: color,
-            borderWidth: 0,
-          },
+          color: color,
+          borderWidth: 0,
         },
       });
     } else {
@@ -19,10 +17,8 @@ function generateData(totalNum, bigvalue, smallvalue, color) {
         name: (i + 1).toString(),
         value: smallvalue,
         itemStyle: {
-          normal: {
-            color: "rgba(0,0,0,0)",
-            borderWidth: 0,
-          },
+          color: "rgba(0,0,0,0)",
+          borderWidth: 0,
         },
       });
     }
@@ -220,8 +216,8 @@ function initChart() {
     /**区域位置*/
     grid: {
       // Adjust grid for spacing
-      left: "5%",
-      right: "0%",
+      left: "1%",
+      right: "1%",
       bottom: "5%",
       top: "15%",
       containLabel: true,
@@ -239,13 +235,14 @@ function initChart() {
         barWidth: barWidth,
         symbolOffset: ["10%", "50%"],
         itemStyle: {
-          normal: {
-            color: function (params) {
-              return colors[0];
-            },
+          color: function (params) {
+            return colors[0];
           },
         },
         data: seriesData1,
+        tooltip: {
+          show: false,
+        },
       },
 
       {
@@ -257,12 +254,13 @@ function initChart() {
         symbolOffset: ["0%", "0%"],
         symbolSize: [barWidth, barWidth * 0.3],
         itemStyle: {
-          normal: {
-            color: function (params) {
-              return "rgba(0,255,252,0.1)";
-            },
+          color: function (params) {
+            return "rgba(0,255,252,0.1)";
           },
         },
+        tooltip: {
+          show: false,
+        },
       },
       {
         // 实体柱状图顶部
@@ -273,11 +271,9 @@ function initChart() {
         symbolOffset: ["0%", "-50%"],
         symbolSize: [barWidth, barWidth * 0.3],
         itemStyle: {
-          normal: {
-            borderWidth: 0,
-            color: function (params) {
-              return colors1[0];
-            },
+          borderWidth: 0,
+          color: function (params) {
+            return colors1[0];
           },
         },
       },
diff --git a/src/components/Charts/poleDailyAlertChart.vue b/src/components/Charts/poleDailyAlertChart.vue
index e8497b6..5332c8c 100644
--- a/src/components/Charts/poleDailyAlertChart.vue
+++ b/src/components/Charts/poleDailyAlertChart.vue
@@ -29,7 +29,7 @@ const propsData = {
   legendData: ["撑杆断裂", "撑杆锈蚀", "撑杆穿孔"],
   seriesData: {
     撑杆断裂: [
-      60, 80, 120, 100, 90, 120, 110, 140, 130, 120, 120, 125, 130, 160, 150,
+      210, 80, 120, 100, 90, 120, 110, 140, 130, 120, 120, 125, 130, 160, 150,
       100,
     ],
     撑杆锈蚀: [
@@ -51,10 +51,11 @@ const option = {
     y: 0,
     x2: 0,
     y2: 0,
+
+    left: "1%",
+    right: "1%",
+    bottom: "5%",
     top: "25%",
-    left: "16px",
-    right: "0%",
-    bottom: "0%",
     containLabel: true,
   },
   tooltip: {
@@ -128,13 +129,11 @@ const option = {
       smooth: true, //true曲线; false折线
       symbol: "none",
       itemStyle: {
-        normal: {
-          color: "#ffc600", //改变折线点的颜色
+       color: "#ffc600", //改变折线点的颜色
           lineStyle: {
             color: "#ffc600", //改变折线颜色
             type: "solid",
           },
-        },
       },
       areaStyle: {
         //折线图颜色半透明
@@ -166,13 +165,11 @@ const option = {
       symbol: "none",
 
       itemStyle: {
-        normal: {
-          color: "#24adfe", //改变折线点的颜色
+        color: "#24adfe", //改变折线点的颜色
           lineStyle: {
             color: "#24adfe", //改变折线颜色
             type: "solid",
           },
-        },
       },
       areaStyle: {
         //折线图颜色半透明
@@ -204,13 +201,11 @@ const option = {
       symbol: "none",
 
       itemStyle: {
-        normal: {
-          color: "#0DE98A", //改变折线点的颜色
+        color: "#0DE98A", //改变折线点的颜色
           lineStyle: {
             color: "#0DE98A", //改变折线颜色
             type: "solid",
           },
-        },
       },
       areaStyle: {
         //折线图颜色半透明
diff --git a/src/components/Charts/poleDailyDetectionChart.vue b/src/components/Charts/poleDailyDetectionChart.vue
index 163f000..ae56d29 100644
--- a/src/components/Charts/poleDailyDetectionChart.vue
+++ b/src/components/Charts/poleDailyDetectionChart.vue
@@ -9,7 +9,7 @@ const props = defineProps({
 const data1 = [
   {
     name: "1日",
-    value: 175,
+    value: 220,
   },
   {
     name: "2日",
@@ -21,7 +21,7 @@ const data1 = [
   },
   {
     name: "4日",
-    value: 115,
+    value: 245,
   },
   {
     name: "5日",
@@ -41,7 +41,7 @@ const data1 = [
   },
   {
     name: "9日",
-    value: 15,
+    value: 250,
   },
   {
     name: "10日",
@@ -78,8 +78,8 @@ data1.forEach((item) => {
   xAxisData.push(item.name);
   seriesData1.push(item.value);
 });
-var barWidth = 32;
-var barWidthBg = 45;
+var barWidth = 16;
+var barWidthBg = 25;
 const color = [
   {
     type: "linear",
@@ -113,7 +113,7 @@ const option = {
   grid: {
     left: "1%",
     right: "1%",
-    bottom: "2%",
+    bottom: "5%",
     top: "15%",
     containLabel: true,
   },
diff --git a/src/components/Charts/poleMonitorChart.vue b/src/components/Charts/poleMonitorChart.vue
index 65cff56..0bca92f 100644
--- a/src/components/Charts/poleMonitorChart.vue
+++ b/src/components/Charts/poleMonitorChart.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { defineComponent, onMounted, ref, watchEffect } from "vue";
 import * as echarts from "echarts";
 interface ChartItem {
   percent: number;
@@ -8,35 +7,10 @@ interface ChartItem {
   pieData: number[]; // 小饼图数据，比如 [65, 35] 对应占比
   pieColors: string[]; // 小饼图各部分颜色
 }
-
 // 图表容器引用
 const mainChartRef = ref<HTMLDivElement | null>(null);
-const miniChartRef = ref<HTMLDivElement | null>(null);
-
 // 图表实例
 let mainChart: echarts.ECharts | null = null;
-let miniChart: echarts.ECharts | null = null;
-
-// 存储 ECharts 实例的 ref 数组
-const chartRefs = ref<Ref<HTMLDivElement | null>[]>([]);
-
-// const chartData = [
-//   {
-//     percent: 65,
-//     desc: "撑杆折断",
-//     color: "#488AFE",
-//     pieData: [65, 35],
-//     pieColors: ["#488AFE", "#ffffff44"],
-//   },
-//   {
-//     percent: 35,
-//     desc: "撑杆弯曲",
-//     color: "#F7D36D",
-//     pieData: [35, 65],
-//     pieColors: ["#F7D36D", "#ffffff44"],
-//   },
-// ];
-
 // 数据
 const colors = [
   [
@@ -73,11 +47,9 @@ function Pie() {
         name: (i + 1).toString(),
         value: 10,
         itemStyle: {
-          normal: {
-            color: "#fff",
-            borderWidth: 0,
-            borderColor: "rgba(0,0,0,0)",
-          },
+          color: "#fff",
+          borderWidth: 0,
+          borderColor: "rgba(0,0,0,0)",
         },
       });
     } else {
@@ -85,11 +57,9 @@ function Pie() {
         name: (i + 1).toString(),
         value: 25,
         itemStyle: {
-          normal: {
-            color: "rgba(0,0,0,0)",
-            borderWidth: 0,
-            borderColor: "rgba(0,0,0,0)",
-          },
+          color: "rgba(0,0,0,0)",
+          borderWidth: 0,
+          borderColor: "rgba(0,0,0,0)",
         },
       });
     }
@@ -107,10 +77,8 @@ const initMainChart = () => {
       trigger: "item",
       formatter: " {b} : {d}% <br/> {c}",
     },
-
     legend: {
       orient: "horizontal",
-      // icon: "circle",
       bottom: 20,
       x: "center",
       textStyle: {
@@ -125,21 +93,19 @@ const initMainChart = () => {
         center: centerPoint,
         color: colors,
         itemStyle: {
-          normal: {
-            borderColor: "#031845",
-            borderWidth: 10,
-            //渲染环形渐变色
-            color: function (params) {
-              return {
-                //type: 'linear',
-                x: 0,
-                y: 1,
-                x2: 1,
-                y2: 0,
-                colorStops: colors[params.dataIndex], // 100% 处的颜色
-                //globalCoord: false // 缺省为 false
-              };
-            },
+          borderColor: "#031845",
+          borderWidth: 10,
+          //渲染环形渐变色
+          color: function (params) {
+            return {
+              //type: 'linear',
+              x: 0,
+              y: 1,
+              x2: 1,
+              y2: 0,
+              colorStops: colors[params.dataIndex], // 100% 处的颜色
+              //globalCoord: false // 缺省为 false
+            };
           },
         },
         data: [
@@ -153,14 +119,10 @@ const initMainChart = () => {
           },
         ],
         labelLine: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
         label: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
       },
       {
@@ -175,11 +137,9 @@ const initMainChart = () => {
             value: 270,
             name: "1",
             itemStyle: {
-              normal: {
-                color: "transparent",
-                borderWidth: 2,
-                borderColor: "#ffffff",
-              },
+              color: "transparent",
+              borderWidth: 2,
+              borderColor: "#ffffff",
             },
           },
 
@@ -187,21 +147,15 @@ const initMainChart = () => {
             value: 90,
             name: "2",
             itemStyle: {
-              normal: {
-                color: "transparent",
-              },
+              color: "transparent",
             },
           },
         ],
         labelLine: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
         label: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
       },
       {
@@ -215,11 +169,9 @@ const initMainChart = () => {
             value: 25,
             name: "1",
             itemStyle: {
-              normal: {
-                color: "transparent",
-                borderWidth: 2,
-                borderColor: "#ffffff",
-              },
+              color: "transparent",
+              borderWidth: 2,
+              borderColor: "#ffffff",
             },
           },
 
@@ -227,23 +179,17 @@ const initMainChart = () => {
             value: 75,
             name: "2",
             itemStyle: {
-              normal: {
-                color: "transparent",
-              },
+              color: "transparent",
             },
           },
         ],
         // selectedOffset: 10,
 
         labelLine: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
         label: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
       },
       {
@@ -286,14 +232,10 @@ const initMainChart = () => {
         ],
 
         labelLine: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
         label: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
       },
       {
@@ -304,14 +246,10 @@ const initMainChart = () => {
         center: centerPoint,
         z: 10,
         label: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
         labelLine: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
         data: Pie(),
       },
@@ -324,89 +262,75 @@ const initMainChart = () => {
         z: 10,
         startAngle: 90,
         label: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
         color: ["red", "blue", "red", "blue"],
-
         labelLine: {
-          normal: {
-            show: false,
-          },
+          show: false,
         },
-
         data: [
           {
             name: "r1",
             value: 25,
             itemStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-                  {
-                    offset: 0,
-                    color: "rgba(51,149,191,0.5)",
-                  },
-                  {
-                    offset: 1,
-                    color: "rgba(51,149,191,0)",
-                  },
-                ]),
-              },
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                {
+                  offset: 0,
+                  color: "rgba(51,149,191,0.5)",
+                },
+                {
+                  offset: 1,
+                  color: "rgba(51,149,191,0)",
+                },
+              ]),
             },
           },
           {
             name: "r2",
             value: 25,
             itemStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-                  {
-                    offset: 0,
-                    color: "rgba(0,0,0,0)",
-                  },
-                  {
-                    offset: 1,
-                    color: "rgba(51,149,191,0.5)",
-                  },
-                ]),
-              },
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                {
+                  offset: 0,
+                  color: "rgba(0,0,0,0)",
+                },
+                {
+                  offset: 1,
+                  color: "rgba(51,149,191,0.5)",
+                },
+              ]),
             },
           },
           {
             name: "r3",
             value: 25,
             itemStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-                  {
-                    offset: 0,
-                    color: "rgba(51,149,191,0)",
-                  },
-                  {
-                    offset: 1,
-                    color: "rgba(51,149,191,0.5)",
-                  },
-                ]),
-              },
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                {
+                  offset: 0,
+                  color: "rgba(51,149,191,0)",
+                },
+                {
+                  offset: 1,
+                  color: "rgba(51,149,191,0.5)",
+                },
+              ]),
             },
           },
           {
             name: "r4",
             value: 25,
             itemStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-                  {
-                    offset: 0,
-                    color: "rgba(51,149,191,0.5)",
-                  },
-                  {
-                    offset: 1,
-                    color: "rgba(0,0,0,0)",
-                  },
-                ]),
-              },
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                {
+                  offset: 0,
+                  color: "rgba(51,149,191,0.5)",
+                },
+                {
+                  offset: 1,
+                  color: "rgba(0,0,0,0)",
+                },
+              ]),
             },
           },
         ],
@@ -420,7 +344,6 @@ const initMainChart = () => {
 // 监听窗口大小变化，重绘图表
 const handleResize = () => {
   mainChart?.resize();
-  // miniChart?.resize();
 };
 
 onMounted(() => {
@@ -432,7 +355,6 @@ onMounted(() => {
 const cleanup = () => {
   window.removeEventListener("resize", handleResize);
   mainChart?.dispose();
-  miniChart?.dispose();
 };
 
 // 自动清理
diff --git a/src/components/Charts/totalChart.vue b/src/components/Charts/totalChart.vue
index 0a0f11e..f8b2072 100644
--- a/src/components/Charts/totalChart.vue
+++ b/src/components/Charts/totalChart.vue
@@ -186,13 +186,11 @@ const updateChart = () => {
         name: props.legendArr[index],
         barWidth: 25,
         // label: {
-        //   normal: {
         //     show: true,
         //     position: "top",
         //     fontSize: 16,
         //     color: "#fff",
         //     offset: [0, -10],
-        //   },
         // },
         itemStyle: { color: "transparent" },
         data: item,
@@ -238,13 +236,13 @@ const updateChart = () => {
     grid: {
       left: "5%",
       right: "5%",
-      top: "5%",
-      bottom: "10%",
+      top: "15%",
+      bottom: "20%",
       containLabel: true,
     },
     legend: {
       left: "center",
-      top: "90%",
+      top: "85%",
       itemWidth: 12, // 图例项宽度
       itemHeight: 8,
       textStyle: { color: "#fff", fontSize: 12 },
@@ -267,7 +265,7 @@ const updateChart = () => {
         splitLine: {
           lineStyle: { type: "dashed", color: "rgba(80,112,242,0.3)" },
         },
-        axisLabel: { textStyle: { color: "#8C8C8C" }, fontSize: 12 },
+        axisLabel: { color: "#8C8C8C", fontSize: 12 },
         // axisLine: { lineStyle: { color: "#8C8C8C" } },
         // scale: true, // 同步刻度
       },
@@ -275,7 +273,7 @@ const updateChart = () => {
         // name: "kWh",
         // nameTextStyle: { color: "#fff", fontSize: 12 },
         splitLine: { lineStyle: { color: "transparent" } },
-        axisLabel: { textStyle: { color: "#8C8C8C" }, fontSize: 12 },
+        axisLabel: { color: "#8C8C8C", fontSize: 12 },
         // axisLine: { lineStyle: { color: "#8C8C8C" } },
         position: "right",
         // scale: true, // 同步刻度
diff --git a/src/components/Charts/vehicleMonitorChart.vue b/src/components/Charts/vehicleMonitorChart.vue
index f78f964..d6237a8 100644
--- a/src/components/Charts/vehicleMonitorChart.vue
+++ b/src/components/Charts/vehicleMonitorChart.vue
@@ -8,10 +8,8 @@ function generateData(totalNum, bigvalue, smallvalue, color) {
         name: (i + 1).toString(),
         value: bigvalue,
         itemStyle: {
-          normal: {
-            color: color,
-            borderWidth: 0,
-          },
+          color: color,
+          borderWidth: 0,
         },
       });
     } else {
@@ -19,10 +17,8 @@ function generateData(totalNum, bigvalue, smallvalue, color) {
         name: (i + 1).toString(),
         value: smallvalue,
         itemStyle: {
-          normal: {
-            color: "rgba(0,0,0,0)",
-            borderWidth: 0,
-          },
+          color: "rgba(0,0,0,0)",
+          borderWidth: 0,
         },
       });
     }
@@ -38,7 +34,7 @@ function initChart() {
   let color = [
     "#3862d8",
     "#219CF9",
-    "#6efbbf",
+    "#2DE6FF",
     "#40c057",
     "#ffd351",
     "#ff8e43",
@@ -57,7 +53,7 @@ function initChart() {
       value: "2200",
     },
     {
-      name: "搭扣未搭",
+      name: "小门外胀",
       value: "1420",
     },
     {
@@ -78,23 +74,21 @@ function initChart() {
   }, 0);
   const option = {
     backgroundColor: "transparent",
-    color: color,
+    color: color, // 确保color变量已定义
     tooltip: {
       trigger: "item",
     },
-    title: [
-      {
-        text: "",
-        top: 20,
-        left: 20,
-        textStyle: {
-          fontSize: 14,
-          color: "#666666",
-          fontWeight: 400,
-        },
-        show: false,
+    title: {
+      text: "",
+      top: 20,
+      left: 20,
+      textStyle: {
+        fontSize: 14,
+        color: "#666666",
+        fontWeight: 400,
       },
-    ],
+      show: false,
+    },
     series: [
       {
         type: "pie",
@@ -103,21 +97,11 @@ function initChart() {
         radius: ["10%", "65%"],
         center: ["50%", "50%"],
         data: echartData,
-        hoverAnimation: false,
-        itemStyle: {
-          normal: {
-            // borderColor: bgColor,
-            // borderWidth: 2,
-          },
-        },
+        itemStyle: {}, // 已移除废弃的normal层级
         labelLine: {
-          normal: {
-            length: 18,
-            length2: 32,
-            lineStyle: {
-              // color: '#e6e6e6'
-            },
-          },
+          length: 18,
+          length2: 32,
+          lineStyle: {}, // 已移除废弃的normal层级
         },
         label: {
           show: true,
@@ -132,49 +116,37 @@ function initChart() {
               padding: [3, 3, 0, -12],
             },
             name: {
-              fontSize: "10",
+              fontSize: 10, // 修正为数字类型
               padding: [-12, 5, -20, 2],
               color: "#fff",
             },
             rate: {
-              fontSize: "10",
-              align: 'left',
-              padding: [-12, 5, -50, 2],
+              fontSize: 10, // 修正为数字类型
+              align: "left",
+              padding: [-12, 5, -40, 2], // 调整垂直间距
               color: "#fff",
             },
           },
         },
       },
       {
-        // 最外圆圈
         type: "pie",
         zlevel: 1,
-        silent: true, //取消高亮
+        silent: true,
         radius: ["0%", "75%"],
         center: ["50%", "50%"],
         itemStyle: {
-          normal: {
-            show: false,
-            color: "#0E4E89",
-          },
+          color: "#0E4E89", // 直接定义颜色
         },
         labelLine: {
           show: false,
-          normal: {
-            length: 10,
-            length2: 0,
-            lineStyle: {
-              color: "transparent",
-            },
-          },
         },
         label: {
           show: false,
         },
-        data: [100],
+        data: [{ value: 100, name: "" }], // 修正数据格式
       },
       {
-        name: "不动外圆",
         type: "pie",
         zlevel: 1,
         silent: true,
@@ -182,7 +154,10 @@ function initChart() {
         label: {
           show: false,
         },
-        data: generateData(300, 2, 1, "#3F7D97"),
+        itemStyle: {
+          color: "#3F7D97", // 直接定义颜色
+        },
+        data: [{ value: 100, name: "" }], // 静态圆环只需一个数据项
       },
     ],
   };
diff --git a/src/components/CustomTable/src/baseTable.tsx b/src/components/CustomTable/src/baseTable.tsx
index 4da84b5..98ce1bd 100644
--- a/src/components/CustomTable/src/baseTable.tsx
+++ b/src/components/CustomTable/src/baseTable.tsx
@@ -6,7 +6,7 @@ import {
   defineComponent,
   nextTick,
   reactive,
-  type PropType
+  type PropType,
 } from "vue";
 import "./baseTable.scss";
 
@@ -17,7 +17,7 @@ function getDefaultSort(attrs: Record<string, any>): any {
 export default defineComponent({
   name: "XTable",
   directives: {
-    loading: ElLoading.directive
+    loading: ElLoading.directive,
   },
   inheritAttrs: false,
   props: {
@@ -26,7 +26,7 @@ export default defineComponent({
      */
     columns: {
       type: Array as PropType<XTableColumn[]>,
-      required: true
+      required: true,
     },
 
     /**
@@ -34,7 +34,7 @@ export default defineComponent({
      */
     dataSource: {
       type: Array as PropType<XTableData[]>,
-      required: true
+      required: true,
     },
 
     /**
@@ -42,7 +42,7 @@ export default defineComponent({
      */
     loading: {
       type: Boolean,
-      default: false
+      default: false,
     },
 
     /**
@@ -50,7 +50,7 @@ export default defineComponent({
      */
     maxHeight: {
       type: [Number, String] as PropType<number | "auto">,
-      default: "auto"
+      default: "auto",
     },
 
     /**
@@ -64,7 +64,7 @@ export default defineComponent({
       default: true,
       validator(value: boolean | "always") {
         return ["always", true, false].includes(value);
-      }
+      },
     },
 
     /**
@@ -76,11 +76,11 @@ export default defineComponent({
       validator(value: string) {
         return value
           .split(",")
-          .map(item => item.trim())
-          .every(item =>
+          .map((item) => item.trim())
+          .every((item) =>
             ["total", "sizes", "prev", "pager", "next", "jumper"].includes(item)
           );
-      }
+      },
     },
 
     /**
@@ -88,7 +88,7 @@ export default defineComponent({
      */
     total: {
       type: Number,
-      default: 0
+      default: 0,
     },
 
     /**
@@ -96,7 +96,7 @@ export default defineComponent({
      */
     pageSize: {
       type: Number,
-      default: 10
+      default: 10,
     },
 
     /**
@@ -104,7 +104,7 @@ export default defineComponent({
      */
     page: {
       type: Number,
-      default: 1
+      default: 1,
     },
 
     /**
@@ -114,7 +114,7 @@ export default defineComponent({
       type: Array as PropType<number[]>,
       default() {
         return [10, 20, 30, 50];
-      }
+      },
     },
 
     /**
@@ -124,7 +124,7 @@ export default defineComponent({
       type: [Function, String] as PropType<
         (row: XTableData) => string | string
       >,
-      default: "id"
+      default: "id",
     },
 
     /**
@@ -132,7 +132,7 @@ export default defineComponent({
      */
     visibleColumn: {
       type: Boolean,
-      default: undefined
+      default: undefined,
     },
 
     /**
@@ -140,17 +140,8 @@ export default defineComponent({
      */
     isFixedPagination: {
       type: Boolean,
-      default: true
-    }
-
-    // handleDel: {
-    //   type: Function,
-    //   default: () => {}
-    // }
-    // customActions: {
-    //   type: Function,
-    //   default: () => {}
-    // }
+      default: true,
+    },
   },
   emits: ["change", "columnChange", "update:visibleColumn", "actions"],
   setup(props, { slots, attrs, emit }) {
@@ -159,7 +150,7 @@ export default defineComponent({
     const tableState = reactive<XTableState>({
       tid: 0,
       sortBy,
-      sortOrder
+      sortOrder,
     });
 
     const showPagination = computed(() => {
@@ -203,7 +194,7 @@ export default defineComponent({
         pageSize,
         prop: sortBy,
         order: sortOrder,
-        type: "number"
+        type: "number",
       });
     }
 
@@ -220,7 +211,7 @@ export default defineComponent({
           pageSize,
           prop: sortBy,
           order: sortOrder,
-          type: "size"
+          type: "size",
         });
       });
     }
@@ -261,6 +252,30 @@ export default defineComponent({
       return col;
     }
 
+    /**
+     * 渲染普通列
+     */
+    function renderBaseColumn(column: XTableColumn) {
+      const columnSlots: {
+        default?: (scope: Record<string, any>) => any;
+        header?: (scope: Record<string, any>) => any;
+      } = {};
+      const slot = getSlot(column);
+      const headerSlot = getSlot(column, "header");
+
+      if (slot) {
+        columnSlots.default = (scope) => slot(scope);
+      }
+
+      if (headerSlot) {
+        columnSlots.header = (scope) => headerSlot(scope);
+      }
+
+      return (
+        <ElTableColumn {...getColumnProps(column)}>{columnSlots}</ElTableColumn>
+      );
+    }
+
     /**
      * 渲染特殊列
      */
@@ -272,7 +287,7 @@ export default defineComponent({
               default: (scope: Record<string, any>) => {
                 const slot = getSlot(column);
                 return slot?.(scope);
-              }
+              },
             }}
           </ElTableColumn>
         );
@@ -285,74 +300,21 @@ export default defineComponent({
                 return (
                   <div>
                     {slots.actionBar && <div>{slots.actionBar({ row })}</div>}
-                    {/* <ul>
-                      <li
-                        class="flex items-center"
-                        style={{ fontSize: "14px", color: "#E80D0D" }}
-                        onClick={() => handleDel(row)}
-                      >
-                        <i class="iconfont icon-shanchu pr-[8px]"></i>
-                        <el-button type="text">
-                          <span
-                            style={{
-                              fontSize: "14px",
-                              color: "#E80D0D"
-                            }}
-                          >
-                            删除
-                          </span>
-                        </el-button>
-                      </li>
-                    </ul> */}
                   </div>
                 );
-              }
+              },
             }}
           </ElTableColumn>
         );
       }
-      return <ElTableColumn {...getColumnProps(column)} />;
-    }
-
-    /**操作按钮事件 */
-
-    // function handleDel(row) {
-    //   console.log(row, "handleDel");
-    //   emit("actions", {
-    //     type: "delete",
-    //     data: { ...row }
-    //   });
-    // }
-
-    /**
-     * 渲染普通列
-     */
-    function renderBaseColumn(column: XTableColumn) {
-      const columnSlots: {
-        default?: (scope: Record<string, any>) => any;
-        header?: (scope: Record<string, any>) => any;
-      } = {};
-      const slot = getSlot(column);
-      const headerSlot = getSlot(column, "header");
-
-      if (slot) {
-        columnSlots.default = scope => slot(scope);
-      }
-
-      if (headerSlot) {
-        columnSlots.header = scope => headerSlot(scope);
-      }
-
-      return (
-        <ElTableColumn {...getColumnProps(column)}>{columnSlots}</ElTableColumn>
-      );
+      return renderBaseColumn(column);
     }
 
     /**
      * 渲染列
      */
     function renderTableColumn(column: XTableColumn) {
-      if (column.hidden) return;
+      if (column.hidden) return null;
       if (column.type) {
         return renderTypeColumn(column);
       }
@@ -369,7 +331,7 @@ export default defineComponent({
       if (column.hidden) return;
       return (
         <ElTableColumn {...getColumnProps(column)}>
-          {children.map(column => renderTableColumn(column))}
+          {children.map((column) => renderTableColumn(column))}
         </ElTableColumn>
       );
     }
@@ -387,7 +349,7 @@ export default defineComponent({
         pageSizes: props.pageSizes,
         currentPage: props.page,
         onSizeChange: handlePageSizeChange,
-        onCurrentChange: handlePageNumChange
+        onCurrentChange: handlePageNumChange,
       };
 
       return (
@@ -396,7 +358,7 @@ export default defineComponent({
             "x-table-pagination pagination_wrap",
             props.isFixedPagination
               ? "fixed_pagination"
-              : "noneFixed_pagination"
+              : "noneFixed_pagination",
           ]}
         >
           <ElPagination {...paginationProps} />
@@ -412,7 +374,7 @@ export default defineComponent({
         columns: props.columns,
         visible: props.visibleColumn,
         onChange: handleColumnChange,
-        onVisibleChange: handleVisibleChange
+        onVisibleChange: handleVisibleChange,
       };
 
       return <BaseColumn {...customColumnProps} />;
@@ -425,14 +387,13 @@ export default defineComponent({
         maxHeight: mHeight.value,
         data: props.dataSource,
         rowKey: props.rowKey,
-        onSortChange: handleTableSortChange
+        onSortChange: handleTableSortChange,
       };
 
       const extraSlots: {
         append?: () => any;
         empty?: () => any;
       } = {};
-
       if (slots.append) {
         extraSlots.append = () => slots.append?.();
       }
@@ -449,40 +410,20 @@ export default defineComponent({
             v-loading={props.loading}
             v-slots={extraSlots}
           >
-            {props.columns.map(column => {
-              if (Array.isArray(column.children)) {
-                return renderColumnChildren(column, column.children);
-              }
-              return renderTableColumn(column);
-            })}
-            {/* 使用插槽引入操作栏的内容 */}
-            {/* <ElTableColumn label="操作">
-              {{
-                default: ({ row }: { row: Record<string, any> }) => {
-                  return extraSlots.customActions?.({
-                    row
-                  });
-                }
-              }}
-            </ElTableColumn> */}
-            {/* <ElTableColumn label="操作">
-      <template #default="scope">
-        <el-button size="small" @click="handleEdit(scope.$index, scope.row)"
-          >Edit</el-button
-        >
-        <el-button
-          size="small"
-          type="danger"
-          @click="handleDelete(scope.$index, scope.row)"
-          >Delete</el-button>
-        >
-      </template>
-    </ElTableColumn> */}
+            {{
+              default: () => {
+                return props.columns.map((column) =>
+                  Array.isArray(column.children)
+                    ? renderColumnChildren(column, column.children)
+                    : renderTableColumn(column)
+                );
+              },
+            }}
           </ElTable>
           {showPagination.value && renderPagination()}
           {!isUndefined(props.visibleColumn) && renderCustomColumn()}
         </div>
       );
     };
-  }
-});
\ No newline at end of file
+  },
+});
diff --git a/src/components/Swiper/swiperFile.vue b/src/components/Swiper/swiperFile.vue
index 26c8701..58794e4 100644
--- a/src/components/Swiper/swiperFile.vue
+++ b/src/components/Swiper/swiperFile.vue
@@ -2,14 +2,14 @@
  * @Author: donghao donghao@supervision.ltd
  * @Date: 2025-08-14 13:38:30
  * @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2025-08-19 14:21:29
+ * @LastEditTime: 2025-08-20 09:46:29
  * @FilePath: \5G-Web\src\views\dashboard\components\SwpierMonitor.vue
  * @Description: 外观、撑杆统一封装轮播图&视频组件
 -->
 
 <script lang="ts" setup>
 import Player from "@/components/videoPlayer/Player.vue";
-import SwiperPlayer from "./SwiperPlayer.vue";
+import SwiperPlayer from "./swiperPlayer.vue";
 import { Swiper, SwiperSlide } from "swiper/vue";
 import { Navigation, Scrollbar, Mousewheel, Pagination } from "swiper/modules";
 import "swiper/css";
@@ -81,7 +81,6 @@ watch(
     <!-- 缩略图区域 -->
     <div class="flex" v-if="fileList?.length > 0">
       <div class="thumbnail-container">
-        <!-- //TODO 轮播效果调整 -->
         <swiper
           ref="swiperRef"
           :modules="modules"
diff --git a/src/components/Swiper/swiperPlayer.vue b/src/components/Swiper/swiperPlayer.vue
index 0a81f00..76cc36f 100644
--- a/src/components/Swiper/swiperPlayer.vue
+++ b/src/components/Swiper/swiperPlayer.vue
@@ -2,9 +2,9 @@
  * @Author: donghao donghao@supervision.ltd
  * @Date: 2025-08-19 11:04:59
  * @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2025-08-19 11:26:43
- * @FilePath: \5G-Web\src\components\Swiper\SwiperPlayer.vue
- * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ * @LastEditTime: 2025-08-20 09:46:44
+ * @FilePath: \5G-Web\src\components\Swiper\swiperPlayer.vue
+ * @Description: 作为轮播文件中的视频块
 -->
 <template>
   <div class="flex items-center justify-center w-full h-full position-relative">
@@ -14,7 +14,7 @@
       muted
       :src="videoUrl"
       width="100%"
-      height="148"
+      height="100%"
       style="object-fit: cover"
       @error="handleVideoError"
       v-if="!isVideoError"
diff --git a/src/components/videoPlayer/Player.vue b/src/components/videoPlayer/Player.vue
index a663083..e97ead0 100644
--- a/src/components/videoPlayer/Player.vue
+++ b/src/components/videoPlayer/Player.vue
@@ -7,203 +7,207 @@
  * @Description: 视频播放器
 -->
 <template>
-    <!-- 视频播放器 -->
-    <div class="video-player-box">
-        <video ref="videoRef" class="video-element" controls  @timeupdate="handleTimeUpdate"
-            @loadedmetadata="handleLoadedMetadata" @play="handlePlay" @pause="handlePause" @waiting="handleWaiting"
-            @canplay="handleCanPlay" style="object-fit: cover;" @error="handleVideoError">
-            <source :src="src" type="video/mp4">
-            您的浏览器不支持视频播放
-        </video>
-        <!-- 加载状态提示 -->
-        <div v-if="loading" class="loading-overlay">
-            <el-icon class="is-loading">
-                <Loading />
-            </el-icon>
-        </div>
-        <div class="bg_error_img" v-if="isVideoError">
-
-        </div>
+  <!-- 视频播放器 -->
+  <div class="video-player-box">
+    <video
+      ref="videoRef"
+      class="video-element"
+      controls
+      @timeupdate="handleTimeUpdate"
+      @loadedmetadata="handleLoadedMetadata"
+      @play="handlePlay"
+      @pause="handlePause"
+      @waiting="handleWaiting"
+      @canplay="handleCanPlay"
+      style="object-fit: cover"
+      @error="handleVideoError"
+    >
+      <source :src="src" type="video/mp4" />
+      您的浏览器不支持视频播放
+    </video>
+    <!-- 加载状态提示 -->
+    <div v-if="loading" class="loading-overlay">
+      <el-icon class="is-loading">
+        <Loading />
+      </el-icon>
     </div>
+    <div class="bg_error_img" v-if="isVideoError"></div>
+  </div>
 </template>
 
 <script setup lang="ts">
-import { ElIcon } from 'element-plus'
-import { Loading } from '@element-plus/icons-vue'
+import { ElIcon } from "element-plus";
+import { Loading } from "@element-plus/icons-vue";
 
 type ProgressData = {
-    currentTime: number
-    duration: number
-    progress: number
-}
+  currentTime: number;
+  duration: number;
+  progress: number;
+};
 
 const props = defineProps({
-    src: {
-        type: String,
-        required: true
-    },
-    isPlaying: {
-        type: Boolean,
-        default: false
-    }
-})
+  src: {
+    type: String,
+  },
+  isPlaying: {
+    type: Boolean,
+    default: false,
+  },
+});
 
 const emit = defineEmits<{
-    (e: 'update:progress', data: ProgressData): void
-    (e: 'update:duration', duration: number): void
-    (e: 'play'): void
-    (e: 'pause'): void
-}>()
-
-const videoRef = ref<HTMLVideoElement | null>(null)
-const loading = ref<boolean>(false)
+  (e: "update:progress", data: ProgressData): void;
+  (e: "update:duration", duration: number): void;
+  (e: "play"): void;
+  (e: "pause"): void;
+}>();
+
+const videoRef = ref<HTMLVideoElement | null>(null);
+const loading = ref<boolean>(false);
 const isVideoError = ref<boolean>(false);
 
-let currentDuration = 0
-
-
-
+let currentDuration = 0;
 
 // 监听播放状态变化
-watch(() => props.isPlaying, (newVal) => {
-    if (!videoRef.value) return
-    newVal ? videoRef.value.play() : videoRef.value.pause()
-})
+watch(
+  () => props.isPlaying,
+  (newVal) => {
+    if (!videoRef.value) return;
+    newVal ? videoRef.value.play() : videoRef.value.pause();
+  }
+);
 
 // 监听视频源变化
-watch(() => props.src, (newVal) => {
-    if (!videoRef.value) return
-    isVideoError.value = false
-    videoRef.value.pause()
-    videoRef.value.src = newVal
-    videoRef.value.load()
+watch(
+  () => props.src,
+  (newVal) => {
+    if (!videoRef.value) return;
+    isVideoError.value = false;
+    videoRef.value.pause();
+    videoRef.value.src = newVal;
+    videoRef.value.load();
     if (props.isPlaying) {
-        videoRef.value.play()
+      videoRef.value.play();
     }
-})
+  }
+);
 
 // 进度更新处理
 const handleTimeUpdate = () => {
-    if (!videoRef.value) return
-
-    const currentTime = videoRef.value.currentTime
-    const progress = currentDuration > 0
-        ? (currentTime / currentDuration) * 100
-        : 0
-
-    emit('update:progress', {
-        currentTime,
-        duration: currentDuration,
-        progress
-    })
-}
+  if (!videoRef.value) return;
+
+  const currentTime = videoRef.value.currentTime;
+  const progress =
+    currentDuration > 0 ? (currentTime / currentDuration) * 100 : 0;
+
+  emit("update:progress", {
+    currentTime,
+    duration: currentDuration,
+    progress,
+  });
+};
 
 // 元数据加载完成
 const handleLoadedMetadata = () => {
-    if (!videoRef.value) return
-    currentDuration = videoRef.value.duration
-    emit('update:duration', currentDuration)
-}
+  if (!videoRef.value) return;
+  currentDuration = videoRef.value.duration;
+  emit("update:duration", currentDuration);
+};
 
 const handleVideoError = () => {
-    console.log('handleVideoError')
-    isVideoError.value = true;
+  console.log("handleVideoError");
+  isVideoError.value = true;
 };
 
 // 播放状态处理
-const handlePlay = () => emit('play')
-const handlePause = () => emit('pause')
+const handlePlay = () => emit("play");
+const handlePause = () => emit("pause");
 
 // 加载状态处理
-const handleWaiting = () => loading.value = true
-const handleCanPlay = () => loading.value = false
-
+const handleWaiting = () => (loading.value = true);
+const handleCanPlay = () => (loading.value = false);
 
 onMounted(() => {
-    console.log('onMounted', props.src)
-    if (videoRef.value) {
-        videoRef.value.src = props.src
-    }
-})
+  console.log("onMounted", props.src);
+  if (videoRef.value) {
+    videoRef.value.src = props.src;
+  }
+});
 
 onUnmounted(() => {
-    if (videoRef.value) {
-        videoRef.value.pause()
-        videoRef.value.removeAttribute('src')
-        videoRef.value.load()
-    }
-})
+  if (videoRef.value) {
+    videoRef.value.pause();
+    videoRef.value.removeAttribute("src");
+    videoRef.value.load();
+  }
+});
 
 // 暴露控制方法
 defineExpose({
-    play: () => videoRef.value?.play(),
-    pause: () => videoRef.value?.pause(),
-    seek: (time: number) => {
-        if (videoRef.value) {
-            videoRef.value.currentTime = time
-        }
+  play: () => videoRef.value?.play(),
+  pause: () => videoRef.value?.pause(),
+  seek: (time: number) => {
+    if (videoRef.value) {
+      videoRef.value.currentTime = time;
     }
-})
-
-
+  },
+});
 </script>
 
-
-
 <style lang="scss">
 .video-player-box {
-    position: relative;
+  position: relative;
+  width: 100%;
+  height: 100%;
+  margin: 0 auto;
+
+  .bg_error_img {
+    position: absolute;
+    top: 0;
+    left: 0;
     width: 100%;
     height: 100%;
-    margin: 0 auto;
-
-    .bg_error_img {
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        z-index: 99999999;
-        background-color: #090F48;
-        background-image: url("@/assets/common/load_file_error.png");
-        background-position: center;
-        background-repeat: no-repeat;
-        background-size: 25%;
-        border: 1px dashed red;
-    }
-
-    .video-element {
-        width: 100%;
-        height: auto;
-        border-radius: 8px;
-    }
-
-    .loading-overlay {
-        position: absolute;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-        background: rgba(0, 0, 0, 0.5);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        color: white;
-    }
-
-    .el-icon.is-loading {
-        font-size: 32px;
-        animation: rotating 2s linear infinite;
+    z-index: 99999999;
+    background-color: #090f48;
+    background-image: url("@/assets/common/load_file_error.png");
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: 25%;
+    border: 1px dashed red;
+  }
+
+  .video-element {
+    width: 100%;
+    height: auto;
+    border-radius: 8px;
+  }
+
+  .loading-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.5);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: white;
+  }
+
+  .el-icon.is-loading {
+    font-size: 32px;
+    animation: rotating 2s linear infinite;
+  }
+
+  @keyframes rotating {
+    from {
+      transform: rotate(0deg);
     }
 
-    @keyframes rotating {
-        from {
-            transform: rotate(0deg);
-        }
-
-        to {
-            transform: rotate(360deg);
-        }
+    to {
+      transform: rotate(360deg);
     }
+  }
 }
 </style>
diff --git a/src/config/dataView.ts b/src/config/dataView.ts
new file mode 100644
index 0000000..66dac96
--- /dev/null
+++ b/src/config/dataView.ts
@@ -0,0 +1,52 @@
+export const dataViewConfig = {
+  monthArr: [
+    {
+      name: "1月",
+      value: "1",
+    },
+    {
+      name: "2月",
+      value: "2",
+    },
+    {
+      name: "3月",
+      value: "3",
+    },
+    {
+      name: "4月",
+      value: "4",
+    },
+    {
+      name: "5月",
+      value: "5",
+    },
+    {
+      name: "6月",
+      value: "6",
+    },
+    {
+      name: "7月",
+      value: "7",
+    },
+    {
+      name: "8月",
+      value: "8",
+    },
+    {
+      name: "9月",
+      value: "9",
+    },
+    {
+      name: "10月",
+      value: "10",
+    },
+    {
+      name: "11月",
+      value: "11",
+    },
+    {
+      name: "12月",
+      value: "12",
+    },
+  ],
+};
diff --git a/src/styles/common.scss b/src/styles/common.scss
index b6f6eb8..40c75a7 100644
--- a/src/styles/common.scss
+++ b/src/styles/common.scss
@@ -94,7 +94,7 @@
   color: white;
   margin-left: 0;
   height: 32px;
-   .icon {
+  .icon {
     width: 14px;
     height: 14px;
     background-image: url("@/assets/common/search_icon.png");
@@ -213,30 +213,30 @@
   width: 100%;
 
   & > li {
-    height: 230px;
+    // height: 230px;
     background: url("@/assets/common/long_chart_bg.png") no-repeat center center;
     background-size: 100% 100%;
 
     &:nth-child(1) {
-      width: calc(50% - 50px);
-      // background-color: red;
+      width: calc(50% - 50px - 16px);
+      // overflow: hidden;
     }
     &:nth-child(2) {
-      width: calc(50% + 50px);
-      overflow: hidden;
+      width: calc(50% + 50px - 16px);
+      // overflow: hidden;
     }
     .fg-footer-charts-title {
       @apply fg-title;
       font-size: 18px;
       padding-left: 16px;
-      padding-top: 8px;
+      padding-top: 7px;
+      padding-bottom: 1px;
     }
     .fg-footer-charts-content {
-      max-width: 950px;
+      overflow: hidden;
+      max-width: 100%;
+      height: 195px;
       // background-color: red;
-      // overflow-x: auto;
-      // overflow-y: hidden;
-      height: calc(230px - 40px);
     }
   }
 }
diff --git a/src/styles/element-plus.scss b/src/styles/element-plus.scss
index 8ce4df6..9ca6317 100644
--- a/src/styles/element-plus.scss
+++ b/src/styles/element-plus.scss
@@ -112,6 +112,11 @@
   width: 150px;
   background-color: #032b5c; /* 自定义背景色 */
   border: none; /* 可选：去掉边框 */
+  --fg-select-height: 32px; // *自定义高度
+  &.mini-size {
+    --fg-select-height: 28px; // *自定义高度
+    width: 78px;
+  }
   .el-select__selected-item {
     color: white; /* 文字颜色 */
   }
@@ -120,7 +125,7 @@
     background: rgba(74, 126, 191, 0.1); /* 下拉框背景色 */
     border: none !important; /* 边框 */
     color: white; /* 文字颜色 */
-    height: 32px;
+    height: var(--fg-select-height); /* 高度 */
     box-shadow: none;
 
     &::placeholder {
@@ -128,8 +133,8 @@
     }
   }
   .el-select__wrapper {
-    min-height: 32px;
-    line-height: 32px;
+    min-height: var(--fg-select-height);
+    line-height: var(--fg-select-height);
     box-shadow: 0 0 0 0 !important;
   }
   .el-select__arrow {
@@ -159,8 +164,8 @@
     height: 32px;
   }
 }
-.el-progress-bar__outer{
- background: rgba(255,255,255,0.3);
+.el-progress-bar__outer {
+  background: rgba(255, 255, 255, 0.3);
 }
 
 /* 修改下拉菜单背景色 */
@@ -207,4 +212,3 @@
     background-color: transparent;
   }
 }
-
diff --git a/src/views/dashboard/DataOverview.scss b/src/views/dashboard/DataOverview.scss
index 245a0e7..84fa1bb 100644
--- a/src/views/dashboard/DataOverview.scss
+++ b/src/views/dashboard/DataOverview.scss
@@ -44,14 +44,15 @@
     flex-direction: column;
     margin: 0 24px;
     background: url("@/assets/home/realTime_monitor_bg.png") no-repeat center;
-    background-size: contain;
+    background-size: 100% 100%;
+    
   }
 
   .monitor-images {
-    width: 948px;
+    width: 100%;
     display: flex;
     gap: 16px;
-    padding: 20px 16px;
+    padding: 32px 16px 15px;
     flex-wrap: wrap;
     .monitor-images-item {
       width: calc(50% - 8px);
diff --git a/src/views/dashboard/DataOverview.vue b/src/views/dashboard/DataOverview.vue
index 401c5c5..fad115d 100644
--- a/src/views/dashboard/DataOverview.vue
+++ b/src/views/dashboard/DataOverview.vue
@@ -1,13 +1,9 @@
-// TODO 界面设计改版
 <script lang="ts" setup>
 import * as echarts from "echarts";
 import TotalChart from "@/components/Charts/totalChart.vue";
 import PoleMonitorChart from "@/components/Charts/poleMonitorChart.vue";
 import VehicleMonitorChart from "@/components/Charts/vehicleMonitorChart.vue";
 import HomeSubTitle from "@/components/HeaderBar/homeSubTitle.vue";
-import BarChart from "./components/BarChart.vue";
-import PieChart from "./components/PieChart.vue";
-import PieChartSmall from "./components/PieChartSmall.vue";
 import DeviceStatus from "./components/DeviceStatus.vue";
 import car_device_icon from "@/assets/home/car_device_icon.png";
 import pole_device_icon from "@/assets/home/pole_device_icon.png";
@@ -19,13 +15,15 @@ import {
   getRealTimeApi,
 } from "@/api/dashboard";
 import { isSuccessApi } from "@/utils/forApi";
+import { isArray } from "@/utils/is";
 import AlarmModal from "./components/AlarmModal.vue";
+import { dataViewConfig } from "@/config/dataView";
 import { useWebSocketStore } from "@/stores/websocketStore";
 import { onBeforeRouteLeave } from "vue-router";
-
 defineOptions({
   name: "DataOverviewWrap",
 });
+// TODO 需要转移到mock中
 const xData = ref(["1月", "2月", "3月", "4月", "5月"]);
 const legendArr = ["车体检测", "撑杆检测"];
 const datas = ref([
@@ -141,7 +139,7 @@ const getDeviceInfo = async () => {
     console.error("获取设备信息出错:", error);
   }
 };
-const getPoleFault = async () => {
+const fetchPoleMonitorData = async () => {
   try {
     const res = await getRecordFaultApi({
       dateType: "month",
@@ -158,7 +156,8 @@ const getPoleFault = async () => {
     console.error("获取设备信息出错:", error);
   }
 };
-const getCarFault = async () => {
+//
+const fetchTrainMonitorData = async () => {
   try {
     const res = await getRecordFaultApi({
       dateType: "month",
@@ -181,7 +180,10 @@ const getRealTime = async () => {
     const res = await getRealTimeApi({ deviceType: "" });
     if (isSuccessApi(res)) {
       const { data } = res;
-      imageFault.value = data;
+      if (isArray(data)) {
+        // TODO 暂时使用接口图重复填充
+        imageFault.value = data.concat(data).concat(data).splice(0, 4);
+      }
       // deviceStatus.value = data
       console.log(data);
     }
@@ -197,8 +199,8 @@ onBeforeRouteLeave(() => {
 onMounted(() => {
   getList();
   getDeviceInfo();
-  getCarFault();
-  getPoleFault();
+  fetchTrainMonitorData();
+  fetchPoleMonitorData();
   getRealTime();
 });
 </script>
@@ -243,25 +245,22 @@ onMounted(() => {
         <div class="module-header">
           <HomeSubTitle title="车体监测">
             <template #extra>
-              <el-select
-                v-model="searchForm.car"
-                placeholder="时间"
-                class="custom-select"
-                @change="getCarFault()"
-              >
-                <el-option label="1月" value="1"></el-option>
-                <el-option label="2月" value="2"></el-option>
-                <el-option label="3月" value="3"></el-option>
-                <el-option label="4月" value="4"></el-option>
-                <el-option label="5月" value="5"></el-option>
-                <el-option label="6月" value="6"></el-option>
-                <el-option label="7月" value="7"></el-option>
-                <el-option label="8月" value="8"></el-option>
-                <el-option label="9月" value="9"></el-option>
-                <el-option label="10月" value="10"></el-option>
-                <el-option label="11月" value="11"></el-option>
-                <el-option label="12月" value="12"></el-option>
-              </el-select>
+              <div class="flex items-center text-[14px] px-[16px]">
+                <span>时间：</span>
+                <el-select
+                  v-model="searchForm.pole"
+                  placeholder="时间"
+                  class="custom-select mini-size"
+                  @change="fetchPoleMonitorData()"
+                >
+                  <el-option
+                    v-for="v in dataViewConfig.monthArr"
+                    :key="v?.value"
+                    :label="v?.name"
+                    :value="v?.value"
+                  ></el-option>
+                </el-select>
+              </div>
             </template>
           </HomeSubTitle>
         </div>
@@ -281,25 +280,22 @@ onMounted(() => {
         <div class="module-header">
           <HomeSubTitle title="撑杆监测">
             <template #extra>
-              <el-select
-                v-model="searchForm.pole"
-                placeholder="时间"
-                class="custom-select"
-                @change="getPoleFault()"
-              >
-                <el-option label="1月" value="1"></el-option>
-                <el-option label="2月" value="2"></el-option>
-                <el-option label="3月" value="3"></el-option>
-                <el-option label="4月" value="4"></el-option>
-                <el-option label="5月" value="5"></el-option>
-                <el-option label="6月" value="6"></el-option>
-                <el-option label="7月" value="7"></el-option>
-                <el-option label="8月" value="8"></el-option>
-                <el-option label="9月" value="9"></el-option>
-                <el-option label="10月" value="10"></el-option>
-                <el-option label="11月" value="11"></el-option>
-                <el-option label="12月" value="12"></el-option>
-              </el-select>
+              <div class="flex items-center text-[14px] px-[16px]">
+                <span>时间：</span>
+                <el-select
+                  v-model="searchForm.pole"
+                  placeholder="时间"
+                  class="custom-select mini-size"
+                  @change="fetchPoleMonitorData()"
+                >
+                  <el-option
+                    v-for="v in dataViewConfig.monthArr"
+                    :key="v?.value"
+                    :label="v?.name"
+                    :value="v?.value"
+                  ></el-option>
+                </el-select>
+              </div>
             </template>
           </HomeSubTitle>
         </div>
@@ -311,26 +307,15 @@ onMounted(() => {
     </div>
     <!-- 中部检测模块 -->
     <div class="realTime-monitor-box">
-      <div class="monitor-images">
-        <div class="w-full h-[35px] fg-title ">实时监测画面</div>
-
-        <div class="monitor-images-left monitor-images-item">
-          <img :src="imageFault[0]?.url" />
-          <div class="fault-info">{{ imageFault[0]?.fault_type }}</div>
-        </div>
-        <div class="monitor-images-right monitor-images-item">
-          <img :src="imageFault[1]?.url" />
-          <div class="fault-info">{{ imageFault[1]?.fault_type }}</div>
-        </div>
-        <div class="monitor-images-left monitor-images-item">
-          <img :src="imageFault[0]?.url" />
-          <div class="fault-info">{{ imageFault[0]?.fault_type }}</div>
-        </div>
-        <div class="monitor-images-right monitor-images-item">
-          <img :src="imageFault[1]?.url" />
-          <div class="fault-info">{{ imageFault[1]?.fault_type }}</div>
-        </div>
+      <div class="w-full h-[35px] fg-title px-[16px] py-[20px]">
+        实时监测画面
       </div>
+      <ul class="flex monitor-images">
+        <li class="monitor-images-item" v-for="(v, i) in imageFault" :key="i">
+          <img :src="v?.url" />
+          <div class="fault-info">{{ v?.fault_type }}</div>
+        </li>
+      </ul>
     </div>
     <!-- 设备信息 -->
     <div class="device-info-box">
diff --git a/src/views/dashboard/components/AlarmModal.vue b/src/views/dashboard/components/AlarmModal.vue
index 7e6cff1..37b4488 100644
--- a/src/views/dashboard/components/AlarmModal.vue
+++ b/src/views/dashboard/components/AlarmModal.vue
@@ -1,50 +1,3 @@
-<template>
-    <el-dialog class="alarmModal-wrap fg-dialog" v-model="show" @close="handleClose" align-center :show-close="false">
-        <!-- 自定义标题栏 -->
-        <template #header="{ close, titleId, titleClass }">
-            <div class="flex items-center justify-between alarm-dialog-header fg-dialog-header">
-                <div class="flex items-center justify-center header-left">
-                    <div class="header-icon mr-[12px]"></div>
-                    <p class="overflow-hidden whitespace-nowrap text-ellipsis max-w-[650px]">故障提示</p>
-                </div>
-                  <div class="fg-dialog-header-close" @click="close">
-                    
-                </div>
-            </div>
-        </template>
-        <!-- 图片区域 -->
-        <div class="alarm-content">
-            <div class="alarm-content-top">
-            <div class="flex flex-wrap alarm-content-file" v-if="image?.length">
-               <template v-for="(item,index) in image" :key="index">
-                    <img :src="item.image_url" alt="" v-if="item.image_url && index < 4"></img>
-                </template>
-            </div>
-                <div class="fg-empty-image" v-else>
-                
-                </div>
-            </div>
-            <div class="alarm-content-bottom">
-                <span class="alarm-content-bottom-title">列车信息:</span>
-                <div class="alarm-content-bottom-info">
-                    <span class="mr-8">列车编号: <i>{{ info.train_number }}</i></span>
-                    <span class="mr-8">车型: <i>{{ info.train_model }}</i></span>
-                    <span>发生时间: <i>{{ info.created_at }}</i></span>
-                </div>
-                <div class="alarm-content-bottom-info">
-                    <span class="mr-8">告警类型: <i>{{ info.alarm_type }}</i></span>
-                    <span>故障类型: <i>{{ info.fault_type }}</i></span>
-                </div>
-                <div class="alarm-content-bottom-btn">
-                    <el-button type="primary" @click="exportToExcel" class="alarm-btn">
-                        <span class="icon"></span> 导出
-                    </el-button>
-                </div>
-            </div>
-        </div>
-    </el-dialog>
-</template>
-
 <script lang="ts" setup>
 // TODO 此处目前最多展示四张图片，后续可以优化成轮播展示
 import ExcelJS from 'exceljs';
@@ -66,11 +19,6 @@ const props = withDefaults(defineProps<Props>(), {
 
 const emit = defineEmits<Emits>();
 
-// 处理对话框关闭事件
-const handleClose = () => {
-    // emits('close');
-};
-
 const show = computed({
     get() {
         return props.value;
@@ -136,6 +84,54 @@ const exportToExcel = async () => {
     }
 };
 </script>
+<template>
+    <el-dialog class="alarmModal-wrap fg-dialog" v-model="show" align-center :show-close="false">
+        <!-- 自定义标题栏 -->
+        <template #header="{ close, titleId, titleClass }">
+            <div class="flex items-center justify-between alarm-dialog-header fg-dialog-header">
+                <div class="flex items-center justify-center header-left">
+                    <div class="header-icon mr-[12px]"></div>
+                    <p class="overflow-hidden whitespace-nowrap text-ellipsis max-w-[650px]">故障提示</p>
+                </div>
+                  <div class="fg-dialog-header-close" @click="close">
+                    
+                </div>
+            </div>
+        </template>
+        <!-- 图片区域 -->
+        <div class="alarm-content">
+            <div class="alarm-content-top">
+            <div class="flex flex-wrap alarm-content-file" v-if="image?.length">
+               <template v-for="(item,index) in image" :key="index">
+                    <img :src="item.image_url" alt="" v-if="item.image_url && index < 4"></img>
+                </template>
+            </div>
+                <div class="fg-empty-image" v-else>
+                
+                </div>
+            </div>
+            <div class="alarm-content-bottom">
+                <span class="alarm-content-bottom-title">列车信息:</span>
+                <div class="alarm-content-bottom-info">
+                    <span class="mr-8">列车编号: <i>{{ info.train_number }}</i></span>
+                    <span class="mr-8">车型: <i>{{ info.train_model }}</i></span>
+                    <span>发生时间: <i>{{ info.created_at }}</i></span>
+                </div>
+                <div class="alarm-content-bottom-info">
+                    <span class="mr-8">告警类型: <i>{{ info.alarm_type }}</i></span>
+                    <span>故障类型: <i>{{ info.fault_type }}</i></span>
+                </div>
+                <div class="alarm-content-bottom-btn">
+                    <el-button type="primary" @click="exportToExcel" class="alarm-btn">
+                        <span class="icon"></span> 导出
+                    </el-button>
+                </div>
+            </div>
+        </div>
+    </el-dialog>
+</template>
+
+
 
 <style lang="scss">
 
diff --git a/src/views/dashboard/components/AppearanceAlarmModal.vue b/src/views/dashboard/components/AppearanceAlarmModal.vue
index 672fb68..4c74aca 100644
--- a/src/views/dashboard/components/AppearanceAlarmModal.vue
+++ b/src/views/dashboard/components/AppearanceAlarmModal.vue
@@ -1,83 +1,3 @@
-<template>
-    <el-dialog class="appearanceAlarmModal fg-dialog" v-model="show" @close="handleClose" align-center :show-close="false" >
-        <!-- 自定义标题栏 -->
-        <template #header="{ close, titleId, titleClass }">
-            <div class="flex items-center justify-between appearanceAlarm-dialog-header fg-dialog-header">
-                <div class="flex items-center justify-center header-left">
-                    <div class="header-icon mr-[12px]"></div>
-                    <p class="overflow-hidden whitespace-nowrap text-ellipsis max-w-[650px]">故障提示</p>
-                </div>
-                 <div class="fg-dialog-header-close" @click="close">
-                    
-                </div>
-            </div>
-        </template>
-        <!-- 图片区域 -->
-        <div class="appearanceAlarm-content">
-            <div class="appearanceAlarm-content-top">
-                <!-- <template v-for="(item,index)  in image" :key="index">
-                    <img :src="item.image_url" alt="" v-if="index < 4"></img>
-                </template> -->
-                <div class="appearanceAlarm-content-top-left">
-                    <div class="appearanceAlarm-error-title-before appearanceAlarm-error-title">故障前</div>
-                    <div class="appearanceAlarm-content-top-left-img">
-                        <div class="appearanceAlarm-content-top-img">
-                            <img :src="imageBefore" alt="" />
-                        </div>
-                        <div class="appearanceAlarm-content-top-img-slider">
-                            <swiper ref="swiperModalRef" :modules="modules" :slides-per-view="3" :space-between="10" navigation
-                                :scrollbar="{ draggable: false }" :centered-slides="false" :observer="true" :observeParents="true"
-                                @swiper="onSwiper" @slideChange="onSlideChange">
-                                <swiper-slide v-for="(file, index) in beforeImage" :key="index" @click="handleSlideClick(index, 'before')"
-                                :class="{ 'active-slide': activeBeforeIndex === index }">
-                                <img :src="file.image_url" class="cursor-pointer" v-if="file.image_url" />
-                                </swiper-slide>
-                            </swiper>
-                        </div>
-                    </div>
-                </div>
-                <div class="appearanceAlarm-content-top-right">
-                    <div class="appearanceAlarm-error-title-after appearanceAlarm-error-title">故障后</div>
-                    <div class="appearanceAlarm-content-top-right-img">
-                        <div class="appearanceAlarm-content-top-img">
-                            <img :src="imageAfter" alt=""></img>
-                        </div>
-                        <div class="appearanceAlarm-content-top-img-slider">
-                            <swiper ref="swiperModalRef" :modules="modules" :slides-per-view="3" :space-between="10" navigation
-                                :scrollbar="{ draggable: false }" :centered-slides="false" :observer="true" :observeParents="true"
-                                @swiper="onSwiper" @slideChange="onSlideChange">
-                                <swiper-slide v-for="(file, index) in image" :key="index" @click="handleSlideClick(index, 'after')"
-                                :class="{ 'active-slide': activeAfterIndex === index }">
-                                <img :src="file.image_url" class="cursor-pointer" v-if="file.image_url" />
-                                </swiper-slide>
-                            </swiper>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="appearanceAlarm-content-info mt-[16px]">
-                <div class="font-bold appearanceAlarm-content-info-title mb-[12px]">列车信息:</div>
-                <ul class="appearanceAlarm-content-info-list">
-                     <li>
-                    <span class="mr-8">列车编号: <i>{{ info.train_number }}</i></span>
-                    <span class="mr-8">车型: <i>{{ info.train_model }}</i></span>
-                    <span>发生时间: <i>{{ info.created_at }}</i></span>
-                </li>
-                <li>
-                    <span class="mr-8">告警类型: <i>{{ info.alarm_type }}</i></span>
-                    <span>故障类型: <i>{{ info.fault_type }}</i></span>
-                </li>
-                </ul>
-                <div class="appearanceAlarm-content-info-btn">
-                    <el-button type="primary" @click="exportToExcel" class="appearanceAlarm-btn">
-                        <span class="icon"></span> 导出
-                    </el-button>
-                </div>
-            </div>
-        </div>
-    </el-dialog>
-</template>
-
 <script lang="ts" setup>
 import { ref } from 'vue';
 import ExcelJS from 'exceljs';
@@ -216,6 +136,87 @@ onMounted(() => {
 });
 
 </script>
+<template>
+    <el-dialog class="appearanceAlarmModal fg-dialog" v-model="show" @close="handleClose" align-center :show-close="false" >
+        <!-- 自定义标题栏 -->
+        <template #header="{ close, titleId, titleClass }">
+            <div class="flex items-center justify-between appearanceAlarm-dialog-header fg-dialog-header">
+                <div class="flex items-center justify-center header-left">
+                    <div class="header-icon mr-[12px]"></div>
+                    <p class="overflow-hidden whitespace-nowrap text-ellipsis max-w-[650px]">故障提示</p>
+                </div>
+                 <div class="fg-dialog-header-close" @click="close">
+                    
+                </div>
+            </div>
+        </template>
+        <!-- 图片区域 -->
+        <div class="appearanceAlarm-content">
+            <div class="appearanceAlarm-content-top">
+                <!-- <template v-for="(item,index)  in image" :key="index">
+                    <img :src="item.image_url" alt="" v-if="index < 4"></img>
+                </template> -->
+                <div class="appearanceAlarm-content-top-left">
+                    <div class="appearanceAlarm-error-title-before appearanceAlarm-error-title">故障前</div>
+                    <div class="appearanceAlarm-content-top-left-img">
+                        <div class="appearanceAlarm-content-top-img">
+                            <img :src="imageBefore" alt="" />
+                        </div>
+                        <div class="appearanceAlarm-content-top-img-slider">
+                            <swiper ref="swiperModalRef" :modules="modules" :slides-per-view="3" :space-between="10" navigation
+                                :scrollbar="{ draggable: false }" :centered-slides="false" :observer="true" :observeParents="true"
+                                @swiper="onSwiper" @slideChange="onSlideChange">
+                                <swiper-slide v-for="(file, index) in beforeImage" :key="index" @click="handleSlideClick(index, 'before')"
+                                :class="{ 'active-slide': activeBeforeIndex === index }">
+                                <img :src="file.image_url" class="cursor-pointer" v-if="file.image_url" />
+                                </swiper-slide>
+                            </swiper>
+                        </div>
+                    </div>
+                </div>
+                <div class="appearanceAlarm-content-top-right">
+                    <div class="appearanceAlarm-error-title-after appearanceAlarm-error-title">故障后</div>
+                    <div class="appearanceAlarm-content-top-right-img">
+                        <div class="appearanceAlarm-content-top-img">
+                            <img :src="imageAfter" alt=""></img>
+                        </div>
+                        <div class="appearanceAlarm-content-top-img-slider">
+                            <swiper ref="swiperModalRef" :modules="modules" :slides-per-view="3" :space-between="10" navigation
+                                :scrollbar="{ draggable: false }" :centered-slides="false" :observer="true" :observeParents="true"
+                                @swiper="onSwiper" @slideChange="onSlideChange">
+                                <swiper-slide v-for="(file, index) in image" :key="index" @click="handleSlideClick(index, 'after')"
+                                :class="{ 'active-slide': activeAfterIndex === index }">
+                                <img :src="file.image_url" class="cursor-pointer" v-if="file.image_url" />
+                                </swiper-slide>
+                            </swiper>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="appearanceAlarm-content-info mt-[16px]">
+                <div class="font-bold appearanceAlarm-content-info-title mb-[12px]">列车信息:</div>
+                <ul class="appearanceAlarm-content-info-list">
+                     <li>
+                    <span class="mr-8">列车编号: <i>{{ info.train_number }}</i></span>
+                    <span class="mr-8">车型: <i>{{ info.train_model }}</i></span>
+                    <span>发生时间: <i>{{ info.created_at }}</i></span>
+                </li>
+                <li>
+                    <span class="mr-8">告警类型: <i>{{ info.alarm_type }}</i></span>
+                    <span>故障类型: <i>{{ info.fault_type }}</i></span>
+                </li>
+                </ul>
+                <div class="appearanceAlarm-content-info-btn">
+                    <el-button type="primary" @click="exportToExcel" class="appearanceAlarm-btn">
+                        <span class="icon"></span> 导出
+                    </el-button>
+                </div>
+            </div>
+        </div>
+    </el-dialog>
+</template>
+
+
 
 <style lang="scss">
 .appearanceAlarmModal.el-dialog {
diff --git a/src/views/dashboard/components/BarChart.vue b/src/views/dashboard/components/BarChart.vue
deleted file mode 100644
index 7bf3b42..0000000
--- a/src/views/dashboard/components/BarChart.vue
+++ /dev/null
@@ -1,320 +0,0 @@
-<script setup lang="ts">
-import { onMounted, onUnmounted, ref, watch, nextTick } from "vue";
-import * as echarts from "echarts";
-
-// 定义组件接收的props
-const props = defineProps({
-  xData: {
-    type: Array as PropType<Array<string>>,
-    default: () => [],
-  },
-  legendArr: {
-    type: Array as PropType<Array<string>>,
-    default: () => [],
-  },
-  datas: {
-    type: Array as PropType<Array<Array<number>>>,
-    default: () => [],
-  },
-  colorArr: {
-    type: Array as PropType<Array<Array<string>>>,
-    default: () => [],
-  },
-});
-const chartContainer = ref<HTMLDivElement | null>(null);
-let chartInstance: echarts.ECharts | null = null;
-
-// 自定义3D形状
-const CubeLeft = echarts.graphic.extendShape({
-  shape: { x: 0, y: 0 },
-  buildPath: (ctx, shape) => {
-    const { xAxisPoint } = shape;
-    const [c0, c1, c2, c3] = [
-      [shape.x, shape.y],
-      [shape.x - 12, shape.y - 6],
-      [xAxisPoint[0] - 12, xAxisPoint[1] - 6],
-      [xAxisPoint[0], xAxisPoint[1]],
-    ];
-    ctx
-      .moveTo(c0[0], c0[1])
-      .lineTo(c1[0], c1[1])
-      .lineTo(c2[0], c2[1])
-      .lineTo(c3[0], c3[1])
-      .closePath();
-  },
-});
-
-const CubeRight = echarts.graphic.extendShape({
-  shape: { x: 0, y: 0 },
-  buildPath: (ctx, shape) => {
-    const { xAxisPoint } = shape;
-    const [c1, c2, c3, c4] = [
-      [shape.x, shape.y],
-      [xAxisPoint[0], xAxisPoint[1]],
-      [xAxisPoint[0] + 12, xAxisPoint[1] - 6],
-      [shape.x + 12, shape.y - 6],
-    ];
-    ctx
-      .moveTo(c1[0], c1[1])
-      .lineTo(c2[0], c2[1])
-      .lineTo(c3[0], c3[1])
-      .lineTo(c4[0], c4[1])
-      .closePath();
-  },
-});
-
-const CubeTop = echarts.graphic.extendShape({
-  shape: { x: 0, y: 0 },
-  buildPath: (ctx, shape) => {
-    const [c1, c2, c3, c4] = [
-      [shape.x, shape.y],
-      [shape.x + 12, shape.y - 6],
-      [shape.x, shape.y - 12],
-      [shape.x - 12, shape.y - 6],
-    ];
-    ctx
-      .moveTo(c1[0], c1[1])
-      .lineTo(c2[0], c2[1])
-      .lineTo(c3[0], c3[1])
-      .lineTo(c4[0], c4[1])
-      .closePath();
-  },
-});
-// 注册三个面图形
-echarts.graphic.registerShape("CubeLeft", CubeLeft);
-echarts.graphic.registerShape("CubeRight", CubeRight);
-echarts.graphic.registerShape("CubeTop", CubeTop);
-
-// 初始化图表
-const initChart = () => {
-  if (!chartContainer.value) return;
-
-  chartInstance = echarts.init(chartContainer.value);
-  setTimeout(() => {
-    chartInstance?.resize();
-    updateChart();
-  }, 500);
-};
-
-// 更新图表配置
-const updateChart = () => {
-  if (!chartInstance) return;
-  const series = props.datas
-    .map((item, index) => [
-      {
-        type: "custom",
-        name: props.legendArr[index],
-        renderItem: (params, api) => ({
-          type: "group",
-          x: (index - props.datas.length / 2) * 30 + 15,
-          children: [
-            {
-              type: "CubeLeft",
-              shape: {
-                api,
-                xValue: api.value(0),
-                yValue: api.value(1),
-                x: api.coord([api.value(0), api.value(1)])[0],
-                y: api.coord([api.value(0), api.value(1)])[1],
-                xAxisPoint: api.coord([api.value(0), 0]),
-              },
-              style: {
-                fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  {
-                    offset: 0,
-                    color: props.colorArr[index % props.colorArr.length][1],
-                  },
-                  {
-                    offset: 1,
-                    color: props.colorArr[index % props.colorArr.length][0],
-                  },
-                ]),
-              },
-            },
-            {
-              type: "CubeRight",
-              shape: {
-                api,
-                xValue: api.value(0),
-                yValue: api.value(1),
-                x: api.coord([api.value(0), api.value(1)])[0],
-                y: api.coord([api.value(0), api.value(1)])[1],
-                xAxisPoint: api.coord([api.value(0), 0]),
-              },
-              style: {
-                fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  {
-                    offset: 0,
-                    color: props.colorArr[index % props.colorArr.length][1],
-                  },
-                  {
-                    offset: 1,
-                    color: props.colorArr[index % props.colorArr.length][0],
-                  },
-                ]),
-              },
-            },
-            {
-              type: "CubeTop",
-              shape: {
-                api,
-                xValue: api.value(0),
-                yValue: api.value(1),
-                x: api.coord([api.value(0), api.value(1)])[0],
-                y: api.coord([api.value(0), api.value(1)])[1],
-                xAxisPoint: api.coord([api.value(0), 0]),
-              },
-              style: {
-                fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  {
-                    offset: 0,
-                    color: props.colorArr[index % props.colorArr.length][1],
-                  },
-                  {
-                    offset: 1,
-                    color: props.colorArr[index % props.colorArr.length][1],
-                  },
-                ]),
-              },
-            },
-          ],
-        }),
-        data: item,
-      },
-      {
-        type: "bar",
-        name: props.legendArr[index],
-        barWidth: 25,
-        // label: {
-        //   normal: {
-        //     show: true,
-        //     position: "top",
-        //     fontSize: 16,
-        //     color: "#fff",
-        //     offset: [0, -10],
-        //   },
-        // },
-        itemStyle: { color: "transparent" },
-        data: item,
-        yAxisIndex: 0, // 使用左y轴
-      },
-      {
-        type: "bar",
-        name: props.legendArr[index],
-        barWidth: 25,
-        itemStyle: { color: "transparent" },
-        data: item,
-        yAxisIndex: 1, // 使用左y轴
-      },
-    ])
-    .flat();
-
-  chartInstance.setOption({
-    tooltip: {
-      trigger: "axis",
-      borderWidth: 0,
-      backgroundColor: "rgba(8,36,68,.9)",
-      color: "#fff",
-      textStyle: { color: "#fff" },
-      formatter: (params) => {
-        let str = params[0].name + "</br>";
-        params.forEach((item, index) => {
-          if (item.seriesType === "custom") {
-            str += `
-                <div style='display:flex;justify-content:space-between;align-items:center'>
-                  <div style='margin-right:20px;'>
-                    <span style="display:inline-block;width:10px;height:10px;border-radius:5px;background-color:${
-                      props.colorArr[index % props.colorArr.length][0]
-                    }"></span>
-                    &nbsp;${item.seriesName}
-                  </div>
-                  <span>&nbsp;${item.value ? item.value : "-"}</span>
-                </div>`;
-          }
-        });
-        return str;
-      },
-    },
-    grid: {
-      left: "5%",
-      right: "5%",
-      top: "5%",
-      bottom: "10%",
-      containLabel: true,
-    },
-    legend: {
-      left: "center",
-      top: "90%",
-      itemWidth: 12, // 图例项宽度
-      itemHeight: 8,
-      textStyle: { color: "#fff", fontSize: 12 },
-      data: props.legendArr.map((name, index) => ({
-        name,
-        textStyle: { color: "#fff", fontSize: 12 },
-        itemStyle: { color: props.colorArr[index % props.colorArr.length][1] },
-      })),
-    },
-    xAxis: {
-      type: "category",
-      data: props.xData,
-      axisLine: { lineStyle: { color: "rgba(239, 247, 253, .1)" } },
-      axisLabel: { fontSize: 12, color: "#fff", margin: 12 },
-    },
-    yAxis: [
-      {
-        // name: "kWh",
-        // nameTextStyle: { color: "#fff", fontSize: 12 },
-        splitLine: {
-          lineStyle: { type: "dashed", color: "rgba(80,112,242,0.3)" },
-        },
-        axisLabel: { textStyle: { color: "#8C8C8C" }, fontSize: 12 },
-        // axisLine: { lineStyle: { color: "#8C8C8C" } },
-        // scale: true, // 同步刻度
-      },
-      {
-        // name: "kWh",
-        // nameTextStyle: { color: "#fff", fontSize: 12 },
-        splitLine: { lineStyle: { color: "transparent" } },
-        axisLabel: { textStyle: { color: "#8C8C8C" }, fontSize: 12 },
-        // axisLine: { lineStyle: { color: "#8C8C8C" } },
-        position: "right",
-        // scale: true, // 同步刻度
-      },
-    ],
-    series,
-  });
-};
-const handleResize = () => {
-  chartInstance?.resize();
-};
-// 生命周期管理
-onMounted(async () => {
-  await nextTick();
-  initChart();
-});
-
-onUnmounted(() => {
-  if (chartInstance) {
-    chartInstance.dispose();
-    chartInstance = null;
-    chartInstance?.resize();
-  }
-});
-
-// 响应式更新
-watch(
-  () => props,
-  async () => {
-    await nextTick();
-    updateChart();
-    // delay(600).then(() => resize());
-  },
-  {
-    deep: true,
-    immediate: true,
-  }
-);
-</script>
-<template>
-  <div ref="chartContainer" style="width: 100%; height: 100%" />
-</template>
diff --git a/src/views/dashboard/components/DeviceStatus.vue b/src/views/dashboard/components/DeviceStatus.vue
index be5711d..8ce5ac5 100644
--- a/src/views/dashboard/components/DeviceStatus.vue
+++ b/src/views/dashboard/components/DeviceStatus.vue
@@ -2,7 +2,7 @@
  * @Author: donghao donghao@supervision.ltd
  * @Date: 2025-03-10 18:00:44
  * @LastEditors: donghao donghao@supervision.ltd
- * @LastEditTime: 2025-08-13 15:58:03
+ * @LastEditTime: 2025-08-20 09:19:06
  * @FilePath: \5G-Loading-Bay-Web\src\views\dashboard\components\DeviceStatus.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -57,14 +57,15 @@ const deviceStatusOptions = ref<Record<string, any>[]>([
           <el-progress
             :show-text="false"
             :stroke-width="4"
-            :percentage="
-              Math.floor(
-                (deviceStatus?.[v.valueKey] / deviceStatus?.total) * 100
-              )
-            "
+           :percentage="100"
             :color="v.bgColor"
           />
         </div>
+         <!-- :percentage="
+              Math.floor(
+                (deviceStatus?.[v.valueKey] / deviceStatus?.total) * 100
+              )
+            " -->
       </div>
     </li>
   </ul>
diff --git a/src/views/dashboard/components/DiggerAlarmModal.vue b/src/views/dashboard/components/DiggerAlarmModal.vue
index f4b10ce..7ae6a59 100644
--- a/src/views/dashboard/components/DiggerAlarmModal.vue
+++ b/src/views/dashboard/components/DiggerAlarmModal.vue
@@ -1,8 +1,39 @@
+<script lang="ts" setup>
+import { ref } from "vue";
+import { Navigation, Scrollbar } from "swiper/modules";
+
+interface Props {
+  /** 弹窗显隐 */
+  value: boolean;
+  info: Record<string, any>;
+  fileList: any[];
+}
+interface Emits {
+  (e: "update:value", val: boolean): void;
+  (e: "close"): void;
+}
+const props = withDefaults(defineProps<Props>(), {
+  value: false,
+  info: {},
+  fileList: [],
+});
+
+const emit = defineEmits<Emits>();
+
+
+const show = computed({
+  get() {
+    return props.value;
+  },
+  set(val: boolean) {
+    emit("update:value", val);
+  },
+});
+</script>
 <template>
   <el-dialog
     class="digger-alarm-modal fg-dialog"
     v-model="show"
-    @close="handleClose"
     align-center
     :show-close="false"
   >
@@ -35,41 +66,7 @@
   </el-dialog>
 </template>
 
-<script lang="ts" setup>
-import { ref } from "vue";
-import { Navigation, Scrollbar } from "swiper/modules";
 
-interface Props {
-  /** 弹窗显隐 */
-  value: boolean;
-  info: Record<string, any>;
-  fileList: any[];
-}
-interface Emits {
-  (e: "update:value", val: boolean): void;
-  (e: "close"): void;
-}
-const props = withDefaults(defineProps<Props>(), {
-  value: false,
-  info: {},
-  fileList: [],
-});
-
-const emit = defineEmits<Emits>();
-// 处理对话框关闭事件
-const handleClose = () => {
-  emits("close");
-};
-
-const show = computed({
-  get() {
-    return props.value;
-  },
-  set(val: boolean) {
-    emit("update:value", val);
-  },
-});
-</script>
 
 <style lang="scss">
 .digger-alarm-modal.el-dialog {
diff --git a/src/views/dashboard/components/HistoryVideoModal.vue b/src/views/dashboard/components/HistoryVideoModal.vue
index f61595d..8b4b7a8 100644
--- a/src/views/dashboard/components/HistoryVideoModal.vue
+++ b/src/views/dashboard/components/HistoryVideoModal.vue
@@ -29,16 +29,7 @@ const togglePlay = () => {
   isPlaying.value = !isPlaying.value;
 };
 
-// TODO 监听进度更新 暂未使用
-const handleProgress = (data: { currentTime: number; duration: number }) => {
-  console.log((data.currentTime / data.duration) * 100, "handleProgress");
-  const progressVal = (data.currentTime / data.duration) * 100;
-};
 
-// TODO 处理时长更新 暂未使用
-const handleDuration = (newDuration: number) => {
-  //   duration.value = newDuration
-};
 // 加载数据
 const loadData = () => {
   recordList.value = props.historyVideos;
@@ -76,11 +67,6 @@ const formatTime = (timeStr) => {
   return timeStr.split(" ")[1].substring(0, 5); // 只显示时分
 };
 
-// 处理对话框关闭事件
-const handleClose = () => {
-  emits("close");
-};
-
 const show = computed({
   get() {
     return props.value;
@@ -96,7 +82,6 @@ defineExpose({ loadData });
   <el-dialog
     class="historyVideoModal-wrap fg-dialog fg-dialog2"
     v-model="show"
-    @close="handleClose"
     align-center
     :show-close="false"
   >
@@ -119,10 +104,8 @@ defineExpose({ loadData });
     <div class="flex main-content">
       <!-- 播放器 -->
       <Player
-        :src="currentVideo.video_url"
+        :src="currentVideo?.video_url"
         :is-playing="isPlaying"
-        @update:progress="handleProgress"
-        @update:duration="handleDuration"
         @play="isPlaying = true"
         @pause="isPlaying = false"
       />
@@ -136,7 +119,6 @@ defineExpose({ loadData });
             class="custom-select record_date_select"
             clearable
             @change="handleDateChange"
-            @clear="handleClear"
           >
             <el-option
               v-for="(item, index) in dateList"
diff --git a/src/views/dashboard/components/PieChart.vue b/src/views/dashboard/components/PieChart.vue
deleted file mode 100644
index 637519f..0000000
--- a/src/views/dashboard/components/PieChart.vue
+++ /dev/null
@@ -1,92 +0,0 @@
-<script setup lang="ts">
-import { onMounted, onUnmounted, ref, watch } from "vue";
-import * as echarts from "echarts";
-
-const props = defineProps({
-  data: {
-    type: Array as PropType<Array<{ value: number; name: string }>>,
-    required: true,
-  },
-  colors: { type: Array as PropType<Array<string>>, default: () => [] },
-});
-
-const chartContainer = ref<HTMLDivElement | null>(null);
-let chartInstance: echarts.ECharts | null = null;
-const colorsArr = ['#FFCC4A','#028FF5','#06EA7C','#8500FF','#FF7D05','#00D1FF']
-// 初始化图表
-const initChart = () => {
-  if (!chartContainer.value) return;
-  chartInstance = echarts.init(chartContainer.value);
-  setTimeout(() => {
-    chartInstance?.resize();
-    updateChart();
-  }, 500);
-};
-
-// 更新图表配置
-const updateChart = () => {
-  if (!chartInstance) return;
-
-  chartInstance.setOption({
-    legend: {
-      type: "scroll",
-      orient: "vertical",
-      left: "70%",
-      align: "left",
-      top: "middle",
-      itemWidth: 16, // 图例项宽度
-      itemHeight: 8,
-      textStyle: { color: "#FFF" },
-    },
-    series: [
-      {
-        type: "pie",
-        radius: ["30%", "80%"],
-        center: ["35%", "50%"],
-        label: { show: false },
-        itemStyle: {
-          color: (params) =>
-            new echarts.graphic.LinearGradient(0, 0, 1, 0, [
-              { offset: 0, color: props.colors[params.dataIndex] },
-              { offset: 1, color: colorsArr[params.dataIndex] },
-            ]),
-        },
-        data: props.data,
-      },
-    ],
-  });
-};
-
-// 生命周期管理
-onMounted(() => {
-  initChart();
-});
-
-onUnmounted(() => {
-  if (chartInstance) {
-    chartInstance.dispose();
-    chartInstance = null;
-  }
-});
-
-// 响应式更新
-watch(
-  () => props.data,
-  async () => {
-    await nextTick();
-    updateChart();
-  }
-);
-
-// 窗口大小监听
-// onMounted(() => {
-//   window.addEventListener("resize", () => chartInstance?.resize());
-// });
-
-// onUnmounted(() => {
-//   window.removeEventListener("resize", () => chartInstance?.resize());
-// });
-</script>
-<template>
-  <div ref="chartContainer" style="width: 100%; height: 100%" />
-</template>
diff --git a/src/views/dashboard/components/PieChartSmall.vue b/src/views/dashboard/components/PieChartSmall.vue
deleted file mode 100644
index 729ec9a..0000000
--- a/src/views/dashboard/components/PieChartSmall.vue
+++ /dev/null
@@ -1,92 +0,0 @@
-<script setup lang="ts">
-import { onMounted, onUnmounted, ref, watch } from "vue";
-import * as echarts from "echarts";
-
-const props = defineProps({
-  data: {
-    type: Array as PropType<Array<{ value: number; name: string }>>,
-    required: true,
-  },
-  colors: { type: Array as PropType<Array<string>>, default: () => [] },
-});
-
-const chartContainer = ref<HTMLDivElement | null>(null);
-let chartInstance: echarts.ECharts | null = null;
-const colorsArr = ['#3FE3FA','#FF4D00']
-// 初始化图表
-const initChart = () => {
-  if (!chartContainer.value) return;
-  chartInstance = echarts.init(chartContainer.value);
-  setTimeout(() => {
-    chartInstance?.resize();
-    updateChart();
-  }, 500);
-};
-
-// 更新图表配置
-const updateChart = () => {
-  if (!chartInstance) return;
-
-  chartInstance.setOption({
-    legend: {
-      type: "scroll",
-      orient: "vertical",
-      left: "70%",
-      align: "left",
-      top: "middle",
-      itemWidth: 16, // 图例项宽度
-      itemHeight: 8,
-      textStyle: { color: "#FFF" },
-    },
-    series: [
-      {
-        type: "pie",
-        radius: ["40%", "80%"],
-        center: ["35%", "50%"],
-        label: { show: false },
-        itemStyle: {
-          color: (params) =>
-            new echarts.graphic.LinearGradient(0, 0, 1, 0, [
-              { offset: 0, color: props.colors[params.dataIndex] },
-              { offset: 1, color: colorsArr[params.dataIndex] },
-            ]),
-        },
-        data: props.data,
-      },
-    ],
-  });
-};
-
-// 生命周期管理
-onMounted(() => {
-  initChart();
-});
-
-onUnmounted(() => {
-  if (chartInstance) {
-    chartInstance.dispose();
-    chartInstance = null;
-  }
-});
-
-// 响应式更新
-watch(
-  () => props.data,
-  async () => {
-    await nextTick();
-    updateChart();
-  }
-);
-
-// 窗口大小监听
-// onMounted(() => {
-//   window.addEventListener("resize", () => chartInstance?.resize());
-// });
-
-// onUnmounted(() => {
-//   window.removeEventListener("resize", () => chartInstance?.resize());
-// });
-</script>
-<template>
-  <div ref="chartContainer" style="width: 100%; height: 100%" />
-</template>
diff --git a/src/views/dashboard/components/SwiperMonitor.vue b/src/views/dashboard/components/SwiperMonitor.vue
index a3de58f..b9cf1fc 100644
--- a/src/views/dashboard/components/SwiperMonitor.vue
+++ b/src/views/dashboard/components/SwiperMonitor.vue
@@ -9,7 +9,7 @@
 
 <script lang="ts" setup>
 import Player from "@/components/videoPlayer/Player.vue";
-import SwiperPlayer from "./SwiperPlayer.vue";
+import SwiperPlayer from "@/components/Swiper/swiperPlayer.vue";
 import { Swiper, SwiperSlide } from "swiper/vue";
 import { Navigation, Scrollbar, Mousewheel, Pagination } from "swiper/modules";
 import "swiper/css";
diff --git a/src/views/dashboard/components/SwiperPlayer.vue b/src/views/dashboard/components/SwiperPlayer.vue
deleted file mode 100644
index 97d6ed3..0000000
--- a/src/views/dashboard/components/SwiperPlayer.vue
+++ /dev/null
@@ -1,49 +0,0 @@
-<template>
-    <div class="flex items-center justify-center w-full h-full position-relative">
-        <video ref="videoRef" :controls="false" muted :src="videoUrl" width="100%" height="144"
-            style="object-fit: cover;" @error="handleVideoError" v-if="!isVideoError"></video>
-        <div class="bg_error_img" v-if="isVideoError">
-
-        </div>
-        <div :class="{ 'bg_icon': true, 'playing': isPlaying }" v-if="!isVideoError">
-            <!-- {{ isPlaying }} -->
-        </div>
-    </div>
-</template>
-<script lang="ts" setup>
-
-const props = defineProps<{
-    videoUrl: string;
-    isPlaying: boolean;
-}>();
-const videoRef = ref<HTMLVideoElement | null>(null);
-const isVideoError = ref<boolean>(false);
-
-const handleVideoError = () => {
-    console.log('handleVideoError')
-    isVideoError.value = true;
-};
-
-</script>
-<style lang="scss" scoped>
-.bg_error_img {
-    width: 100%;
-    height: 100%;
-    background: url("@/assets/common/load_file_error.png") no-repeat center center;
-    background-size: 50%;
-    border: 1px dashed red;
-}
-
-.bg_icon {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    background: url("@/assets/common/player_icon_1.png") no-repeat center center;
-    background-size: 40px;
-
-    &.playing {
-        background: url("@/assets/common/player_icon_2.png") no-repeat center center;
-        background-size: 40px;
-    }
-}
-</style>
diff --git a/src/views/dashboard/components/VehiclModal.vue b/src/views/dashboard/components/VehiclModal.vue
index e51718d..b83bc15 100644
--- a/src/views/dashboard/components/VehiclModal.vue
+++ b/src/views/dashboard/components/VehiclModal.vue
@@ -18,10 +18,6 @@ const props = withDefaults(defineProps<Props>(), {
 
 const emit = defineEmits<Emits>();
 
-// 处理对话框关闭事件
-const handleClose = () => {
-    // emits('close');
-};
 
 const show = computed({
     get() {
@@ -36,7 +32,7 @@ const show = computed({
 const itemCount = 16; // 这里可以根据实际需求动态设置
 </script>
 <template>
-    <el-dialog class="vehiclModal-wrap fg-dialog fg-dialog2" v-model="show" @close="handleClose" align-center :show-close="false" >
+    <el-dialog class="vehiclModal-wrap fg-dialog fg-dialog2" v-model="show" align-center :show-close="false" >
         <!-- 自定义标题栏 -->
         <template #header="{ close, titleId, titleClass }">
             <div class="flex items-center justify-between vehicl-dialog-header fg-dialog-header">
@@ -51,7 +47,6 @@ const itemCount = 16; // 这里可以根据实际需求动态设置
         </template>
         <!-- 图片区域 -->
         <div class="vehicl-content">
-            <!-- //TODO 图片底部有标注 -->
             <div class="vehicl-content-top">
                 <span class="vehicl-content-bottom-title">列车ID:</span>
                 <div class="vehicl-content-top-img">
@@ -64,7 +59,6 @@ const itemCount = 16; // 这里可以根据实际需求动态设置
                 </div>
             </div>
             <div class="vehicl-content-bottom">
-                        <!-- //TODO 车厢图片需要替换 -->
                 <span class="vehicl-content-bottom-title">列车与车厢号</span>
                 <div class="flex items-center vehicl-content-bottom-vehicl">
                     <div class="train-card-item mb-[8px] mr-[8px] flex items-center justify-center ">
diff --git a/src/views/dashboard/components/VideoExport.vue b/src/views/dashboard/components/VideoExport.vue
index b820092..aef32cd 100644
--- a/src/views/dashboard/components/VideoExport.vue
+++ b/src/views/dashboard/components/VideoExport.vue
@@ -4,6 +4,9 @@ import SwiperPlayer from "@/components/Swiper/swiperPlayer.vue";
 import SwiperFile from "@/components/Swiper/swiperFile.vue";
 import { isSuccessApi } from "@/utils/forApi";
 // TODO 整体优化交互
+/**
+  * @使用数据结构 {"infer_result": [{"log": "一段文本", "pic_url": "图片路径"}, {"log": "", "pic_url": ""}]}
+ */
 // 预设的长文本内容
 const longText = `
 const xData = ref(["1月", "2月", "3月", "4月", "5月"]);
@@ -401,7 +404,7 @@ const handleExport = () => {
 // 计算文本生成速度
 const textGenerationSpeed = computed(() => {
   // 根据文本长度动态调整速度
-  return 10;
+  return 2;
   // return 100;
 });