Przeglądaj źródła

[Mod 0000]修复数据中心图表刻度遮挡问题,修改图表相关组件内容

wangkeyi 4 miesięcy temu
rodzic
commit
8e4a6393bf

+ 1 - 1
src/views/vent/dataCenter/infoCenter/index.vue

@@ -259,7 +259,7 @@
         }
         .infoBox2 {
           :deep(.box-container) {
-            padding: 5px 0px 5px 20px !important;
+            padding: 5px 0px 5px 5px !important;
           }
         }
       }

+ 11 - 2
src/views/vent/dataCenter/infoCenter/infoCenter.data.ts

@@ -130,6 +130,9 @@ export const dailyNumOption: ModuleDataChart = {
   type: 'bar',
   readFrom: '',
   legend: { show: false },
+  grid: {
+    left: 100,
+  },
   xAxis: [
     {
       show: true,
@@ -139,14 +142,20 @@ export const dailyNumOption: ModuleDataChart = {
       },
     },
   ],
-  yAxis: [{ show: true, name: '', position: 'left' }],
+  yAxis: [
+    {
+      show: true,
+      name: '',
+      position: 'left',
+    },
+  ],
   series: [{ readFrom: 'collectDataByDayList', xprop: 'day', yprop: 'total_count', label: '' }],
   dataZoom: [
     {
       type: 'slider' as any,
       show: true,
       xAxisIndex: 0,
-      height: 12,
+      height: 10,
       bottom: 10,
       start: 0,
       handleStyle: { color: '#66ffff' },

+ 7 - 0
src/views/vent/deviceManager/configurationTable/types.ts

@@ -305,6 +305,13 @@ export interface ModuleDataChart extends ReadFrom {
     /** y轴的对齐方式 */
     position: 'left' | 'right';
   }[];
+  grid?: {
+    top?: number;
+    bottom?: number;
+    left?: number;
+    right?: number;
+    [key: string]: any;
+  };
   /**
    * 核心配置
    *

+ 11 - 1
src/views/vent/home/configurable/components/detail/CustomChart.vue

@@ -33,7 +33,7 @@
     const inst = getInstance();
     const domWidth = inst ? inst.getWidth() : 500;
     // 依据每一个图表配置生成图表选项
-    const { yAxis = [], xAxis = [], legend, order, type, sortBy, series, dataZoom = [] } = props.chartConfig;
+    const { yAxis = [], xAxis = [], legend, order, type, sortBy, series, dataZoom = [], grid } = props.chartConfig;
     const textStyle = {
       color: '#fff',
     };
@@ -106,6 +106,7 @@
           top: 60,
           right: 37,
           bottom: 30,
+          ...grid,
         },
         dataZoom: [
           {
@@ -512,6 +513,7 @@
           bottom: dataZoom.length ? 80 : 30,
           left: 50, // 缩小左侧边距,增加图表宽度
           right: 50, // 缩小右侧边距
+          ...grid,
         },
         legend: {
           textStyle,
@@ -603,6 +605,7 @@
           top: 40,
           right: 60,
           bottom: dataZoom.length ? 70 : 30,
+          ...grid,
         },
         dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
@@ -651,6 +654,7 @@
           top: 40,
           right: 60,
           bottom: dataZoom.length ? 70 : 30,
+          ...grid,
         },
         dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
@@ -701,6 +705,7 @@
           left: 60,
           right: 60,
           bottom: dataZoom.length ? 70 : 30,
+          ...grid,
         },
         dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
@@ -751,6 +756,7 @@
           top: 50,
           right: 50,
           bottom: dataZoom.length ? 70 : 30,
+          ...grid,
         },
         dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
@@ -817,6 +823,7 @@
           right: 40,
           bottom: dataZoom.length ? 70 : 30,
           show: false,
+          ...grid,
         },
         dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
@@ -854,6 +861,7 @@
         grid: {
           top: 50,
           bottom: 30,
+          ...grid,
         },
         legend: {
           textStyle,
@@ -907,6 +915,7 @@
         grid: {
           top: 40,
           bottom: 30,
+          ...grid,
         },
         legend: {
           textStyle,
@@ -1009,6 +1018,7 @@
         grid: {
           top: 40,
           bottom: 30,
+          ...grid,
         },
         legend: {
           textStyle,