语言切换

src/App.vue

@@ -108,7 +108,7 @@ export default {
 }
 </script>
 <style>
-  @import "//at.alicdn.com/t/font_635492_0whkhalyx8tm.css";
+  @import "//at.alicdn.com/t/font_635492_p33f7rq158p.css";
   @import "./assets/css/Semibold.css";
   @import "./assets/css/global/config.css";
   @import "./assets/css/fileIcon.css";

src/components/index.vue

@@ -104,7 +104,7 @@
                       <i class="iconfont icon-menu-shezhi"></i>
                       设置
                     </el-dropdown-item> -->
-                    <el-dropdown-item class="clearfix _dropdown_other" @click.native="exit">
+                    <el-dropdown-item class="clearfix _dropdown_other" @click. ="exit">
                       <i class="iconfont icon-menu-tuichu"></i>
                       退出
                     </el-dropdown-item>
@@ -118,7 +118,18 @@
 							<!--<i class="iconfont icon-imessage_top"  @click="togglebox($event)"></i>-->
 						</li>
 			    		<li><i class="iconfont icon-help_top"></i></li>
-			    		<li><i class="iconfont icon-language_top"></i></li>
+			    		<li>
+                <el-dropdown trigger="click">
+                  <span class="el-dropdown-link">
+                    <i v-if="language=='zh-CN'" class="iconfont icon-language_top"></i>
+                    <i v-if="language=='Japanese'" class="iconfont icon-icon-riyu"></i>
+                  </span>
+                  <el-dropdown-menu  class="changelanguage" slot="dropdown">
+                    <el-dropdown-item @click.native="ChangeLan('Japanese')">日语 <i v-if="language=='Japanese'" class="iconfont icon-duigou"></i></el-dropdown-item>
+                    <el-dropdown-item @click.native="ChangeLan('zh-CN')">简体中文 <i v-if="language=='zh-CN'" class="iconfont icon-duigou"></i></el-dropdown-item>
+                  </el-dropdown-menu>
+                </el-dropdown>
+              </li>
 			    	</ul>
 			    </div>
 			</div>
@@ -774,6 +785,7 @@ export default {
   },
   data() {
     return {
+      language:'zh-CN',
       douTimer:null,
       defaultHeadImg:
         'this.src="' + require("../assets/img/default_head_img.jpg") + '"',
@@ -1313,6 +1325,10 @@ export default {
     }
   },
   methods: {
+    ChangeLan(str){
+      this.language=str;
+      this.$i18n.locale = str;
+    },
     settingSys: function () {
       this.MsgBus.$emit('settingOpen')
     },
@@ -3170,6 +3186,26 @@ export default {
 @import "../assets/css/main.less";
 @import "../assets/css/cssReset.css";
 @import "../assets/css/message.css";
+.changelanguage{
+  width:124px;
+}
+.changelanguage .el-dropdown-menu__item .icon-duigou{
+  color:#000000;
+  position: absolute;
+  right: 10px;
+  font-size: 14px;
+}
+.changelanguage .el-dropdown-menu__item{
+  padding:0;
+  padding-left:15px;
+  font-size: 14px;
+  position: relative;
+  color:#333333;
+}
+.changelanguage .el-dropdown-menu__item:hover{
+  background: #D9D9D9;
+  color:#333333;
+}
 ._dropdown.el-dropdown-menu {
   padding: 0;
   background-color: #1f2533 !important;