examine.jsx 11 KB

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