import React from 'react';
import {WeaBrowser} from 'ecCom';
import {toJS} from 'mobx';
import {inject, observer} from 'mobx-react';

@inject('weesoStore')
@observer
export default class AboutBrowser extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
    }
  }
  
  render() {
    const {values, weesoStore, bindObj} = this.props;
    return (
      <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@n5rfee`}
        {...bindObj.bind()}
        {...values.browserConditionParam}
        replaceDatas={toJS(bindObj.valueObj)}
        onChange={(...args)=> {
          weesoStore.setState({maskClosable: true});
          bindObj.onChange(...args)}
        }
        onFocus={() => {
          weesoStore.setState({maskClosable: false})
        }}
        onBlur={() => {
          weesoStore.setState({maskClosable: true})
        }}
        onOpen={() => {
          weesoStore.setState({maskClosable: false})
        }}
        onClose={() => {
          weesoStore.setState({maskClosable: true})
        }}
        onSearch={() => {
          weesoStore.setState({maskClosable: false})
        }}
        layout={document.body}
      />
    )
  }
}