display specific comparison details in the period over period title within the tooltip

This commit is contained in:
MaysWind
2026-04-12 00:52:06 +08:00
parent fb35756601
commit 5d333a4e74
21 changed files with 80 additions and 5 deletions
@@ -20,7 +20,7 @@ import { type NameNumeralValue, itemAndIndex } from '@/core/base.ts';
import { TextDirection } from '@/core/text.ts';
import type { ColorStyleValue } from '@/core/color.ts';
import { ThemeType } from '@/core/theme.ts';
import { AccountBalanceTrendChartType } from '@/core/statistics.ts';
import { AccountBalanceTrendChartType, ChartDateAggregationType } from '@/core/statistics.ts';
import { DEFAULT_CHART_COLORS } from '@/consts/color.ts';
import { isArray } from '@/lib/common.ts';
@@ -241,7 +241,17 @@ const chartOptions = computed<object>(() => {
}
if (periodOverPeriodDataItemDisplayItems && periodOverPeriodDataItemDisplayItems.length) {
tooltip += `<td><span class="ms-5" style="float: inline-end">${tt('Period-over-Period')}</span></td>`;
let periodOverPeriodText = tt('Period-over-Period');
if (props.dateAggregationType === ChartDateAggregationType.Quarter.type) {
periodOverPeriodText = tt('Quarter-over-Quarter');
} else if (props.dateAggregationType === ChartDateAggregationType.Month.type) {
periodOverPeriodText = tt('Month-over-Month');
} else if (props.dateAggregationType === ChartDateAggregationType.Day.type) {
periodOverPeriodText = tt('Day-over-Day');
}
tooltip += `<td><span class="ms-5" style="float: inline-end">${periodOverPeriodText}</span></td>`;
}
tooltip += '</tr>';
+9 -1
View File
@@ -121,7 +121,15 @@ const allTooltipExtraColumnNames = computed<string[]>(() => {
}
if (props.showPeriodOverPeriod) {
extraColumnNames.push(tt('Period-over-Period'));
if (props.dateAggregationType === ChartDateAggregationType.Quarter.type) {
extraColumnNames.push(tt('Quarter-over-Quarter'));
} else if (props.dateAggregationType === ChartDateAggregationType.Month.type) {
extraColumnNames.push(tt('Month-over-Month'));
} else if (props.dateAggregationType === ChartDateAggregationType.Day.type && props.chartMode === 'daily') {
extraColumnNames.push(tt('Day-over-Day'));
} else {
extraColumnNames.push(tt('Period-over-Period'));
}
}
return extraColumnNames;