import {
	inject,
	observer,
} from 'mobx-react'
import {
	WeaTab,
	WeaButtonIcon,
} from 'ecCom'
import {
	Modal,
} from 'antd'
import {
	i18n
} from '../../public/i18n';
const confirm = Modal.confirm;

import FormInfo from './FormInfo';
import SubTable from './SubTable';

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

	componentDidMount() {
		const {
			hrmTrainActivity
		} = this.props, {
			clickTab,
			mainTable,
		} = hrmTrainActivity, {
			index
		} = mainTable;

		(index == '0') && clickTab('0', 'sub');
	}

	componentWillUnmount() {
		const {
			hrmTrainActivity
		} = this.props, {
			resetTab
		} = hrmTrainActivity;

		resetTab('third');
	}

	getTab = () => {
		const {
			hrmTrainActivity
		} = this.props, {
			mainTable
		} = hrmTrainActivity, {
			index
		} = mainTable;

		let tabs;
		if (index == '0') { //编辑
			tabs = [{
				key: '0',
				title: i18n.label.basicInfo(),
			}, {
				key: '1',
				title: i18n.label.trainSchedule(),
			}, {
				key: '2',
				title: i18n.label.trainTest(),
			}, {
				key: '3',
				title: i18n.label.trainReview(),
			}]
		} else { //培训考核、培训考评
			tabs = [];
		}

		return tabs
	}

	getContent = () => {
		const {
			hrmTrainActivity
		} = this.props, {
			mainTable,
			subTab,
		} = hrmTrainActivity, {
			curKey
		} = subTab, {
			index
		} = mainTable;

		if (index == '0') { //编辑
			if (curKey == '0') {
				return <FormInfo ecId={`${this && this.props && this.props.ecId || ''}_FormInfo@vcoxsa`} />
			} else {
				return <SubTable ecId={`${this && this.props && this.props.ecId || ''}_SubTable@ang0x5`} />
			}
		} else { //培训考核、培训考评
			return <SubTable ecId={`${this && this.props && this.props.ecId || ''}_SubTable@ag84ba`} />
		}
	}

	getButtons = () => {
		const {
			hrmTrainActivity
		} = this.props, {
			mainDialogMenu,
			openSubDialog,
			subTable,
			subTab,
			mainTable,
		} = hrmTrainActivity, {
			topMenu
		} = mainDialogMenu, {
			tableStore
		} = subTable;

		const len = tableStore.selectedRowKeys.length;

		const add = <WeaButtonIcon ecId={`${this && this.props && this.props.ecId || ''}_WeaButtonIcon@38iwcg`} buttonType='add' type="primary" onClick={() => openSubDialog()}/>;

		const del = <WeaButtonIcon ecId={`${this && this.props && this.props.ecId || ''}_WeaButtonIcon@198dzh`} buttonType='del' type="primary" disabled={len > 0 ? false : true} onClick={() => this.showConfirm()} />;

		let btns = [];
		((mainTable.index == '0' && subTab.curKey !== '0') || mainTable.index !== '0') && topMenu.map(menu => {
			const funcname = menu.menuFun;
			if (funcname == 'new') btns.push(add);
			if (funcname == 'batchDelete') btns.push(del);
		});

		return btns
	}

	batchDelete = () => {
		this.showConfirm();
	}

	showConfirm = () => {
		let _this = this;
		confirm({
			title: i18n.confirm.defaultTitle(),
			content: i18n.confirm.batchDeleteConfirm(),
			okText: i18n.button.ok(),
			cancelText: i18n.button.cancel(),
			onOk() {
				_this.onOk()
			},
			onCancel() {
				return false
			},
		});
	}

	onOk = () => {
		const {
			hrmTrainActivity
		} = this.props, {
			deleteTableInfo
		} = hrmTrainActivity;

		deleteTableInfo();
	}

	render() {
		const {
			hrmTrainActivity
		} = this.props, {
			mainTable,
			subTab,
			clickTab,
			getTableInfo,
			setSearchValue,
		} = hrmTrainActivity, {
			curKey,
			shValue,
		} = subTab, {
			index
		} = mainTable;

		return (
			<div class='hrm-train-activity-tab'>
            	<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@q16hu0`}
            		datas={this.getTab()}
            		keyParam='key'
            		selectedKey={curKey}
            		onChange={key => clickTab(key,'sub')}
            		searchType={(index == '0' && curKey == '0') ? [] : ['base']}
					searchsBaseValue={shValue}
					buttons={this.getButtons()}
					onSearch={() => getTableInfo()}
					onSearchChange={val => setSearchValue(val,'sub')}
         		/>
         		{this.getContent()}
         	</div>
		)

	}
}