projectManageDetaile.jsx 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452
  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,publishStatus} from '../../../../dataDic.js';
  7. import {getOrderType,getProjectState,getTaskStatus,getPublishStatus,getOrderChannel,getOrderState,getPaymentState,getApprovedState} from '../../../../tools.js';
  8. const MySettlementDetaile = Form.create()(React.createClass({
  9. getInitialState() {
  10. return {
  11. loading: false,
  12. visible: false,
  13. //派单
  14. contractList:[
  15. {
  16. title: '姓名',
  17. dataIndex: 'name',
  18. key: 'name'
  19. }, {
  20. title: '部门',
  21. dataIndex: 'depatrment',
  22. key: 'depatrment'
  23. },{
  24. title: '联系方式',
  25. dataIndex: 'mobile',
  26. key: 'mobile'
  27. },{
  28. title: '是否为主要联系人',
  29. dataIndex: 'major',
  30. key: 'major',
  31. render:(text) => {
  32. return text?'是':"否"
  33. }
  34. }, {
  35. title: '职务',
  36. dataIndex: 'position',
  37. key: 'position'
  38. },{
  39. title: '微信',
  40. dataIndex: 'wechat',
  41. key: 'wechat'
  42. },{
  43. title: 'QQ',
  44. dataIndex: 'qq',
  45. key: 'qq'
  46. },
  47. ],
  48. };
  49. },
  50. //查看基本详情基本信息
  51. loaduser(record){
  52. if(record){
  53. $.ajax({
  54. method: "get",
  55. dataType: "json",
  56. crossDomain: false,
  57. url: globalConfig.context + '/api/admin/techproject/getProjectTaskDetail',
  58. data: {
  59. taskId: record.taskId
  60. },
  61. success: function (data) {
  62. let thisData = data.data;
  63. if (!thisData) {
  64. if (data.error && data.error.length) {
  65. message.warning(data.error[0].message);
  66. };
  67. thisData = {};
  68. };
  69. this.setState({
  70. orderNo:thisData.orderNo,
  71. orderList:thisData,
  72. uid:thisData.uid,
  73. taskId:thisData.taskId,
  74. publishStatus:thisData.publishStatus,
  75. });
  76. }.bind(this),
  77. }).always(function () {
  78. this.setState({
  79. loading: false
  80. });
  81. }.bind(this));
  82. }
  83. },
  84. //查看订单
  85. seeOrder(){
  86. this.setState({
  87. seeOrderVisible:true
  88. })
  89. this.seeOrderList();
  90. },
  91. seeOrderCancel(){
  92. this.setState({
  93. seeOrderVisible:false
  94. })
  95. },
  96. seeOrderList(){
  97. this.state.lookOrderList=[];
  98. $.ajax({
  99. method: "get",
  100. dataType: "json",
  101. crossDomain: false,
  102. url: globalConfig.context + '/api/admin/order/getServiceOrderDetail',
  103. data: {
  104. orderNo: this.state.orderNo
  105. },
  106. success: function (data) {
  107. let thisData = data.data;
  108. if (!thisData) {
  109. if (data.error && data.error.length) {
  110. message.warning(data.error[0].message);
  111. };
  112. thisData = {};
  113. };
  114. this.setState({
  115. id:thisData.id,
  116. lookOrderList:thisData,
  117. });
  118. }.bind(this),
  119. }).always(function () {
  120. this.setState({
  121. loading: false
  122. });
  123. }.bind(this));
  124. },
  125. //点击查看联系人
  126. seeContract(){
  127. this.contract();
  128. this.setState({
  129. seeState:false,
  130. orderVisible:true
  131. })
  132. },
  133. orderCancel(){
  134. this.setState({
  135. orderVisible:false
  136. })
  137. },
  138. //查看联系人
  139. contract(){
  140. $.ajax({
  141. method: "get",
  142. dataType: "json",
  143. crossDomain: false,
  144. url: globalConfig.context + '/api/admin/customer/findAllContacts',
  145. data: {
  146. uid: this.state.uid
  147. },
  148. success: function (data) {
  149. let thisData = data.data;
  150. if (!thisData) {
  151. if (data.error && data.error.length) {
  152. message.warning(data.error[0].message);
  153. };
  154. thisData = {};
  155. };
  156. this.setState({
  157. contractArr:thisData,
  158. });
  159. }.bind(this),
  160. }).always(function () {
  161. this.setState({
  162. loading: false
  163. });
  164. }.bind(this));
  165. },
  166. //修改公示状态
  167. changePublishStatus(){
  168. $.ajax({
  169. method: "post",
  170. dataType: "json",
  171. crossDomain: false,
  172. url: globalConfig.context + '/api/admin/techproject/updatePublishStatus',
  173. data: {
  174. taskId:this.state.taskId,
  175. publishStatus:this.state.publishStatus,
  176. },
  177. success: function (data) {
  178. let thisData = data.data;
  179. if (!thisData) {
  180. if (data.error && data.error.length) {
  181. message.warning(data.error[0].message);
  182. };
  183. thisData = {};
  184. }
  185. message.success('修改成功');
  186. }.bind(this),
  187. })
  188. },
  189. componentWillMount() {
  190. },
  191. componentWillReceiveProps(nextProps) { //props改变时触发
  192. this.state.visible = nextProps.showDesc;
  193. if(nextProps.showDesc) {
  194. this.loaduser(nextProps.datauser);
  195. }
  196. },
  197. handleCancel(){
  198. this.setState({
  199. visible:false
  200. })
  201. this.props.closeShow(false)
  202. },
  203. render() {
  204. const FormItem = Form.Item
  205. const formItemLayout = {
  206. labelCol: { span: 8 },
  207. wrapperCol: { span: 14 },
  208. };
  209. const seeOrderDetaiel=this.state.lookOrderList || [];
  210. const orderDetaiel=this.state.orderList || [];
  211. return(
  212. <div>
  213. <Modal maskClosable={false} visible={this.state.visible}
  214. onOk={this.handleCancel} onCancel={this.handleCancel}
  215. width='1000px'
  216. title='查看任务'
  217. footer=''
  218. className="admin-desc-content">
  219. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} >
  220. <Spin spinning={this.state.loading}>
  221. <div className="clearfix">
  222. <FormItem className="half-item"
  223. {...formItemLayout}
  224. label="客户名称" >
  225. <span>{orderDetaiel.buyerName}</span>
  226. {orderDetaiel.buyerName&&<Button onClick={this.seeContract} style={{float:'right',fontSize:'12px'}}>查看联系人</Button>}
  227. </FormItem>
  228. <FormItem className="half-item"
  229. {...formItemLayout}
  230. label="营销员名称" >
  231. <span>{orderDetaiel.salesmanName}</span>
  232. </FormItem>
  233. <FormItem className="half-item"
  234. {...formItemLayout}
  235. label="订单编号" >
  236. <span>{orderDetaiel.orderNo}</span>
  237. {/*<Button style={{float:'right'}} onClick={this.seeOrder}>查看订单</Button>*/}
  238. </FormItem>
  239. <FormItem className="half-item"
  240. {...formItemLayout}
  241. label="合同编号" >
  242. <span>{orderDetaiel.contractNo}</span>
  243. {/*<Button style={{float:'right'}} onClick={this.seeOrder}>查看订单</Button>*/}
  244. </FormItem>
  245. <FormItem className="half-item"
  246. {...formItemLayout}
  247. label="项目编号" >
  248. <span>{orderDetaiel.projectNo}</span>
  249. </FormItem>
  250. <FormItem className="half-item"
  251. {...formItemLayout}
  252. label="任务编号" >
  253. <span>{orderDetaiel.taskNo}</span>
  254. </FormItem>
  255. <FormItem className="half-item"
  256. {...formItemLayout}
  257. label="服务项目名称" >
  258. <span>{orderDetaiel.commodityName}</span>
  259. </FormItem>
  260. <FormItem className="half-item"
  261. {...formItemLayout}
  262. label="任务状态" >
  263. <span>{getTaskStatus(orderDetaiel.taskStatus)}</span>
  264. </FormItem>
  265. <FormItem className="half-item"
  266. {...formItemLayout}
  267. label="是否锁定" >
  268. <span>{orderDetaiel.deletedSign==2?'锁定':'未锁定'}</span>
  269. </FormItem>
  270. <FormItem className="half-item"
  271. {...formItemLayout}
  272. label="公示状态" >
  273. {orderDetaiel.taskStatus==3?<span><Select placeholder="请选择公示状态"
  274. style={{ width:'150px'}}
  275. value={getPublishStatus(this.state.publishStatus)}
  276. onChange={(e)=>{this.setState({publishStatus:e})}}>
  277. {
  278. publishStatus.map(function (item) {
  279. return <Select.Option key={item.value} >{item.key}</Select.Option>
  280. })
  281. }
  282. </Select>
  283. <Button onClick={this.changePublishStatus} style={{marginLeft:'10px',fontSize:'12px'}}>修改公示状态</Button></span>:<span>{getPublishStatus(orderDetaiel.publishStatus)}</span>
  284. }
  285. </FormItem>
  286. <div className='clearfix'>
  287. <FormItem className="half-item"
  288. {...formItemLayout}
  289. label="任务说明" >
  290. <span>{orderDetaiel.taskComment}</span>
  291. </FormItem>
  292. </div>
  293. <div className='clearfix'>
  294. <FormItem className="half-item"
  295. {...formItemLayout}
  296. label="派单人" >
  297. <span>{orderDetaiel.taskAllocatorName}</span>
  298. </FormItem>
  299. <FormItem className="half-item"
  300. {...formItemLayout}
  301. label="派单时间" >
  302. <span>{orderDetaiel.taskDistributionTime}</span>
  303. </FormItem>
  304. <FormItem className="half-item"
  305. {...formItemLayout}
  306. label="资料负责人" >
  307. <span>{orderDetaiel.taskReceiverName}</span>
  308. </FormItem>
  309. </div>
  310. <div className='clearfix'>
  311. <FormItem className="half-item"
  312. {...formItemLayout}
  313. label="订单留言" >
  314. <span>{orderDetaiel.orderRemarks}</span>
  315. </FormItem>
  316. </div>
  317. </div>
  318. </Spin>
  319. </Form >
  320. </Modal>
  321. <Modal maskClosable={false} visible={this.state.seeOrderVisible}
  322. onOk={this.seeOrderCancel} onCancel={this.seeOrderCancel}
  323. width='1000px'
  324. title= '查看订单'
  325. footer=''
  326. className="admin-desc-content">
  327. <Form layout="horizontal" id="demand-form">
  328. <Spin spinning={this.state.loading}>
  329. <div className="clearfix">
  330. <div className="clearfix">
  331. <FormItem className="half-item"
  332. {...formItemLayout}
  333. label="订单编号" >
  334. <span>{seeOrderDetaiel.orderNo}</span>
  335. </FormItem>
  336. <FormItem className="half-item"
  337. {...formItemLayout}
  338. label="下单时间" >
  339. <span>{seeOrderDetaiel.createTime}</span>
  340. </FormItem>
  341. <FormItem className="half-item"
  342. {...formItemLayout}
  343. label="客户名称" >
  344. <span>{seeOrderDetaiel.buyerName}</span>
  345. </FormItem>
  346. <FormItem className="half-item"
  347. {...formItemLayout}
  348. label="订单类型" >
  349. <span>{getOrderType(seeOrderDetaiel.orderType)}</span>
  350. </FormItem>
  351. <FormItem className="half-item"
  352. {...formItemLayout}
  353. label="订单渠道" >
  354. <span>{getOrderChannel(seeOrderDetaiel.orderChannel)}</span>
  355. </FormItem>
  356. <FormItem className="half-item"
  357. {...formItemLayout}
  358. label="订单状态" >
  359. <span>{getOrderState(seeOrderDetaiel.orderStatus)}</span>
  360. </FormItem>
  361. <div className='clearfix'>
  362. <FormItem className="half-item"
  363. {...formItemLayout}
  364. label="特批立项" >
  365. <span>{getApprovedState(seeOrderDetaiel.approval)}</span>
  366. </FormItem>
  367. <div className='clearfix'>
  368. <FormItem
  369. labelCol={{ span: 4 }}
  370. wrapperCol={{ span: 16 }}
  371. label="订单留言" >
  372. <span>{seeOrderDetaiel.orderRemarks}</span>
  373. </FormItem>
  374. </div>
  375. </div>
  376. </div>
  377. <div className='clearfix'>
  378. <FormItem className="half-item"
  379. {...formItemLayout}
  380. label="订单负责人" >
  381. <span>{seeOrderDetaiel.salesmanName}</span>
  382. </FormItem>
  383. <FormItem className="half-item"
  384. {...formItemLayout}
  385. label="意向时间" >
  386. <span>{seeOrderDetaiel.createTime}</span>
  387. </FormItem>
  388. <FormItem className="half-item"
  389. {...formItemLayout}
  390. label="签单时间" >
  391. <span>{seeOrderDetaiel.signTime}</span>
  392. </FormItem>
  393. <FormItem className="half-item"
  394. {...formItemLayout}
  395. label="财务负责人" >
  396. <span>{seeOrderDetaiel.financeName}</span>
  397. </FormItem>
  398. <FormItem className="half-item"
  399. {...formItemLayout}
  400. label="项目负责人" >
  401. <span>{seeOrderDetaiel.technicianName}</span>
  402. </FormItem>
  403. <FormItem className="half-item"
  404. {...formItemLayout}
  405. label="立项时间" >
  406. <span>{seeOrderDetaiel.setUpTime}</span>
  407. </FormItem>
  408. <FormItem className="half-item"
  409. {...formItemLayout}
  410. label="项目状态" >
  411. <span>{getProjectState(seeOrderDetaiel.projectStage)}</span>
  412. </FormItem>
  413. </div>
  414. </div>
  415. </Spin>
  416. </Form >
  417. </Modal>
  418. <Modal maskClosable={false} visible={this.state.orderVisible}
  419. onOk={this.orderCancel} onCancel={this.orderCancel}
  420. width='800px'
  421. title={this.state.seeState?'查看订单':'查看联系人'}
  422. footer=''
  423. className="admin-desc-content">
  424. <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} >
  425. <Spin spinning={this.state.loading}>
  426. <div className="patent-table" style={{marginTop:'10px'}}>
  427. <Spin spinning={this.state.loading}>
  428. {this.state.seeState?
  429. <div className="clearfix">
  430. </div>:
  431. <Table columns={this.state.contractList}
  432. dataSource={this.state.contractArr}
  433. pagination={false}
  434. />}
  435. </Spin>
  436. </div>
  437. </Spin>
  438. </Form>
  439. </Modal>
  440. </div>
  441. )
  442. }
  443. }));
  444. export default MySettlementDetaile;