projectManageDetaile.jsx 47 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228
  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. this.setState({
  399. loading: true
  400. });
  401. $.ajax({
  402. method: "POST",
  403. dataType: "json",
  404. crossDomain: false,
  405. url: globalConfig.context + '/api/admin/techproject/createProject',
  406. data: {
  407. uid:this.state.autoId,
  408. signComment:this.state.signComment,
  409. aid:this.state.aid
  410. }
  411. }).done(function(data) {
  412. this.setState({
  413. loading: false
  414. });
  415. if(!data.error.length) {
  416. message.success('创建成功!');
  417. this.projectOk()
  418. } else {
  419. message.warning(data.error[0].message);
  420. }
  421. }.bind(this));
  422. },
  423. //派单
  424. //操作分配
  425. confirmDelet(index){
  426. this.setState({
  427. taskIds:index.taskId,
  428. userDetaile:false,
  429. distributionVisible:true
  430. });
  431. },
  432. distributionCancel(){
  433. this.setState({
  434. distributionVisible:false
  435. })
  436. },
  437. distributionOk(){
  438. this.setState({
  439. distributionVisible:false
  440. })
  441. },
  442. //分配对象列表
  443. contactList(){
  444. $.ajax({
  445. method: "get",
  446. dataType: "json",
  447. crossDomain: false,
  448. url: globalConfig.context + '/api/admin/superviser/adminList',
  449. data: {
  450. pageNo: 1,
  451. pageSize: 99,
  452. departmentId:this.state.departmenttList,
  453. name:this.state.financeNameSearch,
  454. },
  455. success: function (data) {
  456. let theArr = [];
  457. if (!data.data) {
  458. if (data.error && data.error.length) {
  459. message.warning(data.error[0].message);
  460. };
  461. } else {
  462. for (let i = 0; i < data.data.list.length; i++) {
  463. let thisdata = data.data.list[i];
  464. theArr.push({
  465. key: i,
  466. id: thisdata.id,
  467. userNo: thisdata.userNo,
  468. name:thisdata.name,
  469. departmentName:thisdata.departmentName,
  470. departmentId:thisdata.departmentId,
  471. position:thisdata.position,
  472. mobile:thisdata.mobile,
  473. });
  474. };
  475. };
  476. this.setState({
  477. distributionList: theArr,
  478. });
  479. }.bind(this),
  480. }).always(function () {
  481. this.setState({
  482. loading: false
  483. });
  484. }.bind(this));
  485. },
  486. //选定对象
  487. confirmSelect(record){
  488. if(this.state.projectVisible){
  489. this.setState({
  490. aid:record.id,
  491. projectName:record.name
  492. })
  493. this.distributionOk();
  494. return false
  495. }
  496. this.setState({
  497. loading: true
  498. });
  499. $.ajax({
  500. method: "POST",
  501. dataType: "json",
  502. crossDomain: false,
  503. url: globalConfig.context + "/api/admin/techproject/distributionTask",
  504. data: {
  505. taskId:this.state.taskIds,
  506. taskReceiverId:record.id
  507. }
  508. }).done(function (data) {
  509. if (!data.error.length) {
  510. message.success('分派成功!');
  511. this.setState({
  512. loading: false,
  513. });
  514. this.distributionOk();
  515. this.loadData();
  516. } else {
  517. message.warning(data.error[0].message);
  518. };
  519. }.bind(this));
  520. },
  521. searchOrder(){
  522. this.contactList();
  523. },
  524. resetOrder(){
  525. this.state.departmenttList=undefined;
  526. this.state.financeNameSearch='';
  527. this.setState({
  528. distributionList:[]
  529. })
  530. },
  531. //添加任务
  532. addTask(){
  533. this.setState({
  534. commodityQuantity:'',
  535. commodityName:'',
  536. taskComment:'',
  537. kid:'',
  538. commodityId:undefined,
  539. addTaskState:true,
  540. addnextVisible:true,
  541. customerArr:[]
  542. });
  543. },
  544. //客户名称自动补全
  545. //加载(自动补全)
  546. supervisor(e,state){ //客户名称与服务名称自动补全
  547. let api=state?'/api/admin/customer/findCustomerByName':'/api/admin/order/getBusinessProjectByName';
  548. $.ajax({
  549. method: "get",
  550. dataType: "json",
  551. crossDomain: false,
  552. url: globalConfig.context + api,
  553. data:state?{
  554. name:e
  555. }:{
  556. businessName:e
  557. },
  558. success: function (data) {
  559. let thedata=data.data;
  560. if (!thedata) {
  561. if (data.error && data.error.length) {
  562. message.warning(data.error[0].message);
  563. };
  564. thedata = {};
  565. };
  566. this.setState({
  567. states:state,
  568. customerArr:thedata,
  569. });
  570. }.bind(this),
  571. }).always(function () {
  572. this.setState({
  573. loading: false
  574. });
  575. }.bind(this));
  576. },
  577. //服务值改变时请求客户名称
  578. httpChange(e){
  579. if(e.length>=2){
  580. this.supervisor(e,false);
  581. }
  582. this.setState({
  583. commodityName:e
  584. })
  585. },
  586. //上级主管输入框失去焦点是判断客户是否存在
  587. selectAuto(value){
  588. let kid=[];
  589. let fwList=this.state.customerArr;
  590. fwList.map(function(item){
  591. if(value==item.bname){
  592. kid=item.id
  593. }
  594. })
  595. this.setState({
  596. kid:kid,
  597. commodityName:value,
  598. })
  599. },
  600. customerChange(e){
  601. if(e.length>=2){
  602. this.supervisor(e,true);
  603. }
  604. this.setState({
  605. customerName:e
  606. })
  607. },
  608. //客户
  609. selectAutoCUT(value){
  610. let autoIds;
  611. let fwList=this.state.customerArr;
  612. fwList.map(function(item){
  613. if(value==item.name){
  614. autoIds=item.id
  615. }
  616. })
  617. this.setState({
  618. customerName:value,
  619. autoId:autoIds
  620. })
  621. },
  622. //任务新建、编辑保存
  623. taskSumbit(e) {
  624. e.preventDefault();
  625. if(this.state.addTaskState){
  626. if(!this.state.kid){
  627. message.warning('请输入服务项目名称');
  628. return false;
  629. };
  630. if(!this.state.commodityQuantity){
  631. message.warning('请输入数量');
  632. return false;
  633. };
  634. }
  635. this.props.form.validateFields((err, values) => {
  636. if(!err) {
  637. this.setState({
  638. loading: true
  639. });
  640. let api=this.state.addTaskState?'/api/admin/techproject/addProjectTask':'/api/admin/techproject/updateProjectTask';
  641. $.ajax({
  642. method: "POST",
  643. dataType: "json",
  644. crossDomain: false,
  645. url: globalConfig.context + api,
  646. data: this.state.addTaskState?{
  647. contractId:this.props.datauser.id,
  648. commodityId:this.state.kid,
  649. commodityName:this.state.commodityName,
  650. commodityQuantity:this.state.commodityQuantity,
  651. taskComment:this.state.taskComment,
  652. }:{
  653. taskId:this.state.taskId,
  654. commodityId:this.state.kid?this.state.kid:this.state.commodityId,
  655. taskComment:this.state.taskComment
  656. }
  657. }).done(function(data) {
  658. this.setState({
  659. loading: false
  660. });
  661. if(!data.error.length) {
  662. message.success('保存成功!');
  663. this.nextCancel();
  664. this.loadData();
  665. } else {
  666. message.warning(data.error[0].message);
  667. }
  668. }.bind(this));
  669. }
  670. });
  671. },
  672. //任务项目各种骚操作
  673. removeItem(){ //撤项
  674. this.removeList(0)
  675. },
  676. Knot(){ //结项
  677. this.removeList(1)
  678. },
  679. removeList(e){
  680. this.setState({
  681. loading: true
  682. });
  683. $.ajax({
  684. method: "get",
  685. dataType: "json",
  686. crossDomain: false,
  687. url: globalConfig.context + '/api/admin/techproject/revokeOrComplete',
  688. data: {
  689. contractId:this.props.datauser.id,
  690. operatorType:e
  691. }
  692. }).done(function(data) {
  693. this.setState({
  694. loading: false
  695. });
  696. if(!data.error.length) {
  697. message.success('操作成功!');
  698. this.handleOk()
  699. } else {
  700. message.warning(data.error[0].message);
  701. }
  702. }.bind(this));
  703. },
  704. tableRowClick(record, index) {
  705. this.setState({
  706. addTaskState:false,
  707. addnextVisible:true,
  708. });
  709. this.orderDetails(record)
  710. },
  711. componentWillReceiveProps(nextProps) { //props改变时触发
  712. this.state.projectVisible = nextProps.newProject;
  713. this.state.visible = nextProps.showDesc;
  714. if(nextProps.userDetaile && nextProps.showDesc ) {
  715. if(nextProps.datauser && nextProps.datauser.id ) {
  716. this.loaduser(nextProps.datauser);
  717. this.loadData(nextProps.datauser);
  718. }
  719. }else{
  720. this.setState({
  721. customerArr:[],
  722. customerName:'',
  723. autoId:'',
  724. signComment:'',
  725. projectName:'',
  726. aid:''
  727. })
  728. }
  729. },
  730. render() {
  731. const FormItem = Form.Item
  732. const formItemLayout = {
  733. labelCol: { span: 8 },
  734. wrapperCol: { span: 14 },
  735. };
  736. const rowSelection = {
  737. selectedRowKey: this.state.selectedRowKey,
  738. onChange: (selectedRowKey, selectedRows) => {
  739. this.setState({
  740. selectedRows: selectedRows.slice(-1),
  741. selectedRowKey: selectedRowKey.slice(-1)
  742. });
  743. },
  744. onSelectAll: (selected, selectedRows, changeRows) => {
  745. this.setState({
  746. selectedRowKey:[]
  747. })
  748. },
  749. };
  750. //
  751. let departmentArr = this.props.departmentArr || [];
  752. const hasSelected = this.state.selectedRowKey.length > 0;
  753. const orderDetaiel=this.state.orderList || [];
  754. const dataSources=this.state.customerArr || [];
  755. const orderArr=this.state.orderArr ||[];
  756. const options = this.state.states?dataSources.map((group,index) =>
  757. <Select.Option key={index} value={group.name}>{group.name}</Select.Option>
  758. ):dataSources.map((group,index) =>
  759. <Select.Option key={index} value={group.bname}>{group.bname}</Select.Option>
  760. )
  761. return(
  762. <div>
  763. <Modal maskClosable={false} visible={this.state.visible}
  764. onOk={this.handleOk} onCancel={this.handleCancel}
  765. width='1000px'
  766. title={this.props.projectState?'项目管理':'编辑订单' }
  767. footer=''
  768. className="admin-desc-content">
  769. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} onSubmit={this.handleSubmit}>
  770. <Spin spinning={this.state.loading}>
  771. <div className="clearfix">
  772. <div className="clearfix">
  773. <FormItem className="half-item"
  774. {...formItemLayout}
  775. label="订单编号" >
  776. <span>{orderDetaiel.orderNo}</span>
  777. {orderDetaiel.orderNo&&<Button onClick={this.seeOrder} style={{float:'right',fontSize:'12px'}}>查看订单</Button>}
  778. </FormItem>
  779. <FormItem className="half-item"
  780. {...formItemLayout}
  781. label="项目编号" >
  782. <span>{orderDetaiel.serialNumber}</span>
  783. </FormItem>
  784. <FormItem className="half-item"
  785. {...formItemLayout}
  786. label="客户名称" >
  787. <span>{orderDetaiel.buyerName}</span>
  788. {orderDetaiel.buyerName&&<Button onClick={this.seeContract} style={{float:'right',fontSize:'12px'}}>查看联系人</Button>}
  789. </FormItem>
  790. <FormItem className="half-item"
  791. {...formItemLayout}
  792. label="项目类型" >
  793. <span>{getOrderType(orderDetaiel.projectType)}</span>
  794. </FormItem>
  795. <FormItem className="half-item"
  796. {...formItemLayout}
  797. label="项目负责人" >
  798. <span>{orderDetaiel.principalName}</span>
  799. </FormItem>
  800. <FormItem className="half-item"
  801. {...formItemLayout}
  802. label="项目状态" >
  803. <span>{getProjectState(orderDetaiel.projectStatus)}</span>
  804. </FormItem>
  805. <FormItem className="half-item"
  806. {...formItemLayout}
  807. label="是否锁定" >
  808. <span>{orderDetaiel.deleteSign==2?'锁定':'未锁定'}</span>
  809. </FormItem>
  810. <FormItem className="half-item"
  811. {...formItemLayout}
  812. label="立项时间" >
  813. <span>{orderDetaiel.signDate}</span>
  814. </FormItem>
  815. <div className='clearfix'>
  816. <FormItem
  817. labelCol={{ span: 4 }}
  818. wrapperCol={{ span: 16 }}
  819. label="立项说明" >
  820. <span>{orderDetaiel.signComment}</span>
  821. </FormItem>
  822. </div>
  823. </div>
  824. <div className='clearfix'>
  825. <FormItem className="half-item"
  826. {...formItemLayout}
  827. label="结项日期" >
  828. <span>{orderDetaiel.completeDate}</span>
  829. </FormItem>
  830. </div>
  831. <div className='clearfix'>
  832. <FormItem
  833. labelCol={{ span: 4 }}
  834. wrapperCol={{ span: 16 }}
  835. label="结项说明" >
  836. <span>{orderDetaiel.completeComment}</span>
  837. </FormItem>
  838. </div>
  839. <div className='clearfix'>
  840. <FormItem className="half-item"
  841. {...formItemLayout}
  842. label="是否作废" >
  843. <span>{orderDetaiel.deleteSign==1?'作废':'未作废'}</span>
  844. </FormItem>
  845. </div>
  846. <div>
  847. <span style={{marginLeft:'50px',fontSize:'20px'}}>项目任务</span>
  848. {!this.props.projectState&&<Button type='primary' onClick={this.addTask} style={{float:'right',marginRight:'100px'}}>添加任务</Button>}
  849. </div>
  850. <div className="patent-table">
  851. <Spin spinning={this.state.loading}>
  852. <Table columns={this.state.columns}
  853. dataSource={this.state.dataSource}
  854. pagination={false}
  855. onRowClick={this.tableRowClick}
  856. />
  857. </Spin>
  858. </div>
  859. {!this.props.projectState?<div>
  860. </div>:
  861. <div style={{marginTop:'30px',paddingLeft:'100px'}}>
  862. <Button type="danger" onClick={this.removeItem}>撤项</Button>
  863. <Button type="primary" onClick={this.Knot} style={{margin:'15px'}}>结项</Button>
  864. <Button type="ghost" onClick={this.handleCancel}>返回</Button>
  865. </div>}
  866. </div>
  867. </Spin>
  868. </Form >
  869. </Modal>
  870. <Modal maskClosable={false} visible={this.state.addnextVisible}
  871. onOk={this.nextCancel} onCancel={this.nextCancel}
  872. width='800px'
  873. title={this.state.addTaskState?'添加任务':'编辑任务'}
  874. footer=''
  875. className="admin-desc-content">
  876. <Form layout="horizontal" id="demand-form" onSubmit={this.taskSumbit}>
  877. <Spin spinning={this.state.loading}>
  878. {this.state.addTaskState?<div className="clearfix">
  879. <FormItem className="half-item"
  880. {...formItemLayout}
  881. label="服务项目名称" >
  882. <AutoComplete
  883. className="certain-category-search"
  884. dropdownClassName="certain-category-search-dropdown"
  885. dropdownMatchSelectWidth={false}
  886. dropdownStyle={{ width: 200 }}
  887. style={{ width: '200px' }}
  888. dataSource={options}
  889. placeholder="输入服务名称"
  890. value={this.state.commodityName}
  891. onChange={this.httpChange}
  892. filterOption={true}
  893. onSelect={this.selectAuto}
  894. >
  895. <Input/>
  896. </AutoComplete>
  897. <span className="mandatory">*</span>
  898. </FormItem>
  899. <FormItem className="half-item"
  900. {...formItemLayout}
  901. label="数量" >
  902. <Input style={{ width: '200px' }} placeholder="输入数量"
  903. value={this.state.commodityQuantity}
  904. onChange={(e)=>{this.setState({commodityQuantity:e.target.value})}}/>
  905. <span className="mandatory">*</span>
  906. </FormItem>
  907. <div className='clearfix'>
  908. <FormItem
  909. labelCol={{ span: 4 }}
  910. wrapperCol={{ span: 16 }}
  911. label="任务说明" >
  912. <Input type="textarea" placeholder="请输入订单留言" rows={4}
  913. value={this.state.taskComment}
  914. onChange={(e)=>{this.setState({taskComment:e.target.value})}}/>
  915. </FormItem>
  916. </div>
  917. </div>:
  918. <div className="clearfix">
  919. <FormItem className="half-item"
  920. {...formItemLayout}
  921. label="项目编号" >
  922. <span>{this.state.projectNo}</span>
  923. </FormItem>
  924. <FormItem className="half-item"
  925. {...formItemLayout}
  926. label="任务编号" >
  927. <span>{this.state.taskNo}</span>
  928. </FormItem>
  929. {this.state.taskStatus<1?<FormItem className="half-item"
  930. {...formItemLayout}
  931. label="服务项目名称" >
  932. <AutoComplete
  933. className="certain-category-search"
  934. dropdownClassName="certain-category-search-dropdown"
  935. dropdownMatchSelectWidth={false}
  936. dropdownStyle={{ width: 200 }}
  937. style={{ width: '200px' }}
  938. dataSource={options}
  939. placeholder="输入服务名称"
  940. value={this.state.commodityName}
  941. onChange={this.httpChange}
  942. filterOption={true}
  943. onSelect={this.selectAuto}
  944. >
  945. <Input/>
  946. </AutoComplete>
  947. <span className="mandatory">*</span>
  948. </FormItem>:
  949. <FormItem className="half-item"
  950. {...formItemLayout}
  951. label="服务项目名称" >
  952. <span>{this.state.commodityName}</span>
  953. </FormItem>}
  954. <FormItem className="half-item"
  955. {...formItemLayout}
  956. label="任务状态" >
  957. <span>{getTaskStatus(this.state.taskStatus)}</span>
  958. </FormItem>
  959. <FormItem className="half-item"
  960. {...formItemLayout}
  961. label="是否锁定" >
  962. <span>{this.state.deletedSign==2?'锁定':'未锁定'}</span>
  963. </FormItem>
  964. <div className='clearfix'>
  965. {this.state.taskStatus<1?<FormItem
  966. labelCol={{ span: 4 }}
  967. wrapperCol={{ span: 16 }}
  968. label="任务说明" >
  969. <Input type="textarea" placeholder="请输入订单留言" rows={4} value={this.state.taskComment}
  970. onChange={(e)=>{this.setState({taskComment:e.target.value})}}/>
  971. </FormItem>:
  972. <FormItem className="half-item"
  973. {...formItemLayout}
  974. label="任务说明" >
  975. <span>{this.state.taskComment}</span>
  976. </FormItem>}
  977. </div>
  978. <div className='clearfix'>
  979. <FormItem className="half-item"
  980. {...formItemLayout}
  981. label="派单人" >
  982. <span>{this.state.taskAllocatorName}</span>
  983. </FormItem>
  984. <FormItem className="half-item"
  985. {...formItemLayout}
  986. label="派单时间" >
  987. <span>{this.state.taskDistributionTime}</span>
  988. </FormItem>
  989. <FormItem className="half-item"
  990. {...formItemLayout}
  991. label="资料负责人" >
  992. <span>{this.state.taskReceiverName}</span>
  993. </FormItem>
  994. </div>
  995. </div>}
  996. {this.state.taskStatus<1||this.state.addTaskState?<div className="clearfix" style={{marginBottom:'20px'}}>
  997. <Button className="setSave" type="primary" htmlType="submit">保存</Button>
  998. <Button className="cancel" type="ghost" onClick={this.nextCancel}>返回</Button>
  999. </div>:''}
  1000. </Spin>
  1001. </Form >
  1002. </Modal>
  1003. <Modal maskClosable={false} visible={this.state.projectVisible}
  1004. onOk={this.projectOk} onCancel={this.projectCancel}
  1005. width='600px'
  1006. title='创建项目'
  1007. footer=''
  1008. className="admin-desc-content">
  1009. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} >
  1010. <Spin spinning={this.state.loading}>
  1011. <div className="clearfix">
  1012. <div className='clearfix'>
  1013. <div className="clearfix">
  1014. <FormItem
  1015. {...formItemLayout}
  1016. label="客户名称" >
  1017. <AutoComplete
  1018. className="certain-category-search"
  1019. dropdownClassName="certain-category-search-dropdown"
  1020. dropdownMatchSelectWidth={false}
  1021. dropdownStyle={{ width: 200 }}
  1022. size="large"
  1023. style={{ width: '200px' }}
  1024. dataSource={options}
  1025. placeholder="输入客户名称"
  1026. value={this.state.customerName}
  1027. onChange={this.customerChange}
  1028. filterOption={true}
  1029. onBlur={this.blurCutor}
  1030. onSelect={this.selectAutoCUT}
  1031. >
  1032. <Input/>
  1033. </AutoComplete>
  1034. <span className="mandatory">*</span>
  1035. </FormItem>
  1036. </div>
  1037. <div className='clearfix'>
  1038. <FormItem
  1039. {...formItemLayout}
  1040. label="项目负责人" >
  1041. <span style={{width:'150px'}}>{this.state.projectName}</span>
  1042. <Button onClick={this.confirmDelet} style={{float:'right',marginRight:'50px'}}>选择</Button>
  1043. </FormItem>
  1044. </div>
  1045. <div className='clearfix'>
  1046. <FormItem
  1047. labelCol={{ span: 8 }}
  1048. wrapperCol={{ span: 12 }}
  1049. label="项目说明" >
  1050. <Input type="textarea" placeholder="请输入签单备注" rows={4} value={this.state.signComment}
  1051. onChange={(e)=>{this.setState({signComment:e.target.value})}}/>
  1052. </FormItem>
  1053. </div>
  1054. </div>
  1055. </div>
  1056. <FormItem wrapperCol={{ span: 12, offset: 4 }} className="half-middle">
  1057. <Button type="primary" onClick={this.admissibleOrder} style={{marginLeft:'55px'}}>保存</Button>
  1058. <Button className="submitSave" type="ghost" onClick={this.projectCancel}>返回</Button>
  1059. </FormItem>
  1060. </Spin>
  1061. </Form >
  1062. </Modal>
  1063. <Modal maskClosable={false} visible={this.state.distributionVisible}
  1064. onOk={this.distributionOk} onCancel={this.distributionCancel}
  1065. width='800px'
  1066. title='分派财务订单'
  1067. footer=''
  1068. className="admin-desc-content">
  1069. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} >
  1070. <Spin spinning={this.state.loading}>
  1071. <div>
  1072. <Select placeholder="订单部门"
  1073. style={{ width: 150 ,marginRight:'10px',marginLeft:'10px'}}
  1074. value={this.state.departmenttList}
  1075. onChange={(e) => { this.setState({ departmenttList: e }) }}>
  1076. {
  1077. departmentArr.map(function (item) {
  1078. return <Select.Option key={item.id} >{item.name}</Select.Option>
  1079. })
  1080. }
  1081. </Select>
  1082. <Input placeholder="财务负责人" style={{width:'150px',marginLeft:'10px'}}
  1083. value={this.state.financeNameSearch}
  1084. onChange={(e) => { this.setState({ financeNameSearch: e.target.value }); }} />
  1085. <Button type="primary" onClick={this.searchOrder} style={{marginLeft:'10px',marginRight:'10px'}}>搜索</Button>
  1086. <Button onClick={this.resetOrder}>重置</Button>
  1087. </div>
  1088. <div className="patent-table" style={{marginTop:'10px'}}>
  1089. <Spin spinning={this.state.loading}>
  1090. <Table columns={this.state.userList}
  1091. dataSource={this.state.distributionList}
  1092. pagination={false}
  1093. />
  1094. </Spin>
  1095. </div>
  1096. </Spin>
  1097. </Form>
  1098. </Modal>
  1099. <Modal maskClosable={false} visible={this.state.orderVisible}
  1100. onOk={this.orderCancel} onCancel={this.orderCancel}
  1101. width='800px'
  1102. title={this.state.seeState?'查看订单':'查看联系人'}
  1103. footer=''
  1104. className="admin-desc-content">
  1105. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} >
  1106. <Spin spinning={this.state.loading}>
  1107. <div className="patent-table" style={{marginTop:'10px'}}>
  1108. <Spin spinning={this.state.loading}>
  1109. {this.state.seeState?
  1110. <div className="clearfix">
  1111. <FormItem className="half-item"
  1112. {...formItemLayout}
  1113. label="订单编号" >
  1114. <span>{orderArr.orderNo}</span>
  1115. </FormItem>
  1116. <FormItem className="half-item"
  1117. {...formItemLayout}
  1118. label="下单时间" >
  1119. <span>{orderArr.createTime}</span>
  1120. </FormItem>
  1121. <FormItem className="half-item"
  1122. {...formItemLayout}
  1123. label="客户名称" >
  1124. <span>{orderArr.buyerName}</span>
  1125. </FormItem>
  1126. <FormItem className="half-item"
  1127. {...formItemLayout}
  1128. label="订单类型" >
  1129. <span>{getOrderType(orderArr.orderType)}</span>
  1130. </FormItem>
  1131. <FormItem className="half-item"
  1132. {...formItemLayout}
  1133. label="订单渠道" >
  1134. <span>{getOrderChannel(orderArr.orderChannel)}</span>
  1135. </FormItem>
  1136. <FormItem className="half-item"
  1137. {...formItemLayout}
  1138. label="订单状态" >
  1139. <span>{getOrderState(orderArr.orderStatus)}</span>
  1140. </FormItem>
  1141. <FormItem className="half-item"
  1142. {...formItemLayout}
  1143. label="已收款项" >
  1144. <span>{orderArr.actuallyTotalAmount}</span>
  1145. </FormItem>
  1146. <FormItem className="half-item"
  1147. {...formItemLayout}
  1148. label="结算状态" >
  1149. <span>{getPaymentState(orderArr.liquidationStatus)}</span>
  1150. </FormItem>
  1151. <FormItem className="half-item"
  1152. {...formItemLayout}
  1153. label="市价订单金额" >
  1154. <span>{orderArr.orderAmount}</span>
  1155. </FormItem>
  1156. <FormItem className="half-item"
  1157. {...formItemLayout}
  1158. label="市价首款金额" >
  1159. <span>{orderArr.firstPayment}</span>
  1160. </FormItem>
  1161. <div className='clearfix'>
  1162. <FormItem className="half-item"
  1163. {...formItemLayout}
  1164. label="实签订单金额" >
  1165. <span>{orderArr.signTotalAmount}</span>
  1166. </FormItem>
  1167. <FormItem className="half-item"
  1168. {...formItemLayout}
  1169. label="实签首款金额" >
  1170. <span>{orderArr.signFirstPayment}</span>
  1171. </FormItem>
  1172. <FormItem className="half-item"
  1173. {...formItemLayout}
  1174. label="特批立项" >
  1175. <span>{getApprovedState(orderArr.approval)}</span>
  1176. </FormItem>
  1177. <div className="clearfix">
  1178. <FormItem
  1179. labelCol={{ span: 4 }}
  1180. wrapperCol={{ span: 18 }}
  1181. label="合同扫描件" >
  1182. <Upload className="demandDetailShow-upload"
  1183. listType="customer_sys_file"
  1184. fileList={this.state.orgCodeUrl}
  1185. onPreview={(file) => {
  1186. this.setState({
  1187. previewImage: file.url || file.thumbUrl,
  1188. previewVisible: true,
  1189. });
  1190. }} >
  1191. </Upload>
  1192. <Modal maskClosable={false} footer={null}
  1193. visible={this.state.previewVisible}
  1194. onCancel={() => { this.setState({ previewVisible: false }) }}>
  1195. <img alt="" style={{ width: '100%' }} src={this.state.previewImage || ''} />
  1196. </Modal>
  1197. </FormItem>
  1198. </div>
  1199. <div className='clearfix'>
  1200. <FormItem
  1201. labelCol={{ span: 4 }}
  1202. wrapperCol={{ span: 16 }}
  1203. label="订单留言" >
  1204. <span>{orderArr.orderRemarks}</span>
  1205. </FormItem>
  1206. </div>
  1207. </div>
  1208. </div>:
  1209. <Table columns={this.state.contractList}
  1210. dataSource={this.state.contractArr}
  1211. pagination={false}
  1212. />}
  1213. </Spin>
  1214. </div>
  1215. </Spin>
  1216. </Form>
  1217. </Modal>
  1218. </div>
  1219. )
  1220. }
  1221. }));
  1222. export default MySettlementDetaile;