import React, { Component } from 'react';
import {observer} from 'mobx-react';
import {WeaLocaleProvider, WeaOrgTree, WeaCheckbox, WeaBrowser} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class LeftCom extends Component{
    onChangeHandle = v => {
        const {store} = this.props;
        store.isMult = (v == 1);
        this.refs.orgTree && this.refs.orgTree.resetCheck()
    }

    onAddOnClickHandle = v => {
        const {store} = this.props;
        store.browserReplaceDatas = [];
    }

    onBrowserChangeHandle = (ids, names, datas) => {
        const {store} = this.props;
        store.browserReplaceDatas = datas;
    }

    render(){
        const {store} = this.props;
        const {orgTreeProps, isMult, browserReplaceDatas} = store;

        return (
            <div className='leftCom'>
                <div className='title'>
                    <span className='label text-elli'>{getLabel('32997', "人员组织")}</span>
                    <span className='multSelect'>
                        <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@7xj15x`} onChange={this.onChangeHandle} value={isMult ? 1 : 0} content={getLabel('386504',"开启选择")} />
                    </span>
                </div>
                <div className='condition'>
                    <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@5zb5h4`} isSingle={true}
                        title={getLabel('179',"人力资源")} type="1" viewAttr="2"
                        // replaceDatas={browserReplaceDatas}
                        customIcon="icon-coms-Reset"
                        addOnClick={this.onAddOnClickHandle}
                        onChange={this.onBrowserChangeHandle}
                    />
                </div>
                <div className='body'>
                    <WeaOrgTree ecId={`${this && this.props && this.props.ecId || ''}_WeaOrgTree@tdgka2`} {...orgTreeProps} />
                </div>
            </div>
        )
    }
}