61 lines
1.8 KiB
Vue
61 lines
1.8 KiB
Vue
|
<template>
|
||
|
<el-config-provider :locale="currentLocale">
|
||
|
<router-view />
|
||
|
<ReDialog />
|
||
|
</el-config-provider>
|
||
|
</template>
|
||
|
|
||
|
<script lang="ts" setup>
|
||
|
import { ElConfigProvider } from "element-plus";
|
||
|
import { computed, onMounted } from "vue";
|
||
|
import { ReDialog } from "@/components/BaseDialog";
|
||
|
import en from "element-plus/es/locale/lang/en";
|
||
|
import zhCn from "element-plus/es/locale/lang/zh-cn";
|
||
|
import plusEn from "plus-pro-components/es/locale/lang/en";
|
||
|
import plusZhCn from "plus-pro-components/es/locale/lang/zh-cn";
|
||
|
import { useNav } from "@/layout/hooks/useNav";
|
||
|
import { useI18n } from "vue-i18n";
|
||
|
import { userI18nStore } from "@/store/i18n/i18n";
|
||
|
|
||
|
const i18nStore = userI18nStore();
|
||
|
const i18n = useI18n();
|
||
|
const { $storage } = useNav();
|
||
|
|
||
|
/**
|
||
|
* * 设置多语言内容
|
||
|
*/
|
||
|
const setI18n = async () => {
|
||
|
await i18nStore.fetchI18n();
|
||
|
const languageData = JSON.parse(localStorage.getItem("i18nStore") as any);
|
||
|
// 初始化设置多语言内容
|
||
|
const locale = $storage.locale.locale;
|
||
|
// 如果本地没有语言版本,设置为服务端默认内容
|
||
|
if (locale == "" || locale == null || !locale) {
|
||
|
const local = languageData.i18n.local;
|
||
|
i18n.locale.value = local;
|
||
|
$storage.locale = { locale: local };
|
||
|
i18n.mergeLocaleMessage(local, languageData.i18n[local]);
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
i18n.locale.value = locale;
|
||
|
$storage.locale = { locale };
|
||
|
i18nStore.i18n.local = locale;
|
||
|
i18n.mergeLocaleMessage(locale, languageData.i18n[locale]);
|
||
|
};
|
||
|
|
||
|
/**
|
||
|
* * 当前语言类别
|
||
|
*/
|
||
|
const currentLocale = computed(() => {
|
||
|
const languageData = JSON.parse(localStorage.getItem("i18nStore") as any);
|
||
|
const local = languageData ? languageData.i18n.local : {};
|
||
|
return local === "zh" ? { ...zhCn, ...plusZhCn } : { ...plusEn, ...en };
|
||
|
});
|
||
|
|
||
|
onMounted(() => {
|
||
|
// 设置多语言
|
||
|
setI18n();
|
||
|
});
|
||
|
</script>
|