fix: 统计分析ui进一步功能优化。

src/pages/statistic/accounts/accountDealAnalysis/index.vue

@@ -348,55 +348,70 @@
   })
   
   // 柱状图配置
-  const columnChartOpts = ref({
-    color: ['#667eea'],
-    padding: [20, 30, 50, 5],
-    enableScroll: false,
-    dataLabel: false,
-    legend: {
-      show: false
-    },
-    xAxis: {
-      disableGrid: true,
-      boundaryGap: 'center',
-      axisLine: true,
-      axisLineColor: '#CCCCCC',
-      scrollShow: true,
-      itemCount: 5,
-      fontSize: 10,
-      fontColor: '#999999',
-      rotateLabel: true,
-      rotateAngle: 30
-    },
-    yAxis: {
-      gridType: 'dash',
-      dashLength: 4,
-      gridColor: '#EEEEEE',
-      splitNumber: 5,
-      fontSize: 10,
-      fontColor: '#999999',
-      showXAxisLine: true,
-      format: (val) => {
-        if (val >= 10000) {
-          return (val / 10000).toFixed(1) + 'w'
+  const columnChartOpts = computed(() => {
+    // 计算数据范围以动态设置Y轴
+    let minValue = 0
+    let maxValue = 0
+    if (listData.value && listData.value.length > 0) {
+      const values = listData.value.map(item => parseFloat(item.value) || 0)
+      minValue = Math.min(0, ...values)
+      maxValue = Math.max(0, ...values)
+      // 给最小值和最大值留出20%的空间
+      const range = maxValue - minValue
+      minValue = minValue - range * 0.2
+      maxValue = maxValue + range * 0.2
+    }
+    
+    return {
+      color: ['#667eea'],
+      padding: [15, 15, 80, 15],
+      enableScroll: false,
+      dataLabel: false,
+      legend: {
+        show: false
+      },
+      xAxis: {
+        disableGrid: true,
+        boundaryGap: 'center',
+        axisLine: false,
+        scrollShow: true,
+        itemCount: 5,
+        fontSize: 10,
+        fontColor: '#999999',
+        rotateLabel: true,
+        rotateAngle: 30
+      },
+      yAxis: {
+        gridType: 'dash',
+        dashLength: 4,
+        gridColor: '#EEEEEE',
+        splitNumber: 5,
+        min: minValue,
+        max: maxValue,
+        fontSize: 10,
+        fontColor: '#999999',
+        showTitle: false,
+        disabled: false,
+        format: (val) => {
+          if (val >= 10000) {
+            return (val / 10000).toFixed(1) + 'w'
+          }
+          if (val <= -10000) {
+            return (val / 10000).toFixed(1) + 'w'
+          }
+          return val.toFixed(0)
         }
-        if (val <= -10000) {
-          return (val / 10000).toFixed(1) + 'w'
+      },
+      extra: {
+        column: {
+          type: 'group',
+          width: 20,
+          activeBgColor: '#764ba2',
+          activeBgOpacity: 0.08,
+          linearType: 'none',
+          barBorderCircle: true,
+          seriesGap: 2
         }
-        return val.toFixed(0)
-      }
-    },
-    extra: {
-      column: {
-        type: 'group',
-        width: 20,
-        activeBgColor: '#764ba2',
-        activeBgOpacity: 0.08,
-        linearType: 'custom',
-        barBorderCircle: true,
-        seriesGap: 2,
-        categoryGap: 3,
-        colorStop: 0
       }
     }
   })
@@ -412,24 +427,6 @@
     // 创建副本并反转数组，使时间从前往后排序
     const reversedData = [...listData.value].reverse()
     
-    // 曲线图使用单一数据系列
-    if (viewMode.value === 'line') {
-      return {
-        categories: reversedData.map(item => item.time || ''),
-        series: [
-          {
-            name: '收支金额',
-            data: reversedData.map(item => {
-              const value = parseFloat(item.value)
-              return isNaN(value) ? 0 : value
-            }),
-            color: '#667eea'
-          }
-        ]
-      }
-    }
-    
-    // 柱状图使用单一数据系列，每个柱子根据正负设置颜色
     return {
       categories: reversedData.map(item => item.time || ''),
       series: [
@@ -437,12 +434,12 @@
           name: '收支金额',
           data: reversedData.map(item => {
             const value = parseFloat(item.value)
-            const val = isNaN(value) ? 0 : value
-            return {
-              value: val,
-              color: val < 0 ? '#ef4444' : '#667eea'
-            }
-          })
+            return isNaN(value) ? 0 : value
+          }),
+          color: (value) => {
+            // 负数使用红色，正数使用蓝紫色
+            return value < 0 ? '#ef4444' : '#667eea'
+          }
         }
       ]
     }
@@ -669,13 +666,13 @@ function searchSubmit() {
   
   .chart-container {
     margin: 16rpx 24rpx 160rpx;
-    padding: 16rpx 16rpx 0;
+    padding: 16rpx;
     background: linear-gradient(135deg, #ffffff 0%, #f8f9fb 100%);
     border-radius: 16rpx;
     box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
     width: calc(100% - 48rpx);
-    height: 600rpx;
-    overflow: hidden;
+    height: 850rpx;
+    overflow: visible;
     position: relative;
   }