changeDetailCwzj.js 30 KB

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