projectManageDetaile.jsx 47 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232
  1. import React from 'react';
  2. import { Icon, Table, Modal, message, Spin, Input, Select, Button, Form ,Upload,Popconfirm,AutoComplete} from 'antd';
  3. import ajax from 'jquery/src/ajax/xhr.js';
  4. import $ from 'jquery/src/ajax';
  5. import '../userMangagement.less';
  6. import {orderType} from '../../../../dataDic.js';
  7. import {getOrderType,getProjectState,getTaskStatus,getOrderChannel,getOrderState,getPaymentState ,getApprovedState} from '../../../../tools.js';
  8. const MySettlementDetaile = Form.create()(React.createClass({
  9. loadData(record) {
  10. this.setState({
  11. loading: true
  12. });
  13. $.ajax({
  14. method: "get",
  15. dataType: "json",
  16. crossDomain: false,
  17. url: globalConfig.context + '/api/admin/techproject/getProjectTask',
  18. data: {
  19. contractId:record?record.id:this.props.datauser.id
  20. },
  21. success: function (data) {
  22. let theArr =[];
  23. if (!data.data) {
  24. if (data.error && data.error.length) {
  25. message.warning(data.error[0].message);
  26. };
  27. } else {
  28. for (let i = 0; i < data.data.length; i++) {
  29. let thisdata = data.data[i];
  30. theArr.push({
  31. key:i,
  32. taskId:thisdata.taskId,
  33. commodityName:thisdata.commodityName,
  34. commodityQuantity:thisdata.commodityQuantity,
  35. technicianName:thisdata.technicianName,
  36. taskStatus:thisdata.taskStatus,
  37. deleteSign:thisdata.deleteSign,
  38. taskComment:thisdata.taskComment,
  39. });
  40. };
  41. }
  42. this.setState({
  43. dataSource: theArr,
  44. });
  45. }.bind(this),
  46. }).always(function () {
  47. this.setState({
  48. loading: false
  49. });
  50. }.bind(this));
  51. },
  52. getInitialState() {
  53. return {
  54. loading: false,
  55. visible: false,
  56. contractState:false,
  57. projectVisible:false,
  58. selectedRowKey:[],
  59. orderSelect:false,
  60. orgCodeUrl:[],
  61. customerArr:[],
  62. checkedKeys: [],
  63. //派单
  64. columns: [
  65. {
  66. title: '任务名称',
  67. dataIndex: 'commodityName',
  68. key: 'commodityName'
  69. },{
  70. title: '任务数量',
  71. dataIndex: 'commodityQuantity',
  72. key: 'commodityQuantity'
  73. }, {
  74. title: '任务负责人',
  75. dataIndex: 'technicianName',
  76. key: 'technicianName'
  77. }, {
  78. title: '任务状态',
  79. dataIndex: 'taskStatus',
  80. key: 'taskStatus',
  81. render:(text)=>{return getTaskStatus(text)}
  82. }, {
  83. title: '是否锁定',
  84. dataIndex: 'deleteSign',
  85. key: 'deleteSign',
  86. render:(text)=>{return text==2?'锁定':'未锁定'}
  87. },{
  88. title: '任务说明',
  89. dataIndex: 'taskComment',
  90. key: 'taskComment',
  91. render:(text) => {
  92. return(
  93. text&&text.length>6?text.substr(0,8)+'...':text
  94. )
  95. }
  96. },{
  97. title: '操作',
  98. dataIndex: 'rrtk',
  99. key: 'rrtk',
  100. render:(text,record,index)=>{
  101. return (
  102. <div>
  103. {record.taskStatus<=1&&<Popconfirm title={'您将删除项目任务 【'+record.commodityName+'】,系统将自动同步作废项目资料单,请确认!'} onConfirm={(e)=>{this.voidOperation(record)}} okText="确认" cancelText="取消">
  104. <Button style={{marginRight:'5px'}} onClick={(e) =>{ e.stopPropagation()}} type="danger">删除</Button>
  105. </Popconfirm>}
  106. {record.taskStatus<1&&<Button style={{marginRight:'5px'}} onClick={(e) =>{ e.stopPropagation(),this.confirmDelet(record)}} type="primary">派单</Button>}
  107. </div>
  108. )
  109. }
  110. }
  111. ],
  112. userList:[
  113. {
  114. title: '用户编号',
  115. dataIndex: 'userNo',
  116. key: 'userNo'
  117. }, {
  118. title: '用户姓名',
  119. dataIndex: 'name',
  120. key: 'name'
  121. },{
  122. title: '部门机构',
  123. dataIndex: 'departmentName',
  124. key: 'departmentName'
  125. }, {
  126. title: '职务',
  127. dataIndex: 'position',
  128. key: 'position'
  129. },{
  130. title: '联系手机',
  131. dataIndex: 'mobile',
  132. key: 'mobile'
  133. }, {
  134. title: '操作',
  135. dataIndex: 'abc',
  136. key: 'abc',
  137. render:(text,record,index)=>{
  138. return (
  139. <Popconfirm title={'您确认将订单分配给【'+record.departmentName+'-'+record.name+'】进行业务跟进?'} onConfirm={(e)=>{this.confirmSelect(record)}} okText="确认" cancelText="取消">
  140. <Button style={{marginRight:'5px'}} type="primary">选定</Button>
  141. </Popconfirm>
  142. )
  143. }
  144. }
  145. ],
  146. contractList:[
  147. {
  148. title: '姓名',
  149. dataIndex: 'name',
  150. key: 'name'
  151. }, {
  152. title: '部门',
  153. dataIndex: 'depatrment',
  154. key: 'depatrment'
  155. },{
  156. title: '联系方式',
  157. dataIndex: 'mobile',
  158. key: 'mobile'
  159. }, {
  160. title: '职务',
  161. dataIndex: 'position',
  162. key: 'position'
  163. },{
  164. title: '微信',
  165. dataIndex: 'wechat',
  166. key: 'wechat'
  167. },{
  168. title: 'QQ',
  169. dataIndex: 'qq',
  170. key: 'qq'
  171. },
  172. ],
  173. };
  174. },
  175. seeOrder(){
  176. this.seeOrderAjax();
  177. this.setState({
  178. seeState:true,
  179. orderVisible:true
  180. })
  181. },
  182. seeContract(){
  183. this.contract();
  184. this.setState({
  185. seeState:false,
  186. orderVisible:true
  187. })
  188. },
  189. orderCancel(){
  190. this.setState({
  191. orderVisible:false
  192. })
  193. },
  194. //查看联系人
  195. contract(){
  196. $.ajax({
  197. method: "get",
  198. dataType: "json",
  199. crossDomain: false,
  200. url: globalConfig.context + '/api/admin/customer/findAllContacts',
  201. data: {
  202. uid: this.state.buyerId
  203. },
  204. success: function (data) {
  205. let thisData = data.data;
  206. if (!thisData) {
  207. if (data.error && data.error.length) {
  208. message.warning(data.error[0].message);
  209. };
  210. thisData = {};
  211. };
  212. this.setState({
  213. contractArr:thisData,
  214. });
  215. }.bind(this),
  216. }).always(function () {
  217. this.setState({
  218. loading: false
  219. });
  220. }.bind(this));
  221. },
  222. //查看订单
  223. seeOrderAjax(){
  224. $.ajax({
  225. method: "get",
  226. dataType: "json",
  227. crossDomain: false,
  228. url: globalConfig.context + '/api/admin/order/getServiceOrderDetail',
  229. data: {
  230. orderNo: this.state.orderNok
  231. },
  232. success: function (data) {
  233. let thisData = data.data;
  234. if (!thisData) {
  235. if (data.error && data.error.length) {
  236. message.warning(data.error[0].message);
  237. };
  238. thisData = {};
  239. };
  240. this.setState({
  241. orderArr:thisData,
  242. });
  243. }.bind(this),
  244. }).always(function () {
  245. this.setState({
  246. loading: false
  247. });
  248. }.bind(this));
  249. },
  250. //查看详情
  251. loaduser(record){
  252. if(record){
  253. $.ajax({
  254. method: "get",
  255. dataType: "json",
  256. crossDomain: false,
  257. url: globalConfig.context + '/api/admin/techproject/getProjectDetail',
  258. data: {
  259. contractId: record.id
  260. },
  261. success: function (data) {
  262. let thisData = data.data;
  263. if (!thisData) {
  264. if (data.error && data.error.length) {
  265. message.warning(data.error[0].message);
  266. };
  267. thisData = {};
  268. };
  269. this.setState({
  270. buyerId:thisData.uid,
  271. id:record.id,
  272. orderNok:thisData.orderNo,
  273. orderList:thisData,
  274. technicianName:thisData.technicianName, //项目负责人
  275. });
  276. }.bind(this),
  277. }).always(function () {
  278. this.setState({
  279. loading: false
  280. });
  281. }.bind(this));
  282. }
  283. },
  284. //删除
  285. voidOperation(record){
  286. this.setState({
  287. loading: true
  288. });
  289. $.ajax({
  290. method: "get",
  291. dataType: "json",
  292. crossDomain: false,
  293. url: globalConfig.context + '/api/admin/techproject/deleteProjectTask',
  294. data: {
  295. taskId:record.taskId
  296. }
  297. }).done(function (data) {
  298. if (!data.error.length) {
  299. message.success('操作成功');
  300. this.setState({
  301. loading: false,
  302. });
  303. this.loadData();
  304. } else {
  305. message.warning(data.error[0].message);
  306. };
  307. }.bind(this));
  308. },
  309. //订单编辑保存
  310. handleOk(e) {
  311. this.setState({
  312. visible: false,
  313. });
  314. this.props.closeDesc(false, true);
  315. },
  316. handleCancel(e) {
  317. this.setState({
  318. visible: false,
  319. });
  320. this.props.closeDesc(false);
  321. },
  322. //新建项目
  323. projectOk(e) {
  324. this.setState({
  325. projectVisible: false,
  326. });
  327. this.props.closeDesc(false, true);
  328. },
  329. projectCancel(e) {
  330. this.setState({
  331. projectVisible: false,
  332. });
  333. this.props.closeDesc(false);
  334. },
  335. //选定订单
  336. orderOk() {
  337. this.setState({
  338. orderSelect: false,
  339. });
  340. },
  341. componentWillMount() {
  342. },
  343. nextCancel() {
  344. this.setState({
  345. addnextVisible: false
  346. })
  347. },
  348. //查看订单明细
  349. orderDetails(record){
  350. if(record){
  351. $.ajax({
  352. method: "get",
  353. dataType: "json",
  354. crossDomain: false,
  355. url: globalConfig.context + '/api/admin/techproject/getProjectTaskDetail',
  356. data: {
  357. taskId: record.taskId
  358. },
  359. success: function (data) {
  360. let thisData = data.data;
  361. if (!thisData) {
  362. if (data.error && data.error.length) {
  363. message.warning(data.error[0].message);
  364. };
  365. thisData = {};
  366. };
  367. this.setState({
  368. taskId:thisData.taskId,
  369. taskNo:thisData.taskNo,
  370. projectNo:thisData.projectNo,
  371. categoryId:thisData.categoryId,
  372. commodityName:thisData.commodityName,
  373. taskStatus:thisData.taskStatus,
  374. taskComment:thisData.taskComment,
  375. deletedSign:thisData.deletedSign,
  376. taskAllocatorName:thisData.taskAllocatorName,
  377. taskReceiverName:thisData.taskReceiverName,
  378. taskDistributionTime:thisData.taskDistributionTime,
  379. });
  380. }.bind(this),
  381. }).always(function () {
  382. this.setState({
  383. loading: false
  384. });
  385. }.bind(this));
  386. }
  387. },
  388. //创建项目保存
  389. admissibleOrder(){
  390. if(!this.state.autoId||!this.state.customerName){
  391. message.warning('客户名称不匹配');
  392. return false;
  393. };
  394. if(!this.state.projectName){
  395. message.warning('请选择项目负责人');
  396. return false;
  397. };
  398. if(this.state.signComment&&this.state.signComment.length>45){
  399. message.warning('项目说明字数不能超过45字');
  400. return false;
  401. };
  402. this.setState({
  403. loading: true
  404. });
  405. $.ajax({
  406. method: "POST",
  407. dataType: "json",
  408. crossDomain: false,
  409. url: globalConfig.context + '/api/admin/techproject/createProject',
  410. data: {
  411. uid:this.state.autoId,
  412. signComment:this.state.signComment,
  413. aid:this.state.aid
  414. }
  415. }).done(function(data) {
  416. this.setState({
  417. loading: false
  418. });
  419. if(!data.error.length) {
  420. message.success('创建成功!');
  421. this.projectOk()
  422. } else {
  423. message.warning(data.error[0].message);
  424. }
  425. }.bind(this));
  426. },
  427. //派单
  428. //操作分配
  429. confirmDelet(index){
  430. this.setState({
  431. taskIds:index.taskId,
  432. userDetaile:false,
  433. distributionVisible:true
  434. });
  435. },
  436. distributionCancel(){
  437. this.setState({
  438. distributionVisible:false
  439. })
  440. },
  441. distributionOk(){
  442. this.setState({
  443. distributionVisible:false
  444. })
  445. },
  446. //分配对象列表
  447. contactList(){
  448. $.ajax({
  449. method: "get",
  450. dataType: "json",
  451. crossDomain: false,
  452. url: globalConfig.context + '/api/admin/superviser/adminList',
  453. data: {
  454. pageNo: 1,
  455. pageSize: 99,
  456. departmentId:this.state.departmenttList,
  457. name:this.state.financeNameSearch,
  458. },
  459. success: function (data) {
  460. let theArr = [];
  461. if (!data.data) {
  462. if (data.error && data.error.length) {
  463. message.warning(data.error[0].message);
  464. };
  465. } else {
  466. for (let i = 0; i < data.data.list.length; i++) {
  467. let thisdata = data.data.list[i];
  468. theArr.push({
  469. key: i,
  470. id: thisdata.id,
  471. userNo: thisdata.userNo,
  472. name:thisdata.name,
  473. departmentName:thisdata.departmentName,
  474. departmentId:thisdata.departmentId,
  475. position:thisdata.position,
  476. mobile:thisdata.mobile,
  477. });
  478. };
  479. };
  480. this.setState({
  481. distributionList: theArr,
  482. });
  483. }.bind(this),
  484. }).always(function () {
  485. this.setState({
  486. loading: false
  487. });
  488. }.bind(this));
  489. },
  490. //选定对象
  491. confirmSelect(record){
  492. if(this.state.projectVisible){
  493. this.setState({
  494. aid:record.id,
  495. projectName:record.name
  496. })
  497. this.distributionOk();
  498. return false
  499. }
  500. this.setState({
  501. loading: true
  502. });
  503. $.ajax({
  504. method: "POST",
  505. dataType: "json",
  506. crossDomain: false,
  507. url: globalConfig.context + "/api/admin/techproject/distributionTask",
  508. data: {
  509. taskId:this.state.taskIds,
  510. taskReceiverId:record.id
  511. }
  512. }).done(function (data) {
  513. if (!data.error.length) {
  514. message.success('分派成功!');
  515. this.setState({
  516. loading: false,
  517. });
  518. this.distributionOk();
  519. this.loadData();
  520. } else {
  521. message.warning(data.error[0].message);
  522. };
  523. }.bind(this));
  524. },
  525. searchOrder(){
  526. this.contactList();
  527. },
  528. resetOrder(){
  529. this.state.departmenttList=undefined;
  530. this.state.financeNameSearch='';
  531. this.setState({
  532. distributionList:[]
  533. })
  534. },
  535. //添加任务
  536. addTask(){
  537. this.setState({
  538. commodityQuantity:'',
  539. commodityName:'',
  540. taskComment:'',
  541. kid:'',
  542. commodityId:undefined,
  543. addTaskState:true,
  544. addnextVisible:true,
  545. customerArr:[]
  546. });
  547. },
  548. //客户名称自动补全
  549. //加载(自动补全)
  550. supervisor(e,state){ //客户名称与服务名称自动补全
  551. let api=state?'/api/admin/customer/findCustomerByName':'/api/admin/order/getBusinessProjectByName';
  552. $.ajax({
  553. method: "get",
  554. dataType: "json",
  555. crossDomain: false,
  556. url: globalConfig.context + api,
  557. data:state?{
  558. name:e
  559. }:{
  560. businessName:e
  561. },
  562. success: function (data) {
  563. let thedata=data.data;
  564. if (!thedata) {
  565. if (data.error && data.error.length) {
  566. message.warning(data.error[0].message);
  567. };
  568. thedata = {};
  569. };
  570. this.setState({
  571. states:state,
  572. customerArr:thedata,
  573. });
  574. }.bind(this),
  575. }).always(function () {
  576. this.setState({
  577. loading: false
  578. });
  579. }.bind(this));
  580. },
  581. //服务值改变时请求客户名称
  582. httpChange(e){
  583. if(e.length>=2){
  584. this.supervisor(e,false);
  585. }
  586. this.setState({
  587. commodityName:e
  588. })
  589. },
  590. //上级主管输入框失去焦点是判断客户是否存在
  591. selectAuto(value){
  592. let kid=[];
  593. let fwList=this.state.customerArr;
  594. fwList.map(function(item){
  595. if(value==item.bname){
  596. kid=item.id
  597. }
  598. })
  599. this.setState({
  600. kid:kid,
  601. commodityName:value,
  602. })
  603. },
  604. customerChange(e){
  605. if(e.length>=2){
  606. this.supervisor(e,true);
  607. }
  608. this.setState({
  609. customerName:e
  610. })
  611. },
  612. //客户
  613. selectAutoCUT(value){
  614. let autoIds;
  615. let fwList=this.state.customerArr;
  616. fwList.map(function(item){
  617. if(value==item.name){
  618. autoIds=item.id
  619. }
  620. })
  621. this.setState({
  622. customerName:value,
  623. autoId:autoIds
  624. })
  625. },
  626. //任务新建、编辑保存
  627. taskSumbit(e) {
  628. e.preventDefault();
  629. if(this.state.addTaskState){
  630. if(!this.state.kid){
  631. message.warning('请输入服务项目名称');
  632. return false;
  633. };
  634. if(!this.state.commodityQuantity){
  635. message.warning('请输入数量');
  636. return false;
  637. };
  638. }
  639. this.props.form.validateFields((err, values) => {
  640. if(!err) {
  641. this.setState({
  642. loading: true
  643. });
  644. let api=this.state.addTaskState?'/api/admin/techproject/addProjectTask':'/api/admin/techproject/updateProjectTask';
  645. $.ajax({
  646. method: "POST",
  647. dataType: "json",
  648. crossDomain: false,
  649. url: globalConfig.context + api,
  650. data: this.state.addTaskState?{
  651. contractId:this.props.datauser.id,
  652. commodityId:this.state.kid,
  653. commodityName:this.state.commodityName,
  654. commodityQuantity:this.state.commodityQuantity,
  655. taskComment:this.state.taskComment,
  656. }:{
  657. taskId:this.state.taskId,
  658. commodityId:this.state.kid?this.state.kid:this.state.commodityId,
  659. taskComment:this.state.taskComment
  660. }
  661. }).done(function(data) {
  662. this.setState({
  663. loading: false
  664. });
  665. if(!data.error.length) {
  666. message.success('保存成功!');
  667. this.nextCancel();
  668. this.loadData();
  669. } else {
  670. message.warning(data.error[0].message);
  671. }
  672. }.bind(this));
  673. }
  674. });
  675. },
  676. //任务项目各种骚操作
  677. removeItem(){ //撤项
  678. this.removeList(0)
  679. },
  680. Knot(){ //结项
  681. this.removeList(1)
  682. },
  683. removeList(e){
  684. this.setState({
  685. loading: true
  686. });
  687. $.ajax({
  688. method: "get",
  689. dataType: "json",
  690. crossDomain: false,
  691. url: globalConfig.context + '/api/admin/techproject/revokeOrComplete',
  692. data: {
  693. contractId:this.props.datauser.id,
  694. operatorType:e
  695. }
  696. }).done(function(data) {
  697. this.setState({
  698. loading: false
  699. });
  700. if(!data.error.length) {
  701. message.success('操作成功!');
  702. this.handleOk()
  703. } else {
  704. message.warning(data.error[0].message);
  705. }
  706. }.bind(this));
  707. },
  708. tableRowClick(record, index) {
  709. this.setState({
  710. addTaskState:false,
  711. addnextVisible:true,
  712. });
  713. this.orderDetails(record)
  714. },
  715. componentWillReceiveProps(nextProps) { //props改变时触发
  716. this.state.projectVisible = nextProps.newProject;
  717. this.state.visible = nextProps.showDesc;
  718. if(nextProps.userDetaile && nextProps.showDesc ) {
  719. if(nextProps.datauser && nextProps.datauser.id ) {
  720. this.loaduser(nextProps.datauser);
  721. this.loadData(nextProps.datauser);
  722. }
  723. }else{
  724. this.setState({
  725. customerArr:[],
  726. customerName:'',
  727. autoId:'',
  728. signComment:'',
  729. projectName:'',
  730. aid:''
  731. })
  732. }
  733. },
  734. render() {
  735. const FormItem = Form.Item
  736. const formItemLayout = {
  737. labelCol: { span: 8 },
  738. wrapperCol: { span: 14 },
  739. };
  740. const rowSelection = {
  741. selectedRowKey: this.state.selectedRowKey,
  742. onChange: (selectedRowKey, selectedRows) => {
  743. this.setState({
  744. selectedRows: selectedRows.slice(-1),
  745. selectedRowKey: selectedRowKey.slice(-1)
  746. });
  747. },
  748. onSelectAll: (selected, selectedRows, changeRows) => {
  749. this.setState({
  750. selectedRowKey:[]
  751. })
  752. },
  753. };
  754. //
  755. let departmentArr = this.props.departmentArr || [];
  756. const hasSelected = this.state.selectedRowKey.length > 0;
  757. const orderDetaiel=this.state.orderList || [];
  758. const dataSources=this.state.customerArr || [];
  759. const orderArr=this.state.orderArr ||[];
  760. const options = this.state.states?dataSources.map((group,index) =>
  761. <Select.Option key={index} value={group.name}>{group.name}</Select.Option>
  762. ):dataSources.map((group,index) =>
  763. <Select.Option key={index} value={group.bname}>{group.bname}</Select.Option>
  764. )
  765. return(
  766. <div>
  767. <Modal maskClosable={false} visible={this.state.visible}
  768. onOk={this.handleOk} onCancel={this.handleCancel}
  769. width='1000px'
  770. title={this.props.projectState?'项目管理':'编辑订单' }
  771. footer=''
  772. className="admin-desc-content">
  773. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} onSubmit={this.handleSubmit}>
  774. <Spin spinning={this.state.loading}>
  775. <div className="clearfix">
  776. <div className="clearfix">
  777. <FormItem className="half-item"
  778. {...formItemLayout}
  779. label="订单编号" >
  780. <span>{orderDetaiel.orderNo}</span>
  781. {orderDetaiel.orderNo&&<Button onClick={this.seeOrder} style={{float:'right',fontSize:'12px'}}>查看订单</Button>}
  782. </FormItem>
  783. <FormItem className="half-item"
  784. {...formItemLayout}
  785. label="项目编号" >
  786. <span>{orderDetaiel.serialNumber}</span>
  787. </FormItem>
  788. <FormItem className="half-item"
  789. {...formItemLayout}
  790. label="客户名称" >
  791. <span>{orderDetaiel.buyerName}</span>
  792. {orderDetaiel.buyerName&&<Button onClick={this.seeContract} style={{float:'right',fontSize:'12px'}}>查看联系人</Button>}
  793. </FormItem>
  794. <FormItem className="half-item"
  795. {...formItemLayout}
  796. label="项目类型" >
  797. <span>{getOrderType(orderDetaiel.projectType)}</span>
  798. </FormItem>
  799. <FormItem className="half-item"
  800. {...formItemLayout}
  801. label="项目负责人" >
  802. <span>{orderDetaiel.principalName}</span>
  803. </FormItem>
  804. <FormItem className="half-item"
  805. {...formItemLayout}
  806. label="项目状态" >
  807. <span>{getProjectState(orderDetaiel.projectStatus)}</span>
  808. </FormItem>
  809. <FormItem className="half-item"
  810. {...formItemLayout}
  811. label="是否锁定" >
  812. <span>{orderDetaiel.deleteSign==2?'锁定':'未锁定'}</span>
  813. </FormItem>
  814. <FormItem className="half-item"
  815. {...formItemLayout}
  816. label="立项时间" >
  817. <span>{orderDetaiel.signDate}</span>
  818. </FormItem>
  819. <div className='clearfix'>
  820. <FormItem
  821. labelCol={{ span: 4 }}
  822. wrapperCol={{ span: 16 }}
  823. label="立项说明" >
  824. <span>{orderDetaiel.signComment}</span>
  825. </FormItem>
  826. </div>
  827. </div>
  828. <div className='clearfix'>
  829. <FormItem className="half-item"
  830. {...formItemLayout}
  831. label="结项日期" >
  832. <span>{orderDetaiel.completeDate}</span>
  833. </FormItem>
  834. </div>
  835. <div className='clearfix'>
  836. <FormItem
  837. labelCol={{ span: 4 }}
  838. wrapperCol={{ span: 16 }}
  839. label="结项说明" >
  840. <span>{orderDetaiel.completeComment}</span>
  841. </FormItem>
  842. </div>
  843. <div className='clearfix'>
  844. <FormItem className="half-item"
  845. {...formItemLayout}
  846. label="是否作废" >
  847. <span>{orderDetaiel.deleteSign==1?'作废':'未作废'}</span>
  848. </FormItem>
  849. </div>
  850. <div>
  851. <span style={{marginLeft:'50px',fontSize:'20px'}}>项目任务</span>
  852. {!this.props.projectState&&<Button type='primary' onClick={this.addTask} style={{float:'right',marginRight:'100px'}}>添加任务</Button>}
  853. </div>
  854. <div className="patent-table">
  855. <Spin spinning={this.state.loading}>
  856. <Table columns={this.state.columns}
  857. dataSource={this.state.dataSource}
  858. pagination={false}
  859. onRowClick={this.tableRowClick}
  860. />
  861. </Spin>
  862. </div>
  863. {!this.props.projectState?<div>
  864. </div>:
  865. <div style={{marginTop:'30px',paddingLeft:'100px'}}>
  866. <Button type="danger" onClick={this.removeItem}>撤项</Button>
  867. <Button type="primary" onClick={this.Knot} style={{margin:'15px'}}>结项</Button>
  868. <Button type="ghost" onClick={this.handleCancel}>返回</Button>
  869. </div>}
  870. </div>
  871. </Spin>
  872. </Form >
  873. </Modal>
  874. <Modal maskClosable={false} visible={this.state.addnextVisible}
  875. onOk={this.nextCancel} onCancel={this.nextCancel}
  876. width='800px'
  877. title={this.state.addTaskState?'添加任务':'编辑任务'}
  878. footer=''
  879. className="admin-desc-content">
  880. <Form layout="horizontal" id="demand-form" onSubmit={this.taskSumbit}>
  881. <Spin spinning={this.state.loading}>
  882. {this.state.addTaskState?<div className="clearfix">
  883. <FormItem className="half-item"
  884. {...formItemLayout}
  885. label="服务项目名称" >
  886. <AutoComplete
  887. className="certain-category-search"
  888. dropdownClassName="certain-category-search-dropdown"
  889. dropdownMatchSelectWidth={false}
  890. dropdownStyle={{ width: 200 }}
  891. style={{ width: '200px' }}
  892. dataSource={options}
  893. placeholder="输入服务名称"
  894. value={this.state.commodityName}
  895. onChange={this.httpChange}
  896. filterOption={true}
  897. onSelect={this.selectAuto}
  898. >
  899. <Input/>
  900. </AutoComplete>
  901. <span className="mandatory">*</span>
  902. </FormItem>
  903. <FormItem className="half-item"
  904. {...formItemLayout}
  905. label="数量" >
  906. <Input style={{ width: '200px' }} placeholder="输入数量"
  907. value={this.state.commodityQuantity}
  908. onChange={(e)=>{this.setState({commodityQuantity:e.target.value})}}/>
  909. <span className="mandatory">*</span>
  910. </FormItem>
  911. <div className='clearfix'>
  912. <FormItem
  913. labelCol={{ span: 4 }}
  914. wrapperCol={{ span: 16 }}
  915. label="任务说明" >
  916. <Input type="textarea" placeholder="请输入订单留言" rows={4}
  917. value={this.state.taskComment}
  918. onChange={(e)=>{this.setState({taskComment:e.target.value})}}/>
  919. </FormItem>
  920. </div>
  921. </div>:
  922. <div className="clearfix">
  923. <FormItem className="half-item"
  924. {...formItemLayout}
  925. label="项目编号" >
  926. <span>{this.state.projectNo}</span>
  927. </FormItem>
  928. <FormItem className="half-item"
  929. {...formItemLayout}
  930. label="任务编号" >
  931. <span>{this.state.taskNo}</span>
  932. </FormItem>
  933. {this.state.taskStatus<1?<FormItem className="half-item"
  934. {...formItemLayout}
  935. label="服务项目名称" >
  936. <AutoComplete
  937. className="certain-category-search"
  938. dropdownClassName="certain-category-search-dropdown"
  939. dropdownMatchSelectWidth={false}
  940. dropdownStyle={{ width: 200 }}
  941. style={{ width: '200px' }}
  942. dataSource={options}
  943. placeholder="输入服务名称"
  944. value={this.state.commodityName}
  945. onChange={this.httpChange}
  946. filterOption={true}
  947. onSelect={this.selectAuto}
  948. >
  949. <Input/>
  950. </AutoComplete>
  951. <span className="mandatory">*</span>
  952. </FormItem>:
  953. <FormItem className="half-item"
  954. {...formItemLayout}
  955. label="服务项目名称" >
  956. <span>{this.state.commodityName}</span>
  957. </FormItem>}
  958. <FormItem className="half-item"
  959. {...formItemLayout}
  960. label="任务状态" >
  961. <span>{getTaskStatus(this.state.taskStatus)}</span>
  962. </FormItem>
  963. <FormItem className="half-item"
  964. {...formItemLayout}
  965. label="是否锁定" >
  966. <span>{this.state.deletedSign==2?'锁定':'未锁定'}</span>
  967. </FormItem>
  968. <div className='clearfix'>
  969. {this.state.taskStatus<1?<FormItem
  970. labelCol={{ span: 4 }}
  971. wrapperCol={{ span: 16 }}
  972. label="任务说明" >
  973. <Input type="textarea" placeholder="请输入订单留言" rows={4} value={this.state.taskComment}
  974. onChange={(e)=>{this.setState({taskComment:e.target.value})}}/>
  975. </FormItem>:
  976. <FormItem className="half-item"
  977. {...formItemLayout}
  978. label="任务说明" >
  979. <span>{this.state.taskComment}</span>
  980. </FormItem>}
  981. </div>
  982. <div className='clearfix'>
  983. <FormItem className="half-item"
  984. {...formItemLayout}
  985. label="派单人" >
  986. <span>{this.state.taskAllocatorName}</span>
  987. </FormItem>
  988. <FormItem className="half-item"
  989. {...formItemLayout}
  990. label="派单时间" >
  991. <span>{this.state.taskDistributionTime}</span>
  992. </FormItem>
  993. <FormItem className="half-item"
  994. {...formItemLayout}
  995. label="资料负责人" >
  996. <span>{this.state.taskReceiverName}</span>
  997. </FormItem>
  998. </div>
  999. </div>}
  1000. {this.state.taskStatus<1||this.state.addTaskState?<div className="clearfix" style={{marginBottom:'20px'}}>
  1001. <Button className="setSave" type="primary" htmlType="submit">保存</Button>
  1002. <Button className="cancel" type="ghost" onClick={this.nextCancel}>返回</Button>
  1003. </div>:''}
  1004. </Spin>
  1005. </Form >
  1006. </Modal>
  1007. <Modal maskClosable={false} visible={this.state.projectVisible}
  1008. onOk={this.projectOk} onCancel={this.projectCancel}
  1009. width='600px'
  1010. title='创建项目'
  1011. footer=''
  1012. className="admin-desc-content">
  1013. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} >
  1014. <Spin spinning={this.state.loading}>
  1015. <div className="clearfix">
  1016. <div className='clearfix'>
  1017. <div className="clearfix">
  1018. <FormItem
  1019. {...formItemLayout}
  1020. label="客户名称" >
  1021. <AutoComplete
  1022. className="certain-category-search"
  1023. dropdownClassName="certain-category-search-dropdown"
  1024. dropdownMatchSelectWidth={false}
  1025. dropdownStyle={{ width: 200 }}
  1026. size="large"
  1027. style={{ width: '200px' }}
  1028. dataSource={options}
  1029. placeholder="输入客户名称"
  1030. value={this.state.customerName}
  1031. onChange={this.customerChange}
  1032. filterOption={true}
  1033. onBlur={this.blurCutor}
  1034. onSelect={this.selectAutoCUT}
  1035. >
  1036. <Input/>
  1037. </AutoComplete>
  1038. <span className="mandatory">*</span>
  1039. </FormItem>
  1040. </div>
  1041. <div className='clearfix'>
  1042. <FormItem
  1043. {...formItemLayout}
  1044. label="项目负责人" >
  1045. <span style={{width:'150px'}}>{this.state.projectName}</span>
  1046. <Button onClick={this.confirmDelet} style={{float:'right',marginRight:'50px'}}>选择</Button>
  1047. </FormItem>
  1048. </div>
  1049. <div className='clearfix'>
  1050. <FormItem
  1051. labelCol={{ span: 8 }}
  1052. wrapperCol={{ span: 12 }}
  1053. label="项目说明" >
  1054. <Input type="textarea" placeholder="请输入签单备注" rows={4} value={this.state.signComment}
  1055. onChange={(e)=>{this.setState({signComment:e.target.value})}}/>
  1056. </FormItem>
  1057. </div>
  1058. </div>
  1059. </div>
  1060. <FormItem wrapperCol={{ span: 12, offset: 4 }} className="half-middle">
  1061. <Button type="primary" onClick={this.admissibleOrder} style={{marginLeft:'55px'}}>保存</Button>
  1062. <Button className="submitSave" type="ghost" onClick={this.projectCancel}>返回</Button>
  1063. </FormItem>
  1064. </Spin>
  1065. </Form >
  1066. </Modal>
  1067. <Modal maskClosable={false} visible={this.state.distributionVisible}
  1068. onOk={this.distributionOk} onCancel={this.distributionCancel}
  1069. width='800px'
  1070. title='分派财务订单'
  1071. footer=''
  1072. className="admin-desc-content">
  1073. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} >
  1074. <Spin spinning={this.state.loading}>
  1075. <div>
  1076. <Select placeholder="订单部门"
  1077. style={{ width: 150 ,marginRight:'10px',marginLeft:'10px'}}
  1078. value={this.state.departmenttList}
  1079. onChange={(e) => { this.setState({ departmenttList: e }) }}>
  1080. {
  1081. departmentArr.map(function (item) {
  1082. return <Select.Option key={item.id} >{item.name}</Select.Option>
  1083. })
  1084. }
  1085. </Select>
  1086. <Input placeholder="财务负责人" style={{width:'150px',marginLeft:'10px'}}
  1087. value={this.state.financeNameSearch}
  1088. onChange={(e) => { this.setState({ financeNameSearch: e.target.value }); }} />
  1089. <Button type="primary" onClick={this.searchOrder} style={{marginLeft:'10px',marginRight:'10px'}}>搜索</Button>
  1090. <Button onClick={this.resetOrder}>重置</Button>
  1091. </div>
  1092. <div className="patent-table" style={{marginTop:'10px'}}>
  1093. <Spin spinning={this.state.loading}>
  1094. <Table columns={this.state.userList}
  1095. dataSource={this.state.distributionList}
  1096. pagination={false}
  1097. />
  1098. </Spin>
  1099. </div>
  1100. </Spin>
  1101. </Form>
  1102. </Modal>
  1103. <Modal maskClosable={false} visible={this.state.orderVisible}
  1104. onOk={this.orderCancel} onCancel={this.orderCancel}
  1105. width='800px'
  1106. title={this.state.seeState?'查看订单':'查看联系人'}
  1107. footer=''
  1108. className="admin-desc-content">
  1109. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} >
  1110. <Spin spinning={this.state.loading}>
  1111. <div className="patent-table" style={{marginTop:'10px'}}>
  1112. <Spin spinning={this.state.loading}>
  1113. {this.state.seeState?
  1114. <div className="clearfix">
  1115. <FormItem className="half-item"
  1116. {...formItemLayout}
  1117. label="订单编号" >
  1118. <span>{orderArr.orderNo}</span>
  1119. </FormItem>
  1120. <FormItem className="half-item"
  1121. {...formItemLayout}
  1122. label="下单时间" >
  1123. <span>{orderArr.createTime}</span>
  1124. </FormItem>
  1125. <FormItem className="half-item"
  1126. {...formItemLayout}
  1127. label="客户名称" >
  1128. <span>{orderArr.buyerName}</span>
  1129. </FormItem>
  1130. <FormItem className="half-item"
  1131. {...formItemLayout}
  1132. label="订单类型" >
  1133. <span>{getOrderType(orderArr.orderType)}</span>
  1134. </FormItem>
  1135. <FormItem className="half-item"
  1136. {...formItemLayout}
  1137. label="订单渠道" >
  1138. <span>{getOrderChannel(orderArr.orderChannel)}</span>
  1139. </FormItem>
  1140. <FormItem className="half-item"
  1141. {...formItemLayout}
  1142. label="订单状态" >
  1143. <span>{getOrderState(orderArr.orderStatus)}</span>
  1144. </FormItem>
  1145. <FormItem className="half-item"
  1146. {...formItemLayout}
  1147. label="已收款项" >
  1148. <span>{orderArr.actuallyTotalAmount}</span>
  1149. </FormItem>
  1150. <FormItem className="half-item"
  1151. {...formItemLayout}
  1152. label="结算状态" >
  1153. <span>{getPaymentState(orderArr.liquidationStatus)}</span>
  1154. </FormItem>
  1155. <FormItem className="half-item"
  1156. {...formItemLayout}
  1157. label="市价订单金额" >
  1158. <span>{orderArr.orderAmount}</span>
  1159. </FormItem>
  1160. <FormItem className="half-item"
  1161. {...formItemLayout}
  1162. label="市价首款金额" >
  1163. <span>{orderArr.firstPayment}</span>
  1164. </FormItem>
  1165. <div className='clearfix'>
  1166. <FormItem className="half-item"
  1167. {...formItemLayout}
  1168. label="实签订单金额" >
  1169. <span>{orderArr.signTotalAmount}</span>
  1170. </FormItem>
  1171. <FormItem className="half-item"
  1172. {...formItemLayout}
  1173. label="实签首款金额" >
  1174. <span>{orderArr.signFirstPayment}</span>
  1175. </FormItem>
  1176. <FormItem className="half-item"
  1177. {...formItemLayout}
  1178. label="特批立项" >
  1179. <span>{getApprovedState(orderArr.approval)}</span>
  1180. </FormItem>
  1181. <div className="clearfix">
  1182. <FormItem
  1183. labelCol={{ span: 4 }}
  1184. wrapperCol={{ span: 18 }}
  1185. label="合同扫描件" >
  1186. <Upload className="demandDetailShow-upload"
  1187. listType="customer_sys_file"
  1188. fileList={this.state.orgCodeUrl}
  1189. onPreview={(file) => {
  1190. this.setState({
  1191. previewImage: file.url || file.thumbUrl,
  1192. previewVisible: true,
  1193. });
  1194. }} >
  1195. </Upload>
  1196. <Modal maskClosable={false} footer={null}
  1197. visible={this.state.previewVisible}
  1198. onCancel={() => { this.setState({ previewVisible: false }) }}>
  1199. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  1200. </Modal>
  1201. </FormItem>
  1202. </div>
  1203. <div className='clearfix'>
  1204. <FormItem
  1205. labelCol={{ span: 4 }}
  1206. wrapperCol={{ span: 16 }}
  1207. label="订单留言" >
  1208. <span>{orderArr.orderRemarks}</span>
  1209. </FormItem>
  1210. </div>
  1211. </div>
  1212. </div>:
  1213. <Table columns={this.state.contractList}
  1214. dataSource={this.state.contractArr}
  1215. pagination={false}
  1216. />}
  1217. </Spin>
  1218. </div>
  1219. </Spin>
  1220. </Form>
  1221. </Modal>
  1222. </div>
  1223. )
  1224. }
  1225. }));
  1226. export default MySettlementDetaile;