import {
	toJS
} from 'mobx';
import {
	observer
} from 'mobx-react';
import {
	WeaTransfer,
	WeaDialog,
} from 'ecCom';
import CenterSpin from '../../public/components/CenterSpin.js';

@observer
export default class ColsetDialog extends React.Component {
	render() {
		const {
			store
		} = this.props, {
			hrmAddressBookPlus: plusStore
		} = store, {
			DIALOG_COLSET,
			colsetDialog,
			colsetDialogTitle,
			transfer,
			TRANSFER,
			colsetDialogButtons,
			colsetDialogMoreBtn,
		} = plusStore, {
			loading,
			visible
		} = colsetDialog, {
			data,
			selectedKeys
		} = transfer;


		let children;
		if (loading) {
			children = <CenterSpin ecId={`${this && this.props && this.props.ecId || ''}_CenterSpin@vogppr`} />
		} else {
			children = <WeaTransfer ecId={`${this && this.props && this.props.ecId || ''}_WeaTransfer@saa4l2`} {...TRANSFER} data={toJS(data)} selectedKeys={toJS(selectedKeys)}/>;
		}

		return (
			<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@bd9h4j`} {...DIALOG_COLSET} visible={visible} title={colsetDialogTitle} buttons={colsetDialogButtons} moreBtn={colsetDialogMoreBtn}>
				{children}
			</WeaDialog>
		)
	}
}