import {
  WeaOrgTree
} from 'ecCom'
import {
  inject,
  observer,
} from 'mobx-react'
import {
  i18n
} from '../../public/i18n';

@inject('hrmSalaryIndexMaintenance')
@observer
export default class LeftTree extends React.Component {
  constructor(props) {
    super(props);
    this.tree = null;
    this.setRef = element => {
      this.tree = element;
    }
  }

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

  componentDidMount() {
    this.init()
  }

  init = () => {
    if (this.tree) this.tree.reset(() => this.tree.fetchData());
  }

  treeNodeClick = (event, ids, nodeids, nodes) => {
    const {
      hrmSalaryIndexMaintenance
    } = this.props, {
      handleLeftTreeClick
    } = hrmSalaryIndexMaintenance;

    handleLeftTreeClick(ids[0], nodes[0].type, nodes[0].name);
  }

  render() {
    return (
      <div style={{height: '100%'}}>
            <WeaOrgTree ecId={`${this && this.props && this.props.ecId || ''}_WeaOrgTree@rqfn7f`} 
                ref={this.setRef}
                needSearch
                noCache={true}
                isLoadAllSub={true}
                isLoadSubDepartment={true}
                needDropMenu={false}
                inputLeftDom = {`<b>${i18n.label.companyInfo()}</b>`}
                params={{rightStr:'Compensation:Maintenance'}}
                treeNodeClick={(event, ids, nodeids, nodes) => this.treeNodeClick(event, ids, nodeids, nodes)}
            />
        </div>
    )
  }
}