import '../../../style/report.less';
import React, {Component} from 'react';
import {inject,observer} from 'mobx-react';
import {WeaTop, WeaAlertPage, WeaRightMenu, WeaLocaleProvider} from 'ecCom';
import {Spin} from 'antd';
import {i18n} from '../../../public/i18n';
import SearchGroup from './SearchGroup';
import DataList from './DataList';
const getLabel = WeaLocaleProvider.getLabel;

@inject('hrmAttendanceDailyReport')
@observer
export default class Report extends Component{
    constructor(props) {
		super(props);
	}

	componentDidMount() {
		this.init();
	}

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

    init = () => {
        const {
            hrmAttendanceDailyReport: store
        } = this.props;
        store.init();
    }
    
    render(){
        const {hrmAttendanceDailyReport: store} = this.props;
        const {containerInitFinished, getTopProps, spinning, spinTip, rightMenus,setDomRef} = store;
        const {buttons, menus} = getTopProps();
        const topProps = {
            title: getLabel('390352','每日统计报表') ,
			icon: <i className='icon-coms-hrm'/>,
			iconBgcolor: '#217346',
			showDropIcon: true,
			buttons: buttons,
			dropMenuDatas: menus
        }
        return (
            <div className="hrm_module_container report">
			{
                containerInitFinished.init && containerInitFinished.authorized &&
                <Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@fnac7s`} spinning={spinning} tip={spinTip}>
                    <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@5g2kny`} {...topProps} ref={dom => setDomRef(dom, 'top')}>
                        <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@xqq44m`} datas={menus} >
                            <div className='layout'>
                                <div className='layoutContent includeFoot'>
                                    <SearchGroup ecId={`${this && this.props && this.props.ecId || ''}_SearchGroup@gzsa7b`} store={store}/>
                                    <DataList ecId={`${this && this.props && this.props.ecId || ''}_DataList@1zmufh`} store={store} />
                                </div>
                            </div>
                        </WeaRightMenu>
                    </WeaTop>
                </Spin>
			}
			{
				containerInitFinished.init && !containerInitFinished.authorized && 
              	<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@lb0i54`}>
                  	<div style={{ color: '#000' }}>{i18n.message.authFailed()}</div>
              	</WeaAlertPage>
			}
            </div>
        )
    }
}