From e563d5585219a41a6c5b23ffa0295b80775474d3 Mon Sep 17 00:00:00 2001 From: wudi Date: Mon, 3 Mar 2025 11:21:39 +0800 Subject: [PATCH] feat: Add internationalization (i18n) support Implemented multi-language support for the application: - Added @nuxtjs/i18n plugin configuration - Created locale files for English (en-US) and Chinese (zh-CN) - Updated components to use translation keys - Added language switcher in header - Configured VSCode i18n-ally settings - Prepared translation infrastructure for future language expansions --- .vscode/settings.json | 19 +- components/SwitchTheme.vue | 8 +- components/dashboard/Breadcrumb.vue | 2 +- components/dashboard/Counters.vue | 6 +- components/dashboard/DatePicker.vue | 22 +- components/dashboard/Index.vue | 2 +- components/dashboard/Logout.vue | 8 +- components/dashboard/Nav.vue | 4 +- components/dashboard/Views.vue | 2 +- components/dashboard/links/Delete.vue | 8 +- components/dashboard/links/Editor.vue | 14 +- components/dashboard/links/Index.vue | 6 +- components/dashboard/links/Link.vue | 12 +- components/dashboard/links/QRCode.vue | 2 +- components/dashboard/links/Search.vue | 12 +- components/dashboard/metrics/Group.vue | 29 +- components/dashboard/metrics/Index.vue | 35 +- components/dashboard/metrics/List.vue | 4 +- components/dashboard/metrics/Locations.vue | 2 +- components/dashboard/metrics/Metric.vue | 5 +- components/dashboard/metrics/name/Index.vue | 2 +- components/home/Cta.vue | 8 +- components/home/Features.vue | 37 +- components/home/Hero.vue | 2 +- components/home/Logos.vue | 2 +- components/home/Twitter.vue | 2 +- components/layouts/Footer.vue | 12 +- components/layouts/Header.vue | 24 +- components/login/index.vue | 14 +- i18n/i18n.config.ts | 11 + i18n/i18n.ts | 28 + i18n/locales/en-US.json | 161 +++++ i18n/locales/zh-CN.json | 161 +++++ nuxt.config.ts | 20 + package.json | 2 + pnpm-lock.yaml | 716 +++++++++++++------- 36 files changed, 1048 insertions(+), 356 deletions(-) create mode 100644 i18n/i18n.config.ts create mode 100644 i18n/i18n.ts create mode 100644 i18n/locales/en-US.json create mode 100644 i18n/locales/zh-CN.json diff --git a/.vscode/settings.json b/.vscode/settings.json index e3dd158..6cc72fd 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -46,5 +46,22 @@ "scss", "pcss", "postcss" - ] + ], + "i18n-ally.dirStructure": "auto", + "i18n-ally.localesPaths": [ + "i18n/locales" + ], + "i18n-ally.extract.keygenStyle": "camelCase", + "i18n-ally.keystyle": "nested", + "i18n-ally.enabledParsers": [ + "json" + ], + "i18n-ally.namespace": true, + "i18n-ally.sortKeys": true, + "i18n-ally.sourceLanguage": "en-US", + "i18n-ally.displayLanguage": "en-US", + "i18n-ally.parsers.typescript.compilerOptions": { + "moduleResolution": "node" + }, + "i18n-ally.enabledFrameworks": ["vue"] } diff --git a/components/SwitchTheme.vue b/components/SwitchTheme.vue index ef3311b..fcca78f 100644 --- a/components/SwitchTheme.vue +++ b/components/SwitchTheme.vue @@ -14,7 +14,7 @@ const colorMode = useColorMode() - Toggle theme + {{ $t('theme.toggle') }} - Light + {{ $t('theme.light') }} - Dark + {{ $t('theme.dark') }} - System + {{ $t('theme.system') }} diff --git a/components/dashboard/Breadcrumb.vue b/components/dashboard/Breadcrumb.vue index 5cd5077..37b93f8 100644 --- a/components/dashboard/Breadcrumb.vue +++ b/components/dashboard/Breadcrumb.vue @@ -24,7 +24,7 @@ const { title } = useAppConfig() :as="NuxtLink" to="/dashboard" > - Dashboard + {{ $t('dashboard.title') }} diff --git a/components/dashboard/Counters.vue b/components/dashboard/Counters.vue index 3f6a78d..e6fcaac 100644 --- a/components/dashboard/Counters.vue +++ b/components/dashboard/Counters.vue @@ -44,7 +44,7 @@ onBeforeUnmount(() => { - Visits + {{ $t('dashboard.visits') }} @@ -55,7 +55,7 @@ onBeforeUnmount(() => { - Visitors + {{ $t('dashboard.visitors') }} @@ -66,7 +66,7 @@ onBeforeUnmount(() => { - Referers + {{ $t('dashboard.referers') }} diff --git a/components/dashboard/DatePicker.vue b/components/dashboard/DatePicker.vue index e3f10fb..b6147a9 100644 --- a/components/dashboard/DatePicker.vue +++ b/components/dashboard/DatePicker.vue @@ -97,32 +97,32 @@ onBeforeMount(() => { - Today + {{ $t('dashboard.date_picker.today') }} - Last 24 hours + {{ $t('dashboard.date_picker.last_24h') }} - This week + {{ $t('dashboard.date_picker.this_week') }} - Last 7 days + {{ $t('dashboard.date_picker.last_7d') }} - This month + {{ $t('dashboard.date_picker.this_month') }} - Last 30 days + {{ $t('dashboard.date_picker.last_30d') }} - Last 90 days + {{ $t('dashboard.date_picker.last_90d') }} - Custom + {{ $t('dashboard.date_picker.custom') }} @@ -130,7 +130,7 @@ onBeforeMount(() => { - Custom Date + {{ $t('dashboard.date_picker.custom_title') }} {
- Date + {{ $t('dashboard.date_picker.single_date') }} - Date Range + {{ $t('dashboard.date_picker.date_range') }}
diff --git a/components/dashboard/Index.vue b/components/dashboard/Index.vue index c8f079b..a974031 100644 --- a/components/dashboard/Index.vue +++ b/components/dashboard/Index.vue @@ -67,7 +67,7 @@ onBeforeMount(() => { #left >

- {{ link.slug }}'s Stats + {{ link.slug }} {{ $t('dashboard.stats') }}

diff --git a/components/dashboard/Logout.vue b/components/dashboard/Logout.vue index 8f4a3ea..cc4a1bb 100644 --- a/components/dashboard/Logout.vue +++ b/components/dashboard/Logout.vue @@ -16,15 +16,15 @@ function logOut() { - LogOut ? + {{ $t('logout.title') }} - Are you sure you want to log out ? + {{ $t('logout.confirm') }} - Cancel + {{ $t('common.cancel') }} - LogOut + {{ $t('logout.action') }} diff --git a/components/dashboard/Nav.vue b/components/dashboard/Nav.vue index 814eec0..ee11d6d 100644 --- a/components/dashboard/Nav.vue +++ b/components/dashboard/Nav.vue @@ -13,10 +13,10 @@ const route = useRoute() - Links + {{ $t('nav.links') }} - Analysis + {{ $t('nav.analysis') }}
diff --git a/components/dashboard/Views.vue b/components/dashboard/Views.vue index b99aaae..9ed866a 100644 --- a/components/dashboard/Views.vue +++ b/components/dashboard/Views.vue @@ -62,7 +62,7 @@ function formatTime(tick) {