/*
* 待处理异常
* */

import React, { Component } from 'react';
import {
    Input, Form, Select, Modal, Button, Progress, Upload, message, Icon, Tag,
    Card, Row, Col, DatePicker, Popconfirm, Checkbox, Radio, Divider
} from 'antd';
import { Util, dayFormat } from 'tools/index';
import { $http } from 'containers/config/https';
import RangeDatePicker from 'components/rangePicker/index';
import '../style/index.less';
import moment from 'moment';

const Option = Select.Option;
const Search = Input.Search;
const FormItem = Form.Item;
const { TextArea } = Input;

class ShowSendGroupModal extends Component {

    constructor(props) {
        super(props);
        var date = new Date();
        var userData = JSON.parse(sessionStorage.getItem('userData'));
        this.state = {
            leftData: [],
            rightData: [],
            userData: userData,
            ids: [],
            code: []
        }
    }
    componentWillReceiveProps(nextProp) {
        if (nextProp.isShow === true) {
            this.setState({
                selectData: nextProp.selectData
            })
        } else if (this.props.isShow === false) {
            this.cleanInput();
        }
    }

    componentDidMount() {
    }

    //获取标签
    loadTags() {
        var { selectData } = this.state;
        var selectOption = []
        selectData && selectData.map((item, index) => {
            selectOption.push(<Tag style={{ marginLeft: 10, marginTop: 5 }} key={index} closable value={item.patID}
                onClose={this.handleCloseTags.bind(this, item)}>{item.patName}</Tag>)
        })
        return selectOption
    }

    handleCloseTags(data) {
        this.state.code.push(data.patID)
        this.setState({})
    }

    closeModal(name) {
        let { onHide } = this.props;
        onHide && onHide();
        this.cleanInput();
    }

    //清空输入框
    cleanInput() {
        this.props.form.resetFields();
        this.setState({
            detailData: {},
            patID: undefined,
            consultText: undefined,
            selectData:[],
            code:[]
        })
    }

    //提交
    onSubmit() {
        var { selectData, code } = this.state;
        var id = []
        for (var i = 0; i < selectData.length; i++) {
            for (var j = 0; j < code.length; j++) {
                if (selectData[i].patID !== code[j]) {
                    id.push(selectData[i].patID)
                }
            }
        }
        let { onSubmit } = this.props;
        onSubmit && onSubmit(id, this.state.consultText);
    }
    render() {
        var { ids } = this.state;

        return <div>
            <Modal className='show-send-modal'
                title={'群发通知'}
                maskClosable={false}
                visible={this.props.isShow}
                okText={'发送'}
                onCancel={this.closeModal.bind(this)}
                onOk={this.onSubmit.bind(this)}>

                <Card title={<span>已选择群发对象：<span style={{ color: '#0099FF', fontSize: '18px' }}>
                    {this.state.selectData && this.state.selectData.length - this.state.code.length}</span>&nbsp;&nbsp;人</span>}>
                    <div style={{ height: '15vh', overflow: 'auto' }}>
                        {this.loadTags()}
                    </div>
                </Card>

                <Card extra={<span></span>} title={<span>请输入群发内容：</span>} style={{ marginTop: 5, height: '20vh' }}>
                    <TextArea rows={6} value={this.state.consultText} onChange={Util.commonInputChange.bind(this, 'consultText')}
                        placeholder='请输入要群发的内容' />
                </Card>
            </Modal></div>
    }
}

export default Form.create()(ShowSendGroupModal);