orderDetail.jsx 43 KB

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