orderDetail.jsx 46 KB

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