多语言处理

package.json

@@ -17,7 +17,8 @@
     "@heroicons/vue": "^2.2.0",
     "qrcode": "^1.5.4",
     "simple-icons": "^15.18.0",
-    "vue": "^3.5.17"
+    "vue": "^3.5.17",
+    "vue-i18n": "^11.2.1"
   },
   "devDependencies": {
     "@tsconfig/node22": "^22.0.2",

src/App.vue

@@ -1,13 +1,16 @@
 <script setup lang="ts">
-import { ref, onMounted, type Ref } from 'vue'
+import { ref, onMounted, type Ref, computed } from 'vue'
 import QRCode from 'qrcode'
 import { DevicePhoneMobileIcon } from '@heroicons/vue/24/outline'
 import * as simpleIcons from 'simple-icons'
+import { useI18n } from 'vue-i18n'
 import Header from '@/components/Header.vue'
 import Footer from '@/components/Footer.vue'
 import Accordion from '@/components/Accordion.vue'
 import { apiClient } from '@/utils/api'
 
+const { t } = useI18n()
+
 // 获取图标数据
 const appleIcon = simpleIcons.siApple
 const androidIcon = simpleIcons.siAndroid
@@ -106,51 +109,37 @@ onMounted(async () => {
   await generateQRCode()
 })
 
-const features = [
+const features = computed(() => [
   {
-    title: '资产存储',
-    desc: '在 OKX Wallet 存储任意数字资产，涵盖 BTC、ETH、USDT 及热门 Meme 币与 NFT。支持一次性创建最多 1,000 个子钱包地址，全权掌控私钥管理。',
+    title: t('features.storage.title'),
+    desc: t('features.storage.desc'),
     img: 'https://web3.okx.com/cdn/oksupport/common/ProductStore.ec964f9ee58cd4.webp',
     video: 'https://web3.okx.com/cdn/oksupport/common/Store.3b2045ad9cec50.mp4',
   },
   {
-    title: '代币兑换',
-    desc: '三种智能模式随心切换：简易模式、专业模式、Meme 模式。新手轻松上手，专家精准操控，满足全层级用户链上交易需求。',
+    title: t('features.swap.title'),
+    desc: t('features.swap.desc'),
     img: 'https://web3.okx.com/cdn/oksupport/common/Swap_Product.bc111befcc3ff7.webp',
     video: 'https://web3.okx.com/cdn/oksupport/common/Swap.1df753971a5611.mp4',
   },
   {
-    title: '链上质押',
-    desc: '激活数字资产价值，发现链上优质质押池。智能聚合主流公链质押协议，通过自管钱包实时追踪多链收益。',
+    title: t('features.stake.title'),
+    desc: t('features.stake.desc'),
     img: 'https://web3.okx.com/cdn/oksupport/common/ProductStake.419857eacdbe63.webp',
     video: 'https://web3.okx.com/cdn/oksupport/common/Stake.778d6e38064bac.mp4',
   },
   {
-    title: '数据分析',
-    desc: '搭载实时数据终端，监控主流公链及头部 DEX 的流动性、价格波动与大额交易。追踪聪明钱地址动向，配置个性化警报策略，助你抢占链上先机。',
+    title: t('features.analyze.title'),
+    desc: t('features.analyze.desc'),
     img: 'https://web3.okx.com/cdn/oksupport/common/ProductAnalyze.3beae7e2817e41.webp',
     video: 'https://web3.okx.com/cdn/oksupport/common/Analyze.da7fb67f9f88a6.mp4',
   },
-]
+])
 
-const faq = [
-  {
-    q: '如何开始使用 OKX Wallet？',
-    a: '支持网页端即时注册或下载移动端应用，你也可使用浏览器插件通过 Wallet Connect 协议无缝连接全网 DApp。',
-  },
-  {
-    q: '为什么选择 OKX Wallet？',
-    a: 'OKX Wallet 通过多链互联架构满足资产存储、链上分析、跨链交易及数字创作等全维度需求，真正实现"一个钱包，无限可能"的产品理念。',
-  },
-  {
-    q: 'OKX Wallet 是否为托管型钱包？',
-    a: 'OKX Wallet 为完全自主管理的非托管型加密钱包，用户独享资产控制权。支持通过私钥在任何兼容钱包中恢复资产，确保用户便捷使用。',
-  },
-  {
-    q: 'OKX Wallet 具有哪些优势？',
-    a: '作为专业用户首选的数字资产安全存储方案，OKX Wallet 集成原生 DApp 生态，包括链上聚合器产品 OKX DEX。DEX 路由引擎实时聚合超过 100 个流动性池及去中心化交易所，智能执行最优价格交易。此外，你还可使用 OKX Wallet 进行 NFT 等数字资产的创建与管理。',
-  },
-]
+const faq = computed(() => {
+  const items = t('faq.items')
+  return Array.isArray(items) ? items as Array<{ q: string; a: string }> : []
+})
 </script>
 
 <template>
@@ -165,17 +154,17 @@ const faq = [
             <h1
               class="index_title__rfrkU text-3xl font-bold leading-tight text-white sm:text-4xl md:text-5xl mx-auto lg:mx-0"
             >
-              你的数字<span class="text-okx-primary">货币与 <br />Web3</span> 直通车
+              {{ t('hero.title') }}<span class="text-okx-primary">{{ t('hero.titleHighlight') }}</span>{{ t('hero.titleSuffix') }}
             </h1>
             <p
               class="index_subtitle__h916r mt-4 max-w-xl mx-auto lg:mx-0 text-base text-okx-text/80 sm:text-lg"
             >
-              原生支持 130+ 网络，助你畅游 Web3
+              {{ t('hero.subtitle1') }}
             </p>
             <p
               class="index_subtitle__h916r mt-4 max-w-xl mx-auto lg:mx-0 text-base text-okx-text/80 sm:text-lg"
             >
-              OKX Wallet 助你轻松管理、交易多种数字资产
+              {{ t('hero.subtitle2') }}
             </p>
             <div class="mt-6 flex justify-start">
               <div
@@ -190,7 +179,7 @@ const faq = [
                 >
                   <span class="btn-content inline-flex items-center gap-2">
                     <DevicePhoneMobileIcon class="h-5 w-5" aria-hidden="true" />
-                    下载 App
+                    {{ t('hero.downloadApp') }}
                   </span>
                 </button>
 
@@ -209,7 +198,7 @@ const faq = [
                         <div
                           class="mb-3 text-xs font-semibold uppercase tracking-wider text-okx-text/70 leading-tight"
                         >
-                          扫码下载
+                          {{ t('hero.scanToDownload') }}
                         </div>
                         <picture
                           class="growth growth-picture index_qrWrapper__2OxzI growth-picture-font block flex-shrink-0"
@@ -228,7 +217,7 @@ const faq = [
                         <div
                           class="mb-3 text-xs font-semibold uppercase tracking-wider text-okx-text/70 leading-tight"
                         >
-                          更多下载方式
+                          {{ t('hero.moreDownloads') }}
                         </div>
                         <div class="space-y-2.5 flex-1 flex flex-col justify-start">
                           <a
@@ -243,8 +232,8 @@ const faq = [
                               </svg>
                             </div>
                             <div class="flex-1 min-w-0">
-                              <div class="text-sm font-medium text-white">App Store</div>
-                              <div class="text-xs text-okx-text/60">iOS 应用商店</div>
+                              <div class="text-sm font-medium text-white">{{ t('hero.appStore') }}</div>
+                              <div class="text-xs text-okx-text/60">{{ t('hero.iosStore') }}</div>
                             </div>
                           </a>
                           <a
@@ -259,8 +248,8 @@ const faq = [
                               </svg>
                             </div>
                             <div class="flex-1 min-w-0">
-                              <div class="text-sm font-medium text-white">Android APK</div>
-                              <div class="text-xs text-okx-text/60">安卓安装包</div>
+                              <div class="text-sm font-medium text-white">{{ t('hero.androidApk') }}</div>
+                              <div class="text-xs text-okx-text/60">{{ t('hero.androidPackage') }}</div>
                             </div>
                           </a>
                         </div>
@@ -293,7 +282,7 @@ const faq = [
                 <svg class="h-6 w-6 flex-shrink-0" viewBox="0 0 24 24" fill="currentColor">
                   <path :d="androidIcon.path" />
                 </svg>
-                <span class="font-semibold">下载 App</span>
+                <span class="font-semibold">{{ t('hero.downloadApp') }}</span>
               </a>
               <a
                 :href="downloadLinks.ios"
@@ -302,7 +291,7 @@ const faq = [
                 <svg class="h-6 w-6 flex-shrink-0" viewBox="0 0 24 24" fill="currentColor">
                   <path :d="appleIcon.path" />
                 </svg>
-                <span class="font-semibold">App Store</span>
+                <span class="font-semibold">{{ t('hero.appStore') }}</span>
               </a>
             </div>
           </div>
@@ -369,9 +358,9 @@ const faq = [
     <section class="bg-black">
       <div class="mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8">
         <div class="text-center mb-12">
-          <p class="text-sm text-okx-text/60 mb-2">安全体系</p>
+          <p class="text-sm text-okx-text/60 mb-2">{{ t('security.label') }}</p>
           <h2 class="text-3xl font-bold text-white sm:text-4xl">
-            尖端自托管技术，全球认证安全标准
+            {{ t('security.title') }}
           </h2>
         </div>
         <div class="flex flex-col lg:flex-row lg:items-center lg:gap-16">
@@ -382,10 +371,10 @@ const faq = [
                   class="icon iconfont dex-okx-defi-x1-liquidity-plus text-okx-primary"
                   style="font-size: 24px"
                 ></i>
-                <span class="font-semibold text-white">资产自主控制</span>
+                <span class="font-semibold text-white">{{ t('security.control.title') }}</span>
               </div>
               <p class="text-okx-text/80 text-sm">
-                真正掌握数字资产所有权，通过助记词、私钥、生物识别验证和加密技术保障资产安全。
+                {{ t('security.control.desc') }}
               </p>
             </div>
             <div class="border border-okx-border rounded-lg p-4 bg-okx-gray/20">
@@ -394,10 +383,10 @@ const faq = [
                   class="icon iconfont dex-okx-defi-x1-liquidity-plus text-okx-primary"
                   style="font-size: 24px"
                 ></i>
-                <span class="font-semibold text-white">主动安全防护</span>
+                <span class="font-semibold text-white">{{ t('security.protection.title') }}</span>
               </div>
               <p class="text-okx-text/80 text-sm">
-                实时监测并拦截恶意域名、异常智能合约等潜在风险，构建动态防御体系。
+                {{ t('security.protection.desc') }}
               </p>
             </div>
             <div class="border border-okx-border rounded-lg p-4 bg-okx-gray/20">
@@ -406,10 +395,10 @@ const faq = [
                   class="icon iconfont dex-okx-defi-x1-liquidity-plus text-okx-primary"
                   style="font-size: 24px"
                 ></i>
-                <span class="font-semibold text-white">安全审计认证</span>
+                <span class="font-semibold text-white">{{ t('security.audit.title') }}</span>
               </div>
               <p class="text-okx-text/80 text-sm">
-                由全球顶尖网络安全团队执行穿透式审计，确保系统安全机制持续符合行业最高标准。
+                {{ t('security.audit.desc') }}
               </p>
             </div>
           </div>
@@ -435,7 +424,7 @@ const faq = [
       <div class="mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8">
         <div class="mb-6">
           <h2 class="font-display text-2xl font-semibold text-white sm:text-3xl">
-            一站式 Web3 门户
+            {{ t('networks.title') }}
           </h2>
         </div>
         <div class="overflow-hidden rounded-2xl bg-black">
@@ -456,7 +445,7 @@ const faq = [
 
     <!-- FAQ -->
     <section class="mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8">
-      <h2 class="font-display text-2xl font-semibold text-white sm:text-3xl">常见问题</h2>
+      <h2 class="font-display text-2xl font-semibold text-white sm:text-3xl">{{ t('faq.title') }}</h2>
       <Accordion class="mt-6" :items="faq" />
     </section>
 

src/components/Footer.vue

@@ -1,6 +1,49 @@
 <template>
   <footer class="border-t border-okx-border/70 bg-okx-black">
     <div class="mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8">
+      <div class="mb-8 flex justify-start">
+        <div ref="footerLanguageMenuRef" class="relative flex flex-col items-start"
+          @mouseenter="footerLanguageMenuOpen = true" @mouseleave="footerLanguageMenuOpen = false">
+          <button type="button"
+            class="flex items-center gap-3 rounded-none border border-white/30 bg-white/10 px-5 py-3 text-sm font-semibold text-okx-text transition hover:border-white/60 hover:bg-white/15"
+            aria-haspopup="true" :aria-expanded="footerLanguageMenuOpen" aria-controls="footer-language-menu"
+            @click.stop="toggleFooterLanguageMenu" @keydown.escape.prevent="footerLanguageMenuOpen = false">
+            <svg class="h-5 w-5 text-okx-text" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path
+                d="M12 21c4.971 0 9-4.029 9-9s-4.029-9-9-9-9 4.029-9 9 4.029 9 9 9Zm0 0c3 0 5-4.029 5-9s-2-9-5-9-5 4.029-5 9 2 9 5 9Zm-8-9h16"
+                stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+            <span>{{ footerCurrentLanguage.label }}</span>
+            <svg class="h-3.5 w-3.5 text-okx-text" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M4 6l4 4 4-4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
+                stroke-linejoin="round" />
+            </svg>
+          </button>
+
+          <Transition enter-active-class="transition duration-150 ease-out" enter-from-class="opacity-0 -translate-y-1"
+            enter-to-class="opacity-100 translate-y-0" leave-active-class="transition duration-100 ease-in"
+            leave-from-class="opacity-100 translate-y-0" leave-to-class="opacity-0 -translate-y-1">
+            <div v-if="footerLanguageMenuOpen" id="footer-language-menu"
+              class="absolute bottom-full w-64 border border-white/30 bg-okx-black/95 p-5 text-sm text-okx-text shadow-2xl backdrop-blur-lg">
+              <div class="pb-2 text-xs font-semibold uppercase tracking-wide text-white/60">{{ t('header.language') }}</div>
+              <div class="max-h-60 space-y-1 overflow-y-auto pr-1 footer-scrollbar">
+                <button v-for="lang in languages" :key="lang.id" type="button"
+                  class="flex w-full items-center justify-between rounded-xl px-3 py-1.5 text-left transition hover:bg-white/10"
+                  :class="{ 'bg-white/10': lang.id === footerCurrentLanguage.id }"
+                  @click.stop="selectFooterLanguage(lang)">
+                  <span :class="lang.id === footerCurrentLanguage.id ? 'text-white' : 'text-white/60'">{{ lang.label}}</span>
+                  <svg v-if="lang.id === footerCurrentLanguage.id" class="h-3.5 w-3.5 text-white" viewBox="0 0 16 16"
+                    fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M3.5 8l2.5 2.5L12.5 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
+                      stroke-linejoin="round" />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </Transition>
+        </div>
+      </div>
+
       <div class="grid grid-cols-1 gap-10 sm:grid-cols-2 lg:grid-cols-3">
         <div v-for="group in groups" :key="group.title">
           <h3 class="mb-4 font-display text-base font-semibold text-white">{{ group.title }}</h3>
@@ -11,11 +54,13 @@
           </ul>
         </div>
       </div>
-      <div class="mt-10 flex flex-col items-center justify-between gap-4 border-t border-okx-border/70 pt-6 sm:flex-row">
-        <p class="text-xs text-okx-text/60">© {{ new Date().getFullYear() }} OKX Web3</p>
+      <div
+        class="mt-10 flex flex-col items-center justify-between gap-4 border-t border-okx-border/70 pt-6 sm:flex-row">
+        <p class="text-xs text-okx-text/60">{{ t('footer.copyright', { year: new Date().getFullYear() }) }}</p>
         <div class="flex items-center gap-4">
-          <a :href="url('/help/okx-web3-ecosystem-privacy-policy')" class="text-xs text-okx-text/60 hover:text-white">隐私政策</a>
-          <a :href="url('/help/category/terms-of-agreement')" class="text-xs text-okx-text/60 hover:text-white">服务条款</a>
+          <a :href="url('/help/okx-web3-ecosystem-privacy-policy')"
+            class="text-xs text-okx-text/60 hover:text-white">{{ t('footer.privacyPolicy') }}</a>
+          <a :href="url('/help/category/terms-of-agreement')" class="text-xs text-okx-text/60 hover:text-white">{{ t('footer.termsOfService') }}</a>
         </div>
       </div>
     </div>
@@ -23,50 +68,115 @@
 </template>
 
 <script setup lang="ts">
+import { onBeforeUnmount, onMounted, ref, computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { languageOptions, type LanguageOption } from '@/constants/languages'
+import { useLocale } from '@/composables/useLocale'
+import type { LocaleKey } from '@/i18n'
+
+const { t } = useI18n()
+const { currentLocale, setLocale } = useLocale()
+
 const base = 'https://web3.okx.com/zh-hans'
 const url = (path: string) => `${base}${path}`
 
 interface GroupItem { text: string; href: string }
 interface Group { title: string; items: GroupItem[] }
 
-const groups: Group[] = [
+const groups = computed<Group[]>(() => [
   {
-    title: '关于 OKX Wallet',
+    title: t('footer.about.title'),
     items: [
-      { text: '下载', href: url('/download') },
-      { text: '学院', href: url('/learn') },
-      { text: '关于我们', href: url('/about.html') },
-      { text: '就业机会', href: url('/join-us') },
-      { text: '联系我们', href: url('/contact-us.html') },
-      { text: '服务条款', href: url('/help/category/terms-of-agreement') },
-      { text: '隐私政策', href: url('/help/okx-web3-ecosystem-privacy-policy') }
+      { text: t('footer.about.download'), href: url('/download') },
+      { text: t('footer.about.learn'), href: url('/learn') },
+      { text: t('footer.about.aboutUs'), href: url('/about.html') },
+      { text: t('footer.about.careers'), href: url('/join-us') },
+      { text: t('footer.about.contact'), href: url('/contact-us.html') },
+      { text: t('footer.about.terms'), href: url('/help/category/terms-of-agreement') },
+      { text: t('footer.about.privacy'), href: url('/help/okx-web3-ecosystem-privacy-policy') }
     ]
   },
   {
-    title: '产品',
+    title: t('footer.products.title'),
     items: [
-      { text: '行情', href: url('/token') },
-      { text: '币币兑换', href: url('/dex-swap') },
-      { text: '市场', href: url('/marketplace/nft') },
-      { text: '赚币', href: url('/earn') },
-      { text: '发现', href: url('/discover') },
-      { text: '开发者中心', href: url('/build') },
-      { text: '浏览器', href: url('/explorer') },
-      { text: '安全', href: url('/security') }
+      { text: t('footer.products.market'), href: url('/token') },
+      { text: t('footer.products.swap'), href: url('/dex-swap') },
+      { text: t('footer.products.marketplace'), href: url('/marketplace/nft') },
+      { text: t('footer.products.earn'), href: url('/earn') },
+      { text: t('footer.products.discover'), href: url('/discover') },
+      { text: t('footer.products.build'), href: url('/build') },
+      { text: t('footer.products.explorer'), href: url('/explorer') },
+      { text: t('footer.products.security'), href: url('/security') }
     ]
   },
   {
-    title: '用户支持',
+    title: t('footer.support.title'),
     items: [
-      { text: '帮助中心', href: url('/help') },
-      { text: '官方渠道验证', href: url('/support-center/channel-verification') },
-      { text: '公告', href: url('/help/category/announcements') },
-      { text: 'DEX 费率标准', href: url('/dex-fees') },
-      { text: '加入 OKX 社群', href: url('/community') },
-      { text: '比特币钱包', href: url('/wallet/bitcoin') },
-      { text: '以太坊钱包', href: url('/wallet/ethereum') },
-      { text: 'Solana 钱包', href: url('/wallet/solana') }
+      { text: t('footer.support.help'), href: url('/help') },
+      { text: t('footer.support.verification'), href: url('/support-center/channel-verification') },
+      { text: t('footer.support.announcements'), href: url('/help/category/announcements') },
+      { text: t('footer.support.fees'), href: url('/dex-fees') },
+      { text: t('footer.support.community'), href: url('/community') },
+      { text: t('footer.support.bitcoinWallet'), href: url('/wallet/bitcoin') },
+      { text: t('footer.support.ethereumWallet'), href: url('/wallet/ethereum') },
+      { text: t('footer.support.solanaWallet'), href: url('/wallet/solana') }
     ]
   }
-]
+])
+
+const languages = languageOptions
+const footerLanguageMenuOpen = ref(false)
+const footerLanguageMenuRef = ref<HTMLElement | null>(null)
+
+// 根据当前语言代码找到对应的语言选项
+const footerCurrentLanguage = computed(() => {
+  return languages.find((lang) => lang.id === currentLocale.value) || languages[2] // 默认英语
+})
+
+const toggleFooterLanguageMenu = () => {
+  footerLanguageMenuOpen.value = !footerLanguageMenuOpen.value
+}
+
+const selectFooterLanguage = (lang: LanguageOption) => {
+  setLocale(lang.id as LocaleKey)
+  footerLanguageMenuOpen.value = false
+}
+
+const handleFooterClickOutside = (event: MouseEvent) => {
+  if (footerLanguageMenuRef.value && !footerLanguageMenuRef.value.contains(event.target as Node)) {
+    footerLanguageMenuOpen.value = false
+  }
+}
+
+onMounted(() => {
+  document.addEventListener('click', handleFooterClickOutside)
+})
+
+onBeforeUnmount(() => {
+  document.removeEventListener('click', handleFooterClickOutside)
+})
 </script>
+
+<style scoped>
+.footer-scrollbar {
+  scrollbar-width: thin;
+  scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
+}
+
+.footer-scrollbar::-webkit-scrollbar {
+  width: 6px;
+}
+
+.footer-scrollbar::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.footer-scrollbar::-webkit-scrollbar-thumb {
+  background: rgba(255, 255, 255, 0.25);
+  border-radius: 9999px;
+}
+
+.footer-scrollbar::-webkit-scrollbar-thumb:hover {
+  background: rgba(255, 255, 255, 0.4);
+}
+</style>

src/composables/useLocale.ts

@@ -0,0 +1,36 @@
+import { ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import type { LocaleKey } from '@/i18n'
+import { saveLocale } from '@/utils/locale'
+
+// 全局语言状态
+const currentLocale = ref<LocaleKey>('en_US')
+
+// 创建全局语言管理 composable
+export function useLocale() {
+  const { locale } = useI18n()
+
+  // 设置语言（用户主动选择时调用）
+  const setLocale = (newLocale: LocaleKey) => {
+    currentLocale.value = newLocale
+    locale.value = newLocale
+    // 保存用户选择的语言到 localStorage
+    saveLocale(newLocale)
+  }
+
+  // 监听语言变化
+  watch(currentLocale, (newLocale) => {
+    locale.value = newLocale
+  })
+
+  return {
+    currentLocale,
+    setLocale,
+  }
+}
+
+// 初始化语言（页面加载时调用，不保存到 localStorage）
+export function initLocale(locale: LocaleKey) {
+  currentLocale.value = locale
+}
+

src/constants/languages.ts

@@ -0,0 +1,30 @@
+export interface LanguageOption {
+  id: string
+  label: string
+}
+
+export const languageOptions: LanguageOption[] = [
+  { id: 'zh_CN', label: '简体中文' },
+  { id: 'zh_TW', label: '繁體中文' },
+  { id: 'en_US', label: 'English' },
+  { id: 'vi_VN', label: 'Tiếng Việt' },
+  { id: 'ru_RU', label: 'Русский' },
+  { id: 'es_419', label: 'Español (Latinoamérica)' },
+  { id: 'id_ID', label: 'Bahasa Indonesia' },
+  { id: 'fr_FR', label: 'Français' },
+  { id: 'de_DE', label: 'Deutsch' },
+  { id: 'it_IT', label: 'Italiano' },
+  { id: 'pl_PL', label: 'Polski' },
+  { id: 'cs_CZ', label: 'Čeština' },
+  { id: 'ro_RO', label: 'Română' },
+  { id: 'pt_PT', label: 'Português (Portugal)' },
+  { id: 'pt_BR', label: 'Português (Brasil)' },
+  { id: 'uk_UA', label: 'Українська' },
+  { id: 'es_ES', label: 'Español (España)' },
+  { id: 'nl_NL', label: 'Nederlands' },
+  { id: 'ar_EH', label: 'العربية' },
+  { id: 'ja_JP', label: '日本語' },
+  { id: 'nb_NO', label: 'Norsk (bokmål)' },
+  { id: 'fi_FI', label: 'Suomi' },
+  { id: 'sv_SE', label: 'Svenska' },
+]

src/i18n.ts

@@ -0,0 +1,14 @@
+import { createI18n } from 'vue-i18n'
+import { messages, type LocaleKey } from './locales'
+
+// 创建 i18n 实例
+export const i18n = createI18n({
+  legacy: false, // 使用 Composition API 模式
+  locale: 'en_US', // 默认语言
+  fallbackLocale: 'en_US', // 后备语言
+  messages,
+  globalInjection: true, // 全局注入 $t 方法
+})
+
+export type { LocaleKey }
+

src/locales/ar-EH.ts

@@ -0,0 +1,4 @@
+// 阿拉伯语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/cs-CZ.ts

@@ -0,0 +1,4 @@
+// 捷克语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/de-DE.ts

@@ -0,0 +1,117 @@
+// 德语翻译
+export default {
+  header: {
+    slogan: 'Ihr Tor zu Web3',
+    language: 'Sprache',
+  },
+  hero: {
+    title: 'Ihre digitale ',
+    titleHighlight: 'Währung & \nWeb3',
+    titleSuffix: ' Gateway',
+    subtitle1: 'Native Unterstützung für über 130 Netzwerke, erkunden Sie Web3 mit Leichtigkeit',
+    subtitle2: 'OKX Wallet hilft Ihnen, verschiedene digitale Assets einfach zu verwalten und zu handeln',
+    downloadApp: 'App herunterladen',
+    scanToDownload: 'Scannen zum Herunterladen',
+    moreDownloads: 'Weitere Download-Optionen',
+    appStore: 'App Store',
+    iosStore: 'iOS App Store',
+    androidApk: 'Android APK',
+    androidPackage: 'Android-Paket',
+  },
+  features: {
+    storage: {
+      title: 'Asset-Speicherung',
+      desc: 'Speichern Sie beliebige digitale Assets in OKX Wallet, einschließlich BTC, ETH, USDT und beliebte Meme-Coins und NFTs. Unterstützt die Erstellung von bis zu 1.000 Sub-Wallet-Adressen gleichzeitig mit voller Kontrolle über die Verwaltung privater Schlüssel.',
+    },
+    swap: {
+      title: 'Token-Tausch',
+      desc: 'Wechseln Sie zwischen drei intelligenten Modi: Einfacher Modus, Pro-Modus und Meme-Modus. Einfach für Anfänger, präzise für Experten, erfüllt On-Chain-Handelsanforderungen für alle Benutzerstufen.',
+    },
+    stake: {
+      title: 'On-Chain-Staking',
+      desc: 'Aktivieren Sie den Wert digitaler Assets und entdecken Sie qualitativ hochwertige On-Chain-Staking-Pools. Aggregieren Sie intelligent Haupt-Blockchain-Staking-Protokolle, verfolgen Sie Multi-Chain-Erträge in Echtzeit über Self-Custody-Wallet.',
+    },
+    analyze: {
+      title: 'Datenanalyse',
+      desc: 'Ausgestattet mit Echtzeit-Datenterminal, überwachen Sie Liquidität, Preisschwankungen und große Transaktionen auf Haupt-Blockchains und Top-DEXs. Verfolgen Sie Smart-Money-Adressbewegungen, konfigurieren Sie personalisierte Alarmstrategien, um On-Chain-Chancen zu nutzen.',
+    },
+  },
+  security: {
+    label: 'Sicherheitssystem',
+    title: 'Hochmoderne Self-Custody-Technologie, global zertifizierte Sicherheitsstandards',
+    control: {
+      title: 'Asset-Selbstkontrolle',
+      desc: 'Besitzen Sie wirklich Ihre digitalen Assets, gesichert durch mnemonische Phrasen, private Schlüssel, biometrische Authentifizierung und Verschlüsselungstechnologie.',
+    },
+    protection: {
+      title: 'Proaktiver Sicherheitsschutz',
+      desc: 'Echtzeit-Überwachung und -Blockierung bösartiger Domains, anomaler Smart Contracts und anderer potenzieller Risiken, Aufbau eines dynamischen Verteidigungssystems.',
+    },
+    audit: {
+      title: 'Sicherheitsaudit-Zertifizierung',
+      desc: 'Penetrationstests durchgeführt von Weltklasse-Cybersecurity-Teams, die sicherstellen, dass Systemsicherheitsmechanismen kontinuierlich die höchsten Industriestandards erfüllen.',
+    },
+  },
+  networks: {
+    title: 'All-in-One Web3-Portal',
+  },
+  faq: {
+    title: 'FAQ',
+    items: [
+      {
+        q: 'Wie beginne ich mit OKX Wallet?',
+        a: 'Unterstützung für sofortige Registrierung im Web oder Download der mobilen App. Sie können auch die Browser-Erweiterung verwenden, um nahtlos über das Wallet Connect-Protokoll mit DApps im gesamten Netzwerk zu verbinden.',
+      },
+      {
+        q: 'Warum OKX Wallet wählen?',
+        a: 'OKX Wallet erfüllt umfassende Anforderungen einschließlich Asset-Speicherung, On-Chain-Analyse, Cross-Chain-Handel und digitaler Kreation durch Multi-Chain-Interconnection-Architektur und realisiert wirklich das Produktkonzept "Ein Wallet, unendliche Möglichkeiten".',
+      },
+      {
+        q: 'Ist OKX Wallet ein Custodial Wallet?',
+        a: 'OKX Wallet ist ein vollständig selbstverwaltetes Non-Custodial-Krypto-Wallet, bei dem Benutzer exklusive Kontrolle über ihre Assets haben. Unterstützt Asset-Wiederherstellung über private Schlüssel in jedem kompatiblen Wallet und gewährleistet Benutzerkomfort.',
+      },
+      {
+        q: 'Was sind die Vorteile von OKX Wallet?',
+        a: 'Als bevorzugte sichere Speicherlösung für professionelle Benutzer integriert OKX Wallet ein natives DApp-Ökosystem, einschließlich des On-Chain-Aggregator-Produkts OKX DEX. Die DEX-Routing-Engine aggregiert über 100 Liquiditätspools und dezentrale Börsen in Echtzeit und führt intelligent Trades zum optimalen Preis aus. Darüber hinaus können Sie OKX Wallet verwenden, um digitale Assets wie NFTs zu erstellen und zu verwalten.',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'Über OKX Wallet',
+      download: 'Herunterladen',
+      learn: 'Lernen',
+      aboutUs: 'Über uns',
+      careers: 'Karriere',
+      contact: 'Kontaktieren Sie uns',
+      terms: 'Nutzungsbedingungen',
+      privacy: 'Datenschutzrichtlinie',
+    },
+    products: {
+      title: 'Produkte',
+      market: 'Markt',
+      swap: 'Tauschen',
+      marketplace: 'Marktplatz',
+      earn: 'Verdienen',
+      discover: 'Entdecken',
+      build: 'Entwicklerzentrum',
+      explorer: 'Explorer',
+      security: 'Sicherheit',
+    },
+    support: {
+      title: 'Benutzersupport',
+      help: 'Hilfezentrum',
+      verification: 'Offizielle Kanalverifizierung',
+      announcements: 'Ankündigungen',
+      fees: 'DEX-Gebührenstandards',
+      community: 'OKX-Community beitreten',
+      bitcoinWallet: 'Bitcoin-Wallet',
+      ethereumWallet: 'Ethereum-Wallet',
+      solanaWallet: 'Solana-Wallet',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'Datenschutzrichtlinie',
+    termsOfService: 'Nutzungsbedingungen',
+  },
+}
+

src/locales/en-US.ts

@@ -0,0 +1,116 @@
+export default {
+  header: {
+    slogan: 'Your Gateway to Web3',
+    language: 'Language',
+  },
+  hero: {
+    title: 'Your Digital ',
+    titleHighlight: 'Currency & \nWeb3',
+    titleSuffix: ' Gateway',
+    subtitle1: 'Native support for 130+ networks, explore Web3 with ease',
+    subtitle2: 'OKX Wallet helps you easily manage and trade various digital assets',
+    downloadApp: 'Download App',
+    scanToDownload: 'Scan to Download',
+    moreDownloads: 'More Download Options',
+    appStore: 'App Store',
+    iosStore: 'iOS App Store',
+    androidApk: 'Android APK',
+    androidPackage: 'Android Package',
+  },
+  features: {
+    storage: {
+      title: 'Asset Storage',
+      desc: 'Store any digital assets in OKX Wallet, including BTC, ETH, USDT, and popular Meme coins and NFTs. Support creating up to 1,000 sub-wallet addresses at once, with full control over private key management.',
+    },
+    swap: {
+      title: 'Token Swap',
+      desc: 'Switch between three smart modes: Simple Mode, Pro Mode, and Meme Mode. Easy for beginners, precise for experts, meeting on-chain trading needs for all user levels.',
+    },
+    stake: {
+      title: 'On-Chain Staking',
+      desc: 'Activate digital asset value and discover quality on-chain staking pools. Intelligently aggregate mainstream blockchain staking protocols, track multi-chain yields in real-time through self-custodial wallet.',
+    },
+    analyze: {
+      title: 'Data Analysis',
+      desc: 'Equipped with real-time data terminal, monitor liquidity, price fluctuations, and large transactions on mainstream blockchains and top DEXs. Track smart money address movements, configure personalized alert strategies to seize on-chain opportunities.',
+    },
+  },
+  security: {
+    label: 'Security System',
+    title: 'Cutting-edge Self-Custody Technology, Globally Certified Security Standards',
+    control: {
+      title: 'Asset Self-Control',
+      desc: 'Truly own your digital assets, secured through mnemonic phrases, private keys, biometric authentication, and encryption technology.',
+    },
+    protection: {
+      title: 'Proactive Security Protection',
+      desc: 'Real-time monitoring and blocking of malicious domains, abnormal smart contracts, and other potential risks, building a dynamic defense system.',
+    },
+    audit: {
+      title: 'Security Audit Certification',
+      desc: 'Penetration audits conducted by world-class cybersecurity teams, ensuring system security mechanisms continuously meet the highest industry standards.',
+    },
+  },
+  networks: {
+    title: 'One-Stop Web3 Portal',
+  },
+  faq: {
+    title: 'FAQ',
+    items: [
+      {
+        q: 'How to start using OKX Wallet?',
+        a: 'Support instant registration on web or download mobile app. You can also use browser extension to seamlessly connect to DApps across the network through Wallet Connect protocol.',
+      },
+      {
+        q: 'Why choose OKX Wallet?',
+        a: 'OKX Wallet meets all-dimensional needs including asset storage, on-chain analysis, cross-chain trading, and digital creation through multi-chain interconnection architecture, truly realizing the product concept of "One Wallet, Infinite Possibilities".',
+      },
+      {
+        q: 'Is OKX Wallet a custodial wallet?',
+        a: 'OKX Wallet is a fully self-managed non-custodial crypto wallet, where users have exclusive control over their assets. Support asset recovery through private keys in any compatible wallet, ensuring user convenience.',
+      },
+      {
+        q: 'What are the advantages of OKX Wallet?',
+        a: 'As the preferred secure storage solution for professional users, OKX Wallet integrates native DApp ecosystem, including on-chain aggregator product OKX DEX. The DEX routing engine aggregates over 100 liquidity pools and decentralized exchanges in real-time, intelligently executing optimal price trades. Additionally, you can use OKX Wallet to create and manage digital assets such as NFTs.',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'About OKX Wallet',
+      download: 'Download',
+      learn: 'Learn',
+      aboutUs: 'About Us',
+      careers: 'Careers',
+      contact: 'Contact Us',
+      terms: 'Terms of Service',
+      privacy: 'Privacy Policy',
+    },
+    products: {
+      title: 'Products',
+      market: 'Market',
+      swap: 'Swap',
+      marketplace: 'Marketplace',
+      earn: 'Earn',
+      discover: 'Discover',
+      build: 'Developer Center',
+      explorer: 'Explorer',
+      security: 'Security',
+    },
+    support: {
+      title: 'User Support',
+      help: 'Help Center',
+      verification: 'Official Channel Verification',
+      announcements: 'Announcements',
+      fees: 'DEX Fee Standards',
+      community: 'Join OKX Community',
+      bitcoinWallet: 'Bitcoin Wallet',
+      ethereumWallet: 'Ethereum Wallet',
+      solanaWallet: 'Solana Wallet',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'Privacy Policy',
+    termsOfService: 'Terms of Service',
+  },
+}
+

src/locales/es-419.ts

@@ -0,0 +1,116 @@
+export default {
+  header: {
+    slogan: 'Tu puerta de entrada a Web3',
+    language: 'Idioma',
+  },
+  hero: {
+    title: 'Tu moneda ',
+    titleHighlight: 'digital y \nWeb3',
+    titleSuffix: ' puerta de entrada',
+    subtitle1: 'Soporte nativo para más de 130 redes, explorá Web3 con facilidad',
+    subtitle2: 'OKX Wallet te ayuda a gestionar y comerciar fácilmente varios activos digitales',
+    downloadApp: 'Descargar App',
+    scanToDownload: 'Escanear para descargar',
+    moreDownloads: 'Más opciones de descarga',
+    appStore: 'App Store',
+    iosStore: 'Tienda de aplicaciones iOS',
+    androidApk: 'Android APK',
+    androidPackage: 'Paquete Android',
+  },
+  features: {
+    storage: {
+      title: 'Almacenamiento de activos',
+      desc: 'Almacená cualquier activo digital en OKX Wallet, incluyendo BTC, ETH, USDT y monedas Meme populares y NFTs. Soporta la creación de hasta 1,000 direcciones de sub-carteras a la vez, con control total sobre la gestión de claves privadas.',
+    },
+    swap: {
+      title: 'Intercambio de tokens',
+      desc: 'Cambiá entre tres modos inteligentes: Modo Simple, Modo Pro y Modo Meme. Fácil para principiantes, preciso para expertos, satisfaciendo las necesidades de comercio on-chain para todos los niveles de usuarios.',
+    },
+    stake: {
+      title: 'Staking on-chain',
+      desc: 'Activá el valor de los activos digitales y descubrí pools de staking de calidad on-chain. Agrega inteligentemente protocolos de staking de blockchain principales, rastreá rendimientos multi-cadena en tiempo real a través de una cartera auto-custodiada.',
+    },
+    analyze: {
+      title: 'Análisis de datos',
+      desc: 'Equipado con terminal de datos en tiempo real, monitoreá liquidez, fluctuaciones de precios y transacciones grandes en blockchains principales y DEXs principales. Rastreá movimientos de direcciones de dinero inteligente, configurá estrategias de alerta personalizadas para aprovechar oportunidades on-chain.',
+    },
+  },
+  security: {
+    label: 'Sistema de seguridad',
+    title: 'Tecnología de auto-custodia de vanguardia, estándares de seguridad certificados globalmente',
+    control: {
+      title: 'Auto-control de activos',
+      desc: 'Poseé verdaderamente tus activos digitales, asegurados mediante frases mnemónicas, claves privadas, autenticación biométrica y tecnología de encriptación.',
+    },
+    protection: {
+      title: 'Protección de seguridad proactiva',
+      desc: 'Monitoreo y bloqueo en tiempo real de dominios maliciosos, contratos inteligentes anómalos y otros riesgos potenciales, construyendo un sistema de defensa dinámico.',
+    },
+    audit: {
+      title: 'Certificación de auditoría de seguridad',
+      desc: 'Auditorías de penetración realizadas por equipos de ciberseguridad de clase mundial, asegurando que los mecanismos de seguridad del sistema cumplan continuamente con los más altos estándares de la industria.',
+    },
+  },
+  networks: {
+    title: 'Portal Web3 todo en uno',
+  },
+  faq: {
+    title: 'Preguntas frecuentes',
+    items: [
+      {
+        q: '¿Cómo empezar a usar OKX Wallet?',
+        a: 'Soporte de registro instantáneo en web o descarga de aplicación móvil. También podés usar la extensión del navegador para conectarte sin problemas a DApps en toda la red a través del protocolo Wallet Connect.',
+      },
+      {
+        q: '¿Por qué elegir OKX Wallet?',
+        a: 'OKX Wallet satisface necesidades integrales que incluyen almacenamiento de activos, análisis on-chain, comercio cross-chain y creación digital a través de una arquitectura de interconexión multi-cadena, realizando verdaderamente el concepto de producto "Una Cartera, Posibilidades Infinitas".',
+      },
+      {
+        q: '¿Es OKX Wallet una cartera custodiada?',
+        a: 'OKX Wallet es una cartera cripto no custodiada completamente auto-gestionada, donde los usuarios tienen control exclusivo sobre sus activos. Soporte de recuperación de activos a través de claves privadas en cualquier cartera compatible, asegurando la conveniencia del usuario.',
+      },
+      {
+        q: '¿Cuáles son las ventajas de OKX Wallet?',
+        a: 'Como la solución de almacenamiento seguro preferida para usuarios profesionales, OKX Wallet integra un ecosistema DApp nativo, incluyendo el producto agregador on-chain OKX DEX. El motor de enrutamiento DEX agrega más de 100 pools de liquidez y exchanges descentralizados en tiempo real, ejecutando inteligentemente operaciones al precio óptimo. Además, podés usar OKX Wallet para crear y gestionar activos digitales como NFTs.',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'Acerca de OKX Wallet',
+      download: 'Descargar',
+      learn: 'Aprender',
+      aboutUs: 'Sobre nosotros',
+      careers: 'Carreras',
+      contact: 'Contactanos',
+      terms: 'Términos de servicio',
+      privacy: 'Política de privacidad',
+    },
+    products: {
+      title: 'Productos',
+      market: 'Mercado',
+      swap: 'Intercambio',
+      marketplace: 'Mercado',
+      earn: 'Ganar',
+      discover: 'Descubrir',
+      build: 'Centro de desarrolladores',
+      explorer: 'Explorador',
+      security: 'Seguridad',
+    },
+    support: {
+      title: 'Soporte al usuario',
+      help: 'Centro de ayuda',
+      verification: 'Verificación de canal oficial',
+      announcements: 'Anuncios',
+      fees: 'Estándares de tarifas DEX',
+      community: 'Unite a la comunidad OKX',
+      bitcoinWallet: 'Cartera Bitcoin',
+      ethereumWallet: 'Cartera Ethereum',
+      solanaWallet: 'Cartera Solana',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'Política de privacidad',
+    termsOfService: 'Términos de servicio',
+  },
+}
+

src/locales/es-ES.ts

@@ -0,0 +1,116 @@
+export default {
+  header: {
+    slogan: 'Tu puerta de entrada a Web3',
+    language: 'Idioma',
+  },
+  hero: {
+    title: 'Tu moneda ',
+    titleHighlight: 'digital y \nWeb3',
+    titleSuffix: ' puerta de entrada',
+    subtitle1: 'Soporte nativo para más de 130 redes, explora Web3 con facilidad',
+    subtitle2: 'OKX Wallet te ayuda a gestionar y comerciar fácilmente varios activos digitales',
+    downloadApp: 'Descargar App',
+    scanToDownload: 'Escanear para descargar',
+    moreDownloads: 'Más opciones de descarga',
+    appStore: 'App Store',
+    iosStore: 'Tienda de aplicaciones iOS',
+    androidApk: 'Android APK',
+    androidPackage: 'Paquete Android',
+  },
+  features: {
+    storage: {
+      title: 'Almacenamiento de activos',
+      desc: 'Almacena cualquier activo digital en OKX Wallet, incluyendo BTC, ETH, USDT y monedas Meme populares y NFTs. Soporta la creación de hasta 1,000 direcciones de sub-carteras a la vez, con control total sobre la gestión de claves privadas.',
+    },
+    swap: {
+      title: 'Intercambio de tokens',
+      desc: 'Cambia entre tres modos inteligentes: Modo Simple, Modo Pro y Modo Meme. Fácil para principiantes, preciso para expertos, satisfaciendo las necesidades de comercio on-chain para todos los niveles de usuarios.',
+    },
+    stake: {
+      title: 'Staking on-chain',
+      desc: 'Activa el valor de los activos digitales y descubre pools de staking de calidad on-chain. Agrega inteligentemente protocolos de staking de blockchain principales, rastrea rendimientos multi-cadena en tiempo real a través de una cartera auto-custodiada.',
+    },
+    analyze: {
+      title: 'Análisis de datos',
+      desc: 'Equipado con terminal de datos en tiempo real, monitorea liquidez, fluctuaciones de precios y transacciones grandes en blockchains principales y DEXs principales. Rastrea movimientos de direcciones de dinero inteligente, configura estrategias de alerta personalizadas para aprovechar oportunidades on-chain.',
+    },
+  },
+  security: {
+    label: 'Sistema de seguridad',
+    title: 'Tecnología de auto-custodia de vanguardia, estándares de seguridad certificados globalmente',
+    control: {
+      title: 'Auto-control de activos',
+      desc: 'Posee verdaderamente tus activos digitales, asegurados mediante frases mnemónicas, claves privadas, autenticación biométrica y tecnología de encriptación.',
+    },
+    protection: {
+      title: 'Protección de seguridad proactiva',
+      desc: 'Monitoreo y bloqueo en tiempo real de dominios maliciosos, contratos inteligentes anómalos y otros riesgos potenciales, construyendo un sistema de defensa dinámico.',
+    },
+    audit: {
+      title: 'Certificación de auditoría de seguridad',
+      desc: 'Auditorías de penetración realizadas por equipos de ciberseguridad de clase mundial, asegurando que los mecanismos de seguridad del sistema cumplan continuamente con los más altos estándares de la industria.',
+    },
+  },
+  networks: {
+    title: 'Portal Web3 todo en uno',
+  },
+  faq: {
+    title: 'Preguntas frecuentes',
+    items: [
+      {
+        q: '¿Cómo empezar a usar OKX Wallet?',
+        a: 'Soporte de registro instantáneo en web o descarga de aplicación móvil. También puedes usar la extensión del navegador para conectarte sin problemas a DApps en toda la red a través del protocolo Wallet Connect.',
+      },
+      {
+        q: '¿Por qué elegir OKX Wallet?',
+        a: 'OKX Wallet satisface necesidades integrales que incluyen almacenamiento de activos, análisis on-chain, comercio cross-chain y creación digital a través de una arquitectura de interconexión multi-cadena, realizando verdaderamente el concepto de producto "Una Cartera, Posibilidades Infinitas".',
+      },
+      {
+        q: '¿Es OKX Wallet una cartera custodiada?',
+        a: 'OKX Wallet es una cartera cripto no custodiada completamente auto-gestionada, donde los usuarios tienen control exclusivo sobre sus activos. Soporte de recuperación de activos a través de claves privadas en cualquier cartera compatible, asegurando la conveniencia del usuario.',
+      },
+      {
+        q: '¿Cuáles son las ventajas de OKX Wallet?',
+        a: 'Como la solución de almacenamiento seguro preferida para usuarios profesionales, OKX Wallet integra un ecosistema DApp nativo, incluyendo el producto agregador on-chain OKX DEX. El motor de enrutamiento DEX agrega más de 100 pools de liquidez y exchanges descentralizados en tiempo real, ejecutando inteligentemente operaciones al precio óptimo. Además, puedes usar OKX Wallet para crear y gestionar activos digitales como NFTs.',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'Acerca de OKX Wallet',
+      download: 'Descargar',
+      learn: 'Aprender',
+      aboutUs: 'Sobre nosotros',
+      careers: 'Carreras',
+      contact: 'Contáctanos',
+      terms: 'Términos de servicio',
+      privacy: 'Política de privacidad',
+    },
+    products: {
+      title: 'Productos',
+      market: 'Mercado',
+      swap: 'Intercambio',
+      marketplace: 'Mercado',
+      earn: 'Ganar',
+      discover: 'Descubrir',
+      build: 'Centro de desarrolladores',
+      explorer: 'Explorador',
+      security: 'Seguridad',
+    },
+    support: {
+      title: 'Soporte al usuario',
+      help: 'Centro de ayuda',
+      verification: 'Verificación de canal oficial',
+      announcements: 'Anuncios',
+      fees: 'Estándares de tarifas DEX',
+      community: 'Únete a la comunidad OKX',
+      bitcoinWallet: 'Cartera Bitcoin',
+      ethereumWallet: 'Cartera Ethereum',
+      solanaWallet: 'Cartera Solana',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'Política de privacidad',
+    termsOfService: 'Términos de servicio',
+  },
+}
+

src/locales/fi-FI.ts

@@ -0,0 +1,4 @@
+// 芬兰语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/fr-FR.ts

@@ -0,0 +1,117 @@
+// 法语翻译
+export default {
+  header: {
+    slogan: 'Votre passerelle vers Web3',
+    language: 'Langue',
+  },
+  hero: {
+    title: 'Votre monnaie ',
+    titleHighlight: 'numérique et \nWeb3',
+    titleSuffix: ' passerelle',
+    subtitle1: 'Support natif pour plus de 130 réseaux, explorez Web3 facilement',
+    subtitle2: 'OKX Wallet vous aide à gérer et échanger facilement divers actifs numériques',
+    downloadApp: 'Télécharger l\'App',
+    scanToDownload: 'Scanner pour télécharger',
+    moreDownloads: 'Plus d\'options de téléchargement',
+    appStore: 'App Store',
+    iosStore: 'App Store iOS',
+    androidApk: 'Android APK',
+    androidPackage: 'Package Android',
+  },
+  features: {
+    storage: {
+      title: 'Stockage d\'actifs',
+      desc: 'Stockez n\'importe quel actif numérique dans OKX Wallet, y compris BTC, ETH, USDT et les pièces Meme populaires et NFT. Prend en charge la création de jusqu\'à 1 000 adresses de sous-portefeuilles à la fois, avec un contrôle total sur la gestion des clés privées.',
+    },
+    swap: {
+      title: 'Échange de tokens',
+      desc: 'Basculez entre trois modes intelligents : Mode Simple, Mode Pro et Mode Meme. Facile pour les débutants, précis pour les experts, répondant aux besoins de trading on-chain pour tous les niveaux d\'utilisateurs.',
+    },
+    stake: {
+      title: 'Staking on-chain',
+      desc: 'Activez la valeur des actifs numériques et découvrez des pools de staking de qualité on-chain. Agrégez intelligemment les protocoles de staking blockchain principaux, suivez les rendements multi-chaînes en temps réel via un portefeuille auto-custodié.',
+    },
+    analyze: {
+      title: 'Analyse de données',
+      desc: 'Équipé d\'un terminal de données en temps réel, surveillez la liquidité, les fluctuations de prix et les grandes transactions sur les blockchains principales et les DEX principaux. Suivez les mouvements d\'adresses smart money, configurez des stratégies d\'alerte personnalisées pour saisir les opportunités on-chain.',
+    },
+  },
+  security: {
+    label: 'Système de sécurité',
+    title: 'Technologie d\'auto-garde de pointe, normes de sécurité certifiées mondialement',
+    control: {
+      title: 'Auto-contrôle des actifs',
+      desc: 'Possédez vraiment vos actifs numériques, sécurisés par des phrases mnémoniques, des clés privées, une authentification biométrique et une technologie de cryptage.',
+    },
+    protection: {
+      title: 'Protection de sécurité proactive',
+      desc: 'Surveillance et blocage en temps réel des domaines malveillants, des contrats intelligents anormaux et d\'autres risques potentiels, construisant un système de défense dynamique.',
+    },
+    audit: {
+      title: 'Certification d\'audit de sécurité',
+      desc: 'Audits de pénétration effectués par des équipes de cybersécurité de classe mondiale, garantissant que les mécanismes de sécurité du système répondent continuellement aux normes les plus élevées de l\'industrie.',
+    },
+  },
+  networks: {
+    title: 'Portail Web3 tout-en-un',
+  },
+  faq: {
+    title: 'FAQ',
+    items: [
+      {
+        q: 'Comment commencer à utiliser OKX Wallet ?',
+        a: 'Support d\'inscription instantanée sur le web ou téléchargement d\'application mobile. Vous pouvez également utiliser l\'extension de navigateur pour vous connecter de manière transparente aux DApps sur tout le réseau via le protocole Wallet Connect.',
+      },
+      {
+        q: 'Pourquoi choisir OKX Wallet ?',
+        a: 'OKX Wallet répond aux besoins globaux incluant le stockage d\'actifs, l\'analyse on-chain, le trading cross-chain et la création numérique grâce à une architecture d\'interconnexion multi-chaînes, réalisant vraiment le concept de produit "Un Portefeuille, Possibilités Infinies".',
+      },
+      {
+        q: 'OKX Wallet est-il un portefeuille custodial ?',
+        a: 'OKX Wallet est un portefeuille crypto non-custodial entièrement auto-géré, où les utilisateurs ont un contrôle exclusif sur leurs actifs. Support de récupération d\'actifs via des clés privées dans n\'importe quel portefeuille compatible, assurant la commodité de l\'utilisateur.',
+      },
+      {
+        q: 'Quels sont les avantages d\'OKX Wallet ?',
+        a: 'En tant que solution de stockage sécurisé préférée pour les utilisateurs professionnels, OKX Wallet intègre un écosystème DApp natif, incluant le produit agrégateur on-chain OKX DEX. Le moteur de routage DEX agrège plus de 100 pools de liquidité et exchanges décentralisés en temps réel, exécutant intelligemment des transactions au prix optimal. De plus, vous pouvez utiliser OKX Wallet pour créer et gérer des actifs numériques tels que les NFT.',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'À propos d\'OKX Wallet',
+      download: 'Télécharger',
+      learn: 'Apprendre',
+      aboutUs: 'À propos de nous',
+      careers: 'Carrières',
+      contact: 'Nous contacter',
+      terms: 'Conditions de service',
+      privacy: 'Politique de confidentialité',
+    },
+    products: {
+      title: 'Produits',
+      market: 'Marché',
+      swap: 'Échange',
+      marketplace: 'Place de marché',
+      earn: 'Gagner',
+      discover: 'Découvrir',
+      build: 'Centre de développeurs',
+      explorer: 'Explorateur',
+      security: 'Sécurité',
+    },
+    support: {
+      title: 'Support utilisateur',
+      help: 'Centre d\'aide',
+      verification: 'Vérification du canal officiel',
+      announcements: 'Annonces',
+      fees: 'Standards de frais DEX',
+      community: 'Rejoindre la communauté OKX',
+      bitcoinWallet: 'Portefeuille Bitcoin',
+      ethereumWallet: 'Portefeuille Ethereum',
+      solanaWallet: 'Portefeuille Solana',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'Politique de confidentialité',
+    termsOfService: 'Conditions de service',
+  },
+}
+

src/locales/id-ID.ts

@@ -0,0 +1,117 @@
+// 印尼语翻译
+export default {
+  header: {
+    slogan: 'Gerbang Anda ke Web3',
+    language: 'Bahasa',
+  },
+  hero: {
+    title: 'Mata uang ',
+    titleHighlight: 'digital & \nWeb3',
+    titleSuffix: ' Anda',
+    subtitle1: 'Dukungan asli untuk 130+ jaringan, jelajahi Web3 dengan mudah',
+    subtitle2: 'OKX Wallet membantu Anda mengelola dan memperdagangkan berbagai aset digital dengan mudah',
+    downloadApp: 'Unduh Aplikasi',
+    scanToDownload: 'Pindai untuk Mengunduh',
+    moreDownloads: 'Opsi Unduhan Lainnya',
+    appStore: 'App Store',
+    iosStore: 'Toko Aplikasi iOS',
+    androidApk: 'Android APK',
+    androidPackage: 'Paket Android',
+  },
+  features: {
+    storage: {
+      title: 'Penyimpanan Aset',
+      desc: 'Simpan aset digital apa pun di OKX Wallet, termasuk BTC, ETH, USDT, dan koin Meme populer serta NFT. Mendukung pembuatan hingga 1.000 alamat sub-dompet sekaligus, dengan kontrol penuh atas manajemen kunci pribadi.',
+    },
+    swap: {
+      title: 'Tukar Token',
+      desc: 'Beralih antara tiga mode pintar: Mode Sederhana, Mode Pro, dan Mode Meme. Mudah untuk pemula, presisi untuk ahli, memenuhi kebutuhan perdagangan on-chain untuk semua tingkat pengguna.',
+    },
+    stake: {
+      title: 'Staking On-Chain',
+      desc: 'Aktifkan nilai aset digital dan temukan pool staking berkualitas on-chain. Agregasi cerdas protokol staking blockchain utama, lacak hasil multi-chain secara real-time melalui dompet self-custody.',
+    },
+    analyze: {
+      title: 'Analisis Data',
+      desc: 'Dilengkapi dengan terminal data real-time, pantau likuiditas, fluktuasi harga, dan transaksi besar di blockchain utama dan DEX teratas. Lacak pergerakan alamat smart money, konfigurasikan strategi peringatan yang dipersonalisasi untuk memanfaatkan peluang on-chain.',
+    },
+  },
+  security: {
+    label: 'Sistem Keamanan',
+    title: 'Teknologi Self-Custody Canggih, Standar Keamanan Bersertifikat Global',
+    control: {
+      title: 'Kontrol Aset Mandiri',
+      desc: 'Benar-benar memiliki aset digital Anda, diamankan melalui frasa mnemonik, kunci pribadi, autentikasi biometrik, dan teknologi enkripsi.',
+    },
+    protection: {
+      title: 'Perlindungan Keamanan Proaktif',
+      desc: 'Pemantauan dan pemblokiran real-time terhadap domain berbahaya, kontrak pintar yang tidak normal, dan risiko potensial lainnya, membangun sistem pertahanan dinamis.',
+    },
+    audit: {
+      title: 'Sertifikasi Audit Keamanan',
+      desc: 'Audit penetrasi yang dilakukan oleh tim keamanan siber kelas dunia, memastikan mekanisme keamanan sistem terus memenuhi standar industri tertinggi.',
+    },
+  },
+  networks: {
+    title: 'Portal Web3 Satu Atap',
+  },
+  faq: {
+    title: 'FAQ',
+    items: [
+      {
+        q: 'Bagaimana cara mulai menggunakan OKX Wallet?',
+        a: 'Mendukung pendaftaran instan di web atau unduh aplikasi seluler. Anda juga dapat menggunakan ekstensi browser untuk terhubung dengan mulus ke DApps di seluruh jaringan melalui protokol Wallet Connect.',
+      },
+      {
+        q: 'Mengapa memilih OKX Wallet?',
+        a: 'OKX Wallet memenuhi kebutuhan menyeluruh termasuk penyimpanan aset, analisis on-chain, perdagangan lintas-chain, dan kreasi digital melalui arsitektur interkoneksi multi-chain, benar-benar mewujudkan konsep produk "Satu Dompet, Kemungkinan Tak Terbatas".',
+      },
+      {
+        q: 'Apakah OKX Wallet merupakan dompet kustodian?',
+        a: 'OKX Wallet adalah dompet kripto non-kustodian yang sepenuhnya dikelola sendiri, di mana pengguna memiliki kontrol eksklusif atas aset mereka. Mendukung pemulihan aset melalui kunci pribadi di dompet yang kompatibel, memastikan kenyamanan pengguna.',
+      },
+      {
+        q: 'Apa keuntungan OKX Wallet?',
+        a: 'Sebagai solusi penyimpanan aman pilihan untuk pengguna profesional, OKX Wallet mengintegrasikan ekosistem DApp asli, termasuk produk agregator on-chain OKX DEX. Mesin routing DEX mengagregasi lebih dari 100 pool likuiditas dan bursa terdesentralisasi secara real-time, secara cerdas mengeksekusi perdagangan dengan harga optimal. Selain itu, Anda dapat menggunakan OKX Wallet untuk membuat dan mengelola aset digital seperti NFT.',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'Tentang OKX Wallet',
+      download: 'Unduh',
+      learn: 'Belajar',
+      aboutUs: 'Tentang Kami',
+      careers: 'Karir',
+      contact: 'Hubungi Kami',
+      terms: 'Ketentuan Layanan',
+      privacy: 'Kebijakan Privasi',
+    },
+    products: {
+      title: 'Produk',
+      market: 'Pasar',
+      swap: 'Tukar',
+      marketplace: 'Marketplace',
+      earn: 'Dapatkan',
+      discover: 'Jelajahi',
+      build: 'Pusat Pengembang',
+      explorer: 'Penjelajah',
+      security: 'Keamanan',
+    },
+    support: {
+      title: 'Dukungan Pengguna',
+      help: 'Pusat Bantuan',
+      verification: 'Verifikasi Saluran Resmi',
+      announcements: 'Pengumuman',
+      fees: 'Standar Biaya DEX',
+      community: 'Bergabung dengan Komunitas OKX',
+      bitcoinWallet: 'Dompet Bitcoin',
+      ethereumWallet: 'Dompet Ethereum',
+      solanaWallet: 'Dompet Solana',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'Kebijakan Privasi',
+    termsOfService: 'Ketentuan Layanan',
+  },
+}
+

src/locales/index.ts

@@ -0,0 +1,53 @@
+import zhCN from './zh-CN'
+import zhTW from './zh-TW'
+import enUS from './en-US'
+import jaJP from './ja-JP'
+import viVN from './vi-VN'
+import ruRU from './ru-RU'
+import esES from './es-ES'
+import es419 from './es-419'
+import idID from './id-ID'
+import frFR from './fr-FR'
+import deDE from './de-DE'
+import itIT from './it-IT'
+import plPL from './pl-PL'
+import csCZ from './cs-CZ'
+import roRO from './ro-RO'
+import ptPT from './pt-PT'
+import ptBR from './pt-BR'
+import ukUA from './uk-UA'
+import nlNL from './nl-NL'
+import arEH from './ar-EH'
+import nbNO from './nb-NO'
+import fiFI from './fi-FI'
+import svSE from './sv-SE'
+
+// 语言映射表
+export const messages = {
+  zh_CN: zhCN,
+  zh_TW: zhTW,
+  en_US: enUS,
+  ja_JP: jaJP,
+  vi_VN: viVN,
+  ru_RU: ruRU,
+  es_419: es419,
+  id_ID: idID,
+  fr_FR: frFR,
+  de_DE: deDE,
+  it_IT: itIT,
+  pl_PL: plPL,
+  cs_CZ: csCZ,
+  ro_RO: roRO,
+  pt_PT: ptPT,
+  pt_BR: ptBR,
+  uk_UA: ukUA,
+  es_ES: esES,
+  nl_NL: nlNL,
+  ar_EH: arEH,
+  nb_NO: nbNO,
+  fi_FI: fiFI,
+  sv_SE: svSE,
+}
+
+export type LocaleKey = keyof typeof messages
+

src/locales/it-IT.ts

@@ -0,0 +1,4 @@
+// 意大利语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/ja-JP.ts

@@ -0,0 +1,116 @@
+export default {
+  header: {
+    slogan: 'Web3への入り口、一つで十分',
+    language: '言語',
+  },
+  hero: {
+    title: 'あなたのデジタル',
+    titleHighlight: '通貨と\nWeb3',
+    titleSuffix: 'への入り口',
+    subtitle1: '130以上のネットワークをネイティブサポート、Web3を簡単に探索',
+    subtitle2: 'OKX Walletで様々なデジタル資産を簡単に管理・取引',
+    downloadApp: 'アプリをダウンロード',
+    scanToDownload: 'スキャンしてダウンロード',
+    moreDownloads: 'その他のダウンロード方法',
+    appStore: 'App Store',
+    iosStore: 'iOS App Store',
+    androidApk: 'Android APK',
+    androidPackage: 'Androidパッケージ',
+  },
+  features: {
+    storage: {
+      title: '資産保管',
+      desc: 'OKX WalletでBTC、ETH、USDT、人気のMemeコインやNFTを含むあらゆるデジタル資産を保管。一度に最大1,000のサブウォレットアドレスを作成でき、秘密鍵管理を完全にコントロール。',
+    },
+    swap: {
+      title: 'トークンスワップ',
+      desc: '3つのスマートモードを自由に切り替え：シンプルモード、プロモード、Memeモード。初心者でも簡単、専門家には精密な操作を提供し、すべてのユーザーレベルのオンチェーン取引ニーズに対応。',
+    },
+    stake: {
+      title: 'オンチェーンステーキング',
+      desc: 'デジタル資産の価値を活性化し、質の高いオンチェーンステーキングプールを発見。主要ブロックチェーンのステーキングプロトコルをインテリジェントに集約し、セルフカストディアルウォレットを通じてマルチチェーンの収益をリアルタイムで追跡。',
+    },
+    analyze: {
+      title: 'データ分析',
+      desc: 'リアルタイムデータ端末を搭載し、主要ブロックチェーンとトップDEXの流動性、価格変動、大口取引を監視。スマートマネーアドレスの動きを追跡し、パーソナライズされたアラート戦略を設定してオンチェーンの機会を掴む。',
+    },
+  },
+  security: {
+    label: 'セキュリティシステム',
+    title: '最先端のセルフカストディ技術、グローバル認証セキュリティ基準',
+    control: {
+      title: '資産の自己管理',
+      desc: 'ニーモニックフレーズ、秘密鍵、生体認証、暗号化技術を通じて、デジタル資産の真の所有権を確保。',
+    },
+    protection: {
+      title: 'プロアクティブセキュリティ保護',
+      desc: '悪意のあるドメイン、異常なスマートコントラクトなどの潜在的なリスクをリアルタイムで監視・ブロックし、動的防御システムを構築。',
+    },
+    audit: {
+      title: 'セキュリティ監査認証',
+      desc: '世界トップクラスのサイバーセキュリティチームによる侵入監査を実施し、システムセキュリティメカニズムが業界最高基準を継続的に満たすことを保証。',
+    },
+  },
+  networks: {
+    title: 'ワンストップWeb3ポータル',
+  },
+  faq: {
+    title: 'よくある質問',
+    items: [
+      {
+        q: 'OKX Walletの使用を開始するには？',
+        a: 'Webでの即時登録またはモバイルアプリのダウンロードをサポート。ブラウザ拡張機能を使用して、Wallet Connectプロトコルを通じてネットワーク全体のDAppにシームレスに接続することもできます。',
+      },
+      {
+        q: 'なぜOKX Walletを選ぶのか？',
+        a: 'OKX Walletは、マルチチェーン相互接続アーキテクチャを通じて、資産保管、オンチェーン分析、クロスチェーン取引、デジタル創作などの全方位的なニーズを満たし、「一つのウォレット、無限の可能性」という製品コンセプトを真に実現します。',
+      },
+      {
+        q: 'OKX Walletはカストディアルウォレットですか？',
+        a: 'OKX Walletは完全に自己管理型の非カストディアル暗号ウォレットで、ユーザーが資産を独占的にコントロールします。互換性のあるウォレットで秘密鍵を通じて資産を復元でき、ユーザーの利便性を確保します。',
+      },
+      {
+        q: 'OKX Walletの利点は何ですか？',
+        a: 'プロフェッショナルユーザーが選ぶ安全な保管ソリューションとして、OKX WalletはネイティブなDAppエコシステムを統合し、オンチェーンアグリゲーター製品OKX DEXを含みます。DEXルーティングエンジンは100以上の流動性プールと分散型取引所をリアルタイムで集約し、最適な価格での取引をインテリジェントに実行します。さらに、OKX WalletでNFTなどのデジタル資産の作成と管理が可能です。',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'OKX Walletについて',
+      download: 'ダウンロード',
+      learn: '学習',
+      aboutUs: '私たちについて',
+      careers: '採用情報',
+      contact: 'お問い合わせ',
+      terms: '利用規約',
+      privacy: 'プライバシーポリシー',
+    },
+    products: {
+      title: '製品',
+      market: 'マーケット',
+      swap: 'スワップ',
+      marketplace: 'マーケットプレイス',
+      earn: '収益',
+      discover: '発見',
+      build: '開発者センター',
+      explorer: 'エクスプローラー',
+      security: 'セキュリティ',
+    },
+    support: {
+      title: 'ユーザーサポート',
+      help: 'ヘルプセンター',
+      verification: '公式チャネル検証',
+      announcements: 'お知らせ',
+      fees: 'DEX手数料基準',
+      community: 'OKXコミュニティに参加',
+      bitcoinWallet: 'Bitcoinウォレット',
+      ethereumWallet: 'Ethereumウォレット',
+      solanaWallet: 'Solanaウォレット',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'プライバシーポリシー',
+    termsOfService: '利用規約',
+  },
+}
+

src/locales/nb-NO.ts

@@ -0,0 +1,4 @@
+// 挪威语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/nl-NL.ts

@@ -0,0 +1,4 @@
+// 荷兰语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/pl-PL.ts

@@ -0,0 +1,4 @@
+// 波兰语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/pt-BR.ts

@@ -0,0 +1,4 @@
+// 葡萄牙语(巴西) - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/pt-PT.ts

@@ -0,0 +1,4 @@
+// 葡萄牙语(葡萄牙) - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/ro-RO.ts

@@ -0,0 +1,4 @@
+// 罗马尼亚语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/ru-RU.ts

@@ -0,0 +1,116 @@
+export default {
+  header: {
+    slogan: 'Ваш шлюз в Web3',
+    language: 'Язык',
+  },
+  hero: {
+    title: 'Ваша цифровая ',
+    titleHighlight: 'валюта и \nWeb3',
+    titleSuffix: ' шлюз',
+    subtitle1: 'Встроенная поддержка более 130 сетей, легко исследуйте Web3',
+    subtitle2: 'OKX Wallet помогает легко управлять и торговать различными цифровыми активами',
+    downloadApp: 'Скачать приложение',
+    scanToDownload: 'Сканировать для загрузки',
+    moreDownloads: 'Больше вариантов загрузки',
+    appStore: 'App Store',
+    iosStore: 'Магазин приложений iOS',
+    androidApk: 'Android APK',
+    androidPackage: 'Пакет Android',
+  },
+  features: {
+    storage: {
+      title: 'Хранение активов',
+      desc: 'Храните любые цифровые активы в OKX Wallet, включая BTC, ETH, USDT и популярные Meme-монеты и NFT. Поддержка создания до 1000 адресов подкошельков одновременно с полным контролем над управлением приватными ключами.',
+    },
+    swap: {
+      title: 'Обмен токенов',
+      desc: 'Переключайтесь между тремя умными режимами: Простой режим, Про режим и Meme режим. Легко для новичков, точно для экспертов, удовлетворяя потребности в торговле on-chain для всех уровней пользователей.',
+    },
+    stake: {
+      title: 'Стейкинг on-chain',
+      desc: 'Активируйте стоимость цифровых активов и откройте для себя качественные пулы стейкинга on-chain. Интеллектуально агрегируйте протоколы стейкинга основных блокчейнов, отслеживайте доходность мультичейна в реальном времени через самохранящийся кошелек.',
+    },
+    analyze: {
+      title: 'Анализ данных',
+      desc: 'Оснащен терминалом данных в реальном времени, отслеживайте ликвидность, колебания цен и крупные транзакции на основных блокчейнах и топовых DEX. Отслеживайте движения адресов умных денег, настраивайте персонализированные стратегии оповещений, чтобы воспользоваться возможностями on-chain.',
+    },
+  },
+  security: {
+    label: 'Система безопасности',
+    title: 'Передовая технология самохранения, глобально сертифицированные стандарты безопасности',
+    control: {
+      title: 'Самоконтроль активов',
+      desc: 'Действительно владейте своими цифровыми активами, защищенными мнемоническими фразами, приватными ключами, биометрической аутентификацией и технологией шифрования.',
+    },
+    protection: {
+      title: 'Проактивная защита безопасности',
+      desc: 'Мониторинг и блокировка в реальном времени вредоносных доменов, аномальных смарт-контрактов и других потенциальных рисков, построение динамической системы защиты.',
+    },
+    audit: {
+      title: 'Сертификация аудита безопасности',
+      desc: 'Проникающие аудиты, проводимые командами кибербезопасности мирового класса, гарантируют, что механизмы безопасности системы постоянно соответствуют самым высоким отраслевым стандартам.',
+    },
+  },
+  networks: {
+    title: 'Универсальный портал Web3',
+  },
+  faq: {
+    title: 'Часто задаваемые вопросы',
+    items: [
+      {
+        q: 'Как начать использовать OKX Wallet?',
+        a: 'Поддержка мгновенной регистрации в веб-версии или загрузки мобильного приложения. Вы также можете использовать расширение браузера для бесшовного подключения к DApps по всей сети через протокол Wallet Connect.',
+      },
+      {
+        q: 'Почему стоит выбрать OKX Wallet?',
+        a: 'OKX Wallet удовлетворяет всесторонние потребности, включая хранение активов, анализ on-chain, кросс-чейн торговлю и цифровое творчество через архитектуру межцепочечного взаимодействия, действительно реализуя концепцию продукта "Один кошелек, бесконечные возможности".',
+      },
+      {
+        q: 'Является ли OKX Wallet кастодиальным кошельком?',
+        a: 'OKX Wallet - это полностью самоуправляемый некастодиальный криптокошелек, где пользователи имеют эксклюзивный контроль над своими активами. Поддержка восстановления активов через приватные ключи в любом совместимом кошельке, обеспечивая удобство для пользователей.',
+      },
+      {
+        q: 'Каковы преимущества OKX Wallet?',
+        a: 'Как предпочтительное решение для безопасного хранения для профессиональных пользователей, OKX Wallet интегрирует нативную экосистему DApp, включая продукт on-chain агрегатор OKX DEX. Движок маршрутизации DEX агрегирует более 100 пулов ликвидности и децентрализованных бирж в реальном времени, интеллектуально выполняя сделки по оптимальной цене. Кроме того, вы можете использовать OKX Wallet для создания и управления цифровыми активами, такими как NFT.',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'О OKX Wallet',
+      download: 'Скачать',
+      learn: 'Обучение',
+      aboutUs: 'О нас',
+      careers: 'Карьера',
+      contact: 'Связаться с нами',
+      terms: 'Условия обслуживания',
+      privacy: 'Политика конфиденциальности',
+    },
+    products: {
+      title: 'Продукты',
+      market: 'Рынок',
+      swap: 'Обмен',
+      marketplace: 'Маркетплейс',
+      earn: 'Заработок',
+      discover: 'Открыть',
+      build: 'Центр разработчиков',
+      explorer: 'Обозреватель',
+      security: 'Безопасность',
+    },
+    support: {
+      title: 'Поддержка пользователей',
+      help: 'Центр помощи',
+      verification: 'Проверка официального канала',
+      announcements: 'Объявления',
+      fees: 'Стандарты комиссий DEX',
+      community: 'Присоединиться к сообществу OKX',
+      bitcoinWallet: 'Кошелек Bitcoin',
+      ethereumWallet: 'Кошелек Ethereum',
+      solanaWallet: 'Кошелек Solana',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'Политика конфиденциальности',
+    termsOfService: 'Условия обслуживания',
+  },
+}
+

src/locales/sv-SE.ts

@@ -0,0 +1,4 @@
+// 瑞典语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/uk-UA.ts

@@ -0,0 +1,4 @@
+// 乌克兰语 - 使用英语作为基础
+import enUS from './en-US'
+export default enUS
+

src/locales/vi-VN.ts

@@ -0,0 +1,116 @@
+export default {
+  header: {
+    slogan: 'Cổng vào Web3 của bạn',
+    language: 'Ngôn ngữ',
+  },
+  hero: {
+    title: 'Tiền điện tử ',
+    titleHighlight: 'và \nWeb3',
+    titleSuffix: ' của bạn',
+    subtitle1: 'Hỗ trợ gốc cho hơn 130 mạng, khám phá Web3 dễ dàng',
+    subtitle2: 'OKX Wallet giúp bạn dễ dàng quản lý và giao dịch các tài sản kỹ thuật số',
+    downloadApp: 'Tải ứng dụng',
+    scanToDownload: 'Quét để tải xuống',
+    moreDownloads: 'Thêm tùy chọn tải xuống',
+    appStore: 'App Store',
+    iosStore: 'Cửa hàng ứng dụng iOS',
+    androidApk: 'Android APK',
+    androidPackage: 'Gói Android',
+  },
+  features: {
+    storage: {
+      title: 'Lưu trữ tài sản',
+      desc: 'Lưu trữ bất kỳ tài sản kỹ thuật số nào trong OKX Wallet, bao gồm BTC, ETH, USDT và các đồng Meme coin và NFT phổ biến. Hỗ trợ tạo tối đa 1.000 địa chỉ ví phụ cùng lúc, với toàn quyền kiểm soát quản lý khóa riêng.',
+    },
+    swap: {
+      title: 'Hoán đổi token',
+      desc: 'Chuyển đổi giữa ba chế độ thông minh: Chế độ đơn giản, Chế độ chuyên nghiệp và Chế độ Meme. Dễ dàng cho người mới bắt đầu, chính xác cho chuyên gia, đáp ứng nhu cầu giao dịch on-chain cho tất cả cấp độ người dùng.',
+    },
+    stake: {
+      title: 'Staking on-chain',
+      desc: 'Kích hoạt giá trị tài sản kỹ thuật số và khám phá các pool staking chất lượng on-chain. Tổng hợp thông minh các giao thức staking blockchain chính, theo dõi lợi nhuận đa chuỗi theo thời gian thực thông qua ví tự quản.',
+    },
+    analyze: {
+      title: 'Phân tích dữ liệu',
+      desc: 'Được trang bị thiết bị đầu cuối dữ liệu thời gian thực, giám sát tính thanh khoản, biến động giá và giao dịch lớn trên các blockchain chính và DEX hàng đầu. Theo dõi chuyển động địa chỉ tiền thông minh, cấu hình chiến lược cảnh báo cá nhân hóa để nắm bắt cơ hội on-chain.',
+    },
+  },
+  security: {
+    label: 'Hệ thống bảo mật',
+    title: 'Công nghệ tự quản tiên tiến, tiêu chuẩn bảo mật được chứng nhận toàn cầu',
+    control: {
+      title: 'Tự kiểm soát tài sản',
+      desc: 'Thực sự sở hữu tài sản kỹ thuật số của bạn, được bảo mật thông qua cụm từ ghi nhớ, khóa riêng, xác thực sinh trắc học và công nghệ mã hóa.',
+    },
+    protection: {
+      title: 'Bảo vệ bảo mật chủ động',
+      desc: 'Giám sát và chặn theo thời gian thực các tên miền độc hại, hợp đồng thông minh bất thường và các rủi ro tiềm ẩn khác, xây dựng hệ thống phòng thủ động.',
+    },
+    audit: {
+      title: 'Chứng nhận kiểm toán bảo mật',
+      desc: 'Kiểm toán thâm nhập được thực hiện bởi các đội ngũ an ninh mạng đẳng cấp thế giới, đảm bảo các cơ chế bảo mật hệ thống liên tục đáp ứng các tiêu chuẩn cao nhất của ngành.',
+    },
+  },
+  networks: {
+    title: 'Cổng Web3 một cửa',
+  },
+  faq: {
+    title: 'Câu hỏi thường gặp',
+    items: [
+      {
+        q: 'Làm thế nào để bắt đầu sử dụng OKX Wallet?',
+        a: 'Hỗ trợ đăng ký ngay lập tức trên web hoặc tải xuống ứng dụng di động. Bạn cũng có thể sử dụng tiện ích mở rộng trình duyệt để kết nối liền mạch với DApps trên toàn mạng thông qua giao thức Wallet Connect.',
+      },
+      {
+        q: 'Tại sao chọn OKX Wallet?',
+        a: 'OKX Wallet đáp ứng nhu cầu toàn diện bao gồm lưu trữ tài sản, phân tích on-chain, giao dịch cross-chain và sáng tạo kỹ thuật số thông qua kiến trúc kết nối đa chuỗi, thực sự hiện thực hóa khái niệm sản phẩm "Một ví, vô hạn khả năng".',
+      },
+      {
+        q: 'OKX Wallet có phải là ví giám sát không?',
+        a: 'OKX Wallet là ví tiền điện tử không giám sát được quản lý hoàn toàn tự chủ, nơi người dùng có quyền kiểm soát độc quyền đối với tài sản của họ. Hỗ trợ khôi phục tài sản thông qua khóa riêng trong bất kỳ ví tương thích nào, đảm bảo sự tiện lợi cho người dùng.',
+      },
+      {
+        q: 'Ưu điểm của OKX Wallet là gì?',
+        a: 'Là giải pháp lưu trữ an toàn ưa thích cho người dùng chuyên nghiệp, OKX Wallet tích hợp hệ sinh thái DApp gốc, bao gồm sản phẩm tổng hợp on-chain OKX DEX. Công cụ định tuyến DEX tổng hợp hơn 100 pool thanh khoản và sàn giao dịch phi tập trung theo thời gian thực, thực hiện giao dịch giá tối ưu một cách thông minh. Ngoài ra, bạn có thể sử dụng OKX Wallet để tạo và quản lý các tài sản kỹ thuật số như NFT.',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: 'Về OKX Wallet',
+      download: 'Tải xuống',
+      learn: 'Học',
+      aboutUs: 'Về chúng tôi',
+      careers: 'Nghề nghiệp',
+      contact: 'Liên hệ',
+      terms: 'Điều khoản dịch vụ',
+      privacy: 'Chính sách bảo mật',
+    },
+    products: {
+      title: 'Sản phẩm',
+      market: 'Thị trường',
+      swap: 'Hoán đổi',
+      marketplace: 'Chợ',
+      earn: 'Kiếm',
+      discover: 'Khám phá',
+      build: 'Trung tâm nhà phát triển',
+      explorer: 'Trình khám phá',
+      security: 'Bảo mật',
+    },
+    support: {
+      title: 'Hỗ trợ người dùng',
+      help: 'Trung tâm trợ giúp',
+      verification: 'Xác minh kênh chính thức',
+      announcements: 'Thông báo',
+      fees: 'Tiêu chuẩn phí DEX',
+      community: 'Tham gia cộng đồng OKX',
+      bitcoinWallet: 'Ví Bitcoin',
+      ethereumWallet: 'Ví Ethereum',
+      solanaWallet: 'Ví Solana',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: 'Chính sách bảo mật',
+    termsOfService: 'Điều khoản dịch vụ',
+  },
+}
+

src/locales/zh-CN.ts

@@ -0,0 +1,116 @@
+export default {
+  header: {
+    slogan: 'Web3 入口，一个就够',
+    language: '语言',
+  },
+  hero: {
+    title: '你的数字',
+    titleHighlight: '货币与 \nWeb3',
+    titleSuffix: ' 直通车',
+    subtitle1: '原生支持 130+ 网络，助你畅游 Web3',
+    subtitle2: 'OKX Wallet 助你轻松管理、交易多种数字资产',
+    downloadApp: '下载 App',
+    scanToDownload: '扫码下载',
+    moreDownloads: '更多下载方式',
+    appStore: 'App Store',
+    iosStore: 'iOS 应用商店',
+    androidApk: 'Android APK',
+    androidPackage: '安卓安装包',
+  },
+  features: {
+    storage: {
+      title: '资产存储',
+      desc: '在 OKX Wallet 存储任意数字资产，涵盖 BTC、ETH、USDT 及热门 Meme 币与 NFT。支持一次性创建最多 1,000 个子钱包地址，全权掌控私钥管理。',
+    },
+    swap: {
+      title: '代币兑换',
+      desc: '三种智能模式随心切换：简易模式、专业模式、Meme 模式。新手轻松上手，专家精准操控，满足全层级用户链上交易需求。',
+    },
+    stake: {
+      title: '链上质押',
+      desc: '激活数字资产价值，发现链上优质质押池。智能聚合主流公链质押协议，通过自管钱包实时追踪多链收益。',
+    },
+    analyze: {
+      title: '数据分析',
+      desc: '搭载实时数据终端，监控主流公链及头部 DEX 的流动性、价格波动与大额交易。追踪聪明钱地址动向，配置个性化警报策略，助你抢占链上先机。',
+    },
+  },
+  security: {
+    label: '安全体系',
+    title: '尖端自托管技术，全球认证安全标准',
+    control: {
+      title: '资产自主控制',
+      desc: '真正掌握数字资产所有权，通过助记词、私钥、生物识别验证和加密技术保障资产安全。',
+    },
+    protection: {
+      title: '主动安全防护',
+      desc: '实时监测并拦截恶意域名、异常智能合约等潜在风险，构建动态防御体系。',
+    },
+    audit: {
+      title: '安全审计认证',
+      desc: '由全球顶尖网络安全团队执行穿透式审计，确保系统安全机制持续符合行业最高标准。',
+    },
+  },
+  networks: {
+    title: '一站式 Web3 门户',
+  },
+  faq: {
+    title: '常见问题',
+    items: [
+      {
+        q: '如何开始使用 OKX Wallet？',
+        a: '支持网页端即时注册或下载移动端应用，你也可使用浏览器插件通过 Wallet Connect 协议无缝连接全网 DApp。',
+      },
+      {
+        q: '为什么选择 OKX Wallet？',
+        a: 'OKX Wallet 通过多链互联架构满足资产存储、链上分析、跨链交易及数字创作等全维度需求，真正实现"一个钱包，无限可能"的产品理念。',
+      },
+      {
+        q: 'OKX Wallet 是否为托管型钱包？',
+        a: 'OKX Wallet 为完全自主管理的非托管型加密钱包，用户独享资产控制权。支持通过私钥在任何兼容钱包中恢复资产，确保用户便捷使用。',
+      },
+      {
+        q: 'OKX Wallet 具有哪些优势？',
+        a: '作为专业用户首选的数字资产安全存储方案，OKX Wallet 集成原生 DApp 生态，包括链上聚合器产品 OKX DEX。DEX 路由引擎实时聚合超过 100 个流动性池及去中心化交易所，智能执行最优价格交易。此外，你还可使用 OKX Wallet 进行 NFT 等数字资产的创建与管理。',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: '关于 OKX Wallet',
+      download: '下载',
+      learn: '学院',
+      aboutUs: '关于我们',
+      careers: '就业机会',
+      contact: '联系我们',
+      terms: '服务条款',
+      privacy: '隐私政策',
+    },
+    products: {
+      title: '产品',
+      market: '行情',
+      swap: '币币兑换',
+      marketplace: '市场',
+      earn: '赚币',
+      discover: '发现',
+      build: '开发者中心',
+      explorer: '浏览器',
+      security: '安全',
+    },
+    support: {
+      title: '用户支持',
+      help: '帮助中心',
+      verification: '官方渠道验证',
+      announcements: '公告',
+      fees: 'DEX 费率标准',
+      community: '加入 OKX 社群',
+      bitcoinWallet: '比特币钱包',
+      ethereumWallet: '以太坊钱包',
+      solanaWallet: 'Solana 钱包',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: '隐私政策',
+    termsOfService: '服务条款',
+  },
+}
+

src/locales/zh-TW.ts

@@ -0,0 +1,116 @@
+export default {
+  header: {
+    slogan: 'Web3 入口，一個就夠',
+    language: '語言',
+  },
+  hero: {
+    title: '你的數字',
+    titleHighlight: '貨幣與 \nWeb3',
+    titleSuffix: ' 直通車',
+    subtitle1: '原生支持 130+ 網絡，助你暢遊 Web3',
+    subtitle2: 'OKX Wallet 助你輕鬆管理、交易多種數字資產',
+    downloadApp: '下載 App',
+    scanToDownload: '掃碼下載',
+    moreDownloads: '更多下載方式',
+    appStore: 'App Store',
+    iosStore: 'iOS 應用商店',
+    androidApk: 'Android APK',
+    androidPackage: '安卓安裝包',
+  },
+  features: {
+    storage: {
+      title: '資產存儲',
+      desc: '在 OKX Wallet 存儲任意數字資產，涵蓋 BTC、ETH、USDT 及熱門 Meme 幣與 NFT。支持一次性創建最多 1,000 個子錢包地址，全權掌控私鑰管理。',
+    },
+    swap: {
+      title: '代幣兌換',
+      desc: '三種智能模式隨心切換：簡易模式、專業模式、Meme 模式。新手輕鬆上手，專家精準操控，滿足全層級用戶鏈上交易需求。',
+    },
+    stake: {
+      title: '鏈上質押',
+      desc: '激活數字資產價值，發現鏈上優質質押池。智能聚合主流公鏈質押協議，通過自管錢包實時追蹤多鏈收益。',
+    },
+    analyze: {
+      title: '數據分析',
+      desc: '搭載實時數據終端，監控主流公鏈及頭部 DEX 的流動性、價格波動與大額交易。追蹤聰明錢地址動向，配置個性化警報策略，助你搶占鏈上先機。',
+    },
+  },
+  security: {
+    label: '安全體系',
+    title: '尖端自託管技術，全球認證安全標準',
+    control: {
+      title: '資產自主控制',
+      desc: '真正掌握數字資產所有權，通過助記詞、私鑰、生物識別驗證和加密技術保障資產安全。',
+    },
+    protection: {
+      title: '主動安全防護',
+      desc: '實時監測並攔截惡意域名、異常智能合約等潛在風險，構建動態防禦體系。',
+    },
+    audit: {
+      title: '安全審計認證',
+      desc: '由全球頂尖網絡安全團隊執行穿透式審計，確保系統安全機制持續符合行業最高標準。',
+    },
+  },
+  networks: {
+    title: '一站式 Web3 門戶',
+  },
+  faq: {
+    title: '常見問題',
+    items: [
+      {
+        q: '如何開始使用 OKX Wallet？',
+        a: '支持網頁端即時註冊或下載移動端應用，你也可使用瀏覽器插件通過 Wallet Connect 協議無縫連接全網 DApp。',
+      },
+      {
+        q: '為什麼選擇 OKX Wallet？',
+        a: 'OKX Wallet 通過多鏈互聯架構滿足資產存儲、鏈上分析、跨鏈交易及數字創作等全維度需求，真正實現"一個錢包，無限可能"的產品理念。',
+      },
+      {
+        q: 'OKX Wallet 是否為託管型錢包？',
+        a: 'OKX Wallet 為完全自主管理的非託管型加密錢包，用戶獨享資產控制權。支持通過私鑰在任何兼容錢包中恢復資產，確保用戶便捷使用。',
+      },
+      {
+        q: 'OKX Wallet 具有哪些優勢？',
+        a: '作為專業用戶首選的數字資產安全存儲方案，OKX Wallet 集成原生 DApp 生態，包括鏈上聚合器產品 OKX DEX。DEX 路由引擎實時聚合超過 100 個流動性池及去中心化交易所，智能執行最優價格交易。此外，你還可使用 OKX Wallet 進行 NFT 等數字資產的創建與管理。',
+      },
+    ],
+  },
+  footer: {
+    about: {
+      title: '關於 OKX Wallet',
+      download: '下載',
+      learn: '學院',
+      aboutUs: '關於我們',
+      careers: '就業機會',
+      contact: '聯繫我們',
+      terms: '服務條款',
+      privacy: '隱私政策',
+    },
+    products: {
+      title: '產品',
+      market: '行情',
+      swap: '幣幣兌換',
+      marketplace: '市場',
+      earn: '賺幣',
+      discover: '發現',
+      build: '開發者中心',
+      explorer: '瀏覽器',
+      security: '安全',
+    },
+    support: {
+      title: '用戶支持',
+      help: '幫助中心',
+      verification: '官方渠道驗證',
+      announcements: '公告',
+      fees: 'DEX 費率標準',
+      community: '加入 OKX 社群',
+      bitcoinWallet: '比特幣錢包',
+      ethereumWallet: '以太坊錢包',
+      solanaWallet: 'Solana 錢包',
+    },
+    copyright: '© {year} OKX Web3',
+    privacyPolicy: '隱私政策',
+    termsOfService: '服務條款',
+  },
+}
+

src/main.ts

@@ -2,5 +2,16 @@ import './assets/main.css'
 
 import { createApp } from 'vue'
 import App from './App.vue'
+import { i18n } from './i18n'
+import { detectAndSetLocale } from './utils/locale'
+import { initLocale } from './composables/useLocale'
 
-createApp(App).mount('#app')
+// 检测并设置初始语言
+detectAndSetLocale().then((locale) => {
+  initLocale(locale)
+  i18n.global.locale.value = locale
+  
+  const app = createApp(App)
+  app.use(i18n)
+  app.mount('#app')
+})

src/utils/locale.ts

@@ -0,0 +1,201 @@
+import type { LocaleKey } from '@/i18n'
+
+// 国家代码到语言代码的映射
+const countryToLocaleMap: Record<string, LocaleKey> = {
+  // 中文地区
+  CN: 'zh_CN', // 中国大陆
+  HK: 'zh_TW', // 香港
+  MO: 'zh_TW', // 澳门
+  TW: 'zh_TW', // 台湾
+  SG: 'zh_CN', // 新加坡（简体中文）
+
+  // 英语地区
+  US: 'en_US', // 美国
+  GB: 'en_US', // 英国
+  CA: 'en_US', // 加拿大
+  AU: 'en_US', // 澳大利亚
+  NZ: 'en_US', // 新西兰
+  IE: 'en_US', // 爱尔兰
+  IN: 'en_US', // 印度
+  PH: 'en_US', // 菲律宾
+  MY: 'en_US', // 马来西亚
+
+  // 日语地区
+  JP: 'ja_JP', // 日本
+
+  // 越南语
+  VN: 'vi_VN', // 越南
+
+  // 俄语地区
+  RU: 'ru_RU', // 俄罗斯
+  BY: 'ru_RU', // 白俄罗斯
+  KZ: 'ru_RU', // 哈萨克斯坦
+
+  // 西班牙语地区
+  ES: 'es_ES', // 西班牙
+  MX: 'es_419', // 墨西哥
+  AR: 'es_419', // 阿根廷
+  CO: 'es_419', // 哥伦比亚
+  CL: 'es_419', // 智利
+  PE: 'es_419', // 秘鲁
+  VE: 'es_419', // 委内瑞拉
+
+  // 印尼语
+  ID: 'id_ID', // 印度尼西亚
+
+  // 法语地区
+  FR: 'fr_FR', // 法国
+  BE: 'fr_FR', // 比利时
+  CH: 'fr_FR', // 瑞士
+
+  // 德语地区
+  DE: 'de_DE', // 德国
+  AT: 'de_DE', // 奥地利
+
+  // 意大利语
+  IT: 'it_IT', // 意大利
+
+  // 波兰语
+  PL: 'pl_PL', // 波兰
+
+  // 捷克语
+  CZ: 'cs_CZ', // 捷克
+
+  // 罗马尼亚语
+  RO: 'ro_RO', // 罗马尼亚
+
+  // 葡萄牙语地区
+  PT: 'pt_PT', // 葡萄牙
+  BR: 'pt_BR', // 巴西
+
+  // 乌克兰语
+  UA: 'uk_UA', // 乌克兰
+
+  // 荷兰语
+  NL: 'nl_NL', // 荷兰
+
+  // 阿拉伯语地区
+  SA: 'ar_EH', // 沙特阿拉伯
+  AE: 'ar_EH', // 阿联酋
+  EG: 'ar_EH', // 埃及
+
+  // 挪威语
+  NO: 'nb_NO', // 挪威
+
+  // 芬兰语
+  FI: 'fi_FI', // 芬兰
+
+  // 瑞典语
+  SE: 'sv_SE', // 瑞典
+}
+
+// 从 IP 地址获取国家代码（使用免费的 IP 地理位置 API）
+export async function getCountryFromIP(): Promise<string | null> {
+  try {
+    // 使用 ipapi.co 的免费 API
+    const response = await fetch('https://ipapi.co/json/')
+    if (!response.ok) {
+      throw new Error('Failed to fetch IP location')
+    }
+    const data = await response.json()
+    return data.country_code || null
+  } catch (error) {
+    console.error('Error fetching country from IP:', error)
+    return null
+  }
+}
+
+// 根据国家代码获取语言代码
+export function getLocaleByCountry(countryCode: string): LocaleKey {
+  return countryToLocaleMap[countryCode.toUpperCase()] || 'en_US'
+}
+
+// 从浏览器语言设置获取语言代码
+export function getLocaleFromBrowser(): LocaleKey {
+  const browserLang = navigator.language || (navigator as any).userLanguage
+  
+  // 尝试精确匹配
+  const exactMatch = browserLang.replace('-', '_')
+  if (exactMatch === 'zh_CN' || exactMatch === 'zh_Hans') return 'zh_CN'
+  if (exactMatch === 'zh_TW' || exactMatch === 'zh_Hant') return 'zh_TW'
+  if (exactMatch === 'en_US') return 'en_US'
+  if (exactMatch === 'ja_JP') return 'ja_JP'
+  
+  // 尝试语言前缀匹配
+  const langPrefix = browserLang.split('-')[0].toLowerCase()
+  switch (langPrefix) {
+    case 'zh':
+      return 'zh_CN'
+    case 'en':
+      return 'en_US'
+    case 'ja':
+      return 'ja_JP'
+    case 'vi':
+      return 'vi_VN'
+    case 'ru':
+      return 'ru_RU'
+    case 'es':
+      return 'es_ES'
+    case 'id':
+      return 'id_ID'
+    case 'fr':
+      return 'fr_FR'
+    case 'de':
+      return 'de_DE'
+    case 'it':
+      return 'it_IT'
+    case 'pl':
+      return 'pl_PL'
+    case 'cs':
+      return 'cs_CZ'
+    case 'ro':
+      return 'ro_RO'
+    case 'pt':
+      return 'pt_PT'
+    case 'uk':
+      return 'uk_UA'
+    case 'nl':
+      return 'nl_NL'
+    case 'ar':
+      return 'ar_EH'
+    case 'nb':
+    case 'no':
+      return 'nb_NO'
+    case 'fi':
+      return 'fi_FI'
+    case 'sv':
+      return 'sv_SE'
+    default:
+      return 'en_US'
+  }
+}
+
+// 检测并设置初始语言
+export async function detectAndSetLocale(): Promise<LocaleKey> {
+  // 1. 首先检查本地存储（用户之前是否选择过语言）
+  const savedLocale = localStorage.getItem('okx-locale') as LocaleKey | null
+  if (savedLocale) {
+    return savedLocale
+  }
+
+  // 2. 尝试从 IP 地址获取
+  try {
+    const countryCode = await getCountryFromIP()
+    if (countryCode) {
+      const locale = getLocaleByCountry(countryCode)
+      return locale
+    }
+  } catch (error) {
+    console.error('Error detecting locale from IP:', error)
+  }
+
+  // 3. 从浏览器语言设置获取
+  const browserLocale = getLocaleFromBrowser()
+  return browserLocale
+}
+
+// 保存语言设置到本地存储
+export function saveLocale(locale: LocaleKey): void {
+  localStorage.setItem('okx-locale', locale)
+}
+

yarn.lock

@@ -539,6 +539,27 @@
   resolved "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.3.tgz"
   integrity sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==
 
+"@intlify/core-base@11.2.1":
+  version "11.2.1"
+  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-11.2.1.tgz#45e241b2ed9eead14ffa16d1c41164fbcebd33e3"
+  integrity sha512-2V1A4yaN9ElAnQ6ih3HHEc+jZ+sHV6BlQHjCsnIVlOotL5NCUgJElIxgUFiJs6zV4puoAq3hHuQIfWNp+J+8yQ==
+  dependencies:
+    "@intlify/message-compiler" "11.2.1"
+    "@intlify/shared" "11.2.1"
+
+"@intlify/message-compiler@11.2.1":
+  version "11.2.1"
+  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-11.2.1.tgz#da7c7d0cab7feca16265f7061fae46980e75c56e"
+  integrity sha512-J2454D3Agg3Kvgaj14gxTleJU8/H06Sisz7C2BwiHF0/i5Soyfb5ySpwn8GCL6yscDbOGj6xM+lUe6gO6BFQyg==
+  dependencies:
+    "@intlify/shared" "11.2.1"
+    source-map-js "^1.0.2"
+
+"@intlify/shared@11.2.1":
+  version "11.2.1"
+  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-11.2.1.tgz#b1f45fdb44ee2f247472059f010ded3a4c40e95e"
+  integrity sha512-O67LZM4dbfr70WCsZLW+g+pIXdgQ66laLVd/FicW7iYgP/RuH0X1FDGSh+Hr9Gou/8TeldUE6KmTGdLwX2ufIA==
+
 "@isaacs/cliui@^8.0.2":
   version "8.0.2"
   resolved "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz"
@@ -1072,6 +1093,11 @@
     de-indent "^1.0.2"
     he "^1.2.0"
 
+"@vue/devtools-api@^6.5.0":
+  version "6.6.4"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.6.4.tgz#cbe97fe0162b365edc1dba80e173f90492535343"
+  integrity sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==
+
 "@vue/devtools-core@^7.7.7":
   version "7.7.7"
   resolved "https://registry.npmjs.org/@vue/devtools-core/-/devtools-core-7.7.7.tgz"
@@ -2948,7 +2974,7 @@ sirv@^3.0.0, sirv@^3.0.1:
     mrmime "^2.0.0"
     totalist "^3.0.0"
 
-source-map-js@^1.2.1:
+source-map-js@^1.0.2, source-map-js@^1.2.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz"
   integrity sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==
@@ -3381,6 +3407,15 @@ vue-eslint-parser@^10.2.0:
     esquery "^1.6.0"
     semver "^7.6.3"
 
+vue-i18n@^11.2.1:
+  version "11.2.1"
+  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-11.2.1.tgz#04a5c7f36bb6f2483dd9f03166632d8a1876240e"
+  integrity sha512-cc3Wx4eJZac9WMS8mxhfYiCipm9PBQ2Dz15piWYm7DwNcCehaKRgpolEdiqrjjT27T3Wijz3xJ7NeIc8ofIWAA==
+  dependencies:
+    "@intlify/core-base" "11.2.1"
+    "@intlify/shared" "11.2.1"
+    "@vue/devtools-api" "^6.5.0"
+
 vue-tsc@^2.2.10:
   version "2.2.12"
   resolved "https://registry.npmjs.org/vue-tsc/-/vue-tsc-2.2.12.tgz"