waterDetail.jsx 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. import React from 'react';
  2. import ajax from 'jquery/src/ajax/xhr.js';
  3. import $ from 'jquery/src/ajax';
  4. import { Form,Button, Input, Spin, message, Modal, Upload } from 'antd';
  5. import {getTransactionChannel,getTransactionProject,splitUrl} from '@/tools.js';
  6. const WaterDetail=React.createClass({
  7. loadData(record) {
  8. this.state.data = [];
  9. this.setState({
  10. loading: true
  11. });
  12. $.ajax({
  13. method: "get",
  14. dataType: "json",
  15. crossDomain: false,
  16. url: globalConfig.context + '/api/admin/financial/selectOneRefundFlow',
  17. data: {
  18. billNo:record?record.billNo:this.props.data.billNo
  19. },
  20. success: function (data) {
  21. let theArr = [];
  22. if (!data.data) {
  23. if (data.error && data.error.length) {
  24. message.warning(data.error[0].message);
  25. };
  26. } else {
  27. for (let i = 0; i < data.data.length; i++) {
  28. let thisdata = data.data[i];
  29. theArr.push({
  30. key: i,
  31. data:thisdata,
  32. orderNo:thisdata.orderNo,
  33. });
  34. };
  35. }
  36. }.bind(this),
  37. }).always(function () {
  38. this.setState({
  39. loading: false
  40. });
  41. }.bind(this));
  42. },
  43. getInitialState() {
  44. return {
  45. loading: false,
  46. visible:false,
  47. showDesc:false,
  48. };
  49. },
  50. onCancel(){
  51. this.setState({
  52. visible:false
  53. })
  54. this.props.closeDesc(false,false);
  55. },
  56. onShow() {
  57. this.setState({
  58. visible: false,
  59. });
  60. this.props.closeDesc(false, true);
  61. },
  62. componentWillMount() {
  63. },
  64. componentWillReceiveProps(nextProps) {
  65. if(nextProps.data.billNo){
  66. this.loadData(nextProps.data);
  67. }
  68. this.state.visible=nextProps.showDesc;
  69. },
  70. render() {
  71. const theData = this.state.data || {};
  72. const FormItem = Form.Item;
  73. const formItemLayout = {
  74. labelCol: { span: 10 },
  75. wrapperCol: { span: 12 },
  76. };
  77. return (
  78. <div className="user-content" >
  79. <Modal maskClosable={false} visible={this.state.visible}
  80. onOk={this.onShow} onCancel={this.onCancel}
  81. width='800px'
  82. title='流水详情'
  83. footer=''
  84. className="admin-desc-content">
  85. <Form layout="horizontal" onSubmit={(e)=>{this.handleSubmit(e,0)}} >
  86. <Spin spinning={this.state.loading}>
  87. <div className="clearfix">
  88. <FormItem className="half-item" {...formItemLayout} label="平台流水编号">
  89. <span>{theData.billNo}</span>
  90. </FormItem>
  91. <FormItem className="half-item" {...formItemLayout} label="财务流水时间">
  92. <span>{theData.financialPayTimes?(new Date(theData.financialPayTimes)).toLocaleString():''}</span>
  93. </FormItem>
  94. <FormItem className="half-item" {...formItemLayout} label="金额">
  95. <span>{theData.transactionAmount}</span>
  96. </FormItem>
  97. <FormItem className="half-item" {...formItemLayout} label="流水科目">
  98. <span>{getTransactionProject(theData.transactionSubject)}</span>
  99. </FormItem>
  100. <FormItem className="half-item" {...formItemLayout} label="付款方">
  101. <span>{theData.payerName}</span>
  102. </FormItem>
  103. <FormItem className="half-item" {...formItemLayout} label="收款方">
  104. <span>{theData.payeeName}</span>
  105. </FormItem>
  106. <FormItem className="half-item" {...formItemLayout} label="交易渠道">
  107. <span>{getTransactionChannel(theData.transactionChannel)}</span>
  108. </FormItem>
  109. <FormItem className="half-item" {...formItemLayout} label="订单编号">
  110. <span>{theData.orderNo}</span>
  111. </FormItem>
  112. <FormItem className="half-item" {...formItemLayout} label="财务流水编号">
  113. <span>{theData.financialPayNo}</span>
  114. </FormItem>
  115. <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 16 }} label="备注">
  116. <span>{theData.remarks}</span>
  117. </FormItem>
  118. </div>
  119. </Spin>
  120. </Form>
  121. </Modal>
  122. </div>
  123. );
  124. }
  125. });
  126. export default Form.create()(WaterDetail);