import React, {
	Component
} from 'react';
import {
	observer
} from 'mobx-react';
import {WeaCheckbox, WeaSelect} from 'ecCom';

@observer
export default class ShowSetCol extends Component {
	constructor(props) {
		super(props);
	}

	componentDidMount() {}

	componentWillReceiveProps(nextProps) {}

	render() {
		const { tableCellProps: { onEdit, record }, options } = this.props;
		let coms = '';
        if(record.showSet === '1'){
            coms = (
                <div className='showSet'>
                {
                    options.map((option, index) => {
                        if(option.type.toLowerCase() === 'checkbox'){
                            return (
                                <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@2vojsy@${index}`}
                                    content={option.label}
                                    value={record[option.key]}
                                    onChange={(val) => {
                                        const opVal = {};
                                        if(option.key === 'showSet' && val != '1'){
                                            options.map(o => {
                                                Object.assign(opVal, {[o.key]: val})
                                            })
                                        }else{
                                            Object.assign(opVal, {[option.key]: val});
                                        }
                                        onEdit({
                                            type: 'CUSTOM',
                                            record: {
                                                ...record,
                                                ...opVal
                                            }
                                        });
                                    }}
                                />
                            )
                        }else if(option.type.toLowerCase() === 'select'){
                            return (
                                <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@wm827k@${index}`} 
                                    detailtype={2} 
                                    options={option.options}
                                    value={record[option.key]}
                                    onChange={(val) => {
                                        onEdit({
                                            type: 'CUSTOM',
                                            record: {
                                                ...record,
                                                [option.key]: val
                                            }
                                        });
                                    }}
                                 />
                            )
                        }
                    })
                }
                </div>
            )
        }else{
            coms = (
                <div className='showSet'>
                    <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@wzumqg`}
                        value={record.showSet}
                        onChange={(val) => {
                            onEdit({
                                type: 'CUSTOM',
                                record: {
                                    ...record,
                                    showSet: val,
                                }
                            });
                        }}
                    />
                </div>
            )
        }
        return coms;
	}
}