diff --git a/Web/src/views/StatisticsView.vue b/Web/src/views/StatisticsView.vue index af5bf61..4e8bae0 100644 --- a/Web/src/views/StatisticsView.vue +++ b/Web/src/views/StatisticsView.vue @@ -65,11 +65,11 @@

支出分类统计

- {{ expenseCategories.length }}类 + {{ expenseCategoriesView.length }}类
-
+
-
+
@@ -125,17 +126,18 @@
-
+

收入分类统计

- {{ incomeCategories.length }}类 + {{ incomeCategoriesView.length }}类
@@ -155,17 +157,18 @@
-
+

不计收支分类统计

- {{ noneCategories.length }}类 + {{ noneCategoriesView.length }}类
@@ -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;