//修改支付方式界面
import React from 'react'
import { Table, Form, Row, Col, Select, Card, Input, Button, Modal, message, Icon } from 'antd'
import { $http } from 'containers/config/https';
import moment from 'moment';
import CommonPagination from 'components/pagination/index';
import RangeDatePicker from 'components/rangePicker/index';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';
import Search from 'antd/lib/input/Search';
import './style/style.less'
import ReadCard from 'components/readcard/ReadCard';

const formItemLayout = {    // label 和input宽度
    labelCol: { span: 8 },
    wrapperCol: { span: 14, offset: 2 },
};
const dateFormat = 'YYYY-MM-DD'
const { Option } = Select;
class ModifyPaymentMethod extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            data: [],
            cardTypeData: [], // 卡类型
            RefundPayWayArr: [],
            user: [],
            InvStatusArr: [],
            AdmReasonArr: [],
            visible: false,
            userInfo: {},
            total: 0,
            page: 1,
            pageSize: 50,
            showLoading: true,
            StartDateTop: moment(new Date, dateFormat),  // //开始日期
            EndDateTop: moment(new Date, dateFormat),  // //结束日期
            widthTotal: 0,//宽
            languageTable1: {}, // 国际化Table1
            languageTable2: {}, // 国际化Table2
            languageData: {}, // 国际化语言包
            language: {},   // 国际化语言
            languageCode: JSON.parse(window.sessionStorage.userData).language, // 国际化语言标识
            columns: [],
            selectedRows: [],
            type: '',
            invRecordID: '',//发票或付款记录ID
            invRecordPayWayID: '',//发票或付款记录支付方式ID
            initPayModeID: '',//原支付方式ID
            payModeID: '',//新支付方式ID
            payWayAmt: '',//支付方式金额

            // number: '',
            // cardTypeID: '',
            // cardNo: '',
            // invNo:'',
            // chargeUserID:'',

        }
    }

    //初始化数据
    componentDidMount() {
        this.loadPatientType()
        this.tableList();
        this.cardTypeList()
        this.getPayWayData()
        this.getUserData()
        this.getInvStatusData()
        this.getAdmReasonData()
        this.handleQuery()
        this.loadDepartMent()
        this.loadDoctorId()
        this.loadUnawares()
    }

    //render 自定义项目名称
    listAdd = (i, j, languageCode) => {
        let { columns } = this.state
        columns.splice(i, j,
            {
                title: languageCode === 'CN' ? "操作" : 'Operation',
                key: 'op',
                align: "center",
                width: '100px',
                render: (text, record) => (
                    <span>
                        <span className='span' onClick={() => this.handleAdd(record)}><Icon type="edit" />{languageCode === 'CN' ? "修改" : 'Update'}</span>
                    </span>
                )
            },
        )
    }
    onColumnRef = (ref) => {
        this.columnRef = ref;
    }
    // 获取主列表columns
    tableList = () => {
        var data = {
            params: [{
                "reactCode": ["ModifyPaymentMethod"],
                "compontName": "ModifyPaymentMethod",
                "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 arr = res.result && resC.length > 0 ? JSON.parse(JSON.stringify(resC)).map(item => {
                        return {
                            align: item.align,
                            widthNum: parseInt(item.width),
                            fixed: item.fixed,
                            width: item.width,
                            dataIndex: item.dataIndex,
                            title: <div onDoubleClick={() => this.columnRef.onOpenModel()}>{item.title}</div>,
                            display: item.display,
                            key: item.seqNo,
                            render: (value, row, index) => {
                                let numObj = {};
                                this.state.data.map((elem) => {
                                    let moduleName = elem.patNo;
                                    if (moduleName in numObj) {
                                        numObj[moduleName] += 1
                                    } else {
                                        numObj[moduleName] = 1
                                    }
                                })
                                const obj = {
                                    children: value,
                                    props: {},
                                };

                                if ((index > 0 && value !== this.state.data[index - 1].patNo) || index == 0) {
                                    obj.props.rowSpan = numObj[value]
                                } else {
                                    obj.props.rowSpan = 0;
                                }
                                // These two are merged into above cell

                                return obj;
                            }
                        }
                    }) : '';
                    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 || {},  // 国际化语言包
                        widthTotal: res.totalWidth
                    }, () => {
                        this.LanCNEN(this.state.languageCode)
                        this.listAdd(filterArr.length + 1, 0, languageCode);
                    })
                }
            }
        })
    }

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


    // 页码改变的回调，参数是改变后的页码及每页条数
    appPageChange = (page, pageSize) => {
        this.setState({
            page: page,
            pageSize: pageSize,
        }, () => {
            // 重新调用查询方法
            this.handleQuery();
        });
    }

    // 条数改变的回调
    apponShowSizeChange = (current, size) => {
        this.setState({
            page: current,
            pageSize: size,
        }, () => {
            // 重新调用查询方法
            this.handleQuery();
        });
    }

    startChange(date) {
        this.setState({
            StartDateTop: date,
        })
    }

    endChange(date) {
        this.setState({
            EndDateTop: date,
        })
    }


    //列表数据
    handleQuery = () => {
        let { StartDateTop, EndDateTop, language } = this.state

        if ((StartDateTop === '' || !StartDateTop) || (EndDateTop === '' || !EndDateTop)) {
            message.warn(this.state.languageCode === "CN" ? "请选择时间" : 'Please select time')
            return false
        }
        let invNo = this.props.form.getFieldValue('invNo');
        let cardNo = this.props.form.getFieldValue('cardNo');
        let number = this.props.form.getFieldValue('number');
        let cardTypeID = this.props.form.getFieldValue('cardTypeID');
        let chargeUserID = this.props.form.getFieldValue('chargeUserID');
        let { page, pageSize } = this.state;
        let { validateFields } = this.props.form;
        validateFields({ force: true }, (err, params) => {
            console.log(params)
            if (err) {
                return;
            }
            let data = {}
            params.startDate = StartDateTop || moment(new Date).format('YYYY-MM-DD')
            params.stopDate = EndDateTop || moment(new Date).format('YYYY-MM-DD')
            params.hospID = JSON.parse(window.sessionStorage.userData).hospID   //医院id
            params.invNo = invNo ? invNo : undefined
            params.cardNo = cardNo ? cardNo : undefined
            params.number = number ? number : undefined
            params.cardTypeID = cardTypeID ? cardTypeID : undefined
            params.chargeUserID = chargeUserID ? chargeUserID : undefined  //操作人id
            data = {
                params: [params],
                pagination: [{
                    pageSize: pageSize,
                    currentPage: page,
                    sortColumn: 'code',
                    sortOrder: 'asc'
                }]
            }
            console.log("pa" + params)
            $http.post('urls', this, {
                code: '05210708',
                data: data,
                success: function (res) {
                    console.log("res" + res.total)
                    if (+res.errorCode === 0 && res.data) {

                        for (var i = 0; i < res.data; i++) {
                            res.data[i].key = i;
                        }
                        this.setState({ data: res.data, total: res.total, loading: false })
                    } else {
                        this.setState({ data: [], total: 0, loading: false })
                        message.error(res.errorMessage);
                    }
                }
            })
        })
    }
    //获取科室
    loadDepartMent() {
        var params = {
            params: [{
            }]
        }
        $http.post('urlDeault', this, {
            code: "03040005",
            data: params,
            success: function (res) {
                if (res.errorCode === '0') {
                    this.setState({
                        departMentData: res.result.Data
                    })
                }
            }
        });
    }

    //获取挂号医生信息
    loadDoctorId() {
        var params = {
            params: [{
                locID: this.state.locId
            }]
        }
        $http.post('urlDeault', this, {
            code: "03040006",
            data: params,
            success: function (res) {
                if (res.errorCode === '0') {
                    this.setState({
                        depDoctorData: res.depDoctor
                    })
                }
            }
        });
    }

    //获取接待人
    loadUnawares() {
        var params = {
            params: [{}]
        }
        $http.post('urlDeault', this, {
            code: "03040036",
            data: params,
            success: function (res) {
                if (res.errorCode == '0') {
                    this.setState({
                        unawaresList: res.result,
                    })
                }
            }
        });
    }

    //获取病人类型
    loadPatientType() {
        var params = {
            params: [{
                "hospID": JSON.parse(window.sessionStorage.userData).hospID, //医院id 
            }]
        }
        $http.post('urlDeault', this, {
            code: "05100130",
            data: params,
            success: function (res) {
                if (res.errorCode == '0') {
                    this.setState({
                        PatientType: res.data,
                    })
                }
            }
        });
    }
    //操作员
    getUserData = () => {
        var data = {
            params: [{
                "hospID": JSON.parse(window.sessionStorage.userData).hospID, //医院id 
                "locTypeCode": "C"
            }]
        }
        $http.post("urlS", this, {
            code: '05210023',
            data: data,
            success: function (res) {
                if (+res.errorCode === 0 && res.user) {
                    for (var i = 0; i < res.user.length; i++) {
                        this.state.user.push(<Option value={String(res.user[i].id)} key={i + "U"}>{res.user[i].descripts}</Option>)
                    }
                    this.setState({ user: this.state.user })
                }
            },
            error: function (err) {
                this.setState({ errMsg: this.state.languageCode === "CN" ? "数据加载失败，请重试！" : 'Data loading failed, please try again' })
            }
        })
    }

    //卡类型
    cardTypeList = () => {
        var data = {
            params: [{
                hospID: JSON.parse(window.sessionStorage.userData).hospID, //医院id 
            }]
        }

        $http.post('urlS', this, {
            code: "01040059",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    let cardDeffault = res.cardType.filter((item) => {
                        return item.defaultFlag === 'Y';
                    })
                    this.setState({
                        cardType: cardDeffault[0].id, // 默认卡
                        cardTypeData: res.cardType,  // 用户数据
                    });
                }
            }
        });
    }
    //支付方式
    getPayWayData = () => {
        $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 + "W"}>{res.RefundPayWayArr[i].Descripts}</Option>)
                    }
                    this.setState({ RefundPayWayArr: this.state.RefundPayWayArr })
                }
            },
            error: function (err) {
                this.setState({ errMsg: this.state.languageCode === "CN" ? "数据加载失败，请重试！" : 'Data loading failed, please try again' });
            }
        });
    }

    //收费状态
    getInvStatusData = () => {
        $http.post("urlS", this, {
            code: '05100097',
            data: { params: [] },
            success: function (res) {
                if (+res.errorCode === 0 && res.InvStatusArr) {
                    for (var i = 0; i < res.InvStatusArr.length; i++) {
                        this.state.InvStatusArr.push(<Option value={String(res.InvStatusArr[i].ID)} key={i + "S"}>{res.InvStatusArr[i].Descripts}</Option>)
                    }
                    this.setState({ InvStatusArr: this.state.InvStatusArr })
                }
            },
            error: function (err) {
                this.setState({ errMsg: this.state.languageCode === "CN" ? "数据加载失败，请重试！" : 'Data loading failed, please try again' })
            }
        })
    }
    //结算类型
    getAdmReasonData = () => {
        var data = {
            params: [{
                hospID: JSON.parse(window.sessionStorage.userData).hospID, //医院id 
            }]
        }
        $http.post("urlS", this, {
            code: '05100129',
            data: data,
            success: function (res) {
                if (+res.errorCode === 0 && res.data) {
                    for (var i = 0; i < res.data.length; i++) {
                        this.state.AdmReasonArr.push(<Option value={String(res.data[i].id)} key={i + "A"}>{res.data[i].descripts}</Option>)
                    }
                    this.setState({ AdmReasonArr: this.state.AdmReasonArr })
                }
            },
            error: function (err) {
                this.setState({ errMsg: this.state.languageCode === "CN" ? "数据加载失败，请重试！" : 'Data loading failed, please try again' })
            }
        })
    }

    // 编辑
    handleModal(record) {
        // 初始化数据
        this.setState({ userInfo: record, visible: true, });
    }

    // 调用子组件的连接事件
    onRef = (ref) => {
        this.child = ref
    }

    // 取消
    handleCancel = () => {
        this.setState({
            visible: false,
        })
    }
    //弹窗点击确定
    handleOk = () => {
        this.props.form.validateFields((err, values) => {
            if (err) {
                return;
            }

            let data = {};
            data = {
                params: [{
                    hospID: JSON.parse(window.sessionStorage.userData).hospID,  //医院ID
                    type: values.type,               //Record或Inv
                    invRecordID: values.invRecordID,        //发票或付款记录ID
                    invRecordPayWayID: values.invRecordPayWayID,  //发票或付款记录支付方式ID
                    initPayModeID: values.initPayModeID,      //原支付方式ID
                    payModeID: values.payModeID,          //新支付方式ID
                    payWayAmt: values.payWayAmt,          //支付方式金额
                    // number: values.number,
                    // cardTypeID: values.cardTypeID,
                    // cardNo: values.cardNo,
                    // invNo:values.invNo,
                    // chargeUserID:values.chargeUserID,
                    updateUserID: JSON.parse(window.sessionStorage.userData).userID,   //更新人ID
                }]
            }
            $http.post('urlS', this, {
                code: '05210709',
                data: data,
                success: function (res) {

                    if (+res.errorCode === 0) {
                        message.success(res.errorMessage);
                        this.handleQuery();
                        this.setState({ loading: false, visible: false });
                    }
                }
            })
        })
    };

    // 分页总条数
    showTotal(total) {
        return this.state.languageCode === "CN" ? `共 ${total} 条` : `Total ${total} data`;
    }

    // 页码改变的回调，参数是改变后的页码及每页条
    onChange = (page, pageSize) => {
        this.setState({ page: page, pageSize: pageSize }, () => {
            this.handleQuery()
        });
    }
    // 条数改变的回调
    onShowSizeChange = (current, size) => {
        this.setState({ page: current, pageSize: size }, () => {
            // 重新调用查询方法
            this.onChange(current, size);
        })
    }

    // 读卡 --- 根据卡号取病人信息
    handleReadCard = (value, event) => {
        if (event.keyCode) {
            this.handleQuery(); // 重新调用查询接口
            return false
        }
        let { cardType } = this.state;
        this.readCard.ReadCard(cardType, "R", (json) => {
            let patNo = json && json.patInfo ? json.patInfo.patNo : ''
            this.setState({ patNo , cardNo: json.cardNo }, () => {
                this.handleQuery(); // 重新调用查询接口
            })
        })
    }

    //点击行，渲染当前行样式 
    setRowClassName = (record) => {
        var id = ''
        var { selectedRowKeys } = this.state;
        if (selectedRowKeys) {
            for (var i = 0; i < selectedRowKeys.length; i++) {
                if (selectedRowKeys[i] == record.id) {
                    id = selectedRowKeys[i]
                }
            }
        }
        return record.id === id ? 'clickRowStyle' : '';
    }

    selectRowKeys(selectedRowKeys, selectedRows) {
        this.setState({
            selectedRowKeys: selectedRowKeys,
            selectedRows: selectedRows
        })
    }

    changeDepartMent(e) {
        var id = '';
        if (e) {
            id = e.substring(e.indexOf('^') + 1)
        }
        this.setState({
            locId: id,
        }, () => {
            this.loadDoctorId();
        })
    }
    handleAdd = (params) => {

        if (params === 'add') {
            this.setState({
                visible: true,
                motalTitle: "添加",
                displayPassword: 'block',
                passwordRequired: true,
                updateID: '',


            });
            this.props.form.setFieldsValue({
                type: '',               //Record或Inv
                invRecordID: '',        //发票或付款记录ID
                invRecordPayWayID: '',  //发票或付款记录支付方式ID
                initPayModeID: '',      //原支付方式ID
                payModeID: '',          //新支付方式ID
                payWayAmt: '',          //支付方式金额
                // number: '',
                // cardTypeID: '',
                // cardNo: '',
                // invNo:'',
                // chargeUserID:'',

                // 'type': '',
                // 'invRecordID': '',
                // 'invRecordPayWayID': '',
                // 'initPayModeID': '',
                // 'payModeID': '',
                // 'payWayAmt': '',
                // "number": '',
                // "cardTypeID": '',
                // "cardNo": '',
                // "invNo":'',
                // "chargeUserID":'',


            });
        } else {
            this.setState({
                updateID: params.ID,
                visible: true,
                motalTitle: "修改",
            });
            this.props.form.setFieldsValue({
                'type': params.type,
                'invRecordID': params.invRecordID,
                'invRecordPayWayID': params.invRecordPayWayID,
                'payModeID': params.payModeID,
                'initPayModeID': params.payWayID,
                'payWayAmt': params.payWayAmt,
                // "number": params.number,
                // "cardTypeID":params.cardTypeID,
                // "cardNo": params.cardNo,
                // "invNo":params.invNo,
                // "chargeUserID":params.chargeUserID,


            });
        }

    }

    render() {
        let { language, widthTotal } = this.state
        let { getFieldDecorator } = this.props.form;

        //卡类型
        var cardTypeOPtion = []
        this.state.cardTypeData && this.state.cardTypeData.map((item, index) => {
            cardTypeOPtion.push(
                <Option title={item.descripts + '^' + item.descriptsSPCode} key={index} value={item.id}>{item.descripts}</Option>
            )
        })
        //获取科室信息
        let departMentOption = []
        this.state.departMentData && this.state.departMentData.map((item, index) => {
            departMentOption.push(<Option key={index} value={item.id}>{item.descripts}</Option>)
        })

        //获取科室医生信息
        let depDoctorOption = []
        this.state.depDoctorData && this.state.depDoctorData.map((item, index) => {
            depDoctorOption.push(<Option key={index} value={item.id}>{item.descripts}</Option>)
        })

        //接待人
        let unawaresListOption = []
        this.state.unawaresList && this.state.unawaresList.map((item, index) => {
            unawaresListOption.push(<Option key={index} value={item.id} code={item.descripts} name={item.descriptsSPCode}>{item.descripts}</Option>)
        })

        //病人类型
        let PatientTypeOption = []
        this.state.PatientType && this.state.PatientType.map(item => {
            PatientTypeOption.push(<Option key={item.id} value={item.id}>{item.descripts}</Option>)
        })

        const rowSelection = {
            onChange: (selectedRowKeys, selectedRows) => {
                this.setState({ selectedRows })
            },
            getCheckboxProps: record => ({
                disabled: (record.ID === '' ? true : false),
            }),
        };
        return (
            <div className='readCard-body'>
                <ReadCard ref={r => this.readCard = r} />
                <Card>
                    <Form layout="inline">
                        <Row>
                            <Col>
                                <Form.Item label={language.ModifyPaymentMethodcardType && language.ModifyPaymentMethodcardType.descripts}>
                                    {getFieldDecorator("cardTypeID", {
                                        initialValue: this.state.cardType
                                    })(
                                        <Select style={{ width: '100px' }}>
                                            {cardTypeOPtion}
                                        </Select>
                                    )}
                                </Form.Item>
                                <Form.Item>
                                    {getFieldDecorator("cardNo", {
                                        initialValue: this.state.cardNo ? this.state.cardNo : '',
                                        rules: [{ required: false }]
                                    })(
                                        <Search
                                            // onKeyUp={(e) => { this.patNodownE(e) }}
                                            style={{ width: '200px', margin: '0 0 0 1px' }}
                                            placeholder={language.ModifyPaymentMethodpatientCardNumber && language.ModifyPaymentMethodpatientCardNumber.message}
                                            enterButton={language.ModifyPaymentMethodreadcard && language.ModifyPaymentMethodreadcard.descripts}
                                            onSearch={this.handleReadCard}
                                        />
                                    )}
                                </Form.Item>
                                <Form.Item label={language.ModifyPaymentMethodIDNCM && language.ModifyPaymentMethodIDNCM.descripts}>
                                    {getFieldDecorator("number", {
                                        initialValue: this.state.number ? this.state.number : '',
                                        rules: [{ required: false }]
                                    })(
                                        <Input style={{ width: '285px' }} placeholder={language.ModifyPaymentMethodIDNCM && language.ModifyPaymentMethodIDNCM.message} onKeyUp={(e) => { this.patNodownE(e) }} />
                                    )}
                                </Form.Item>
                                <Form.Item label={language.ModifyPaymentMethodchargeDate && language.ModifyPaymentMethodchargeDate.descripts}>
                                    <span style={{ display: 'inline-block', verticalAlign: 'middle' }}><RangeDatePicker format='YYYY-MM-DD' width={290}
                                        startDate={this.state.StartDateTop} endDate={this.state.EndDateTop}
                                        startChange={this.startChange.bind(this)} endChange={this.endChange.bind(this)} />
                                    </span>
                                </Form.Item>
                                <Form.Item label={language.ModifyPaymentMethodinvoiceAndRefund && language.ModifyPaymentMethodinvoiceAndRefund.descripts}>
                                    {getFieldDecorator("invNo", {
                                        initialValue: this.state.invNo ? this.state.invNo : '',
                                        rules: [{ required: false }]
                                    })(
                                        <Input style={{ width: '240px' }} placeholder={language.ModifyPaymentMethodinvoiceAndRefund && language.ModifyPaymentMethodinvoiceAndRefund.message} onPressEnter={() => { this.setState({ page: 1, pageSize: '50' }, () => { this.handleQuery() }) }} />
                                    )}
                                </Form.Item>
                            </Col>
                            <Col>
                                <Form.Item label={language.ModifyPaymentMethodoperator && language.ModifyPaymentMethodoperator.descripts}>
                                    {getFieldDecorator("chargeUserID", {
                                        initialValue: this.state.chargeUserID ? this.state.chargeUserID : '',
                                        rules: [{ required: false }]
                                    })(
                                        <Select style={{ width: '150px' }} placeholder={language.ModifyPaymentMethodoperator && language.ModifyPaymentMethodoperator.message} allowClear>
                                            {this.state.user}
                                        </Select>
                                    )}
                                </Form.Item>
                                <Form.Item>
                                    <Button type="primary" onClick={() => { this.setState({ page: 1, pageSize: '50' }, () => { this.handleQuery() }) }}>{language.ModifyPaymentMethodquery && language.ModifyPaymentMethodquery.descripts}</Button>
                                    <Button style={{ background: '#F7805D', color: '#FFFFFF', borderColor: '#F7805D' }} icon="plus" onClick={() => this.handleAdd('add')}>添加 </Button>

                                </Form.Item>
                                <Form.Item>
                                </Form.Item>
                            </Col>
                        </Row>
                    </Form>
                </Card>
                <div style={{ widht: '100%', height: '10px', background: '#f0f2f5' }}></div>
                <Card>
                    <Table
                        style={{ height: '600px' }}
                        dataSource={this.state.data}
                        columns={this.state.columns}
                        className='TableA'
                        pagination={false}
                        scroll={{ x: (this.state.columns && this.state.columns.length > 0 ? widthTotal : 2900), y: 550 }}
                        bordered
                        rowKey={(data) => {
                            return data.id
                        }}
                        loading={this.state.loading}
                        rowSelection={rowSelection}
                    />
                    <CommonPagination size="large" current={this.state.page} total={this.state.total} search='search'
                        onShowSizeChange={this.apponShowSizeChange} complete={true} dataSource={this.state.data}
                        onChange={this.appPageChange} />
                    <ColumnAuthoritysModel
                        clientWidth='900px'
                        compontName='ModifyPaymentMethod'
                        configType="C"
                        onRef={this.onColumnRef}
                        reloadData={this.tableList}
                    />
                </Card>
                <div>
                    <Form layout="inline">
                        <Modal
                            visible={this.state.visible}
                            title={this.state.motalTitle}
                            onOk={() => this.handleOk}
                            onCancel={this.handleCancel}
                            width='600px'
                            footer={[
                                <Button key="back" onClick={this.handleCancel}>
                                    返回
                    </Button>,
                                <Button key="submit" type="primary" loading={this.state.loading} onClick={this.handleOk}>
                                    提交
                    </Button>,
                            ]}
                        >
                            <Row>
                                <Col span={24}>
                                    <Form.Item label="类型" {...formItemLayout}  >
                                        {getFieldDecorator("type", {
                                        })(
                                            <Select style={{ width: '150px' }} allowClear placeholder="请选择类型" >
                                                <Option key='Record' value='Record'>Record</Option>
                                                <Option key='Inv' value='Inv'>Inv</Option>
                                            </Select>
                                        )}
                                    </Form.Item>
                                </Col>

                                <Col span={24}>
                                    <Form.Item label="发票或付款记录ID" {...formItemLayout} >
                                        {getFieldDecorator("invRecordID", {
                                            initialValue: this.state.invRecordID ? this.state.invRecordID : '',
                                        })(
                                            <Input allowClear placeholder="请输入" style={{ width: '150px', }} />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={24}>
                                    <Form.Item label="发票或付款记录支付方式ID" {...formItemLayout} >
                                        {getFieldDecorator("invRecordPayWayID", {
                                            initialValue: this.state.invRecordPayWayID ? this.state.invRecordPayWayID : '',
                                            // rules: [{ required: true,  }]
                                        })(
                                            <Input allowClear placeholder="请输入发票或付款记录支付方式ID" style={{ width: '150px', }} />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={24}>
                                    <Form.Item label="原支付方式ID" {...formItemLayout} >
                                        {getFieldDecorator("initPayModeID", {
                                            initialValue: this.state.initPayModeID ? this.state.initPayModeID : '',
                                        })(
                                            <Input allowClear placeholder="请输入原支付方式ID" style={{ width: '150px', }} />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={24}>
                                    <Form.Item label="新支付方式ID" {...formItemLayout} >
                                        {getFieldDecorator("payModeID", {
                                            initialValue: this.state.payModeID ? this.state.payModeID : '',
                                        })(
                                            <Input allowClear placeholder="请输入描述" style={{ width: '150px', }} />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={24}>
                                    <Form.Item label="支付方式金额" {...formItemLayout} >
                                        {getFieldDecorator("payWayAmt", {
                                            initialValue: this.state.payWayAmt ? this.state.payWayAmt : '',
                                        })(
                                            <Input allowClear placeholder="请输入支付方式金额" style={{ width: '150px', }} />
                                        )}
                                    </Form.Item>
                                </Col>
                            </Row>
                        </Modal>
                    </Form>

                </div>
            </div>
        )
    }
}
export default Form.create()(ModifyPaymentMethod)