feat: optimize international language settings; 🌟

优化国际化语言设置功能;
master
iczer 4 years ago
parent 94fb7964b2
commit 1ab1f1b224
  1. 23
      src/layouts/GlobalHeader.vue

@ -21,12 +21,10 @@
<header-avatar class="header-item"/>
<a-dropdown class="lang header-item">
<div>
<a-icon type="global"/>
<a-icon type="global"/> {{langAlias}}
</div>
<a-menu @click="value => setLang(value.key)" :selected-keys="[lang]" slot="overlay">
<a-menu-item key="CN"><span >cn</span> 简体中文</a-menu-item>
<a-menu-item key="HK"><span >hk</span> 繁体中文</a-menu-item>
<a-menu-item key="US"><span >us</span> English</a-menu-item>
<a-menu @click="val => setLang(val.key)" :selected-keys="[lang]" slot="overlay">
<a-menu-item v-for=" lang in langList" :key="lang.key">{{lang.key.toLowerCase() + ' ' + lang.name}}</a-menu-item>
</a-menu>
</a-dropdown>
</div>
@ -45,16 +43,24 @@ export default {
name: 'GlobalHeader',
components: {IMenu, HeaderAvatar, HeaderNotice, HeaderSearch},
props: ['collapsed', 'menuData'],
provide() {
inject: ['menuI18n'],
data() {
return {
headerTheme: this.theme
langList: [
{key: 'CN', name: '简体中文', alias: '简体'},
{key: 'HK', name: '繁体中文', alias: '繁体'},
{key: 'US', name: 'English', alias: 'English'}
]
}
},
inject: ['menuI18n'],
computed: {
...mapState('setting', ['theme', 'isMobile', 'layout', 'systemName', 'lang']),
headerTheme () {
return (this.layout == 'side' && !this.isMobile) ? 'light' : this.theme
},
langAlias() {
let lang = this.langList.find(item => item.key == this.lang)
return lang.alias
}
},
methods: {
@ -101,6 +107,7 @@ export default {
margin: auto;
}
&.side{
padding-right: 12px;
}
.logo {
height: 64px;

Loading…
Cancel
Save