import React, {
	Component
} from 'react';
import ReactDOM from 'react-dom'
import {
	observer
} from 'mobx-react';
import {
	WeaRightMenu,
	WeaDialog,
	WeaTextarea
} from 'ecCom';
import {
	WeaTableNew
} from 'comsMobx';
import {
	findIndex
} from 'lodash';
import classnames from 'classnames';

const {
	WeaTable
} = WeaTableNew;

@observer
export default class DataList extends Component {
	constructor(props) {
		super(props);
	}

	showContent = (id) => {
		const {
			store
		} = this.props;
		const {
			getFormInfo
		} = store;
		getFormInfo({
			id
		});
	}


	doDel = (id) => {
		const {
			store
		} = this.props;
		const {
			multiRemove
		} = store;
		multiRemove({
			ids: id
		});
	}

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

	renderCol = (cols) => {
		const colKey1 = 'field001';
		let idx = findIndex(cols, item => item.dataIndex === colKey1);
		idx != -1 && (cols[idx].render = (text, record) => {
			return <a onClick={() => this.showContent(record.id)}>{record.field001}</a>
		});
	}

	render() {
		const {
			store,
			rightMenu
		} = this.props;
		const {
			table,
			dialogParams,
			getDialogOpButtons
		} = store;
		const classes = classnames({
			['tabPane-include']: true
		});
		const dProps = {
			...dialogParams,
			buttons: getDialogOpButtons(),
			className: "hrmDialog"
		}

		return (
			<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@zrbqyk`} datas={rightMenu}>
				<div className={classes}>
						<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@znjlns`}
							comsWeaTableStore={table}
							hasOrder={true}
							needScroll={true}
							onOperatesClick={(record, index, operate) => this.onOperatesClick(record, index, operate)}
							getColumns={cols => this.renderCol(cols)}
						/>
					<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@8anmzz`} {...dProps}>
						<div className='sdialog'>
							{dProps.coms}
						</div>
					</WeaDialog>
				</div>
			</WeaRightMenu>
		)
	}
}