diff --git a/src/components/videoDHone/index.vue b/src/components/videoDHone/index.vue
index c4b65e7..a48e4fe 100644
--- a/src/components/videoDHone/index.vue
+++ b/src/components/videoDHone/index.vue
@@ -8,6 +8,7 @@
 import { ref, reactive, toRefs, onMounted, onUnmounted } from 'vue';
 import { listConfig } from '@/api/system/config';
 const { proxy } = getCurrentInstance();
+const { dh_video_config } = proxy.useDict('dh_video_config');
 
 const props = defineProps({
   // 内网、公网 4个配置
@@ -56,89 +57,104 @@
   { deep: true, immediate: true }
 );
 
+function convertArrayToObject(array) {
+  console.log('array', array);
+  const resultObject = {};
+  array.forEach(item => {
+    resultObject[item.label] = item.value;
+  });
+  return resultObject;
+}
+
 // 初始化并登录插件
 function initDHPlayer() {
-  console.log('初始化视频');
-  desc.value = '插件启动中....';
-  AllData.myVideoPlayer = new VideoPlayer({
-    videoId: 'dhplayer-dom', // 唯一标识，必填，不能重复
-    windowType: 0, // 播放器类型，必传， 0 - 实时预览，3 - 录像回放，7- 录像回放（支持倒放）
-    usePluginLogin: true, // 采用登录 (请默认传true，插件内部自动拉流)
-    pluginLoginInfo: AllData.pluginLoginInfo,
-    division: 1, // 默认展示的窗口数量， 必传
-    draggable: false, // 窗口拖拽 【暂不支持】
-    showBar: true, // 底部操作栏， 选传，【true - 显示, false - 隐藏】
-    shieldClass: ['shield-class', 'select'], // 如果DOM元素被插件挡住了，把DOM元素的类名传入。
-    coverShieldClass: [], // 如果插件要在dom内滚动，需要把DOM元素的类名传入，请查看案例-遮挡
-    parentIframeShieldClass: [], // 有 iframe 时，top层 的 dom 元素被插件挡住了，把DOM元素的类名传入。
-    // 下面均为回调函数，请按需使用，具体可在 API 内进行功能的体验和查看。
+  if (dh_video_config.value) {
+    AllData.pluginLoginInfo = convertArrayToObject(dh_video_config.value);
+    console.log('看看顺序', AllData.pluginLoginInfo);
+  } else {
+    desc.value = '获取动态配置失败';
+  }
 
-    // 创建播放器成功回调
-    createSuccess: versionInfo => {
-      // 该回调触发后，我们可以进行实时预览/录像回放等操作
-      // desc.value = '创建成功!!!' + versionInfo.message;
-      console.log('准备进入', AllData.channelId);
-      AllData.Getchajian = 1;
-      startReal();
-    },
-    // 创建播放器失败回调
-    createError: err => {
-      console.log('错误', JSON.stringify(err));
-      // 有错误码，可打印查看错误信息
-      // desc.value = '创建失败!!!' + JSON.stringify(err);
-      AllData.Getchajian = null;
+  nextTick(() => {
+    console.log('初始化视频', AllData.pluginLoginInfo);
+    desc.value = '插件启动中....';
+    AllData.myVideoPlayer = new VideoPlayer({
+      videoId: 'dhplayer-dom', // 唯一标识，必填，不能重复
+      windowType: 0, // 播放器类型，必传， 0 - 实时预览，3 - 录像回放，7- 录像回放（支持倒放）
+      usePluginLogin: true, // 采用登录 (请默认传true，插件内部自动拉流)
+      pluginLoginInfo: AllData.pluginLoginInfo,
+      division: 1, // 默认展示的窗口数量， 必传
+      draggable: false, // 窗口拖拽 【暂不支持】
+      showBar: true, // 底部操作栏， 选传，【true - 显示, false - 隐藏】
+      shieldClass: ['shield-class', 'select'], // 如果DOM元素被插件挡住了，把DOM元素的类名传入。
+      coverShieldClass: [], // 如果插件要在dom内滚动，需要把DOM元素的类名传入，请查看案例-遮挡
+      parentIframeShieldClass: [], // 有 iframe 时，top层 的 dom 元素被插件挡住了，把DOM元素的类名传入。
+      // 下面均为回调函数，请按需使用，具体可在 API 内进行功能的体验和查看。
 
-      GetchajianUrl();
-    },
-    // 插件公共回调
-    dhPlayerMessage: (info, err) => {},
-    // 实时预览成功回调
-    realSuccess: info => {},
-    // 实时预览失败回调
-    realError: (info, err) => {},
-    // 对讲成功回调
-    talkSuccess: info => {},
-    // 对讲失败回调
-    talkError: (info, err) => {},
-    // 录像播放成功回调
-    playbackSuccess: info => {},
-    // 录像播放失败回调
-    playbackError: (info, err) => {},
-    // 录像播放完成回调
-    playbackFinish: info => {},
-    // 抓图成功回调
-    snapshotSuccess: ({ base64Url, path }, info) => {
-      var byteCharacters = atob(base64Url.replace(/^data:image\/(png|jpeg|jpg);base64,/, ''));
-      var byteNumbers = new Array(byteCharacters.length);
-      for (var i = 0; i < byteCharacters.length; i++) {
-        byteNumbers[i] = byteCharacters.charCodeAt(i);
-      }
-      var byteArray = new Uint8Array(byteNumbers);
-      var blob = new Blob([byteArray], {
-        type: undefined,
-      });
-      var aLink = document.createElement('a');
-      let time = proxy.moment(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss');
-      aLink.download = `大华截图-${time}.jpg`; //这里写保存时的图片名称
-      aLink.href = URL.createObjectURL(blob);
-      aLink.click();
-    },
-    // 本地录像下载成功回调
-    videoDownloadSuccess: (path, info) => {
-      alert('本地录像地址：' + path);
-    },
-    // 关闭视频窗口回调
-    closeWindowSuccess: ({ isAll, snum, channelList }) => {},
-    // 鼠标单击窗口回调
-    clickWindow: snum => {},
-    // 鼠标双击窗口回调
-    dbClickWindow: snum => {},
-    // 播放器窗口的数量回调
-    changeDivision: division => {},
-    // rtsp 流下载录像成功回调
-    downloadRecordSuccess: info => {},
-    // rtsp 流下载录像失败回调
-    downloadRecordError: (info, err) => {},
+      // 创建播放器成功回调
+      createSuccess: versionInfo => {
+        // 该回调触发后，我们可以进行实时预览/录像回放等操作
+        // desc.value = '创建成功!!!' + versionInfo.message;
+        AllData.Getchajian = 1;
+        startReal();
+      },
+      // 创建播放器失败回调
+      createError: err => {
+        // 有错误码，可打印查看错误信息
+        // desc.value = '创建失败!!!' + JSON.stringify(err);
+        AllData.Getchajian = null;
+        GetchajianUrl();
+      },
+      // 插件公共回调
+      dhPlayerMessage: (info, err) => {},
+      // 实时预览成功回调
+      realSuccess: info => {},
+      // 实时预览失败回调
+      realError: (info, err) => {},
+      // 对讲成功回调
+      talkSuccess: info => {},
+      // 对讲失败回调
+      talkError: (info, err) => {},
+      // 录像播放成功回调
+      playbackSuccess: info => {},
+      // 录像播放失败回调
+      playbackError: (info, err) => {},
+      // 录像播放完成回调
+      playbackFinish: info => {},
+      // 抓图成功回调
+      snapshotSuccess: ({ base64Url, path }, info) => {
+        var byteCharacters = atob(base64Url.replace(/^data:image\/(png|jpeg|jpg);base64,/, ''));
+        var byteNumbers = new Array(byteCharacters.length);
+        for (var i = 0; i < byteCharacters.length; i++) {
+          byteNumbers[i] = byteCharacters.charCodeAt(i);
+        }
+        var byteArray = new Uint8Array(byteNumbers);
+        var blob = new Blob([byteArray], {
+          type: undefined,
+        });
+        var aLink = document.createElement('a');
+        let time = proxy.moment(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss');
+        aLink.download = `大华截图-${time}.jpg`; //这里写保存时的图片名称
+        aLink.href = URL.createObjectURL(blob);
+        aLink.click();
+      },
+      // 本地录像下载成功回调
+      videoDownloadSuccess: (path, info) => {
+        alert('本地录像地址：' + path);
+      },
+      // 关闭视频窗口回调
+      closeWindowSuccess: ({ isAll, snum, channelList }) => {},
+      // 鼠标单击窗口回调
+      clickWindow: snum => {},
+      // 鼠标双击窗口回调
+      dbClickWindow: snum => {},
+      // 播放器窗口的数量回调
+      changeDivision: division => {},
+      // rtsp 流下载录像成功回调
+      downloadRecordSuccess: info => {},
+      // rtsp 流下载录像失败回调
+      downloadRecordError: (info, err) => {},
+    });
   });
 }
 

diff --git a/src/components/videoDHone/index.vue b/src/components/videoDHone/index.vue
index c4b65e7..a48e4fe 100644
--- a/src/components/videoDHone/index.vue
+++ b/src/components/videoDHone/index.vue
@@ -8,6 +8,7 @@
 import { ref, reactive, toRefs, onMounted, onUnmounted } from 'vue';
 import { listConfig } from '@/api/system/config';
 const { proxy } = getCurrentInstance();
+const { dh_video_config } = proxy.useDict('dh_video_config');
 
 const props = defineProps({
   // 内网、公网 4个配置
@@ -56,89 +57,104 @@
   { deep: true, immediate: true }
 );
 
+function convertArrayToObject(array) {
+  console.log('array', array);
+  const resultObject = {};
+  array.forEach(item => {
+    resultObject[item.label] = item.value;
+  });
+  return resultObject;
+}
+
 // 初始化并登录插件
 function initDHPlayer() {
-  console.log('初始化视频');
-  desc.value = '插件启动中....';
-  AllData.myVideoPlayer = new VideoPlayer({
-    videoId: 'dhplayer-dom', // 唯一标识，必填，不能重复
-    windowType: 0, // 播放器类型，必传， 0 - 实时预览，3 - 录像回放，7- 录像回放（支持倒放）
-    usePluginLogin: true, // 采用登录 (请默认传true，插件内部自动拉流)
-    pluginLoginInfo: AllData.pluginLoginInfo,
-    division: 1, // 默认展示的窗口数量， 必传
-    draggable: false, // 窗口拖拽 【暂不支持】
-    showBar: true, // 底部操作栏， 选传，【true - 显示, false - 隐藏】
-    shieldClass: ['shield-class', 'select'], // 如果DOM元素被插件挡住了，把DOM元素的类名传入。
-    coverShieldClass: [], // 如果插件要在dom内滚动，需要把DOM元素的类名传入，请查看案例-遮挡
-    parentIframeShieldClass: [], // 有 iframe 时，top层 的 dom 元素被插件挡住了，把DOM元素的类名传入。
-    // 下面均为回调函数，请按需使用，具体可在 API 内进行功能的体验和查看。
+  if (dh_video_config.value) {
+    AllData.pluginLoginInfo = convertArrayToObject(dh_video_config.value);
+    console.log('看看顺序', AllData.pluginLoginInfo);
+  } else {
+    desc.value = '获取动态配置失败';
+  }
 
-    // 创建播放器成功回调
-    createSuccess: versionInfo => {
-      // 该回调触发后，我们可以进行实时预览/录像回放等操作
-      // desc.value = '创建成功!!!' + versionInfo.message;
-      console.log('准备进入', AllData.channelId);
-      AllData.Getchajian = 1;
-      startReal();
-    },
-    // 创建播放器失败回调
-    createError: err => {
-      console.log('错误', JSON.stringify(err));
-      // 有错误码，可打印查看错误信息
-      // desc.value = '创建失败!!!' + JSON.stringify(err);
-      AllData.Getchajian = null;
+  nextTick(() => {
+    console.log('初始化视频', AllData.pluginLoginInfo);
+    desc.value = '插件启动中....';
+    AllData.myVideoPlayer = new VideoPlayer({
+      videoId: 'dhplayer-dom', // 唯一标识，必填，不能重复
+      windowType: 0, // 播放器类型，必传， 0 - 实时预览，3 - 录像回放，7- 录像回放（支持倒放）
+      usePluginLogin: true, // 采用登录 (请默认传true，插件内部自动拉流)
+      pluginLoginInfo: AllData.pluginLoginInfo,
+      division: 1, // 默认展示的窗口数量， 必传
+      draggable: false, // 窗口拖拽 【暂不支持】
+      showBar: true, // 底部操作栏， 选传，【true - 显示, false - 隐藏】
+      shieldClass: ['shield-class', 'select'], // 如果DOM元素被插件挡住了，把DOM元素的类名传入。
+      coverShieldClass: [], // 如果插件要在dom内滚动，需要把DOM元素的类名传入，请查看案例-遮挡
+      parentIframeShieldClass: [], // 有 iframe 时，top层 的 dom 元素被插件挡住了，把DOM元素的类名传入。
+      // 下面均为回调函数，请按需使用，具体可在 API 内进行功能的体验和查看。
 
-      GetchajianUrl();
-    },
-    // 插件公共回调
-    dhPlayerMessage: (info, err) => {},
-    // 实时预览成功回调
-    realSuccess: info => {},
-    // 实时预览失败回调
-    realError: (info, err) => {},
-    // 对讲成功回调
-    talkSuccess: info => {},
-    // 对讲失败回调
-    talkError: (info, err) => {},
-    // 录像播放成功回调
-    playbackSuccess: info => {},
-    // 录像播放失败回调
-    playbackError: (info, err) => {},
-    // 录像播放完成回调
-    playbackFinish: info => {},
-    // 抓图成功回调
-    snapshotSuccess: ({ base64Url, path }, info) => {
-      var byteCharacters = atob(base64Url.replace(/^data:image\/(png|jpeg|jpg);base64,/, ''));
-      var byteNumbers = new Array(byteCharacters.length);
-      for (var i = 0; i < byteCharacters.length; i++) {
-        byteNumbers[i] = byteCharacters.charCodeAt(i);
-      }
-      var byteArray = new Uint8Array(byteNumbers);
-      var blob = new Blob([byteArray], {
-        type: undefined,
-      });
-      var aLink = document.createElement('a');
-      let time = proxy.moment(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss');
-      aLink.download = `大华截图-${time}.jpg`; //这里写保存时的图片名称
-      aLink.href = URL.createObjectURL(blob);
-      aLink.click();
-    },
-    // 本地录像下载成功回调
-    videoDownloadSuccess: (path, info) => {
-      alert('本地录像地址：' + path);
-    },
-    // 关闭视频窗口回调
-    closeWindowSuccess: ({ isAll, snum, channelList }) => {},
-    // 鼠标单击窗口回调
-    clickWindow: snum => {},
-    // 鼠标双击窗口回调
-    dbClickWindow: snum => {},
-    // 播放器窗口的数量回调
-    changeDivision: division => {},
-    // rtsp 流下载录像成功回调
-    downloadRecordSuccess: info => {},
-    // rtsp 流下载录像失败回调
-    downloadRecordError: (info, err) => {},
+      // 创建播放器成功回调
+      createSuccess: versionInfo => {
+        // 该回调触发后，我们可以进行实时预览/录像回放等操作
+        // desc.value = '创建成功!!!' + versionInfo.message;
+        AllData.Getchajian = 1;
+        startReal();
+      },
+      // 创建播放器失败回调
+      createError: err => {
+        // 有错误码，可打印查看错误信息
+        // desc.value = '创建失败!!!' + JSON.stringify(err);
+        AllData.Getchajian = null;
+        GetchajianUrl();
+      },
+      // 插件公共回调
+      dhPlayerMessage: (info, err) => {},
+      // 实时预览成功回调
+      realSuccess: info => {},
+      // 实时预览失败回调
+      realError: (info, err) => {},
+      // 对讲成功回调
+      talkSuccess: info => {},
+      // 对讲失败回调
+      talkError: (info, err) => {},
+      // 录像播放成功回调
+      playbackSuccess: info => {},
+      // 录像播放失败回调
+      playbackError: (info, err) => {},
+      // 录像播放完成回调
+      playbackFinish: info => {},
+      // 抓图成功回调
+      snapshotSuccess: ({ base64Url, path }, info) => {
+        var byteCharacters = atob(base64Url.replace(/^data:image\/(png|jpeg|jpg);base64,/, ''));
+        var byteNumbers = new Array(byteCharacters.length);
+        for (var i = 0; i < byteCharacters.length; i++) {
+          byteNumbers[i] = byteCharacters.charCodeAt(i);
+        }
+        var byteArray = new Uint8Array(byteNumbers);
+        var blob = new Blob([byteArray], {
+          type: undefined,
+        });
+        var aLink = document.createElement('a');
+        let time = proxy.moment(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss');
+        aLink.download = `大华截图-${time}.jpg`; //这里写保存时的图片名称
+        aLink.href = URL.createObjectURL(blob);
+        aLink.click();
+      },
+      // 本地录像下载成功回调
+      videoDownloadSuccess: (path, info) => {
+        alert('本地录像地址：' + path);
+      },
+      // 关闭视频窗口回调
+      closeWindowSuccess: ({ isAll, snum, channelList }) => {},
+      // 鼠标单击窗口回调
+      clickWindow: snum => {},
+      // 鼠标双击窗口回调
+      dbClickWindow: snum => {},
+      // 播放器窗口的数量回调
+      changeDivision: division => {},
+      // rtsp 流下载录像成功回调
+      downloadRecordSuccess: info => {},
+      // rtsp 流下载录像失败回调
+      downloadRecordError: (info, err) => {},
+    });
   });
 }
 
diff --git a/src/views/pictureOnMap/page/components/DialogTabs/component/shuikujianceEcharts.vue b/src/views/pictureOnMap/page/components/DialogTabs/component/shuikujianceEcharts.vue
index a61fcdc..b512780 100644
--- a/src/views/pictureOnMap/page/components/DialogTabs/component/shuikujianceEcharts.vue
+++ b/src/views/pictureOnMap/page/components/DialogTabs/component/shuikujianceEcharts.vue
@@ -3,11 +3,11 @@
   <div :id="id" style="width: 100%; height: 100%"></div>
 </template>
 <script setup>
-import { guid } from "@/utils/ruoyi";
-import { nextTick } from "vue";
+import { guid } from '@/utils/ruoyi';
+import { nextTick } from 'vue';
 const id = guid();
-const myChart = shallowRef("");
-import * as echarts from "echarts";
+const myChart = shallowRef('');
+import * as echarts from 'echarts';
 
 const props = defineProps({
   //刷新标志
@@ -32,7 +32,7 @@
   //类型
   typeName: {
     type: String,
-    default: "",
+    default: '',
   },
   yAxisarr: {
     type: Array,
@@ -42,7 +42,7 @@
 
 watch(
   () => props.refresh,
-  (value) => {
+  value => {
     // console.log("???????");
     //先销毁实例
     myChart.value && myChart.value.dispose();
@@ -53,18 +53,8 @@
   }
 );
 function init() {
-  let colorarr = [
-    "#99FF55",
-    "#b14de5",
-    "#FFC155",
-    "#409eff",
-    "#ff7f50",
-    "#ff69b4",
-    "#87ceeb",
-    "#4682b4",
-    "#98fb98",
-  ];
-  let rightnumber = props.yAxisarr.length * "2.5" + "%";
+  let colorarr = ['#99FF55', '#b14de5', '#FFC155', '#409eff', '#ff7f50', '#ff69b4', '#87ceeb', '#4682b4', '#98fb98'];
+  let rightnumber = props.yAxisarr.length * '2.5' + '%';
   let newarr = [];
   let marklinedata = [];
   let maxArr = [];
@@ -74,20 +64,20 @@
       show: false,
       inverse: true, //控制x轴在上方
       name: props.typeName,
-      type: "value",
+      type: 'value',
       axisLabel: {
         show: true,
-        color: "#409eff",
+        color: '#409eff',
       },
       axisLine: {
         lineStyle: {
-          color: "#409eff",
+          color: '#409eff',
         },
       },
       splitLine: {
         show: true,
         lineStyle: {
-          color: "rgba(61,91,98,0.8)",
+          color: 'rgba(61,91,98,0.8)',
         },
       },
       // min: 0,
@@ -138,13 +128,13 @@
     props.yAxisarr.map((item, index) => {
       let arr = [];
       let markLineArr = [];
-      item.cordonLineList.map((p) => {
+      item.cordonLineList.map(p => {
         markLineArr.push(Number(p.lineValue));
         arr.push({
           silent: false, //鼠标悬停事件  true没有，false有
           lineStyle: {
             //警戒线的样式  ，虚实  颜色
-            type: "dashed",
+            type: 'dashed',
             color: p.lineColor,
           },
           name: p.lineName,
@@ -156,8 +146,8 @@
         });
       });
 
-      item["maxValue"] = Math.max.apply(null, [...item.datas, ...markLineArr]);
-      item["minValue"] = Math.min.apply(null, [...item.datas, ...markLineArr]);
+      item['maxValue'] = Math.max.apply(null, [...item.datas, ...markLineArr]);
+      item['minValue'] = Math.min.apply(null, [...item.datas, ...markLineArr]);
 
       marklinedata.push(arr);
     });
@@ -166,7 +156,7 @@
     props.yAxisarr.map((item, index) => {
       let obj = {
         name: item.dataName + item.unit,
-        type: "value",
+        type: 'value',
         axisLabel: {
           show: true,
           color: colorarr[index],
@@ -180,19 +170,19 @@
         splitLine: {
           show: true,
           lineStyle: {
-            color: "rgba(61,91,98,0.8)",
+            color: 'rgba(61,91,98,0.8)',
           },
         },
         min: Math.floor(item.minValue * 0.95),
-        max: item.maxValue,
+        max: Math.floor(item.maxValue * 1.05),
       };
 
       if (index == 0) {
-        obj.position = "left";
+        obj.position = 'left';
       } else if (index == 1) {
-        obj.position = "right";
+        obj.position = 'right';
       } else {
-        obj.position = "right";
+        obj.position = 'right';
         obj.offset = (index - 1.1) * 70;
         // obj.show = false;
       }
@@ -202,13 +192,13 @@
       finxse.push({
         smooth: true, //变为曲线 默认false折线
         name: item.dataName + item.unit,
-        type: "line",
+        type: 'line',
         yAxisIndex: index + 1,
         data: item.datas,
         markLine: {
-          symbol: "none", //去掉警戒线最后面的箭头
+          symbol: 'none', //去掉警戒线最后面的箭头
           label: {
-            position: "middle", //将警示值放在哪个位置，三个值“start”,"middle","end"  开始  中点 结束
+            position: 'middle', //将警示值放在哪个位置，三个值“start”,"middle","end"  开始  中点 结束
           },
           data: marklinedata[index],
         },
@@ -221,16 +211,16 @@
     color: colorarr,
     legend: {
       show: true,
-      orient: "horizontal", //horizontal横向 vertical 纵向
-      type: "scroll",
-      x: "center", //居右显示
-      align: "left", //图例控制在左边
+      orient: 'horizontal', //horizontal横向 vertical 纵向
+      type: 'scroll',
+      x: 'center', //居右显示
+      align: 'left', //图例控制在左边
       // icon: 'circle',
       // itemWidth: 15,
       itemHeight: 15,
       itemHeight: 15,
       textStyle: {
-        color: "auto",
+        color: 'auto',
         rich: {
           another: {
             fontSize: 28,
@@ -240,41 +230,41 @@
       },
     },
     tooltip: {
-      trigger: "axis",
+      trigger: 'axis',
       // formatter: "{b}：{c}件",
       // formatter: "{b}：{c}",
       feature: {
         mark: { show: true },
         dataView: { show: true, readOnly: false },
-        magicType: { show: true, type: ["line", "bar"] },
+        magicType: { show: true, type: ['line', 'bar'] },
         restore: { show: true },
         saveAsImage: { show: true },
       },
       axisPointer: {
-        type: "cross",
+        type: 'cross',
         textStyle: {
-          color: "#fff",
+          color: '#fff',
         },
       },
     },
     grid: {
-      top: "18%",
-      left: "5%",
+      top: '18%',
+      left: '5%',
       right: rightnumber,
       // right: '5%',
-      bottom: "15%",
+      bottom: '15%',
       containLabel: true,
     },
     xAxis: [
       {
-        type: "category",
+        type: 'category',
         data: props.XAxis,
         axisPointer: {
-          type: "shadow",
+          type: 'shadow',
         },
         axisLabel: {
           show: true,
-          color: "#fff",
+          color: '#fff',
         },
         axisLine: {
           lineStyle: {
@@ -292,20 +282,20 @@
         bottom: 18,
         start: 0,
         end: 100,
-        handleSize: "100%",
-        fillerColor: "#94FA41",
-        borderColor: "transparent",
-        backgroundColor: "rgba(148, 250, 65, 0.2)",
+        handleSize: '100%',
+        fillerColor: '#94FA41',
+        borderColor: 'transparent',
+        backgroundColor: 'rgba(148, 250, 65, 0.2)',
         handleStyle: {
-          color: "#94FA41",
+          color: '#94FA41',
         },
         moveHandleSize: 0,
         textStyle: {
-          color: "#fff",
+          color: '#fff',
         },
       },
       {
-        type: "inside",
+        type: 'inside',
         show: true,
         height: 15,
         start: 1,
@@ -326,7 +316,7 @@
 onMounted(() => {
   nextTick(() => {
     init();
-    window.addEventListener("resize", resizeTheChart);
+    window.addEventListener('resize', resizeTheChart);
   });
 });
 </script>