<template>
  <div>
    <el-select style="width: 250px"  @change="changeLanguage" v-model="lang">
      <el-option v-for="lan in langList"
                 :key="lan.value"
                 :label="lan.label"
                 :value="lan.value">
      </el-option>
    </el-select>
  </div>
</template>
<script>
import {isNotNull} from "@/lang/index";
import { changeLanguages } from "@/api/loding";
import Bus from '../utils/Bus.js'
export default {
  name: "i18n",
  data(){
    return {
      lang: "tw",
      langList: [
			// {
			// 	label: "Tiếng Việt",
			// 	value: "vi"
			// },
        {
          label: "繁體中文",
          value: "tw"
        },
			// {
			// 	label: "简体中文",
			// 	value: "zh"
			// },
			// {
			// 	label: "English",
			// 	value: "en"
			// }
      ],
    }
  },
  created() {
    let value = localStorage.getItem("lang") || "tw";
	// console.log('========================',value)
	 this.lang = value;
	 this.changeLanguage(value);
  },
  methods: {
    changeLanguage(value){
      this.$i18n.locale = value;
      localStorage.setItem("lang", value);
      changeLanguages(value).then(response => {
        // console.info("change-language:" + value);
        Bus.$emit('l18zh',value);
        // window.location.reload();
      });
    },
  }
}
</script>
