changeDetailJszj.js 27 KB

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