Преглед изворни кода

[Wip 0000] 可配置首页图表样式调整

houzekong пре 1 година
родитељ
комит
21b4fcd52c

+ 14 - 3
src/views/vent/home/configurable/components/AirVolumeMonitor.vue

@@ -34,7 +34,7 @@
   import CostumeHeader from './CostumeHeader.vue';
   import { RightCircleOutlined } from '@ant-design/icons-vue';
   import Bar from '/@/components/chart/Bar.vue';
-  import { graphic } from 'echarts';
+  import { EChartsOption, graphic } from 'echarts';
   // import MiniBoard from './MiniBoard.vue';
   // import mapComponent from './components/3Dmap/index.vue';
 
@@ -80,7 +80,15 @@
   }
 
   // 图表相关
-  const chartOption = {
+  const chartOption: EChartsOption = {
+    yAxis: {
+      splitLine: {
+        lineStyle: {
+          color: '#ffffff',
+          opacity: 0.3,
+        },
+      },
+    },
     series: [
       {
         name: 'bar',
@@ -92,10 +100,13 @@
           ]),
           borderRadius: [50, 50, 0, 0],
         },
-        barWidth: 30,
+        barWidth: 20,
         data: [],
       },
     ],
+    textStyle: {
+      color: '#fff',
+    },
   };
 
   onMounted(() => {

+ 0 - 1
src/views/vent/home/configurable/components/DeviceWarning.vue

@@ -29,7 +29,6 @@
   import CostumeHeader from './CostumeHeader.vue';
   import { RightCircleOutlined } from '@ant-design/icons-vue';
   // import MiniBoard from './MiniBoard.vue';
-  import { Timeline, TimelineItem } from 'ant-design-vue';
   // import mapComponent from './components/3Dmap/index.vue';
 
   // 设备类别,是个枚举 TODO: 将手动换为自动获取类别

+ 10 - 6
src/views/vent/home/configurable/components/VentilateAnalysis.vue

@@ -33,8 +33,8 @@
   import CostumeHeader from './CostumeHeader.vue';
   import { RightCircleOutlined } from '@ant-design/icons-vue';
   import MiniBoard from './MiniBoard.vue';
-  import Gauge from '/@/components/chart/Gauge.vue';
   import Pie from '/@/components/chart/Pie.vue';
+  import { EChartsOption } from 'echarts';
   // import mapComponent from './components/3Dmap/index.vue';
 
   // 设备类别,是个枚举 TODO: 将手动换为自动获取类别
@@ -79,21 +79,25 @@
   }
 
   // 图标相关
-  const chartOption = {
+  const chartOption: EChartsOption = {
     series: [
       {
         type: 'pie',
         radius: ['50%', '75%'],
         center: ['50%', '55%'],
         data: [],
-        labelLine: { show: true },
+        labelLine: { show: false },
         label: {
-          show: true,
-          formatter: '{b} \n ({d}%)',
-          color: '#B1B9D3',
+          show: false,
+          // formatter: '{b} \n ({d}%)',
+          // color: '#B1B9D3',
+        },
+        itemStyle: {
+          shadowBlur: 10,
         },
       },
     ],
+    color: ['#d9a1ff', '#00d1ff', '#82fe78'],
   };
 
   onMounted(() => {