import React, {
	Component
} from 'react';
import ReactDOM from 'react-dom'
import {
	observer
} from 'mobx-react';
import {
	WeaNewScroll,
	WeaDialog,
} from 'ecCom';
import {
	WeaTableNew
} from 'comsMobx';
import {
	Spin
} from 'antd';
import classnames from 'classnames';
import {FormInfo} from '../../../hrmComsPublic/index';

const {
	WeaTable
} = WeaTableNew;

@observer
export default class CheckRuleList extends Component {
	doEdit = record => {
		const {
			store,
		} = this.props;
		store.doEditCheckRule(record);
	}

	doDelete = record => {
		const {
			store,
		} = this.props;
		store.deleteCheckRule({ids: record.id});
	}

	onOperatesClick = (record, index, operate) => {
		const func = operate.href ? operate.href.split(':')[1].split('(')[0] : '';
		this[func] && this[func](record);
	}

	render() {
		const {
			store,
			rightMenu
		} = this.props;
		const {
			spinning,
			refreshCheckRuleForm,
			checkRuleTable,
			formTarget,
			checkRuleDialogDialogProps,
			checkRuleFormItemRender,
			childrenComponents
		} = store;
		const className = classnames({
			['tabPane']: true,
			['tabPane-dialog']: true
		})

		
		const {
			checkRuleForm: form,
			checkRuleFormFields: fields,
		} = formTarget;

		return (
			<div className={className}>
				<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@os08hd`} spinning={spinning}>
					<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@vtu44l`}
                        comsWeaTableStore={checkRuleTable}
                        hasOrder={true}
                        needScroll={true}
                        onOperatesClick={(record, index, operate) => this.onOperatesClick(record, index, operate)}
                        // getColumns={cols => this.renderCol(cols)}
                    />
				</Spin>
				<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@wa32zw`} {...checkRuleDialogDialogProps} hasScroll>
					<div className='sdialog'>
						<FormInfo ecId={`${this && this.props && this.props.ecId || ''}_FormInfo@gy2b1p`} 
							center={true}
							form={form} 
							formFields={fields} 
							childrenComponents={childrenComponents}
							itemRender={checkRuleFormItemRender}/>
					</div>
				</WeaDialog>
			</div>
		)
	}
}