import {
	inject,
	observer,
} from 'mobx-react'

import {
	WeaTop,
	WeaTab,
	WeaRightMenu,
	WeaAlertPage
} from 'ecCom'

import {
	Spin,
	Button,
} from 'antd'

import {
	WeaSwitch
} from 'comsMobx'

import {
	i18n
} from '../../public/i18n';

import React from 'react'
import * as mobx from 'mobx'
const toJS = mobx.toJS;

import Birthday from './Birthday'
import EntryRemind from './EntryRemind'

import '../../style/birthday.css'

@inject('hrmBirthdayRemindSet')
@observer
export default class BirthdayRemind extends React.Component {
	constructor(props) {
		super(props);
	}

	componentWillMount() {
		let bool = window.location.href.indexOf('/spa/hrm/engine.html') > -1;
		if (bool) {
			document.title = i18n.module.letStaffFeelWarm();
		}
	}

	componentWillReceiveProps(nextProps) {
		if (this.props.location.key !== nextProps.location.key) {
			this.init();
		}
	}

	componentDidMount() {
		this.init();
	}

	init() {
		const {
			hrmBirthdayRemindSet
		} = this.props, {
			mobxDataReset,
			getRight,
			setLocationKey
		} = hrmBirthdayRemindSet;

		getRight();

	}

	getTopMenuBtns() {
		const {
			hrmBirthdayRemindSet
		} = this.props, {
			menu
		} = hrmBirthdayRemindSet, {
			topMenu
		} = menu;

		let btns = [];
		toJS(topMenu).map((item, index) => {
			btns.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ed7m74@${index}`} type='primary' onClick={() => this.handleClick(item)} >{item.menuName}</Button>);
		});
		return btns;
	}

	handleClick(item) {
		this[item.menuFun] && this[item.menuFun]();
	}

	getDropMenuDatas() {
		const {
			hrmBirthdayRemindSet
		} = this.props, {
			menu,
			selectedKey
		} = hrmBirthdayRemindSet, {
			rightMenu
		} = menu;

		let menus = [];
		let arr = (selectedKey == '1') ? rightMenu.filter(m => m.menuFun !== 'custom') : rightMenu;

		arr.map((item, index) => {
			let obj = {
				key: item.menuFun,
				icon: <i className={`${item.menuIcon}`}/>,
				content: item.menuName,
			}
			if (item.menuFun == 'collection' || item.menuFun == 'help' || item.menuFun == 'pageAddress') {
				obj.disabled = true;
			}
			menus.push(obj);
		})

		return menus;
	}

	handleMenuClick(key) {
		this[key] && this[key]();
	}

	save() {
		const {
			hrmBirthdayRemindSet
		} = this.props, {
			selectedKey,
			tabOneSave,
			tabTwoSave,
			entryRemindSave,
			tabs,
		} = hrmBirthdayRemindSet, {
			key
		} = tabs;

		if (selectedKey == '0') {
			key == '0' ? tabOneSave() : tabTwoSave();
		} else {
			entryRemindSave()
		}

	}

	log = () => {
		const {
			hrmBirthdayRemindSet
		} = this.props, {
			tabs,
		} = hrmBirthdayRemindSet, {
			key
		} = tabs;

		window.setLogViewProps({
			logSmallType: (key == '0') ? '3026' : '3027',
		});
	}

	custom = () => {
		const {
			hrmBirthdayRemindSet
		} = this.props, {
			tabOne,
		} = hrmBirthdayRemindSet, {
			tableStore
		} = tabOne;

		tableStore.setColSetVisible(true);
		tableStore.tableColSet(true);
	}

	getTabName() {
		const tabName = [{
			key: '0',
			title: i18n.module.birthdayRemind()
		}, {
			key: '1',
			title: i18n.label.anniversaryReminding()
		}, ]
		return tabName;
	}

	render() {
		const {
			hrmBirthdayRemindSet
		} = this.props, {
			loading,
			weaTopTitle,
			selectedKey,
			authorized,
			setSelectedKey,
		} = hrmBirthdayRemindSet;

		if (!authorized) {
			return (
				<div style={{height: '100%'}}>
					{loading ?  <div className='hrm-loading-center'>
									<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@lt6gus`} spinning={loading} size='large'></Spin>
								</div>
						     :	<div className="hrm-wea-alert-page">
		                			<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@3ofgr8`}>
						                <div style={{ color: '#000' }}>
						                    {i18n.message.authFailed()}
						                </div>
		                      		</WeaAlertPage>
	                        	</div>
	                }	
                </div>
			)
		} else {
			return (
				<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@6deoo0`} 
					datas={this.getDropMenuDatas()} 
					onClick={ key => this.handleMenuClick(key)}
					collectParams={{favname:weaTopTitle,favouritetype:5}}
				>
	                <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@3ug6ly`} 
	                    title={weaTopTitle}
	                    icon={<i className='icon-coms-hrm'/>}
	                    iconBgcolor='#217346'
	                    loading={true}
	                    buttons={this.getTopMenuBtns()}
	                    showDropIcon={true}
	                    dropMenuDatas={this.getDropMenuDatas()}
	                    onDropMenuClick={(e) => this.handleMenuClick(e)}
	                >
	                    <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@ttw9ir`}
			                selectedKey={selectedKey}
			                datas={this.getTabName()}
			                keyParam='key'
			                onChange={(key) => setSelectedKey(key)}
	            		/>
	            			{selectedKey=='0' ? <Birthday ecId={`${this && this.props && this.props.ecId || ''}_Birthday@yxdtea`} /> : <EntryRemind ecId={`${this && this.props && this.props.ecId || ''}_EntryRemind@hwl4oc`} />}
	                </WeaTop>
	            </WeaRightMenu>
			)
		}

	}


}