修复了关于与插件的语言
This commit is contained in:
		
							parent
							
								
									61f471600e
								
							
						
					
					
						commit
						547cab2ac0
					
				
							
								
								
									
										10
									
								
								src/App.vue
									
									
									
									
									
								
							
							
						
						
									
										10
									
								
								src/App.vue
									
									
									
									
									
								
							@ -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
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
@ -26,6 +26,7 @@ const i18nSymbol = Symbol();
 | 
			
		||||
export function provideI18n(i18nConfig: Config) {
 | 
			
		||||
    const i18n = createI18n(i18nConfig);
 | 
			
		||||
    provide(i18nSymbol, i18n);
 | 
			
		||||
    return i18n;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function useI18n() {
 | 
			
		||||
 | 
			
		||||
@ -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>
 | 
			
		||||
@ -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;
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user