import '../../style/finance.less';
import React, {Component} from 'react';
import {inject,observer} from 'mobx-react';
import {WeaTop, WeaRightMenu} from 'ecCom';
import Authority from '../../public/coms/Authority';
import Content from './Content';

@inject('financeStore')
@inject('hrmCard')
@observer
export default class Finance extends Component{
    componentDidMount(){
        this.init(this.props);
    }

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

    init = props => {
        this.props.financeStore.init(props)
    }

    render(){
        const {financeStore: store} = this.props;
        const {fromcard, topProps} = store;

        let com;
        if(fromcard){
            com = (
                <WeaRightMenu datas={topProps.dropMenuDatas}>
                    <Content store={store} />
                </WeaRightMenu>
            )
        }else{
            com = (
                <WeaTop {...topProps}>
                    <WeaRightMenu datas={topProps.dropMenuDatas}>
                        <Content store={store} />
                    </WeaRightMenu>
                </WeaTop>
            )
        }

        return (
            <div className='hrm_finance'>
                <Authority store={store}>
                    {com}
                </Authority>
            </div>
        )
    }
}