orderDetail.jsx 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996
  1. import React from 'react';
  2. import $ from 'jquery/src/ajax';
  3. import {
  4. Modal,
  5. message,
  6. Spin,
  7. Upload,
  8. Button,
  9. Form,
  10. Table,
  11. Col
  12. } from 'antd';
  13. import {
  14. getjiedian,
  15. splitUrl,
  16. getNewOrderType,
  17. getProcessStatus,
  18. getApproval,
  19. getLiquidationStatus,
  20. getProjectStatus,
  21. getCuikuan
  22. } from "@/tools";
  23. import OrderRiZi from "@/orderRiZi.jsx";
  24. const OrderDetail = Form.create()(
  25. React.createClass({
  26. loadXmu(record) {
  27. this.state.data = [];
  28. this.setState({
  29. loading: true
  30. });
  31. $.ajax({
  32. method: "get",
  33. dataType: "json",
  34. crossDomain: false,
  35. url: globalConfig.context + "/api/admin/newOrder/getOrderTask",
  36. data: {
  37. orderNo: record ? record.orderNo : this.props.data.orderNo
  38. },
  39. success: function(data) {
  40. let theArr = [];
  41. if (!data.data) {
  42. if (data.error && data.error.length) {
  43. message.warning(data.error[0].message);
  44. }
  45. } else {
  46. for (let i = 0; i < data.data.length; i++) {
  47. let thisdata = data.data[i];
  48. theArr.push({
  49. key: i,
  50. id: thisdata.id,
  51. orderNo: thisdata.orderNo,
  52. commodityName: thisdata.commodityName,
  53. commodityPrice: thisdata.commodityPrice,
  54. commodityQuantity: thisdata.commodityQuantity,
  55. taskStatus: thisdata.taskStatus,
  56. taskComment: thisdata.taskComment,
  57. main: thisdata.main,
  58. contacts: thisdata.contacts,
  59. contactsMobile: thisdata.contactsMobile,
  60. cname: thisdata.cname,
  61. certificateNumber: thisdata.certificateNumber,
  62. projectStatus: thisdata.projectStatus,
  63. sort: thisdata.cSort
  64. });
  65. }
  66. }
  67. this.setState({
  68. dataSource: theArr,
  69. pagination: false
  70. });
  71. }.bind(this)
  72. }).always(
  73. function() {
  74. this.setState({
  75. loading: false
  76. });
  77. }.bind(this)
  78. );
  79. },
  80. getInitialState() {
  81. return {
  82. rotateDeg: 0,
  83. visible: false,
  84. avisible: false,
  85. loading: false,
  86. jsDate: [],
  87. auditStatus: 0,
  88. textFileList: [],
  89. videoFileList: [],
  90. pictureUrl: [],
  91. pictureUrlMin: [],
  92. columns: [
  93. {
  94. title: "业务项目名称",
  95. dataIndex: "commodityName",
  96. key: "commodityName",
  97. render: text => {
  98. return text && text.length > 6 ? (
  99. <span title={text}>{text.substr(0, 8)}...</span>
  100. ) : (
  101. text
  102. );
  103. }
  104. },
  105. {
  106. title: "项目类别",
  107. dataIndex: "cname",
  108. key: "cname"
  109. },
  110. {
  111. title: "项目数量(个)",
  112. dataIndex: "commodityQuantity",
  113. key: "commodityQuantity"
  114. },
  115. {
  116. title: "服务市价(万元)",
  117. dataIndex: "commodityPrice",
  118. key: "commodityPrice"
  119. },
  120. {
  121. title: "项目状态",
  122. dataIndex: "projectStatus",
  123. key: "projectStatus",
  124. render: text => {
  125. return getProjectStatus(text);
  126. }
  127. },
  128. {
  129. title: "证书编号",
  130. dataIndex: "certificateNumber",
  131. key: "certificateNumber"
  132. },
  133. {
  134. title: "是否主要项目",
  135. dataIndex: "main",
  136. key: "main",
  137. render: text => {
  138. return text ? "是" : "否";
  139. }
  140. },
  141. {
  142. title: "项目说明",
  143. dataIndex: "taskComment",
  144. key: "taskComment",
  145. render: text => {
  146. return text && text.length > 8 ? (
  147. <span title={text}>{text.substr(0, 8)}...</span>
  148. ) : (
  149. text
  150. );
  151. }
  152. }
  153. ],
  154. columnsX: [
  155. {
  156. title: "流程",
  157. dataIndex: "processName",
  158. key: "processName"
  159. },
  160. {
  161. title: "操作人",
  162. dataIndex: "adminName",
  163. key: "adminName"
  164. },
  165. {
  166. title: "时间",
  167. dataIndex: "createDate",
  168. key: "createDate"
  169. }
  170. ],
  171. ContactsListsNew: [
  172. {
  173. title: "项目名称",
  174. dataIndex: "commodityName",
  175. key: "commodityName",
  176. render: text => {
  177. return <span>{text}</span>;
  178. }
  179. },
  180. {
  181. title: "项目分类",
  182. dataIndex: "projectType",
  183. key: "projectType",
  184. render: text => {
  185. let arr = this.state.dataSource || [];
  186. let str = "";
  187. for (let i = 0; i < arr.length; i++) {
  188. if (this.state.dataSource[i].sort == text) {
  189. str = this.state.dataSource[i].cname;
  190. return <span>{str}</span>;
  191. }
  192. }
  193. }
  194. },
  195. {
  196. title: "催款科目",
  197. dataIndex: "dunTypeName",
  198. key: "dunTypeName",
  199. render: text => {
  200. return <span>{text}</span>;
  201. }
  202. },
  203. {
  204. title: "时间",
  205. dataIndex: "waitDay",
  206. key: "waitDay",
  207. render: (text, record) => {
  208. if (record.dunTypeName) {
  209. return <span>{text}</span>;
  210. }
  211. }
  212. },
  213. {
  214. title: "金额(万元)",
  215. dataIndex: "money",
  216. key: "money",
  217. render: (text, record) => {
  218. if (record.dunTypeName) {
  219. if (record.appropriationRatio && !record.money) {
  220. return <span>{record.appropriationRatio}(拨款比例)</span>;
  221. } else if (record.appropriationRatio && record.money) {
  222. return (
  223. <span>
  224. {text}(比例:{record.appropriationRatio})
  225. </span>
  226. );
  227. } else {
  228. return <span>{text}</span>;
  229. }
  230. }
  231. }
  232. },
  233. {
  234. title: "服务年限",
  235. dataIndex: "startDate",
  236. key: "startDate",
  237. render: (text, record) => {
  238. if (record.dunTypeName) {
  239. return <span>{text}</span>;
  240. }
  241. }
  242. },
  243. {
  244. title: "催款状态",
  245. dataIndex: "status",
  246. key: "status",
  247. render: text => {
  248. return <span>{text == 1 ? "已启动" : "未启动"}</span>;
  249. }
  250. }
  251. ],
  252. ContactsLists: [
  253. {
  254. title: "催款科目",
  255. dataIndex: "dunSubject",
  256. key: "dunSubject",
  257. render: text => {
  258. return getjiedian(text);
  259. }
  260. },
  261. {
  262. title: "金额(万元)",
  263. dataIndex: "money",
  264. key: "money"
  265. },
  266. {
  267. title: "催款状态",
  268. dataIndex: "dunStatus",
  269. key: "dunStatus",
  270. render: text => {
  271. return getCuikuan(text);
  272. }
  273. }
  274. ]
  275. };
  276. },
  277. loadData(record) {
  278. this.state.orderList = [];
  279. $.ajax({
  280. method: "get",
  281. dataType: "json",
  282. crossDomain: false,
  283. url: globalConfig.context + "/api/admin/newOrder/getOrderNewDetail",
  284. data: {
  285. orderNo: record ? record.orderNo : this.props.data.orderNo
  286. },
  287. success: function(data) {
  288. let thisData = data.data;
  289. if (!thisData) {
  290. if (data.error && data.error.length) {
  291. message.warning(data.error[0].message);
  292. }
  293. thisData = {};
  294. }
  295. this.setState({
  296. id: thisData.id,
  297. orderList: thisData,
  298. approval:
  299. thisData.approval == 0
  300. ? thisData.approval.toString()
  301. : thisData.approval,
  302. orderRemarks: thisData.orderRemarks,
  303. orgCodeUrl: thisData.contractPictureUrl
  304. ? splitUrl(
  305. thisData.contractPictureUrl,
  306. ",",
  307. globalConfig.avatarHost + "/upload"
  308. )
  309. : [],
  310. orderNo: thisData.orderNo, //订单编号
  311. buyerId: thisData.buyerId,
  312. depName: thisData.depName,
  313. outsource: thisData.outsource == 0 ? "否" : "是"
  314. });
  315. }.bind(this)
  316. }).always(
  317. function() {
  318. this.setState({
  319. loading: false
  320. });
  321. }.bind(this)
  322. );
  323. },
  324. jdDate(record) {
  325. $.ajax({
  326. method: "get",
  327. dataType: "json",
  328. crossDomain: false,
  329. url: globalConfig.context + "/api/admin/newOrder/selectOrderDun",
  330. data: {
  331. orderNo: record ? record.orderNo : this.props.data.orderNo
  332. },
  333. success: function(data) {
  334. let thisData = data.data;
  335. if (!thisData.length) {
  336. if (data.error && data.error.length) {
  337. message.warning(data.error[0].message);
  338. }
  339. thisData = {};
  340. } else {
  341. this.setState({
  342. jsDate: thisData
  343. });
  344. }
  345. }.bind(this)
  346. }).always(
  347. function() {
  348. this.setState({
  349. loading: false
  350. });
  351. }.bind(this)
  352. );
  353. },
  354. rizhi() {
  355. this.setState({
  356. loading: true
  357. });
  358. $.ajax({
  359. method: "get",
  360. dataType: "json",
  361. crossDomain: false,
  362. url: "/api/admin/newOrder/selectOrderLog",
  363. data: {
  364. orderNo: this.props.data.orderNo
  365. },
  366. success: function(data) {
  367. let theArr = [];
  368. let thisData = data.data;
  369. if (!thisData.length) {
  370. if (data.error && data.error.length) {
  371. message.warning(data.error[0].message);
  372. }
  373. thisData = {};
  374. } else {
  375. for (let i = 0; i < data.data.length; i++) {
  376. let thisdata = data.data[i];
  377. theArr.push({
  378. processName: thisdata.processName,
  379. adminName: thisdata.adminName,
  380. createDate: thisdata.createDate,
  381. remarks: thisdata.remarks
  382. });
  383. }
  384. }
  385. this.setState({
  386. dataSourceX: theArr
  387. });
  388. }.bind(this)
  389. }).always(
  390. function() {
  391. this.setState({
  392. loading: false
  393. });
  394. }.bind(this)
  395. );
  396. },
  397. getOrderLog() {
  398. this.setState({
  399. avisible: true
  400. });
  401. this.rizhi();
  402. },
  403. closeOrderLog() {
  404. this.setState({
  405. avisible: false
  406. });
  407. },
  408. getPictureUrl(e) {
  409. this.setState({ pictureUrl: e });
  410. },
  411. componentWillMount() {
  412. if (this.props.data.orderNo) {
  413. this.loadData();
  414. this.loadXmu();
  415. this.jdDate();
  416. this.jiedian(this.props.data.orderNo);
  417. this.jiedianNew(this.props.data.orderNo);
  418. } else {
  419. this.state.data = {};
  420. }
  421. },
  422. componentWillReceiveProps(nextProps) {
  423. if (!this.props.visible && nextProps.visible) {
  424. this.state.textFileList = [];
  425. this.state.videoFileList = [];
  426. if (nextProps.data.orderNo) {
  427. this.loadData(nextProps.data);
  428. this.loadXmu(nextProps.data);
  429. this.jdDate(nextProps.data);
  430. this.jiedian(nextProps.data.orderNo);
  431. this.jiedianNew(nextProps.data.orderNo);
  432. } else {
  433. this.state.data = {};
  434. this.state.pictureUrl = [];
  435. this.state.pictureUrlMin = [];
  436. }
  437. this.props.form.resetFields();
  438. }
  439. },
  440. downImg() {
  441. let num = 0;
  442. for (let i = 0; i < this.state.orgCodeUrl.length; i++) {
  443. if (this.state.orgCodeUrl[i].url == this.state.previewImage) {
  444. num = i;
  445. }
  446. }
  447. if (num == this.state.orgCodeUrl.length - 1) {
  448. return message.warning("已经是最后一张了哦");
  449. }
  450. this.state.previewImage = this.state.orgCodeUrl[num + 1].url;
  451. this.setState({
  452. previewImage: this.state.previewImage,
  453. rotateDeg: 0
  454. });
  455. },
  456. upImg() {
  457. let num = 0;
  458. for (let i = 0; i < this.state.orgCodeUrl.length; i++) {
  459. if (this.state.orgCodeUrl[i].url == this.state.previewImage) {
  460. num = i;
  461. }
  462. }
  463. if (num == 0) {
  464. return message.warning("已经是第一张了哦");
  465. }
  466. this.state.previewImage = this.state.orgCodeUrl[num - 1].url;
  467. this.setState({
  468. previewImage: this.state.previewImage,
  469. rotateDeg: 0
  470. });
  471. },
  472. rotate() {
  473. let rotateDeg = this.state.rotateDeg + 90;
  474. this.setState({
  475. rotateDeg
  476. });
  477. },
  478. //节点列表
  479. jiedian(orderNos) {
  480. $.ajax({
  481. method: "get",
  482. dataType: "json",
  483. crossDomain: false,
  484. url: globalConfig.context + "/api/admin/newOrder/selectOrderDun",
  485. data: {
  486. orderNo: orderNos
  487. },
  488. success: function(data) {
  489. let theArr = [];
  490. let thisData = [];
  491. if (data.error.length || data.data.list == "") {
  492. if (data.error && data.error.length) {
  493. message.warning(data.error[0].message);
  494. }
  495. } else {
  496. for (let i = 0; i < data.data.length; i++) {
  497. thisData = data.data[i];
  498. theArr.push({
  499. key: i,
  500. dunSubject: thisData.dunSubject
  501. ? thisData.dunSubject.toString()
  502. : "", //催款科目
  503. id: thisData.id, //节点Id
  504. money: thisData.money, //催款金额
  505. dunStatus: thisData.dunStatus, //催款状态
  506. orderNo: thisData.orderNo
  507. });
  508. }
  509. this.setState({
  510. contactList: theArr
  511. });
  512. }
  513. }.bind(this)
  514. }).always(
  515. function() {
  516. this.setState({
  517. loading: false
  518. });
  519. }.bind(this)
  520. );
  521. },
  522. //查看催款节点
  523. jiedianNew(orderNos) {
  524. $.ajax({
  525. method: "get",
  526. dataType: "json",
  527. crossDomain: false,
  528. url:
  529. globalConfig.context + "/api/admin/newOrderDun/selectListNewOrderDun",
  530. data: {
  531. orderNo: orderNos
  532. },
  533. success: function(data) {
  534. let theArr = [];
  535. let thisData = [];
  536. if (!thisData) {
  537. if (data.error && data.error.length) {
  538. message.warning(data.error[0].message);
  539. }
  540. thisData = {};
  541. } else {
  542. for (let i = 0; i < data.data.length; i++) {
  543. thisData = data.data[i];
  544. theArr.push({
  545. key: i,
  546. dunSubject: thisData.dunSubject
  547. ? thisData.dunSubject.toString()
  548. : "", //催款科目
  549. id: thisData.id, //节点Id
  550. money: thisData.money, //催款金额
  551. // orderNo: record ? record.orderNo : this.props.datauser.orderNo,
  552. commodityName: thisData.commodityName,
  553. projectType: thisData.projectType,
  554. dunTypeName: thisData.dunTypeName,
  555. status: thisData.status,
  556. waitDay: thisData.waitDay,
  557. effectiveCount: thisData.effectiveCount,
  558. startDate: thisData.startDate,
  559. appropriationRatio: thisData.appropriationRatio
  560. });
  561. }
  562. this.setState({
  563. contactListNew: theArr
  564. });
  565. }
  566. }.bind(this)
  567. }).always(
  568. function() {
  569. this.setState({
  570. loading: false
  571. });
  572. }.bind(this)
  573. );
  574. },
  575. render() {
  576. const theData = this.state.orderList || {};
  577. const FormItem = Form.Item;
  578. const formItemLayout = {
  579. labelCol: { span: 10 },
  580. wrapperCol: { span: 12 }
  581. };
  582. const jsDate = this.state.jsDate || [];
  583. const cuiDataList = this.state.contactList || [];
  584. return (
  585. <div className="login">
  586. <Form layout="horizontal" id="demand-form">
  587. <Spin spinning={this.state.loading}>
  588. <div className="clearfix">
  589. <FormItem
  590. className="half-item"
  591. {...formItemLayout}
  592. label="订单编号"
  593. >
  594. <span>{theData.orderNo}</span>
  595. </FormItem>
  596. <FormItem
  597. className="half-item"
  598. {...formItemLayout}
  599. label="签单时间"
  600. >
  601. <span>{theData.signDate}</span>
  602. </FormItem>
  603. <FormItem
  604. className="half-item"
  605. {...formItemLayout}
  606. label="客户名称"
  607. >
  608. <span>{theData.userName}</span>
  609. </FormItem>
  610. <FormItem
  611. className="half-item"
  612. {...formItemLayout}
  613. label="流转状态"
  614. >
  615. <span>{getProcessStatus(theData.processStatus)}</span>
  616. </FormItem>
  617. <FormItem
  618. className="half-item"
  619. {...formItemLayout}
  620. label="订单类型"
  621. >
  622. <span>{getNewOrderType(theData.orderType)}</span>
  623. </FormItem>
  624. <FormItem
  625. className="half-item"
  626. {...formItemLayout}
  627. label="结算状态"
  628. >
  629. <span>{getLiquidationStatus(theData.liquidationStatus)}</span>
  630. </FormItem>
  631. <FormItem
  632. className="half-item"
  633. {...formItemLayout}
  634. label="签单总金额(万元)"
  635. >
  636. <span>{theData.totalAmount}</span>
  637. </FormItem>
  638. <FormItem
  639. className="half-item"
  640. {...formItemLayout}
  641. label="首付款(万元)"
  642. >
  643. <span>{theData.firstAmount}</span>
  644. </FormItem>
  645. <FormItem
  646. className="half-item"
  647. {...formItemLayout}
  648. label="已收款(万元)"
  649. >
  650. <span>{theData.settlementAmount}</span>
  651. </FormItem>
  652. <FormItem
  653. className="half-item"
  654. {...formItemLayout}
  655. label="是否特批"
  656. >
  657. <span>{getApproval(theData.approval)}</span>
  658. </FormItem>
  659. <FormItem
  660. className="half-item"
  661. {...formItemLayout}
  662. label="是否外包"
  663. >
  664. <span>{this.state.outsource}</span>
  665. </FormItem>
  666. {this.props.data.orderStatus == "6" && (
  667. <FormItem
  668. className="half-item"
  669. {...formItemLayout}
  670. label="已退(万元)"
  671. >
  672. <span>{this.props.data.refundAmount}</span>
  673. </FormItem>
  674. )}
  675. </div>
  676. <div className="clearfix">
  677. <FormItem
  678. labelCol={{ span: 5 }}
  679. wrapperCol={{ span: 18 }}
  680. label="合同扫描件"
  681. >
  682. <Upload
  683. className="demandDetailShow-upload"
  684. listType="picture-card"
  685. fileList={this.state.orgCodeUrl}
  686. onPreview={file => {
  687. this.setState({
  688. previewImage: file.url || file.thumbUrl,
  689. previewVisible: true
  690. });
  691. }}
  692. ></Upload>
  693. <Modal
  694. maskClosable={false}
  695. footer={null}
  696. visible={this.state.previewVisible}
  697. onCancel={() => {
  698. this.setState({ previewVisible: false, rotateDeg: 0 });
  699. }}
  700. >
  701. <div
  702. onClick={this.upImg}
  703. className="up-btn"
  704. style={{
  705. cursor: "pointer",
  706. transition: "all .5s",
  707. opacity: ".2",
  708. width: "41px",
  709. height: "69px",
  710. backgroundColor: "rgba(0,0,0,.5)",
  711. position: "absolute",
  712. top: "50%",
  713. left: 16,
  714. transform: "translateY(-50%)",
  715. zIndex: 1
  716. }}
  717. >
  718. <span
  719. style={{
  720. position: "absolute",
  721. border: "1px solid #fff",
  722. width: "20px",
  723. height: "20px",
  724. left: "60%",
  725. top: "50%",
  726. transform: "translate(-50%, -50%) rotate(45deg)",
  727. borderTop: "none",
  728. borderRight: "none"
  729. }}
  730. ></span>
  731. </div>
  732. <div
  733. onClick={this.rotate}
  734. style={{
  735. textAlign: "center",
  736. lineHeight: "30px",
  737. color: "#000",
  738. cursor: "pointer",
  739. transition: "all .5s",
  740. width: "50px",
  741. height: "30px",
  742. backgroundColor: "white",
  743. position: "absolute",
  744. bottom: "-30",
  745. left: "50%",
  746. transform: "translateX(-50%)",
  747. zIndex: 1,
  748. borderRadius: "5px",
  749. border: "1px solid #ccc"
  750. }}
  751. >
  752. 旋转
  753. </div>
  754. <div
  755. onClick={this.downImg}
  756. className="up-btn"
  757. style={{
  758. cursor: "pointer",
  759. transition: "all .5s",
  760. opacity: ".2",
  761. width: "41px",
  762. height: "69px",
  763. backgroundColor: "rgba(0,0,0,.5)",
  764. position: "absolute",
  765. top: "50%",
  766. right: 16,
  767. transform: "translateY(-50%)",
  768. zIndex: 1
  769. }}
  770. >
  771. <span
  772. style={{
  773. position: "absolute",
  774. border: "1px solid #fff",
  775. width: "20px",
  776. height: "20px",
  777. left: "40%",
  778. top: "50%",
  779. transform: "translate(-50%, -50%) rotate(225deg)",
  780. borderTop: "none",
  781. borderRight: "none"
  782. }}
  783. ></span>
  784. </div>
  785. <img
  786. alt=""
  787. style={{
  788. width: "100%",
  789. transform: `rotate(${this.state.rotateDeg}deg)`
  790. }}
  791. src={this.state.previewImage || ""}
  792. />
  793. </Modal>
  794. <Button
  795. style={{
  796. float: "right",
  797. marginRight: "140px",
  798. marginTop: "20px"
  799. }}
  800. onClick={this.getOrderLog}
  801. >
  802. 查看订单日志
  803. </Button>
  804. </FormItem>
  805. </div>
  806. <div className="clearfix">
  807. <FormItem
  808. className="half-item"
  809. {...formItemLayout}
  810. label="合同编号"
  811. >
  812. <span>{theData.contractNo}</span>
  813. </FormItem>
  814. <FormItem
  815. className="half-item"
  816. {...formItemLayout}
  817. label="订单部门"
  818. >
  819. <span>{theData.depName}</span>
  820. </FormItem>
  821. </div>
  822. <div className="clearfix">
  823. <FormItem
  824. labelCol={{ span: 5 }}
  825. wrapperCol={{ span: 18 }}
  826. label="订单留言"
  827. >
  828. <p style={{ maxWidth: 500, wordWrap: "break-word" }}>
  829. {this.state.orderRemarks}
  830. </p>
  831. </FormItem>
  832. </div>
  833. {/* <div className="clearfix">
  834. <FormItem
  835. labelCol={{ span: 5 }}
  836. wrapperCol={{ span: 18 }}
  837. label="收款节点"
  838. >
  839. {jsDate.map(item => {
  840. return (
  841. <p>
  842. {getjiedian(item.dunSubject)} -- {item.money} 万元
  843. </p>
  844. );
  845. })}
  846. </FormItem>
  847. </div> */}
  848. <div className="clearfix">
  849. <FormItem
  850. className="half-item"
  851. {...formItemLayout}
  852. label="订单负责人"
  853. >
  854. <span>{theData.salesmanName}</span>
  855. </FormItem>
  856. <FormItem
  857. className="half-item"
  858. {...formItemLayout}
  859. label="订单负责人电话"
  860. >
  861. <span>{theData.salesmanMobile}</span>
  862. </FormItem>
  863. <FormItem
  864. className="half-item"
  865. {...formItemLayout}
  866. label="当前财务负责人"
  867. >
  868. <span>{theData.nowFinance}</span>
  869. </FormItem>
  870. <FormItem
  871. className="half-item"
  872. {...formItemLayout}
  873. label="当前财务负责人电话"
  874. >
  875. <span>{theData.nowFinanceMobile}</span>
  876. </FormItem>
  877. <FormItem
  878. className="half-item"
  879. {...formItemLayout}
  880. style={{ opacity: ".5" }}
  881. label="原订单负责人"
  882. >
  883. <span>{theData.oldSalesmanName}</span>
  884. </FormItem>
  885. <FormItem
  886. className="half-item"
  887. {...formItemLayout}
  888. style={{ opacity: ".5" }}
  889. label="原订单负责人电话"
  890. >
  891. <span>{theData.oldSalesmanMobile}</span>
  892. </FormItem>
  893. <FormItem
  894. className="half-item"
  895. {...formItemLayout}
  896. style={{ opacity: ".5" }}
  897. label="实际财务操作人"
  898. >
  899. <span>{theData.financeName}</span>
  900. </FormItem>
  901. <FormItem
  902. className="half-item"
  903. {...formItemLayout}
  904. style={{ opacity: ".5" }}
  905. label="实际财务操作人电话"
  906. >
  907. <span>{theData.financeMobile}</span>
  908. </FormItem>
  909. </div>
  910. {/* <Modal
  911. visible={this.state.avisible}
  912. className="admin-desc-content"
  913. width="800px"
  914. maskClosable={false}
  915. title="订单日志"
  916. footer={null}
  917. onCancel={this.closeOrderLog}
  918. >
  919. <div className="patent-table">
  920. <Spin spinning={this.state.loading}>
  921. <Table
  922. columns={this.state.columnsX}
  923. dataSource={this.state.dataSourceX}
  924. pagination={false}
  925. />
  926. </Spin>
  927. </div>
  928. </Modal> */}
  929. <OrderRiZi
  930. dataSourcerizhi={this.state.dataSourceX}
  931. closeOrderLog={this.closeOrderLog}
  932. visible={this.state.avisible}
  933. loading={this.state.loading}
  934. />
  935. <div className="clearfix" style={{ marginBottom: 10 }}>
  936. <p style={{ fontSize: 18, marginLeft: 20 }}>项目业务</p>
  937. <div className="patent-table">
  938. <Spin spinning={this.state.loading}>
  939. <Table
  940. columns={this.state.columns}
  941. dataSource={this.state.dataSource}
  942. pagination={this.state.pagination}
  943. onRowClick={this.tableRowClick}
  944. bordered
  945. size="small"
  946. />
  947. </Spin>
  948. </div>
  949. </div>
  950. <div>
  951. <span style={{ marginLeft: 20, fontSize: "18px", }}>
  952. 催款节点
  953. </span>
  954. </div>
  955. <div className="clearfix">
  956. <Spin spinning={this.state.loading}>
  957. <Form layout="horizontal" id="demand-form">
  958. <Table
  959. pagination={false}
  960. bordered
  961. size="small"
  962. columns={
  963. cuiDataList.length
  964. ? this.state.ContactsLists
  965. : this.state.ContactsListsNew
  966. }
  967. dataSource={
  968. cuiDataList.length
  969. ? this.state.contactList
  970. : this.state.contactListNew
  971. }
  972. />
  973. <Col
  974. span={24}
  975. offset={9}
  976. style={{ marginTop: "15px" }}
  977. ></Col>
  978. </Form>
  979. </Spin>
  980. </div>
  981. </Spin>
  982. </Form>
  983. </div>
  984. );
  985. }
  986. })
  987. );
  988. export default OrderDetail;