orderDetail.jsx 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176
  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. Tag,
  13. Tooltip
  14. } from 'antd';
  15. import {
  16. getjiedian,
  17. splitUrl,
  18. getNewOrderType,
  19. getProcessStatus,
  20. getApproval,
  21. getLiquidationStatus,
  22. getboutique,
  23. getCuikuan,
  24. } from "@/tools";
  25. import OrderRiZi from "@/orderRiZi.jsx";
  26. import ResolutionDetail from "@/resolutionDetail";
  27. import ImgList from "../../../common/imgList";
  28. import { getProjectName } from "../../../tools";
  29. import ProjectDetailsReadOnly from "../../../common/projectDetailsReadOnly";
  30. import OrderItemStatus from "../../../common/orderItemStatus";
  31. import EnterpriseNameChange from "../../../common/enterpriseNameChange";
  32. import OrderCoor from '../../order/orderNew/changeComponent/orderCoor';
  33. import ContentUrl from '../../order/orderNew/contentUrl';
  34. import { salesList } from "@/dataDic.js";
  35. const OrderDetail = Form.create()(
  36. React.createClass({
  37. loadXmu(record) {
  38. this.state.data = [];
  39. this.setState({
  40. loading: true,
  41. });
  42. $.ajax({
  43. method: "get",
  44. dataType: "json",
  45. crossDomain: false,
  46. url: globalConfig.context + "/api/admin/newOrder/getOrderTask",
  47. data: {
  48. orderNo: record ? record.orderNo : this.props.data.orderNo,
  49. },
  50. success: function (data) {
  51. let theArr = [];
  52. if (!data.data) {
  53. if (data.error && data.error.length) {
  54. message.warning(data.error[0].message);
  55. }
  56. } else {
  57. for (let i = 0; i < data.data.length; i++) {
  58. let thisdata = data.data[i];
  59. thisdata.key = i;
  60. thisdata.sort = thisdata.cSort;
  61. theArr.push(thisdata);
  62. }
  63. }
  64. this.setState({
  65. dataSource: theArr,
  66. pagination: false,
  67. });
  68. }.bind(this),
  69. }).always(
  70. function () {
  71. this.setState({
  72. loading: false,
  73. });
  74. }.bind(this)
  75. );
  76. },
  77. getInitialState() {
  78. return {
  79. rotateDeg: 0,
  80. orderNos: '',
  81. visible: false,
  82. avisible: false,
  83. loading: false,
  84. declarationBatch: 1,
  85. dataInfor: {},
  86. addnextVisible: false,
  87. jsDate: [],
  88. replenishUrl: [],
  89. auditStatus: 0,
  90. textFileList: [],
  91. videoFileList: [],
  92. previewVisibles: false,
  93. pictureUrl: [],
  94. pictureUrlMin: [],
  95. columns: [
  96. {
  97. title: "业务项目名称",
  98. dataIndex: "commodityName",
  99. key: "commodityName",
  100. render: (text, record) => {
  101. return <span>{text}<span style={{ color: "red" }}>{record.patentTypeName}</span>{"-" + record.id}</span>
  102. }
  103. },
  104. {
  105. title: "项目类别",
  106. dataIndex: "cname",
  107. key: "cname",
  108. },
  109. {
  110. title: "项目数量",
  111. dataIndex: "commodityQuantity",
  112. key: "commodityQuantity",
  113. width: 50,
  114. render: (text, record) => {
  115. if (record.splitStatus == 1) {
  116. return (
  117. <span>
  118. {text}{" "}
  119. <Tag
  120. color="#108ee9"
  121. onClick={(e) => {
  122. e.stopPropagation();
  123. this.showRes(record);
  124. }}
  125. >
  126. 已拆
  127. </Tag>
  128. </span>
  129. );
  130. } else {
  131. return text;
  132. }
  133. },
  134. },
  135. {
  136. title: "金额(万元)",
  137. dataIndex: "commodityPrice",
  138. key: "commodityPrice",
  139. width: 100,
  140. },
  141. {
  142. title: "负责人",
  143. dataIndex: "contacts",
  144. key: "contacts",
  145. },
  146. {
  147. title: "负责人电话",
  148. dataIndex: "contactsMobile",
  149. key: "contactsMobile",
  150. },
  151. {
  152. title: "项目状态",
  153. dataIndex: "projectStatus",
  154. key: "projectStatus",
  155. render: (text) => {
  156. return getProjectName(text);
  157. },
  158. },
  159. {
  160. title: "主要项目",
  161. dataIndex: "main",
  162. key: "main",
  163. width: 50,
  164. render: (text) => {
  165. return text ? "是" : "否";
  166. },
  167. },
  168. {
  169. title: "总年限",
  170. dataIndex: "yearSum",
  171. key: "yearSum",
  172. render: (text, record) => {
  173. return (
  174. <div>{["", "一年", "二年", "三年", "四年", "五年"][text]}</div>
  175. );
  176. }
  177. },
  178. {
  179. title: "年限",
  180. dataIndex: "serviceLife",
  181. key: "serviceLife",
  182. width: 60,
  183. render: (text, record) => {
  184. return (
  185. !!text && JSON.parse(text).map(item =>
  186. <div>{item}年 </div>
  187. )
  188. );
  189. }
  190. },
  191. {
  192. title: "本次派单",
  193. dataIndex: "serviceYear",
  194. key: "serviceYear",
  195. render: (text, record) => {
  196. return (
  197. <div>{!text ? "" : text + "年"}</div>
  198. );
  199. }
  200. },
  201. {
  202. title: "项目说明",
  203. dataIndex: "taskComment",
  204. key: "taskComment",
  205. width: 200,
  206. render: (text) => {
  207. return (
  208. <Tooltip title={text}>
  209. <div
  210. style={{
  211. width: 180,
  212. overflow: "hidden",
  213. whiteSpace: "nowrap",
  214. textOverflow: "ellipsis",
  215. }}
  216. >{text}</div>
  217. </Tooltip>
  218. )
  219. },
  220. },
  221. ],
  222. columnsX: [
  223. {
  224. title: "流程",
  225. dataIndex: "processName",
  226. key: "processName",
  227. },
  228. {
  229. title: "操作人",
  230. dataIndex: "adminName",
  231. key: "adminName",
  232. },
  233. {
  234. title: "时间",
  235. dataIndex: "createDate",
  236. key: "createDate",
  237. },
  238. ],
  239. ContactsListsNew: [
  240. {
  241. title: "项目名称",
  242. dataIndex: "commodityName",
  243. key: "commodityName",
  244. render: (text, record) => {
  245. return <span>{text + "-" + record.tid}</span>;
  246. },
  247. },
  248. {
  249. title: "项目分类",
  250. dataIndex: "projectType",
  251. key: "projectType",
  252. render: (text) => {
  253. let arr = this.state.dataSource || [];
  254. let str = "";
  255. for (let i = 0; i < arr.length; i++) {
  256. if (this.state.dataSource[i].sort == text) {
  257. str = this.state.dataSource[i].cname;
  258. return <span>{str}</span>;
  259. }
  260. }
  261. },
  262. },
  263. {
  264. title: "催款科目",
  265. dataIndex: "dunTypeName",
  266. key: "dunTypeName",
  267. render: (text, record) => {
  268. if (record.customizeName) {
  269. return text + record.customizeName;
  270. }
  271. return <span>{text}</span>;
  272. },
  273. },
  274. {
  275. title: "时间(天)",
  276. dataIndex: "waitDay",
  277. key: "waitDay",
  278. render: (text, record) => {
  279. if (record.dunTypeName) {
  280. if (record.customizeTimes) {
  281. return record.customizeTimes;
  282. }
  283. return <span>{text}</span>;
  284. }
  285. },
  286. },
  287. {
  288. title: "金额(万元)",
  289. dataIndex: "money",
  290. key: "money",
  291. render: (text, record) => {
  292. if (record.dunTypeName) {
  293. if (record.appropriationRatio) {
  294. let percent = Number(record.appropriationRatio * 100).toFixed(2);
  295. percent += "%";
  296. return <span>{percent}(拨款比例)</span>;
  297. } else {
  298. return <span>{text}</span>;
  299. }
  300. }
  301. },
  302. },
  303. {
  304. title: "服务年限",
  305. dataIndex: "startDate",
  306. key: "startDate",
  307. render: (text, record) => {
  308. if (record.dunTypeName) {
  309. return <span>{text}</span>;
  310. }
  311. },
  312. },
  313. {
  314. title: "催款状态",
  315. dataIndex: "status",
  316. key: "status",
  317. render: (text) => {
  318. return <span>{text == 1 ? "已启动" : "未启动"}</span>;
  319. },
  320. },
  321. ],
  322. ContactsLists: [
  323. {
  324. title: "催款科目",
  325. dataIndex: "dunSubject",
  326. key: "dunSubject",
  327. render: (text) => {
  328. return getjiedian(text);
  329. },
  330. },
  331. {
  332. title: "金额(万元)",
  333. dataIndex: "money",
  334. key: "money",
  335. },
  336. {
  337. title: "催款状态",
  338. dataIndex: "dunStatus",
  339. key: "dunStatus",
  340. render: (text) => {
  341. return getCuikuan(text);
  342. },
  343. },
  344. ],
  345. };
  346. },
  347. //点击打卡项目详情
  348. tableRowClick(record) {
  349. if (record.type == "1") {
  350. this.setState({
  351. displayFees: "block",
  352. costReduction: record.costReduction,
  353. officialCost: record.officialCost,
  354. });
  355. } else {
  356. this.setState({
  357. displayFees: "none",
  358. });
  359. }
  360. this.setState({
  361. jid: record.id, //项目ID
  362. kid: record.commodityId, //商品ID
  363. commodityName: record.commodityName, //金额
  364. commodityPrice: record.commodityPrice, //金额
  365. commodityQuantity: record.commodityQuantity, //数量
  366. taskComment: record.taskComment, //备注
  367. main: record.main.toString(), //是否为主要
  368. yearSum: record.yearSum,//会员总服务年限
  369. serviceLife: record.serviceLife,//会员服务年限
  370. serviceYear: record.serviceYear,//本次派单
  371. cSort: record.cSort,
  372. addnextVisible: true,
  373. dataInfor: record,
  374. addState: 0,
  375. });
  376. },
  377. //项目详情关闭
  378. nextCancel() {
  379. this.setState({
  380. addnextVisible: false,
  381. displayFees: "none",
  382. officialCost: "", //是否有官费
  383. costReduction: "", //是否有费减
  384. });
  385. },
  386. // 拆分详细
  387. showRes(record) {
  388. this.setState({
  389. resVisible: true,
  390. resRecord: record,
  391. });
  392. },
  393. resCancel() {
  394. this.setState({
  395. resVisible: false,
  396. });
  397. },
  398. loadData(record) {
  399. this.state.orderList = [];
  400. $.ajax({
  401. method: "get",
  402. dataType: "json",
  403. crossDomain: false,
  404. url: globalConfig.context + "/api/admin/newOrder/getOrderNewDetail",
  405. data: {
  406. orderNo: record ? record.orderNo : this.props.data.orderNo,
  407. },
  408. success: function (data) {
  409. let thisData = data.data;
  410. if (!thisData) {
  411. if (data.error && data.error.length) {
  412. message.warning(data.error[0].message);
  413. }
  414. thisData = {};
  415. }
  416. this.setState({
  417. id: thisData.id,
  418. orderUid: thisData.uid,
  419. orderList: thisData,
  420. approval:
  421. thisData.approval == 0
  422. ? thisData.approval.toString()
  423. : thisData.approval,
  424. orderRemarks: thisData.orderRemarks,
  425. orgCodeUrl: thisData.contractPictureUrl
  426. ? splitUrl(
  427. thisData.contractPictureUrl,
  428. ",",
  429. globalConfig.avatarHost + "/upload"
  430. )
  431. : [],
  432. replenishUrl: thisData.agreementUrl
  433. ? splitUrl(
  434. thisData.agreementUrl,
  435. ",",
  436. globalConfig.avatarHost + "/upload"
  437. )
  438. : [],
  439. contentUrl: thisData.serviceContent
  440. ? splitUrl(
  441. thisData.serviceContent,
  442. ",",
  443. globalConfig.avatarHost + "/upload"
  444. )
  445. : [], //图片地址
  446. orderNo: thisData.orderNo, //订单编号
  447. buyerId: thisData.buyerId,
  448. depName: thisData.depName,
  449. outsource: thisData.outsource == 0 ? "否" : "是",
  450. deleteSign: thisData.deleteSign,
  451. });
  452. }.bind(this),
  453. }).always(
  454. function () {
  455. this.setState({
  456. loading: false,
  457. });
  458. }.bind(this)
  459. );
  460. },
  461. rizhi() {
  462. this.setState({
  463. loading: true,
  464. });
  465. $.ajax({
  466. method: "get",
  467. dataType: "json",
  468. crossDomain: false,
  469. url: "/api/admin/newOrder/selectOrderLog",
  470. data: {
  471. orderNo: this.props.data.orderNo,
  472. },
  473. success: function (data) {
  474. let theArr = [];
  475. let thisData = data.data;
  476. if (!thisData.length) {
  477. if (data.error && data.error.length) {
  478. message.warning(data.error[0].message);
  479. }
  480. thisData = {};
  481. } else {
  482. for (let i = 0; i < data.data.length; i++) {
  483. let thisdata = data.data[i];
  484. theArr.push({
  485. processName: thisdata.processName,
  486. adminName: thisdata.adminName,
  487. createDate: thisdata.createDate,
  488. remarks: thisdata.remarks,
  489. });
  490. }
  491. }
  492. this.setState({
  493. dataSourceX: theArr,
  494. });
  495. }.bind(this),
  496. }).always(
  497. function () {
  498. this.setState({
  499. loading: false,
  500. });
  501. }.bind(this)
  502. );
  503. },
  504. getOrderLog() {
  505. this.setState({
  506. avisible: true,
  507. });
  508. this.rizhi();
  509. },
  510. closeOrderLog() {
  511. this.setState({
  512. avisible: false,
  513. });
  514. },
  515. getPictureUrl(e) {
  516. this.setState({ pictureUrl: e });
  517. },
  518. componentWillMount() {
  519. if (this.props.data.orderNo) {
  520. this.setState({
  521. orderNos: this.props.data.orderNo
  522. })
  523. this.loadData();
  524. this.loadXmu();
  525. this.jiedian(this.props.data.orderNo);
  526. this.jiedianNew(this.props.data.orderNo);
  527. } else {
  528. this.state.data = {};
  529. }
  530. },
  531. componentWillReceiveProps(nextProps) {
  532. if (!this.props.visible && nextProps.visible) {
  533. this.state.textFileList = [];
  534. this.state.videoFileList = [];
  535. if (nextProps.data.orderNo) {
  536. this.setState({
  537. orderNos: nextProps.data.orderNo
  538. })
  539. this.loadData(nextProps.data);
  540. this.loadXmu(nextProps.data);
  541. this.jiedian(nextProps.data.orderNo);
  542. this.jiedianNew(nextProps.data.orderNo);
  543. } else {
  544. this.state.data = {};
  545. this.state.pictureUrl = [];
  546. this.state.pictureUrlMin = [];
  547. }
  548. this.props.form.resetFields();
  549. }
  550. },
  551. downImg() {
  552. let num = 0;
  553. for (let i = 0; i < this.state.orgCodeUrl.length; i++) {
  554. if (this.state.orgCodeUrl[i].url == this.state.previewImage) {
  555. num = i;
  556. }
  557. }
  558. if (num == this.state.orgCodeUrl.length - 1) {
  559. return message.warning("已经是最后一张了哦");
  560. }
  561. this.state.previewImage = this.state.orgCodeUrl[num + 1].url;
  562. this.setState({
  563. previewImage: this.state.previewImage,
  564. rotateDeg: 0,
  565. });
  566. },
  567. upImg() {
  568. let num = 0;
  569. for (let i = 0; i < this.state.orgCodeUrl.length; i++) {
  570. if (this.state.orgCodeUrl[i].url == this.state.previewImage) {
  571. num = i;
  572. }
  573. }
  574. if (num == 0) {
  575. return message.warning("已经是第一张了哦");
  576. }
  577. this.state.previewImage = this.state.orgCodeUrl[num - 1].url;
  578. this.setState({
  579. previewImage: this.state.previewImage,
  580. rotateDeg: 0,
  581. });
  582. },
  583. rotate() {
  584. let rotateDeg = this.state.rotateDeg + 90;
  585. this.setState({
  586. rotateDeg,
  587. });
  588. },
  589. downImgs() {
  590. let num = 0;
  591. for (let i = 0; i < this.state.replenishUrl.length; i++) {
  592. if (this.state.replenishUrl[i].url == this.state.previewImage) {
  593. num = i;
  594. }
  595. }
  596. if (num == this.state.replenishUrl.length - 1) {
  597. return message.warning("已经是最后一张了哦");
  598. }
  599. this.state.previewImage = this.state.replenishUrl[num + 1].url;
  600. this.setState({
  601. previewImage: this.state.previewImage,
  602. rotateDeg: 0,
  603. });
  604. },
  605. upImgs() {
  606. let num = 0;
  607. for (let i = 0; i < this.state.replenishUrl.length; i++) {
  608. if (this.state.replenishUrl[i].url == this.state.previewImage) {
  609. num = i;
  610. }
  611. }
  612. if (num == 0) {
  613. return message.warning("已经是第一张了哦");
  614. }
  615. this.state.previewImage = this.state.replenishUrl[num - 1].url;
  616. this.setState({
  617. previewImage: this.state.previewImage,
  618. rotateDeg: 0,
  619. });
  620. },
  621. rotates() {
  622. let rotateDeg = this.state.rotateDeg + 90;
  623. this.setState({
  624. rotateDeg,
  625. });
  626. },
  627. //节点列表
  628. jiedian(orderNos) {
  629. $.ajax({
  630. method: "get",
  631. dataType: "json",
  632. crossDomain: false,
  633. url: globalConfig.context + "/api/admin/newOrder/selectOrderDun",
  634. data: {
  635. orderNo: orderNos,
  636. },
  637. success: function (data) {
  638. let theArr = [];
  639. let thisData = [];
  640. if (data.error.length || data.data.list == "") {
  641. if (data.error && data.error.length) {
  642. message.warning(data.error[0].message);
  643. }
  644. } else {
  645. for (let i = 0; i < data.data.length; i++) {
  646. thisData = data.data[i];
  647. theArr.push({
  648. key: i,
  649. dunSubject: thisData.dunSubject
  650. ? thisData.dunSubject.toString()
  651. : "", //催款科目
  652. id: thisData.id, //节点Id
  653. money: thisData.money, //催款金额
  654. dunStatus: thisData.dunStatus, //催款状态
  655. orderNo: thisData.orderNo,
  656. });
  657. }
  658. this.setState({
  659. contactList: theArr,
  660. });
  661. }
  662. }.bind(this),
  663. }).always(
  664. function () {
  665. this.setState({
  666. loading: false,
  667. });
  668. }.bind(this)
  669. );
  670. },
  671. //查看催款节点
  672. jiedianNew(orderNos) {
  673. $.ajax({
  674. method: "get",
  675. dataType: "json",
  676. crossDomain: false,
  677. url:
  678. globalConfig.context + "/api/admin/newOrderDun/selectListNewOrderDun",
  679. data: {
  680. orderNo: orderNos,
  681. },
  682. success: function (data) {
  683. if (data.error && data.error.length) {
  684. message.warning(data.error[0].message);
  685. } else {
  686. let theArr = [];
  687. let thisData = [];
  688. let arr = data.data || [];
  689. let totalCui = 0;
  690. for (let i = 0; i < arr.length; i++) {
  691. thisData = arr[i];
  692. totalCui += +thisData.money;
  693. theArr.push({
  694. key: i,
  695. dunSubject: thisData.dunSubject
  696. ? thisData.dunSubject.toString()
  697. : "", //催款科目
  698. id: thisData.id, //节点Id
  699. money: thisData.money, //催款金额
  700. // orderNo: record ? record.orderNo : this.props.datauser.orderNo,
  701. commodityName: thisData.commodityName,
  702. projectType: thisData.projectType,
  703. dunTypeName: thisData.dunTypeName,
  704. status: thisData.status,
  705. waitDay: thisData.waitDay,
  706. effectiveCount: thisData.effectiveCount,
  707. startDate: thisData.startDate,
  708. dunType: thisData.dunType,
  709. appropriationRatio: thisData.appropriationRatio,
  710. customizeName: thisData.customizeName,
  711. customizeTimes: thisData.customizeTimes,
  712. tid: thisData.tid,
  713. });
  714. }
  715. if (!totalCui) {
  716. totalCui = 0;
  717. }
  718. totalCui = (Math.round(totalCui * 1000000) / 1000000).toFixed(6);
  719. this.setState({
  720. contactListNew: theArr,
  721. totalCui,
  722. });
  723. }
  724. }.bind(this),
  725. }).always(
  726. function () {
  727. this.setState({
  728. loading: false,
  729. });
  730. }.bind(this)
  731. );
  732. },
  733. render() {
  734. const theData = this.state.orderList || {};
  735. const FormItem = Form.Item;
  736. const formItemLayout = {
  737. labelCol: { span: 10 },
  738. wrapperCol: { span: 12 },
  739. };
  740. const cuiDataList = this.state.contactList || [];
  741. return (
  742. <div className="login">
  743. <div style={{ position: "absolute", top: '12px', left: '81px', zIndex: 10000 }}>
  744. <OrderItemStatus deleteSign={this.state.deleteSign} />
  745. </div>
  746. {this.state.resVisible &&
  747. <ResolutionDetail
  748. cancel={this.resCancel}
  749. detail={this.state.resRecord}
  750. visible={this.state.resVisible}
  751. id={this.state.resRecord.orderNo}
  752. />
  753. }
  754. <Form layout="horizontal" id="demand-form">
  755. <Spin spinning={this.state.loading}>
  756. <div className="clearfix">
  757. <FormItem
  758. className="half-item"
  759. {...formItemLayout}
  760. label="订单编号"
  761. >
  762. <span>{theData.orderNo}</span>
  763. </FormItem>
  764. <FormItem
  765. className="half-item"
  766. {...formItemLayout}
  767. label="合同编号"
  768. >
  769. <span>{theData.contractNo}</span>
  770. </FormItem>
  771. <FormItem
  772. className="half-item"
  773. {...formItemLayout}
  774. label="客户名称"
  775. >
  776. <span>
  777. {theData.userName}
  778. <EnterpriseNameChange
  779. type='journal'
  780. style={{ marginLeft: 10 }}
  781. enterpriseId={this.state.orderUid} />
  782. </span>
  783. </FormItem>
  784. <FormItem className="half-item"
  785. {...formItemLayout}
  786. label="销售类型"
  787. >
  788. <span>
  789. {(["私有客户-", "签单客户-"][theData.userType] || " ") +
  790. (salesList[theData.salesType] || "")}
  791. {
  792. theData.other != null && theData.other != "" &&
  793. <Tooltip title={theData.other}>
  794. <span>
  795. {"(" + theData.other.toString().slice(0, 10) + (theData.other.toString().length > 9 ? "...)" : ")")}
  796. </span>
  797. </Tooltip>
  798. }
  799. </span>
  800. </FormItem>
  801. <FormItem
  802. className="half-item"
  803. {...formItemLayout}
  804. label="签单时间"
  805. >
  806. <span>{theData.signDate}</span>
  807. </FormItem>
  808. <FormItem
  809. className="half-item"
  810. {...formItemLayout}
  811. label="流程状态"
  812. >
  813. <span>{getProcessStatus(theData.processStatus)}</span>
  814. </FormItem>
  815. <FormItem
  816. className="half-item"
  817. {...formItemLayout}
  818. label="订单类型"
  819. >
  820. <span>{getNewOrderType(theData.orderType)}</span>
  821. </FormItem>
  822. <FormItem
  823. className="half-item"
  824. {...formItemLayout}
  825. label="结算状态"
  826. >
  827. <span>{getLiquidationStatus(theData.liquidationStatus)}</span>
  828. </FormItem>
  829. <FormItem
  830. className="half-item"
  831. {...formItemLayout}
  832. label="签单总金额(万元)"
  833. >
  834. <span>{theData.totalAmount}</span>
  835. </FormItem>
  836. <FormItem
  837. className="half-item"
  838. {...formItemLayout}
  839. label="首付款(万元)"
  840. >
  841. <span>{theData.firstAmount}</span>
  842. </FormItem>
  843. <FormItem
  844. className="half-item"
  845. {...formItemLayout}
  846. label="已收款(万元)"
  847. >
  848. <span>{theData.settlementAmount}</span>
  849. </FormItem>
  850. <FormItem
  851. className="half-item"
  852. {...formItemLayout}
  853. label="是否特批"
  854. >
  855. <span>{getApproval(theData.approval)}</span>
  856. </FormItem>
  857. <FormItem
  858. className="half-item"
  859. {...formItemLayout}
  860. label="是否外包"
  861. >
  862. <span>{this.state.outsource}</span>
  863. </FormItem>
  864. {this.props.data.orderStatus == "6" && (
  865. <FormItem
  866. className="half-item"
  867. {...formItemLayout}
  868. label="已退(万元)"
  869. >
  870. <span>{this.props.data.refundAmount}</span>
  871. </FormItem>
  872. )}
  873. <FormItem
  874. className="half-item"
  875. {...formItemLayout}
  876. label="订单部门"
  877. >
  878. <span>{theData.depName}</span>
  879. </FormItem>
  880. </div>
  881. <div className="clearfix">
  882. <FormItem
  883. labelCol={{ span: 5 }}
  884. wrapperCol={{ span: 18 }}
  885. label="订单留言"
  886. >
  887. <p style={{ maxWidth: 500, wordWrap: "break-word" }}>
  888. {this.state.orderRemarks}
  889. </p>
  890. </FormItem>
  891. </div>
  892. <div className="clearfix">
  893. <FormItem
  894. labelCol={{ span: 5 }}
  895. wrapperCol={{ span: 18 }}
  896. label="合同扫描件"
  897. >
  898. <div style={{ paddingTop: '10px', paddingBottom: '10px' }}>
  899. {this.state.orgCodeUrl ? <ImgList fileList={this.state.orgCodeUrl} ItemWidth={'96px'} /> : <div />}
  900. </div>
  901. <Modal
  902. maskClosable={false}
  903. footer={null}
  904. width={"50%"}
  905. visible={this.state.previewVisible}
  906. onCancel={() => {
  907. this.setState({ previewVisible: false, rotateDeg: 0 });
  908. }}
  909. >
  910. <img
  911. alt=""
  912. style={{
  913. width: "100%",
  914. transform: `rotate(${this.state.rotateDeg}deg)`,
  915. }}
  916. src={this.state.previewImage || ""}
  917. />
  918. <Button
  919. onClick={this.rotate}
  920. style={{
  921. position: "relative",
  922. left: "50%",
  923. transform: "translateX(-50%)",
  924. }}
  925. >
  926. 旋转
  927. </Button>
  928. <Button
  929. onClick={this.upImg}
  930. style={{
  931. position: "absolute",
  932. left: -81,
  933. top: "50%",
  934. transform: "translateY(-50%)",
  935. }}
  936. >
  937. 上一张
  938. </Button>
  939. <Button
  940. onClick={this.downImg}
  941. style={{
  942. position: "absolute",
  943. right: -81,
  944. top: "50%",
  945. transform: "translateY(-50%)",
  946. }}
  947. >
  948. 下一张
  949. </Button>
  950. </Modal>
  951. <Button
  952. style={{
  953. float: "right",
  954. marginRight: "140px",
  955. marginTop: "20px",
  956. }}
  957. onClick={this.getOrderLog}
  958. >
  959. 查看订单日志
  960. </Button>
  961. </FormItem>
  962. <FormItem
  963. labelCol={{ span: 5 }}
  964. wrapperCol={{ span: 18 }}
  965. label="补充协议"
  966. >
  967. <div style={{ paddingTop: '10px', paddingBottom: '10px' }}>
  968. {this.state.replenishUrl ? <ImgList domId={'orderDetail1'} fileList={this.state.replenishUrl} /> : <div />}
  969. </div>
  970. <Modal
  971. maskClosable={false}
  972. footer={null}
  973. width={"50%"}
  974. visible={this.state.previewVisibles}
  975. onCancel={() => {
  976. this.setState({ previewVisibles: false, rotateDeg: 0 });
  977. }}
  978. >
  979. <img
  980. alt=""
  981. style={{
  982. width: "100%",
  983. transform: `rotate(${this.state.rotateDeg}deg)`,
  984. }}
  985. src={this.state.previewImage || ""}
  986. />
  987. <Button
  988. onClick={this.rotates}
  989. style={{
  990. position: "relative",
  991. left: "50%",
  992. transform: "translateX(-50%)",
  993. }}
  994. >
  995. 旋转
  996. </Button>
  997. <Button
  998. onClick={this.upImgs}
  999. style={{
  1000. position: "absolute",
  1001. left: -81,
  1002. top: "50%",
  1003. transform: "translateY(-50%)",
  1004. }}
  1005. >
  1006. 上一张
  1007. </Button>
  1008. <Button
  1009. onClick={this.downImgs}
  1010. style={{
  1011. position: "absolute",
  1012. right: -81,
  1013. top: "50%",
  1014. transform: "translateY(-50%)",
  1015. }}
  1016. >
  1017. 下一张
  1018. </Button>
  1019. </Modal>
  1020. </FormItem>
  1021. </div>
  1022. <div style={{ marginLeft: "56px" }}>
  1023. <ContentUrl
  1024. processStatus={1}
  1025. domId={"detailContents"}
  1026. contentUrl={this.state.contentUrl}
  1027. imgId={"detailContentsImg"}
  1028. />
  1029. </div>
  1030. <div className="clearfix">
  1031. <FormItem
  1032. className="half-item"
  1033. {...formItemLayout}
  1034. label="订单负责人"
  1035. >
  1036. <span>{theData.salesmanName}</span>
  1037. </FormItem>
  1038. <FormItem
  1039. className="half-item"
  1040. {...formItemLayout}
  1041. label="订单负责人电话"
  1042. >
  1043. <span>{theData.salesmanMobile}</span>
  1044. </FormItem>
  1045. <FormItem
  1046. className="half-item"
  1047. {...formItemLayout}
  1048. label="当前财务负责人"
  1049. >
  1050. <span>{theData.nowFinance}</span>
  1051. </FormItem>
  1052. <FormItem
  1053. className="half-item"
  1054. {...formItemLayout}
  1055. label="当前财务负责人电话"
  1056. >
  1057. <span>{theData.nowFinanceMobile}</span>
  1058. </FormItem>
  1059. <FormItem
  1060. className="half-item"
  1061. {...formItemLayout}
  1062. style={{ opacity: ".5" }}
  1063. label="原订单负责人"
  1064. >
  1065. <span>{theData.oldSalesmanName}</span>
  1066. </FormItem>
  1067. <FormItem
  1068. className="half-item"
  1069. {...formItemLayout}
  1070. style={{ opacity: ".5" }}
  1071. label="原订单负责人电话"
  1072. >
  1073. <span>{theData.oldSalesmanMobile}</span>
  1074. </FormItem>
  1075. <FormItem
  1076. className="half-item"
  1077. {...formItemLayout}
  1078. style={{ opacity: ".5" }}
  1079. label="实际财务操作人"
  1080. >
  1081. <span>{theData.financeName}</span>
  1082. </FormItem>
  1083. <FormItem
  1084. className="half-item"
  1085. {...formItemLayout}
  1086. style={{ opacity: ".5" }}
  1087. label="实际财务操作人电话"
  1088. >
  1089. <span>{theData.financeMobile}</span>
  1090. </FormItem>
  1091. </div>
  1092. <OrderRiZi
  1093. dataSourcerizhi={this.state.dataSourceX}
  1094. closeOrderLog={this.closeOrderLog}
  1095. visible={this.state.avisible}
  1096. loading={this.state.loading}
  1097. />
  1098. <OrderCoor orderNo={this.state.orderNos} mrs={'20px'} mro={'64px'} />
  1099. <div className="clearfix" style={{ marginBottom: 10 }}>
  1100. <p style={{ fontSize: 18, marginLeft: 20 }}>项目业务</p>
  1101. <div className="patent-table">
  1102. <Spin spinning={this.state.loading}>
  1103. <Table
  1104. columns={this.state.columns}
  1105. dataSource={this.state.dataSource}
  1106. pagination={this.state.pagination}
  1107. onRowClick={this.tableRowClick}
  1108. bordered
  1109. size="small"
  1110. />
  1111. </Spin>
  1112. </div>
  1113. </div>
  1114. <div>
  1115. <span style={{ marginLeft: 20, fontSize: "18px" }}>
  1116. 催款节点
  1117. </span>
  1118. <span
  1119. style={{
  1120. display: cuiDataList.length ? "none" : "inline-block",
  1121. marginLeft: 10,
  1122. color: "red",
  1123. }}
  1124. >
  1125. 金额总计(万元): {this.state.totalCui}
  1126. </span>
  1127. </div>
  1128. <div className="clearfix">
  1129. <Spin spinning={this.state.loading}>
  1130. <Form layout="horizontal" id="demand-form">
  1131. <Table
  1132. pagination={false}
  1133. bordered
  1134. size="small"
  1135. columns={
  1136. cuiDataList.length
  1137. ? this.state.ContactsLists
  1138. : this.state.ContactsListsNew
  1139. }
  1140. dataSource={
  1141. cuiDataList.length
  1142. ? this.state.contactList
  1143. : this.state.contactListNew
  1144. }
  1145. />
  1146. <Col
  1147. span={24}
  1148. offset={9}
  1149. style={{ marginTop: "15px" }}
  1150. ></Col>
  1151. </Form>
  1152. </Spin>
  1153. </div>
  1154. </Spin>
  1155. </Form>
  1156. {this.state.addnextVisible &&
  1157. <ProjectDetailsReadOnly
  1158. infor={this.state.dataInfor}
  1159. visible={this.state.addnextVisible}
  1160. onCancel={this.nextCancel}
  1161. />}
  1162. </div>
  1163. );
  1164. },
  1165. })
  1166. );
  1167. export default OrderDetail;