import {
	mapState
} from 'vuex'

import api from '@/api/api'
import {
	httpPost
} from '@/api/fetch-api.js'

export default {
	name: "DropDownList",
	data() {
		return {
			navList: [],
			activeNames: [],
			activeName: [],
			activeIndex: -1,
			borderBoo: false
		};
	},
	props: {
		visible: {
			type: Boolean,
			default () {
				return false;
			}
		},
		/**
		 * 导航类型
		 * nav:普通菜单导航
		 * login:登陆菜单
		 * lang:三语切换菜单
		 */
		type: {
			type: String,
			default () {
				return "nav";
			}
		},
		/**
		 * 传入菜单列表
		 */
		langList: {
			type: Array,
			default () {
				return [];
			}
		},
		// 显示/隐藏移动端导航
		showDropdownM: {
			type: Function,
			default: null
		},
	},
	computed: {
		...mapState({
			isSmallScreen: state => state.isSmallScreen,
			userInfo: state => state.userInfo
		}),
		locale() {
			return this.$i18n.locale || 'tc';
		},
		i18n() {
			return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
		},
	},
	methods: {
		// 跳转菜单
		onClickHandler(item) {
			let path = item && item.path || "";
			this.showDropdownM('');
			if (path) {
				this.$router.push({
					path: path
				})
			} else {
				let value = item && item.value || null;
				if (value) {
					switch (value) {
						case "login":
							this.onLoginHandler();
							break;
						case "logout":
							this.logoutHandler();
							break;
						case "gotoVHIS":
							// gotoVHIS(this.$i18n.locale);
							this.$router.push({
								path: "/vhis"
							});
							break;
					}
				}
			}
		},
		onLoginHandler() {
			if (this.$route.name == "login") {
				return;
			} else if (this.$route.name == "register" || this.$route.name == "passwordFind") {
				this.$router.push({
					path: "/login"
				});
			} else {
				let callback = this.$route.fullPath;
				this.$router.push({
					path: "/login?callback=" + callback
				});
			}
		},
		logoutHandler() {
			this.clearCache();
			httpPost({
				url: api.logout
			}).then(() => {
				this.$store.commit("SET_USER_INFO", null);
				this.showLogoutTip();
			});
		},
		clearCache() {
			for (let index = 0; index < sessionStorage.length; index++) {
				let key = sessionStorage.key(index);
				sessionStorage.removeItem(key);
			}
		},
		// 点击item
		onChangeHandler(evt) {
			this.activeIndex = evt;
		},
		/**
		 * 设置语言
		 */
		setLangHandler(curData) {
			this.showDropdownM('');
			// 如果是语言设置，则设置语言
			let lang = curData.value;
			this.$i18n.locale = lang;
			localStorage.setItem("lang", lang);
			this.sTitle = curData.name;
			window.location.reload();
		},
		initData() {
			let navList = [];
			if (this.type == "nav") {
				navList = this.i18n.nav.navList;
				navList.forEach(element => {
					this.activeNames.push(
						[]
					)
				});
			} else if (this.type == "login") {
				// 构建登陆页面
				let i18n = this.$i18n.messages[this.$i18n.locale] || {};
				let menuData = JSON.parse(JSON.stringify(i18n.nav.loginData));
				let list = [];
				if (this.userInfo && this.userInfo.name) {
					menuData.name = this.userInfo.name;
					menuData.list.forEach(element => {
						if (element.type == "auth") {
							list.push(element);
						}
					});
				} else {
					menuData.list.forEach(element => {
						if (element.type == "noAuth") {
							list.push(element);
						}
					});
				}
				// menuData.list = list;
				navList = list;
				// console.log("navList:", navList);
			}
			this.navList = navList;

		}
	},
	created() {
		this.initData();
	},
	watch: {
		visible(newVal, oldVal) {
			this.$nextTick(() => {
				this.$refs.panel.scrollTop = 0;
			});
		},
		userInfo(val) {
			this.initData();
		}
	},
};