import { WeaLeftTree } from 'ecCom';
import * as mobx from 'mobx';
import { observer } from 'mobx-react';
import { toJS } from 'mobx';

@observer
class ListLeftTree extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            searchValue: ""
        }
    }

    componentWillReceiveProps(nextProps) {

        if (this.props.key !== nextProps.key) {
            this.setState({
                searchValue: ""
            })
        }
    }

    render() {
        const { leftTree, leftTreeCount, leftTreeCountType, topTab, selectedTreeKey } = this.props.listStore;
        const { setShowSearchAd, clearFormFields, initDatas, doSearch, setSelectedTreeKey } = this.props.listStore;
        const { initkey } = this.props;

        return (
            <WeaLeftTree ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftTree@dwoxww`}
                datas={mobx.toJS(leftTree)}
                counts={leftTreeCount}
                countsType={leftTreeCountType}
                selectedKeys={['prjtype_' + selectedTreeKey]}
                searchValue={this.state.searchValue}
                onSearchChange={v => {
                    this.setState({
                        searchValue: v
                    })
                }}
                onSearchLabelClick={() => {
                    setShowSearchAd(false);
                    setSelectedTreeKey("");
                    clearFormFields();
                    initDatas({ tabkey: initkey });
                    doSearch({
                        tabkey: initkey,
                        prjtype: ""
                    });
                }}
                onSelect={(key, topTabCount, countsType) => {
                    setShowSearchAd(false);
                    setSelectedTreeKey(topTabCount.keyid);
                    clearFormFields();
                    doSearch({
                        tabkey: initkey,
                        prjtype: topTabCount.keyid
                    });
                }}
            />
        );
    }
}

export default ListLeftTree;