import {
	inject,
	observer,
} from 'mobx-react'
import {
	toJS
} from 'mobx';
import {
	WeaFormItem,
	WeaHelpfulTip,
} from 'ecCom'
import {
	WeaSwitch
} from 'comsMobx'
import {
	Modal,
} from 'antd'
import {
	i18n
} from '../../public/i18n';
const confirm = Modal.confirm;

@inject('hrmSalaryItemsSet')
@observer
export default class FormInfo extends React.Component {
	constructor(props) {
		super(props);
	}

	componentWillUnmount() {
		const {
			hrmSalaryItemsSet
		} = this.props, {
			refreshFormInfo
		} = hrmSalaryItemsSet;

		refreshFormInfo();
	}

	getForm = () => {
		const {
			hrmSalaryItemsSet
		} = this.props, {
			formInfo,
		} = hrmSalaryItemsSet, {
			form,
			conditions,
			itemType,
			isShow,
			itemTypeTips,
		} = formInfo, {
			isFormInit,
		} = form;

		let arr = [];
		isFormInit && conditions.map(c => {
			c.items.map((field, index) => {
				const key = field.domkey[0];
				if (itemType == '1' && (key == 'taxrelateitem' || key == 'directModify' || key == 'calMode' || key === 'zxfjkcxm')) { //工资
					return
				}

				if (['3', '11'].includes(itemType) && (key == 'directModify' || key == 'calMode')) {
					return
				}

				if (itemType === '3' && key === 'zxfjkcxm') { //税收
					return
				}

				if (itemType == '4' && (key == 'taxrelateitem' || key == 'calMode' || key === 'zxfjkcxm')) { //计算
					return
				}

				if (itemType == '9' && (key == 'taxrelateitem' || key === 'zxfjkcxm')) { //福利计算
					return
				}

				if (isShow == '0' && (key == 'showorder' || key === 'zxfjkcxm')) { //是否显示在工资表
					return
				}
				if(key == 'isNegativeNum' && !['4','9'].includes(itemType)){
					return;
				}
				arr.push(<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@snu5be@${index}`}
                            label={`${field.label}`}
                            labelCol={{span: 5, offset: 3}}
                            wrapperCol={{span: 12}}
                            error={form.getError(field)}
                            tipPosition="bottom"
                        >
                            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@00x4j8@${index}`} fieldConfig={field} form={form} formParams={form.getFormParams()} onChange={cb => this.handleChange(cb)}/>
                       		{
                       			key === 'itemtype' && ['3', '11'].includes(itemType) && (
                       				<div style={{position:'absolute',top:5,right:-25}}>
								        <WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@etyjti@${index}`}
								          title={itemTypeTips[itemType]}
								        />
								      </div>
                       			)
                       		}
                        </WeaFormItem>)
			})
		})
		return <div>{arr}</div>
	}

	handleChange = (cb) => {
		const {
			hrmSalaryItemsSet
		} = this.props, {
			exportSelectedValue,
			getTableEditDatas,
			formInfo,
		} = hrmSalaryItemsSet, {
			itemType,
			form
		} = formInfo;

		const key = Object.keys(cb)[0];

		if (key == 'itemtype') { //类型
			const value = cb[key].value;

			exportSelectedValue(value, 'itemType');
			//当前类型为【工资】时，加载列表数据
			(value == '1') && getTableEditDatas();
		}

		if (key == 'calMode') { //计算方式
			exportSelectedValue(cb.calMode.value, 'calMode');
		}

		if (key == 'isshow') { //是否显示在工资表
			exportSelectedValue(cb.isshow.value, 'isShow');
		}

		if (key == 'subcompanyid' || key == 'applyscope' || key == 'calMode') { //这三个字段切换时，需要弹出confirm框。
			let val;

			if (key == 'subcompanyid') val = [cb.subcompanyid];
			if (key == 'applyscope') val = cb.applyscope.value;
			if (key == 'calMode') val = cb.calMode.value;

			if (key == 'subcompanyid') {
				exportSelectedValue(val, 'sub');
			}
			if (key == 'applyscope') {
				exportSelectedValue(val, 'applyscope');
			}

			// this.showConfirm(key, val);
		}
		if (key == 'subcompanyid' && !form.getFormParams().subcompanyid) return;

		if ((key == 'subcompanyid' || key == 'applyscope') && itemType == '1') getTableEditDatas()


	}

	showConfirm = (key, val) => {
		let _this = this;
		confirm({
			title: i18n.confirm.defaultTitle(),
			content: i18n.confirm.refreshWarning(),
			okText: i18n.button.ok(),
			cancelText: i18n.button.cancel(),
			onOk() {
				_this.onOk(key, val)
			},
			onCancel() {
				_this.reduction(key); //还原
				return false
			},
		});
	}

	onOk = (key, val) => {
		const {
			hrmSalaryItemsSet
		} = this.props, {
			exportSelectedValue
		} = hrmSalaryItemsSet;

		if (key == 'subcompanyid') {
			exportSelectedValue(val, 'sub');
		}
		if (key == 'applyscope') {
			exportSelectedValue(val, 'applyscope');
		}
	}

	reduction = (key) => {
		const {
			hrmSalaryItemsSet
		} = this.props, {
			formInfo,
			exportSelectedValue
		} = hrmSalaryItemsSet, {
			itemType,
			isShow,
			sub,
			form,
			applyscope
		} = formInfo;

		if (key == 'subcompanyid') {
			form.updateFields({
				subcompanyid: toJS(sub)
			});
		}
		if (key == 'applyscope') {
			form.updateFields({
				applyscope: applyscope
			});
		}
		if (key == 'calMode') {
			form.updateFields({
				calMode: (form.getFormParams().calMode == '1') ? '2' : '1'
			});
		}
	}



	render() {
		const {
			hrmSalaryItemsSet,
		} = this.props, {
			formInfo,
		} = hrmSalaryItemsSet, {
			date,
			loading,
		} = formInfo;

		return (<div style={{paddingBottom: 25}}>
			    	{this.getForm()}
			    </div>)
	}
}