修复了关于与插件的语言

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

View File

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

View File

@ -7,21 +7,22 @@
<span class="orgname">Beelink</span>
</div>
<div class="right">
<div @click="navto('/')">立即登录</div>
<div class="signnow" @click="navto('/sign')">立即注册</div>
<div @click="navto('/')">{{lan.$t('lijidenglu')}}</div>
<div class="signnow" @click="navto('/sign')">{{lan.$t('lijizhuce')}}</div>
<div class="line"></div>
<a-dropdown :trigger="['click']" :getPopupContainer="triggerNode => triggerNode.parentNode">
<div class="item" style="display: flex;align-items: center;" @click="e => e.preventDefault()">
<a-dropdown :trigger="['click']" :getPopupContainer="triggerNode => triggerNode.parentNode">
<div class="item" @click="e => e.preventDefault()">
<img src="@/static/images/yuyan.png" alt="" class="icon">
<div>{{userinfo.language}}</div>
<img src="@/static/images/jiantou2.png" alt="" class="arrow">
<div class="name">{{userinfo.language}}</div>
<img src="@/static/images/jiantou2.png" alt="" class="down">
</div>
<template v-slot:overlay>
<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)">
<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>
</a-menu-item>
<!-- <a-menu-item key="1">
@ -117,15 +118,18 @@
</template>
<script lang="ts">
import { computed, defineComponent, ref } from "vue";
import { computed, defineComponent, onMounted, ref } from "vue";
import NavBottom from '@/components/NavBottom.vue';
import store from '@/store';
import router from '@/router';
import { useI18n } from '@/utils/i18n';
import { editsystemsetting, getlanguages } from '@/api';
export default defineComponent({
components: {
NavBottom
},
setup() {
const lan: any = useI18n()
const languagelist=ref<any>([{
alias: "",
code: "104110011000",
@ -138,21 +142,37 @@ export default defineComponent({
updatedAt: "2020-08-14 11:08:28",
value: "zh"
}])
onMounted(async ()=>{
languagelist.value=await getlanguages()
})
const userinfo = computed(() => {
return store.state.userinfo;
})
function navto(url: string){
router.push(url)
}
function setlanguage(e?: any){
console.log(e)
editsystemsetting({language:e})
lan.locale.value = e
}
return {
languagelist,
userinfo,
navto
navto,
lan,
setlanguage
};
},
});
</script>
<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){
color:white!important
}
@ -160,6 +180,13 @@ export default defineComponent({
color:white!important
}
.about {
.duihao{
width: 15px;
height: 15px;
position: absolute;
right: 15px;
top: 8px;
}
.topnav{
width: 100%;
height: 57px;
@ -188,7 +215,7 @@ export default defineComponent({
}
}
.right{
width: 282px;
// width: 282px;
font-size: 11px;
color:#111111;
display: flex;
@ -375,5 +402,28 @@ export default defineComponent({
flex-direction: column;
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>

View File

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