From 547cab2ac0da103a7fff3fc7a0912ffa7bab9969 Mon Sep 17 00:00:00 2001
From: luyuan <1162963624@qq.com>
Date: Sat, 31 Oct 2020 14:47:50 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E4=BA=86=E5=85=B3=E4=BA=8E?=
 =?UTF-8?q?=E4=B8=8E=E6=8F=92=E4=BB=B6=E7=9A=84=E8=AF=AD=E8=A8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue               | 10 ++++--
 src/utils/i18n.ts         |  1 +
 src/views/login/About.vue | 72 +++++++++++++++++++++++++++++++++------
 src/views/login/Login.vue |  6 ++--
 4 files changed, 72 insertions(+), 17 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 9c88408..57c9e01 100644
--- a/src/App.vue
+++ b/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
     }
   }
 })
diff --git a/src/utils/i18n.ts b/src/utils/i18n.ts
index 88b9011..c03d8b7 100644
--- a/src/utils/i18n.ts
+++ b/src/utils/i18n.ts
@@ -26,6 +26,7 @@ const i18nSymbol = Symbol();
 export function provideI18n(i18nConfig: Config) {
     const i18n = createI18n(i18nConfig);
     provide(i18nSymbol, i18n);
+    return i18n;
 }
 
 export function useI18n() {
diff --git a/src/views/login/About.vue b/src/views/login/About.vue
index 9b14cc5..1c20c7b 100644
--- a/src/views/login/About.vue
+++ b/src/views/login/About.vue
@@ -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>
\ No newline at end of file
diff --git a/src/views/login/Login.vue b/src/views/login/Login.vue
index 0f6d004..8b5301f 100644
--- a/src/views/login/Login.vue
+++ b/src/views/login/Login.vue
@@ -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;