| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196 | import React from 'react';import $ from 'jquery/src/ajax';import { Form, Button, Input, Select, Spin,InputNumber, message, Modal ,DatePicker} from 'antd';import {transactionChannel} from '@/dataDic.js';import moment from 'moment';const Receivable=React.createClass({    getInitialState() {        return {            loading: false,            visible:false,            showDesc:false,            data:{}        };    },    //保存    handleSubmit(e){        e.preventDefault();        if(this.state.settlementAmount === ''){                message.warning('请填写金额');                return false;        }        if(!this.state.transactionChannel){            message.warning('请选择交易渠道');            return false;        }        if(!this.state.contractNo){            message.warning('请填写合同编号');            return false;        }        if(!this.state.financialPayTimes){            message.warning('请选择财务流水时间');            return false;        }        this.setState({            loading: true        });        let data = this.props.data || {};        $.ajax({            method: "post",            dataType: "json",            async:true,            url:  globalConfig.context + this.props.api,            data: {                orderNo: data.orderNo,                payeeId:data.companyId,                payerId:data.buyerId,                contractNo:this.state.contractNo,                transactionAmount: this.state.settlementAmount,                transactionSubject: ~((this.props.title).indexOf('退款'))?'2':'0',                transactionChannel: this.state.transactionChannel,                financialPayNo:this.state.financialPayNo,                financialPayTimes:this.state.financialPayTimes,                remarks:this.state.remarks            }        }).done(function (data) {            this.setState({                loading: false            });            if (!data.error.length) {                message.success('操作成功!');                this.onShow();            } else {                message.warning(data.error[0].message);            }        }.bind(this));    },    onCancel(){    	this.setState({    		visible:false        })        this.props.closeDesc(false,false);    },    onShow() {		this.setState({			visible: false,		});		this.props.closeDesc(false, true);	},    componentWillMount() {        this.setState({            transactionProject:undefined,            settlementAmount:undefined,            transactionChannel:undefined,            financialPayNo:'',            financialPayTimes:undefined,            remarks:''        })    },    componentWillReceiveProps(nextProps) {        this.state.visible=nextProps.showDesc;        this.setState({            transactionProject:undefined,            settlementAmount:undefined,            transactionChannel:'2',            financialPayNo:'',            financialPayTimes:undefined,            remarks:'',            contractNo:nextProps.data.contractNo        })    },    render() {        const theData = this.props.data || {};        const FormItem = Form.Item;        const formItemLayout = {            labelCol: { span: 8 },            wrapperCol: { span: 12 },        };        return (            <div className="user-content" >	            <Modal maskClosable={false} visible={this.state.visible}                        onOk={this.onShow} onCancel={this.onCancel}                        width='800px'                        title={this.props.title}                                             footer=''                        className="admin-desc-content">			            <Form layout="horizontal" onSubmit={this.handleSubmit} >			                <Spin spinning={this.state.loading}>                                <div className="clearfix">                                    <FormItem className="half-item" {...formItemLayout} label="付款方">                                        <span>{theData.buyerName}</span>                                    </FormItem>                                    <FormItem className="half-item" {...formItemLayout} label="收款方">                                        <span>{theData.companyName}</span>                                    </FormItem>                                    <FormItem className="half-item" {...formItemLayout} label={<span><strong style={{color:'#f00'}}>*</strong>金额</span>}>                                        <InputNumber min={0} max={9999} placeholder="金额"                                             value={this.state.settlementAmount}                                            onChange={(e)=>{this.setState({settlementAmount:e})}}                                        />                                        <span style={{ marginLeft: '5px' }}>万元</span>                                    </FormItem>                                    <FormItem className="half-item" {...formItemLayout} label="流水科目">                                        <span>{~((this.props.title).indexOf('退款'))?'退款':'代收'}</span>                                    </FormItem>                                    <FormItem className="half-item" {...formItemLayout} label={<span><strong style={{color:'#f00'}}>*</strong>交易渠道</span>}>                                        <Select placeholder="交易渠道"                                             value={this.state.transactionChannel}                                            onChange={(e)=>{this.setState({transactionChannel:e})}}                                        >                                            {                                                 transactionChannel.map(function (item) {                                                    return	<Select.Option value={item.value} key={item.key}>{item.key}</Select.Option>                                                })                                            }                                        </Select>                                    </FormItem>                                    <FormItem className="half-item" {...formItemLayout} label="订单编号">                                        <span>{theData.orderNo}</span>                                    </FormItem>                                    {/* !theData.contractNo? */}                                    {true?<FormItem className="half-item" {...formItemLayout} label={<span><strong style={{color:'#f00'}}>*</strong>合同编号</span>} >                                        <Input placeholder="合同编号"                                            value={this.state.contractNo}                                            onChange={(e) => { this.setState({ contractNo: e.target.value }); }} />                                      </FormItem>:<FormItem className="half-item" {...formItemLayout} label="合同编号" >                                            <span>{theData.contractNo}</span>                                    </FormItem>}                                    <FormItem className="half-item" {...formItemLayout} label="财务流水编号">                                        <Input placeholder="财务流水编号"                                            value={this.state.financialPayNo}                                            onChange={(e) => { this.setState({ financialPayNo: e.target.value }); }} />                                      </FormItem>                                    <FormItem className="half-item" {...formItemLayout} label={<span><strong style={{color:'#f00'}}>*</strong>财务流水时间</span>}>                                        <DatePicker                                             showTime                                            format="YYYY-MM-DD"                                            onOk={(e)=>{console.log(e)}}                                            value={this.state.financialPayTimes ? moment(this.state.financialPayTimes) : null}                                            onChange={(data, dataString) => { this.setState({ financialPayTimes: dataString }); }} />                                    </FormItem>                                    <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="备注">                                        <Input                                            type="textarea"                                            rows={4}                                            placeholder="请输入备注"                                            value={this.state.remarks}                                            onChange={(e) => {                                                this.setState({ remarks: e.target.value });                                            }}                                        />                                    </FormItem>                                    <FormItem wrapperCol={{ span: 12, offset:4 }}>                                          <Button type="primary" htmlType="submit"  style={{marginRight:30}}>确认</Button>                                        <Button type="default" onClick={()=>{this.onCancel()}}>取消</Button>                                    </FormItem>                                  </div>			                </Spin>			            </Form>			    </Modal>            </div>        );    }});export default Form.create()(Receivable);
 |