feat: add page layout i18n language config.

增加页面布局的国际化语言配置

src/layouts/GlobalHeader.vue

@@ -8,7 +8,7 @@
       <a-divider v-if="isMobile" type="vertical" />
       <a-icon v-if="layout === 'side'" class="trigger" :type="collapsed ? 'menu-unfold' : 'menu-fold'" @click="toggleCollapse"/>
       <div v-if="layout == 'head' && !isMobile" class="global-header-menu">
-        <i-menu style="height: 64px; line-height: 64px;" :i18n="menuI18n" :theme="headerTheme" mode="horizontal" :options="menuData" @select="onSelect"/>
+        <i-menu style="height: 64px; line-height: 64px;" @i18nComplete="setRoutesI18n" :i18n="menuI18n" :theme="headerTheme" mode="horizontal" :options="menuData" @select="onSelect"/>
       </div>
       <div :class="['global-header-right', headerTheme]">
           <header-search class="header-item" />
@@ -23,7 +23,7 @@
             <div>
               <a-icon type="global"/>
             </div>
-            <a-menu @click="changeLang" :selected-keys="[lang]" slot="overlay">
+            <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>
@@ -39,7 +39,7 @@ import HeaderSearch from './HeaderSearch'
 import HeaderNotice from './HeaderNotice'
 import HeaderAvatar from './HeaderlAvatar'
 import IMenu from '../components/menu/menu'
-import {mapState} from 'vuex'
+import {mapState, mapMutations} from 'vuex'
 
 export default {
   name: 'GlobalHeader',
@@ -64,9 +64,7 @@ export default {
     onSelect (obj) {
       this.$emit('menuSelect', obj)
     },
-    changeLang(lang) {
-      this.$store.commit('setting/setLang', lang.key)
-    }
+    ...mapMutations('setting', ['setLang', 'setRoutesI18n'])
   }
 }
 </script>

src/layouts/PageLayout.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="page-layout">
-    <page-header :breadcrumb="breadcrumb" :title="title" :logo="logo" :avatar="avatar">
+    <page-header :i18n="routesI18n" :breadcrumb="breadcrumb" :title="title" :logo="logo" :avatar="avatar">
       <slot name="action"  slot="action"></slot>
       <slot slot="content" name="headerContent"></slot>
       <div slot="content" v-if="!this.$slots.headerContent && desc">
-        <p style="font-size: 14px;line-height: 1.5;color: rgba(0,0,0,.65)">{{desc}}</p>
+        <p>{{desc}}</p>
         <div v-if="this.linkList" class="link">
           <template  v-for="(link, index) in linkList">
             <a :key="index" :href="link.href"><a-icon :type="link.icon" />{{link.title}}</a>
@@ -21,6 +21,7 @@
 
 <script>
 import PageHeader from '../components/page/PageHeader'
+import {mapState} from 'vuex'
 export default {
   name: 'PageLayout',
   components: {PageHeader},
@@ -31,11 +32,9 @@ export default {
     }
   },
   computed: {
-    layout () {
-      return this.$store.state.setting.layout
-    }
+    ...mapState('setting', ['layout', 'routesI18n'])
   },
-  mounted () {
+  created () {
     this.getBreadcrumb()
   },
   updated () {
@@ -44,7 +43,7 @@ export default {
   methods: {
     getBreadcrumb () {
       this.breadcrumb = this.$route.matched
-    }
+    },
   }
 }
 </script>

src/layouts/PageView.vue

@@ -22,14 +22,24 @@ export default {
   components: {PageToggleTransition, PageLayout},
   data () {
     return {
-      title: '',
+      path: '',
       desc: '',
       linkList: [],
       extraImage: ''
     }
   },
   computed: {
-    ...mapState('setting', ['multiPage', 'animate'])
+    title() {
+      let key = this.path.substring(1).replace(new RegExp('/', 'g'), '.') + '.name'
+      return this.$t(key)
+    },
+    ...mapState('setting', ['multiPage', 'animate', 'routesI18n'])
+  },
+  created() {
+    let i18n = this.routesI18n
+    Object.keys(i18n).forEach(key => {
+      this.$i18n.mergeLocaleMessage(key, i18n[key])
+    })
   },
   mounted () {
     this.getPageHeaderInfo()
@@ -39,7 +49,7 @@ export default {
   },
   methods: {
     getPageHeaderInfo () {
-      this.title = this.$route.name
+      this.path = this.$route.path
       const page = this.$refs.page
       if (page) {
         this.desc = page.desc