examine.jsx 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220
  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 {getNewOrderStatus,getLiquidationStatus,splitUrl} from '@/tools.js';
  6. const Examine=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. //保存
  54. handleSubmit(e,index){
  55. e.preventDefault();
  56. if(index=='2'&&!this.state.remark){
  57. message.warning('请填写拒绝退单的原因');
  58. return false;
  59. }
  60. this.setState({
  61. loading: true
  62. });
  63. $.ajax({
  64. method: "post",
  65. dataType: "json",
  66. async:true,
  67. url: globalConfig.context + '/api/admin/financial/changeRefund',
  68. data: {
  69. id: this.props.data.id,
  70. refundStatus:index,
  71. remarks:index=='2'?this.state.remarks:''
  72. }
  73. }).done(function (data) {
  74. this.setState({
  75. loading: false
  76. });
  77. if (!data.error.length) {
  78. message.success('操作成功!');
  79. this.onShow();
  80. } else {
  81. message.warning(data.error[0].message);
  82. }
  83. }.bind(this));
  84. },
  85. onCancel(){
  86. this.setState({
  87. visible:false
  88. })
  89. this.props.closeDesc(false,false);
  90. },
  91. onShow() {
  92. this.setState({
  93. visible: false,
  94. });
  95. this.props.closeDesc(false, true);
  96. },
  97. componentWillMount() {
  98. this.setState({
  99. remarks:''
  100. })
  101. },
  102. componentWillReceiveProps(nextProps) {
  103. if(nextProps.data.orderNo){
  104. this.loadData(nextProps.data);
  105. }
  106. this.state.visible=nextProps.showDesc;
  107. this.setState({
  108. remarks:''
  109. })
  110. },
  111. render() {
  112. const theData = this.state.data || {};
  113. const FormItem = Form.Item;
  114. const formItemLayout = {
  115. labelCol: { span: 10 },
  116. wrapperCol: { span: 12 },
  117. };
  118. return (
  119. <div className="user-content" >
  120. <Modal maskClosable={false} visible={this.state.visible}
  121. onOk={this.onShow} onCancel={this.onCancel}
  122. width='800px'
  123. title='退单审核'
  124. footer=''
  125. className="admin-desc-content">
  126. <Form layout="horizontal" onSubmit={(e)=>{this.handleSubmit(e,1)}} >
  127. <Spin spinning={this.state.loading}>
  128. <div className="clearfix">
  129. <FormItem className="half-item" {...formItemLayout} label="退单编号">
  130. <span>{theData.id}</span>
  131. </FormItem>
  132. <FormItem className="half-item" {...formItemLayout} label="退单时间">
  133. <span>{theData.createTime?(new Date(theData.createTime)).toLocaleString():''}</span>
  134. </FormItem>
  135. <FormItem className="half-item" {...formItemLayout} label="订单编号">
  136. <span>{theData.orderNo}</span>
  137. </FormItem>
  138. <FormItem className="half-item" {...formItemLayout} label="订单状态">
  139. <span>{getNewOrderStatus(theData.orderStatus)}</span>
  140. </FormItem>
  141. <FormItem className="half-item" {...formItemLayout} label="结算状态">
  142. <span>{getLiquidationStatus(theData.liquidationStatus)}</span>
  143. </FormItem>
  144. <FormItem className="half-item" {...formItemLayout} label="付款方">
  145. <span>{theData.payerName}</span>
  146. </FormItem>
  147. <FormItem className="half-item" {...formItemLayout} label="收款方">
  148. <span>{theData.payeeName}</span>
  149. </FormItem>
  150. <FormItem className="half-item" {...formItemLayout} label="财务流水编号">
  151. <span>{theData.billNo}</span>
  152. </FormItem>
  153. <div className="clearfix">
  154. <FormItem labelCol={{ span:5 }} wrapperCol={{ span: 17 }} label="终止合同">
  155. <Upload className="demandDetailShow-upload"
  156. listType="picture-card"
  157. fileList={this.state.orgCodeUrl}
  158. onPreview={(file) => {
  159. this.setState({
  160. previewImage: file.url || file.thumbUrl,
  161. previewVisible: true,
  162. });
  163. }} >
  164. </Upload>
  165. <Modal maskClosable={false} footer={null}
  166. visible={this.state.previewVisible}
  167. onCancel={() => { this.setState({ previewVisible: false }) }}>
  168. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  169. </Modal>
  170. </FormItem>
  171. </div>
  172. <div className="clearfix">
  173. <FormItem labelCol={{ span:5 }} wrapperCol={{ span: 17 }} label="退单申请表">
  174. <Upload className="demandDetailShow-upload"
  175. listType="picture-card"
  176. fileList={this.state.orgCodeUrlNo}
  177. onPreview={(file) => {
  178. this.setState({
  179. previewImage: file.url || file.thumbUrl,
  180. previewVisible: true,
  181. });
  182. }} >
  183. </Upload>
  184. <Modal maskClosable={false} footer={null}
  185. visible={this.state.previewVisible}
  186. onCancel={() => { this.setState({ previewVisible: false }) }}>
  187. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  188. </Modal>
  189. </FormItem>
  190. </div>
  191. <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 16 }} label="退单原因">
  192. <span>{theData.reason}</span>
  193. </FormItem>
  194. <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 16 }} label="拒绝原因">
  195. <Input
  196. type="textarea"
  197. rows={4}
  198. placeholder="若拒绝,请输入拒绝退单原因"
  199. value={this.state.remarks}
  200. onChange={(e) => {
  201. this.setState({ remarks: e.target.value });
  202. }}
  203. />
  204. </FormItem>
  205. <FormItem wrapperCol={{ span: 12, offset:5 }}>
  206. <Button type="primary" htmlType="submit" style={{marginRight:20}}>同意退单</Button>
  207. <Button type="primary" onClick={(e)=>{this.handleSubmit(e,2)}} style={{marginRight:20}}>拒绝退单</Button>
  208. <Button type="default" onClick={()=>{this.onCancel()}}>取消</Button>
  209. </FormItem>
  210. </div>
  211. </Spin>
  212. </Form>
  213. </Modal>
  214. </div>
  215. );
  216. }
  217. });
  218. export default Form.create()(Examine);