Merge pull request 'zj' (#91) from zj into master

Reviewed-on: http://git.luyuan.tk/luyuan/beelink/pulls/91

src/App.vue

@@ -19,6 +19,7 @@ import zhCN from 'ant-design-vue/es/locale/zh_CN';
 
 export default defineComponent({
   setup(){
+    console.log(i18ninit)
     provideI18n(i18ninit);
     if(getValue('token')){
       store.commit("login", true)

src/components/NavTop.vue

@@ -21,9 +21,10 @@
                 <template v-slot:overlay >
                     <a-menu style="max-height:70vh;overflow: auto;">
                         <!-- 时区 -->
-                        <a-menu-item  v-for="(i,j) in zonelist" :key="j" @click="zonechange(i.zoneid)">
+                        <a-menu-item  v-for="(i,j) in zonelist" :key="j" @click="zonechange(i.zoneid)" style="position: relative;">
                             <div class="selitem">
                                 <span>{{i.city}}{{i.gmt}}</span>
+                                <img src="@/static/images/duihao.png" alt="" v-if="i.zoneid == userinfo.zoneid" class="duihao">
                             </div>
                         </a-menu-item>
                         <!-- <a-menu-item key="1">
@@ -49,9 +50,10 @@
                 <template v-slot:overlay>
                     <a-menu style="max-height:70vh;overflow: auto;">
                         <!-- 货币 -->
-                        <a-menu-item  v-for="(i,j) in currencylist" :key="j">
+                        <a-menu-item  v-for="(i,j) in currencylist" :key="j" style="position: relative;">
                             <div class="selitem" @click="currencychange(i.value)">
                                 <span>{{i.name}} </span>
+                                <img src="@/static/images/duihao.png" alt="" v-if="i.name == userinfo.currency" class="duihao">
                             </div>
                         </a-menu-item>
                         <!-- <a-menu-item key="1">
@@ -76,9 +78,10 @@
                 <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>
+                                 <img src="@/static/images/duihao.png" alt="" v-if="i.name == userinfo.language" class="duihao">
                             </div>
                         </a-menu-item>
                         <!-- <a-menu-item key="1">
@@ -96,15 +99,28 @@
             </a-dropdown>
             <div class="item" style="border-right: none;" @click="navto('/regime/date')">
                 <img src="@/static/images/rili.png" alt="" class="icon">
-                <div class="name">日历</div>
+                <div class="name">{{lan.$t('rili')}}</div>
             </div>
         </div>
     </div>
 </template>
 <style lang="scss" scoped>
+.nav ::v-deep(.ant-dropdown-menu-item:hover, .ant-dropdown-menu-submenu-title:hover){
+    background: white;
+    .selitem{
+        color:#06C7AE ;
+    }
+}
 .nav{
     display: flex;
     user-select: none;
+    .duihao{
+        width: 15px;
+        height: 15px;
+        position: absolute;
+        right: 15px;
+        top: 8px;
+    }
     .logo{
         width: 171px;
         height: 57px;
@@ -191,6 +207,7 @@ import store from '@/store';
 import { computed, defineComponent, onMounted, ref } from 'vue';
 import { useRoute } from 'vue-router';
 import axios from 'axios'
+import { useI18n } from '@/utils/i18n';
 
 export default defineComponent({
     props:{
@@ -200,6 +217,8 @@ export default defineComponent({
         }
     },
     setup(props){
+        const lan: any = useI18n();
+        
         const routes = useRoute();
         console.log(routes.path);
         const types = ref(props.type)
@@ -242,19 +261,19 @@ export default defineComponent({
         }
         const nav: Array<Nav> = [
             {
-                name: "直播管理",
+                name: lan.$t('zhiboguanli'),
                 route: "/regime/live"
             },
             {
-                name: "视频管理",
+                name: lan.$t('shipinguanli'),
                 route: "/regime/video"
             },
             {
-                name: "订阅者管理",
+                name: lan.$t("dingyuezheguanli"),
                 route: "/regime/subscriber"
             },
             {
-                name: "个人中心",
+                name: lan.$t("gerenzhongxin"),
                 route: "/mine/archives"
             }
         ]
@@ -291,10 +310,13 @@ export default defineComponent({
             editsystemsetting({zoneid:e})
         }
         function currencychange(e?: any){
+            console.log(e)
             editsystemsetting({currency:parseInt(e)})
         }
         function setlanguage(e?: any){
+            console.log(e)
             editsystemsetting({language:e})
+            lan.locale.value = e
         }
         function toindex(){
             router.push("/")
@@ -313,7 +335,8 @@ export default defineComponent({
             languagelist,
             setlanguage,
             nowroute,
-            toindex
+            toindex,
+            lan
         }
     }
 })

src/components/login/LoginTab.vue

@@ -1,11 +1,12 @@
 <template>
   <div class="logintab">
-      <div :class="selected==1?'tab tab1':'tab'" @mouseover="tabchange(1)">手机号登录</div>
+      <div :class="selected==1?'tab tab1':'tab'" @mouseover="tabchange(1)">{{lan.$t("shoujidenglu")}}</div>
-      <div :class="selected==2?'tab tab1':'tab'" @mouseover="tabchange(2)">账号密码登录</div>
+      <div :class="selected==2?'tab tab1':'tab'" @mouseover="tabchange(2)">{{lan.$t("mimadenglu")}}</div>
   </div>
 </template>
 
 <script lang="ts">
+import { useI18n } from '@/utils/i18n';
 import { defineComponent , ref} from "vue";
 
 export default defineComponent({
@@ -14,6 +15,7 @@ export default defineComponent({
  
 
   setup(prop,context) {
+    const lan: any = useI18n();
     const selected=ref(1)
     function tabchange(e: number): void{
         selected.value=e
@@ -22,7 +24,8 @@ export default defineComponent({
     }
     return {
       selected,
-      tabchange
+      tabchange,
+      lan
     };
   },
 });

src/i18n/en.ts

@@ -0,0 +1,28 @@
+export default {
+    zhiboguanli: "直播管理",
+    shipinguanli: "视频管理",
+    dingyuezheguanli: "订阅者管理",
+    gerenzhongxin: "个人中心",
+    rili: "Date",
+    quanbuzhibo: "全部直播",
+    weikaishi: "未开始",
+    yijieshu: "已结束",
+    zhibosousuo: "请输入想要搜索的直播标题",
+    haiweikaishi: "还未开始",
+    yijueshi: "已结束",
+    jinruzhibo: "进入直播",
+    quanbushipin: "全部视频",
+    shenhezhong: "审核中",
+    weitongguo: "未通过",
+    yifabu: "已发布",
+    shipinsousuo: "请输入想要搜索的直播标题",
+    wodedingyuezhe: "我的订阅者",
+    xingming: "姓名",
+    suozaiguojia: "所在国家",
+    nianling: "年龄",
+    xueshengmuyu: "学生母语",
+    xingqudian: "兴趣点",
+    yuyandengji: "语言等级",
+    canyupingtaishichang: "参与平台直播总时长",
+    sousuoxuesheng: "请输入想要搜索的学生姓名"
+}

src/i18n/init.ts

@@ -1,9 +1,9 @@
 import zh from "./zh"
-
+import en from "./en"
-
 export default {
     locale: "zh", //默认语言
     messages: {
-        zh
+        zh,
+        en
     }
 }

src/i18n/zh.ts

@@ -24,5 +24,29 @@ export default {
     xingqudian: "兴趣点",
     yuyandengji: "语言等级",
     canyupingtaishichang: "参与平台直播总时长",
-    sousuoxuesheng: "请输入想要搜索的学生姓名"
+    sousuoxuesheng: "请输入想要搜索的学生姓名",
+    huanying:"您好，欢迎来到",
+    beelink:"Beelink",
+    meiyouzhanghao:"还没有账号？",
+    chengweilaoshi:"成为一名Beelink老师",
+    shoujidenglu:"手机号登录",
+    mimadenglu:"账号密码登录",
+    shoujihao:"手机号",
+    yanzhengma:"验证码",
+    dianjihuoquyzm:"点击获取验证码",
+    lijidenglu:"立即登录",
+    shurushouji:"请输入您的手机号",
+    shuruyzm:"请输入您的验证码",
+    banquan:"Beelink公司版权所有 2019—2022",
+    zhanghao:"帐号",
+    shuruzhanghao:"请输入您的邮箱或者手机号",
+    mima:"密码",
+    shurumima:"请输入您的密码",
+    wangjimima:"忘记密码?",
+    yiwanxinlai:"亿万人的信赖和见证",
+    kaiqishenghuo:"Beelink 开启您的美好学习生活",
+    guanyubeelink:"关于 Beelink",
+    guanyuneirong:" Beelink平台拥有数千名优秀老师，丰富的教育经验和有趣的课堂环境，一对一辅导平台的教务管理、线上课堂、线下课堂、助学互动，课程回放等多项教学功能，让您利用碎片时间，轻轻松松学会各种语言。",
+    liaojiegengduo:"了解更多"
+
 }

src/utils/i18n.ts

@@ -13,6 +13,7 @@ const createI18n = (config: Config) => ({
     locale: ref(config.locale),
     messages: config.messages,
     $t(key: string) {
+        console.log(key)
         return this.messages[this.locale.value][key];
     },
     $s(){

src/views/login/Login.vue

@@ -4,10 +4,10 @@
     <div class="box">
       <div class="left">
         <div class="title">
-          您好，欢迎来到 <span class="orgname">Beelink</span>
+          {{lan.$t("huanying")}} <span class="orgname">{{lan.$t("beelink")}}</span>
         </div>
         <div class="nosign">
-          还没有账号？ <span class="tosign"><router-link to="/sign"> 成为一名Beelink老师 </router-link></span>
+          {{lan.$t("meiyouzhanghao")}} <span class="tosign"><router-link to="/sign"> {{lan.$t("chengweilaoshi")}} </router-link></span>
         </div>
         <div class="tab">
           <LoginTab @sel="Selectnum"></LoginTab>
@@ -15,7 +15,7 @@
 
         <div v-if="tabselected == 1">
           <a-form :layout="formLayout">
-            <a-form-item label="手机号" class="form-item">
+            <a-form-item :label="lan.$t('shoujihao')" class="form-item">
               <a-input-group compact>
                 <!-- <a-select default-value="Zhejiang" class="getcode">
                   <a-select-option value="Zhejiang">
@@ -30,53 +30,53 @@
                     <!-- <a-select-option value="Jiangsu"> Jiangsu </a-select-option> -->
                 </a-select>
                 <div class="line"></div>
-                <a-input v-model:value="phone" style="width: 50%" placeholder="请输入您的手机号" />
+                <a-input v-model:value="phone" style="width: 50%" :placeholder="lan.$t('shurushouji')" />
               </a-input-group>
             </a-form-item>
-            <a-form-item label="验证码" class="form-item">
+            <a-form-item :label="lan.$t('yanzhengma')" class="form-item">
               <a-input-group compact>
                 <div class="getcode" @click="getcode">
-                  点击获取验证码{{ time == 60 ? "" : "(" + time + ")" }}
+                  {{lan.$t("dianjihuoquyzm")}} {{ time == 60 ? "" : "(" + time + ")" }}
                 </div>
                 <div class="line"></div>
-                <a-input style="width: 50%" placeholder="请输入您的验证码" v-model:value="code"/>
+                <a-input style="width: 50%" :placeholder="lan.$t('shuruyzm')" v-model:value="code"/>
               </a-input-group>
             </a-form-item>
-            <div class="submit" @click="sublogin">立即登录</div>
+            <div class="submit" @click="sublogin">{{lan.$t("lijidenglu")}}</div>
-            <div>Beelink公司版权所有 2019—2022</div>
+            <div>{{lan.$t('banquan')}}</div>
           </a-form>
         </div>
 
         <div v-if="tabselected == 2">
           <a-form :layout="formLayout">
-            <a-form-item label="帐号" class="form-item">
+            <a-form-item :label="lan.$t('zhanghao')" class="form-item">
               <a-input-group compact>
                 <a-input
                   style="width: 80%"
-                  placeholder="请输入您的邮箱或者手机号"
+                  :placeholder="lan.$t('shuruzhanghao')"
                   v-model:value="userinfo.phone"
                 />
               </a-input-group>
             </a-form-item>
-            <a-form-item label="密码" class="form-item">
+            <a-form-item :label="lan.$t('mima')" class="form-item">
               <a-input-group compact>
                 <a-input
                   style="width: 70%"
-                  placeholder="请输入您的密码"
+                  :placeholder="lan.$t('shurumima')"
                   type="password"
                   class="shuru"
                   v-model:value="userinfo.password"
                 />
-                <div class="forget"><router-link to="/reset">忘记密码?</router-link></div>
+                <div class="forget"><router-link to="/reset">{{lan.$t('wangjimima')}}</router-link></div>
               </a-input-group>
             </a-form-item>
-            <div class="submit" @click="login">立即登录</div>
+            <div class="submit" @click="login">{{lan.$t('lijidenglu')}}</div>
           </a-form>
         </div>
       </div>
       <div class="right">
-        <div class="top">亿万人的信赖和见证</div>
+        <div class="top">{{lan.$t('yiwanxinlai')}}</div>
-        <div class="topdesc">Beelink 开启您的美好学习生活</div>
+        <div class="topdesc">{{lan.$t('kaiqishenghuo')}}</div>
 
         <div class="lessons">
           <!-- @click="tovideoxq(i.videoid)" -->
@@ -98,15 +98,13 @@
     </div>
     <div class="bottom">
       <div class="content">
-        <div class="title">关于 Beelink</div>
+        <div class="title">{{lan.$t('guanyubeelink')}}</div>
         <div class="rowline"></div>
         <div class="texts">
-          Beelink平台拥有数千名优秀老师，丰富的教育经验和有趣的课堂环境，一对一辅导
+         {{lan.$t("guanyuneirong")}}
-          平台的教务管理、线上课堂、线下课堂、助学互动，课程回放等多项教学功能，让
-          您利用碎片时间，轻轻松松学会各种语言。
         </div>
         <div class="relation">
-          <div class="more" @click="navto()">了解更多</div>
+          <div class="more" @click="navto()">{{lan.$t('liaojiegengduo')}}</div>
           <img src="@/static/images/tel.png" alt="" class="icon">
           <div>136-0111-1111</div> 
 
@@ -125,6 +123,7 @@ import NavTop from "@/components/NavTop.vue"
 import { checksmscode, getquhaolist, getwebvideolist, loginpass, sendsms } from '@/api';
 import { message } from 'ant-design-vue';
 import router from '@/router';
+import { useI18n } from '@/utils/i18n';
 
 export default defineComponent({
   name: "Login",
@@ -133,6 +132,7 @@ export default defineComponent({
     NavTop
   },
   setup() {
+    const lan: any = useI18n();
     const formLayout = {
       labelCol: 4,
       wrapperCol: 14,
@@ -278,6 +278,7 @@ export default defineComponent({
       videolist,
       tovideoxq,
       navto,
+      lan,
       slogin
     };
   },