import React, {
	Component
} from 'react';
import {
	inject,
	observer
} from 'mobx-react';
import {
	WeaTop,
	WeaAlertPage,
	WeaRightMenu,
	WeaSearchGroup,
	WeaNewScroll,
	WeaLocaleProvider
} from 'ecCom';
import {Spin} from 'antd';
import ImportResource from '../../../hrmengine/components/importresource/Import';
import {
	i18n
} from '../../public/i18n';
const getLabel = WeaLocaleProvider.getLabel;

@inject('hrmImportExternalAttendance')
@inject('hrmImportResource')
@observer
export default class ImportExtenalAttendanceData extends Component {
	constructor(props) {
		super(props);
	}

	componentDidMount() {
		this.init();
	}

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

	componentWillUnmount() {
		const {
			hrmImportExternalAttendance: store,
		} = this.props;
		store.resetImportResource();
	}

	init = () => {
		const {
			hrmImportExternalAttendance: store,
			hrmImportResource
		} = this.props;
		const {
			checkAuthorized,
			initData
		} = store;
		store.setImportResource(hrmImportResource);
		checkAuthorized('schedulesignimport', null, initData);
	}

	render() {
		const {
			hrmImportExternalAttendance: store
		} = this.props;
		const {
			containerInitFinished,
			topBtnAndMenu,
			message,
			spinning
		} = store;
		const {
			btns,
			menus
		} = topBtnAndMenu();
		let children = [];
		if (message.length > 0) {
			message.map(m => {
				children.push(<div>{m}</div>)
			})
		}
		const msgCom = <div style={{color: 'red'}}>{children}</div>;

		return (
			<div className="hrm_module_container">
				{
					containerInitFinished.init && containerInitFinished.authorized &&
					<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@6dduhy`} spinning={spinning}>
						<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@41obf7`}
							title={getLabel(33539, '考勤外部数据导入')}
							icon={<i className='icon-coms-hrm'/>}
							iconBgcolor='#217346'
							showDropIcon={true}
							buttons={btns}
							dropMenuDatas={menus}
						>
							<WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@7xtqlv`} height={'100%'}>
								<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@jef71e`} datas={menus}>
									<ImportResource ecId={`${this && this.props && this.props.ecId || ''}_ImportResource@751eto`}/>
									{
										message.length > 0 && 
										<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@1trxhn`} col={1} showGroup={true} title={getLabel(24960, '提示信息')} items={[{com:msgCom}]}/>
									}
								</WeaRightMenu>
							</WeaNewScroll>
						</WeaTop>
					</Spin>
				}
				{
					containerInitFinished.init && !containerInitFinished.authorized && 
	              	<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@6hkmms`}>
	                  	<div style={{ color: '#000' }}>{i18n.message.authFailed()}</div> 
	                </WeaAlertPage>
				} 
			</div>
		)
	}
}