import React from 'react';
import {inject, observer} from 'mobx-react';
import {routerShape} from 'react-router';
import {Condition} from '../list/listCondition';
import {WeaErrorPage,WeaTools,WeaTop,WeaRightMenu,WeaLocaleProvider} from 'ecCom';
import {Button} from 'antd';
const getLabel = WeaLocaleProvider.getLabel;

@inject("queryPrjStore")

@observer
class QueryProjectCondition extends React.Component {
    static contextTypes = {
        router: routerShape
    }
    constructor(props) {
        super(props);
    }
    resetHeight(height){
        jQuery(".prj-query-condition").height(height - 60);
    }
    componentDidMount() {
        const {queryPrjStore} = this.props;
        queryPrjStore.initDatas();
    }

    componentWillReceiveProps(nextProps){
        if(this.props.location.key !== nextProps.location.key){
            const {queryPrjStore} = this.props;
            queryPrjStore.initDatas({},true);
        }
    }

    shouldComponentUpdate(nextProps, nextState) {
        return true;
    }
    render() {
        const { queryPrjStore } = this.props;
        const { loading,form } = queryPrjStore;
        return (
            <div className='prj-query'>
            	<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@r7pj1d`} datas={this.getRightMenu()}>
                <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@bgjy55`}
                	title={getLabel(16413,"查询项目")}
                	loading={loading}
                	icon={<i className='icon-coms-project' />}
                	iconBgcolor='#217346'
                    getHeight={this.resetHeight.bind(this)}
                	buttons={[]}
                	buttonSpace={10}
                	showDropIcon={true}
                	dropMenuDatas={this.getRightMenu()} >
                        <div className='prj-query-condition'>
                            <Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@039kre`} listStore={queryPrjStore} form={form}></Condition>
                        </div>
                        <div className='prj-query-btns'>
                            {this.getSearchButtons()}
                        </div>
                </WeaTop>
                </WeaRightMenu>
            </div>
        )
    }
    getRightMenu(){
    	let btns = [];
    	btns.push({
            key: "search",
    		icon: <i className='icon-coms-search'/>,
            content: getLabel(197,"搜索"),
            onClick: this.forwardQueryResult.bind(this)
    	});
    	return btns;
    }
    getSearchButtons() {
        const { queryPrjStore } = this.props;
        const {clearFormFields,setSelectedTreeKey} = queryPrjStore;
        const btnStyle = {borderRadius: 3, minWidth: 80}
        return [
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@j5bj8e@search`} type="primary" style={btnStyle} onClick={this.forwardQueryResult.bind(this)}>{getLabel(197,"搜索")}</Button>),
            (<span style={{width:'15px', display:'inline-block'}}></span>),
            (<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@rmrwu7@reset`} type="ghost" style={btnStyle} onClick={()=>{clearFormFields();setSelectedTreeKey&&setSelectedTreeKey('-1')}}>{getLabel(2022,"重置")}</Button>)
        ]
    }
    forwardQueryResult(){
        const path = "/queryProjectResult";
        this.context.router.push({
            pathname: "/main/prj"+path
        });
    }
}

export default WeaTools.tryCatch(React, 
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@ay06bd`} msg={ props.error ? props.error : getLabel(383324,"对不起，该页面异常，请联系管理员")} />,
    {error: ""}
)(QueryProjectCondition);