migrate unlock page to composition API and typescript

This commit is contained in:
MaysWind
2025-01-14 23:36:31 +08:00
parent cd2e6c1aae
commit 29c09cb10a
7 changed files with 387 additions and 396 deletions
+16 -46
View File
@@ -1,6 +1,6 @@
import moment from 'moment-timezone';
import { DEFAULT_LANGUAGE, allLanguages } from '@/locales/index.ts';
import { DEFAULT_LANGUAGE, ALL_LANGUAGES } from '@/locales/index.ts';
import { Month, WeekDay, MeridiemIndicator, LongDateFormat, ShortDateFormat, LongTimeFormat, ShortTimeFormat, DateRange, LANGUAGE_DEFAULT_DATE_TIME_FORMAT_VALUE } from '@/core/datetime.ts';
import { TimezoneTypeForStatistics } from '@/core/timezone.ts';
@@ -70,12 +70,12 @@ function getLanguageDisplayName(translateFn, languageName) {
function getAllLanguageInfoArray(translateFn, includeSystemDefault) {
const ret = [];
for (const languageTag in allLanguages) {
if (!Object.prototype.hasOwnProperty.call(allLanguages, languageTag)) {
for (const languageTag in ALL_LANGUAGES) {
if (!Object.prototype.hasOwnProperty.call(ALL_LANGUAGES, languageTag)) {
continue;
}
const languageInfo = allLanguages[languageTag];
const languageInfo = ALL_LANGUAGES[languageTag];
let displayName = languageInfo.displayName;
let languageNameInCurrentLanguage = getLanguageDisplayName(translateFn, languageInfo.name);
@@ -104,7 +104,7 @@ function getAllLanguageInfoArray(translateFn, includeSystemDefault) {
}
function getLanguageInfo(locale) {
return allLanguages[locale];
return ALL_LANGUAGES[locale];
}
function getDefaultLanguage() {
@@ -118,7 +118,7 @@ function getDefaultLanguage() {
return DEFAULT_LANGUAGE;
}
if (!allLanguages[browserLocale]) {
if (!ALL_LANGUAGES[browserLocale]) {
const locale = getLocaleFromLanguageAlias(browserLocale);
if (locale) {
@@ -126,11 +126,11 @@ function getDefaultLanguage() {
}
}
if (!allLanguages[browserLocale] && browserLocale.split('-').length > 1) { // maybe language-script-region
if (!ALL_LANGUAGES[browserLocale] && browserLocale.split('-').length > 1) { // maybe language-script-region
const localeParts = browserLocale.split('-');
browserLocale = localeParts[0] + '-' + localeParts[1];
if (!allLanguages[browserLocale]) {
if (!ALL_LANGUAGES[browserLocale]) {
const locale = getLocaleFromLanguageAlias(browserLocale);
if (locale) {
@@ -138,7 +138,7 @@ function getDefaultLanguage() {
}
}
if (!allLanguages[browserLocale]) {
if (!ALL_LANGUAGES[browserLocale]) {
browserLocale = localeParts[0];
const locale = getLocaleFromLanguageAlias(browserLocale);
@@ -148,7 +148,7 @@ function getDefaultLanguage() {
}
}
if (!allLanguages[browserLocale]) {
if (!ALL_LANGUAGES[browserLocale]) {
return DEFAULT_LANGUAGE;
}
@@ -156,8 +156,8 @@ function getDefaultLanguage() {
}
function getLocaleFromLanguageAlias(alias) {
for (let locale in allLanguages) {
if (!Object.prototype.hasOwnProperty.call(allLanguages, locale)) {
for (let locale in ALL_LANGUAGES) {
if (!Object.prototype.hasOwnProperty.call(ALL_LANGUAGES, locale)) {
continue;
}
@@ -165,7 +165,7 @@ function getLocaleFromLanguageAlias(alias) {
return locale;
}
const lang = allLanguages[locale];
const lang = ALL_LANGUAGES[locale];
const aliases = lang.aliases;
if (!aliases || aliases.length < 1) {
@@ -1122,11 +1122,11 @@ function getAllSupportedImportFileTypes(i18nGlobal, translateFn) {
if (fileType.document.supportMultiLanguages === true) {
document.language = getCurrentLanguageTag(i18nGlobal);
document.anchor = translateFn(`document.anchor.export_and_import.${fileType.document.anchor}`);
} else if (isString(fileType.document.supportMultiLanguages) && allLanguages[fileType.document.supportMultiLanguages]) {
} else if (isString(fileType.document.supportMultiLanguages) && ALL_LANGUAGES[fileType.document.supportMultiLanguages]) {
document.language = fileType.document.supportMultiLanguages;
if (document.language !== getCurrentLanguageTag(i18nGlobal)) {
document.displayLanguageName = getLanguageDisplayName(translateFn, allLanguages[fileType.document.supportMultiLanguages].name);
document.displayLanguageName = getLanguageDisplayName(translateFn, ALL_LANGUAGES[fileType.document.supportMultiLanguages].name);
}
document.anchor = fileType.document.anchor;
@@ -1373,34 +1373,6 @@ function setLanguage(i18nGlobal, locale, force) {
};
}
function setTimeZone(timezone) {
if (timezone) {
moment.tz.setDefault(timezone);
} else {
moment.tz.setDefault();
}
}
function initLocale(i18nGlobal, lastUserLanguage, timezone) {
let localeDefaultSettings = null;
if (lastUserLanguage && getLanguageInfo(lastUserLanguage)) {
logger.info(`Last user language is ${lastUserLanguage}`);
localeDefaultSettings = setLanguage(i18nGlobal, lastUserLanguage, true);
} else {
localeDefaultSettings = setLanguage(i18nGlobal, null, true);
}
if (timezone) {
logger.info(`Current timezone is ${timezone}`);
setTimeZone(timezone);
} else {
logger.info(`No timezone is set, use browser default ${getTimezoneOffset()} (maybe ${moment.tz.guess(true)})`);
}
return localeDefaultSettings;
}
export function translateError(message, translateFn) {
let parameters = {};
@@ -1487,8 +1459,6 @@ export function i18nFunctions(i18nGlobal) {
getCategorizedAccountsWithDisplayBalance: (allVisibleAccounts, showAccountBalance, defaultCurrency, settingsStore, userStore, exchangeRatesStore) => getCategorizedAccountsWithDisplayBalance(allVisibleAccounts, showAccountBalance, defaultCurrency, userStore, settingsStore, exchangeRatesStore, i18nGlobal.t),
getServerTipContent: (tipConfig) => getServerTipContent(tipConfig, i18nGlobal),
joinMultiText: (textArray) => joinMultiText(textArray, i18nGlobal.t),
setLanguage: (locale, force) => setLanguage(i18nGlobal, locale, force),
setTimeZone: (timezone) => setTimeZone(timezone),
initLocale: (lastUserLanguage, timezone) => initLocale(i18nGlobal, lastUserLanguage, timezone)
setLanguage: (locale, force) => setLanguage(i18nGlobal, locale, force)
};
}
+56 -15
View File
@@ -1,9 +1,9 @@
import { useI18n as useVueI18n } from 'vue-i18n';
import moment from 'moment-timezone';
import type {TypeAndName, TypeAndDisplayName, LocalizedSwitchOption } from '@/core/base.ts';
import type { TypeAndName, TypeAndDisplayName, LocalizedSwitchOption } from '@/core/base.ts';
import { type LanguageInfo, allLanguages, DEFAULT_LANGUAGE } from '@/locales/index.ts';
import { type LanguageInfo, type LanguageOption, ALL_LANGUAGES, DEFAULT_LANGUAGE } from '@/locales/index.ts';
import {
type DateFormat,
@@ -136,12 +136,12 @@ export function getI18nOptions(): object {
messages: (function () {
const messages: Record<string, object> = {};
for (const languageKey in allLanguages) {
if (!Object.prototype.hasOwnProperty.call(allLanguages, languageKey)) {
for (const languageKey in ALL_LANGUAGES) {
if (!Object.prototype.hasOwnProperty.call(ALL_LANGUAGES, languageKey)) {
continue;
}
const languageInfo = allLanguages[languageKey];
const languageInfo = ALL_LANGUAGES[languageKey];
messages[languageKey] = languageInfo.content;
}
@@ -158,7 +158,11 @@ export function useI18n() {
// private functions
function getLanguageInfo(languageKey: string): LanguageInfo | undefined {
return allLanguages[languageKey];
return ALL_LANGUAGES[languageKey];
}
function getLanguageDisplayName(languageName: string): string {
return t(`language.${languageName}`);
}
function getDefaultLanguage(): string {
@@ -172,7 +176,7 @@ export function useI18n() {
return DEFAULT_LANGUAGE;
}
if (!allLanguages[browserLanguage]) {
if (!ALL_LANGUAGES[browserLanguage]) {
const languageKey = getLanguageKeyFromLanguageAlias(browserLanguage);
if (languageKey) {
@@ -180,11 +184,11 @@ export function useI18n() {
}
}
if (!allLanguages[browserLanguage] && browserLanguage.split('-').length > 1) { // maybe language-script-region
if (!ALL_LANGUAGES[browserLanguage] && browserLanguage.split('-').length > 1) { // maybe language-script-region
const languageTagParts = browserLanguage.split('-');
browserLanguage = languageTagParts[0] + '-' + languageTagParts[1];
if (!allLanguages[browserLanguage]) {
if (!ALL_LANGUAGES[browserLanguage]) {
const languageKey = getLanguageKeyFromLanguageAlias(browserLanguage);
if (languageKey) {
@@ -192,7 +196,7 @@ export function useI18n() {
}
}
if (!allLanguages[browserLanguage]) {
if (!ALL_LANGUAGES[browserLanguage]) {
browserLanguage = languageTagParts[0];
const languageKey = getLanguageKeyFromLanguageAlias(browserLanguage);
@@ -202,7 +206,7 @@ export function useI18n() {
}
}
if (!allLanguages[browserLanguage]) {
if (!ALL_LANGUAGES[browserLanguage]) {
return DEFAULT_LANGUAGE;
}
@@ -210,8 +214,8 @@ export function useI18n() {
}
function getLanguageKeyFromLanguageAlias(alias: string): string | null {
for (const languageKey in allLanguages) {
if (!Object.prototype.hasOwnProperty.call(allLanguages, languageKey)) {
for (const languageKey in ALL_LANGUAGES) {
if (!Object.prototype.hasOwnProperty.call(ALL_LANGUAGES, languageKey)) {
continue;
}
@@ -219,7 +223,7 @@ export function useI18n() {
return languageKey;
}
const langInfo = allLanguages[languageKey];
const langInfo = ALL_LANGUAGES[languageKey];
const aliases = langInfo.aliases;
if (!aliases || aliases.length < 1) {
@@ -545,6 +549,42 @@ export function useI18n() {
return t('default.firstDayOfWeek');
}
function getAllLanguageOptions(includeSystemDefault: boolean): LanguageOption[] {
const ret: LanguageOption[] = [];
for (const languageTag in ALL_LANGUAGES) {
if (!Object.prototype.hasOwnProperty.call(ALL_LANGUAGES, languageTag)) {
continue;
}
const languageInfo = ALL_LANGUAGES[languageTag];
let displayName = languageInfo.displayName;
const languageNameInCurrentLanguage = getLanguageDisplayName(languageInfo.name);
if (languageNameInCurrentLanguage && languageNameInCurrentLanguage !== displayName) {
displayName = `${languageNameInCurrentLanguage} (${displayName})`;
}
ret.push({
languageTag: languageTag,
displayName: displayName
});
}
ret.sort(function (lang1, lang2) {
return lang1.languageTag.localeCompare(lang2.languageTag);
});
if (includeSystemDefault) {
ret.splice(0, 0, {
languageTag: '',
displayName: t('System Default')
});
}
return ret;
}
function getAllEnableDisableOptions(): LocalizedSwitchOption[] {
return [{
value: true,
@@ -1167,7 +1207,7 @@ export function useI18n() {
}
}
function initLocale(lastUserLanguage: string, timezone: string): LocaleDefaultSettings | null {
function initLocale(lastUserLanguage?: string, timezone?: string): LocaleDefaultSettings | null {
let localeDefaultSettings: LocaleDefaultSettings | null = null;
if (lastUserLanguage && getLanguageInfo(lastUserLanguage)) {
@@ -1201,6 +1241,7 @@ export function useI18n() {
getDefaultCurrency,
getDefaultFirstDayOfWeek,
// get all localized info of specified type
getAllLanguageOptions,
getAllEnableDisableOptions,
getAllMeridiemIndicators,
getAllLongMonthNames,
+6 -1
View File
@@ -10,10 +10,15 @@ export interface LanguageInfo {
readonly content: object;
}
export interface LanguageOption {
readonly languageTag: string;
readonly displayName: string;
}
export const DEFAULT_LANGUAGE: string = 'en';
// To add new languages, please refer to https://ezbookkeeping.mayswind.net/translating
export const allLanguages: Record<string, LanguageInfo> = {
export const ALL_LANGUAGES: Record<string, LanguageInfo> = {
'en': {
name: 'English',
displayName: 'English',