changeDetailYxy.js 30 KB

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