import React, {
	Component
} from 'react';
import {
	observer
} from 'mobx-react';
import {
	Row,
	Col,
	Button
} from 'antd';
import {
	WeaSearchGroup
} from 'ecCom';
import {
	i18n
} from '../../public/i18n';
import FormInfo from '../../coms/FormInfo';
import FormInfoOld from '../../coms/FormInfo_old';
import {addContentPath} from '../../util/index.js'

@observer
export default class Dashboard extends Component {
	constructor(props) {
		super(props);
	}

	componentDidMount() {}

	componentWillReceiveProps(nextProps) {}

	render() {
		const {
			store
		} = this.props;
		const {
			doExcute,
			formTarget,
			fromFormItemRender,
			toFormItemRender,
			refreshForm,
			fromCount,
			toCount,
			showError,
			resetData,
			showResult,
			opImg
		} = store;
		const {
			fromForm,
			fromFormFields,
			toForm,
			toFormFields
		} = formTarget;

		const searchGroupProps = {
			title: i18n.label.selectObject(),
			showGroup: true
		}

		return (
			<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@5k2xhp`} {...searchGroupProps}>
				<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@vjp9u1`} className='dashboard'>
					<div className='selectTarget'>
						<div className='from' style={{backgroundImage:`url(${addContentPath('/hrm/hrm_e9/image/authAdjustFrom.png')})`}}>
							<p>{fromCount}</p>
						</div>
						<div className='formContent'>
							<FormInfoOld ecId={`${this && this.props && this.props.ecId || ''}_FormInfoOld@snpooz`} center={false} form={fromForm} formFields={fromFormFields} showLabel={false} itemRender={fromFormItemRender}/>
						</div>
					</div>
					<div>
						<img src={addContentPath(`/hrm/hrm_e9/image/${opImg}.png`)}/>
					</div>
					<div className='selectTarget'>
						<div className='to' style={{backgroundImage:`url(${addContentPath('/hrm/hrm_e9/image/authAdjustTo.png')})`}}>
							<p>{toCount}</p>
						</div>
						<div className='formContent'>
							<FormInfoOld ecId={`${this && this.props && this.props.ecId || ''}_FormInfoOld@6lzoa5`} center={false} form={toForm} formFields={toFormFields} showLabel={false} itemRender={toFormItemRender}/>
						</div>
					</div>
					<div className='op'>
					{
						showResult 
						?
						<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ef9dip`} type='primary' onClick={resetData}>{i18n.button.goBack()}</Button>
						:
						<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@gjypzg`} type='primary' onClick={doExcute}>{i18n.button.doExcute()}</Button>
					}
					</div>
				</Row>
			</WeaSearchGroup>
		)
	}
}