修复了关于与插件的语言

This commit is contained in:
luyuan 2020-10-31 14:47:50 +08:00
parent 61f471600e
commit 547cab2ac0
Signed by: theluyuan
GPG Key ID: A7972FD973317FF3
4 changed files with 72 additions and 17 deletions

View File

@ -3,7 +3,7 @@
<router-link to="/">Home</router-link> | <router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link> <router-link to="/about">About</router-link>
</div> --> </div> -->
<a-config-provider :locale="locale"> <a-config-provider :locale="len.$s() == 'zh' ? zh : en">
<router-view/> <router-view/>
</a-config-provider> </a-config-provider>
</template> </template>
@ -20,7 +20,7 @@ import zhCN from 'ant-design-vue/es/locale/zh_CN';
export default defineComponent({ export default defineComponent({
setup(){ setup(){
console.log(i18ninit) console.log(i18ninit)
provideI18n(i18ninit); const len = provideI18n(i18ninit);
if(getValue('token')){ if(getValue('token')){
store.commit("login", true) store.commit("login", true)
store.dispatch("setUserInfo"); store.dispatch("setUserInfo");
@ -29,8 +29,12 @@ export default defineComponent({
store.dispatch("getip"); store.dispatch("getip");
router.push("/") router.push("/")
} }
const zh = zhCN
const en = enUS
return{ return{
locale: zhCN zh,
en,
len
} }
} }
}) })

View File

@ -26,6 +26,7 @@ const i18nSymbol = Symbol();
export function provideI18n(i18nConfig: Config) { export function provideI18n(i18nConfig: Config) {
const i18n = createI18n(i18nConfig); const i18n = createI18n(i18nConfig);
provide(i18nSymbol, i18n); provide(i18nSymbol, i18n);
return i18n;
} }
export function useI18n() { export function useI18n() {

View File

@ -7,21 +7,22 @@
<span class="orgname">Beelink</span> <span class="orgname">Beelink</span>
</div> </div>
<div class="right"> <div class="right">
<div @click="navto('/')">立即登录</div> <div @click="navto('/')">{{lan.$t('lijidenglu')}}</div>
<div class="signnow" @click="navto('/sign')">立即注册</div> <div class="signnow" @click="navto('/sign')">{{lan.$t('lijizhuce')}}</div>
<div class="line"></div> <div class="line"></div>
<a-dropdown :trigger="['click']" :getPopupContainer="triggerNode => triggerNode.parentNode"> <a-dropdown :trigger="['click']" :getPopupContainer="triggerNode => triggerNode.parentNode">
<div class="item" style="display: flex;align-items: center;" @click="e => e.preventDefault()"> <div class="item" @click="e => e.preventDefault()">
<img src="@/static/images/yuyan.png" alt="" class="icon"> <img src="@/static/images/yuyan.png" alt="" class="icon">
<div>{{userinfo.language}}</div> <div class="name">{{userinfo.language}}</div>
<img src="@/static/images/jiantou2.png" alt="" class="arrow"> <img src="@/static/images/jiantou2.png" alt="" class="down">
</div> </div>
<template v-slot:overlay> <template v-slot:overlay>
<a-menu style="max-height:70vh;overflow: auto;"> <a-menu style="max-height:70vh;overflow: auto;">
<!-- 语言 --> <!-- 语言 -->
<a-menu-item v-for="(i,j) in languagelist" :key="j"> <a-menu-item v-for="(i,j) in languagelist" :key="j" style="position: relative;">
<div class="selitem" @click="setlanguage(i.value)"> <div class="selitem" @click="setlanguage(i.value)">
<span>{{i.name}}</span> <span :style="{'color': i.name == userinfo.language ? '#06C7AE' : ''}">{{i.name}}</span>
<img src="@/static/images/duihao.png" alt="" v-if="i.name == userinfo.language" class="duihao">
</div> </div>
</a-menu-item> </a-menu-item>
<!-- <a-menu-item key="1"> <!-- <a-menu-item key="1">
@ -117,15 +118,18 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, ref } from "vue"; import { computed, defineComponent, onMounted, ref } from "vue";
import NavBottom from '@/components/NavBottom.vue'; import NavBottom from '@/components/NavBottom.vue';
import store from '@/store'; import store from '@/store';
import router from '@/router'; import router from '@/router';
import { useI18n } from '@/utils/i18n';
import { editsystemsetting, getlanguages } from '@/api';
export default defineComponent({ export default defineComponent({
components: { components: {
NavBottom NavBottom
}, },
setup() { setup() {
const lan: any = useI18n()
const languagelist=ref<any>([{ const languagelist=ref<any>([{
alias: "", alias: "",
code: "104110011000", code: "104110011000",
@ -138,21 +142,37 @@ export default defineComponent({
updatedAt: "2020-08-14 11:08:28", updatedAt: "2020-08-14 11:08:28",
value: "zh" value: "zh"
}]) }])
onMounted(async ()=>{
languagelist.value=await getlanguages()
})
const userinfo = computed(() => { const userinfo = computed(() => {
return store.state.userinfo; return store.state.userinfo;
}) })
function navto(url: string){ function navto(url: string){
router.push(url) router.push(url)
} }
function setlanguage(e?: any){
console.log(e)
editsystemsetting({language:e})
lan.locale.value = e
}
return { return {
languagelist, languagelist,
userinfo, userinfo,
navto navto,
lan,
setlanguage
}; };
}, },
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.about ::v-deep(.ant-dropdown-menu-item:hover, .ant-dropdown-menu-submenu-title:hover){
background: white;
.selitem{
color:#06C7AE ;
}
}
.about ::v-deep(.nav-bottom) ::v-deep(.nav-container){ .about ::v-deep(.nav-bottom) ::v-deep(.nav-container){
color:white!important color:white!important
} }
@ -160,6 +180,13 @@ export default defineComponent({
color:white!important color:white!important
} }
.about { .about {
.duihao{
width: 15px;
height: 15px;
position: absolute;
right: 15px;
top: 8px;
}
.topnav{ .topnav{
width: 100%; width: 100%;
height: 57px; height: 57px;
@ -188,7 +215,7 @@ export default defineComponent({
} }
} }
.right{ .right{
width: 282px; // width: 282px;
font-size: 11px; font-size: 11px;
color:#111111; color:#111111;
display: flex; display: flex;
@ -375,5 +402,28 @@ export default defineComponent({
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
} }
.item{
display: flex;
align-items: center;
border-right: 1px solid #eee;
padding: 0 23px;
height: 18rpx;
.icon{
width: 16px;
height: 16px;
}
.name{
margin-left: 6px;
font-size: 11px;
color: #111;
font-weight: bold;
}
.down{
width: 9px;
height: 5px;
margin-left: 20px;
}
}
} }
</style> </style>

View File

@ -501,9 +501,9 @@ export default defineComponent({
line-height: 29px; line-height: 29px;
border-radius: 15px; border-radius: 15px;
} }
.more:hover{ // .more:hover{
background: #ccc; // // background: #ccc;
} // }
.icon{ .icon{
width: 9px; width: 9px;
height: 12px; height: 12px;