import React, {
	Component
} from 'react';
import {
	inject,
	observer
} from 'mobx-react';
import {WeaLeftRightLayout} from 'ecCom';
import LeftContainer from './LeftContainer';
import RightContainer from './RightContainer';
import {
	i18n
} from '../../../public/i18n';
import ImportResource from '../../importresource/Import';

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

	componentDidMount() {
		const {
			hrmBatchUploadPhoto,
			hrmImportResource,
			rootStore,
			router
		} = this.props;
		rootStore && hrmBatchUploadPhoto.setRootStore(rootStore, router);
		hrmBatchUploadPhoto.setImportResource(hrmImportResource);
	}

	componentWillReceiveProps(nextProps) {}

	onClick = () => {
		if(this.refs.uploadComp != null){
			const containerId = this.refs.uploadComp.uploader.settings.browse_button[0].id;
			$(`#${containerId}`)[0].click()
		}
	}

	render() {
		const comProps = {
			store: this.props.hrmBatchUploadPhoto,
			routeProps: this.props.routeProps
		}
		const {
			rootStore
		} = this.props;
		const importProps = {
			mainTitle: i18n.label.batchUpload(),
			importLog: i18n.label.historyUploadRecord(),
			viewLog: i18n.label.viewUploadLogs(),
			viewLogTitle: i18n.label.uploadLogs(),
		}

		return (
			<div className='adjust'>
				<WeaLeftRightLayout ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftRightLayout@jfvvlg`} leftCom={(<LeftContainer ecId={`${this && this.props && this.props.ecId || ''}_LeftContainer@bjoqwa`} {...comProps}/>)}>
					<RightContainer ecId={`${this && this.props && this.props.ecId || ''}_RightContainer@tastmz`} {...comProps}/>
				</WeaLeftRightLayout>
				<ImportResource ecId={`${this && this.props && this.props.ecId || ''}_ImportResource@3t5t7n`} {...importProps}/>
			</div>
		)
	}
}