import '../../../style/monthReport4template.less';
import React, {Component} from 'react';
import {inject,observer} from 'mobx-react';
import {WeaTop, WeaRightMenu, WeaLocaleProvider} from 'ecCom';
import GroupList from './GroupList';
import DataList from './DataList';
import CreateTemplate from './CreateTemplate';
import OrderSetting from './OrderSetting';
const getLabel = WeaLocaleProvider.getLabel;

@inject('hrmAttendanceMonthReport4Template')
@observer
export default class MonthReport extends Component{
	componentDidMount() {
        this.init();
	}

	componentWillReceiveProps(nextProps) {
		if (this.props.location.key !== nextProps.location.key) {
			this.init();
		}
    }

    init = () => {
        const {
            hrmAttendanceMonthReport4Template: store
        } = this.props;
        store.init();
    }
    
    render(){
        const {hrmAttendanceMonthReport4Template: store} = this.props;
        const {topProps, setDomRef} = store;
        const {dropMenuDatas} = topProps;
        return (
            <div className="hrm_module_container report4template">
                <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@yyd3u8`} {...topProps} ref={dom => setDomRef(dom, 'top')}>
                    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@9f0g6r`} datas={dropMenuDatas} >
                        <GroupList ecId={`${this && this.props && this.props.ecId || ''}_GroupList@2le78y`} store={store} />
                        <DataList ecId={`${this && this.props && this.props.ecId || ''}_DataList@91vn5r`} store={store} />
                        <CreateTemplate ecId={`${this && this.props && this.props.ecId || ''}_CreateTemplate@4syjwo`} store={store} />
                        <OrderSetting ecId={`${this && this.props && this.props.ecId || ''}_OrderSetting@e311xz`} store={store} />
                    </WeaRightMenu>
                </WeaTop>
            </div>
        )
    }
}