import type { Locale } from 'ant-design-vue/es/locale';
|
|
import type { App } from 'vue';
|
|
import type { LocaleSetupOptions, SupportedLanguagesType } from '@vben/locales';
|
|
import { ref } from 'vue';
|
|
import { $t, setupI18n as coreSetup, i18n, loadLocalesMap } from '@vben/locales';
|
import { preferences } from '@vben/preferences';
|
|
import antdEnLocale from 'ant-design-vue/es/locale/en_US';
|
import antdDefaultLocale from 'ant-design-vue/es/locale/zh_CN';
|
import antdTwLocale from 'ant-design-vue/es/locale/zh_TW';
|
import dayjs from 'dayjs';
|
|
import { getLangJson } from '#/api/system/baseLang';
|
|
const antdLocale = ref<Locale>(antdDefaultLocale);
|
|
const modules = import.meta.glob('./langs/*.json');
|
|
const localesMap = loadLocalesMap(modules);
|
|
export function flattenObject(obj, prefix = '') {
|
return Object.keys(obj).reduce((acc, key) => {
|
const fullPath = prefix ? `${prefix}.${key}` : key; // 构建新的路径
|
if (typeof obj[key] === 'object' && obj[key] !== null && !Array.isArray(obj[key])) {
|
// 如果当前属性是对象，且不是数组，继续递归
|
Object.assign(acc, flattenObject(obj[key], fullPath));
|
} else {
|
// 否则，直接设置路径和值
|
acc[fullPath] = obj[key];
|
}
|
return acc;
|
}, {});
|
}
|
|
/**
|
* 加载应用特有的语言包
|
* 这里也可以改造为从服务端获取翻译数据
|
* @param lang
|
*/
|
async function loadMessages(lang: SupportedLanguagesType) {
|
const [appLocaleMessages] = await Promise.all([localesMap[lang]?.(), loadThirdPartyMessage(lang)]);
|
return flattenObject(appLocaleMessages?.default);
|
}
|
|
/**
|
* 加载第三方组件库的语言包
|
* @param lang
|
*/
|
async function loadThirdPartyMessage(lang: SupportedLanguagesType) {
|
await Promise.all([loadAntdLocale(lang), loadDayjsLocale(lang)]);
|
}
|
|
/**
|
* 加载dayjs的语言包
|
* @param lang
|
*/
|
async function loadDayjsLocale(lang: SupportedLanguagesType) {
|
let locale;
|
switch (lang) {
|
case 'en-US': {
|
locale = await import('dayjs/locale/en');
|
break;
|
}
|
case 'zh-CN': {
|
locale = await import('dayjs/locale/zh-cn');
|
break;
|
}
|
case 'zh-TW': {
|
locale = await import('dayjs/locale/zh-tw');
|
break;
|
}
|
// 默认使用中文
|
default: {
|
locale = await import('dayjs/locale/zh-cn');
|
}
|
}
|
if (locale) {
|
dayjs.locale(locale);
|
} else {
|
console.error(`Failed to load dayjs locale for ${lang}`);
|
}
|
}
|
|
/**
|
* 加载antd的语言包
|
* @param lang
|
*/
|
async function loadAntdLocale(lang: SupportedLanguagesType) {
|
switch (lang) {
|
case 'en-US': {
|
antdLocale.value = antdEnLocale;
|
break;
|
}
|
case 'zh-CN': {
|
antdLocale.value = antdDefaultLocale;
|
break;
|
}
|
case 'zh-TW': {
|
antdLocale.value = antdTwLocale;
|
break;
|
}
|
default: {
|
antdLocale.value = antdDefaultLocale;
|
break;
|
}
|
}
|
}
|
async function initLocale(locale: SupportedLanguagesType) {
|
const res = await getLangJson();
|
if (!res || !res.data) return;
|
const message = JSON.parse(res.data) || {};
|
i18n.global.mergeLocaleMessage(locale, message);
|
}
|
|
async function setupI18n(app: App, options: LocaleSetupOptions = {}) {
|
await coreSetup(app, {
|
defaultLocale: preferences.app.locale,
|
loadMessages,
|
missingWarn: !import.meta.env.PROD,
|
...options,
|
});
|
}
|
|
export { $t, antdLocale, initLocale, setupI18n };
|
