<template>
   <v-picker class="d-inline-block" :value="lang" :list="langList" @change="selectLang" range-key="label">
     <!-- {{label}} -->
	 <image v-if="theme=='dark'" src="@/assets/img/icon/language2.png" mode="widthFix" style="width: 40rpx;padding-top: 35rpx;"></image>
	 <image v-else src="@/assets/img/icon/language1.png" mode="widthFix" style="width: 40rpx;padding-top: 35rpx;"></image>
   </v-picker>
</template>
<script>
import { mapState, mapActions } from "vuex";
export default {
  name: "v-lang",
  props: {
    tag: {
      default: "span",
      type: String,
      required: false,
    },
  },
  computed: {
    ...mapState({
      langList: "langList",
      lang: "lang",
	  theme: "theme",
    }),
    label() {
      return this.langList.find((item) => item.value == this.lang).label;
    }
  },
  methods: {
    ...mapActions({
      setLang: "setLang",
    }),
    getCurrent(){
        let pages = getCurrentPages();
        let curPage = pages[pages.length - 1];
        return curPage
    },
    selectLang(value) {
      this.setLang(value)
      this.$emit('change')
      let path = '/'+this.getCurrent().route
    },
  },
};
</script>
<style lang="scss" scoped>
	
</style>