diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }
diff --git a/src/components/Echart/BarChartVerticalDynamics.vue b/src/components/Echart/BarChartVerticalDynamics.vue
new file mode 100644
index 0000000..2ba92d2
--- /dev/null
+++ b/src/components/Echart/BarChartVerticalDynamics.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  // 柱子之间的距离
+  barGap: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 20,
+        right: 20,
+        bottom: 30,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 2,
+        right: 60,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  // 是否使用默认的颜色
+  useDefaultCoclor: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2fade0', '#01c2f9'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 20,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    title: [{ text: props.title }],
+    grid: props.grid,
+    legend: props.legend, // 图例
+    toolbox: [{
+      // feature: {
+      //   saveAsImage: {
+      //     show: 'true',
+      //     icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+      //     title: '保存为图片',
+      //     type: 'png',
+      //     connectedBackgroundColor: '#fff',
+      //     name: '',
+      //   },
+      // },
+    }],
+    tooltip: {
+      trigger: 'axis',
+      confine: true, // 是否限制提示框在图表范围内
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 11,
+          rotate: props.rotate,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+      textStyle: {
+        fontWeight: 'normal',
+        fontSize: 14,
+        color: '#0b2c5b',
+      },
+      bottom: 0,
+      left: 'center',
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        barGap: props.barGap,
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0 && !props.useDefaultCoclor) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  chart.setOption({})
+  nextTick(() => {
+    chart.resize()
+  })
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 2)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }
diff --git a/src/components/Echart/BarChartVerticalDynamics.vue b/src/components/Echart/BarChartVerticalDynamics.vue
new file mode 100644
index 0000000..2ba92d2
--- /dev/null
+++ b/src/components/Echart/BarChartVerticalDynamics.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  // 柱子之间的距离
+  barGap: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 20,
+        right: 20,
+        bottom: 30,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 2,
+        right: 60,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  // 是否使用默认的颜色
+  useDefaultCoclor: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2fade0', '#01c2f9'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 20,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    title: [{ text: props.title }],
+    grid: props.grid,
+    legend: props.legend, // 图例
+    toolbox: [{
+      // feature: {
+      //   saveAsImage: {
+      //     show: 'true',
+      //     icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+      //     title: '保存为图片',
+      //     type: 'png',
+      //     connectedBackgroundColor: '#fff',
+      //     name: '',
+      //   },
+      // },
+    }],
+    tooltip: {
+      trigger: 'axis',
+      confine: true, // 是否限制提示框在图表范围内
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 11,
+          rotate: props.rotate,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+      textStyle: {
+        fontWeight: 'normal',
+        fontSize: 14,
+        color: '#0b2c5b',
+      },
+      bottom: 0,
+      left: 'center',
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        barGap: props.barGap,
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0 && !props.useDefaultCoclor) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  chart.setOption({})
+  nextTick(() => {
+    chart.resize()
+  })
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 2)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 4213084..72666b2 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -39,7 +39,7 @@
       return {
         top: 30,
         left: 10,
-        right: 20,
+        right: 30,
         bottom: 10,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -187,10 +187,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -290,16 +286,6 @@
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as lineSeriesOption[],
   }
   // 标题
@@ -378,9 +364,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 6)
-  // }
   chart.setOption({})
   chart.resize()
 }
@@ -390,9 +373,6 @@
   if (chart) {
     console.log('渲染折线图')
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 3)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
     chart.resize()
   }

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }
diff --git a/src/components/Echart/BarChartVerticalDynamics.vue b/src/components/Echart/BarChartVerticalDynamics.vue
new file mode 100644
index 0000000..2ba92d2
--- /dev/null
+++ b/src/components/Echart/BarChartVerticalDynamics.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  // 柱子之间的距离
+  barGap: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 20,
+        right: 20,
+        bottom: 30,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 2,
+        right: 60,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  // 是否使用默认的颜色
+  useDefaultCoclor: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2fade0', '#01c2f9'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 20,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    title: [{ text: props.title }],
+    grid: props.grid,
+    legend: props.legend, // 图例
+    toolbox: [{
+      // feature: {
+      //   saveAsImage: {
+      //     show: 'true',
+      //     icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+      //     title: '保存为图片',
+      //     type: 'png',
+      //     connectedBackgroundColor: '#fff',
+      //     name: '',
+      //   },
+      // },
+    }],
+    tooltip: {
+      trigger: 'axis',
+      confine: true, // 是否限制提示框在图表范围内
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 11,
+          rotate: props.rotate,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+      textStyle: {
+        fontWeight: 'normal',
+        fontSize: 14,
+        color: '#0b2c5b',
+      },
+      bottom: 0,
+      left: 'center',
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        barGap: props.barGap,
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0 && !props.useDefaultCoclor) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  chart.setOption({})
+  nextTick(() => {
+    chart.resize()
+  })
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 2)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 4213084..72666b2 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -39,7 +39,7 @@
       return {
         top: 30,
         left: 10,
-        right: 20,
+        right: 30,
         bottom: 10,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -187,10 +187,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -290,16 +286,6 @@
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as lineSeriesOption[],
   }
   // 标题
@@ -378,9 +364,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 6)
-  // }
   chart.setOption({})
   chart.resize()
 }
@@ -390,9 +373,6 @@
   if (chart) {
     console.log('渲染折线图')
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 3)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
     chart.resize()
   }
diff --git a/src/components/Echart/LineChartDynamics.vue b/src/components/Echart/LineChartDynamics.vue
new file mode 100644
index 0000000..2a2f063
--- /dev/null
+++ b/src/components/Echart/LineChartDynamics.vue
@@ -0,0 +1,420 @@
+<script lang="ts" setup name="LineChart">
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { lineDataI, lineOption, lineSeriesOption } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+import { formatColor, getAlphaColor } from './utils'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#09c2f9',
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 10,
+        right: 30,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * X轴类型
+   */
+  xAxisType: {
+    type: String,
+    default: 'category',
+    validator: (value: string) => {
+      return ['category', 'value', 'time', 'log'].includes(value)
+    },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 颜色
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        '#f5b637',
+        '#45c7f2',
+        '#ff9900',
+        '#E46CBB',
+        '#9A66E4',
+        '#ed3f14',
+        '#01C2F9',
+      ]
+    },
+  },
+  /**
+   * 实虚线
+   */
+  axisLineType: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#7a6b74',
+  },
+  // x轴标签倾斜
+  Xrotate: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  /**
+   * 是否为渐变折线图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * y轴最大值
+   */
+  max: {
+    type: [String, Number],
+    default: '',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 平滑
+   */
+  smooth: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: lineOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        type: props.xAxisType,
+        boundaryGap: true,
+        axisLine: {
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 11,
+          rotate: props.Xrotate,
+        },
+        splitLine: {
+          show: false,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: props.axisLineType,
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        nameTextStyle: {
+          color: props.fontColor,
+          fontSize: 14,
+          verticalAlign: 'middle',
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as lineSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // x轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴
+    }
+  }
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: lineSeriesOption[] = []
+    // 遍历data， 拆分轴线名称，数据和颜色
+    for (const itemIndex in props.data) {
+      const item = props.data[itemIndex]
+      const series: lineSeriesOption = {
+        name: item.name, // 线系列名
+        type: item.seriesType || 'line',
+        symbol: 'none', // 去掉折线节点
+        smooth: props.smooth, // 曲线平滑设置
+        lineStyle: {
+          width: 2,
+        },
+        label: {
+          show: item.seriesType === 'bar' ? true : false,
+          position: 'top',
+          color: props.labelColor,
+          fontSize: 15,
+        },
+        data: item.data,
+      }
+      // 线段颜色
+      if (item.color || props.colors.length > 0) {
+        series.itemStyle = {
+          color: item.color ? formatColor(item.color) : formatColor(props.colors[itemIndex] as string),
+        }
+        // 如果开启渐变
+        if (props.gradient) {
+          series.areaStyle = {
+            color: new echarts.graphic.LinearGradient(
+              0, 0, 0, 1, // 变化度 ,渐变方向
+              [
+                {
+                  offset: 0.1,
+                  color: item.color ? getAlphaColor(item.color, 0.6) : getAlphaColor(props.colors[itemIndex] as string, 0.6),
+                },
+                {
+                  offset: 1,
+                  color: '#fff',
+                },
+              ],
+            ),
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  // if (props.isAutomaticCarousel) {
+  //   automaticCarousel(option, chart, 3000, 6)
+  // }
+  chart.setOption({})
+  chart.resize()
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    console.log('渲染折线图')
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 3)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+    chart.resize()
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }
diff --git a/src/components/Echart/BarChartVerticalDynamics.vue b/src/components/Echart/BarChartVerticalDynamics.vue
new file mode 100644
index 0000000..2ba92d2
--- /dev/null
+++ b/src/components/Echart/BarChartVerticalDynamics.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  // 柱子之间的距离
+  barGap: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 20,
+        right: 20,
+        bottom: 30,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 2,
+        right: 60,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  // 是否使用默认的颜色
+  useDefaultCoclor: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2fade0', '#01c2f9'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 20,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    title: [{ text: props.title }],
+    grid: props.grid,
+    legend: props.legend, // 图例
+    toolbox: [{
+      // feature: {
+      //   saveAsImage: {
+      //     show: 'true',
+      //     icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+      //     title: '保存为图片',
+      //     type: 'png',
+      //     connectedBackgroundColor: '#fff',
+      //     name: '',
+      //   },
+      // },
+    }],
+    tooltip: {
+      trigger: 'axis',
+      confine: true, // 是否限制提示框在图表范围内
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 11,
+          rotate: props.rotate,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+      textStyle: {
+        fontWeight: 'normal',
+        fontSize: 14,
+        color: '#0b2c5b',
+      },
+      bottom: 0,
+      left: 'center',
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        barGap: props.barGap,
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0 && !props.useDefaultCoclor) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  chart.setOption({})
+  nextTick(() => {
+    chart.resize()
+  })
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 2)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 4213084..72666b2 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -39,7 +39,7 @@
       return {
         top: 30,
         left: 10,
-        right: 20,
+        right: 30,
         bottom: 10,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -187,10 +187,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -290,16 +286,6 @@
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as lineSeriesOption[],
   }
   // 标题
@@ -378,9 +364,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 6)
-  // }
   chart.setOption({})
   chart.resize()
 }
@@ -390,9 +373,6 @@
   if (chart) {
     console.log('渲染折线图')
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 3)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
     chart.resize()
   }
diff --git a/src/components/Echart/LineChartDynamics.vue b/src/components/Echart/LineChartDynamics.vue
new file mode 100644
index 0000000..2a2f063
--- /dev/null
+++ b/src/components/Echart/LineChartDynamics.vue
@@ -0,0 +1,420 @@
+<script lang="ts" setup name="LineChart">
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { lineDataI, lineOption, lineSeriesOption } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+import { formatColor, getAlphaColor } from './utils'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#09c2f9',
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 10,
+        right: 30,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * X轴类型
+   */
+  xAxisType: {
+    type: String,
+    default: 'category',
+    validator: (value: string) => {
+      return ['category', 'value', 'time', 'log'].includes(value)
+    },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 颜色
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        '#f5b637',
+        '#45c7f2',
+        '#ff9900',
+        '#E46CBB',
+        '#9A66E4',
+        '#ed3f14',
+        '#01C2F9',
+      ]
+    },
+  },
+  /**
+   * 实虚线
+   */
+  axisLineType: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#7a6b74',
+  },
+  // x轴标签倾斜
+  Xrotate: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  /**
+   * 是否为渐变折线图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * y轴最大值
+   */
+  max: {
+    type: [String, Number],
+    default: '',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 平滑
+   */
+  smooth: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: lineOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        type: props.xAxisType,
+        boundaryGap: true,
+        axisLine: {
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 11,
+          rotate: props.Xrotate,
+        },
+        splitLine: {
+          show: false,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: props.axisLineType,
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        nameTextStyle: {
+          color: props.fontColor,
+          fontSize: 14,
+          verticalAlign: 'middle',
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as lineSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // x轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴
+    }
+  }
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: lineSeriesOption[] = []
+    // 遍历data， 拆分轴线名称，数据和颜色
+    for (const itemIndex in props.data) {
+      const item = props.data[itemIndex]
+      const series: lineSeriesOption = {
+        name: item.name, // 线系列名
+        type: item.seriesType || 'line',
+        symbol: 'none', // 去掉折线节点
+        smooth: props.smooth, // 曲线平滑设置
+        lineStyle: {
+          width: 2,
+        },
+        label: {
+          show: item.seriesType === 'bar' ? true : false,
+          position: 'top',
+          color: props.labelColor,
+          fontSize: 15,
+        },
+        data: item.data,
+      }
+      // 线段颜色
+      if (item.color || props.colors.length > 0) {
+        series.itemStyle = {
+          color: item.color ? formatColor(item.color) : formatColor(props.colors[itemIndex] as string),
+        }
+        // 如果开启渐变
+        if (props.gradient) {
+          series.areaStyle = {
+            color: new echarts.graphic.LinearGradient(
+              0, 0, 0, 1, // 变化度 ,渐变方向
+              [
+                {
+                  offset: 0.1,
+                  color: item.color ? getAlphaColor(item.color, 0.6) : getAlphaColor(props.colors[itemIndex] as string, 0.6),
+                },
+                {
+                  offset: 1,
+                  color: '#fff',
+                },
+              ],
+            ),
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  // if (props.isAutomaticCarousel) {
+  //   automaticCarousel(option, chart, 3000, 6)
+  // }
+  chart.setOption({})
+  chart.resize()
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    console.log('渲染折线图')
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 3)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+    chart.resize()
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/utils/Array.ts b/src/utils/Array.ts
new file mode 100644
index 0000000..8c73e19
--- /dev/null
+++ b/src/utils/Array.ts
@@ -0,0 +1,63 @@
+import _ from 'lodash'
+// 常见数组操作
+
+// 两个数组求交集
+export const intersectionArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => list2.includes(v))
+}
+// 差集 -- 常用于 表格中多选删除
+export const differenceArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => !list2.includes(v))
+}
+// 补集
+export const complementaryArray = (list1: any[], list2: any[]) => {
+  return list1.filter((v) => { return !(list2.includes(v)) })
+    .concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 并集
+export const unionArray = (list1: any[], list2: any[]) => {
+  return list1.concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 一维数组去重
+export const uniqueArray = (list: any) => {
+  return [...new Set(list)]
+}
+// 二维数组根据 某一属性 去重
+export const uniqueMultiArray = (list: any, attribute: string) => {
+  const res = new Map()
+  return list.filter((a: any) => !res.has(a[attribute]) && res.set(a[attribute], 1))
+}
+// 一维数组或对象拷贝
+export const cloneArray = (data: any) => {
+  return JSON.parse(JSON.stringify(data))
+}
+// 多维数组或对象深拷贝
+export const deepClone = (data: any) => {
+  return _.cloneDeep(data)
+}
+// 数组操作-下拉框操作(已经选择的数据不能再选)
+/**
+ * @param list 下拉框初始数据(所有)
+ * @param list1 已经选择的数据
+ * @param current 当前数据 可为空
+ * @param attribute 属性(即绑定在 list1哪个属性上)
+ */
+export const setSelectList = (list: any[], list1: any[], current: string, attribute: string, attribute2 = 'value') => {
+  const select = [...new Set(list1.map((item: any) => item[attribute]))].filter((item: string) => item !== current)
+  return list.filter((item) => { return !select.includes(item[attribute2]) })
+}
+// 几个数组的交集
+export function intersectionManyArray(...arrays) {
+  console.log(...arrays, '1111111111')
+  // 获取第一个数组作为初始交集
+  let intersection = arrays.shift()
+
+  // 遍历剩余的数组
+  while (arrays.length) {
+    // 过滤当前交集，只保留那些也在当前数组中的元素
+    intersection = intersection.filter(item => arrays[0].includes(item))
+    // 移动到下一个数组
+    arrays.shift()
+  }
+  return intersection
+}

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }
diff --git a/src/components/Echart/BarChartVerticalDynamics.vue b/src/components/Echart/BarChartVerticalDynamics.vue
new file mode 100644
index 0000000..2ba92d2
--- /dev/null
+++ b/src/components/Echart/BarChartVerticalDynamics.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  // 柱子之间的距离
+  barGap: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 20,
+        right: 20,
+        bottom: 30,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 2,
+        right: 60,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  // 是否使用默认的颜色
+  useDefaultCoclor: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2fade0', '#01c2f9'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 20,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    title: [{ text: props.title }],
+    grid: props.grid,
+    legend: props.legend, // 图例
+    toolbox: [{
+      // feature: {
+      //   saveAsImage: {
+      //     show: 'true',
+      //     icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+      //     title: '保存为图片',
+      //     type: 'png',
+      //     connectedBackgroundColor: '#fff',
+      //     name: '',
+      //   },
+      // },
+    }],
+    tooltip: {
+      trigger: 'axis',
+      confine: true, // 是否限制提示框在图表范围内
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 11,
+          rotate: props.rotate,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+      textStyle: {
+        fontWeight: 'normal',
+        fontSize: 14,
+        color: '#0b2c5b',
+      },
+      bottom: 0,
+      left: 'center',
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        barGap: props.barGap,
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0 && !props.useDefaultCoclor) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  chart.setOption({})
+  nextTick(() => {
+    chart.resize()
+  })
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 2)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 4213084..72666b2 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -39,7 +39,7 @@
       return {
         top: 30,
         left: 10,
-        right: 20,
+        right: 30,
         bottom: 10,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -187,10 +187,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -290,16 +286,6 @@
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as lineSeriesOption[],
   }
   // 标题
