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 {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 {
			formTarget,
			formItemRender,
			childrenComponents,
			refreshForm,
			transferCount,
		} = 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@ux8ckz`} {...searchGroupProps}>
				<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@fvsri4`} className='dashboard'>
					<div className='selectTarget'>
						<FormInfo ecId={`${this && this.props && this.props.ecId || ''}_FormInfo@btcny4`} form={fromForm} formFields={fromFormFields} showLabel={false} itemRender={formItemRender}/>
					</div>
					<div className='transferCount' style={{backgroundImage:`url(${addContentPath('/hrm/hrm_e9/image/authAdjustTo.png')})`}}>
						<p>{transferCount}</p>
					</div>
					<div className='selectTarget'>
						<FormInfo ecId={`${this && this.props && this.props.ecId || ''}_FormInfo@rwmc24`} form={toForm} formFields={toFormFields} showLabel={false} itemRender={formItemRender} childrenComponents={childrenComponents}/>
					</div>
				</Row>
			</WeaSearchGroup>
		)
	}
}