code refactor

This commit is contained in:
MaysWind
2025-08-30 00:38:45 +08:00
parent 32cf41a7a0
commit 4d0e376568
16 changed files with 126 additions and 120 deletions
@@ -8,9 +8,11 @@ import { type TransactionStatisticsFilter, useStatisticsStore } from '@/stores/s
import type { TypeAndDisplayName } from '@/core/base.ts';
import { type LocalizedDateRange, type WeekDayValue, DateRangeScene, DateRange } from '@/core/datetime.ts';
import type { ColorStyleValue } from '@/core/color.ts';
import { StatisticsAnalysisType, ChartDataType, ChartSortingType, ChartDateAggregationType } from '@/core/statistics.ts';
import { DEFAULT_ACCOUNT_COLOR, DEFAULT_CATEGORY_COLOR } from '@/consts/color.ts';
import { DISPLAY_HIDDEN_AMOUNT } from '@/consts/numeral.ts';
import type {
TransactionCategoricalAnalysisData,
TransactionCategoricalAnalysisDataItem,
@@ -19,6 +21,7 @@ import type {
import { limitText, findNameByType, findDisplayNameByType } from '@/lib/common.ts';
import { getYearMonthFirstUnixTime, getYearMonthLastUnixTime } from '@/lib/datetime.ts';
import { getDisplayColor, getCategoryDisplayColor, getAccountDisplayColor } from '@/lib/color.ts';
export function useStatisticsTransactionPageBase() {
const {
@@ -205,21 +208,13 @@ export function useStatisticsTransactionPageBase() {
}
}
function getTransactionCategoricalAnalysisDataItemColor(item: TransactionCategoricalAnalysisDataItem): string {
function getTransactionCategoricalAnalysisDataItemDisplayColor(item: TransactionCategoricalAnalysisDataItem): ColorStyleValue {
if (item.type === 'category') {
if (item.color === DEFAULT_CATEGORY_COLOR) {
return 'var(--default-icon-color)';
} else {
return '#' + item.color;
}
return getCategoryDisplayColor(item.color);
} else if (item.type === 'account') {
if (item.color === DEFAULT_ACCOUNT_COLOR) {
return 'var(--default-icon-color)';
} else {
return '#' + item.color;
}
return getAccountDisplayColor(item.color);
} else {
return item.color;
return getDisplayColor(item.color);
}
}
@@ -272,7 +267,7 @@ export function useStatisticsTransactionPageBase() {
trendsAnalysisData,
// functions
canShowCustomDateRange,
getTransactionCategoricalAnalysisDataItemColor,
getTransactionCategoricalAnalysisDataItemDisplayColor,
getDisplayAmount
};
}
@@ -244,7 +244,7 @@
<span class="statistics-amount">{{ getDisplayAmount(item.totalAmount, defaultCurrency) }}</span>
</div>
<div>
<v-progress-linear :color="item.color ? getTransactionCategoricalAnalysisDataItemColor(item) : 'primary'"
<v-progress-linear :color="item.color ? getTransactionCategoricalAnalysisDataItemDisplayColor(item) : 'primary'"
:bg-color="isDarkMode ? '#444444' : '#f8f8f8'" :bg-opacity="1"
:model-value="item.percent >= 0 ? item.percent : 0"
:height="4"></v-progress-linear>
@@ -458,7 +458,7 @@ const {
categoricalAnalysisData,
trendsAnalysisData,
canShowCustomDateRange,
getTransactionCategoricalAnalysisDataItemColor,
getTransactionCategoricalAnalysisDataItemDisplayColor,
getDisplayAmount
} = useStatisticsTransactionPageBase();
@@ -182,7 +182,7 @@
<template #inner-end>
<div class="statistics-item-end">
<div class="statistics-percent-line">
<f7-progressbar :progress="item.percent >= 0 ? item.percent : 0" :style="{ '--f7-progressbar-progress-color': (item.color ? getTransactionCategoricalAnalysisDataItemColor(item) : '') } "></f7-progressbar>
<f7-progressbar :progress="item.percent >= 0 ? item.percent : 0" :style="{ '--f7-progressbar-progress-color': (item.color ? getTransactionCategoricalAnalysisDataItemDisplayColor(item) : '') } "></f7-progressbar>
</div>
</div>
</template>
@@ -404,7 +404,7 @@ const {
categoricalAnalysisData,
trendsAnalysisData,
canShowCustomDateRange,
getTransactionCategoricalAnalysisDataItemColor,
getTransactionCategoricalAnalysisDataItemDisplayColor,
getDisplayAmount
} = useStatisticsTransactionPageBase();