fix

Web/src/views/StatisticsView.vue

@@ -65,11 +65,11 @@
         <div class="common-card">
           <div class="card-header">
             <h3 class="card-title">支出分类统计</h3>
-            <van-tag type="primary" size="medium">{{ expenseCategories.length }}类</van-tag>
+            <van-tag type="primary" size="medium">{{ expenseCategoriesView.length }}类</van-tag>
           </div>
           
           <!-- 环形图区域 -->
-          <div class="chart-container" v-if="expenseCategories.length > 0">
+          <div class="chart-container" v-if="expenseCategoriesView.length > 0">
             <div class="ring-chart">
               <svg viewBox="0 0 200 200" class="ring-svg">
                 <circle 
@@ -95,11 +95,12 @@
           </div>
 
           <!-- 分类列表 -->
-          <div class="category-list" v-if="expenseCategories.length > 0">
+          <div class="category-list" v-if="expenseCategoriesView.length > 0">
             <div 
-              v-for="(category) in expenseCategories" 
+              v-for="(category) in expenseCategoriesView" 
               :key="category.classify"
               class="category-item clickable"
+              :class="{ 'highlighted': category._highlighted }"
               @click="goToCategoryBills(category.classify, 0)"
             >
               <div class="category-info">
@@ -125,17 +126,18 @@
         </div>
 
         <!-- 收入分类统计 -->
-        <div class="common-card" v-if="incomeCategories.length > 0">
+        <div class="common-card" v-if="incomeCategoriesView.length > 0">
           <div class="card-header">
             <h3 class="card-title">收入分类统计</h3>
-            <van-tag type="success" size="medium">{{ incomeCategories.length }}类</van-tag>
+            <van-tag type="success" size="medium">{{ incomeCategoriesView.length }}类</van-tag>
           </div>
           
           <div class="category-list">
             <div 
-              v-for="category in incomeCategories" 
+              v-for="category in incomeCategoriesView" 
               :key="category.classify"
               class="category-item clickable"
+              :class="{ 'highlighted': category._highlighted }"
               @click="goToCategoryBills(category.classify, 1)"
             >
               <div class="category-info">
@@ -155,17 +157,18 @@
         </div>
 
         <!-- 不计收支分类统计 -->
-        <div class="common-card" v-if="noneCategories.length > 0">
+        <div class="common-card" v-if="noneCategoriesView.length > 0">
           <div class="card-header">
             <h3 class="card-title">不计收支分类统计</h3>
-            <van-tag type="info" size="medium">{{ noneCategories.length }}类</van-tag>
+            <van-tag type="info" size="medium">{{ noneCategoriesView.length }}类</van-tag>
           </div>
           
           <div class="category-list">
             <div 
-              v-for="category in noneCategories" 
+              v-for="category in noneCategoriesView" 
               :key="category.classify"
               class="category-item clickable"
+              :class="{ 'highlighted': category._highlighted }"
               @click="goToCategoryBills(category.classify, 2)"
             >
               <div class="category-info">
@@ -369,6 +372,39 @@ const expenseCategories = ref([])
 const incomeCategories = ref([])
 const noneCategories = ref([])
 
+const expenseCategoriesView = computed(() => {
+  const sorted = [...expenseCategories.value]
+  const unclassifiedIndex = sorted.findIndex(c => !c.classify)
+  if (unclassifiedIndex !== -1) {
+    const [unclassified] = sorted.splice(unclassifiedIndex, 1)
+    unclassified._highlighted = true
+    sorted.unshift(unclassified)
+  }
+  return sorted
+})
+
+const incomeCategoriesView = computed(() => {
+  const sorted = [...incomeCategories.value]
+  const unclassifiedIndex = sorted.findIndex(c => !c.classify)
+  if (unclassifiedIndex !== -1) {
+    const [unclassified] = sorted.splice(unclassifiedIndex, 1)
+    unclassified._highlighted = true
+    sorted.unshift(unclassified)
+  }
+  return sorted
+})
+
+const noneCategoriesView = computed(() => {
+  const sorted = [...noneCategories.value]
+  const unclassifiedIndex = sorted.findIndex(c => !c.classify)
+  if (unclassifiedIndex !== -1) {
+    const [unclassified] = sorted.splice(unclassifiedIndex, 1)
+    unclassified._highlighted = true
+    sorted.unshift(unclassified)
+  }
+  return sorted
+})
+
 // 趋势数据
 const trendData = ref([])
 
@@ -1066,6 +1102,13 @@ onBeforeUnmount(() => {
   background-color: #ff6b6b;
 }
 
+.category-item.highlighted {
+  background-color: var(--van-primary-color);
+  opacity: 0.1;
+  border-left: 3px solid var(--van-primary-color);
+  padding-left: 9px;
+}
+
 /* 趋势图 */
 .trend-chart {
   padding: 20px 16px;