import React, { Component } from 'react'

import {observer}  from 'mobx-react'
import {WeaSearchGroup,WeaLocaleProvider,WeaRadioGroup} from 'ecCom'
import {toJS} from 'mobx';
import Table from './Table'

const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class Detailed extends Component {
    componentDidMount () {
        const {newOutSide} = this.props;
        const {getRadioGroupConfig} = newOutSide;
        getRadioGroupConfig()
    }

    componentWillUnmount(){
        const {newOutSide} = this.props;
        const {clearConfig} = newOutSide;
        clearConfig();
    }

    onChange = (params) => {
        const {newOutSide} = this.props;
        const {getData} = newOutSide;
        const flag = params.dataScope =="0" || params.subcomId || params.resourceId || params.deptId || params.dataScope =="4" || params.allLevel;
        if(flag){
            getData(params);
        }
    }
    render() {
        const {newOutSide} = this.props;
        const {config} = newOutSide;
        return (
            <div>
                {
                    config.length > 0 && [
                        <WeaRadioGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaRadioGroup@02oa5k`} 
                            config={toJS(config)} 
                            onChange = {this.onChange}
                        />,
                        <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@rcvtqn`} needTigger={true} showGroup={true} >
                            <Table ecId={`${this && this.props && this.props.ecId || ''}_Table@9kf1y7`} newOutSide = {newOutSide}/>
                    
                        </WeaSearchGroup>
                    ]
                }
                
            </div>
        )
    }
}