import {
	observable,
	action,
	computed
} from 'mobx';
import {
	WeaForm,
	WeaTableNew,
	WeaSwitch
} from 'comsMobx';
import {
	Button,
	message
} from 'antd';
import FormInfo from '../coms/FormInfo';
import HrmBaseStore from './baseStore';
import * as api from '../apis/schedule';
import {
	i18n
} from '../public/i18n';
import {
	cloneDeep
} from 'lodash';
const {
	TableStore
} = WeaTableNew;

class HrmScheduleWorkTime extends HrmBaseStore {
	/********************* unobservable list *********************/
	topBtnAndMenu = () => {
		return {
			btns: [
				<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@87q6zd`} type='primary' onClick={this.create}>{i18n.button.create()}</Button>,
				<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@epylrz`} type='primary' onClick={() => this.multiRemove()} disabled={this.multiRemoveable}>{i18n.button.multiRemove()}</Button>
			],
			menus: [{
				key: '1',
				content: i18n.button.create(),
				icon: <i className={this.menuIconCollection.create}/>,
				onClick: this.create
			}, {
				key: '2',
				content: i18n.button.multiDelete(),
				icon: <i className={this.menuIconCollection.remove}/>,
				onClick: () => this.remove(),
				disabled: this.multiRemoveable
			}, {
				key: '3',
				content: i18n.button.columnVisibleSetting(),
				icon: <i className={this.menuIconCollection.setting}/>,
				onClick: () => this.definedColumn(this.table)
			}, ...this.getBasicMenus('HRM_ENGINE_HRM_SCHEDULE_WORKTIME')]
		}
	}

	tabConfig = {
		tabs: [{
			color: '#000000',
			groupId: 'roleList',
			title: '',
			viewCondition: '1',
			searchType: ['base'],
			searchKey: 'qName',
			doSearch: (params) => this.getTableData(params)
		}],
		keyParam: 'viewCondition',
		activeTabKey: '1'
	}

	editorDialogRightMenu = [];
	getDialogOpButtons = () => {
		let buttons = [];
		this.editorDialogRightMenu.length = 0;
		buttons.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@7x2lkx`} type="primary" op="save" onClick={() => this.save()}>{i18n.button.save()}</Button>);

		buttons.map((btn, index) => {
			const {
				props
			} = btn;
			this.editorDialogRightMenu.push({
				key: index.toString(),
				content: props.children,
				icon: <i className={this.menuIconCollection[props.op]}/>,
				onClick: props.onClick
			});
		})

		this.dialogParams.moreBtn.datas = this.editorDialogRightMenu;
		return buttons;
	}

	formFields = [];

	itemRender = {
		field002: (field, textAreaProps, form, formParams) => {
			return (
				<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@38xmky`} fieldConfig={field} form={form} formParams={formParams} onChange={this.onTimeChangeHandle}/>
			)
		},
		field003: (field, textAreaProps, form, formParams) => {
			return (
				<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@va6c5g`} fieldConfig={field} form={form} formParams={formParams} onChange={this.onTimeChangeHandle}/>
			)
		},
		field004: (field, textAreaProps, form, formParams) => {
			return (
				<div className='formTarget'>
					<div className='tips'>{i18n.label.beforeWork()}</div>
					<div className='minute'>
						<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@ldvu84`} fieldConfig={{...field, ...textAreaProps, min: 1, max: 999}} form={form} formParams={formParams} />
					</div>
					<div className='tips'>{i18n.label.minute()}</div>
				</div>
			)
		},
		field005: (field, textAreaProps, form, formParams) => {
			return (
				<div className='formTarget'>
					<div className='tips'>{i18n.label.afterWork()}</div>
					<div className='minute'>
						<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@fg3vb8`} fieldConfig={{...field, ...textAreaProps, min: 1, max: 999}} form={form} formParams={formParams} />
					</div>
					<div className='tips'>{i18n.label.minute()}</div>
				</div>
			)
		}
	}
	/********************* unobservable list *********************/

	/********************* dialog info setting *********************/

	/********************* dialog info setting *********************/

	/********************* observable list *********************/
	@observable table = new TableStore();

	dialogParams = {
		...this.dialogPropsDef,
		opType: '',
		onCancel: () => {
			this.opId = null;
			this.dialogParams.opType = '';
			this.dialogParams.visible = false;
		}
	}
	/********************* observable list *********************/

	/********************* computed list *********************/
	@computed get multiRemoveable() {
		return this.table.selectedRowKeys.length === 0;
	}
	/********************* computed list *********************/

	/********************* action list *********************/
	initData = () => {
		this.containerInitFinished = {
			...this.containerInitFinished,
			init: true
		}
		api.initData().then(rs => {
			rs.map((result, index) => {
				if (result.status === '1') {
					switch (index) {
						case 0:
							this.formFields = result.formField;
							break;
						case 1:
							this.table = new TableStore();
							this.table.getDatas(result.sessionkey, 1);
							break;
					}
				}
			})
		})
	}

	getTableData = (params) => {
		this.table = new TableStore();
		api.getList(params).then(data => {
			if (data.status === '1')
				this.table.getDatas(data.sessionkey, 1);
			else
				message.error(data.message);
		}, error => {})
	}

	showFormDialog = (title) => {
		const {
			workTimeForm: form,
			workTimeFormFields: fields
		} = this.formTarget;
		this.dialogParams.title = title;
		this.dialogParams.coms = <FormInfo ecId={`${this && this.props && this.props.ecId || ''}_FormInfo@6i149f`} center={false} form={form} formFields={fields} menu={this.editorDialogRightMenu} itemRender={this.itemRender}></FormInfo>;
		this.dialogParams.style = {
			width: 500,
			height: 400
		}
		this.dialogParams.visible = true;
	}

	@action create = () => {
		const cloneObj = cloneDeep(this.formFields);
		this.setFormData('workTimeForm', cloneObj);
		this.showFormDialog(i18n.label.createWorktime());
	}

	@action getFormInfo = (params) => {
		this.opId = params.id;
		api.getFormInfo(params).then(data => {
			if (data.status === '1') {
				this.setFormData('workTimeForm', data.formField);
				this.showFormDialog(i18n.label.modifyWorktime());
			}
		})
	}

	@action onTimeChangeHandle = (val) => {
		const formParams = this.formTarget.workTimeForm.getFormParams();
		if (formParams.field002 === '' || formParams.field003 === '')
			return;
		// else if (new Date(`2018/01/01 ${formParams.field002}`).getTime() > new Date(`2018/01/01 ${formParams.field003}`).getTime()) {
		// 	message.error(i18n.message.dateRangeError())
		// 	return;
		// }
		api.save({
			cmd: 'getWorkTime',
			startTime: formParams.field002,
			endTime: formParams.field003
		}).then(data => {
			if (data.status === '1') {
				this.formTarget.workTimeForm.updateFields({
					field007: {
						value: data.worktime
					}
				})
			}
		}, error => {})
	}

	@action save = () => {
		const params = {
			cmd: 'save'
		};
		this.formTarget.workTimeForm.validateForm().then(f => {
			if (f.isValid) {
				const formParams = this.formTarget.workTimeForm.getFormParams();
				if (formParams.field002 === '' || formParams.field003 === '')
					return;
				const bd = new Date('2018/01/01 ' + formParams.field002);
				const ed = new Date('2018/01/01 ' + formParams.field003);
				// if (bd.getTime() > ed.getTime()) {
				// 	message.error(i18n.message.dateRangeError())
				// 	return;
				// }
				Object.assign(params, formParams);
				if (this.opId != null) {
					Object.assign(params, {
						id: this.opId
					});
				}
				api.save(params).then(data => {
					if (data.status === '1') {
						message.success(i18n.message.saveSuccess());
						this.table.getDatas(null, 1);
						this.dialogParams.onCancel();
					} else
						message.error(data.message);
				}, error => {});
			} else {
				f.showErrors();
				this.showError = new Date().getTime();
			}
		});
	}

	@action multiRemove = (params) => {
		let content;
		if (params != null) {
			Object.assign(params, {
				cmd: 'delete'
			})
			content = i18n.confirm.delete();
		} else {
			params = {
				cmd: 'delete',
				ids: this.table.selectedRowKeys
			}
			content = i18n.confirm.deleteSelected();
		}
		this.confirmInfo({
			content,
			onOk: () => {
				api.save(params).then(data => {
					if (data.status === '1') {
						message.success(i18n.message.deleteSuccess());
						this.table.getDatas(null, 1);
					} else {
						message.error(data.message);
					}
				}, error => {})
			}
		});
	}
	/********************* action list *********************/
}

export const hrmScheduleWorkTime = new HrmScheduleWorkTime();