feat: 仪表盘新增收入分类饼图并拆分收支支付方式占比

- 仪表盘新增「收入分类占比」饼图，支付方式拆分为支出、收入两张饼图
- 支付方式标签按当前语言本地化，仅统计对应方向的记录
- 收支记录中不计入统计的记录整行加删除线（类型、金额列除外）
- 补充中/英/日三语文案

frontend/src/views/Dashboard.vue

@@ -120,7 +120,9 @@ const categoryData = ref<any[]>([]) // 分类分组数据
 const paymentData = ref<any[]>([]) // 支付方式分组数据
 
 const pieOption = ref({}) // 支出分类饼图
-const paymentOption = ref({}) // 支付方式饼图
+const incomePieOption = ref({}) // 收入分类饼图
+const paymentOption = ref({}) // 支出支付方式饼图
+const incomePaymentOption = ref({}) // 收入支付方式饼图
 const trendOption = ref({}) // 趋势柱状图
 
 const pad = (n: number) => String(n).padStart(2, '0')
@@ -208,16 +210,52 @@ function updatePieChart() {
   }
 }
 
-/** 更新支付方式分布饼图 */
-function updatePaymentChart() {
-  paymentOption.value = {
-    title: { text: t('dashboard.paymentPie'), left: 'center' },
+/** 更新收入分类饼图 */
+function updateIncomePieChart() {
+  incomePieOption.value = {
+    title: { text: t('dashboard.incomeCategoryPie'), left: 'center' },
     tooltip: { trigger: 'item', formatter: '{b}: {c} ({d}%)' },
     series: [
       {
         type: 'pie',
         radius: ['40%', '70%'],
-        data: paymentData.value.map((p: any) => ({ name: p.name, value: Number(p.total) })),
+        data: categoryData.value
+          .filter((c: any) => c.type === 'INCOME')
+          .map((c: any) => ({ name: c.name, value: Number(c.total) })),
+      },
+    ],
+  }
+}
+
+/** 更新支出支付方式占比饼图：仅统计支出，标签按当前语言本地化 */
+function updatePaymentChart() {
+  paymentOption.value = {
+    title: { text: t('dashboard.expensePaymentPie'), left: 'center' },
+    tooltip: { trigger: 'item', formatter: '{b}: {c} ({d}%)' },
+    series: [
+      {
+        type: 'pie',
+        radius: ['40%', '70%'],
+        data: paymentData.value
+          .filter((p: any) => Number(p.expense) > 0)
+          .map((p: any) => ({ name: getPaymentLabel(p.key), value: Number(p.expense) })),
+      },
+    ],
+  }
+}
+
+/** 更新收入支付方式占比饼图：仅统计收入，标签按当前语言本地化 */
+function updateIncomePaymentChart() {
+  incomePaymentOption.value = {
+    title: { text: t('dashboard.incomePaymentPie'), left: 'center' },
+    tooltip: { trigger: 'item', formatter: '{b}: {c} ({d}%)' },
+    series: [
+      {
+        type: 'pie',
+        radius: ['40%', '70%'],
+        data: paymentData.value
+          .filter((p: any) => Number(p.income) > 0)
+          .map((p: any) => ({ name: getPaymentLabel(p.key), value: Number(p.income) })),
       },
     ],
   }
@@ -263,7 +301,9 @@ async function fetchData() {
     categoryData.value = categoryRes.data
     paymentData.value = paymentRes.data
     updatePieChart()
+    updateIncomePieChart()
     updatePaymentChart()
+    updateIncomePaymentChart()
     updateTrendChart()
   } catch (e: any) {
     console.error('加载统计数据失败', e)
@@ -362,7 +402,9 @@ watch([rangeType, customRange, granularity, filterStatsScope, filterType, filter
 // 语言切换时重绘图表，更新标题与图例文案
 watch(locale, () => {
   updatePieChart()
+  updateIncomePieChart()
   updatePaymentChart()
+  updateIncomePaymentChart()
   updateTrendChart()
 })
 
@@ -527,18 +569,28 @@ onMounted(async () => {
       <VChart :option="trendOption" style="height: 350px;" autoresize />
     </NCard>
 
-    <!-- 饼图区域：支出分类 + 支付方式 -->
+    <!-- 饼图区域：支出/收入分类占比 + 支出/收入支付方式占比 -->
     <NGrid :cols="2" :x-gap="16" :y-gap="16">
       <NGridItem>
         <NCard>
           <VChart :option="pieOption" style="height: 350px;" autoresize />
         </NCard>
       </NGridItem>
+      <NGridItem>
+        <NCard>
+          <VChart :option="incomePieOption" style="height: 350px;" autoresize />
+        </NCard>
+      </NGridItem>
       <NGridItem>
         <NCard>
           <VChart :option="paymentOption" style="height: 350px;" autoresize />
         </NCard>
       </NGridItem>
+      <NGridItem>
+        <NCard>
+          <VChart :option="incomePaymentOption" style="height: 350px;" autoresize />
+        </NCard>
+      </NGridItem>
     </NGrid>
   </div>
 </template>