import React, { Component } from 'react';

import { Select } from 'antd';
const Option = Select.Option;
export default class TabPaneContent extends Component {
    constructor(props) {
        super(props)
        this.state = {
            value: []
        }
    }
    handleChange = (value) => {
        let selectedArr = []
        this.props.arr.map(item => {
            value.map(i => {
                if (i === item.value) {
                    selectedArr.push(item.id)
                }
            })
        })
        this.props.setSelected(this.props.id,selectedArr)
        this.setState({
            value
        })
    }
    render() {
        let { arr } = this.props
        return (
            <Select
                mode="multiple"
                style={{ width: '100%' }}
                onChange={this.handleChange}
                value={this.state.value}
            >
                {
                    arr.map((item, index) => {
                        return <Option key={item.value}>{item.value}</Option>
                    })
                }
            </Select>
        )
    }
}