import React from 'react'
import PropTypes from 'prop-types';
import { $http } from '../../containers/config/https';
import { Util } from '../../tools';
import { Modal, Form, Select, Checkbox, message } from 'antd';
const { Option } = Select;

const FormHandel = Form.create()(
    class extends React.Component {
        state = {
            visible: false,
            RefundPayWayArr: [],
            userInfo: {},
            hospitalId: '',
            flag: '',
            languageTable1: {}, // 国际化Table1
            languageTable2: {}, // 国际化Table2
            languageData: {}, // 国际化语言包
            language: {},   // 国际化语言
            languageCode: JSON.parse(window.sessionStorage.userData).language, // 国际化语言标识
        };

        //初始化数据
        componentDidMount() {
            this.tableList();
            this.props.onRef(this);
            this.getInitData()
            this.setState({
                userInfo: this.props.userInfo,
                hospitalId: this.props.hospitalId
            })
        }

        tableList = () => {
            var data = {
                params: [{
                    "reactCode": ["OPRefundPayWayModal"],
                    "compontName": "OPRefundPayWayModal",
                    "type": "C"
                }]
            }
            $http.post('urlS', this, {
                code: '01040073',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        let resC = res.result.C
                        let { languageCode } = this.state
                        for (var i = 0; i < resC.length; i++) {
                            resC[i].key = i;
                        }
                        if (languageCode === "EN") {
                            resC.map((item, i) => {
                                item.title = item.enDescripts
                            })
                        }

                        if (languageCode === "CN") {
                            resC.map((item, i) => {
                                item.title = item.descripts
                            })
                        }
                        let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                        this.setState({
                            columns: filterArr,
                            languageTable1: res.result.B || {},  // 国际化Table1
                            languageTable2: res.result.C || {},  // 国际化Table2
                            languageData: res.result.language || {},  // 国际化语言包
                        }, () => {
                            this.LanCNEN(this.state.languageCode)
                        })
                    }
                }
            })
        }

        LanCNEN = (code) => {
            let { languageData } = this.state
            this.setState({
                language: languageData[code]
            })
        }

        // 实时更新
        componentWillReceiveProps(nextProps) {
            const { userInfo } = this.state
            const newdata = nextProps.userInfo
            const newhospitalId = nextProps.hospitalId


            if (userInfo !== newdata) {
                this.setState({
                    userInfo: newdata,
                    hospitalId: newhospitalId
                })
            }
        }

        // 显示弹出层
        showModal = (flag, userInfo) => {
            if (flag === 'compile') {
                this.setState({ userInfo, flag: 'compile' })
            } else {
                this.setState({ flag: 'add' })
            }
            this.setState({
                visible: true,
            });
        }

        // 取消
        handleCancel = () => {
            this.setState({
                visible: false,
            }, () => {
                if (this.state.flag === 'compile') {
                    this.resetFields();
                }
            })
        }

        // 重置表单
        resetFields() {
            this.props.form.resetFields(); //清空所有
        }

        // 确定
        handleCreate = () => {
            let { flag } = this.props;
            this.handelFunction('05100080', '编辑');
        }

        //支付方式及退费方式下拉框
        getInitData = () => {
            $http.post("urlS", this, {
                code: '05100078',
                data: { params: [] },
                success: function (res) {
                    if (+res.errorCode === 0 && res.RefundPayWayArr) {
                        for (var i = 0; i < res.RefundPayWayArr.length; i++) {
                            this.state.RefundPayWayArr.push(<Option value={String(res.RefundPayWayArr[i].ID)} title='UnitID' key={i}>{res.RefundPayWayArr[i].Descripts}</Option>)
                        }
                        this.setState({ RefundPayWayArr: this.state.RefundPayWayArr })
                    }
                },
                error: function (err) {
                    this.setState({ errMsg: "数据加载失败，请重试!" });
                }
            });
        }

        //更新
        handelFunction(code, msg) {
            const { form: { validateFields } } = this.props;
            validateFields((errors, values) => {
                // 验证成功
                if (errors === null) {
                    let data = {
                        params: []
                    }
                    let obj = values;
                    obj.ID = this.state.userInfo.ID;
                    obj.userID = JSON.parse(window.sessionStorage.userData).userID
                    obj.hospID = this.state.hospitalId;
                    obj.reFundAFlag = this.state.userInfo.reFundAFlag === 'Y' ? 'Y' : 'N';
                    obj.reFundSFlag = this.state.userInfo.reFundSFlag === 'Y' ? 'Y' : 'N';
                    // 处理需要传递的obj
                    data.params.push(Util.disposeData(obj));
                    $http.post('urlADS', this, {
                        code: code,
                        data: data,
                        success: function (res) {
                            if (+res.errorCode === 0) {
                                // 提示
                                message.success(msg + '成功');
                                // 关闭弹框
                                this.handleCancel();
                                // 刷新列表数据
                                this.props.handelThis.handleQuery();
                            } else {
                                if (this.props.flag === 'compile') {
                                    // 编辑可能失败，但还是需要重置表单
                                    this.resetFields();
                                }
                            }
                        },
                        error: function () {
                            if (this.props.flag === 'compile') {
                                // 编辑可能失败，但还是需要重置表单
                                this.resetFields();
                            }
                        }
                    })
                }
            });
        }

        RPMReFundAFlagCheckbox = (e) => {
            let { userInfo } = this.state
            userInfo.reFundAFlag = userInfo.reFundAFlag === 'Y' ? 'N' : 'Y'
            this.setState({
                userInfo: userInfo
            })
        }

        RPMReFundSFlagCheckbox = (e) => {
            let { userInfo } = this.state
            userInfo.reFundSFlag = userInfo.reFundSFlag === 'Y' ? 'N' : 'Y'
            this.setState({
                userInfo: userInfo
            })
        }

        render() {
            const { getFieldDecorator } = this.props.form;
            let userInfo = this.state.userInfo ? this.state.userInfo : {}
            return (
                <Modal
                    visible={this.state.visible}
                    title="编辑"
                    okText="确定"
                    onCancel={this.handleCancel}
                    onOk={this.handleCreate}
                >
                    <Form layout="inline">
                        <Form.Item label="原支付方式">
                            {getFieldDecorator('oldPayWayDR', {
                                initialValue: userInfo.oldPayWayDR
                            })(
                                <Select style={{ width: "130px" }}>
                                    {this.state.RefundPayWayArr}
                                </Select>
                            )}
                        </Form.Item>
                        <Form.Item label="退费方式">
                            {getFieldDecorator('rPayWayDR', {
                                initialValue: userInfo.rPayWayDR
                            })(
                                <Select style={{ width: "130px" }}>
                                    {this.state.RefundPayWayArr}
                                </Select>
                            )}
                        </Form.Item>
                        <Form.Item label="作废">
                            {getFieldDecorator('reFundAFlag', {
                                initialValue: userInfo.reFundAFlag
                            })(
                                <Checkbox checked={userInfo.reFundAFlag === 'Y' ? true : false} onChange={(even) => { this.RPMReFundAFlagCheckbox(even) }} />
                            )}
                        </Form.Item>
                        <Form.Item label="红冲">
                            {getFieldDecorator('reFundSFlag', {
                                initialValue: userInfo.reFundSFlag
                            })(
                                <Checkbox checked={userInfo.reFundSFlag === 'Y' ? true : false} onChange={(even) => { this.RPMReFundSFlagCheckbox(even) }} />
                            )}
                        </Form.Item>
                    </Form>
                </Modal>
            )
        }
    }
)
export default FormHandel;

FormHandel.propTypes = {
    // 验证userInfo的属性
    userInfo: PropTypes.object
}