import React, { Component } from 'react'
import {
    WeaSelect,
    WeaHelpfulTip,
    WeaCheckbox,
    WeaError  
} from 'ecCom';
import {
	observer
} from 'mobx-react';
import {
	WeaLocaleProvider
} from 'ecCom';
import filter from 'lodash/filter';
const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class EntrySelect extends Component {
    constructor (props) {
        super(props);
        this.state = {
            showAllOption: false
        }
    }

    get options(){
        const {showAllOption} = this.state;
        const {store, record} = this.props;
        const {optionMap} = store;
        const {id} = record;
        const options = optionMap[id];

        return filter(options, op => {
            return showAllOption ? true : (op.visible == true)
        })
    }


    render() {
        const {store, record, onChange} = this.props;
        const {setRef} = store;
        const {id, sysField, helpfulTip, require, wfField} = record;
        return (
            <div>
                <WeaError ecId={`${this && this.props && this.props.ecId || ''}_WeaError@o2agtw`} 
                    tipPosition='bottom'
                    ref={dom => setRef(id, dom)}
                    style = {{width:'40%'}}
                    error={`"${sysField}" ${getLabel(21423, '未填写')}`}
                    >
                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@q7q2l8`}
                        options={this.options}
                        value={wfField}
                        onChange = {onChange}
                        viewAttr = {require ? 3 : 2}
                    />
                </WeaError>
                <WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@tl53e0`}
                    title={helpfulTip}
                    style={{margin:'0 5%'}}
                />
                <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@6mfitv`}
                    onChange = {v => this.setState({showAllOption: v == '1'})}
                    content = {getLabel(385346, '显示全部类型')}                  
                />
            </div>
        )
    }
}
