// REMS评分
import React from 'react';
import { Form, message, Modal, Row, Col, Radio , Divider  } from 'antd';
import FormItem from 'antd/lib/form/FormItem';
import { $http } from '../../../containers/config/https';
import { Util } from 'tools/index';
import './index.less';
import './style/index.less';
const radioLayout = {    // label 和input宽度
    labelCol: { span: 2 },
    wrapperCol: { span: 21 },
};
// 用户数据
const userData = sessionStorage.userData ? JSON.parse(sessionStorage.userData) : {};
const REMSRatingModal = Form.create()(
    class extends React.Component {
        constructor(props) {
            super(props);
            this.state = {
                visible: false, // 弹框显示状态
                eyesOpen: [],      // 睁眼反应
                language: [],       // 语言反应
                motor: [],     // 运动反应
                pulse: [],      // 脉搏
                SPO2: [],       // Spo2
                SBP: [],        // 收缩压
                respiratoryRate: [], // 呼吸频率
                age: [],        // 年龄
                REMSGrade:{},
                rEMSRateSaved:false,    //保存标记
                totalScore: 0,            //总评分
            }
        }

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

        // 获取基础数据
        getBasicData = () => {
            let data = {
                'params': [{}]
            };
            $http.post('urlADS', this, {
                code: "04140004",
                data: data,
                success: function (res) {
                    if (+res.errorCode == '0') {
                        this.setState({
                            eyesOpen: res.blink,      // 睁眼反应
                            language: res.talk,       // 语言反应
                            motor: res.motion,     // 运动反应
                            pulse: res.pulse,      // 脉搏
                            SPO2: res.Spo2,       // Spo2
                            SBP: res.SBP,        // 收缩压
                            respiratoryRate: res.breathRate, // 呼吸频率
                            age: res.age,        // 年龄 
                        })
                    }
                },
                error: function (error) {
                    message.error('失败：' + error);
                    this.setState({
                        showLoading: false
                    })
                }
            });
        }

        //根据评分记录ID查询详细评分数据
        loadFormData = () => {
            let data = {
                params: [{
                    REMSGradeID: this.props.patREMSRateID
                }]
            }
            $http.post('urlS', this, {
                code: "04140010",
                data: data,
                success: (res) => {
                    if (+res.errorCode === 0) {
                        this.setState({
                            REMSGrade: res.result.REMSGradeInfo,
                            totalScore: res.result.REMSGradeInfo.score
                        }
                        )
                    }
                }
            })
        }

        // 保存信息
        save = () => {
            const formData = this.props.form.getFieldsValue();
            let REMSGradeInfo={
                    patID:this.props.patID,
                    // patTraumaGradeID:this.props.patTraumaGradeID,
                    eyesOpen:formData.eyesOpen,
                    language:formData.language,
                    motor:formData.motor,
                    pulse:formData.pulse,
                    SPO2:formData.SPO2,
                    SBP:formData.SBP,
                    respiratoryRate:formData.respiratoryRate,
                    age:formData.age,
            } 
            this.props.handleOk({ REMSGradeInfo: REMSGradeInfo, rEMSRate: false, rEMSRateSaved: true },this.state.totalScore);
        }
        // 计算分数
        onChange = (type,e) => {
            let totalScore=0;
            const typeArr=['eyesOpen','language','motor','pulse','SPO2','SBP','respiratoryRate','age'];
            for (let i=0;i<typeArr.length;i++)
            {
                const element=typeArr[i];
                if (element==type) continue
                let checkValue=this.props.form.getFieldValue(element)
                if (!Util.isEmpty(checkValue)){
                    for (let j = 0; j < this.state[element].length; j++) {
                        const item = this.state[element][j].id;
                        if (item==checkValue){
                            totalScore+=Number.parseInt(this.state[element][j].value)
                        }
                    }
                }
            }        
            this.setState({totalScore:totalScore+Number.parseInt(e.target.score)})
        }
        handleCancel = () => {
            this.props.form.resetFields(); // 清空表单
            this.props.handleOk({ REMSGradeInfo: {}, rEMSRate: false });
        }
        handleOk = (e) => {
            this.save();
        };

        render() {
            const { getFieldDecorator } = this.props.form;
            const REMSGrade=this.state.REMSGrade
            return (
                <Modal
                    width={'60%'}
                    title="REMS评分"
                    visible={this.props.visible}        //{this.props.visible}
                    onCancel={this.handleCancel}
                    onOk={this.handleOk}
                    maskClosable={false}
                    className='clearPadding'
                    bodyStyle={{paddingTop: '0px',paddingBottom: '0px',}}
                >
                    <div className='REMSRate-Form' style={{ width: '100%', height: '100%' }}>
                        <Form>
                            <p style={{ fontSize: '17px', color: 'red' ,marginBottom: '6px' }}>GCS评分</p>
                            <Row type="flex" justify="center">
                                <Col span={24}>
                                    <FormItem {...radioLayout} label="睁眼反应">
                                        {getFieldDecorator('eyesOpen', {
                                            initialValue: Util.isEmpty(REMSGrade)?undefined:REMSGrade.eyesOpen,
                                        })(
                                            <Radio.Group onChange={this.onChange.bind(this,'eyesOpen')}>
                                                {this.state.eyesOpen.map(item => (
                                                    <Radio value={item.id} score={item.value}>{item.descripts}</Radio>
                                                ))}
                                            </Radio.Group>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row type="flex" justify="center">
                                <Col span={24}>
                                    <FormItem {...radioLayout} label="语言反应">
                                        {getFieldDecorator('language', {
                                            initialValue: Util.isEmpty(REMSGrade)?undefined:REMSGrade.language,
                                        })(
                                            <Radio.Group onChange={this.onChange.bind(this,'language')}>
                                                {this.state.language.map(item => (
                                                    <Radio value={item.id} score={item.value}>{item.descripts}</Radio>
                                                ))}
                                            </Radio.Group>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row type="flex" justify="center">
                                <Col span={24}>
                                    <FormItem {...radioLayout} label="运动反应">
                                        {getFieldDecorator('motor', {
                                            initialValue: Util.isEmpty(REMSGrade)?undefined:REMSGrade.motor,
                                        })(
                                            <Radio.Group onChange={this.onChange.bind(this,'motor')}>
                                                {this.state.motor.map(item => (
                                                    <Radio value={item.id} score={item.value}>{item.descripts}</Radio>
                                                ))}
                                            </Radio.Group>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <p style={{ fontSize: '17px', color: 'red' , margin: '7px' }}>生命体征</p>
                            <Row type="flex" justify="center">
                                <Col span={24}>
                                    <FormItem {...radioLayout} label="脉搏">
                                        {getFieldDecorator('pulse', {
                                            initialValue: Util.isEmpty(REMSGrade)?undefined:REMSGrade.pulse,
                                        })(
                                            <Radio.Group onChange={this.onChange.bind(this,'pulse')}>
                                                {this.state.pulse.map(item => (
                                                    <Radio value={item.id} score={item.value}>{item.descripts}</Radio>
                                                ))}
                                            </Radio.Group>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row type="flex" justify="center">
                                <Col span={24}>
                                    <FormItem {...radioLayout} label="Spo2">
                                        {getFieldDecorator('SPO2', {
                                            initialValue: Util.isEmpty(REMSGrade)?undefined:REMSGrade.SPO2,
                                        })(
                                            <Radio.Group onChange={this.onChange.bind(this,'SPO2')}>
                                                {this.state.SPO2.map(item => (
                                                    <Radio value={item.id} score={item.value}>{item.descripts}</Radio>
                                                ))}
                                            </Radio.Group>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row type="flex" justify="center">
                                <Col span={24}>
                                    <FormItem {...radioLayout} label="收缩压">
                                        {getFieldDecorator('SBP', {
                                            initialValue: Util.isEmpty(REMSGrade)?undefined:REMSGrade.SBP,
                                        })(
                                            <Radio.Group onChange={this.onChange.bind(this,'SBP')}>
                                                {this.state.SBP.map(item => (
                                                    <Radio value={item.id} score={item.value}>{item.descripts}</Radio>
                                                ))}
                                            </Radio.Group>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row type="flex" justify="center">
                                <Col span={24}>
                                    <FormItem {...radioLayout} label="呼吸频率">
                                        {getFieldDecorator('respiratoryRate', {
                                            initialValue: Util.isEmpty(REMSGrade)?undefined:REMSGrade.respiratoryRate,
                                        })(
                                            <Radio.Group onChange={this.onChange.bind(this,'respiratoryRate')}>
                                                {this.state.respiratoryRate.map(item => (
                                                    <Radio value={item.id} score={item.value}>{item.descripts}</Radio>
                                                ))}
                                            </Radio.Group>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                            <Row type="flex" justify="center">
                                <Col span={24}>
                                    <FormItem {...radioLayout} label="年龄">
                                        {getFieldDecorator('age', {
                                            initialValue: Util.isEmpty(REMSGrade)?undefined:REMSGrade.age,
                                        })(
                                            <Radio.Group onChange={this.onChange.bind(this,'age')}>
                                                {this.state.age.map(item => (
                                                    <Radio value={item.id} score={item.value}>{item.descripts}</Radio>
                                                ))}
                                            </Radio.Group>
                                        )}
                                    </FormItem>
                                </Col>
                            </Row>
                        </Form>
                        分数：<label style={{ color: '#FF0000' }}>{this.state.totalScore}分</label>
                    </div>
                </Modal>
            )
        }
    }
)
export default REMSRatingModal;