refund.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181
  1. import React, { Component } from "react";
  2. import { Modal, Table, Button, message, Spin, Upload } from "antd";
  3. import $ from "jquery/src/ajax";
  4. import "./table.less";
  5. import {
  6. splitUrl,
  7. } from "@/tools.js";
  8. class Refund extends Component {
  9. constructor(props) {
  10. super(props);
  11. this.state = {
  12. visible: false,
  13. dataSource: [],
  14. loading: false,
  15. columns: [
  16. {
  17. title: "退款金额(万元)",
  18. dataIndex: "refundAmount",
  19. key: "refundAmount",
  20. },
  21. {
  22. title: "退款时间",
  23. dataIndex: "refundDate",
  24. key: "refundDate"
  25. },
  26. {
  27. title: "备注",
  28. dataIndex: "remarks",
  29. key: "remarks"
  30. },
  31. ],
  32. };
  33. }
  34. componentDidMount() {
  35. if (this.props.dataSource) {
  36. return
  37. }
  38. this.loadData()
  39. }
  40. loadData() {
  41. this.setState({
  42. loading: true
  43. });
  44. $.ajax({
  45. method: "get",
  46. dataType: "json",
  47. crossDomain: false,
  48. url: globalConfig.context + "/api/admin/orderChange/listRefund",
  49. data: {
  50. id: this.props.id
  51. },
  52. success: function (data) {
  53. if (data.error.length || data.data.list == "") {
  54. if (data.error && data.error.length) {
  55. message.warning(data.error[0].message);
  56. }
  57. } else {
  58. this.setState({
  59. dataSource: data.data
  60. });
  61. }
  62. }.bind(this)
  63. }).always(
  64. function () {
  65. this.setState({
  66. loading: false
  67. });
  68. }.bind(this)
  69. );
  70. }
  71. render() {
  72. const urlStr = this.props.data.refundUrl
  73. const orgCodeUrl = urlStr ? splitUrl(
  74. urlStr,
  75. ",",
  76. globalConfig.avatarHost + "/upload"
  77. )
  78. : []
  79. return (
  80. <div
  81. style={{
  82. position: "relative",
  83. display:
  84. (this.props.data.processState == 7 ||
  85. this.props.data.processState == 8) &&
  86. this.props.data.status == 4
  87. ? "block"
  88. : "none",
  89. marginTop: 10
  90. }}
  91. >
  92. <hr style={{ marginTop: 12, marginBottom: 10, backgroundColor: "black", height: 1, border: "none" }} />
  93. <h3 style={{ marginLeft: 20, fontWeight: 800, marginBottom: 10, display: "inline-block" }}>
  94. 执行退款 <span style={{ fontSize: 12, fontWeight: "normal", color: "red" }}>(注:执行退款,系统将从已收款金额中直接减款)</span>
  95. </h3>
  96. <Table
  97. pagination={false}
  98. bordered
  99. columns={this.state.columns}
  100. dataSource={this.props.dataSource ? this.props.dataSource : this.state.dataSource}
  101. size="small"
  102. scroll={{ x: "max-content", y: 0 }}
  103. />
  104. <div className="clearfix">
  105. <h3 style={{ marginLeft: 20, fontWeight: 800, marginBottom: 10 }}>
  106. 退款凭证
  107. </h3>
  108. <div style={{ marginLeft: 20 }}>
  109. <Upload
  110. className="demandDetailShow-upload"
  111. listType="picture-card"
  112. fileList={orgCodeUrl}
  113. onPreview={file => {
  114. this.setState({
  115. previewImage: file.url || file.thumbUrl,
  116. previewVisible: true
  117. });
  118. }}
  119. />
  120. <Modal
  121. maskClosable={false}
  122. footer={null}
  123. visible={this.state.previewVisible}
  124. onCancel={() => {
  125. this.setState({ previewVisible: false, rotateDeg: 0 }, () => {
  126. });
  127. }}
  128. >
  129. <img
  130. alt=""
  131. style={{
  132. width: "100%",
  133. transform: `rotate(${this.state.rotateDeg}deg)`
  134. }}
  135. src={this.state.previewImage || ""}
  136. />
  137. {/* <Button
  138. onClick={this.rotate}
  139. style={{
  140. position: "relative",
  141. left: "50%",
  142. transform: "translateX(-50%)"
  143. }}
  144. >
  145. 旋转
  146. </Button>
  147. <Button
  148. onClick={this.upImg}
  149. style={{
  150. position: "absolute",
  151. left: -81,
  152. top: "50%",
  153. transform: "translateY(-50%)"
  154. }}
  155. >
  156. 上一张
  157. </Button>
  158. <Button
  159. onClick={this.downImg}
  160. style={{
  161. position: "absolute",
  162. right: -81,
  163. top: "50%",
  164. transform: "translateY(-50%)"
  165. }}
  166. >
  167. 下一张
  168. </Button> */}
  169. </Modal>
  170. </div>
  171. </div>
  172. </div>
  173. );
  174. }
  175. }
  176. export default Refund;