/**
 * 医生站配置
 */

import React, { Component } from 'react';
import {Form, Select, Modal, DatePicker, Table, message, Card, Col, Row, Radio, Input, Button} from 'antd';
import { Util } from 'tools/index';
import { $http } from 'containers/config/https';
import './style/index.less';
import moment from 'moment';
import TcpSocketModal from "../TCPSocket/TcpSocketModal";

const Option = Select.Option;
const FormItem = Form.Item;
const { RangePicker } = DatePicker;

class ShowWorkStationSettingPage extends Component {

    constructor(props) {
        super(props);
        var userData = JSON.parse(sessionStorage.getItem('userData'));
        this.state = {
            code: [],
            confirmData: [],
            errorData: [],
            userData: userData
        }
    }

    componentDidMount() {
        this.props.onRef(this)
    }

    loadData() {
        let data = {
            params: [{
                hospID: this.state.userData.hospID,
                locID: this.state.userData.locID,
                userID: this.state.userData.userID,
            }]
        }
        $http.post('urlDeault', this, {
            code: "01040228",
            data: data,
            success: (res) => {
                if (res.errorCode == '0') {
                    this.setState({
                        dataSource: res.result
                    })
                }
            }
        })
    }

    showModal() {
        this.setState({
            isShow: true
        }, () => {
            this.loadData()
        })
    }

    closeModal() {
        this.setState({
            isShow: false
        })
    }

    handleChangeRadio(item, e) {
        item['configVal'] = e.target.value
        this.setState({})
    }
    handleChangeSwitch(item, e) {
        item['configVal'] = e.target.value
        this.setState({})
    }

    loadComponent() {
        var componentOption = []
        this.state.dataSource && this.state.dataSource.map((item, index) => {
            var childSource = item.configData;
            componentOption.push(<Card key={index} value={item.configDesc} title={item.configDesc} style={{ marginTop: 10 }}>
                {
                    item.type == 'RadioGroup' ? <Radio.Group value={item.configVal} onChange={this.handleChangeRadio.bind(this, item)}>
                        {childSource && childSource.map((data, code) => {
                            return <Radio key={code} value={data.ID}>{data.Desc}</Radio>
                        })}
                    </Radio.Group> : (item.type == 'Input' ? <Input placeholder='请输入' /> :
                        (item.type == 'Select' ? <Select></Select> :
                            (item.type == 'Switch' ? <Radio.Group value={item.configVal} onChange={this.handleChangeSwitch.bind(this, item)}>
                                {childSource && childSource.map((data, code) => {
                                    return <Radio key={code} value={String(data.ID)}>{data.Desc}</Radio>
                                })}
                            </Radio.Group> : '暂无数据信息~~')))
                }
            </Card>)
        })

        return componentOption
    }

    onSubmit() {
        var { dataSource } = this.state;
        var source = []
        if (!Util.isEmpty(dataSource)) {
            for (var i = 0; i < dataSource.length; i++) {
                source.push({
                    configCode: dataSource[i].configCode,
                    configVal: dataSource[i].configVal,
                })
            }
        }
        var params = {
            params: [{
                hospID: this.state.userData.hospID,
                locID: this.state.userData.locID,
                userID: this.state.userData.userID,
                configList: source
            }]
        }
        $http.post('urlDeault', this, {
            code: "01040229",
            data: params,
            success: (res) => {
                if (res.errorCode == '0') {
                    message.success('保存成功！')
                    this.loadData()
                }
            }
        })
    }

    //Socket调试按钮
    onSocketModOpen() {
        this.closeModal();
        this.childSocket.showModal();
    }
    onSocketRef = (ref) => {
        this.childSocket = ref;
    };

    render() {
        return <div>
                <Modal className='workstation-setting-body'
                    title={'医生站配置'}
                    maskClosable={false}
                    visible={this.state.isShow}
                    okText={this.state.userData.language == 'EN' ? 'Submit' : '确定'}
                    cancelText={this.state.userData.language == 'EN' ? 'Cancel' : '取消'}
                    onOk={this.onSubmit.bind(this)}
                    onCancel={this.closeModal.bind(this)}>
                    {this.loadComponent()}

                    <Button style={{marginTop:'10px'}} onClick={this.onSocketModOpen.bind(this)}>Socket 调试</Button>
                </Modal>
                <TcpSocketModal onRef={this.onSocketRef}/>
            </div>
    }
}

export default Form.create()(ShowWorkStationSettingPage);
