From 82e5c798689569c1ea135d4a580505f34f9eac02 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AD=99=E8=AF=9A?= <cheng2.sun@ly.com>
Date: Thu, 15 Jan 2026 11:08:52 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=A2=84=E7=AE=97=E8=BF=9B?=
 =?UTF-8?q?=E5=BA=A6=E9=A2=9C=E8=89=B2=E8=AE=A1=E7=AE=97=E9=80=BB=E8=BE=91?=
 =?UTF-8?q?=EF=BC=8C=E6=94=AF=E6=8C=81=E4=B8=8D=E5=90=8C=E7=B1=BB=E5=88=AB?=
 =?UTF-8?q?=E7=9A=84=E6=B8=90=E5=8F=98=E8=89=B2=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Web/src/views/BudgetView.vue | 42 +++++++++++++++++++++++++++++-------
 1 file changed, 34 insertions(+), 8 deletions(-)

diff --git a/Web/src/views/BudgetView.vue b/Web/src/views/BudgetView.vue
index 45251e8..9838cc4 100644
--- a/Web/src/views/BudgetView.vue
+++ b/Web/src/views/BudgetView.vue
@@ -421,16 +421,42 @@ const getProgressColor = (budget) => {
   
   const ratio = Math.min(Math.max(budget.current / budget.limit, 0), 1)
   
-  // Start color (Blue): #1989fa -> rgb(25, 137, 250)
-  // End color (Red): #ee0a24 -> rgb(238, 10, 36)
-  const startColor = { r: 25, g: 137, b: 250 }
-  const endColor = { r: 238, g: 10, b: 36 }
+  let startColor, midColor, endColor
   
-  const r = Math.round(startColor.r + (endColor.r - startColor.r) * ratio)
-  const g = Math.round(startColor.g + (endColor.g - startColor.g) * ratio)
-  const b = Math.round(startColor.b + (endColor.b - startColor.b) * ratio)
+  if (budget.category === BudgetCategory.Expense) {
+    // 支出: 绿 -> 蓝 -> 红
+    startColor = { r: 82, g: 196, b: 26 }      // 绿
+    midColor = { r: 25, g: 137, b: 250 }       // 蓝
+    endColor = { r: 238, g: 10, b: 36 }        // 红
+  } else if (budget.category === BudgetCategory.Income) {
+    // 收入: 红 -> 蓝 -> 绿
+    startColor = { r: 238, g: 10, b: 36 }      // 红
+    midColor = { r: 25, g: 137, b: 250 }       // 蓝
+    endColor = { r: 82, g: 196, b: 26 }        // 绿
+  } else {
+    // 存款: 红 -> 蓝 -> 绿
+    startColor = { r: 238, g: 10, b: 36 }      // 红
+    midColor = { r: 25, g: 137, b: 250 }       // 蓝
+    endColor = { r: 82, g: 196, b: 26 }        // 绿
+  }
   
-  return `linear-gradient(to right, var(--van-primary-color), rgb(${r}, ${g}, ${b}))`
+  let r, g, b
+  
+  if (ratio < 0.5) {
+    // 从start到mid
+    const t = ratio * 2
+    r = Math.round(startColor.r + (midColor.r - startColor.r) * t)
+    g = Math.round(startColor.g + (midColor.g - startColor.g) * t)
+    b = Math.round(startColor.b + (midColor.b - startColor.b) * t)
+  } else {
+    // 从mid到end
+    const t = (ratio - 0.5) * 2
+    r = Math.round(midColor.r + (endColor.r - midColor.r) * t)
+    g = Math.round(midColor.g + (endColor.g - midColor.g) * t)
+    b = Math.round(midColor.b + (endColor.b - midColor.b) * t)
+  }
+  
+  return `rgb(${r}, ${g}, ${b})`
 }
 
 const showArchiveSummary = async () => {