mirror/ezbookkeeping
1
0
Fork 0
mirror of https://github.com/mayswind/ezbookkeeping.git synced 2026-05-19 17:24:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

add explicit type for string-based datetimes, replacing third-party datetime type with internal DateTime type

Browse Source
This commit is contained in:
MaysWind
2025-08-25 00:31:30 +08:00
parent f196ce969b
commit 25681f622d
35 changed files with 423 additions and 404 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/base/accounts/ReconciliationStatementPageBase.ts
+4 -6
View File
@@ -23,9 +23,8 @@ import { replaceAll } from '@/lib/common.ts';
import {
getUtcOffsetByUtcOffsetMinutes,
getTimezoneOffsetMinutes,
parseDateFromUnixTime,
formatUnixTime,
getUnixTime
parseDateTimeFromUnixTime,
formatUnixTime
} from '@/lib/datetime.ts';
export function useReconciliationStatementPageBase() {
@@ -132,8 +131,7 @@ export function useReconciliationStatementPageBase() {
}
function getDisplayDateTime(transaction: TransactionReconciliationStatementResponseItem): string {
const transactionTime = getUnixTime(parseDateFromUnixTime(transaction.time, transaction.utcOffset, currentTimezoneOffsetMinutes.value));
return formatUnixTimeToLongDateTime(transactionTime);
return formatUnixTimeToLongDateTime(transaction.time, transaction.utcOffset, currentTimezoneOffsetMinutes.value);
}
function getDisplayDate(transaction: TransactionReconciliationStatementResponseItem): string {
@@ -210,7 +208,7 @@ export function useReconciliationStatementPageBase() {
const transactions = reconciliationStatements.value?.transactions ?? [];
const rows = transactions.map(transaction => {
const transactionTime = getUnixTime(parseDateFromUnixTime(transaction.time, transaction.utcOffset, currentTimezoneOffsetMinutes.value));
const transactionTime = parseDateTimeFromUnixTime(transaction.time, transaction.utcOffset, currentTimezoneOffsetMinutes.value).getUnixTime();
const type = getDisplayTransactionType(transaction);
let categoryName = allCategoriesMap.value[transaction.categoryId]?.name || '';
let displayAmount = formatAmountToWesternArabicNumeralsWithoutDigitGrouping(transaction.sourceAmount);
src/views/base/transactions/TransactionListPageBase.ts
+15 -20
View File
@@ -10,7 +10,7 @@ import { useTransactionTagsStore } from '@/stores/transactionTag.ts';
import { type TransactionListFilter, type TransactionMonthList, useTransactionsStore } from '@/stores/transaction.ts';
import type { TypeAndName } from '@/core/base.ts';
import { type LocalizedDateRange, type WeekDayValue, DateRange, DateRangeScene } from '@/core/datetime.ts';
import { type TextualYearMonthDay, type Year0BasedMonth, type LocalizedDateRange, type WeekDayValue, DateRange, DateRangeScene } from '@/core/datetime.ts';
import { AccountType } from '@/core/account.ts';
import { TransactionType } from '@/core/transaction.ts';
import { DISPLAY_HIDDEN_AMOUNT, INCOMPLETE_AMOUNT_SUFFIX } from '@/consts/numeral.ts';
@@ -28,14 +28,10 @@ import {
getLocalDatetimeFromUnixTime,
getActualUnixTimeForStore,
getDummyUnixTimeForLocalUsage,
getCurrentYearAndMonth,
parseDateFromUnixTime,
getYearAndMonth,
getYear,
getMonth,
getCurrentDateTime,
parseDateTimeFromUnixTime,
getYearMonthFirstUnixTime,
getDay,
getUnixTime,
getUnixTimeFromLocalDatetime,
isDateRangeMatchOneMonth
} from '@/lib/datetime.ts';
@@ -99,7 +95,7 @@ export function useTransactionListPageBase() {
const loading = ref<boolean>(true);
const customMinDatetime = ref<number>(0);
const customMaxDatetime = ref<number>(0);
const currentCalendarDate = ref<string>('');
const currentCalendarDate = ref<TextualYearMonthDay | ''>('');
const currentTimezoneOffsetMinutes = computed<number>(() => getTimezoneOffsetMinutes(settingsStore.appSettings.timeZone));
const firstDayOfWeek = computed<WeekDayValue>(() => userStore.currentUserFirstDayOfWeek);
@@ -175,12 +171,12 @@ export function useTransactionListPageBase() {
const queryMinTime = computed<string>(() => formatUnixTimeToLongDateTime(query.value.minTime));
const queryMaxTime = computed<string>(() => formatUnixTimeToLongDateTime(query.value.maxTime));
const queryMonthlyData = computed<boolean>(() => isDateRangeMatchOneMonth(query.value.minTime, query.value.maxTime));
const queryMonth = computed<string>(() => {
const queryMonth = computed<Year0BasedMonth>(() => {
if (!query.value.minTime || !query.value.maxTime) {
return getCurrentYearAndMonth();
return getCurrentDateTime().toGregorianCalendarYear0BasedMonth();
}
return getYearAndMonth(parseDateFromUnixTime(query.value.minTime));
return parseDateTimeFromUnixTime(query.value.minTime).toGregorianCalendarYear0BasedMonth();
});
const queryAllFilterCategoryIds = computed<Record<string, boolean>>(() => transactionsStore.allFilterCategoryIds);
@@ -248,9 +244,9 @@ export function useTransactionListPageBase() {
return null;
}
const currentMonthMinDate = parseDateFromUnixTime(query.value.minTime);
const currentYear = getYear(currentMonthMinDate);
const currentMonth = getMonth(currentMonthMinDate);
const currentMonthMinDate = parseDateTimeFromUnixTime(query.value.minTime);
const currentYear = currentMonthMinDate.getGregorianCalendarYear();
const currentMonth = currentMonthMinDate.getGregorianCalendarMonth();
for (let i = 0; i < allTransactions.length; i++) {
if (allTransactions[i].year === currentYear && allTransactions[i].month === currentMonth) {
@@ -262,8 +258,8 @@ export function useTransactionListPageBase() {
});
function noTransactionInMonthDay(date: Date): boolean {
const dateTime = parseDateFromUnixTime(getActualUnixTimeForStore(getUnixTime(date), getTimezoneOffsetMinutes(), getBrowserTimezoneOffsetMinutes()));
return !currentMonthTransactionData.value || !currentMonthTransactionData.value.dailyTotalAmounts || !currentMonthTransactionData.value.dailyTotalAmounts[getDay(dateTime)];
const dateTime = parseDateTimeFromUnixTime(getActualUnixTimeForStore(getUnixTimeFromLocalDatetime(date), getTimezoneOffsetMinutes(), getBrowserTimezoneOffsetMinutes()));
return !currentMonthTransactionData.value || !currentMonthTransactionData.value.dailyTotalAmounts || !currentMonthTransactionData.value.dailyTotalAmounts[dateTime.getGregorianCalendarDay()];
}
const canAddTransaction = computed<boolean>(() => {
@@ -291,12 +287,11 @@ export function useTransactionListPageBase() {
}
function getDisplayLongDate(transaction: Transaction): string {
const transactionTime = getUnixTime(parseDateFromUnixTime(transaction.time, transaction.utcOffset, currentTimezoneOffsetMinutes.value));
return formatUnixTimeToLongDate(transactionTime);
return formatUnixTimeToLongDate(transaction.time, transaction.utcOffset, currentTimezoneOffsetMinutes.value);
}
function getDisplayLongYearMonth(transactionMonthList: TransactionMonthList): string {
return formatUnixTimeToLongYearMonth(getYearMonthFirstUnixTime(transactionMonthList.yearMonth));
return formatUnixTimeToLongYearMonth(getYearMonthFirstUnixTime(transactionMonthList.yearDashMonth));
}
function getDisplayTimezone(transaction: Transaction): string {
src/views/desktop/overview/cards/MonthlyIncomeAndExpenseCard.vue
+2 -5
View File
@@ -41,10 +41,7 @@ import { DISPLAY_HIDDEN_AMOUNT, INCOMPLETE_AMOUNT_SUFFIX } from '@/consts/numera
import { type TransactionMonthlyIncomeAndExpenseData } from '@/models/transaction.ts';
import {
parseDateFromUnixTime,
getMonthName
} from '@/lib/datetime.ts';
import { parseDateTimeFromUnixTime } from '@/lib/datetime.ts';
import { getExpenseAndIncomeAmountColor } from '@/lib/ui/common.ts';
export interface MonthlyIncomeAndExpenseCardClickEvent {
@@ -100,7 +97,7 @@ const chartOptions = computed<object>(() => {
if (props.data) {
for (let i = 0; i < props.data.length; i++) {
const item = props.data[i];
const month = getMonthName(parseDateFromUnixTime(item.monthStartTime));
const month = parseDateTimeFromUnixTime(item.monthStartTime).getGregorianCalendarMonthName();
monthNames.push(getMonthShortName(month));
incomeAmounts.push(item.incomeAmount);
src/views/desktop/statistics/TransactionPage.vue
+11 -11
View File
@@ -358,7 +358,7 @@ import { useTransactionCategoriesStore } from '@/stores/transactionCategory.ts';
import { type TransactionStatisticsPartialFilter, useStatisticsStore } from '@/stores/statistics.ts';
import type { TypeAndDisplayName } from '@/core/base.ts';
import { type TimeRangeAndDateType, DateRangeScene, DateRange } from '@/core/datetime.ts';
import { type TextualYearMonth, type TimeRangeAndDateType, DateRangeScene, DateRange } from '@/core/datetime.ts';
import { ThemeType } from '@/core/theme.ts';
import {
StatisticsAnalysisType,
@@ -375,7 +375,7 @@ import {
arrayItemToObjectField
} from '@/lib/common.ts';
import {
getYearAndMonthFromUnixTime,
getGregorianCalendarYearAndMonthFromUnixTime,
getYearMonthFirstUnixTime,
getYearMonthLastUnixTime,
getShiftedDateRangeAndDateType,
@@ -407,8 +407,8 @@ interface TransactionStatisticsProps {
initChartDataType?: string,
initChartType?: string,
initChartDateType?: string,
initStartTime?: string,
initEndTime?: string,
initStartTime?: TextualYearMonth | '',
initEndTime?: TextualYearMonth | '',
initFilterAccountIds?: string,
initFilterCategoryIds?: string,
initTagIds?: string,
@@ -814,8 +814,8 @@ function setDateFilter(dateType: number): void {
} else if (analysisType.value === StatisticsAnalysisType.TrendAnalysis) {
changed = statisticsStore.updateTransactionStatisticsFilter({
trendChartDateType: dateRange.dateType,
trendChartStartYearMonth: getYearAndMonthFromUnixTime(dateRange.minTime),
trendChartEndYearMonth: getYearAndMonthFromUnixTime(dateRange.maxTime)
trendChartStartYearMonth: getGregorianCalendarYearAndMonthFromUnixTime(dateRange.minTime),
trendChartEndYearMonth: getGregorianCalendarYearAndMonthFromUnixTime(dateRange.maxTime)
});
}
@@ -826,7 +826,7 @@ function setDateFilter(dateType: number): void {
}
}
function setCustomDateFilter(startTime: number | string, endTime: number | string): void {
function setCustomDateFilter(startTime: number | TextualYearMonth, endTime: number | TextualYearMonth): void {
if (!startTime || !endTime) {
return;
}
@@ -882,8 +882,8 @@ function shiftDateRange(scale: number): void {
changed = statisticsStore.updateTransactionStatisticsFilter({
trendChartDateType: newDateRange.dateType,
trendChartStartYearMonth: getYearAndMonthFromUnixTime(newDateRange.minTime),
trendChartEndYearMonth: getYearAndMonthFromUnixTime(newDateRange.maxTime)
trendChartStartYearMonth: getGregorianCalendarYearAndMonthFromUnixTime(newDateRange.minTime),
trendChartEndYearMonth: getGregorianCalendarYearAndMonthFromUnixTime(newDateRange.maxTime)
});
}
@@ -992,8 +992,8 @@ onBeforeRouteUpdate((to) => {
initChartDataType: (to.query['chartDataType'] as string | null) || undefined,
initChartType: (to.query['chartType'] as string | null) || undefined,
initChartDateType: (to.query['chartDateType'] as string | null) || undefined,
initStartTime: (to.query['startTime'] as string | null) || undefined,
initEndTime: (to.query['endTime'] as string | null) || undefined,
initStartTime: (to.query['startTime'] as TextualYearMonth | null) || undefined,
initEndTime: (to.query['endTime'] as TextualYearMonth | null) || undefined,
initFilterAccountIds: (to.query['filterAccountIds'] as string | null) || undefined,
initFilterCategoryIds: (to.query['filterCategoryIds'] as string | null) || undefined,
initTagIds: (to.query['tagIds'] as string | null) || undefined,
src/views/desktop/transactions/ListPage.vue
+11 -12
View File
@@ -165,7 +165,7 @@
</v-card-text>
<v-card-text class="transaction-calendar-container pt-0" v-if="pageType === TransactionListPageType.Calendar.type">
<vue-date-picker inline auto-apply model-type="yyyy-M-d"
<vue-date-picker inline auto-apply model-type="yyyy-MM-dd"
month-name-format="long"
:config="{ noSwipe: true }"
:readonly="loading"
@@ -545,13 +545,13 @@
:class="{ 'disabled': loading, 'has-bottom-border': idx < transactions.length - 1 }"
v-for="(transaction, idx) in transactions">
<tr class="transaction-list-row-date no-hover text-sm"
v-if="pageType === TransactionListPageType.List.type && (idx === 0 || (idx > 0 && (transaction.date !== transactions[idx - 1].date)))">
v-if="pageType === TransactionListPageType.List.type && (idx === 0 || (idx > 0 && (transaction.gregorianCalendarYearDashMonthDashDay !== transactions[idx - 1].gregorianCalendarYearDashMonthDashDay)))">
<td :colspan="showTagInTransactionListPage ? 6 : 5" class="font-weight-bold">
<div class="d-flex align-center">
<span>{{ getDisplayLongDate(transaction) }}</span>
<v-chip class="ms-1" color="default" size="x-small"
v-if="transaction.dayOfWeek">
{{ getWeekdayLongName(transaction.dayOfWeek) }}
v-if="transaction.displayDayOfWeek">
{{ getWeekdayLongName(transaction.displayDayOfWeek) }}
</v-chip>
</div>
</td>
@@ -689,6 +689,7 @@ import { useDesktopPageStore } from '@/stores/desktopPage.ts';
import type { TypeAndDisplayName } from '@/core/base.ts';
import {
type Year0BasedMonth,
type LocalizedRecentMonthDateRange,
type TimeRangeAndDateType,
DateRangeScene,
@@ -710,9 +711,7 @@ import {
} from '@/lib/common.ts';
import {
getCurrentUnixTime,
parseDateFromUnixTime,
getYear,
getMonth,
parseDateTimeFromUnixTime,
getBrowserTimezoneOffsetMinutes,
getActualUnixTimeForStore,
getDayFirstUnixTimeBySpecifiedUnixTime,
@@ -960,7 +959,7 @@ const transactions = computed<Transaction[]>(() => {
for (let i = 0; i < transactionData.items.length; i++) {
const transaction = transactionData.items[i];
if (transaction.date === currentCalendarDate.value) {
if (transaction.gregorianCalendarYearDashMonthDashDay === currentCalendarDate.value) {
transactions.push(transaction);
}
}
@@ -1208,9 +1207,9 @@ function reload(force: boolean, init: boolean): void {
}
if (queryMonthlyData.value) {
const currentMonthMinDate = parseDateFromUnixTime(query.value.minTime);
const currentYear = getYear(currentMonthMinDate);
const currentMonth = getMonth(currentMonthMinDate);
const currentMonthMinDate = parseDateTimeFromUnixTime(query.value.minTime);
const currentYear = currentMonthMinDate.getGregorianCalendarYear();
const currentMonth = currentMonthMinDate.getGregorianCalendarMonth();
return transactionsStore.loadMonthlyAllTransactions({
year: currentYear,
@@ -1362,7 +1361,7 @@ function changeCustomDateFilter(minTime: number, maxTime: number): void {
updateUrlWhenChanged(changed);
}
function changeCustomMonthDateFilter(yearMonth: string): void {
function changeCustomMonthDateFilter(yearMonth: Year0BasedMonth): void {
if (!yearMonth) {
return;
}
src/views/desktop/transactions/import/ImportDialog.vue
+1 -4
View File
@@ -936,8 +936,6 @@ import {
import { generateRandomUUID } from '@/lib/misc.ts';
import logger from '@/lib/logger.ts';
import {
parseDateFromUnixTime,
getUnixTime,
getUtcOffsetByUtcOffsetMinutes,
getTimezoneOffsetMinutes
} from '@/lib/datetime.ts';
@@ -1655,8 +1653,7 @@ function isTagValid(tagIds: string[], tagIndex: number): boolean {
}
function getDisplayDateTime(transaction: ImportTransaction): string {
const transactionTime = getUnixTime(parseDateFromUnixTime(transaction.time, transaction.utcOffset, currentTimezoneOffsetMinutes.value));
return formatUnixTimeToLongDateTime(transactionTime);
return formatUnixTimeToLongDateTime(transaction.time, transaction.utcOffset, currentTimezoneOffsetMinutes.value);
}
function getDisplayTimezone(transaction: ImportTransaction): string {
src/views/mobile/settings/TextSizeSettingsPage.vue
+3 -3
View File
@@ -125,7 +125,7 @@ import { useSettingsStore } from '@/stores/setting.ts';
import { TextDirection } from '@/core/text.ts';
import { FontSize } from '@/core/font.ts';
import { getLocalDatetimeFromUnixTime, getCurrentUnixTime, getDay, getDayOfWeekName } from '@/lib/datetime.ts';
import { parseDateTimeFromUnixTime, getCurrentUnixTime } from '@/lib/datetime.ts';
import { setAppFontSize, getFontSizePreviewClassName } from '@/lib/ui/mobile.ts';
const props = defineProps<{
@@ -149,8 +149,8 @@ const fontSize = ref<number>(settingsStore.appSettings.fontSize);
const textDirection = computed<string>(() => getCurrentLanguageTextDirection());
const fontSizePreviewClassName = computed<string>(() => getFontSizePreviewClassName(fontSize.value));
const currentLongYearMonth = computed<string>(() => formatUnixTimeToLongYearMonth(currentUnixTime.value));
const currentDayOfMonth = computed<number>(() => getDay(getLocalDatetimeFromUnixTime(currentUnixTime.value)));
const currentDayOfWeek = computed<string>(() => getWeekdayShortName(getDayOfWeekName(getLocalDatetimeFromUnixTime(currentUnixTime.value))));
const currentDayOfMonth = computed<number>(() => parseDateTimeFromUnixTime(currentUnixTime.value).getLocalizedCalendarDay());
const currentDayOfWeek = computed<string>(() => getWeekdayShortName(parseDateTimeFromUnixTime(currentUnixTime.value).getWeekDay()));
const currentShortTime = computed<string>(() => formatUnixTimeToShortTime(currentUnixTime.value));
function getFontSizeName(): string {
src/views/mobile/statistics/TransactionPage.vue
+7 -7
View File
@@ -344,7 +344,7 @@ import { useStatisticsStore } from '@/stores/statistics.ts';
import type { TypeAndDisplayName } from '@/core/base.ts';
import { TextDirection } from '@/core/text.ts';
import { type TimeRangeAndDateType, DateRangeScene, DateRange } from '@/core/datetime.ts';
import { type TextualYearMonth, type TimeRangeAndDateType, DateRangeScene, DateRange } from '@/core/datetime.ts';
import {
StatisticsAnalysisType,
CategoricalChartType,
@@ -355,7 +355,7 @@ import {
import { isString, isNumber } from '@/lib/common.ts';
import {
getYearAndMonthFromUnixTime,
getGregorianCalendarYearAndMonthFromUnixTime,
getYearMonthFirstUnixTime,
getYearMonthLastUnixTime,
getShiftedDateRangeAndDateType,
@@ -626,8 +626,8 @@ function setDateFilter(dateType: number): void {
} else if (analysisType.value === StatisticsAnalysisType.TrendAnalysis) {
changed = statisticsStore.updateTransactionStatisticsFilter({
trendChartDateType: dateRange.dateType,
trendChartStartYearMonth: getYearAndMonthFromUnixTime(dateRange.minTime),
trendChartEndYearMonth: getYearAndMonthFromUnixTime(dateRange.maxTime)
trendChartStartYearMonth: getGregorianCalendarYearAndMonthFromUnixTime(dateRange.minTime),
trendChartEndYearMonth: getGregorianCalendarYearAndMonthFromUnixTime(dateRange.maxTime)
});
}
@@ -638,7 +638,7 @@ function setDateFilter(dateType: number): void {
}
}
function setCustomDateFilter(startTime: number | string, endTime: number | string): void {
function setCustomDateFilter(startTime: number | TextualYearMonth, endTime: number | TextualYearMonth): void {
if (!startTime || !endTime) {
return;
}
@@ -692,8 +692,8 @@ function shiftDateRange(scale: number): void {
changed = statisticsStore.updateTransactionStatisticsFilter({
trendChartDateType: newDateRange.dateType,
trendChartStartYearMonth: getYearAndMonthFromUnixTime(newDateRange.minTime),
trendChartEndYearMonth: getYearAndMonthFromUnixTime(newDateRange.maxTime)
trendChartStartYearMonth: getGregorianCalendarYearAndMonthFromUnixTime(newDateRange.minTime),
trendChartEndYearMonth: getGregorianCalendarYearAndMonthFromUnixTime(newDateRange.maxTime)
});
}
src/views/mobile/transactions/EditPage.vue
+3 -3
View File
@@ -536,7 +536,7 @@ const {
getMultiWeekdayLongNames,
formatUnixTimeToLongDate,
formatUnixTimeToLongTime,
formatDateToLongDate
formatGregorianCalendarYearDashMonthDashDayToLongDate
} = useI18n();
const { showAlert, showConfirm, showToast, routeBackOnError } = useI18nUIComponents();
@@ -754,7 +754,7 @@ const transactionDisplayScheduledStartDate = computed<string>(() => {
const template = transaction.value as TransactionTemplate;
if (template.scheduledStartDate) {
return formatDateToLongDate(template.scheduledStartDate);
return formatGregorianCalendarYearDashMonthDashDayToLongDate(template.scheduledStartDate);
} else {
return tt('No limit');
}
@@ -768,7 +768,7 @@ const transactionDisplayScheduledEndDate = computed<string>(() => {
const template = transaction.value as TransactionTemplate;
if (template.scheduledEndDate) {
return formatDateToLongDate(template.scheduledEndDate);
return formatGregorianCalendarYearDashMonthDashDayToLongDate(template.scheduledEndDate);
} else {
return tt('No limit');
}
src/views/mobile/transactions/ListPage.vue
+36 -36
View File
@@ -67,7 +67,7 @@
</f7-toolbar>
<f7-block class="transaction-calendar-container margin-vertical" v-if="pageType === TransactionListPageType.Calendar.type">
<vue-date-picker inline auto-apply model-type="yyyy-M-d"
<vue-date-picker inline auto-apply model-type="yyyy-MM-dd"
month-name-format="long"
class="justify-content-center"
:config="{ noSwipe: true }"
@@ -174,13 +174,13 @@
</f7-list>
<f7-block class="combination-list-wrapper margin-vertical" :class="{ 'no-accordion-toggle': pageType !== TransactionListPageType.List.type }"
:key="transactionMonthList.yearMonth" v-for="(transactionMonthList) in transactions">
:key="transactionMonthList.yearDashMonth" v-for="(transactionMonthList) in transactions">
<f7-accordion-item :opened="transactionMonthList.opened"
@accordion:open="collapseTransactionMonthList(transactionMonthList, false)"
@accordion:opened="onTransactionMonthListCollapseStateChanged"
@accordion:close="collapseTransactionMonthList(transactionMonthList, true)"
@accordion:closed="onTransactionMonthListCollapseStateChanged">
<f7-block-title :id="getTransactionMonthTitleDomId(transactionMonthList.yearMonth)" v-if="pageType === TransactionListPageType.List.type">
<f7-block-title :id="getTransactionMonthTitleDomId(transactionMonthList.yearDashMonth)" v-if="pageType === TransactionListPageType.List.type">
<f7-accordion-toggle>
<f7-list strong inset dividers media-list
class="transaction-amount-list combination-list-header"
@@ -209,7 +209,7 @@
v-if="isTransactionMonthListInvisible(transactionMonthList)" />
<f7-list strong inset dividers media-list accordion-list
class="transaction-info-list transaction-month-list combination-list-content"
:id="getTransactionMonthListDomId(transactionMonthList.yearMonth)"
:id="getTransactionMonthListDomId(transactionMonthList.yearDashMonth)"
v-if="!isTransactionMonthListInvisible(transactionMonthList)"
>
<f7-list-item swipeout chevron-center accordion-item
@@ -222,10 +222,10 @@
<template #media>
<div class="display-flex flex-direction-column transaction-date" :style="getTransactionDateStyle(transaction, idx > 0 ? transactionMonthList.items[idx - 1] : null)">
<span class="transaction-day full-line flex-direction-column">
{{ transaction.day }}
{{ transaction.gregorianCalendarDayOfMonth }}
</span>
<span class="transaction-day-of-week full-line flex-direction-column" v-if="transaction.dayOfWeek">
{{ getWeekdayShortName(transaction.dayOfWeek) }}
<span class="transaction-day-of-week full-line flex-direction-column" v-if="transaction.displayDayOfWeek">
{{ getWeekdayShortName(transaction.displayDayOfWeek) }}
</span>
</div>
</template>
@@ -620,9 +620,11 @@ import { type TransactionMonthList, useTransactionsStore } from '@/stores/transa
import type { TypeAndDisplayName } from '@/core/base.ts';
import { TextDirection } from '@/core/text.ts';
import {
type TextualYearMonth,
type Year0BasedMonth,
type TimeRangeAndDateType,
DateRangeScene,
DateRange,
DateRange
} from '@/core/datetime.ts';
import { AmountFilterType } from '@/core/numeral.ts';
import { TransactionType } from '@/core/transaction.ts';
@@ -635,11 +637,9 @@ import {
} from '@/lib/common.ts';
import {
getCurrentUnixTime,
parseDateFromUnixTime,
parseDateTimeFromUnixTime,
getBrowserTimezoneOffsetMinutes,
getActualUnixTimeForStore,
getYear,
getMonth,
getDayFirstUnixTimeBySpecifiedUnixTime,
getYearMonthFirstUnixTime,
getYearMonthLastUnixTime,
@@ -731,8 +731,8 @@ const transactionsStore = useTransactionsStore();
const loadingError = ref<unknown | null>(null);
const loadingMore = ref<boolean>(false);
const transactionToDelete = ref<Transaction | null>(null);
const transactionInvisibleYearMonths = ref<Record<string, boolean>>({});
const transactionYearMonthListHeights = ref<Record<string, number>>({});
const transactionInvisibleYearMonths = ref<Record<TextualYearMonth, boolean>>({});
const transactionYearMonthListHeights = ref<Record<TextualYearMonth, number>>({});
const showTransactionListPageTypePopover = ref<boolean>(false);
const showDatePopover = ref<boolean>(false);
const showCategoryPopover = ref<boolean>(false);
@@ -768,7 +768,7 @@ const transactions = computed<TransactionMonthList[]>(() => {
for (let i = 0; i < transactionData.items.length; i++) {
const transaction = transactionData.items[i];
if (transaction.date === currentCalendarDate.value) {
if (transaction.gregorianCalendarYearDashMonthDashDay === currentCalendarDate.value) {
transactions.push(transaction);
}
}
@@ -776,7 +776,7 @@ const transactions = computed<TransactionMonthList[]>(() => {
const dailyTransactionList: TransactionMonthList = {
year: currentMonthTransactionData.value.year,
month: currentMonthTransactionData.value.month,
yearMonth: currentMonthTransactionData.value.yearMonth,
yearDashMonth: currentMonthTransactionData.value.yearDashMonth,
opened: true,
items: transactions,
totalAmount: {
@@ -809,11 +809,11 @@ const noTransaction = computed<boolean>(() => {
const hasMoreTransaction = computed<boolean>(() => transactionsStore.hasMoreTransaction);
function getTransactionMonthTitleDomId(yearMonth: string): string {
function getTransactionMonthTitleDomId(yearMonth: TextualYearMonth): string {
return 'transaction_month_title_' + yearMonth;
}
function getTransactionMonthListDomId(yearMonth: string): string {
function getTransactionMonthListDomId(yearMonth: TextualYearMonth): string {
return 'transaction_month_list_' + yearMonth;
}
@@ -822,7 +822,7 @@ function getTransactionDomId(transaction: Transaction): string {
}
function isTransactionMonthListInvisible(transactionMonthList: TransactionMonthList): boolean {
if (!transactionYearMonthListHeights.value[transactionMonthList.yearMonth]) {
if (!transactionYearMonthListHeights.value[transactionMonthList.yearDashMonth]) {
return false;
}
@@ -830,7 +830,7 @@ function isTransactionMonthListInvisible(transactionMonthList: TransactionMonthL
return true;
}
if (transactionInvisibleYearMonths.value[transactionMonthList.yearMonth]) {
if (transactionInvisibleYearMonths.value[transactionMonthList.yearDashMonth]) {
return true;
}
@@ -839,7 +839,7 @@ function isTransactionMonthListInvisible(transactionMonthList: TransactionMonthL
function getTransactionMonthListHeight(transactionMonthList: TransactionMonthList): string {
if (isTransactionMonthListInvisible(transactionMonthList)) {
return transactionYearMonthListHeights.value[transactionMonthList.yearMonth] + 'px';
return transactionYearMonthListHeights.value[transactionMonthList.yearDashMonth] + 'px';
}
return 'auto';
@@ -857,12 +857,12 @@ function setTransactionMonthListHeights(reset: boolean): Promise<unknown> {
for (let i = 0; i < transactions.value.length - 1; i++) {
const transactionMonthList = transactions.value[i];
const yearMonth = transactionMonthList.yearMonth;
const domId = getTransactionMonthListDomId(yearMonth);
const yearDashMonth = transactionMonthList.yearDashMonth;
const domId = getTransactionMonthListDomId(yearDashMonth);
const height = heights[domId];
if (!transactionYearMonthListHeights.value[yearMonth] && isNumber(height)) {
transactionYearMonthListHeights.value[yearMonth] = height;
if (!transactionYearMonthListHeights.value[yearDashMonth] && isNumber(height)) {
transactionYearMonthListHeights.value[yearDashMonth] = height;
}
}
}
@@ -876,30 +876,30 @@ function setTransactionInvisibleYearMonthList(): void {
for (let i = 0; i < transactions.value.length - 1; i++) {
const transactionMonthList = transactions.value[i];
const yearMonth = transactionMonthList.yearMonth;
const yearDashMonth = transactionMonthList.yearDashMonth;
const titleDomId = getTransactionMonthTitleDomId(yearMonth);
const titleDomId = getTransactionMonthTitleDomId(yearDashMonth);
const titleRect = getElementBoundingRect(`#${titleDomId}`);
if (!titleRect) {
continue;
}
const listHeight = transactionYearMonthListHeights.value[yearMonth] || 0;
const listHeight = transactionYearMonthListHeights.value[yearDashMonth] || 0;
const listRectTop = titleRect.top + titleRect.height;
const listRectBottom = listRectTop + listHeight;
const invisible = listRectTop > 2 * window.innerHeight || listRectBottom < -2 * window.innerHeight;
if (invisible) {
transactionInvisibleYearMonths.value[yearMonth] = true;
transactionInvisibleYearMonths.value[yearDashMonth] = true;
} else {
delete transactionInvisibleYearMonths.value[yearMonth];
delete transactionInvisibleYearMonths.value[yearDashMonth];
}
}
}
function getTransactionDateStyle(transaction: Transaction, previousTransaction: Transaction | null): Record<string, string> {
if (!previousTransaction || transaction.day !== previousTransaction.day) {
if (!previousTransaction || transaction.gregorianCalendarDayOfMonth !== previousTransaction.gregorianCalendarDayOfMonth) {
return {};
}
@@ -974,9 +974,9 @@ function reload(done?: () => void): void {
transactionTagsStore.loadAllTags({ force: false })
]).then(() => {
if (queryMonthlyData.value) {
const currentMonthMinDate = parseDateFromUnixTime(query.value.minTime);
const currentYear = getYear(currentMonthMinDate);
const currentMonth = getMonth(currentMonthMinDate);
const currentMonthMinDate = parseDateTimeFromUnixTime(query.value.minTime);
const currentYear = currentMonthMinDate.getGregorianCalendarYear();
const currentMonth = currentMonthMinDate.getGregorianCalendarMonth();
return transactionsStore.loadMonthlyAllTransactions({
year: currentYear,
@@ -1159,7 +1159,7 @@ function changeCustomDateFilter(minTime: number, maxTime: number): void {
}
}
function changeCustomMonthDateFilter(yearMonth: string): void {
function changeCustomMonthDateFilter(yearMonth: Year0BasedMonth): void {
if (!yearMonth) {
return;
}
@@ -1466,8 +1466,8 @@ function collapseTransactionMonthList(monthList: TransactionMonthList, collapse:
collapse: collapse
});
if (!collapse && transactionInvisibleYearMonths.value[monthList.yearMonth]) {
delete transactionInvisibleYearMonths.value[monthList.yearMonth];
if (!collapse && transactionInvisibleYearMonths.value[monthList.yearDashMonth]) {
delete transactionInvisibleYearMonths.value[monthList.yearDashMonth];
}
}