changeDetailYxgly.js 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914
  1. import React, { Component } from "react";
  2. import {Form, Upload, Modal, Button, message, Input, Table, Tooltip} from "antd";
  3. import AgreeButton from "./agreeButton.js";
  4. import Rizhi from "./rizhi.js";
  5. import { getProcessStatusNew } from "../../../../tools.js";
  6. import { shenghePeo, changeColor } from "@/tools.js";
  7. import $ from "jquery/src/ajax";
  8. import tongguo from "../../../../../../image/tongguo.png";
  9. import quxiao from "../../../../../../image/quxiao.png";
  10. import ProAndCuiList from "./proAndCuiList.jsx";
  11. // import OrderCoor from "./orderCoor";
  12. import ReactToPrint from "react-to-print";
  13. const FormItem = Form.Item;
  14. import Refund from "./refund.js"
  15. import ImgList from "../../../../common/imgList/index";
  16. import EnterpriseNameChange from "../../../../common/enterpriseNameChange";
  17. const { TextArea } = Input;
  18. const formItemLayout = {
  19. labelCol: { span: 8 },
  20. wrapperCol: { span: 14 }
  21. };
  22. const changeType = [
  23. {
  24. value: "0",
  25. key: "退单退款"
  26. },
  27. {
  28. value: "1",
  29. key: "项目及金额变更"
  30. },
  31. {
  32. value: "2",
  33. key: "仅项目变更"
  34. },
  35. {
  36. value: "3",
  37. key: "仅金额变更"
  38. },
  39. {
  40. value: "4",
  41. key: "重报"
  42. },
  43. {
  44. value: "5",
  45. key: "赠送"
  46. }
  47. ];
  48. const getChangeType = function (e) {
  49. if (e || e == 0) {
  50. let str = e.toString();
  51. let theType = "";
  52. changeType.map(function (item) {
  53. if (item.value == str) {
  54. theType = item.key;
  55. }
  56. });
  57. return theType;
  58. }
  59. };
  60. class Itemlist extends Component {
  61. constructor(props) {
  62. super(props);
  63. }
  64. render() {
  65. let pageData = this.props.pageData;
  66. return (
  67. <div className="clearfix">
  68. {pageData.labelA === '客户名称' ? <Form.Item
  69. label={pageData.labelA}
  70. {...pageData.formItemLayoutA}
  71. className="half-item"
  72. >
  73. <div>
  74. {pageData.dataA}
  75. <EnterpriseNameChange
  76. type='journal'
  77. style={{ marginLeft: 10 }}
  78. enterpriseId={this.props.orderUid}/>
  79. </div>
  80. </Form.Item> : pageData.labelA === '当前进度' || pageData.labelA === '变更原因' ? <Form.Item
  81. label={pageData.labelA}
  82. {...pageData.formItemLayoutA}
  83. className="half-item"
  84. >
  85. <Tooltip placement="topLeft" title={pageData.dataA}>
  86. <div style={{
  87. width: '350px !important',
  88. whiteSpace: 'nowrap',
  89. wordBreak: 'break-all',
  90. overflow: 'hidden',
  91. textOverflow: 'ellipsis',
  92. }}>{pageData.dataA}</div>
  93. </Tooltip>
  94. </Form.Item> : <Form.Item
  95. label={pageData.labelA}
  96. {...pageData.formItemLayoutA}
  97. className="half-item"
  98. >
  99. <div>{pageData.dataA}</div>
  100. </Form.Item>}
  101. <Form.Item
  102. label={pageData.labelB}
  103. {...pageData.formItemLayoutB}
  104. className="half-item"
  105. >
  106. <span>{pageData.dataB}</span>
  107. </Form.Item>
  108. </div>
  109. );
  110. }
  111. }
  112. class ChangeDetail extends Component {
  113. constructor(props) {
  114. super(props);
  115. this.state = {
  116. rotateDeg: 0,
  117. previewVisible: false,
  118. buttonStatus: true,
  119. dataSource: [],
  120. reason: "",
  121. rejectState: 0,
  122. // 累计回收退票
  123. refundInvoice: 0,
  124. // 收款信息
  125. proceedsData: [],
  126. proceedsTotal: this.props.proceedsTotal,
  127. // 开票信息
  128. invoiceData: [],
  129. invoiceTotal: this.props.invoiceTotal,
  130. cost: 10,
  131. refund: 8,
  132. // 测试添加退票
  133. contactList: this.props.contactList,
  134. ContactsLists: [
  135. {
  136. title: "金额(万元)",
  137. dataIndex: "amount",
  138. key: "amount",
  139. render: (text, record) => {
  140. return (
  141. <div>
  142. 实际回收退票(万元)
  143. <Input
  144. value={record.amount}
  145. placeholder="请输入金额(必填项)"
  146. disabled={record.load}
  147. key={record.id}
  148. required="required"
  149. onChange={(e) => {
  150. record.amount = e.target.value;
  151. this.setState({ contactList: this.state.contactList });
  152. }}
  153. style={{ width: "120px" }}
  154. />
  155. </div>
  156. );
  157. },
  158. },
  159. {
  160. title: "时间",
  161. dataIndex: "createTimes",
  162. key: "createTimes",
  163. render: (text, record) => {
  164. return <div>{record.createTimes}</div>;
  165. },
  166. },
  167. ],
  168. };
  169. this.getOrgCodeUrl = this.getOrgCodeUrl.bind(this);
  170. this.changeButtonStatus = this.changeButtonStatus.bind(this);
  171. this.moneyOld = this.moneyOld.bind(this);
  172. this.downImg = this.downImg.bind(this);
  173. this.upImg = this.upImg.bind(this);
  174. this.rotate = this.rotate.bind(this);
  175. }
  176. // componentWillUpdate() {
  177. // this.loadDataChange();
  178. // console.log(this.props);
  179. // }
  180. // componentDidUpdate() {
  181. // this.loadDataChange();
  182. // console.log(this.props);
  183. // }
  184. // loadDataChange() {
  185. // console.log(this.props);
  186. // $.ajax({
  187. // method: "get",
  188. // dataType: "json",
  189. // crossDomain: false,
  190. // url: globalConfig.context + "/api/admin/orderChange/orderChangeLogList",
  191. // data: {
  192. // changeId: this.props.data.id
  193. // },
  194. // success: function(data) {
  195. // if (data.error.length || data.data.list == "") {
  196. // if (data.error && data.error.length) {
  197. // message.warning(data.error[0].message);
  198. // }
  199. // } else {
  200. // this.setState({
  201. // dataSource: data.data
  202. // });
  203. // }
  204. // }.bind(this)
  205. // });
  206. // }
  207. downImg() {
  208. let num = 0;
  209. for (let i = 0; i < this.props.pictureUrl.length; i++) {
  210. if (this.props.pictureUrl[i].url == this.state.previewImage) {
  211. num = i;
  212. }
  213. }
  214. if (num == this.props.pictureUrl.length - 1) {
  215. return message.warning("已经是最后一张了哦");
  216. }
  217. this.state.previewImage = this.props.pictureUrl[num + 1].url;
  218. this.setState({
  219. previewImage: this.state.previewImage,
  220. rotateDeg: 0,
  221. });
  222. }
  223. upImg() {
  224. let num = 0;
  225. for (let i = 0; i < this.props.pictureUrl.length; i++) {
  226. if (this.props.pictureUrl[i].url == this.state.previewImage) {
  227. num = i;
  228. }
  229. }
  230. if (num == 0) {
  231. return message.warning("已经是第一张了哦");
  232. }
  233. this.state.previewImage = this.props.pictureUrl[num - 1].url;
  234. this.setState({
  235. previewImage: this.state.previewImage,
  236. rotateDeg: 0,
  237. });
  238. }
  239. rotate() {
  240. let rotateDeg = this.state.rotateDeg + 90;
  241. this.setState({
  242. rotateDeg,
  243. });
  244. }
  245. moneyOld(str, money) {
  246. if (money) {
  247. return (
  248. <span style={{ color: "red", fontWeight: 900, fontSize: 16 }}>
  249. {str}(原合同金额{money}万元)
  250. </span>
  251. );
  252. } else {
  253. return (
  254. <span style={{ color: "red", fontWeight: 900, fontSize: 16 }}>
  255. {str}
  256. </span>
  257. );
  258. }
  259. }
  260. componentWillReceiveProps(nextProps) {
  261. this.setState({
  262. paymentTimes: nextProps.data.paymentTimes,
  263. paymentAmount: nextProps.data.paymentAmount,
  264. invoiceTimes: nextProps.data.invoiceTimes,
  265. invoiceAmount: nextProps.data.invoiceAmount,
  266. cwCost: nextProps.data.cwCost,
  267. refundableAmount: nextProps.data.refundableAmount,
  268. cwRemarks: nextProps.data.cwRemarks,
  269. contactList: nextProps.contactList,
  270. refundInvoice: nextProps.data.refundInvoice,
  271. });
  272. }
  273. getOrgCodeUrl(e) {
  274. this.setState({
  275. orgCodeUrl: e,
  276. });
  277. }
  278. //同意拒绝按钮的有无
  279. changeButtonStatus() {
  280. this.setState({
  281. buttonStatus: !this.state.buttonStatus,
  282. });
  283. window.setTimeout(() => {
  284. this.setState({
  285. reason: "",
  286. });
  287. }, 100);
  288. }
  289. render() {
  290. const pageData = [
  291. {
  292. labelA: "客户名称",
  293. formItemLayoutA: formItemLayout,
  294. dataA: this.props.data.userName,
  295. labelB: "合同编号",
  296. formItemLayoutB: formItemLayout,
  297. dataB: this.props.data.contractNo,
  298. },
  299. {
  300. labelA: "时间",
  301. formItemLayoutA: formItemLayout,
  302. dataA: this.props.data.createTimes,
  303. labelB: "发起人",
  304. formItemLayoutB: formItemLayout,
  305. dataB: this.props.data.applicant,
  306. },
  307. {
  308. labelA: "当前进度",
  309. formItemLayoutA: formItemLayout,
  310. // 当前是咨询师以及咨询师经理时使用shenhePeo函数,其他流程正常显示
  311. dataA:
  312. this.props.data.processState == 2 || this.props.data.processState == 3
  313. ? shenghePeo(
  314. this.props.data.processState == 2
  315. ? this.props.data.consultantExamine
  316. : this.props.data.managerExamine,
  317. this.props.data.processState
  318. )
  319. : getProcessStatusNew(
  320. this.props.data.processState,
  321. this.props.data.status
  322. ),
  323. labelB: "变更类型",
  324. formItemLayoutB: formItemLayout,
  325. dataB: getChangeType(this.props.data.type),
  326. },
  327. {
  328. labelA: "合同额(万元)",
  329. formItemLayoutA: formItemLayout,
  330. dataA: this.moneyOld(this.props.data.totalAmount, this.props.money),
  331. labelB: "已收款(万元)",
  332. formItemLayoutB: formItemLayout,
  333. dataB: changeColor(this.props.data.settlementAmount),
  334. },
  335. {
  336. labelA: "欠款(万元)",
  337. formItemLayoutA: formItemLayout,
  338. dataA: changeColor(this.props.data.arrears),
  339. labelB: "申请退款(万元)",
  340. formItemLayoutB: formItemLayout,
  341. dataB: changeColor(this.props.data.changeAmount),
  342. },
  343. {
  344. labelA: "变更原因",
  345. formItemLayoutA: formItemLayout,
  346. dataA: this.props.data.remarks,
  347. },
  348. ];
  349. const planData = [
  350. {
  351. labelA: "项目进度",
  352. formItemLayoutA: formItemLayout,
  353. dataA: this.props.data.projectState,
  354. labelB: "发生成本费用(万元)",
  355. formItemLayoutB: formItemLayout,
  356. dataB: this.props.data.zxsCost,
  357. },
  358. {
  359. labelA: "变更原因",
  360. formItemLayoutA: formItemLayout,
  361. dataA: this.props.data.zxsRemarks,
  362. },
  363. ];
  364. const financeData = [
  365. {
  366. labelA: "发生成本(万元)",
  367. formItemLayoutA: formItemLayout,
  368. dataA: this.props.data.cwCost,
  369. labelB: "应退金额(万元)",
  370. formItemLayoutB: formItemLayout,
  371. dataB: this.props.data.refundableAmount,
  372. },
  373. ];
  374. const buttonData = [
  375. {
  376. name: "同意",
  377. title: "理由",
  378. placeholder: "请输入理由",
  379. type: "primary",
  380. status: 2,
  381. onChange: (value) => {
  382. this.setState({
  383. remarks: value,
  384. });
  385. },
  386. },
  387. {
  388. name: "拒绝",
  389. title: "理由",
  390. placeholder: "请输入理由",
  391. type: "danger",
  392. status: 3,
  393. onChange: (value) => {
  394. this.setState({
  395. remarks: value,
  396. });
  397. },
  398. },
  399. ];
  400. const orgCodeUrl = this.props.pictureUrl;
  401. const attachment = this.props.attachment
  402. console.log(this.props.attachment);
  403. console.log(this.props.orderUid);
  404. return (
  405. <div className="clearfix changeDetail">
  406. <div
  407. className="clearfix"
  408. ref={(e) => {
  409. this.refs = e;
  410. }}
  411. >
  412. <div
  413. style={{
  414. borderRadius: "50%",
  415. width: 300,
  416. height: 300,
  417. position: "absolute",
  418. top: 230,
  419. left: 525,
  420. transform: "rotate(-5deg)",
  421. zIndex: 1,
  422. display:
  423. (this.props.data.processState == 7 ||
  424. this.props.data.processState == 8) &&
  425. this.props.data.status == 4
  426. ? "block"
  427. : "none",
  428. }}
  429. >
  430. {/* <span
  431. style={{
  432. fontSize: 29,
  433. position: "absolute",
  434. left: "50%",
  435. top: "50%",
  436. transform: "translate(-50%,-50%)",
  437. color: "red"
  438. }}
  439. >
  440. 通过
  441. </span> */}
  442. <img src={tongguo} style={{ width: "100%" }} />
  443. </div>
  444. <div
  445. style={{
  446. borderRadius: "50%",
  447. width: 300,
  448. height: 300,
  449. position: "absolute",
  450. top: 284,
  451. left: 586,
  452. transform: "rotate(-5deg)",
  453. zIndex: 1,
  454. display: this.props.data.status == 5 ? "block" : "none",
  455. }}
  456. >
  457. <img src={quxiao} style={{ width: "63%" }} />
  458. </div>
  459. <h2 style={{ textAlign: "center", marginBottom: 10, marginTop: 20 }}>
  460. 合同变更记录
  461. </h2>
  462. {pageData.map((item, index) => {
  463. return <Itemlist orderUid={this.props.orderUid} key={index} pageData={item} />;
  464. })}
  465. <Form.Item
  466. label="变更凭证"
  467. labelCol={{ span: 4 }}
  468. wrapperCol={{ span: 18 }}
  469. >
  470. {/*<Upload*/}
  471. {/* className="demandDetailShow-upload"*/}
  472. {/* listType="picture-card"*/}
  473. {/* fileList={orgCodeUrl}*/}
  474. {/* onPreview={(file) => {*/}
  475. {/* this.setState({*/}
  476. {/* previewImage: file.url || file.thumbUrl,*/}
  477. {/* previewVisible: true,*/}
  478. {/* });*/}
  479. {/* }}*/}
  480. {/*/>*/}
  481. <div style={{paddingTop:'10px',paddingBottom:'10px'}}>
  482. <ImgList fileList={orgCodeUrl} ItemWidth={'96px'}/>
  483. </div>
  484. <Modal
  485. maskClosable={false}
  486. footer={null}
  487. width={"50%"}
  488. visible={this.state.previewVisible}
  489. onCancel={() => {
  490. this.setState({ previewVisible: false, rotateDeg: 0 });
  491. }}
  492. >
  493. <img
  494. alt=""
  495. style={{
  496. width: "100%",
  497. transform: `rotate(${this.state.rotateDeg}deg)`,
  498. }}
  499. src={this.state.previewImage || ""}
  500. />
  501. <Button
  502. onClick={this.rotate}
  503. style={{
  504. position: "relative",
  505. left: "50%",
  506. transform: "translateX(-50%)",
  507. }}
  508. >
  509. 旋转
  510. </Button>
  511. <Button
  512. onClick={this.upImg}
  513. style={{
  514. position: "absolute",
  515. left: -81,
  516. top: "50%",
  517. transform: "translateY(-50%)",
  518. }}
  519. >
  520. 上一张
  521. </Button>
  522. <Button
  523. onClick={this.downImg}
  524. style={{
  525. position: "absolute",
  526. right: -81,
  527. top: "50%",
  528. transform: "translateY(-50%)",
  529. }}
  530. >
  531. 下一张
  532. </Button>
  533. </Modal>
  534. <Rizhi changeId={this.props.id} />
  535. </Form.Item>
  536. {/* <h2 style={{ textAlign: "center", marginBottom: 0 }}>变更日志</h2> */}
  537. <ul
  538. style={{
  539. width: "868px",
  540. overflow: "hidden",
  541. paddingLeft: "90px",
  542. position: "relative",
  543. }}
  544. >
  545. {/* <span>操作人:</span> */}
  546. {this.props.dataSource.map((item, index) => {
  547. if (item.status == 0) {
  548. item.status = "发起";
  549. } else if (item.status == 1) {
  550. item.status = "审核中";
  551. } else if (item.status == 2) {
  552. item.status = "通过";
  553. } else if (item.status == 3) {
  554. item.status = "驳回";
  555. } else if (item.status == 4) {
  556. item.status = "完成";
  557. }
  558. return (
  559. <li
  560. key={index}
  561. style={{
  562. width: "100%",
  563. height: "auto",
  564. wordBreak: "break-all",
  565. marginBottom: "10px",
  566. }}
  567. >
  568. {item.aname + ":" + "(" + item.status + ")" + item.remarks}
  569. </li>
  570. );
  571. })}
  572. </ul>
  573. <ProAndCuiList id={this.props.id} />
  574. {/* 收款情况 */}
  575. <div className="clearfix">
  576. <h3 style={{ marginLeft: 20, fontWeight: 800, marginBottom: 10 }}>
  577. 收款情况
  578. </h3>
  579. <div style={{ marginLeft: "90px" }}>
  580. <ul>
  581. {(this.props.proceedsData.bill || []).map((item, index) => (
  582. <li key={index}>
  583. {item.payTime +
  584. " " +
  585. item.aName +
  586. " 收款:" +
  587. item.transactionAmount +
  588. "万元"}
  589. </li>
  590. ))}
  591. </ul>
  592. <div>收款总计:{this.props.proceedsTotal}万元</div>
  593. </div>
  594. <br />
  595. <div style={{ marginLeft: "90px" }}>
  596. <ul>
  597. {(this.props.proceedsData.invoice || []).map((item, index) => (
  598. <li key={index}>
  599. {item.createTime + " " + " 开票:" + item.amount + "万元"}
  600. </li>
  601. ))}
  602. </ul>
  603. <div>开票总计:{this.props.invoiceTotal}万元</div>
  604. </div>
  605. <p style={{ marginLeft: "90px", color: "red" }}>
  606. 系统预估 产生成本(万元):
  607. {this.props.data.estimateCost
  608. ? this.props.data.estimateCost
  609. : "0"}{" "}
  610. &nbsp;应退金额(万元):
  611. {this.props.data.estimateRefundable
  612. ? this.props.data.estimateRefundable
  613. : "0"}
  614. </p>
  615. </div>
  616. {/* 当前财务状态 */}
  617. <div
  618. style={{
  619. display: this.props.data.processState > 5 ? "block" : "none",
  620. }}
  621. >
  622. <h3 style={{ marginLeft: 20, fontWeight: 800, marginBottom: 10 }}>
  623. 当前财务状态(财务填写)
  624. </h3>
  625. {financeData.map((item, index) => {
  626. return <Itemlist orderUid={this.props.orderUid} key={index} pageData={item} />;
  627. })}
  628. </div>
  629. {/* 回收退票 */}
  630. <div
  631. style={{
  632. display:
  633. (this.props.data.processState == 8 ||
  634. this.props.data.processState == 7) &&
  635. (this.props.data.status == 2 || this.props.data.status == 4 || this.props.data.status == 3 || this.props.data.status == 6)
  636. ? "block"
  637. : "none",
  638. }}
  639. >
  640. <h3 style={{ marginLeft: 20, fontWeight: 800, marginBottom: 10 }}>
  641. 回收退票
  642. </h3>
  643. <Table
  644. size="middle"
  645. pagination={false}
  646. bordered
  647. columns={this.state.ContactsLists}
  648. dataSource={this.state.contactList}
  649. />
  650. </div>
  651. {/* 完成审核,上传附件 */}
  652. <div style={{
  653. position: "relative",
  654. display:
  655. (this.props.data.processState == 7 ||
  656. this.props.data.processState == 8) &&
  657. this.props.data.status == 2 || this.props.data.status == 4 || this.props.data.status == 3 || this.props.data.status == 6
  658. ? "block"
  659. : "none",
  660. marginTop: 10,
  661. }}
  662. >
  663. <hr
  664. style={{
  665. marginTop: 12,
  666. marginBottom: 10,
  667. backgroundColor: "black",
  668. height: 1,
  669. border: "none",
  670. }}
  671. />
  672. <h3
  673. style={{
  674. marginLeft: 20,
  675. fontWeight: 800,
  676. marginBottom: 10,
  677. display: "inline-block",
  678. }}
  679. >
  680. 完成审核,上传附件{" "}
  681. <span
  682. style={{ fontSize: 12, fontWeight: "normal", color: "red" }}
  683. >
  684. (注:由营销员上传变更后附件,全变更流程完成。)
  685. </span>
  686. </h3>
  687. <div>
  688. <Form.Item
  689. label="变更附件"
  690. labelCol={{ span: 4 }}
  691. wrapperCol={{ span: 18 }}
  692. >
  693. <div style={{paddingTop:'10px',paddingBottom:'10px'}}>
  694. { attachment.length > 0 ? <ImgList domId={this.props.domId+2 ? this.props.domId+2 : 'changeDetailyxgly1'} fileList={attachment} ItemWidth={'96px'}/> :'无附件'}
  695. </div>
  696. <Modal
  697. maskClosable={false}
  698. footer={null}
  699. width={"50%"}
  700. visible={this.state.previewVisible}
  701. onCancel={() => {
  702. this.setState({ previewVisible: false, rotateDeg: 0 }, () => {
  703. // this.reset();
  704. });
  705. }}
  706. >
  707. <img
  708. alt=""
  709. style={{
  710. width: "100%",
  711. transform: `rotate(${this.state.rotateDeg}deg)`,
  712. }}
  713. src={this.state.previewImage || ""}
  714. />
  715. <Button
  716. onClick={this.rotate}
  717. style={{
  718. position: "relative",
  719. left: "50%",
  720. transform: "translateX(-50%)",
  721. }}
  722. >
  723. 旋转
  724. </Button>
  725. <Button
  726. onClick={this.upImg}
  727. style={{
  728. position: "absolute",
  729. left: -81,
  730. top: "50%",
  731. transform: "translateY(-50%)",
  732. }}
  733. >
  734. 上一张
  735. </Button>
  736. <Button
  737. onClick={this.downImg}
  738. style={{
  739. position: "absolute",
  740. right: -81,
  741. top: "50%",
  742. transform: "translateY(-50%)",
  743. }}
  744. >
  745. 下一张
  746. </Button>
  747. </Modal>
  748. {/* <Rizhi changeId={this.props.id} /> */}
  749. </Form.Item>
  750. </div>
  751. </div>
  752. {/* {this.props.data.type === 0 && this.props.data.processState >= 2 ? (
  753. <div>
  754. <h3 style={{ marginLeft: 10, fontWeight: 800, marginBottom: 10 }}>
  755. 当前项目进度(咨询师经理填写)
  756. </h3>
  757. {planData.map((item, index) => {
  758. return <Itemlist key={index} pageData={item} />;
  759. })}
  760. </div>
  761. ) : (
  762. ""
  763. )}
  764. {this.props.data.type === 0 ? (
  765. this.props.data.processState >= 5 ? (
  766. <div>
  767. <h3
  768. style={{ marginLeft: 10, fontWeight: 800, marginBottom: 10 }}
  769. >
  770. 当前财务状态(财务填写)
  771. </h3>
  772. {financeData.map((item, index) => {
  773. return <Itemlist key={index} pageData={item} />;
  774. })}
  775. </div>
  776. ) : (
  777. ""
  778. )
  779. ) : this.props.data.status === 4 ? (
  780. <div>
  781. <h3 style={{ marginLeft: 10, fontWeight: 800, marginBottom: 10 }}>
  782. 当前财务状态(财务填写)
  783. </h3>
  784. {financeData.map((item, index) => {
  785. return <Itemlist key={index} pageData={item} />;
  786. })}
  787. </div>
  788. ) : (
  789. ""
  790. )} */}
  791. <div
  792. style={{
  793. display:
  794. (this.props.data.processState == 7 ||
  795. this.props.data.processState == 8) &&
  796. this.props.data.status == 4 &&
  797. this.props.data.refundStatus
  798. ? "block"
  799. : "none",
  800. }}
  801. >
  802. <Refund data={this.props.data} id={this.props.id} />
  803. </div>
  804. </div>
  805. {this.props.processState === this.props.data.processState ? (
  806. 1 ? (
  807. <div>
  808. <div className="clearfix">
  809. <FormItem
  810. style={{ height: "auto" }}
  811. labelCol={{ span: 4 }}
  812. wrapperCol={{ span: 18 }}
  813. label="备注"
  814. >
  815. <TextArea
  816. rows={4}
  817. placeholder="请输入备注信息"
  818. style={{ width: "95%" }}
  819. value={this.state.reason}
  820. onChange={(e) => {
  821. let reason = e.target.value;
  822. this.setState({ reason });
  823. }}
  824. />
  825. </FormItem>
  826. </div>
  827. <div
  828. className="clearfix"
  829. style={{ display: "flex", justifyContent: "space-around" }}
  830. >
  831. {buttonData.map((item, index) => {
  832. return (
  833. <AgreeButton
  834. data={item}
  835. key={index}
  836. backData={this.props.data}
  837. processState={this.props.processState}
  838. visible={this.changeButtonStatus}
  839. loadData={this.props.loadData}
  840. reason={this.state.reason}
  841. ajaxData={this.state}
  842. rejectState={this.state.rejectState}
  843. onCancel={this.props.onCancel}
  844. />
  845. );
  846. })}
  847. </div>
  848. </div>
  849. ) : (
  850. ""
  851. )
  852. ) : (
  853. ""
  854. )}
  855. {/* <ReactToPrint
  856. trigger={() => (
  857. <div className="clearfix">
  858. <Button type="primary" style={{ float: "right", marginTop: 10 }}>
  859. 打印
  860. </Button>
  861. </div>
  862. )}
  863. content={() => this.refs}
  864. /> */}
  865. {/* <OrderCoor
  866. orderNo={this.props.orderNo}
  867. /> */}
  868. <ReactToPrint
  869. trigger={() => (
  870. <Button
  871. type="primary"
  872. style={{
  873. float: "right",
  874. marginTop: 10,
  875. position: "absolute",
  876. top: 0,
  877. right: 30,
  878. }}
  879. >
  880. 打印
  881. </Button>
  882. )}
  883. content={() => this.refs}
  884. />
  885. </div>
  886. );
  887. }
  888. }
  889. export { ChangeDetail, changeType, getChangeType };