// 角色管理form页面
import React from 'react';
import {
    Form, Button, Col, Row, Input, Select, DatePicker, message, Switch
} from 'antd';
import Moment from 'moment';
import { $http } from '../../containers/config/https';
import { disposeData } from '../../tools';


const { Option } = Select;

const MedicalGroupModelNew = Form.create()(
    // eslint-disable-next-line
    class extends React.Component {

        constructor(props) {
            super(props);
            this.myRef1 = React.createRef();
            this.myRef2 = React.createRef();
        }

        // 重置表单
        resetFields = () => {
            // console.log("触发了")
            this.props.form.resetFields(); //清空所有
        }
        resetUserInfoFields = ()=>{
            this.props.handelThis.resetUserInfo(); //清空所有
        }

        // 新增保存调的方法
        handelFunction(code, msg) {
            const { form: { validateFields } } = this.props;
            validateFields((errors, values) => {
                // 验证成功
                // console.log(values);
                if (errors === null) {
                    let data = {
                        params: []
                    }
                    // 取到登录后用户的信息
                    if (values.StartDate) values.StartDate=values.StartDate.format('YYYY-MM-DD')
                    if (values.StopDate) values.StopDate=values.StopDate.format('YYYY-MM-DD')
                    let user = window.sessionStorage.userData ? JSON.parse(window.sessionStorage.userData) : {};
                    let obj = JSON.parse(JSON.stringify(values));
                    
                    obj.CreateUserDr = msg === '新增' ? user.userId : this.props.userInfo.CreateUserDr;
                    // 当增加时点击复制把ID值传给后天然后后台根据ID值去复制权限，编辑时则根据ID去保存修改
                    if (msg === '编辑') {
                        obj.ID = this.props.userInfo.ID
                    } else {
                        obj.CopyGroupId = this.props.userInfo.ID
                    }
                    
                    // 将开关的值转化
                    if (obj.ShowDesc === true) {
                        obj.ShowDesc = "Y"
                    } else {
                        obj.ShowDesc = "N"
                    }
                    if (obj.OPFlag === true) {
                        obj.OPFlag = "Y"
                    } else {
                        obj.OPFlag = "N"
                    }
                    if (obj.IPFlag === true) {
                        obj.IPFlag = "Y"
                    } else {
                        obj.IPFlag = "N"
                    }
                    // 处理需要传递的obj
                    data.params.push(disposeData(obj));
                    
                    $http.post('urlADS', this, {
                        code: code,
                        data: data,
                        success: function (res) {
                            if (+res.errorCode === 0) {
                                // 提示
                                message.success(msg + '成功');
                                // 刷新列表数据
                                this.props.handelThis.handleQuery();
                                // // 新增成功重置form表单
                                // if (this.props.flag === 'add') {
                                this.resetFields();
                                this.props.handelThis.resetUserInfo()
                                // }
                                if (this.props.flag === 'compile') {
                                    // 重置title
                                    this.props.handelThis.handleSetTitle()
                                }
                            }
                        //this.resetFields();
                        }
                    })
                }
            });
        }

        // 保存
        handelSave = () => {
            let { flag } = this.props;
            if (flag === 'compile') {
                this.handelFunction('cs004', '编辑');
            } else {
                this.handelFunction('cs002', '新增');
            }
        }

        changeEnter() {
            var inputs = document.getElementsByClassName('input');
            let _this = this;
            function init() {
                for (let i = 0; i < inputs.length; i++) {
                    inputs[i].onkeydown = focus(_this, i)
                }
            }
            // console.log(inputs)
            var focus = function handle(_this, i) {
                return function (event) {
                    var next = (i + 1) < inputs.length ? i + 1 : 0;  // 判断是否为最后一个输入框，是则返回第一个，否则继续下一个
                    var eve = event ? event : window.event;
                    if (eve.keyCode === 13) {
                        // console.log(inputs[next].tagName)
                        if (inputs[next].tagName === 'INPUT') {
                            inputs[next].focus();    //获取焦点
                        } else if (inputs[next].tagName === 'DIV') {
                            // console.log(inputs[next])
                            if (inputs[next].id === 'DefaultMenuType') {
                                _this.myRef1.current.focus();
                            } else {
                                _this.myRef1.current.blur();
                            }
                        }
                    }
                }
            }
            init()
        }

        handleOnSelect = () => {
            // console.log('选中了')
            // console.log(this.myRef2)
            this.myRef2.current.focus();
        }

        handleOnBlur = () => {
            this.myRef2.current.focus();
        }

        componentDidUpdate() {
            this.changeEnter();
        }

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

        render() {
            const formItemLayout = {
                labelCol: { span: 10 },
                wrapperCol: { span: 14 }
            };
            const { getFieldDecorator } = this.props.form;
            let userInfo = this.props.userInfo ? this.props.userInfo : {};
            return (
                <div>
                    {/* hideRequiredMark--隐藏所有表单项的必选标记 initialValue--初始值 */}
                    <Form layout="vertical">
                        <Row gutter={16}>
                            {/* <Col span={8}>
                                <Form.Item label="代码">
                                    {getFieldDecorator('Code', {
                                        initialValue: userInfo.Code ? userInfo.Code : '',
                                        rules: [{ required: true, message: '请输入代码' }],
                                    })(<Input placeholder="请输入" />)}
                                </Form.Item>
                            </Col> */}
                            <Col span={8}>
                                <Form.Item label="科室">
                                    {getFieldDecorator('LocID', {
                                        initialValue: userInfo.ID ? userInfo.ID.split("||")[0] : '',
                                        rules: [{ required: true, message: '请选择科室' }],
                                    })(
                                        <Select
                                            showSearch
                                            placeholder="请选择"
                                            optionFilterProp="children"
                                            /*onFocus={handleFocus}
                                            onBlur={handleBlur}*/
                                            filterOption={(input, option) =>
                                                (option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0) || (option.props.alias.toLowerCase().indexOf(input.toLowerCase()) >= 0)
                                            }
                                        >
                                            {this.props.handelThis.state.list}

                                        </Select>
                                    )}
                                </Form.Item>
                            </Col>
                            <Col span={8}>
                                <Form.Item label="代码">
                                    {getFieldDecorator('Code', {
                                        initialValue: userInfo.Code ? userInfo.Code : '',
                                        rules: [{ required: true, message: '请输入代码' }],
                                    })(
                                        <Input placeholder="请输入" className='input' />
                                    )}
                                </Form.Item>
                            </Col>
                            <Col span={8}>
                                <Form.Item label="描述">
                                    {getFieldDecorator('Descripts', {
                                        initialValue: userInfo.Descripts ? userInfo.Descripts : '',
                                        rules: [{ required: true, message: '请输入代码' }],
                                    })(
                                        <Input placeholder="请输入" className='input' />
                                    )}
                                </Form.Item>
                            </Col>
                        </Row>
                        <Row gutter={16}>
                            <Col span={8}>
                                <Form.Item label="英文描述">
                                    {getFieldDecorator('ENDesc', {
                                        initialValue: userInfo.ENDesc ? userInfo.ENDesc : '',
                                        rules: [{ required: true, message: '请输入英文描述' }],
                                    })(
                                        <Input placeholder="请输入" className='input' />
                                    )}
                                </Form.Item>
                            </Col>
                            <Col span={8}>
                                <Form.Item label="生效日期">
                                    {getFieldDecorator('StartDate', {
                                        initialValue: userInfo.StartDate ? Moment(userInfo.StartDate, 'YYYY-MM-DD') : Moment(),
                                        rules: [{ required: true, message: '请选择' }],
                                    })(
                                        <DatePicker style={{ width: '100%' }} format="YYYY-MM-DD" allowClear />
                                    )}
                                </Form.Item>
                            </Col>
                            <Col span={8}>
                                <Form.Item label="失效日期">
                                    {getFieldDecorator('StopDate', {
                                        initialValue: userInfo.StopDate ? Moment(userInfo.StopDate, 'YYYY-MM-DD') : null,
                                        rules: [{ required: true, message: '请选择' }],
                                    })(
                                        <DatePicker style={{ width: '100%' }} format="YYYY-MM-DD" allowClear />
                                    )}
                                </Form.Item>
                            </Col>
                        </Row>
                        <Row gutter={16}>
                            <Col span={8}>
                                <Form.Item label="显示名称" {...formItemLayout}>
                                    {getFieldDecorator('ShowDesc', {
                                        valuePropName: 'checked',
                                        initialValue: userInfo.ShowDesc === "Y" ? true : false,
                                        
                                    })(
                                        <Switch checkedChildren="是" unCheckedChildren="否" />
                                    )}
                                </Form.Item>
                            </Col>
                            <Col span={8}>
                                <Form.Item label="门诊标记" {...formItemLayout}>
                                    {getFieldDecorator('OPFlag', {
                                        valuePropName: 'checked',
                                        initialValue: userInfo.OPFlag === "Y" ? true : false,
                                        
                                    })(
                                        <Switch checkedChildren="是" unCheckedChildren="否" />
                                    )}
                                </Form.Item>
                            </Col>
                            <Col span={8}>
                                <Form.Item label="住院标记" {...formItemLayout}>
                                    {getFieldDecorator('IPFlag', {
                                        valuePropName: 'checked',
                                        initialValue: userInfo.IPFlag === "Y" ? true : false,
                                        
                                    })(
                                        <Switch checkedChildren="是" unCheckedChildren="否" />
                                    )}
                                </Form.Item>
                            </Col>
                        </Row>
                    </Form>
                    <div
                        style={{
                            textAlign: 'center',
                            marginBottom: '20px'
                        }}
                    >
                        <Button onClick={this.handelSave} type="primary" style={{ marginRight: 8 }}>
                            {this.props.flag === 'compile' ? '编辑' : '新增'}
                        </Button>
                        <Button onClick={this.resetUserInfoFields} type="primary">
                            重置
                        </Button>
                    </div>
                </div>
            )
        }
    }
);
export default MedicalGroupModelNew;