import React, {
	Component
} from 'react';
import {
	Button,
	Form,
	Row,
	Col
} from 'antd';
import {
	WeaFormItem,
	WeaNewScroll,
	WeaSearchGroup,
} from 'ecCom';
import {
	WeaSwitch
} from 'comsMobx';
import _ from 'lodash';

export default class AdvanceSearchFormInfo extends Component {
	renderForm = () => {
		const {
			form,
			formFields,
			itemRender
		} = this.props;
		let arr = [];
		let formParams = form.getFormParams();
		formFields.map(c => {
			let _arr = [];
			c.items.map((field, index) => {
				const customerRender = itemRender != null ? itemRender[field.domkey[0]] : null;
				const itemProps = {
					ratio1to2: true,
					label: field.label,
					labelCol: {
						span: `${window.HrmEngineLabelCol}`
					},
					error: form.getError(field),
					tipPosition: 'bottom',
					wrapperCol: {
						span: `${window.HrmEngineWrapperCol}`
					}
				}
				let coms;
				if (customerRender == null) {
					coms = <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@2tsobq@${index}`} fieldConfig={field} form={form}/>;
				} else {
					coms = customerRender(field, form, formParams);
				}
				coms != null && _arr.push(
					(
						<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@xgrs6h@${index}`} span={11} offset={index % 2 === 0 ? 1 : 0}>
							<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@l40w8j@${index}`}
								ratio1to2
			                    label={`${field.label}`}
			                    labelCol={{span: `${window.HrmEngineLabelCol}`}}
			                    error={form.getError(field)}
			                    tipPosition={'bottom'}
			                    wrapperCol={{span: `${window.HrmEngineWrapperCol}`}}
			                 >
			                     {coms}
			                 </WeaFormItem>
		                </Col>
					)
				)
				if (_arr.length === 2 || index === c.items.length - 1) {
					const clone = [..._arr];
					_arr.length = 0;
					arr.push(<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@s73jjd@${index}`} gutter={8} style={{marginTop: '10px'}}>{clone}</Row>);
				}
			})
		})
		return <Form ecId={`${this && this.props && this.props.ecId || ''}_Form@ojbzkx`}>{arr}</Form>;
	}

	renderGroupForm = () => {
		const {
			form,
			formFields,
			itemRender
		} = this.props;
		let formParams = form.getFormParams();
		let arr = [];
		formFields.map((c, i) => {
			let _arr = [];
			c.items.map((field, index) => {
				const customerRender = itemRender != null ? itemRender[field.domkey[0]] : null;
				const itemProps = {
					ratio1to2: true,
					label: field.label,
					labelCol: {
						span: `${window.HrmEngineLabelCol}`
					},
					error: form.getError(field),
					tipPosition: 'bottom',
					wrapperCol: {
						span: `${window.HrmEngineWrapperCol}`
					}
				}
				let coms;
				if (customerRender == null) {
					coms = <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@baa9pz@${index}`} fieldConfig={field} form={form}/>;
				} else {
					coms = customerRender(field, form, formParams);
				}
				coms != null && _arr.push({
					com: (
						<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@t6u2oa@${index}`}
								ratio1to2
                                label={`${field.label}`}
                                labelCol={{span: `${window.HrmEngineLabelCol}`}}
                                error={form.getError(field)}
                                wrapperCol={{span: `${window.HrmEngineWrapperCol}`}}
                        >
                            {coms}
                        </WeaFormItem>
					),
					col: field.colSpan || 2
				})
			})
			arr.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@w7lkbb@${i}`} showGroup={c.defaultshow} items={_arr} fontSize={13}/>);
		})
		return arr;
	}

	renderFormComponent = () => {
		const {
			formFields
		} = this.props;

		const com = formFields.length > 1 ? this.renderGroupForm() : this.renderForm();
		return com;
	}

	render() {
		return (
			<WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@sx3az2`} height={'100%'}>
			{this.renderGroupForm()}
			</WeaNewScroll>
		)
	}
}