import React from 'react';
import { Menu, Icon, message } from 'antd';
import '@/account/leftTab.less';
const SubMenu = Menu.SubMenu;
import { Link } from 'react-router';
import $ from 'jquery/src/ajax';
import { menu, menu1 } from '@/account/menu';
import logo from 'img/acc-logo.png';

const LeftTab = React.createClass({
	getInitialState() {
		return {
			newMenu: [],
			openKeys: ['sub1'],
			current: 'normal',
			switch: false,
			rootSubmenuKeys: ['sub1', 'sub2', 'sub3', 'sub4', 'sub5', 'sub6', 'sub7']
		};
	},
	loadData() {
		$.ajax({
			method: 'get',
			dataType: 'json',
			url: globalConfig.context + '/api/user/homePage',
			data: {}
		}).done(
			function (data) {
				if (!data.error.length) {
					this.setState({
						type: data.data.type
					});
					this.jurisdiction(data.data)
				} else {
					message.warning(data.error[0].message);
				}
			}.bind(this)
		);
	},
	menuClick(e) {
		this.setState({
			current: e.key
		});
		window.location.hash = e.key;
	},
	iconFun() {
		let menuW = document.querySelector('.ant-layout-sider');
		if (this.state.switch) {
			menuW.style.width = '200px';
			menuW.style.flex = '0 0 200px';
		} else {
			menuW.style.width = '50px';
			menuW.style.flex = '0 0 50px';
		}
		this.setState({
			switch: !this.state.switch
		});
	},
	onOpenChange(openKeys) {
		const latestOpenKey = openKeys.find((key) => this.state.openKeys.indexOf(key) === -1);
		if (this.state.rootSubmenuKeys.indexOf(latestOpenKey) === -1) {
			this.setState({ openKeys });
		} else {
			this.setState({
				openKeys: latestOpenKey ? [latestOpenKey] : []
			});
		}
	},
	hashFun() {
		if (window.location.hash) {
			let current = window.location.hash.substr(2),
				open = [];
			if (!current.length) {
				window.location.hash = 'normal';
				this.setState({
					openKeys: ['sub1'],
					current: 'normal'
				});
			} else {
				menu.map((item) => {
					if (item.children) {
						item.children.map((atem) => {
							if (current == atem.url) {
								open.push(item.url);
							}
						});
					}
				});
				this.setState({
					openKeys: open,
					current
				});
			}
		} else {
			window.location.hash = 'normal';
			this.setState({
				openKeys: ['sub1'],
				current: 'normal'
			});
		}
	},
	//菜单权限处理
	jurisdiction(data) {
		// lvl === 9 的时候使用menu1 (目的，用于只查看我的科技评估临时判断)
		if (userData.lvl === 9) {
			this.setState({ newMenu: menu1 });
		} else {
			let newMenu = menu;
			if (data.type) {   //企业用户
				newMenu[1].children.splice(2, 1);
			} else {			 //个人用户
				newMenu[1].children.splice(1, 1);
			};
			this.setState({ newMenu });
		}
	},
	componentWillMount() {
		this.loadData();
		this.hashFun();
	},
	render() {
		return (
			<div>
				<div className="acc-index">
					{!this.state.switch && <img src={logo} alt="" />}
					{!this.state.switch && (
						<span>
							<a href={globalConfig.context + '/user/account/index.html'}>会员中心管理</a>
						</span>
					)}
					<Icon type={this.state.switch ? 'forward' : 'backward'} className="icon" onClick={this.iconFun} />
				</div>
				<Menu
					onClick={this.menuClick}
					defaultOpenKeys={this.state.openKeys}
					selectedKeys={[this.state.current]}
					openKeys={this.state.openKeys}
					onOpenChange={this.onOpenChange}
					mode={this.state.switch ? 'vertical' : 'inline'}
					theme="light"
					className="account-left"
				>
					{this.state.newMenu.map((subMenu) => {
						if (subMenu.children && subMenu.children.length) {
							return (
								<SubMenu
									key={subMenu.url}
									title={
										<span>
											<Icon type={subMenu.icon} />
											{!this.state.switch && <span>{subMenu.name}</span>}
										</span>
									}
								>
									{subMenu.children.map((menu, index) => <Menu.Item key={menu.url}>{menu.name}</Menu.Item>)}
								</SubMenu>
							);
						}
						return (
							<Menu.Item key={subMenu.url}>
								<Link to={`/${subMenu.url}`}>
									<Icon type={subMenu.icon} />
									<span className="nav-text">{subMenu.name}</span>
								</Link>
							</Menu.Item>
						);
					})}
				</Menu>
			</div>
		);
	}
});

export default LeftTab;
