/** * Multi-language related operations */ import { computed, unref } from 'vue' import type { Locale } from 'ant-design-vue/es/locale' import { i18n } from './setupI18n' import { loadLocalePool, setHtmlPageLang } from './helper' import type { LocaleType } from '@/types/config' import { useLocaleStoreWithOut } from '@/store/modules/locale' interface LangModule { message: Recordable dateLocale: Recordable dateLocaleName: string } function setI18nLanguage(locale: LocaleType) { const localeStore = useLocaleStoreWithOut() if (i18n.mode === 'legacy') { i18n.global.locale = locale } else { ;(i18n.global.locale as any).value = locale } localeStore.setLocaleInfo({ locale }) setHtmlPageLang(locale) } export function useLocale() { const localeStore = useLocaleStoreWithOut() const getLocale = computed(() => localeStore.getLocale) const getShowLocalePicker = computed(() => localeStore.getShowPicker) const getAntdLocale = computed((): any => { const localeMessage = i18n.global.getLocaleMessage<{ antdLocale: Locale }>(unref(getLocale)) return localeMessage?.antdLocale ?? {} }) // Switching the language will change the locale of useI18n // And submit to configuration modification async function changeLocale(locale: LocaleType) { const globalI18n = i18n.global const currentLocale = unref(globalI18n.locale) if (currentLocale === locale) return locale if (loadLocalePool.includes(locale)) { setI18nLanguage(locale) return locale } const langModule = ((await import(`./lang/${locale}.ts`))).default as LangModule if (!langModule) return const { message } = langModule globalI18n.setLocaleMessage(locale, message) loadLocalePool.push(locale) setI18nLanguage(locale) return locale } return { getLocale, getShowLocalePicker, changeLocale, getAntdLocale, } }