header.js 1.51 KB
import {
	mapState
} from 'vuex'

import {
	getObjByListKeyValue
} from '@utils/utils.js'
import VDropdown from '@components/home/dropdown/dropdown.vue'

export default {
	name: 'VHeader',
	components: {
		VDropdown
	},
	computed: {
		i18n() {
			return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
		}
	},
	data() {
		return {
			maxClientWidth: 950,
			navList: [],
			loginData: {},
			langData: {
				name: "繁",
				path: "",
				list: [{
						name: "繁",
						path: "",
						value: "tc"
					},
					{
						name: "简",
						path: "",
						value: "zh"
					},
					{
						name: "EN",
						path: "",
						value: "en"
					},
				]
			}
		}
	},
	computed: {
		...mapState({
			isSmallScreen: state => state.isSmallScreen
		})
	},
	methods: {
		toIndex() {
			this.$router.push({
				path: "/"
			})
		},
		checkIsSmallScreen() {
			const self = this;
			if (document.body.clientWidth > self.maxClientWidth) {
				self.$store.commit('IS_SMALL_SCREEN', false)
			} else {
				self.$store.commit('IS_SMALL_SCREEN', true)
			}
		},
		initData() {
			let i18n = this.$i18n.messages[this.$i18n.locale] || {};
			this.loginData = i18n.nav.loginData;
			this.navList = i18n.nav.navList;
			let curLang = getObjByListKeyValue(this.$i18n.locale, "value", this.langData.list)
			this.langData.name = curLang.name;
		}
	},
	mounted() {
		const self = this;
		self.checkIsSmallScreen();
		document.body.onresize = () => {
			self.checkIsSmallScreen();
		}
	},
	created() {
		this.initData();
	},
}