refactor(largeScreen): 优化现金流报表样式

- 调整 legend 位置和样式
- 优化 tooltip 内容和格式
- 调整图表布局和样式

src/views/largeScreen/components/optionList.ts

@@ -696,23 +696,29 @@ export const getInventoryOption = () => {
 };
 export const getBarOptions = (data: any) => {
   const option = {
-
-    legend: {
-      show: true,
-      top: '50%',
-    },
     backgroundColor: '',
     grid: {
       left: '8%',
-      top: '4%',
+      top: '10%',          // 顶部留一点空间给 legend
       bottom: '8%',
       right: '2%'
     },
+    legend: {
+      data: ['现金流入', '现金流出'],   // 与 series.name 对应
+      top: '0%',
+      textStyle: { color: '#fff', fontSize: 12 }
+    },
     tooltip: {
       show: true,
       backgroundColor: '',
       trigger: 'axis',
-      formatter: '{b0}：{c0}万元',
+      // formatter: '{b0}：{c0}万元',
+      formatter: (params: any) => {
+        // params 是数组，对应每条柱子
+        return params
+          .map((p: any) => `${p.seriesName}：${p.value} 万元`)
+          .join('<br/>');
+      },
       textStyle: {
         color: '#fff'
       },
@@ -788,6 +794,7 @@ export const getBarOptions = (data: any) => {
     // ],
     series: [
       {
+        name: '现金流入',
         type: 'bar',
         data: data.value[0],
         // stack: '合并',
@@ -826,6 +833,7 @@ export const getBarOptions = (data: any) => {
         }
       },
       {
+        name: '现金流出',
         type: 'bar',
         data: data.value[1],
         // stack: '合并',
@@ -859,8 +867,8 @@ export const getBarOptions = (data: any) => {
           formatter: '{c}',
           position: 'top',
           color: '#fff',
-          fontSize: 10
-          // padding: 5
+          fontSize: 10,
+          padding: 5
         }
       }
     ]
@@ -888,7 +896,9 @@ export const getBarOptions2 = (data: any) => {
       }
     },
     tooltip: {
-      trigger: 'item'
+      trigger: 'item',
+      show: true
+
     },
     legend: {
       top: '5%',