@@ -378,9 +364,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 6)
-  // }
   chart.setOption({})
   chart.resize()
 }
@@ -390,9 +373,6 @@
   if (chart) {
     console.log('渲染折线图')
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 3)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
     chart.resize()
   }
diff --git a/src/components/Echart/LineChartDynamics.vue b/src/components/Echart/LineChartDynamics.vue
new file mode 100644
index 0000000..2a2f063
--- /dev/null
+++ b/src/components/Echart/LineChartDynamics.vue
@@ -0,0 +1,420 @@
+<script lang="ts" setup name="LineChart">
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { lineDataI, lineOption, lineSeriesOption } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+import { formatColor, getAlphaColor } from './utils'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#09c2f9',
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 10,
+        right: 30,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * X轴类型
+   */
+  xAxisType: {
+    type: String,
+    default: 'category',
+    validator: (value: string) => {
+      return ['category', 'value', 'time', 'log'].includes(value)
+    },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 颜色
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        '#f5b637',
+        '#45c7f2',
+        '#ff9900',
+        '#E46CBB',
+        '#9A66E4',
+        '#ed3f14',
+        '#01C2F9',
+      ]
+    },
+  },
+  /**
+   * 实虚线
+   */
+  axisLineType: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#7a6b74',
+  },
+  // x轴标签倾斜
+  Xrotate: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  /**
+   * 是否为渐变折线图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * y轴最大值
+   */
+  max: {
+    type: [String, Number],
+    default: '',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 平滑
+   */
+  smooth: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: lineOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        type: props.xAxisType,
+        boundaryGap: true,
+        axisLine: {
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 11,
+          rotate: props.Xrotate,
+        },
+        splitLine: {
+          show: false,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: props.axisLineType,
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        nameTextStyle: {
+          color: props.fontColor,
+          fontSize: 14,
+          verticalAlign: 'middle',
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as lineSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // x轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴
+    }
+  }
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: lineSeriesOption[] = []
+    // 遍历data， 拆分轴线名称，数据和颜色
+    for (const itemIndex in props.data) {
+      const item = props.data[itemIndex]
+      const series: lineSeriesOption = {
+        name: item.name, // 线系列名
+        type: item.seriesType || 'line',
+        symbol: 'none', // 去掉折线节点
+        smooth: props.smooth, // 曲线平滑设置
+        lineStyle: {
+          width: 2,
+        },
+        label: {
+          show: item.seriesType === 'bar' ? true : false,
+          position: 'top',
+          color: props.labelColor,
+          fontSize: 15,
+        },
+        data: item.data,
+      }
+      // 线段颜色
+      if (item.color || props.colors.length > 0) {
+        series.itemStyle = {
+          color: item.color ? formatColor(item.color) : formatColor(props.colors[itemIndex] as string),
+        }
+        // 如果开启渐变
+        if (props.gradient) {
+          series.areaStyle = {
+            color: new echarts.graphic.LinearGradient(
+              0, 0, 0, 1, // 变化度 ,渐变方向
+              [
+                {
+                  offset: 0.1,
+                  color: item.color ? getAlphaColor(item.color, 0.6) : getAlphaColor(props.colors[itemIndex] as string, 0.6),
+                },
+                {
+                  offset: 1,
+                  color: '#fff',
+                },
+              ],
+            ),
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  // if (props.isAutomaticCarousel) {
+  //   automaticCarousel(option, chart, 3000, 6)
+  // }
+  chart.setOption({})
+  chart.resize()
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    console.log('渲染折线图')
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 3)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+    chart.resize()
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/utils/Array.ts b/src/utils/Array.ts
new file mode 100644
index 0000000..8c73e19
--- /dev/null
+++ b/src/utils/Array.ts
@@ -0,0 +1,63 @@
+import _ from 'lodash'
+// 常见数组操作
+
+// 两个数组求交集
+export const intersectionArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => list2.includes(v))
+}
+// 差集 -- 常用于 表格中多选删除
+export const differenceArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => !list2.includes(v))
+}
+// 补集
+export const complementaryArray = (list1: any[], list2: any[]) => {
+  return list1.filter((v) => { return !(list2.includes(v)) })
+    .concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 并集
+export const unionArray = (list1: any[], list2: any[]) => {
+  return list1.concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 一维数组去重
+export const uniqueArray = (list: any) => {
+  return [...new Set(list)]
+}
+// 二维数组根据 某一属性 去重
+export const uniqueMultiArray = (list: any, attribute: string) => {
+  const res = new Map()
+  return list.filter((a: any) => !res.has(a[attribute]) && res.set(a[attribute], 1))
+}
+// 一维数组或对象拷贝
+export const cloneArray = (data: any) => {
+  return JSON.parse(JSON.stringify(data))
+}
+// 多维数组或对象深拷贝
+export const deepClone = (data: any) => {
+  return _.cloneDeep(data)
+}
+// 数组操作-下拉框操作(已经选择的数据不能再选)
+/**
+ * @param list 下拉框初始数据(所有)
+ * @param list1 已经选择的数据
+ * @param current 当前数据 可为空
+ * @param attribute 属性(即绑定在 list1哪个属性上)
+ */
+export const setSelectList = (list: any[], list1: any[], current: string, attribute: string, attribute2 = 'value') => {
+  const select = [...new Set(list1.map((item: any) => item[attribute]))].filter((item: string) => item !== current)
+  return list.filter((item) => { return !select.includes(item[attribute2]) })
+}
+// 几个数组的交集
+export function intersectionManyArray(...arrays) {
+  console.log(...arrays, '1111111111')
+  // 获取第一个数组作为初始交集
+  let intersection = arrays.shift()
+
+  // 遍历剩余的数组
+  while (arrays.length) {
+    // 过滤当前交集，只保留那些也在当前数组中的元素
+    intersection = intersection.filter(item => arrays[0].includes(item))
+    // 移动到下一个数组
+    arrays.shift()
+  }
+  return intersection
+}
diff --git a/src/views/alarm/dangerAssessment/assessment/list.vue b/src/views/alarm/dangerAssessment/assessment/list.vue
index fca5e5a..f0b5f8b 100644
--- a/src/views/alarm/dangerAssessment/assessment/list.vue
+++ b/src/views/alarm/dangerAssessment/assessment/list.vue
@@ -1,9 +1,11 @@
+<!-- 安全生产隐患评估 -->
 <script lang="ts" setup name="Statistics">
 import { getCurrentInstance, ref } from 'vue'
 import type { Ref } from 'vue'
 import type { DateModelType } from 'element-plus'
 import LineChart from '@/components/Echart/LineChart.vue'
 import BarChartHorizontal from '@/components/Echart/BarChartHorizontal.vue'
+import { getAreaDanger, getDangerCategory, getDeptAlarmDate, getDeptAlarmRecord, getDeptDanger } from '@/api/alarm/dangerAssessment/statistics'
 import type { lineDataI } from '@/components/Echart/echart-interface'
 import { areaDev, areaDevOnline, dayDev } from '@/api/monitor/statistics'
 import PieChart from '@/components/Echart/PieChart.vue'
@@ -12,7 +14,6 @@
 import chemistryImage from '@/assets/bigScreen/chemistry.png'
 import workImage from '@/assets/bigScreen/work.png'
 import progressImage from '@/assets/bigScreen/progress.png'
-import { getDangerCategory } from '@/api/bs'
 const urlMap: any = {
   危险点: pointImage,
   重大危险源: resourceImage,
@@ -74,86 +75,52 @@
 // 单位近一个月报警分析
 function getLastMonthAlarm() {
   lastMonthAlarmLoading.value = true
-  areaDev().then((res) => {
-    // const value = res.data.map((item: any) => Number(item.value))
-    // lastMonthAlarmData.value = [{ name: '设备数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    // lastMonthAlarmXData.value = res.data.map((item: any) => item.areaName)
-    const value = [88, 58, 55, 787, 23, 4, 55]
+  getDeptAlarmRecord().then((res) => {
+    const value = res.data.map((item: any) => Number(item.num))
     lastMonthAlarmData.value = [{ name: '报警数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    lastMonthAlarmXData.value = ['二部', '201', '203', '283', '23', '25', '706']
+    lastMonthAlarmXData.value = res.data.map((item: any) => item.deptName)
+    lastMonthAlarmLoading.value = false
+  }).catch(() => {
     lastMonthAlarmLoading.value = false
   })
 }
 
-// 单元安全隐患分类
+// 单位安全隐患分类
 function getSafeCatogeryByDept() {
   safeCatogeryByDeptLoading.value = true
-  areaDev().then((res) => {
-    // const value = res.data.map((item: any) => Number(item.value))
-    // lastMonthAlarmData.value = [{ name: '设备数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    // lastMonthAlarmXData.value = res.data.map((item: any) => item.areaName)
-    const value = [88, 58, 55, 77, 23, 40, 55]
-    const value1 = [10, 20, 34, 5, 44, 55, 1]
-    const value2 = [67, 67, 67, 88, 23, 50, 66]
-    const value3 = [67, 58, 88, 78, 23, 40, 122]
-    safeCatogeryByDeptData.value = [{ name: '有害气体', data: value }, { name: '易燃易爆', data: value1 }, { name: '机械', data: value2 }, { name: '其他', data: value3 }]
-    // safeCatogeryByDeptYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    safeCatogeryByDeptXData.value = ['二部', '201', '203', '283', '23', '25', '706']
+  getDeptDanger().then((res) => {
+    safeCatogeryByDeptData.value = res.data.yData
+    safeCatogeryByDeptXData.value = res.data.xData
     safeCatogeryByDeptLoading.value = false
   })
 }
 
+function sum(arr: string[]) {
+  let s = 0
+  for (let i = arr.length - 1; i >= 0; i--) {
+    s += Number(arr[i])
+  }
+  return s
+}
 // 区域隐患分析
 function getAreaPieData() {
   areaPieLoading.value = true
-  areaDev().then((res) => {
-    // areaPieData.value = res.data.map((item: any) => {
-    //   return {
-    //     name: item.areaName,
-    //     value: Number(item.value),
-    //   }
-    // })
-    areaPieData.value = [
-      {
-        value: '2',
-        name: '湖北',
-      },
-      {
-        value: '10',
-        name: '柳州',
-      },
-      {
-        value: '100',
-        name: '北京',
-      },
-      {
-        value: '2',
-        name: '河北',
-      },
-      {
-        value: '23',
-        name: '江苏无锡',
-      },
-      {
-        value: '2',
-        name: '湖南',
-      },
-      {
-        value: '20',
-        name: '朝阳',
-      },
-
-    ]
+  getAreaDanger().then((res) => {
+    areaPieData.value = res.data.yData.map((item: any) => {
+      return {
+        name: item.name,
+        value: sum(item.data),
+      }
+    })
+    areaPieLoading.value = false
+  }).catch(() => {
     areaPieLoading.value = false
   })
 }
 // 安全隐患类别分析
 function getSafeCatogery() {
   safeCatogeryLoading.value = true
-  areaDevOnline().then((res) => {
+  areaDevOnline().then((_res) => {
     // const value = res.data.map((item: any) => Number(item.value))
     // safeCatogeryData.value = [{ name: '设备在线数量', data: value }]
     // onlineBarYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
@@ -168,11 +135,9 @@
 // 单位时间报警曲线
 function getAlarmLine() {
   alarmLineLoading.value = true
-  dayDev().then((res) => {
-    const onlineValue = res.data.map((item: any) => Number(item.online))
-    const offlineValue = res.data.map((item: any) => Number(item.offline))
-    alarmLineXData.value = res.data.map((item: any) => item.date)
-    alarmLineData.value = [{ name: '离线设备', data: offlineValue }, { name: '在线设备', data: onlineValue }]
+  getDeptAlarmDate().then((res) => {
+    alarmLineXData.value = res.data.x
+    alarmLineData.value = res.data.y
     alarmLineLoading.value = false
   })
 }
@@ -225,8 +190,8 @@
 })
 onMounted(() => {
   fetchDangerCategory()
-  getLastMonthAlarm()
-  getSafeCatogery() // 获取安全隐患类别
+  getLastMonthAlarm() // 单位近一个月报警分析
+  // getSafeCatogery() // 获取安全隐患类别
   getAlarmLine() // 单位报警时间曲线
   getAreaPieData() // 区域隐患分析
   getSafeCatogeryByDept() // 单位安全隐患分类
@@ -268,7 +233,7 @@
                 show: true,
                 type: 'scroll',
                 orient: 'vertical',
-                right: '0%',
+                right: '10%',
                 top: 'center',
                 icon: 'circle',
                 itemWidth: 16,
@@ -280,30 +245,6 @@
             />
           </bench-col>
         </el-col>
-        <!-- <el-col :span="8">
-          <bench-col v-loading="safeCatogeryLoading" icon="icon-bar" title="安全隐患类别分析" :height="blockHeight">
-            <bar-chart-horizontal
-              style="margin-top: -20px;"
-              unit="台"
-              :x-axis-data="safeCatogeryXData"
-              :width="`${blockWidth / 3 - 10}px`"
-              :height="`${blockHeight - 30}px`"
-              :data="safeCatogeryData"
-              :max="onlineBarYDataMax"
-              :legend="{
-                show: true,
-                icon: 'circle',
-                orient: 'vertile', // 图例方向
-                align: 'left', // 图例标记和文本的对齐，默认自动
-                top: 5,
-                right: 20,
-                itemWidth: 12,
-                itemHeight: 12,
-                padding: [0, 0, 0, 120],
-              }"
-            />
-          </bench-col>
-        </el-col> -->
         <el-col :span="12">
           <bench-col v-loading="safeCatogeryByDeptLoading" icon="icon-bar" title="单位安全隐患分类" :height="blockHeight">
             <bar-chart-vertical
@@ -344,8 +285,7 @@
         <el-col :span="12">
           <bench-col v-loading="lastMonthAlarmLoading" icon="icon-bar" title="单位近一个月报警分析" :height="blockHeight">
             <bar-chart-vertical
-              style="margin-top: -20px;"
-              unit="台"
+              unit=""
               :x-axis-data="lastMonthAlarmXData"
               :width="`${blockWidth / 2 - 10}px`"
               :height="`${blockHeight - 30}px`"
@@ -362,18 +302,19 @@
               :x-axis-data="alarmLineXData"
               :width="`${blockWidth / 2 - 10}px`"
               :data="alarmLineData"
-              unit="台"
+              unit=""
               :legend="{
                 show: true,
                 icon: 'circle',
                 orient: 'horizontal', // 图例方向
                 align: 'left', // 图例标记和文本的对齐，默认自动
                 top: 1,
-                right: 20,
+                right: 30,
                 itemWidth: 12,
                 itemHeight: 12,
                 padding: [0, 0, 0, 120],
               }"
+              :Xrotate="45"
             />
           </bench-col>
         </el-col>

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }
diff --git a/src/components/Echart/BarChartVerticalDynamics.vue b/src/components/Echart/BarChartVerticalDynamics.vue
new file mode 100644
index 0000000..2ba92d2
--- /dev/null
+++ b/src/components/Echart/BarChartVerticalDynamics.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  // 柱子之间的距离
+  barGap: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 20,
+        right: 20,
+        bottom: 30,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 2,
+        right: 60,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  // 是否使用默认的颜色
+  useDefaultCoclor: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2fade0', '#01c2f9'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 20,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    title: [{ text: props.title }],
+    grid: props.grid,
+    legend: props.legend, // 图例
+    toolbox: [{
+      // feature: {
+      //   saveAsImage: {
+      //     show: 'true',
+      //     icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+      //     title: '保存为图片',
+      //     type: 'png',
+      //     connectedBackgroundColor: '#fff',
+      //     name: '',
+      //   },
+      // },
+    }],
+    tooltip: {
+      trigger: 'axis',
+      confine: true, // 是否限制提示框在图表范围内
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 11,
+          rotate: props.rotate,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+      textStyle: {
+        fontWeight: 'normal',
+        fontSize: 14,
+        color: '#0b2c5b',
+      },
+      bottom: 0,
+      left: 'center',
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        barGap: props.barGap,
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0 && !props.useDefaultCoclor) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  chart.setOption({})
+  nextTick(() => {
+    chart.resize()
+  })
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 2)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 4213084..72666b2 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -39,7 +39,7 @@
       return {
         top: 30,
         left: 10,
-        right: 20,
+        right: 30,
         bottom: 10,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -187,10 +187,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -290,16 +286,6 @@
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as lineSeriesOption[],
   }
   // 标题
@@ -378,9 +364,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 6)
-  // }
   chart.setOption({})
   chart.resize()
 }
@@ -390,9 +373,6 @@
   if (chart) {
     console.log('渲染折线图')
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 3)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
     chart.resize()
   }
diff --git a/src/components/Echart/LineChartDynamics.vue b/src/components/Echart/LineChartDynamics.vue
new file mode 100644
index 0000000..2a2f063
--- /dev/null
+++ b/src/components/Echart/LineChartDynamics.vue
@@ -0,0 +1,420 @@
+<script lang="ts" setup name="LineChart">
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { lineDataI, lineOption, lineSeriesOption } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+import { formatColor, getAlphaColor } from './utils'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#09c2f9',
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 10,
+        right: 30,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * X轴类型
+   */
+  xAxisType: {
+    type: String,
+    default: 'category',
+    validator: (value: string) => {
+      return ['category', 'value', 'time', 'log'].includes(value)
+    },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 颜色
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        '#f5b637',
+        '#45c7f2',
+        '#ff9900',
+        '#E46CBB',
+        '#9A66E4',
+        '#ed3f14',
+        '#01C2F9',
+      ]
+    },
+  },
+  /**
+   * 实虚线
+   */
+  axisLineType: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#7a6b74',
+  },
+  // x轴标签倾斜
+  Xrotate: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  /**
+   * 是否为渐变折线图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * y轴最大值
+   */
+  max: {
+    type: [String, Number],
+    default: '',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 平滑
+   */
+  smooth: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: lineOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        type: props.xAxisType,
+        boundaryGap: true,
+        axisLine: {
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 11,
+          rotate: props.Xrotate,
+        },
+        splitLine: {
+          show: false,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: props.axisLineType,
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        nameTextStyle: {
+          color: props.fontColor,
+          fontSize: 14,
+          verticalAlign: 'middle',
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as lineSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // x轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴
+    }
+  }
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: lineSeriesOption[] = []
+    // 遍历data， 拆分轴线名称，数据和颜色
+    for (const itemIndex in props.data) {
+      const item = props.data[itemIndex]
+      const series: lineSeriesOption = {
+        name: item.name, // 线系列名
+        type: item.seriesType || 'line',
+        symbol: 'none', // 去掉折线节点
+        smooth: props.smooth, // 曲线平滑设置
+        lineStyle: {
+          width: 2,
+        },
+        label: {
+          show: item.seriesType === 'bar' ? true : false,
+          position: 'top',
+          color: props.labelColor,
+          fontSize: 15,
+        },
+        data: item.data,
+      }
+      // 线段颜色
+      if (item.color || props.colors.length > 0) {
+        series.itemStyle = {
+          color: item.color ? formatColor(item.color) : formatColor(props.colors[itemIndex] as string),
+        }
+        // 如果开启渐变
+        if (props.gradient) {
+          series.areaStyle = {
+            color: new echarts.graphic.LinearGradient(
+              0, 0, 0, 1, // 变化度 ,渐变方向
+              [
+                {
+                  offset: 0.1,
+                  color: item.color ? getAlphaColor(item.color, 0.6) : getAlphaColor(props.colors[itemIndex] as string, 0.6),
+                },
+                {
+                  offset: 1,
+                  color: '#fff',
+                },
+              ],
+            ),
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  // if (props.isAutomaticCarousel) {
+  //   automaticCarousel(option, chart, 3000, 6)
+  // }
+  chart.setOption({})
+  chart.resize()
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    console.log('渲染折线图')
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 3)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+    chart.resize()
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/utils/Array.ts b/src/utils/Array.ts
new file mode 100644
index 0000000..8c73e19
--- /dev/null
+++ b/src/utils/Array.ts
@@ -0,0 +1,63 @@
+import _ from 'lodash'
+// 常见数组操作
+
+// 两个数组求交集
+export const intersectionArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => list2.includes(v))
+}
+// 差集 -- 常用于 表格中多选删除
+export const differenceArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => !list2.includes(v))
+}
+// 补集
+export const complementaryArray = (list1: any[], list2: any[]) => {
+  return list1.filter((v) => { return !(list2.includes(v)) })
+    .concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 并集
+export const unionArray = (list1: any[], list2: any[]) => {
+  return list1.concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 一维数组去重
+export const uniqueArray = (list: any) => {
+  return [...new Set(list)]
+}
+// 二维数组根据 某一属性 去重
+export const uniqueMultiArray = (list: any, attribute: string) => {
+  const res = new Map()
+  return list.filter((a: any) => !res.has(a[attribute]) && res.set(a[attribute], 1))
+}
+// 一维数组或对象拷贝
+export const cloneArray = (data: any) => {
+  return JSON.parse(JSON.stringify(data))
+}
+// 多维数组或对象深拷贝
+export const deepClone = (data: any) => {
+  return _.cloneDeep(data)
+}
+// 数组操作-下拉框操作(已经选择的数据不能再选)
+/**
+ * @param list 下拉框初始数据(所有)
+ * @param list1 已经选择的数据
+ * @param current 当前数据 可为空
+ * @param attribute 属性(即绑定在 list1哪个属性上)
+ */
+export const setSelectList = (list: any[], list1: any[], current: string, attribute: string, attribute2 = 'value') => {
+  const select = [...new Set(list1.map((item: any) => item[attribute]))].filter((item: string) => item !== current)
+  return list.filter((item) => { return !select.includes(item[attribute2]) })
+}
+// 几个数组的交集
+export function intersectionManyArray(...arrays) {
+  console.log(...arrays, '1111111111')
+  // 获取第一个数组作为初始交集
+  let intersection = arrays.shift()
+
+  // 遍历剩余的数组
+  while (arrays.length) {
+    // 过滤当前交集，只保留那些也在当前数组中的元素
+    intersection = intersection.filter(item => arrays[0].includes(item))
+    // 移动到下一个数组
+    arrays.shift()
+  }
+  return intersection
+}
diff --git a/src/views/alarm/dangerAssessment/assessment/list.vue b/src/views/alarm/dangerAssessment/assessment/list.vue
index fca5e5a..f0b5f8b 100644
--- a/src/views/alarm/dangerAssessment/assessment/list.vue
+++ b/src/views/alarm/dangerAssessment/assessment/list.vue
@@ -1,9 +1,11 @@
+<!-- 安全生产隐患评估 -->
 <script lang="ts" setup name="Statistics">
 import { getCurrentInstance, ref } from 'vue'
 import type { Ref } from 'vue'
 import type { DateModelType } from 'element-plus'
 import LineChart from '@/components/Echart/LineChart.vue'
 import BarChartHorizontal from '@/components/Echart/BarChartHorizontal.vue'
+import { getAreaDanger, getDangerCategory, getDeptAlarmDate, getDeptAlarmRecord, getDeptDanger } from '@/api/alarm/dangerAssessment/statistics'
 import type { lineDataI } from '@/components/Echart/echart-interface'
 import { areaDev, areaDevOnline, dayDev } from '@/api/monitor/statistics'
 import PieChart from '@/components/Echart/PieChart.vue'
@@ -12,7 +14,6 @@
 import chemistryImage from '@/assets/bigScreen/chemistry.png'
 import workImage from '@/assets/bigScreen/work.png'
 import progressImage from '@/assets/bigScreen/progress.png'
-import { getDangerCategory } from '@/api/bs'
 const urlMap: any = {
   危险点: pointImage,
   重大危险源: resourceImage,
@@ -74,86 +75,52 @@
 // 单位近一个月报警分析
 function getLastMonthAlarm() {
   lastMonthAlarmLoading.value = true
-  areaDev().then((res) => {
-    // const value = res.data.map((item: any) => Number(item.value))
-    // lastMonthAlarmData.value = [{ name: '设备数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    // lastMonthAlarmXData.value = res.data.map((item: any) => item.areaName)
-    const value = [88, 58, 55, 787, 23, 4, 55]
+  getDeptAlarmRecord().then((res) => {
+    const value = res.data.map((item: any) => Number(item.num))
     lastMonthAlarmData.value = [{ name: '报警数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    lastMonthAlarmXData.value = ['二部', '201', '203', '283', '23', '25', '706']
+    lastMonthAlarmXData.value = res.data.map((item: any) => item.deptName)
+    lastMonthAlarmLoading.value = false
+  }).catch(() => {
     lastMonthAlarmLoading.value = false
   })
 }
 
-// 单元安全隐患分类
+// 单位安全隐患分类
 function getSafeCatogeryByDept() {
   safeCatogeryByDeptLoading.value = true
-  areaDev().then((res) => {
-    // const value = res.data.map((item: any) => Number(item.value))
-    // lastMonthAlarmData.value = [{ name: '设备数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    // lastMonthAlarmXData.value = res.data.map((item: any) => item.areaName)
-    const value = [88, 58, 55, 77, 23, 40, 55]
-    const value1 = [10, 20, 34, 5, 44, 55, 1]
-    const value2 = [67, 67, 67, 88, 23, 50, 66]
-    const value3 = [67, 58, 88, 78, 23, 40, 122]
-    safeCatogeryByDeptData.value = [{ name: '有害气体', data: value }, { name: '易燃易爆', data: value1 }, { name: '机械', data: value2 }, { name: '其他', data: value3 }]
-    // safeCatogeryByDeptYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    safeCatogeryByDeptXData.value = ['二部', '201', '203', '283', '23', '25', '706']
+  getDeptDanger().then((res) => {
+    safeCatogeryByDeptData.value = res.data.yData
+    safeCatogeryByDeptXData.value = res.data.xData
     safeCatogeryByDeptLoading.value = false
   })
 }
 
+function sum(arr: string[]) {
+  let s = 0
+  for (let i = arr.length - 1; i >= 0; i--) {
+    s += Number(arr[i])
+  }
+  return s
+}
 // 区域隐患分析
 function getAreaPieData() {
   areaPieLoading.value = true
-  areaDev().then((res) => {
-    // areaPieData.value = res.data.map((item: any) => {
-    //   return {
-    //     name: item.areaName,
-    //     value: Number(item.value),
-    //   }
-    // })
-    areaPieData.value = [
-      {
-        value: '2',
-        name: '湖北',
-      },
-      {
-        value: '10',
-        name: '柳州',
-      },
-      {
-        value: '100',
-        name: '北京',
-      },
-      {
-        value: '2',
-        name: '河北',
-      },
-      {
-        value: '23',
-        name: '江苏无锡',
-      },
-      {
-        value: '2',
-        name: '湖南',
-      },
-      {
-        value: '20',
-        name: '朝阳',
-      },
-
-    ]
+  getAreaDanger().then((res) => {
+    areaPieData.value = res.data.yData.map((item: any) => {
+      return {
+        name: item.name,
+        value: sum(item.data),
+      }
+    })
+    areaPieLoading.value = false
+  }).catch(() => {
     areaPieLoading.value = false
   })
 }
 // 安全隐患类别分析
 function getSafeCatogery() {
   safeCatogeryLoading.value = true
-  areaDevOnline().then((res) => {
+  areaDevOnline().then((_res) => {
     // const value = res.data.map((item: any) => Number(item.value))
     // safeCatogeryData.value = [{ name: '设备在线数量', data: value }]
     // onlineBarYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
@@ -168,11 +135,9 @@
 // 单位时间报警曲线
 function getAlarmLine() {
   alarmLineLoading.value = true
-  dayDev().then((res) => {
-    const onlineValue = res.data.map((item: any) => Number(item.online))
-    const offlineValue = res.data.map((item: any) => Number(item.offline))
-    alarmLineXData.value = res.data.map((item: any) => item.date)
-    alarmLineData.value = [{ name: '离线设备', data: offlineValue }, { name: '在线设备', data: onlineValue }]
+  getDeptAlarmDate().then((res) => {
+    alarmLineXData.value = res.data.x
+    alarmLineData.value = res.data.y
     alarmLineLoading.value = false
   })
 }
@@ -225,8 +190,8 @@
 })
 onMounted(() => {
   fetchDangerCategory()
-  getLastMonthAlarm()
-  getSafeCatogery() // 获取安全隐患类别
+  getLastMonthAlarm() // 单位近一个月报警分析
+  // getSafeCatogery() // 获取安全隐患类别
   getAlarmLine() // 单位报警时间曲线
   getAreaPieData() // 区域隐患分析
   getSafeCatogeryByDept() // 单位安全隐患分类
@@ -268,7 +233,7 @@
                 show: true,
                 type: 'scroll',
                 orient: 'vertical',
-                right: '0%',
+                right: '10%',
                 top: 'center',
                 icon: 'circle',
                 itemWidth: 16,
@@ -280,30 +245,6 @@
             />
           </bench-col>
         </el-col>
-        <!-- <el-col :span="8">
-          <bench-col v-loading="safeCatogeryLoading" icon="icon-bar" title="安全隐患类别分析" :height="blockHeight">
-            <bar-chart-horizontal
-              style="margin-top: -20px;"
-              unit="台"
-              :x-axis-data="safeCatogeryXData"
-              :width="`${blockWidth / 3 - 10}px`"
-              :height="`${blockHeight - 30}px`"
-              :data="safeCatogeryData"
-              :max="onlineBarYDataMax"
-              :legend="{
-                show: true,
-                icon: 'circle',
-                orient: 'vertile', // 图例方向
-                align: 'left', // 图例标记和文本的对齐，默认自动
-                top: 5,
-                right: 20,
-                itemWidth: 12,
-                itemHeight: 12,
-                padding: [0, 0, 0, 120],
-              }"
-            />
-          </bench-col>
-        </el-col> -->
         <el-col :span="12">
           <bench-col v-loading="safeCatogeryByDeptLoading" icon="icon-bar" title="单位安全隐患分类" :height="blockHeight">
             <bar-chart-vertical
@@ -344,8 +285,7 @@
         <el-col :span="12">
           <bench-col v-loading="lastMonthAlarmLoading" icon="icon-bar" title="单位近一个月报警分析" :height="blockHeight">
             <bar-chart-vertical
-              style="margin-top: -20px;"
-              unit="台"
+              unit=""
               :x-axis-data="lastMonthAlarmXData"
               :width="`${blockWidth / 2 - 10}px`"
               :height="`${blockHeight - 30}px`"
@@ -362,18 +302,19 @@
               :x-axis-data="alarmLineXData"
               :width="`${blockWidth / 2 - 10}px`"
               :data="alarmLineData"
-              unit="台"
+              unit=""
               :legend="{
                 show: true,
                 icon: 'circle',
                 orient: 'horizontal', // 图例方向
                 align: 'left', // 图例标记和文本的对齐，默认自动
                 top: 1,
-                right: 20,
+                right: 30,
                 itemWidth: 12,
                 itemHeight: 12,
                 padding: [0, 0, 0, 120],
               }"
+              :Xrotate="45"
             />
           </bench-col>
         </el-col>
diff --git a/src/views/alarm/policyConfig/monitorPoint/editDialog.vue b/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
index 494cbe8..bfaadb8 100644
--- a/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
+++ b/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
@@ -6,6 +6,7 @@
 import type { FormInstance, FormRules } from 'element-plus'
 import type { IForm, IList } from './monitorPoint-interface'
 import drawArea from './drawArea.vue'
+import { uniqueArray, differenceArray, deepClone, intersectionArray } from '@/utils/Array'
 import { createStream, sendHeart, stopStream } from '@/api/monitor/index-new-gm'
 import type { TableColumn } from '@/components/NormalTable/table_interface'
 import { isIp } from '@/utils/validate'
@@ -166,7 +167,6 @@
             }
             return {
               ...item,
-              algoModelId: formData.value.algoModelId, // 算法模型id
               // confidenceLevel:	item.confidenceLevel, // 置信度
               // recognitionTypeId:	item.recognitionTypeId, // 模型识别类型
               // threshold: item.threshold,	 // 阈值
@@ -194,6 +194,7 @@
 
         const params = {
           ...formData.value,
+          algoModelId: formData.value.algoModelId.join(','), // 算法模型id
           // sceneRelation: formData.value.type === 1 ? { id: formData.value.id, sceneId: formData.value.sceneId } : null,
           // eslint-disable-next-line multiline-ternary
           deviceModelRelations: formData.value.type === 0 ? tempList : [],
@@ -252,14 +253,8 @@
   })
   if (formData.value.type === 0) { // 算法模式
     let tempList = []
-    console.log('----------------------', points.value)
-    console.log('[[[[[[[[[[[[[[[]]]]]]]', value)
     tempList = value.map((i: any, index: number) => {
       const findIndex = points.value.findIndex((item: { recognitionTypeId: string }) => {
-        console.log(item.recognitionTypeId)
-        console.log(i.recognitionTypeId)
-        console.log(i.recognitionTypeId === item.recognitionTypeId)
-
         return i.recognitionTypeId === item.recognitionTypeId
       })
       if (findIndex === -1) {
@@ -267,17 +262,18 @@
         return {
           ...i,
           remark: i.recognitionTypeName,
+          isUse: '1',
           boundary: [ // 标记点位置
-            { x: 50 + index * 30, y: 50 + index * 30 },
-            { x: 150 + index * 30, y: 50 + index * 30 },
-            { x: 150 + index * 30, y: 150 + index * 30 },
-            { x: 50 + index * 30, y: 150 + index * 30 },
+            { x: 50, y: 50 },
+            { x: 150, y: 50 },
+            { x: 150, y: 150 },
+            { x: 50, y: 150 },
           ],
         }
       }
       else {
         console.log('找到了', i.recognitionTypeName)
-        return { ...i, ...points.value[findIndex] }
+        return { ...i, ...points.value[findIndex], isUse: '0' }
       }
     })
     points.value = tempList
@@ -286,29 +282,72 @@
 }
 
 // 监听算法变化，查询算法报警对象
-async function changeAlgoModelId(modelId: string) {
-  if (modelId) {
-    // 获取场景对象
-    const params = {
-      modelId, // 模型ID
-      typeCode: '', // 类型编码
-      typeName: '', // 类型名称
+async function changeAlgoModelId(modelIds: string[]) {
+  return new Promise((resolve) => {
+    console.log('监听算法变化', modelIds)
+
+    if (modelIds && Array.isArray(modelIds) && modelIds.length) {
+      // 求数组的差集，筛选出新选中的数据, 请求模型列表添加到表格中
+      const tempRecognitionIdList = recognitionList.value.map((item: { algoModelId: string }) => item.algoModelId)
+      const differenceArrayResult = differenceArray(modelIds, tempRecognitionIdList)
+
+      const allRequest = [] as any // 所有的请求
+      let tempList: any = []
+      differenceArrayResult.forEach((i: any) => {
+        // 获取场景对象
+        const params = {
+          modelId: i, // 模型ID
+          typeCode: '', // 类型编码
+          typeName: '', // 类型名称
+        }
+        const request = getRecognitionList(params).then((res) => {
+          const resList = res.data.map((item: { id: string; typeName: string }) => {
+            return {
+              ...item,
+              recognitionTypeName: item.typeName,
+              recognitionTypeId: item.id,
+              id: '',
+              confidenceLevel: 0, // 置信度
+              threshold: 0, // 阈值
+              algoModelId: i, // 算法id
+            }
+          })
+          tempList = tempList.concat(resList)
+        })
+        allRequest.push(request)
+      })
+
+      // 求两个数组的交集，筛选出未变动的数据，进行保留
+      const intersectionArrayResult = intersectionArray(modelIds, tempRecognitionIdList)
+      const needReserveList: any = [] // recognitionList中需要保留的数据
+      recognitionList.value.forEach((e: any) => {
+        const index = intersectionArrayResult.findIndex((item: string) => e.algoModelId === item)
+        if (index !== -1) {
+          needReserveList.push(e)
+        }
+      })
+
+      Promise.all(allRequest).then(() => {
+        recognitionList.value = needReserveList.concat(tempList)
+
+        // 原来选中的数据：进行默认选中
+        const selectedRows = recognitionList.value.filter((e: { isUse: string }) => e.isUse === '1') // 把选中的找出来
+        if (selectedRows && Array.isArray(selectedRows) && selectedRows.length) {
+          nextTick(() => {
+            // 默认选中
+            selectedRows.forEach((row: any) => {
+              algorithmTableRef.value?.toggleRowSelection(row, true)
+            })
+            points.value = selectedRows // 画图
+          })
+        }
+        resolve(null)
+      })
     }
-    const res = await getRecognitionList(params)
-    recognitionList.value = res.data.map((item: { id: string; typeName: string }) => {
-      return {
-        ...item,
-        recognitionTypeName: item.typeName,
-        recognitionTypeId: item.id,
-        id: '',
-        confidenceLevel: 0, // 置信度
-        threshold: 0, // 阈值
-      }
-    })
-  }
-  else {
-    recognitionList.value = []
-  }
+    else {
+      recognitionList.value = []
+    }
+  })
 }
 
 // -----------------------------------初始化、关闭对话框相关-----------------------------------------
@@ -327,52 +366,6 @@
     formData.value.deviceId = row.deviceId // 设备id
     formData.value.recognitionUrl = row.recognitionUrl || 'http://192.168.83.42/recognitionUrl'// 识别流地址
     formData.value.rtspUrl = row.rtspUrl || 'http://192.168.83.42/rtsp' // rtsp地址
-
-    // if (`${row.type}` === '0') { // 算法关联
-    //   formData.value.algoModelId = row.deviceModelRelations && row.deviceModelRelations.length && row.deviceModelRelations[0].algoModelId // 模型id
-    //   // 处理一下返回的数据格式
-    //   const resultList = row.deviceModelRelations.map((item: any) => {
-    //     return {
-    //       ...item,
-    //       confidenceLevel: `${item.confidenceLevel}` ? Number(item.confidenceLevel) : undefined,
-    //       threshold: `${item.threshold}` ? Number(item.threshold) : undefined,
-    //       boundary: item.boundary ? JSON.parse(item.boundary) : item.boundary,
-    //     }
-    //   })
-    //   // 先请求所有的数据，因为场景有可能变化
-    //   changeAlgoModelId(formData.value.algoModelId).then((res: any) => {
-    //     // 把其余的没有添加的报警对象给添加上
-    //     resultList.forEach((itemOut: any) => {
-    //       const index = recognitionList.value.findIndex((itemIn: any) => itemOut.recognitionTypeId === itemIn.recognitionTypeId)
-    //       if (index !== -1) {
-    //         recognitionList.value[index] = { ...itemOut }
-    //       }
-    //     })
-
-    //     // 原来选中的数据：进行默认选中
-    //     const selectedRows = recognitionList.value.filter((e: { isUse: string }) => e.isUse === '1') // 把选中的找出来
-    //     if (selectedRows && Array.isArray(selectedRows) && selectedRows.length) {
-    //       nextTick(() => {
-    //         // 默认选中
-    //         selectedRows.forEach((row: any) => {
-    //           algorithmTableRef.value?.toggleRowSelection(row, true)
-    //         })
-    //         points.value = selectedRows // 画图
-    //       })
-    //     }
-    //   })
-    // }
-    // else if (`${row.type}` === '1') { // 业务场景
-    //   formData.value.sceneId = row.sceneRelation.sceneId
-    //   points.value = [
-    //     {
-    //       id: row.sceneRelation.id,
-    //       remark: row.sceneRelation.remark,
-    //       sceneId: row.sceneRelation.sceneId,
-    //       boundary: row.sceneRelation.boundary ? JSON.parse(row.sceneRelation.boundary) : row.sceneRelation.boundary, // 识别边界
-    //     },
-    //   ]
-    // }
   }
   if (dialogstatus === 'detail') {
     formDataRef.value?.clearValidate()
@@ -394,7 +387,10 @@
   setTimeout(() => {
     console.log('在视频加载出来之后画框, 初始化的时候开始画框')
     if (`${row.type}` === '0') { // 算法关联
-      formData.value.algoModelId = row.deviceModelRelations && row.deviceModelRelations.length && row.deviceModelRelations[0].algoModelId // 模型id
+      const tempAlgoModelIdList: any = uniqueArray(row.deviceModelRelations.map((item: { algoModelId: string }) => item.algoModelId))!
+
+      formData.value.algoModelId = tempAlgoModelIdList // 模型id
+
       // 处理一下返回的数据格式
       const resultList = row.deviceModelRelations.map((item: any) => {
         let tempBoundary = []
@@ -416,7 +412,7 @@
         }
       })
       // 先请求所有的数据，因为场景有可能变化
-      changeAlgoModelId(formData.value.algoModelId).then((res: any) => {
+      changeAlgoModelId(tempAlgoModelIdList).then((res: any) => {
         // 把其余的没有添加的报警对象给添加上
         resultList.forEach((itemOut: any) => {
           const index = recognitionList.value.findIndex((itemIn: any) => itemOut.recognitionTypeId === itemIn.recognitionTypeId)
@@ -746,6 +742,7 @@
                   v-model="formData.algoModelId" placeholder="请选择算法" clearable class="select"
                   style="width: 100%;" :disabled="dialogStatus === 'detail'"
                   @change="changeAlgoModelId"
+                  multiple
                 >
                   <el-option v-for="item in algorithmList" :key="item.id" :value="item.id" :label="item.modelName">
                     <div style="display: flex;justify-content: space-between;">

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }
diff --git a/src/components/Echart/BarChartVerticalDynamics.vue b/src/components/Echart/BarChartVerticalDynamics.vue
new file mode 100644
index 0000000..2ba92d2
--- /dev/null
+++ b/src/components/Echart/BarChartVerticalDynamics.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  // 柱子之间的距离
+  barGap: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 20,
+        right: 20,
+        bottom: 30,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 2,
+        right: 60,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  // 是否使用默认的颜色
+  useDefaultCoclor: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2fade0', '#01c2f9'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 20,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    title: [{ text: props.title }],
+    grid: props.grid,
+    legend: props.legend, // 图例
+    toolbox: [{
+      // feature: {
+      //   saveAsImage: {
+      //     show: 'true',
+      //     icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+      //     title: '保存为图片',
+      //     type: 'png',
+      //     connectedBackgroundColor: '#fff',
+      //     name: '',
+      //   },
+      // },
+    }],
+    tooltip: {
+      trigger: 'axis',
+      confine: true, // 是否限制提示框在图表范围内
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 11,
+          rotate: props.rotate,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+      textStyle: {
+        fontWeight: 'normal',
+        fontSize: 14,
+        color: '#0b2c5b',
+      },
+      bottom: 0,
+      left: 'center',
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        barGap: props.barGap,
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0 && !props.useDefaultCoclor) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  chart.setOption({})
+  nextTick(() => {
+    chart.resize()
+  })
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 2)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 4213084..72666b2 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -39,7 +39,7 @@
       return {
         top: 30,
         left: 10,
-        right: 20,
+        right: 30,
         bottom: 10,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -187,10 +187,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -290,16 +286,6 @@
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as lineSeriesOption[],
   }
   // 标题
@@ -378,9 +364,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 6)
-  // }
   chart.setOption({})
   chart.resize()
 }
@@ -390,9 +373,6 @@
   if (chart) {
     console.log('渲染折线图')
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 3)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
     chart.resize()
   }
diff --git a/src/components/Echart/LineChartDynamics.vue b/src/components/Echart/LineChartDynamics.vue
new file mode 100644
index 0000000..2a2f063
--- /dev/null
+++ b/src/components/Echart/LineChartDynamics.vue
@@ -0,0 +1,420 @@
+<script lang="ts" setup name="LineChart">
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { lineDataI, lineOption, lineSeriesOption } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+import { formatColor, getAlphaColor } from './utils'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#09c2f9',
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 10,
+        right: 30,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * X轴类型
+   */
+  xAxisType: {
+    type: String,
+    default: 'category',
+    validator: (value: string) => {
+      return ['category', 'value', 'time', 'log'].includes(value)
+    },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 颜色
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        '#f5b637',
+        '#45c7f2',
+        '#ff9900',
+        '#E46CBB',
+        '#9A66E4',
+        '#ed3f14',
+        '#01C2F9',
+      ]
+    },
+  },
+  /**
+   * 实虚线
+   */
+  axisLineType: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#7a6b74',
+  },
+  // x轴标签倾斜
+  Xrotate: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  /**
+   * 是否为渐变折线图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * y轴最大值
+   */
+  max: {
+    type: [String, Number],
+    default: '',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 平滑
+   */
+  smooth: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: lineOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        type: props.xAxisType,
+        boundaryGap: true,
+        axisLine: {
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 11,
+          rotate: props.Xrotate,
+        },
+        splitLine: {
+          show: false,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: props.axisLineType,
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        nameTextStyle: {
+          color: props.fontColor,
+          fontSize: 14,
+          verticalAlign: 'middle',
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as lineSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // x轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴
+    }
+  }
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: lineSeriesOption[] = []
+    // 遍历data， 拆分轴线名称，数据和颜色
+    for (const itemIndex in props.data) {
+      const item = props.data[itemIndex]
+      const series: lineSeriesOption = {
+        name: item.name, // 线系列名
+        type: item.seriesType || 'line',
+        symbol: 'none', // 去掉折线节点
+        smooth: props.smooth, // 曲线平滑设置
+        lineStyle: {
+          width: 2,
+        },
+        label: {
+          show: item.seriesType === 'bar' ? true : false,
+          position: 'top',
+          color: props.labelColor,
+          fontSize: 15,
+        },
+        data: item.data,
+      }
+      // 线段颜色
+      if (item.color || props.colors.length > 0) {
+        series.itemStyle = {
+          color: item.color ? formatColor(item.color) : formatColor(props.colors[itemIndex] as string),
+        }
+        // 如果开启渐变
+        if (props.gradient) {
+          series.areaStyle = {
+            color: new echarts.graphic.LinearGradient(
+              0, 0, 0, 1, // 变化度 ,渐变方向
+              [
+                {
+                  offset: 0.1,
+                  color: item.color ? getAlphaColor(item.color, 0.6) : getAlphaColor(props.colors[itemIndex] as string, 0.6),
+                },
+                {
+                  offset: 1,
+                  color: '#fff',
+                },
+              ],
+            ),
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  // if (props.isAutomaticCarousel) {
+  //   automaticCarousel(option, chart, 3000, 6)
+  // }
+  chart.setOption({})
+  chart.resize()
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    console.log('渲染折线图')
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 3)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+    chart.resize()
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/utils/Array.ts b/src/utils/Array.ts
new file mode 100644
index 0000000..8c73e19
--- /dev/null
+++ b/src/utils/Array.ts
@@ -0,0 +1,63 @@
+import _ from 'lodash'
+// 常见数组操作
+
+// 两个数组求交集
+export const intersectionArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => list2.includes(v))
+}
+// 差集 -- 常用于 表格中多选删除
+export const differenceArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => !list2.includes(v))
+}
+// 补集
+export const complementaryArray = (list1: any[], list2: any[]) => {
+  return list1.filter((v) => { return !(list2.includes(v)) })
+    .concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 并集
+export const unionArray = (list1: any[], list2: any[]) => {
+  return list1.concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 一维数组去重
+export const uniqueArray = (list: any) => {
+  return [...new Set(list)]
+}
+// 二维数组根据 某一属性 去重
+export const uniqueMultiArray = (list: any, attribute: string) => {
+  const res = new Map()
+  return list.filter((a: any) => !res.has(a[attribute]) && res.set(a[attribute], 1))
+}
+// 一维数组或对象拷贝
+export const cloneArray = (data: any) => {
+  return JSON.parse(JSON.stringify(data))
+}
+// 多维数组或对象深拷贝
+export const deepClone = (data: any) => {
+  return _.cloneDeep(data)
+}
+// 数组操作-下拉框操作(已经选择的数据不能再选)
+/**
+ * @param list 下拉框初始数据(所有)
+ * @param list1 已经选择的数据
+ * @param current 当前数据 可为空
+ * @param attribute 属性(即绑定在 list1哪个属性上)
+ */
+export const setSelectList = (list: any[], list1: any[], current: string, attribute: string, attribute2 = 'value') => {
+  const select = [...new Set(list1.map((item: any) => item[attribute]))].filter((item: string) => item !== current)
+  return list.filter((item) => { return !select.includes(item[attribute2]) })
+}
+// 几个数组的交集
+export function intersectionManyArray(...arrays) {
+  console.log(...arrays, '1111111111')
+  // 获取第一个数组作为初始交集
+  let intersection = arrays.shift()
+
+  // 遍历剩余的数组
+  while (arrays.length) {
+    // 过滤当前交集，只保留那些也在当前数组中的元素
+    intersection = intersection.filter(item => arrays[0].includes(item))
+    // 移动到下一个数组
+    arrays.shift()
+  }
+  return intersection
+}
diff --git a/src/views/alarm/dangerAssessment/assessment/list.vue b/src/views/alarm/dangerAssessment/assessment/list.vue
index fca5e5a..f0b5f8b 100644
--- a/src/views/alarm/dangerAssessment/assessment/list.vue
+++ b/src/views/alarm/dangerAssessment/assessment/list.vue
@@ -1,9 +1,11 @@
+<!-- 安全生产隐患评估 -->
 <script lang="ts" setup name="Statistics">
 import { getCurrentInstance, ref } from 'vue'
 import type { Ref } from 'vue'
 import type { DateModelType } from 'element-plus'
 import LineChart from '@/components/Echart/LineChart.vue'
 import BarChartHorizontal from '@/components/Echart/BarChartHorizontal.vue'
+import { getAreaDanger, getDangerCategory, getDeptAlarmDate, getDeptAlarmRecord, getDeptDanger } from '@/api/alarm/dangerAssessment/statistics'
 import type { lineDataI } from '@/components/Echart/echart-interface'
 import { areaDev, areaDevOnline, dayDev } from '@/api/monitor/statistics'
 import PieChart from '@/components/Echart/PieChart.vue'
@@ -12,7 +14,6 @@
 import chemistryImage from '@/assets/bigScreen/chemistry.png'
 import workImage from '@/assets/bigScreen/work.png'
 import progressImage from '@/assets/bigScreen/progress.png'
-import { getDangerCategory } from '@/api/bs'
 const urlMap: any = {
   危险点: pointImage,
   重大危险源: resourceImage,
@@ -74,86 +75,52 @@
 // 单位近一个月报警分析
 function getLastMonthAlarm() {
   lastMonthAlarmLoading.value = true
-  areaDev().then((res) => {
-    // const value = res.data.map((item: any) => Number(item.value))
-    // lastMonthAlarmData.value = [{ name: '设备数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    // lastMonthAlarmXData.value = res.data.map((item: any) => item.areaName)
-    const value = [88, 58, 55, 787, 23, 4, 55]
+  getDeptAlarmRecord().then((res) => {
+    const value = res.data.map((item: any) => Number(item.num))
     lastMonthAlarmData.value = [{ name: '报警数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    lastMonthAlarmXData.value = ['二部', '201', '203', '283', '23', '25', '706']
+    lastMonthAlarmXData.value = res.data.map((item: any) => item.deptName)
+    lastMonthAlarmLoading.value = false
+  }).catch(() => {
     lastMonthAlarmLoading.value = false
   })
 }
 
-// 单元安全隐患分类
+// 单位安全隐患分类
 function getSafeCatogeryByDept() {
   safeCatogeryByDeptLoading.value = true
-  areaDev().then((res) => {
-    // const value = res.data.map((item: any) => Number(item.value))
-    // lastMonthAlarmData.value = [{ name: '设备数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    // lastMonthAlarmXData.value = res.data.map((item: any) => item.areaName)
-    const value = [88, 58, 55, 77, 23, 40, 55]
-    const value1 = [10, 20, 34, 5, 44, 55, 1]
-    const value2 = [67, 67, 67, 88, 23, 50, 66]
-    const value3 = [67, 58, 88, 78, 23, 40, 122]
-    safeCatogeryByDeptData.value = [{ name: '有害气体', data: value }, { name: '易燃易爆', data: value1 }, { name: '机械', data: value2 }, { name: '其他', data: value3 }]
-    // safeCatogeryByDeptYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    safeCatogeryByDeptXData.value = ['二部', '201', '203', '283', '23', '25', '706']
+  getDeptDanger().then((res) => {
+    safeCatogeryByDeptData.value = res.data.yData
+    safeCatogeryByDeptXData.value = res.data.xData
     safeCatogeryByDeptLoading.value = false
   })
 }
 
+function sum(arr: string[]) {
+  let s = 0
+  for (let i = arr.length - 1; i >= 0; i--) {
+    s += Number(arr[i])
+  }
+  return s
+}
 // 区域隐患分析
 function getAreaPieData() {
   areaPieLoading.value = true
-  areaDev().then((res) => {
-    // areaPieData.value = res.data.map((item: any) => {
-    //   return {
-    //     name: item.areaName,
-    //     value: Number(item.value),
-    //   }
-    // })
-    areaPieData.value = [
-      {
-        value: '2',
-        name: '湖北',
-      },
-      {
-        value: '10',
-        name: '柳州',
-      },
-      {
-        value: '100',
-        name: '北京',
-      },
-      {
-        value: '2',
-        name: '河北',
-      },
-      {
-        value: '23',
-        name: '江苏无锡',
-      },
-      {
-        value: '2',
-        name: '湖南',
-      },
-      {
-        value: '20',
-        name: '朝阳',
-      },
-
-    ]
+  getAreaDanger().then((res) => {
+    areaPieData.value = res.data.yData.map((item: any) => {
+      return {
+        name: item.name,
+        value: sum(item.data),
+      }
+    })
+    areaPieLoading.value = false
+  }).catch(() => {
     areaPieLoading.value = false
   })
 }
 // 安全隐患类别分析
 function getSafeCatogery() {
   safeCatogeryLoading.value = true
-  areaDevOnline().then((res) => {
+  areaDevOnline().then((_res) => {
     // const value = res.data.map((item: any) => Number(item.value))
     // safeCatogeryData.value = [{ name: '设备在线数量', data: value }]
     // onlineBarYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
@@ -168,11 +135,9 @@
 // 单位时间报警曲线
 function getAlarmLine() {
   alarmLineLoading.value = true
-  dayDev().then((res) => {
-    const onlineValue = res.data.map((item: any) => Number(item.online))
-    const offlineValue = res.data.map((item: any) => Number(item.offline))
-    alarmLineXData.value = res.data.map((item: any) => item.date)
-    alarmLineData.value = [{ name: '离线设备', data: offlineValue }, { name: '在线设备', data: onlineValue }]
+  getDeptAlarmDate().then((res) => {
+    alarmLineXData.value = res.data.x
+    alarmLineData.value = res.data.y
     alarmLineLoading.value = false
   })
 }
@@ -225,8 +190,8 @@
 })
 onMounted(() => {
   fetchDangerCategory()
-  getLastMonthAlarm()
-  getSafeCatogery() // 获取安全隐患类别
+  getLastMonthAlarm() // 单位近一个月报警分析
+  // getSafeCatogery() // 获取安全隐患类别
   getAlarmLine() // 单位报警时间曲线
   getAreaPieData() // 区域隐患分析
   getSafeCatogeryByDept() // 单位安全隐患分类
@@ -268,7 +233,7 @@
                 show: true,
                 type: 'scroll',
                 orient: 'vertical',
-                right: '0%',
+                right: '10%',
                 top: 'center',
                 icon: 'circle',
                 itemWidth: 16,
@@ -280,30 +245,6 @@
             />
           </bench-col>
         </el-col>
-        <!-- <el-col :span="8">
-          <bench-col v-loading="safeCatogeryLoading" icon="icon-bar" title="安全隐患类别分析" :height="blockHeight">
-            <bar-chart-horizontal
-              style="margin-top: -20px;"
-              unit="台"
-              :x-axis-data="safeCatogeryXData"
-              :width="`${blockWidth / 3 - 10}px`"
-              :height="`${blockHeight - 30}px`"
-              :data="safeCatogeryData"
-              :max="onlineBarYDataMax"
-              :legend="{
-                show: true,
-                icon: 'circle',
-                orient: 'vertile', // 图例方向
-                align: 'left', // 图例标记和文本的对齐，默认自动
-                top: 5,
-                right: 20,
-                itemWidth: 12,
-                itemHeight: 12,
-                padding: [0, 0, 0, 120],
-              }"
-            />
-          </bench-col>
-        </el-col> -->
         <el-col :span="12">
           <bench-col v-loading="safeCatogeryByDeptLoading" icon="icon-bar" title="单位安全隐患分类" :height="blockHeight">
             <bar-chart-vertical
@@ -344,8 +285,7 @@
         <el-col :span="12">
           <bench-col v-loading="lastMonthAlarmLoading" icon="icon-bar" title="单位近一个月报警分析" :height="blockHeight">
             <bar-chart-vertical
-              style="margin-top: -20px;"
-              unit="台"
+              unit=""
               :x-axis-data="lastMonthAlarmXData"
               :width="`${blockWidth / 2 - 10}px`"
               :height="`${blockHeight - 30}px`"
@@ -362,18 +302,19 @@
               :x-axis-data="alarmLineXData"
               :width="`${blockWidth / 2 - 10}px`"
               :data="alarmLineData"
-              unit="台"
+              unit=""
               :legend="{
                 show: true,
                 icon: 'circle',
                 orient: 'horizontal', // 图例方向
                 align: 'left', // 图例标记和文本的对齐，默认自动
                 top: 1,
-                right: 20,
+                right: 30,
                 itemWidth: 12,
                 itemHeight: 12,
                 padding: [0, 0, 0, 120],
               }"
+              :Xrotate="45"
             />
           </bench-col>
         </el-col>
diff --git a/src/views/alarm/policyConfig/monitorPoint/editDialog.vue b/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
index 494cbe8..bfaadb8 100644
--- a/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
+++ b/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
@@ -6,6 +6,7 @@
 import type { FormInstance, FormRules } from 'element-plus'
 import type { IForm, IList } from './monitorPoint-interface'
 import drawArea from './drawArea.vue'
+import { uniqueArray, differenceArray, deepClone, intersectionArray } from '@/utils/Array'
 import { createStream, sendHeart, stopStream } from '@/api/monitor/index-new-gm'
 import type { TableColumn } from '@/components/NormalTable/table_interface'
 import { isIp } from '@/utils/validate'
@@ -166,7 +167,6 @@
             }
             return {
               ...item,
-              algoModelId: formData.value.algoModelId, // 算法模型id
               // confidenceLevel:	item.confidenceLevel, // 置信度
               // recognitionTypeId:	item.recognitionTypeId, // 模型识别类型
               // threshold: item.threshold,	 // 阈值
@@ -194,6 +194,7 @@
 
         const params = {
           ...formData.value,
+          algoModelId: formData.value.algoModelId.join(','), // 算法模型id
           // sceneRelation: formData.value.type === 1 ? { id: formData.value.id, sceneId: formData.value.sceneId } : null,
           // eslint-disable-next-line multiline-ternary
           deviceModelRelations: formData.value.type === 0 ? tempList : [],
@@ -252,14 +253,8 @@
   })
   if (formData.value.type === 0) { // 算法模式
     let tempList = []
-    console.log('----------------------', points.value)
-    console.log('[[[[[[[[[[[[[[[]]]]]]]', value)
     tempList = value.map((i: any, index: number) => {
       const findIndex = points.value.findIndex((item: { recognitionTypeId: string }) => {
-        console.log(item.recognitionTypeId)
-        console.log(i.recognitionTypeId)
-        console.log(i.recognitionTypeId === item.recognitionTypeId)
-
         return i.recognitionTypeId === item.recognitionTypeId
       })
       if (findIndex === -1) {
@@ -267,17 +262,18 @@
         return {
           ...i,
           remark: i.recognitionTypeName,
+          isUse: '1',
           boundary: [ // 标记点位置
-            { x: 50 + index * 30, y: 50 + index * 30 },
-            { x: 150 + index * 30, y: 50 + index * 30 },
-            { x: 150 + index * 30, y: 150 + index * 30 },
-            { x: 50 + index * 30, y: 150 + index * 30 },
+            { x: 50, y: 50 },
+            { x: 150, y: 50 },
+            { x: 150, y: 150 },
+            { x: 50, y: 150 },
           ],
         }
       }
       else {
         console.log('找到了', i.recognitionTypeName)
-        return { ...i, ...points.value[findIndex] }
+        return { ...i, ...points.value[findIndex], isUse: '0' }
       }
     })
     points.value = tempList
@@ -286,29 +282,72 @@
 }
 
 // 监听算法变化，查询算法报警对象
-async function changeAlgoModelId(modelId: string) {
-  if (modelId) {
-    // 获取场景对象
-    const params = {
-      modelId, // 模型ID
-      typeCode: '', // 类型编码
-      typeName: '', // 类型名称
+async function changeAlgoModelId(modelIds: string[]) {
+  return new Promise((resolve) => {
+    console.log('监听算法变化', modelIds)
+
+    if (modelIds && Array.isArray(modelIds) && modelIds.length) {
+      // 求数组的差集，筛选出新选中的数据, 请求模型列表添加到表格中
+      const tempRecognitionIdList = recognitionList.value.map((item: { algoModelId: string }) => item.algoModelId)
+      const differenceArrayResult = differenceArray(modelIds, tempRecognitionIdList)
+
+      const allRequest = [] as any // 所有的请求
+      let tempList: any = []
+      differenceArrayResult.forEach((i: any) => {
+        // 获取场景对象
+        const params = {
+          modelId: i, // 模型ID
+          typeCode: '', // 类型编码
+          typeName: '', // 类型名称
+        }
+        const request = getRecognitionList(params).then((res) => {
+          const resList = res.data.map((item: { id: string; typeName: string }) => {
+            return {
+              ...item,
+              recognitionTypeName: item.typeName,
+              recognitionTypeId: item.id,
+              id: '',
+              confidenceLevel: 0, // 置信度
+              threshold: 0, // 阈值
+              algoModelId: i, // 算法id
+            }
+          })
+          tempList = tempList.concat(resList)
+        })
+        allRequest.push(request)
+      })
+
+      // 求两个数组的交集，筛选出未变动的数据，进行保留
+      const intersectionArrayResult = intersectionArray(modelIds, tempRecognitionIdList)
+      const needReserveList: any = [] // recognitionList中需要保留的数据
+      recognitionList.value.forEach((e: any) => {
+        const index = intersectionArrayResult.findIndex((item: string) => e.algoModelId === item)
+        if (index !== -1) {
+          needReserveList.push(e)
+        }
+      })
+
+      Promise.all(allRequest).then(() => {
+        recognitionList.value = needReserveList.concat(tempList)
+
+        // 原来选中的数据：进行默认选中
+        const selectedRows = recognitionList.value.filter((e: { isUse: string }) => e.isUse === '1') // 把选中的找出来
+        if (selectedRows && Array.isArray(selectedRows) && selectedRows.length) {
+          nextTick(() => {
+            // 默认选中
+            selectedRows.forEach((row: any) => {
+              algorithmTableRef.value?.toggleRowSelection(row, true)
+            })
+            points.value = selectedRows // 画图
+          })
+        }
+        resolve(null)
+      })
     }
-    const res = await getRecognitionList(params)
-    recognitionList.value = res.data.map((item: { id: string; typeName: string }) => {
-      return {
-        ...item,
-        recognitionTypeName: item.typeName,
-        recognitionTypeId: item.id,
-        id: '',
-        confidenceLevel: 0, // 置信度
-        threshold: 0, // 阈值
-      }
-    })
-  }
-  else {
-    recognitionList.value = []
-  }
+    else {
+      recognitionList.value = []
+    }
+  })
 }
 
 // -----------------------------------初始化、关闭对话框相关-----------------------------------------
@@ -327,52 +366,6 @@
     formData.value.deviceId = row.deviceId // 设备id
     formData.value.recognitionUrl = row.recognitionUrl || 'http://192.168.83.42/recognitionUrl'// 识别流地址
     formData.value.rtspUrl = row.rtspUrl || 'http://192.168.83.42/rtsp' // rtsp地址
-
-    // if (`${row.type}` === '0') { // 算法关联
-    //   formData.value.algoModelId = row.deviceModelRelations && row.deviceModelRelations.length && row.deviceModelRelations[0].algoModelId // 模型id
-    //   // 处理一下返回的数据格式
-    //   const resultList = row.deviceModelRelations.map((item: any) => {
-    //     return {
-    //       ...item,
-    //       confidenceLevel: `${item.confidenceLevel}` ? Number(item.confidenceLevel) : undefined,
-    //       threshold: `${item.threshold}` ? Number(item.threshold) : undefined,
-    //       boundary: item.boundary ? JSON.parse(item.boundary) : item.boundary,
-    //     }
-    //   })
-    //   // 先请求所有的数据，因为场景有可能变化
-    //   changeAlgoModelId(formData.value.algoModelId).then((res: any) => {
-    //     // 把其余的没有添加的报警对象给添加上
-    //     resultList.forEach((itemOut: any) => {
-    //       const index = recognitionList.value.findIndex((itemIn: any) => itemOut.recognitionTypeId === itemIn.recognitionTypeId)
-    //       if (index !== -1) {
-    //         recognitionList.value[index] = { ...itemOut }
-    //       }
-    //     })
-
-    //     // 原来选中的数据：进行默认选中
-    //     const selectedRows = recognitionList.value.filter((e: { isUse: string }) => e.isUse === '1') // 把选中的找出来
-    //     if (selectedRows && Array.isArray(selectedRows) && selectedRows.length) {
-    //       nextTick(() => {
-    //         // 默认选中
-    //         selectedRows.forEach((row: any) => {
-    //           algorithmTableRef.value?.toggleRowSelection(row, true)
-    //         })
-    //         points.value = selectedRows // 画图
-    //       })
-    //     }
-    //   })
-    // }
-    // else if (`${row.type}` === '1') { // 业务场景
-    //   formData.value.sceneId = row.sceneRelation.sceneId
-    //   points.value = [
-    //     {
-    //       id: row.sceneRelation.id,
-    //       remark: row.sceneRelation.remark,
-    //       sceneId: row.sceneRelation.sceneId,
-    //       boundary: row.sceneRelation.boundary ? JSON.parse(row.sceneRelation.boundary) : row.sceneRelation.boundary, // 识别边界
-    //     },
-    //   ]
-    // }
   }
   if (dialogstatus === 'detail') {
     formDataRef.value?.clearValidate()
@@ -394,7 +387,10 @@
   setTimeout(() => {
     console.log('在视频加载出来之后画框, 初始化的时候开始画框')
     if (`${row.type}` === '0') { // 算法关联
-      formData.value.algoModelId = row.deviceModelRelations && row.deviceModelRelations.length && row.deviceModelRelations[0].algoModelId // 模型id
+      const tempAlgoModelIdList: any = uniqueArray(row.deviceModelRelations.map((item: { algoModelId: string }) => item.algoModelId))!
+
+      formData.value.algoModelId = tempAlgoModelIdList // 模型id
+
       // 处理一下返回的数据格式
       const resultList = row.deviceModelRelations.map((item: any) => {
         let tempBoundary = []
@@ -416,7 +412,7 @@
         }
       })
       // 先请求所有的数据，因为场景有可能变化
-      changeAlgoModelId(formData.value.algoModelId).then((res: any) => {
+      changeAlgoModelId(tempAlgoModelIdList).then((res: any) => {
         // 把其余的没有添加的报警对象给添加上
         resultList.forEach((itemOut: any) => {
           const index = recognitionList.value.findIndex((itemIn: any) => itemOut.recognitionTypeId === itemIn.recognitionTypeId)
@@ -746,6 +742,7 @@
                   v-model="formData.algoModelId" placeholder="请选择算法" clearable class="select"
                   style="width: 100%;" :disabled="dialogStatus === 'detail'"
                   @change="changeAlgoModelId"
+                  multiple
                 >
                   <el-option v-for="item in algorithmList" :key="item.id" :value="item.id" :label="item.modelName">
                     <div style="display: flex;justify-content: space-between;">
diff --git a/src/views/bigScreen/components/areaDanger.vue b/src/views/bigScreen/components/areaDanger.vue
index bd374d4..6bd11f5 100644
--- a/src/views/bigScreen/components/areaDanger.vue
+++ b/src/views/bigScreen/components/areaDanger.vue
@@ -3,6 +3,7 @@
 import type { Ref } from 'vue'
 import { onMounted, ref } from 'vue'
 import { getAreaDanger } from '@/api/bs'
+import BarChartVerticalDynamics from '@/components/Echart/BarChartVerticalDynamics.vue'
 const safeCatogeryByDeptData: any = ref([]) // 单元安全隐患分类Y轴
 const safeCatogeryByDeptYDataMax = ref() // 单元安全隐患分类Y轴
 const safeCatogeryByDeptXData: Ref<string[]> = ref([]) // 单元安全隐患分类X轴
@@ -26,7 +27,7 @@
 
 <template>
   <div v-loading="loading" style="width: 100%;height: 100%;" class="area-danger-bs">
-    <bar-chart-vertical
+    <bar-chart-vertical-dynamics
       unit="个"
       :x-axis-data="safeCatogeryByDeptXData"
       :data="safeCatogeryByDeptData"

diff --git a/public/player/player.html b/public/player/player.html
index 81f4f25..3e4d55c 100644
--- a/public/player/player.html
+++ b/public/player/player.html
@@ -39,7 +39,7 @@
       function create() {
         jessibuca = new Jessibuca({
           container: $container, // 播放器容器 若为 string ，则底层调用的是 document.getElementById('id')
-          videoBuffer: 0.2, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
+          videoBuffer: 3, // 设置最大缓冲时长，单位秒，播放器会自动消除延迟
           isResize: true, //  1. 当为`true`的时候：视频画面做等比缩放后,高或宽对齐canvas区域,画面不被拉伸,但有黑边。 等同于 `setScaleMode(1)` 2. 当为`false`的时候：视频画面完全填充canvas区域,画面会被拉伸。等同于 `setScaleMode(0)`
           loadingText: '视频加载中', // 加载过程中文案
           useMSE: false, // 是否开启MediaSource硬解码 视频编码只支持H.264视频（Safari on iOS不支持）不支持 forceNoOffscreen 为 false (开启离屏渲染)
diff --git a/src/api/alarm/dangerAssessment/statistics.ts b/src/api/alarm/dangerAssessment/statistics.ts
new file mode 100644
index 0000000..2bdedcf
--- /dev/null
+++ b/src/api/alarm/dangerAssessment/statistics.ts
@@ -0,0 +1,44 @@
+/**
+ * 安全生产隐患评估
+ */
+import request from '../../index'
+
+// 单位近一个月报警分析
+export function getDeptAlarmRecord() {
+  return request({
+    url: 'statistics/dept/record',
+    method: 'get',
+  })
+}
+
+// 单位报警时间曲线
+export function getDeptAlarmDate() {
+  return request({
+    url: 'statistics/dept/alarm/date',
+    method: 'get',
+  })
+}
+
+// 隐患分类
+export function getDangerCategory() {
+  return request({
+    url: 'statistics/dangerCategory',
+    method: 'get',
+  })
+}
+
+// 区域隐患分类
+export function getAreaDanger() {
+  return request({
+    url: 'statistics/areaDanger',
+    method: 'get',
+  })
+}
+
+// 单位安全隐患分类
+export function getDeptDanger() {
+  return request({
+    url: 'statistics/deptDanger',
+    method: 'get',
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index 965339c..0d54fa5 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -20,6 +20,7 @@
     AuthAll: typeof import('./components/AuthAll/index.vue')['default']
     BarChartHorizontal: typeof import('./components/Echart/BarChartHorizontal.vue')['default']
     BarChartVertical: typeof import('./components/Echart/BarChartVertical.vue')['default']
+    BarChartVerticalDynamics: typeof import('./components/Echart/BarChartVerticalDynamics.vue')['default']
     BarCodeBind: typeof import('./components/BarCodeBind/index.vue')['default']
     BatchActionBar: typeof import('./components/BatchActionBar/index.vue')['default']
     BenchCol: typeof import('./components/benchCol/index.vue')['default']
@@ -27,6 +28,7 @@
     CertificationMonitor: typeof import('./components/Sample/certificationMonitor.vue')['default']
     CertificationRecords: typeof import('./components/Sample/certificationRecords.vue')['default']
     ConditionDrawer: typeof import('./components/drawer/conditionDrawer.vue')['default']
+    copy: typeof import('./components/Echart/LineChart copy.vue')['default']
     CopyerDrawer: typeof import('./components/drawer/copyerDrawer.vue')['default']
     Copyright: typeof import('./components/Copyright/index.vue')['default']
     DeptSelect: typeof import('./components/DeptSelect/index.vue')['default']
@@ -43,6 +45,7 @@
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
     LineChart: typeof import('./components/Echart/LineChart.vue')['default']
+    LineChartDynamics: typeof import('./components/Echart/LineChartDynamics.vue')['default']
     MeasureRecords: typeof import('./components/Sample/measureRecords.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
index b42624a..d1414f0 100644
--- a/src/components/Echart/BarChartVertical.vue
+++ b/src/components/Echart/BarChartVertical.vue
@@ -46,7 +46,7 @@
       return {
         top: 30,
         left: 20,
-        right: 20,
+        right: 30,
         bottom: 30,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -243,10 +243,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -255,6 +251,11 @@
     type: String,
     default: '#fff',
   },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
 })
 
 // 图表对象
@@ -350,23 +351,13 @@
         axisLabel: {
           color: props.fontColor,
           fontSize: 11,
-          rotate: 45,
+          rotate: props.rotate,
         },
         splitLine: {
           show: false,
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as barSeriesOption[],
   }
   // 标题
@@ -487,9 +478,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 3)
-  // }
   chart.setOption({})
   nextTick(() => {
     chart.resize()
@@ -500,9 +488,6 @@
 function refreshChart() {
   if (chart) {
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 2)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
   }
 }
diff --git a/src/components/Echart/BarChartVerticalDynamics.vue b/src/components/Echart/BarChartVerticalDynamics.vue
new file mode 100644
index 0000000..2ba92d2
--- /dev/null
+++ b/src/components/Echart/BarChartVerticalDynamics.vue
@@ -0,0 +1,531 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  // 柱子之间的距离
+  barGap: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 20,
+        right: 20,
+        bottom: 30,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 2,
+        right: 60,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  // 是否使用默认的颜色
+  useDefaultCoclor: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2fade0', '#01c2f9'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 20,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+  /** x轴标签倾斜 */
+  rotate: {
+    type: Number,
+    default: 45,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    title: [{ text: props.title }],
+    grid: props.grid,
+    legend: props.legend, // 图例
+    toolbox: [{
+      // feature: {
+      //   saveAsImage: {
+      //     show: 'true',
+      //     icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+      //     title: '保存为图片',
+      //     type: 'png',
+      //     connectedBackgroundColor: '#fff',
+      //     name: '',
+      //   },
+      // },
+    }],
+    tooltip: {
+      trigger: 'axis',
+      confine: true, // 是否限制提示框在图表范围内
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 11,
+          rotate: props.rotate,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+      textStyle: {
+        fontWeight: 'normal',
+        fontSize: 14,
+        color: '#0b2c5b',
+      },
+      bottom: 0,
+      left: 'center',
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        barGap: props.barGap,
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0 && !props.useDefaultCoclor) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  chart.setOption({})
+  nextTick(() => {
+    chart.resize()
+  })
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 2)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 4213084..72666b2 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -39,7 +39,7 @@
       return {
         top: 30,
         left: 10,
-        right: 20,
+        right: 30,
         bottom: 10,
         containLabel: true, // 是否包含坐标轴的刻度标签
       }
@@ -187,10 +187,6 @@
     type: Boolean,
     default: true,
   },
-  isAutomaticCarousel: { // 图表是否自动轮播
-    type: Boolean,
-    default: false,
-  },
   tooltipTextColor: {
     type: String,
     default: '#737373',
@@ -290,16 +286,6 @@
         },
       },
     ],
-    dataZoom: [
-      // 滑动条
-      {
-        xAxisIndex: 0, // 这里是从X轴的0刻度开始
-        show: false, // 是否显示滑动条，不影响使用
-        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
-        startValue: 0, // 开始位置。
-        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
-      },
-    ],
     series: [] as lineSeriesOption[],
   }
   // 标题
@@ -378,9 +364,6 @@
 function initChart() {
   chart = init(chartRef.value as HTMLElement, tdTheme)
   const option = buildOption()
-  // if (props.isAutomaticCarousel) {
-  //   automaticCarousel(option, chart, 3000, 6)
-  // }
   chart.setOption({})
   chart.resize()
 }
@@ -390,9 +373,6 @@
   if (chart) {
     console.log('渲染折线图')
     const option = buildOption()
-    if (props.isAutomaticCarousel) {
-      automaticCarousel(option, chart, 3000, 3)
-    }
     chart.setOption(option as unknown as ECBasicOption, true)
     chart.resize()
   }
diff --git a/src/components/Echart/LineChartDynamics.vue b/src/components/Echart/LineChartDynamics.vue
new file mode 100644
index 0000000..2a2f063
--- /dev/null
+++ b/src/components/Echart/LineChartDynamics.vue
@@ -0,0 +1,420 @@
+<script lang="ts" setup name="LineChart">
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { lineDataI, lineOption, lineSeriesOption } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+import { automaticCarousel } from './automaticCarousel'
+import { formatColor, getAlphaColor } from './utils'
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#09c2f9',
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 30,
+        left: 10,
+        right: 30,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * X轴类型
+   */
+  xAxisType: {
+    type: String,
+    default: 'category',
+    validator: (value: string) => {
+      return ['category', 'value', 'time', 'log'].includes(value)
+    },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 颜色
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        '#f5b637',
+        '#45c7f2',
+        '#ff9900',
+        '#E46CBB',
+        '#9A66E4',
+        '#ed3f14',
+        '#01C2F9',
+      ]
+    },
+  },
+  /**
+   * 实虚线
+   */
+  axisLineType: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#7a6b74',
+  },
+  // x轴标签倾斜
+  Xrotate: {
+    type: Number,
+    default: 0,
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  /**
+   * 是否为渐变折线图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * y轴最大值
+   */
+  max: {
+    type: [String, Number],
+    default: '',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 平滑
+   */
+  smooth: {
+    type: Boolean,
+    default: true,
+  },
+  isAutomaticCarousel: { // 图表是否自动轮播
+    type: Boolean,
+    default: false,
+  },
+  tooltipTextColor: {
+    type: String,
+    default: '#737373',
+  },
+  tooltipBackgroundColor: {
+    type: String,
+    default: '#fff',
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: lineOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+        color: props.tooltipTextColor,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      backgroundColor: props.tooltipBackgroundColor,
+      valueFormatter: (value: string | number) => {
+        return value + props.unit
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        type: props.xAxisType,
+        boundaryGap: true,
+        axisLine: {
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 11,
+          rotate: props.Xrotate,
+        },
+        splitLine: {
+          show: false,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: props.axisLineType,
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: false,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        nameTextStyle: {
+          color: props.fontColor,
+          fontSize: 14,
+          verticalAlign: 'middle',
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: ['#bfbfbf'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    dataZoom: [
+      // 滑动条
+      {
+        xAxisIndex: 0, // 这里是从X轴的0刻度开始
+        show: false, // 是否显示滑动条，不影响使用
+        type: 'inside', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
+        startValue: 0, // 开始位置。
+        endValue: 1, // 一次性展示几个。（如果startValue设定为0，那么页面展示数就是endValue+1，比如此例页面展示2个）
+      },
+    ],
+    series: [] as lineSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // x轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴
+    }
+  }
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: lineSeriesOption[] = []
+    // 遍历data， 拆分轴线名称，数据和颜色
+    for (const itemIndex in props.data) {
+      const item = props.data[itemIndex]
+      const series: lineSeriesOption = {
+        name: item.name, // 线系列名
+        type: item.seriesType || 'line',
+        symbol: 'none', // 去掉折线节点
+        smooth: props.smooth, // 曲线平滑设置
+        lineStyle: {
+          width: 2,
+        },
+        label: {
+          show: item.seriesType === 'bar' ? true : false,
+          position: 'top',
+          color: props.labelColor,
+          fontSize: 15,
+        },
+        data: item.data,
+      }
+      // 线段颜色
+      if (item.color || props.colors.length > 0) {
+        series.itemStyle = {
+          color: item.color ? formatColor(item.color) : formatColor(props.colors[itemIndex] as string),
+        }
+        // 如果开启渐变
+        if (props.gradient) {
+          series.areaStyle = {
+            color: new echarts.graphic.LinearGradient(
+              0, 0, 0, 1, // 变化度 ,渐变方向
+              [
+                {
+                  offset: 0.1,
+                  color: item.color ? getAlphaColor(item.color, 0.6) : getAlphaColor(props.colors[itemIndex] as string, 0.6),
+                },
+                {
+                  offset: 1,
+                  color: '#fff',
+                },
+              ],
+            ),
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  const option = buildOption()
+  // if (props.isAutomaticCarousel) {
+  //   automaticCarousel(option, chart, 3000, 6)
+  // }
+  chart.setOption({})
+  chart.resize()
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    console.log('渲染折线图')
+    const option = buildOption()
+    if (props.isAutomaticCarousel) {
+      automaticCarousel(option, chart, 3000, 3)
+    }
+    chart.setOption(option as unknown as ECBasicOption, true)
+    chart.resize()
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+}
+</style>
diff --git a/src/utils/Array.ts b/src/utils/Array.ts
new file mode 100644
index 0000000..8c73e19
--- /dev/null
+++ b/src/utils/Array.ts
@@ -0,0 +1,63 @@
+import _ from 'lodash'
+// 常见数组操作
+
+// 两个数组求交集
+export const intersectionArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => list2.includes(v))
+}
+// 差集 -- 常用于 表格中多选删除
+export const differenceArray = (list1: any[], list2: any[]) => {
+  return list1.filter(v => !list2.includes(v))
+}
+// 补集
+export const complementaryArray = (list1: any[], list2: any[]) => {
+  return list1.filter((v) => { return !(list2.includes(v)) })
+    .concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 并集
+export const unionArray = (list1: any[], list2: any[]) => {
+  return list1.concat(list2.filter((v) => { return !(list1.includes(v)) }))
+}
+// 一维数组去重
+export const uniqueArray = (list: any) => {
+  return [...new Set(list)]
+}
+// 二维数组根据 某一属性 去重
+export const uniqueMultiArray = (list: any, attribute: string) => {
+  const res = new Map()
+  return list.filter((a: any) => !res.has(a[attribute]) && res.set(a[attribute], 1))
+}
+// 一维数组或对象拷贝
+export const cloneArray = (data: any) => {
+  return JSON.parse(JSON.stringify(data))
+}
+// 多维数组或对象深拷贝
+export const deepClone = (data: any) => {
+  return _.cloneDeep(data)
+}
+// 数组操作-下拉框操作(已经选择的数据不能再选)
+/**
+ * @param list 下拉框初始数据(所有)
+ * @param list1 已经选择的数据
+ * @param current 当前数据 可为空
+ * @param attribute 属性(即绑定在 list1哪个属性上)
+ */
+export const setSelectList = (list: any[], list1: any[], current: string, attribute: string, attribute2 = 'value') => {
+  const select = [...new Set(list1.map((item: any) => item[attribute]))].filter((item: string) => item !== current)
+  return list.filter((item) => { return !select.includes(item[attribute2]) })
+}
+// 几个数组的交集
+export function intersectionManyArray(...arrays) {
+  console.log(...arrays, '1111111111')
+  // 获取第一个数组作为初始交集
+  let intersection = arrays.shift()
+
+  // 遍历剩余的数组
+  while (arrays.length) {
+    // 过滤当前交集，只保留那些也在当前数组中的元素
+    intersection = intersection.filter(item => arrays[0].includes(item))
+    // 移动到下一个数组
+    arrays.shift()
+  }
+  return intersection
+}
diff --git a/src/views/alarm/dangerAssessment/assessment/list.vue b/src/views/alarm/dangerAssessment/assessment/list.vue
index fca5e5a..f0b5f8b 100644
--- a/src/views/alarm/dangerAssessment/assessment/list.vue
+++ b/src/views/alarm/dangerAssessment/assessment/list.vue
@@ -1,9 +1,11 @@
+<!-- 安全生产隐患评估 -->
 <script lang="ts" setup name="Statistics">
 import { getCurrentInstance, ref } from 'vue'
 import type { Ref } from 'vue'
 import type { DateModelType } from 'element-plus'
 import LineChart from '@/components/Echart/LineChart.vue'
 import BarChartHorizontal from '@/components/Echart/BarChartHorizontal.vue'
+import { getAreaDanger, getDangerCategory, getDeptAlarmDate, getDeptAlarmRecord, getDeptDanger } from '@/api/alarm/dangerAssessment/statistics'
 import type { lineDataI } from '@/components/Echart/echart-interface'
 import { areaDev, areaDevOnline, dayDev } from '@/api/monitor/statistics'
 import PieChart from '@/components/Echart/PieChart.vue'
@@ -12,7 +14,6 @@
 import chemistryImage from '@/assets/bigScreen/chemistry.png'
 import workImage from '@/assets/bigScreen/work.png'
 import progressImage from '@/assets/bigScreen/progress.png'
-import { getDangerCategory } from '@/api/bs'
 const urlMap: any = {
   危险点: pointImage,
   重大危险源: resourceImage,
@@ -74,86 +75,52 @@
 // 单位近一个月报警分析
 function getLastMonthAlarm() {
   lastMonthAlarmLoading.value = true
-  areaDev().then((res) => {
-    // const value = res.data.map((item: any) => Number(item.value))
-    // lastMonthAlarmData.value = [{ name: '设备数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    // lastMonthAlarmXData.value = res.data.map((item: any) => item.areaName)
-    const value = [88, 58, 55, 787, 23, 4, 55]
+  getDeptAlarmRecord().then((res) => {
+    const value = res.data.map((item: any) => Number(item.num))
     lastMonthAlarmData.value = [{ name: '报警数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    lastMonthAlarmXData.value = ['二部', '201', '203', '283', '23', '25', '706']
+    lastMonthAlarmXData.value = res.data.map((item: any) => item.deptName)
+    lastMonthAlarmLoading.value = false
+  }).catch(() => {
     lastMonthAlarmLoading.value = false
   })
 }
 
-// 单元安全隐患分类
+// 单位安全隐患分类
 function getSafeCatogeryByDept() {
   safeCatogeryByDeptLoading.value = true
-  areaDev().then((res) => {
-    // const value = res.data.map((item: any) => Number(item.value))
-    // lastMonthAlarmData.value = [{ name: '设备数量', data: value }]
-    // lastMonthAlarmYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    // lastMonthAlarmXData.value = res.data.map((item: any) => item.areaName)
-    const value = [88, 58, 55, 77, 23, 40, 55]
-    const value1 = [10, 20, 34, 5, 44, 55, 1]
-    const value2 = [67, 67, 67, 88, 23, 50, 66]
-    const value3 = [67, 58, 88, 78, 23, 40, 122]
-    safeCatogeryByDeptData.value = [{ name: '有害气体', data: value }, { name: '易燃易爆', data: value1 }, { name: '机械', data: value2 }, { name: '其他', data: value3 }]
-    // safeCatogeryByDeptYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
-    safeCatogeryByDeptXData.value = ['二部', '201', '203', '283', '23', '25', '706']
+  getDeptDanger().then((res) => {
+    safeCatogeryByDeptData.value = res.data.yData
+    safeCatogeryByDeptXData.value = res.data.xData
     safeCatogeryByDeptLoading.value = false
   })
 }
 
+function sum(arr: string[]) {
+  let s = 0
+  for (let i = arr.length - 1; i >= 0; i--) {
+    s += Number(arr[i])
+  }
+  return s
+}
 // 区域隐患分析
 function getAreaPieData() {
   areaPieLoading.value = true
-  areaDev().then((res) => {
-    // areaPieData.value = res.data.map((item: any) => {
-    //   return {
-    //     name: item.areaName,
-    //     value: Number(item.value),
-    //   }
-    // })
-    areaPieData.value = [
-      {
-        value: '2',
-        name: '湖北',
-      },
-      {
-        value: '10',
-        name: '柳州',
-      },
-      {
-        value: '100',
-        name: '北京',
-      },
-      {
-        value: '2',
-        name: '河北',
-      },
-      {
-        value: '23',
-        name: '江苏无锡',
-      },
-      {
-        value: '2',
-        name: '湖南',
-      },
-      {
-        value: '20',
-        name: '朝阳',
-      },
-
-    ]
+  getAreaDanger().then((res) => {
+    areaPieData.value = res.data.yData.map((item: any) => {
+      return {
+        name: item.name,
+        value: sum(item.data),
+      }
+    })
+    areaPieLoading.value = false
+  }).catch(() => {
     areaPieLoading.value = false
   })
 }
 // 安全隐患类别分析
 function getSafeCatogery() {
   safeCatogeryLoading.value = true
-  areaDevOnline().then((res) => {
+  areaDevOnline().then((_res) => {
     // const value = res.data.map((item: any) => Number(item.value))
     // safeCatogeryData.value = [{ name: '设备在线数量', data: value }]
     // onlineBarYDataMax.value = Math.max(value) > 10 ? Math.max(value) : 10
@@ -168,11 +135,9 @@
 // 单位时间报警曲线
 function getAlarmLine() {
   alarmLineLoading.value = true
-  dayDev().then((res) => {
-    const onlineValue = res.data.map((item: any) => Number(item.online))
-    const offlineValue = res.data.map((item: any) => Number(item.offline))
-    alarmLineXData.value = res.data.map((item: any) => item.date)
-    alarmLineData.value = [{ name: '离线设备', data: offlineValue }, { name: '在线设备', data: onlineValue }]
+  getDeptAlarmDate().then((res) => {
+    alarmLineXData.value = res.data.x
+    alarmLineData.value = res.data.y
     alarmLineLoading.value = false
   })
 }
@@ -225,8 +190,8 @@
 })
 onMounted(() => {
   fetchDangerCategory()
-  getLastMonthAlarm()
-  getSafeCatogery() // 获取安全隐患类别
+  getLastMonthAlarm() // 单位近一个月报警分析
+  // getSafeCatogery() // 获取安全隐患类别
   getAlarmLine() // 单位报警时间曲线
   getAreaPieData() // 区域隐患分析
   getSafeCatogeryByDept() // 单位安全隐患分类
@@ -268,7 +233,7 @@
                 show: true,
                 type: 'scroll',
                 orient: 'vertical',
-                right: '0%',
+                right: '10%',
                 top: 'center',
                 icon: 'circle',
                 itemWidth: 16,
@@ -280,30 +245,6 @@
             />
           </bench-col>
         </el-col>
-        <!-- <el-col :span="8">
-          <bench-col v-loading="safeCatogeryLoading" icon="icon-bar" title="安全隐患类别分析" :height="blockHeight">
-            <bar-chart-horizontal
-              style="margin-top: -20px;"
-              unit="台"
-              :x-axis-data="safeCatogeryXData"
-              :width="`${blockWidth / 3 - 10}px`"
-              :height="`${blockHeight - 30}px`"
-              :data="safeCatogeryData"
-              :max="onlineBarYDataMax"
-              :legend="{
-                show: true,
-                icon: 'circle',
-                orient: 'vertile', // 图例方向
-                align: 'left', // 图例标记和文本的对齐，默认自动
-                top: 5,
-                right: 20,
-                itemWidth: 12,
-                itemHeight: 12,
-                padding: [0, 0, 0, 120],
-              }"
-            />
-          </bench-col>
-        </el-col> -->
         <el-col :span="12">
           <bench-col v-loading="safeCatogeryByDeptLoading" icon="icon-bar" title="单位安全隐患分类" :height="blockHeight">
             <bar-chart-vertical
@@ -344,8 +285,7 @@
         <el-col :span="12">
           <bench-col v-loading="lastMonthAlarmLoading" icon="icon-bar" title="单位近一个月报警分析" :height="blockHeight">
             <bar-chart-vertical
-              style="margin-top: -20px;"
-              unit="台"
+              unit=""
               :x-axis-data="lastMonthAlarmXData"
               :width="`${blockWidth / 2 - 10}px`"
               :height="`${blockHeight - 30}px`"
@@ -362,18 +302,19 @@
               :x-axis-data="alarmLineXData"
               :width="`${blockWidth / 2 - 10}px`"
               :data="alarmLineData"
-              unit="台"
+              unit=""
               :legend="{
                 show: true,
                 icon: 'circle',
                 orient: 'horizontal', // 图例方向
                 align: 'left', // 图例标记和文本的对齐，默认自动
                 top: 1,
-                right: 20,
+                right: 30,
                 itemWidth: 12,
                 itemHeight: 12,
                 padding: [0, 0, 0, 120],
               }"
+              :Xrotate="45"
             />
           </bench-col>
         </el-col>
diff --git a/src/views/alarm/policyConfig/monitorPoint/editDialog.vue b/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
index 494cbe8..bfaadb8 100644
--- a/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
+++ b/src/views/alarm/policyConfig/monitorPoint/editDialog.vue
@@ -6,6 +6,7 @@
 import type { FormInstance, FormRules } from 'element-plus'
 import type { IForm, IList } from './monitorPoint-interface'
 import drawArea from './drawArea.vue'
+import { uniqueArray, differenceArray, deepClone, intersectionArray } from '@/utils/Array'
 import { createStream, sendHeart, stopStream } from '@/api/monitor/index-new-gm'
 import type { TableColumn } from '@/components/NormalTable/table_interface'
 import { isIp } from '@/utils/validate'
@@ -166,7 +167,6 @@
             }
             return {
               ...item,
-              algoModelId: formData.value.algoModelId, // 算法模型id
               // confidenceLevel:	item.confidenceLevel, // 置信度
               // recognitionTypeId:	item.recognitionTypeId, // 模型识别类型
               // threshold: item.threshold,	 // 阈值
@@ -194,6 +194,7 @@
 
         const params = {
           ...formData.value,
+          algoModelId: formData.value.algoModelId.join(','), // 算法模型id
           // sceneRelation: formData.value.type === 1 ? { id: formData.value.id, sceneId: formData.value.sceneId } : null,
           // eslint-disable-next-line multiline-ternary
           deviceModelRelations: formData.value.type === 0 ? tempList : [],
@@ -252,14 +253,8 @@
   })
   if (formData.value.type === 0) { // 算法模式
     let tempList = []
-    console.log('----------------------', points.value)
-    console.log('[[[[[[[[[[[[[[[]]]]]]]', value)
     tempList = value.map((i: any, index: number) => {
       const findIndex = points.value.findIndex((item: { recognitionTypeId: string }) => {
-        console.log(item.recognitionTypeId)
-        console.log(i.recognitionTypeId)
-        console.log(i.recognitionTypeId === item.recognitionTypeId)
-
         return i.recognitionTypeId === item.recognitionTypeId
       })
       if (findIndex === -1) {
@@ -267,17 +262,18 @@
         return {
           ...i,
           remark: i.recognitionTypeName,
+          isUse: '1',
           boundary: [ // 标记点位置
-            { x: 50 + index * 30, y: 50 + index * 30 },
-            { x: 150 + index * 30, y: 50 + index * 30 },
-            { x: 150 + index * 30, y: 150 + index * 30 },
-            { x: 50 + index * 30, y: 150 + index * 30 },
+            { x: 50, y: 50 },
+            { x: 150, y: 50 },
+            { x: 150, y: 150 },
+            { x: 50, y: 150 },
           ],
         }
       }
       else {
         console.log('找到了', i.recognitionTypeName)
-        return { ...i, ...points.value[findIndex] }
+        return { ...i, ...points.value[findIndex], isUse: '0' }
       }
     })
     points.value = tempList
@@ -286,29 +282,72 @@
 }
 
 // 监听算法变化，查询算法报警对象
-async function changeAlgoModelId(modelId: string) {
-  if (modelId) {
-    // 获取场景对象
-    const params = {
-      modelId, // 模型ID
-      typeCode: '', // 类型编码
-      typeName: '', // 类型名称
+async function changeAlgoModelId(modelIds: string[]) {
+  return new Promise((resolve) => {
+    console.log('监听算法变化', modelIds)
+
+    if (modelIds && Array.isArray(modelIds) && modelIds.length) {
+      // 求数组的差集，筛选出新选中的数据, 请求模型列表添加到表格中
+      const tempRecognitionIdList = recognitionList.value.map((item: { algoModelId: string }) => item.algoModelId)
+      const differenceArrayResult = differenceArray(modelIds, tempRecognitionIdList)
+
+      const allRequest = [] as any // 所有的请求
+      let tempList: any = []
+      differenceArrayResult.forEach((i: any) => {
+        // 获取场景对象
+        const params = {
+          modelId: i, // 模型ID
+          typeCode: '', // 类型编码
+          typeName: '', // 类型名称
+        }
+        const request = getRecognitionList(params).then((res) => {
+          const resList = res.data.map((item: { id: string; typeName: string }) => {
+            return {
+              ...item,
+              recognitionTypeName: item.typeName,
+              recognitionTypeId: item.id,
+              id: '',
+              confidenceLevel: 0, // 置信度
+              threshold: 0, // 阈值
+              algoModelId: i, // 算法id
+            }
+          })
+          tempList = tempList.concat(resList)
+        })
+        allRequest.push(request)
+      })
+
+      // 求两个数组的交集，筛选出未变动的数据，进行保留
+      const intersectionArrayResult = intersectionArray(modelIds, tempRecognitionIdList)
+      const needReserveList: any = [] // recognitionList中需要保留的数据
+      recognitionList.value.forEach((e: any) => {
+        const index = intersectionArrayResult.findIndex((item: string) => e.algoModelId === item)
+        if (index !== -1) {
+          needReserveList.push(e)
+        }
+      })
+
+      Promise.all(allRequest).then(() => {
+        recognitionList.value = needReserveList.concat(tempList)
+
+        // 原来选中的数据：进行默认选中
+        const selectedRows = recognitionList.value.filter((e: { isUse: string }) => e.isUse === '1') // 把选中的找出来
+        if (selectedRows && Array.isArray(selectedRows) && selectedRows.length) {
+          nextTick(() => {
+            // 默认选中
+            selectedRows.forEach((row: any) => {
+              algorithmTableRef.value?.toggleRowSelection(row, true)
+            })
+            points.value = selectedRows // 画图
+          })
+        }
+        resolve(null)
+      })
     }
-    const res = await getRecognitionList(params)
-    recognitionList.value = res.data.map((item: { id: string; typeName: string }) => {
-      return {
-        ...item,
-        recognitionTypeName: item.typeName,
-        recognitionTypeId: item.id,
-        id: '',
-        confidenceLevel: 0, // 置信度
-        threshold: 0, // 阈值
-      }
-    })
-  }
-  else {
-    recognitionList.value = []
-  }
+    else {
+      recognitionList.value = []
+    }
+  })
 }
 
 // -----------------------------------初始化、关闭对话框相关-----------------------------------------
@@ -327,52 +366,6 @@
     formData.value.deviceId = row.deviceId // 设备id
     formData.value.recognitionUrl = row.recognitionUrl || 'http://192.168.83.42/recognitionUrl'// 识别流地址
     formData.value.rtspUrl = row.rtspUrl || 'http://192.168.83.42/rtsp' // rtsp地址
-
-    // if (`${row.type}` === '0') { // 算法关联
-    //   formData.value.algoModelId = row.deviceModelRelations && row.deviceModelRelations.length && row.deviceModelRelations[0].algoModelId // 模型id
-    //   // 处理一下返回的数据格式
-    //   const resultList = row.deviceModelRelations.map((item: any) => {
-    //     return {
-    //       ...item,
-    //       confidenceLevel: `${item.confidenceLevel}` ? Number(item.confidenceLevel) : undefined,
-    //       threshold: `${item.threshold}` ? Number(item.threshold) : undefined,
-    //       boundary: item.boundary ? JSON.parse(item.boundary) : item.boundary,
-    //     }
-    //   })
-    //   // 先请求所有的数据，因为场景有可能变化
-    //   changeAlgoModelId(formData.value.algoModelId).then((res: any) => {
-    //     // 把其余的没有添加的报警对象给添加上
-    //     resultList.forEach((itemOut: any) => {
-    //       const index = recognitionList.value.findIndex((itemIn: any) => itemOut.recognitionTypeId === itemIn.recognitionTypeId)
-    //       if (index !== -1) {
-    //         recognitionList.value[index] = { ...itemOut }
-    //       }
-    //     })
-
-    //     // 原来选中的数据：进行默认选中
-    //     const selectedRows = recognitionList.value.filter((e: { isUse: string }) => e.isUse === '1') // 把选中的找出来
-    //     if (selectedRows && Array.isArray(selectedRows) && selectedRows.length) {
-    //       nextTick(() => {
-    //         // 默认选中
-    //         selectedRows.forEach((row: any) => {
-    //           algorithmTableRef.value?.toggleRowSelection(row, true)
-    //         })
-    //         points.value = selectedRows // 画图
-    //       })
-    //     }
-    //   })
-    // }
-    // else if (`${row.type}` === '1') { // 业务场景
-    //   formData.value.sceneId = row.sceneRelation.sceneId
-    //   points.value = [
-    //     {
-    //       id: row.sceneRelation.id,
-    //       remark: row.sceneRelation.remark,
-    //       sceneId: row.sceneRelation.sceneId,
-    //       boundary: row.sceneRelation.boundary ? JSON.parse(row.sceneRelation.boundary) : row.sceneRelation.boundary, // 识别边界
-    //     },
-    //   ]
-    // }
   }
   if (dialogstatus === 'detail') {
     formDataRef.value?.clearValidate()
@@ -394,7 +387,10 @@
   setTimeout(() => {
     console.log('在视频加载出来之后画框, 初始化的时候开始画框')
     if (`${row.type}` === '0') { // 算法关联
-      formData.value.algoModelId = row.deviceModelRelations && row.deviceModelRelations.length && row.deviceModelRelations[0].algoModelId // 模型id
+      const tempAlgoModelIdList: any = uniqueArray(row.deviceModelRelations.map((item: { algoModelId: string }) => item.algoModelId))!
+
+      formData.value.algoModelId = tempAlgoModelIdList // 模型id
+
       // 处理一下返回的数据格式
       const resultList = row.deviceModelRelations.map((item: any) => {
         let tempBoundary = []
@@ -416,7 +412,7 @@
         }
       })
       // 先请求所有的数据，因为场景有可能变化
-      changeAlgoModelId(formData.value.algoModelId).then((res: any) => {
+      changeAlgoModelId(tempAlgoModelIdList).then((res: any) => {
         // 把其余的没有添加的报警对象给添加上
         resultList.forEach((itemOut: any) => {
           const index = recognitionList.value.findIndex((itemIn: any) => itemOut.recognitionTypeId === itemIn.recognitionTypeId)
@@ -746,6 +742,7 @@
                   v-model="formData.algoModelId" placeholder="请选择算法" clearable class="select"
                   style="width: 100%;" :disabled="dialogStatus === 'detail'"
                   @change="changeAlgoModelId"
+                  multiple
                 >
                   <el-option v-for="item in algorithmList" :key="item.id" :value="item.id" :label="item.modelName">
                     <div style="display: flex;justify-content: space-between;">
diff --git a/src/views/bigScreen/components/areaDanger.vue b/src/views/bigScreen/components/areaDanger.vue
index bd374d4..6bd11f5 100644
--- a/src/views/bigScreen/components/areaDanger.vue
+++ b/src/views/bigScreen/components/areaDanger.vue
@@ -3,6 +3,7 @@
 import type { Ref } from 'vue'
 import { onMounted, ref } from 'vue'
 import { getAreaDanger } from '@/api/bs'
+import BarChartVerticalDynamics from '@/components/Echart/BarChartVerticalDynamics.vue'
 const safeCatogeryByDeptData: any = ref([]) // 单元安全隐患分类Y轴
 const safeCatogeryByDeptYDataMax = ref() // 单元安全隐患分类Y轴
 const safeCatogeryByDeptXData: Ref<string[]> = ref([]) // 单元安全隐患分类X轴
@@ -26,7 +27,7 @@
 
 <template>
   <div v-loading="loading" style="width: 100%;height: 100%;" class="area-danger-bs">
-    <bar-chart-vertical
+    <bar-chart-vertical-dynamics
       unit="个"
       :x-axis-data="safeCatogeryByDeptXData"
       :data="safeCatogeryByDeptData"
diff --git a/src/views/bigScreen/components/deptVideoPoint.vue b/src/views/bigScreen/components/deptVideoPoint.vue
index fc77f4d..be69edf 100644
--- a/src/views/bigScreen/components/deptVideoPoint.vue
+++ b/src/views/bigScreen/components/deptVideoPoint.vue
@@ -3,6 +3,7 @@
 import type { Ref } from 'vue'
 import { onMounted, ref } from 'vue'
 import { getDeptVideoPoint } from '@/api/bs'
+import LineChartDynamics from '@/components/Echart/LineChartDynamics.vue'
 const dangerTimeLineXData: any = ref([]) // 各单位预警时间分析X轴
 const dangerTimeLineData = ref() // 各单位预警时间分析Y轴
 const loading = ref(false) // loading
@@ -28,7 +29,7 @@
 
 <template>
   <div class="danter-time-bs" style="width: 100%;height: 100%;" v-loading="loading">
-    <line-chart
+    <line-chart-dynamics
       :x-axis-data="dangerTimeLineXData"
       :data="dangerTimeLineData"
       unit=""