<template>
  <el-dropdown trigger="click"
               @command="handleSetLanguage">
    <img :src="require(`@/../public/img/bg/login_CnEn-${changeIcon}.png`)" alt="">
    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item :disabled="language==='zh'"
                        command="zh">中文
      </el-dropdown-item>
      <el-dropdown-item :disabled="language==='en'"
                        command="en">English
      </el-dropdown-item>
    </el-dropdown-menu>
  </el-dropdown>
</template>

<script>
  import {mapGetters} from "vuex";

  export default {
    name: "top-lang",
    data() {
      return {
        changeIcon: 1
      };
    },
    created() {
    },
    mounted() {
    },
    computed: {
      ...mapGetters(["language", "tag"])
    },
    props: [],
    methods: {
      handleSetLanguage(lang) {
        this.changeIcon = (this.changeIcon === 1 ? 2 : 1)
        this.$i18n.locale = lang;
        this.$store.commit("SET_LANGUAGE", lang);
        let tag = this.tag;
        let title = this.$router.$avueRouter.generateTitle(
          tag.label,
          (tag.meta || {}).i18n
        );
        //根据当前的标签也获取label的值动态设置浏览器标题
        this.$router.$avueRouter.setTitle(title);
      }
    }
  };
</script>

<style lang="scss" scoped>
</style>
