changeDetailCwzj.js 32 KB

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