import {
	inject,
	observer
} from 'mobx-react';
import {
	WeaTop,
	WeaRightMenu,
	WeaLocaleProvider,
	WeaLeftRightLayout,
} from 'ecCom';
import {
	NoData,
} from '../../public/learn';
const getLabel = WeaLocaleProvider.getLabel;

import {
	LeftTree,
	Loading,
} from '../../public/learn';

import Tab from './Tab';
import RadioGroup from './RadioGroup';
import Table from './Table';

@inject('hrmVacationBalance')
@observer
class Top extends React.Component {
	constructor(props) {
		super(props);
	}

	renderContent = () => {
		return (<div>
					<Tab ecId={`${this && this.props && this.props.ecId || ''}_Tab@wamz5o`} />
		            <div style={{padding: 10}}>
						<RadioGroup ecId={`${this && this.props && this.props.ecId || ''}_RadioGroup@moq78r`} /> 
					</div>
		            <div style={{margin: '0 10px', border:'1px solid #f0eded', borderRadius: 3}}>
		            	<Table ecId={`${this && this.props && this.props.ecId || ''}_Table@2gxm69`} />
		            </div>
            	</div>)

	}

	getContent = (hasContent) => {
		if (hasContent) {
			return this.renderContent()
		} else {
			return <NoData ecId={`${this && this.props && this.props.ecId || ''}_NoData@lrjfjz`} />
		}
	}


	render() {
		const {
			hrmVacationBalance,
		} = this.props, {
			topTitle,
			orgTreeStaticProps,
			topButtons,
			dropMenuDatas,
			topComponentStaticProps,
			orgTree,
			handleOrgTreeNodeClick,
			table,
			hasContent,
		} = hrmVacationBalance, {
			triggerRefresh
		} = orgTree, {
			tableStore
		} = table;

		return (
			<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@kh5bxi`} 
				title={topTitle}
                loading={tableStore.loading}
                buttons={topButtons}
                dropMenuDatas={dropMenuDatas}
                {...topComponentStaticProps}
            >
            	<WeaLeftRightLayout ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftRightLayout@q3962p`}
                   isNew={true}
                   leftCom={<LeftTree ecId={`${this && this.props && this.props.ecId || ''}_LeftTree@hwz81u`} {...orgTreeStaticProps} triggerRefresh={triggerRefresh} handleOrgTreeNodeClick={params => handleOrgTreeNodeClick(params)}/>}>
                   	<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@2ktb19`} datas={dropMenuDatas}>
                   		{this.getContent(hasContent)}
                	</WeaRightMenu>
                </WeaLeftRightLayout>
            </WeaTop>
		)
	}
}

export default Top;