projectManageDetaile.jsx 47 KB

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