orderDetail.jsx 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011
  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. if (data.error && data.error.length) {
  535. message.warning(data.error[0].message);
  536. } else {
  537. let theArr = [];
  538. let thisData = [];
  539. let arr = data.data || [];
  540. let totalCui = 0;
  541. for (let i = 0; i < arr.length; i++) {
  542. thisData = arr[i];
  543. totalCui += +thisData.money;
  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. dunType: thisData.dunType,
  560. appropriationRatio: thisData.appropriationRatio
  561. });
  562. }
  563. if (!totalCui) {
  564. totalCui = 0;
  565. }
  566. totalCui = (Math.round(totalCui * 10000) / 10000).toFixed(4);
  567. this.setState({
  568. contactListNew: theArr,
  569. totalCui
  570. });
  571. }
  572. }.bind(this)
  573. }).always(
  574. function() {
  575. this.setState({
  576. loading: false
  577. });
  578. }.bind(this)
  579. );
  580. },
  581. render() {
  582. const theData = this.state.orderList || {};
  583. const FormItem = Form.Item;
  584. const formItemLayout = {
  585. labelCol: { span: 10 },
  586. wrapperCol: { span: 12 }
  587. };
  588. const jsDate = this.state.jsDate || [];
  589. const cuiDataList = this.state.contactList || [];
  590. return (
  591. <div className="login">
  592. <Form layout="horizontal" id="demand-form">
  593. <Spin spinning={this.state.loading}>
  594. <div className="clearfix">
  595. <FormItem
  596. className="half-item"
  597. {...formItemLayout}
  598. label="订单编号"
  599. >
  600. <span>{theData.orderNo}</span>
  601. </FormItem>
  602. <FormItem
  603. className="half-item"
  604. {...formItemLayout}
  605. label="签单时间"
  606. >
  607. <span>{theData.signDate}</span>
  608. </FormItem>
  609. <FormItem
  610. className="half-item"
  611. {...formItemLayout}
  612. label="客户名称"
  613. >
  614. <span>{theData.userName}</span>
  615. </FormItem>
  616. <FormItem
  617. className="half-item"
  618. {...formItemLayout}
  619. label="流转状态"
  620. >
  621. <span>{getProcessStatus(theData.processStatus)}</span>
  622. </FormItem>
  623. <FormItem
  624. className="half-item"
  625. {...formItemLayout}
  626. label="订单类型"
  627. >
  628. <span>{getNewOrderType(theData.orderType)}</span>
  629. </FormItem>
  630. <FormItem
  631. className="half-item"
  632. {...formItemLayout}
  633. label="结算状态"
  634. >
  635. <span>{getLiquidationStatus(theData.liquidationStatus)}</span>
  636. </FormItem>
  637. <FormItem
  638. className="half-item"
  639. {...formItemLayout}
  640. label="签单总金额(万元)"
  641. >
  642. <span>{theData.totalAmount}</span>
  643. </FormItem>
  644. <FormItem
  645. className="half-item"
  646. {...formItemLayout}
  647. label="首付款(万元)"
  648. >
  649. <span>{theData.firstAmount}</span>
  650. </FormItem>
  651. <FormItem
  652. className="half-item"
  653. {...formItemLayout}
  654. label="已收款(万元)"
  655. >
  656. <span>{theData.settlementAmount}</span>
  657. </FormItem>
  658. <FormItem
  659. className="half-item"
  660. {...formItemLayout}
  661. label="是否特批"
  662. >
  663. <span>{getApproval(theData.approval)}</span>
  664. </FormItem>
  665. <FormItem
  666. className="half-item"
  667. {...formItemLayout}
  668. label="是否外包"
  669. >
  670. <span>{this.state.outsource}</span>
  671. </FormItem>
  672. {this.props.data.orderStatus == "6" && (
  673. <FormItem
  674. className="half-item"
  675. {...formItemLayout}
  676. label="已退(万元)"
  677. >
  678. <span>{this.props.data.refundAmount}</span>
  679. </FormItem>
  680. )}
  681. </div>
  682. <div className="clearfix">
  683. <FormItem
  684. labelCol={{ span: 5 }}
  685. wrapperCol={{ span: 18 }}
  686. label="合同扫描件"
  687. >
  688. <Upload
  689. className="demandDetailShow-upload"
  690. listType="picture-card"
  691. fileList={this.state.orgCodeUrl}
  692. onPreview={file => {
  693. this.setState({
  694. previewImage: file.url || file.thumbUrl,
  695. previewVisible: true
  696. });
  697. }}
  698. ></Upload>
  699. <Modal
  700. maskClosable={false}
  701. footer={null}
  702. visible={this.state.previewVisible}
  703. onCancel={() => {
  704. this.setState({ previewVisible: false, rotateDeg: 0 });
  705. }}
  706. >
  707. <div
  708. onClick={this.upImg}
  709. className="up-btn"
  710. style={{
  711. cursor: "pointer",
  712. transition: "all .5s",
  713. opacity: ".2",
  714. width: "41px",
  715. height: "69px",
  716. backgroundColor: "rgba(0,0,0,.5)",
  717. position: "absolute",
  718. top: "50%",
  719. left: 16,
  720. transform: "translateY(-50%)",
  721. zIndex: 1
  722. }}
  723. >
  724. <span
  725. style={{
  726. position: "absolute",
  727. border: "1px solid #fff",
  728. width: "20px",
  729. height: "20px",
  730. left: "60%",
  731. top: "50%",
  732. transform: "translate(-50%, -50%) rotate(45deg)",
  733. borderTop: "none",
  734. borderRight: "none"
  735. }}
  736. ></span>
  737. </div>
  738. <div
  739. onClick={this.rotate}
  740. style={{
  741. textAlign: "center",
  742. lineHeight: "30px",
  743. color: "#000",
  744. cursor: "pointer",
  745. transition: "all .5s",
  746. width: "50px",
  747. height: "30px",
  748. backgroundColor: "white",
  749. position: "absolute",
  750. bottom: "-30",
  751. left: "50%",
  752. transform: "translateX(-50%)",
  753. zIndex: 1,
  754. borderRadius: "5px",
  755. border: "1px solid #ccc"
  756. }}
  757. >
  758. 旋转
  759. </div>
  760. <div
  761. onClick={this.downImg}
  762. className="up-btn"
  763. style={{
  764. cursor: "pointer",
  765. transition: "all .5s",
  766. opacity: ".2",
  767. width: "41px",
  768. height: "69px",
  769. backgroundColor: "rgba(0,0,0,.5)",
  770. position: "absolute",
  771. top: "50%",
  772. right: 16,
  773. transform: "translateY(-50%)",
  774. zIndex: 1
  775. }}
  776. >
  777. <span
  778. style={{
  779. position: "absolute",
  780. border: "1px solid #fff",
  781. width: "20px",
  782. height: "20px",
  783. left: "40%",
  784. top: "50%",
  785. transform: "translate(-50%, -50%) rotate(225deg)",
  786. borderTop: "none",
  787. borderRight: "none"
  788. }}
  789. ></span>
  790. </div>
  791. <img
  792. alt=""
  793. style={{
  794. width: "100%",
  795. transform: `rotate(${this.state.rotateDeg}deg)`
  796. }}
  797. src={this.state.previewImage || ""}
  798. />
  799. </Modal>
  800. <Button
  801. style={{
  802. float: "right",
  803. marginRight: "140px",
  804. marginTop: "20px"
  805. }}
  806. onClick={this.getOrderLog}
  807. >
  808. 查看订单日志
  809. </Button>
  810. </FormItem>
  811. </div>
  812. <div className="clearfix">
  813. <FormItem
  814. className="half-item"
  815. {...formItemLayout}
  816. label="合同编号"
  817. >
  818. <span>{theData.contractNo}</span>
  819. </FormItem>
  820. <FormItem
  821. className="half-item"
  822. {...formItemLayout}
  823. label="订单部门"
  824. >
  825. <span>{theData.depName}</span>
  826. </FormItem>
  827. </div>
  828. <div className="clearfix">
  829. <FormItem
  830. labelCol={{ span: 5 }}
  831. wrapperCol={{ span: 18 }}
  832. label="订单留言"
  833. >
  834. <p style={{ maxWidth: 500, wordWrap: "break-word" }}>
  835. {this.state.orderRemarks}
  836. </p>
  837. </FormItem>
  838. </div>
  839. {/* <div className="clearfix">
  840. <FormItem
  841. labelCol={{ span: 5 }}
  842. wrapperCol={{ span: 18 }}
  843. label="收款节点"
  844. >
  845. {jsDate.map(item => {
  846. return (
  847. <p>
  848. {getjiedian(item.dunSubject)} -- {item.money} 万元
  849. </p>
  850. );
  851. })}
  852. </FormItem>
  853. </div> */}
  854. <div className="clearfix">
  855. <FormItem
  856. className="half-item"
  857. {...formItemLayout}
  858. label="订单负责人"
  859. >
  860. <span>{theData.salesmanName}</span>
  861. </FormItem>
  862. <FormItem
  863. className="half-item"
  864. {...formItemLayout}
  865. label="订单负责人电话"
  866. >
  867. <span>{theData.salesmanMobile}</span>
  868. </FormItem>
  869. <FormItem
  870. className="half-item"
  871. {...formItemLayout}
  872. label="当前财务负责人"
  873. >
  874. <span>{theData.nowFinance}</span>
  875. </FormItem>
  876. <FormItem
  877. className="half-item"
  878. {...formItemLayout}
  879. label="当前财务负责人电话"
  880. >
  881. <span>{theData.nowFinanceMobile}</span>
  882. </FormItem>
  883. <FormItem
  884. className="half-item"
  885. {...formItemLayout}
  886. style={{ opacity: ".5" }}
  887. label="原订单负责人"
  888. >
  889. <span>{theData.oldSalesmanName}</span>
  890. </FormItem>
  891. <FormItem
  892. className="half-item"
  893. {...formItemLayout}
  894. style={{ opacity: ".5" }}
  895. label="原订单负责人电话"
  896. >
  897. <span>{theData.oldSalesmanMobile}</span>
  898. </FormItem>
  899. <FormItem
  900. className="half-item"
  901. {...formItemLayout}
  902. style={{ opacity: ".5" }}
  903. label="实际财务操作人"
  904. >
  905. <span>{theData.financeName}</span>
  906. </FormItem>
  907. <FormItem
  908. className="half-item"
  909. {...formItemLayout}
  910. style={{ opacity: ".5" }}
  911. label="实际财务操作人电话"
  912. >
  913. <span>{theData.financeMobile}</span>
  914. </FormItem>
  915. </div>
  916. {/* <Modal
  917. visible={this.state.avisible}
  918. className="admin-desc-content"
  919. width="800px"
  920. maskClosable={false}
  921. title="订单日志"
  922. footer={null}
  923. onCancel={this.closeOrderLog}
  924. >
  925. <div className="patent-table">
  926. <Spin spinning={this.state.loading}>
  927. <Table
  928. columns={this.state.columnsX}
  929. dataSource={this.state.dataSourceX}
  930. pagination={false}
  931. />
  932. </Spin>
  933. </div>
  934. </Modal> */}
  935. <OrderRiZi
  936. dataSourcerizhi={this.state.dataSourceX}
  937. closeOrderLog={this.closeOrderLog}
  938. visible={this.state.avisible}
  939. loading={this.state.loading}
  940. />
  941. <div className="clearfix" style={{ marginBottom: 10 }}>
  942. <p style={{ fontSize: 18, marginLeft: 20 }}>项目业务</p>
  943. <div className="patent-table">
  944. <Spin spinning={this.state.loading}>
  945. <Table
  946. columns={this.state.columns}
  947. dataSource={this.state.dataSource}
  948. pagination={this.state.pagination}
  949. onRowClick={this.tableRowClick}
  950. bordered
  951. size="small"
  952. />
  953. </Spin>
  954. </div>
  955. </div>
  956. <div>
  957. <span style={{ marginLeft: 20, fontSize: "18px" }}>
  958. 催款节点
  959. </span>
  960. <span
  961. style={{
  962. display: cuiDataList.length ? "none" : "inline-block",
  963. marginLeft: 10,
  964. color: "red"
  965. }}
  966. >
  967. 金额总计(万元): {this.state.totalCui}
  968. </span>
  969. </div>
  970. <div className="clearfix">
  971. <Spin spinning={this.state.loading}>
  972. <Form layout="horizontal" id="demand-form">
  973. <Table
  974. pagination={false}
  975. bordered
  976. size="small"
  977. columns={
  978. cuiDataList.length
  979. ? this.state.ContactsLists
  980. : this.state.ContactsListsNew
  981. }
  982. dataSource={
  983. cuiDataList.length
  984. ? this.state.contactList
  985. : this.state.contactListNew
  986. }
  987. />
  988. <Col
  989. span={24}
  990. offset={9}
  991. style={{ marginTop: "15px" }}
  992. ></Col>
  993. </Form>
  994. </Spin>
  995. </div>
  996. </Spin>
  997. </Form>
  998. </div>
  999. );
  1000. }
  1001. })
  1002. );
  1003. export default OrderDetail;