feat(i18n): 添加国际化配置和国家地址配置
- 新增 src/utils/countryConfig.js 文件,包含各国地址字段规则和邮编格式配置 - 新增 src/i18n/index.js 文件,实现基于货币代码的国际化翻译功能 - 新增 src/i18n/locales.js 文件,提供中英马泰菲多语言静态翻译文本 - 实现货币代码到国家代码映射及地址验证功能 - 添加订单创建页、商品详情页、订单确认页等多页面国际化支持 - 支持新加坡、马来西亚、菲律宾、泰国、越南等国家地址格式配置
This commit is contained in:
137
src/i18n/index.js
Normal file
137
src/i18n/index.js
Normal file
@@ -0,0 +1,137 @@
|
||||
import { createI18n } from 'vue-i18n'
|
||||
import { getLanguageByCurrency, getTranslationsByCurrency } from './locales'
|
||||
|
||||
// 默认中文文本(作为fallback)
|
||||
const defaultMessages = {
|
||||
// 商品详情页
|
||||
product: {
|
||||
selectCurrency: '选择货币',
|
||||
selectSku: '选择商品规格(SKU)',
|
||||
currentPrice: '现价',
|
||||
quantity: '数量',
|
||||
stock: '库存',
|
||||
buyNow: '立即购买',
|
||||
addToCart: '加入购物车',
|
||||
productDetails: '商品详情',
|
||||
specifications: '规格参数',
|
||||
outOfStock: '缺货',
|
||||
confirmPurchase: '确认购买',
|
||||
cancel: '取消',
|
||||
unitPrice: '单价',
|
||||
total: '总计',
|
||||
confirmPurchaseInfo: '确认购买信息',
|
||||
sku: 'SKU',
|
||||
productNotExist: '商品不存在或链接已过期',
|
||||
linkExpired: '该商品链接可能已失效,请联系商家获取新的商品链接'
|
||||
},
|
||||
// 订单创建页
|
||||
order: {
|
||||
fillOrderInfo: '填写订单信息',
|
||||
productInfo: '商品信息',
|
||||
customerInfo: '客户信息',
|
||||
shippingAddress: '收货地址',
|
||||
customerName: '客户姓名',
|
||||
customerPhone: '客户电话',
|
||||
customerEmail: '客户邮箱',
|
||||
shippingName: '收货人姓名',
|
||||
shippingPhone: '收货人电话',
|
||||
shippingCountry: '收货国家',
|
||||
addressLine1: '详细地址1',
|
||||
addressLine2: '详细地址2',
|
||||
state: '州/省',
|
||||
city: '城市',
|
||||
postcode: '邮编',
|
||||
remark: '备注',
|
||||
submit: '提交订单',
|
||||
back: '返回',
|
||||
pleaseEnter: '请输入',
|
||||
optional: '可选',
|
||||
required: '必填',
|
||||
addressFormat: '地址格式',
|
||||
phoneCode: '国际区号',
|
||||
mustMatchId: '需与证件一致,支持当地语言+英文'
|
||||
},
|
||||
// 订单确认页
|
||||
confirm: {
|
||||
orderInfo: '订单信息',
|
||||
orderNo: '订单号',
|
||||
orderStatus: '订单状态',
|
||||
paymentStatus: '支付状态',
|
||||
payNow: '立即支付',
|
||||
viewOrder: '查看订单'
|
||||
},
|
||||
// 通用
|
||||
common: {
|
||||
loading: '加载中...',
|
||||
submit: '提交',
|
||||
cancel: '取消',
|
||||
confirm: '确认',
|
||||
save: '保存',
|
||||
delete: '删除',
|
||||
edit: '编辑',
|
||||
search: '搜索',
|
||||
reset: '重置',
|
||||
operation: '操作',
|
||||
success: '成功',
|
||||
failed: '失败',
|
||||
error: '错误',
|
||||
warning: '警告',
|
||||
info: '提示'
|
||||
}
|
||||
}
|
||||
|
||||
// 创建 i18n 实例
|
||||
const i18n = createI18n({
|
||||
legacy: false, // 使用 Composition API 模式
|
||||
locale: 'zh', // 默认语言
|
||||
fallbackLocale: 'zh', // 回退语言
|
||||
messages: {
|
||||
zh: defaultMessages
|
||||
}
|
||||
})
|
||||
|
||||
// 翻译缓存(避免重复请求)
|
||||
const translationCache = new Map()
|
||||
|
||||
/**
|
||||
* 根据货币代码加载翻译文本(使用静态翻译,不依赖后端API)
|
||||
* @param {string} currency 货币代码
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
export async function loadTranslationByCurrency(currency) {
|
||||
if (!currency) {
|
||||
return
|
||||
}
|
||||
|
||||
// 根据货币代码获取语言代码
|
||||
const language = getLanguageByCurrency(currency)
|
||||
|
||||
// 检查缓存
|
||||
if (translationCache.has(language)) {
|
||||
const cachedMessages = translationCache.get(language)
|
||||
i18n.global.setLocaleMessage(language, cachedMessages)
|
||||
i18n.global.locale.value = language
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
// 从静态翻译文件获取翻译
|
||||
const translatedMessages = getTranslationsByCurrency(currency)
|
||||
|
||||
// 缓存翻译结果
|
||||
translationCache.set(language, translatedMessages)
|
||||
|
||||
// 设置翻译消息
|
||||
i18n.global.setLocaleMessage(language, translatedMessages)
|
||||
i18n.global.locale.value = language
|
||||
|
||||
console.log(`翻译加载成功,货币: ${currency}, 语言: ${language}`)
|
||||
} catch (error) {
|
||||
console.error('加载翻译失败:', error)
|
||||
// 翻译失败时使用默认中文
|
||||
i18n.global.locale.value = 'zh'
|
||||
}
|
||||
}
|
||||
|
||||
export default i18n
|
||||
|
||||
1080
src/i18n/locales.js
Normal file
1080
src/i18n/locales.js
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user