orderDetail.jsx 45 KB

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