import {
	inject,
	observer,
} from 'mobx-react'
import {
	toJS
} from 'mobx'
import {
	WeaRightMenu,
	WeaTableEdit,
} from 'ecCom'
import {
	Spin,
} from 'antd'
import {
	i18n
} from '../../public/i18n';

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

	componentDidMount() {
		const {
			hrmTrainArrange
		} = this.props, {
			getTrainSchedule
		} = hrmTrainArrange;

		getTrainSchedule();
	}

	componentWillUnmount() {
		const {
			hrmTrainArrange
		} = this.props, {
			refreshTableEdit
		} = hrmTrainArrange;

		refreshTableEdit();
	}

	getDropMenuDatas = () => {
		const {
			hrmTrainArrange
		} = this.props, {
			schedule
		} = hrmTrainArrange;

		const menu = [{
			key: '0',
			icon: <i className='icon-coms-Preservation' />,
			content: i18n.button.save(),
		}];

		return menu
	}

	handleMenuClick = (key) => {
		const {
			hrmTrainArrange
		} = this.props, {
			saveSchedule,
		} = hrmTrainArrange;

		key == '0' && saveSchedule();
	}

	render() {
		const {
			hrmTrainArrange
		} = this.props, {
			schedule,
			setTableEditDatas,
			setRef,
		} = hrmTrainArrange, {
			columns,
			datas,
			loading,
		} = schedule;

		return (
			<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@62v37g`} spinning={loading}>
				<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@e9eyxp`} datas={this.getDropMenuDatas()} onClick={ key => this.handleMenuClick(key)}>
		            <WeaTableEdit ecId={`${this && this.props && this.props.ecId || ''}_WeaTableEdit@5pprzb`}
		            	ref={com => setRef(com)}
		          		title={i18n.label.trainSchedule()}
		          		columns={toJS(columns)}
		          		datas={toJS(datas)}
		          		onChange={datas => setTableEditDatas(datas)}
		        	/>
		        </WeaRightMenu>
	        </Spin>
		)

	}
}