waterDetail.jsx 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  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/order/getOrderCommodity',
  17. data: {
  18. orderNo:record?record.orderNo:this.props.data.orderNo
  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. id:thisdata.id,
  32. data:thisdata,
  33. orderNo:thisdata.orderNo,
  34. orgCodeUrl: thisdata.contractPictureUrl ? splitUrl(thisdata.contractPictureUrl, ',', globalConfig.avatarHost + '/upload') : [],
  35. orgCodeUrlNo: thisdata.contractPictureUrl ? splitUrl(thisdata.contractPictureUrl, ',', globalConfig.avatarHost + '/upload') : [],
  36. });
  37. };
  38. }
  39. }.bind(this),
  40. }).always(function () {
  41. this.setState({
  42. loading: false
  43. });
  44. }.bind(this));
  45. },
  46. getInitialState() {
  47. return {
  48. loading: false,
  49. visible:false,
  50. showDesc:false,
  51. };
  52. },
  53. onCancel(){
  54. this.setState({
  55. visible:false
  56. })
  57. this.props.closeDesc(false,false);
  58. },
  59. onShow() {
  60. this.setState({
  61. visible: false,
  62. });
  63. this.props.closeDesc(false, true);
  64. },
  65. componentWillMount() {
  66. },
  67. componentWillReceiveProps(nextProps) {
  68. if(nextProps.data.orderNo){
  69. this.loadData(nextProps.data);
  70. }
  71. this.state.visible=nextProps.showDesc;
  72. },
  73. render() {
  74. const theData = this.state.data || {};
  75. const FormItem = Form.Item;
  76. const formItemLayout = {
  77. labelCol: { span: 10 },
  78. wrapperCol: { span: 12 },
  79. };
  80. return (
  81. <div className="user-content" >
  82. <Modal maskClosable={false} visible={this.state.visible}
  83. onOk={this.onShow} onCancel={this.onCancel}
  84. width='800px'
  85. title='流水详情'
  86. footer=''
  87. className="admin-desc-content">
  88. <Form layout="horizontal" onSubmit={(e)=>{this.handleSubmit(e,0)}} >
  89. <Spin spinning={this.state.loading}>
  90. <div className="clearfix">
  91. <FormItem className="half-item" {...formItemLayout} label="平台流水编号">
  92. <span>{theData.name}</span>
  93. </FormItem>
  94. <FormItem className="half-item" {...formItemLayout} label="平台流水时间">
  95. <span>{theData.releaseDate?(new Date(theData.releaseDate)).toLocaleString():''}</span>
  96. </FormItem>
  97. <FormItem className="half-item" {...formItemLayout} label="金额">
  98. <span>{theData.orderNo}</span>
  99. </FormItem>
  100. <FormItem className="half-item" {...formItemLayout} label="流水科目">
  101. <span>{getTransactionProject(theData.orderState)}</span>
  102. </FormItem>
  103. <FormItem className="half-item" {...formItemLayout} label="付款方">
  104. <span>{theData.name}</span>
  105. </FormItem>
  106. <FormItem className="half-item" {...formItemLayout} label="收款方">
  107. <span>{theData.name}</span>
  108. </FormItem>
  109. <FormItem className="half-item" {...formItemLayout} label="交易渠道">
  110. <span>{getTransactionChannel(theData.liquidationStatus)}</span>
  111. </FormItem>
  112. <FormItem className="half-item" {...formItemLayout} label="订单编号">
  113. <span>{theData.orderNo}</span>
  114. </FormItem>
  115. <FormItem className="half-item" {...formItemLayout} label="财务流水编号">
  116. <span>{theData.orderNo}</span>
  117. </FormItem>
  118. <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 16 }} label="备注">
  119. <span>{theData.remark}</span>
  120. </FormItem>
  121. </div>
  122. </Spin>
  123. </Form>
  124. </Modal>
  125. </div>
  126. );
  127. }
  128. });
  129. export default Form.create()(WaterDetail);