import React from 'react'; import { Icon, Table, Modal, message, Spin, Input, Select, Button, Form ,Upload,Popconfirm,AutoComplete,Radio,DatePicker} from 'antd'; import ajax from 'jquery/src/ajax/xhr.js'; import $ from 'jquery/src/ajax'; import '../userMangagement.less'; import {orderType} from '../../../../dataDic.js'; import {getOrderType,getProjectState,getTaskStatus,getOrderChannel,getOrderState,getPaymentState ,getChangeState,getApprovedState} from '../../../../tools.js'; import moment from 'moment'; const MySettlementDetaile = Form.create()(React.createClass({ loadData(record) { this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/techproject/getProjectTask', data: { contractId:record?record.id:this.props.datauser.id }, success: function (data) { let theArr =[]; if (!data.data) { if (data.error && data.error.length) { message.warning(data.error[0].message); }; } else { for (let i = 0; i < data.data.length; i++) { let thisdata = data.data[i]; theArr.push({ key:i, taskId:thisdata.taskId, commodityName:thisdata.commodityName, commodityQuantity:thisdata.commodityQuantity, technicianName:thisdata.technicianName, taskStatus:thisdata.taskStatus, deleteSign:thisdata.deleteSign, taskComment:thisdata.taskComment, }); }; } this.setState({ dataSource: theArr, }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); }, getInitialState() { return { loading: false, visible: false, contractState:false, projectVisible:false, selectedRowKey:[], orderSelect:false, transferState:false, orgCodeUrl:[], lvState:true, lvRadio:0, customerArr:[], checkedKeys: [], //派单 columns: [ { title: '任务名称', dataIndex: 'commodityName', key: 'commodityName' },{ title: '任务数量', dataIndex: 'commodityQuantity', key: 'commodityQuantity' }, { title: '任务负责人', dataIndex: 'technicianName', key: 'technicianName' }, { title: '任务状态', dataIndex: 'taskStatus', key: 'taskStatus', render:(text)=>{return getTaskStatus(text)} }, { title: '是否锁定', dataIndex: 'deleteSign', key: 'deleteSign', render:(text)=>{return text==2?'锁定':'未锁定'} },{ title: '任务说明', dataIndex: 'taskComment', key: 'taskComment', render:(text) => { return( text&&text.length>6?text.substr(0,8)+'...':text ) } },{ title: '操作', dataIndex: 'rrtk', key: 'rrtk', render:(text,record,index)=>{ return ( <div style={{display:!this.props.queryProject?'block':'none'}}> {record.taskStatus<=1&&<Popconfirm title={'您将删除项目任务 【'+record.commodityName+'】,系统将自动同步作废项目资料单,请确认!'} onConfirm={(e)=>{this.voidOperation(record)}} okText="确认" cancelText="取消"> <Button style={{marginRight:'5px'}} onClick={(e) =>{ e.stopPropagation()}} type="danger">删除</Button> </Popconfirm>} {record.taskStatus<1&&<Button style={{marginRight:'5px'}} onClick={(e) =>{ e.stopPropagation(),this.confirmDelet(record)}} type="primary">派单</Button>} </div> ) } } ], userList:[ { title: '用户编号', dataIndex: 'userNo', key: 'userNo' }, { title: '用户姓名', dataIndex: 'name', key: 'name' },{ title: '部门机构', dataIndex: 'departmentName', key: 'departmentName' }, { title: '职务', dataIndex: 'position', key: 'position' },{ title: '联系手机', dataIndex: 'mobile', key: 'mobile' }, { title: '操作', dataIndex: 'abc', key: 'abc', render:(text,record,index)=>{ return ( <div>{this.state.transferState?<Popconfirm title={'您确认转交给【'+record.departmentName+'-'+record.name+'】'} onConfirm={(e)=>{this.transterSelect(record)}} okText="确认" cancelText="取消"> <Button style={{marginRight:'5px'}} type="primary">转交</Button> </Popconfirm>: <Popconfirm title={'您确认将订单分配给【'+record.departmentName+'-'+record.name+'】进行业务跟进?'} onConfirm={(e)=>{this.confirmSelect(record)}} okText="确认" cancelText="取消"> <Button style={{marginRight:'5px'}} type="primary">选定</Button> </Popconfirm>} </div> ) } } ], contractList:[ { title: '姓名', dataIndex: 'name', key: 'name' }, { title: '部门', dataIndex: 'depatrment', key: 'depatrment' },{ title: '联系方式', dataIndex: 'mobile', key: 'mobile' },{ title: '是否为主要联系人', dataIndex: 'major', key: 'major', render:(text) => { return text?'是':"否" } }, { title: '职务', dataIndex: 'position', key: 'position' },{ title: '微信', dataIndex: 'wechat', key: 'wechat' },{ title: 'QQ', dataIndex: 'qq', key: 'qq' }, ], }; }, seeContract(){ this.contract(); this.setState({ seeState:false, orderVisible:true }) }, orderCancel(){ this.setState({ orderVisible:false }) }, //查看联系人 contract(){ $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/customer/findAllContacts', data: { uid: this.state.buyerId }, success: function (data) { let thisData = data.data; if (!thisData) { if (data.error && data.error.length) { message.warning(data.error[0].message); }; thisData = {}; }; this.setState({ contractArr:thisData, }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); }, //查看订单 seeOrderAjax(data){ if(!data.orderNo){ return false; }; this.setState({ loading:true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/order/getServiceOrderDetail', data: { orderNo:data.orderNo }, success: function (data) { let thisData = data.data; if (!thisData) { if (data.error && data.error.length) { message.warning(data.error[0].message); }; thisData = {}; }; this.setState({ orderArr:thisData, }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); }, //时间选择 selTime(e,index){ this.setState({ completeDate:e, selTime:index }) }, setTime(e,index){ this.setState({ signDate:e, setTime:index }) }, //查看详情 loaduser(record){ if(record){ $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/techproject/getProjectDetail', data: { contractId: record.id, buyerType:record.buyerType }, success: function (data) { let thisData = data.data; if (!thisData) { if (data.error && data.error.length) { message.warning(data.error[0].message); }; thisData = {}; }; this.setState({ signTime:thisData.signDate, completeTime:thisData.completeDate, signComment:thisData.signComment, completeComment:thisData.completeComment, completeDate:thisData.completeDate?moment(thisData.completeDate,'YYYY-MM-DD HH:mm:ss'):undefined, signDate:thisData.signDate?moment(thisData.signDate,'YYYY-MM-DD HH:mm:ss'):undefined, buyerId:thisData.uid, id:record.id, orderNok:thisData.orderNo, orderList:thisData, technicianName:thisData.technicianName, //任务负责人 selTime:'', setTime:'' }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); } }, //删除 voidOperation(record){ this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/techproject/deleteProjectTask', data: { taskId:record.taskId } }).done(function (data) { if (!data.error.length) { message.success('操作成功'); this.setState({ loading: false, }); this.loadData(); this.props.closeDesc(false, true); } else { message.warning(data.error[0].message); }; }.bind(this)); }, //订单编辑保存 handleOk(e) { this.setState({ visible: false, }); this.props.closeDesc(false, true); }, handleCancel(e) { this.setState({ visible: false, }); this.props.closeDesc(false); }, //新建项目 projectOk(e) { this.setState({ projectVisible: false, }); this.props.closeDesc(false, true); }, projectCancel(e) { this.setState({ projectVisible: false, }); this.props.closeDesc(false); }, //选定订单 orderOk() { this.setState({ orderSelect: false, }); }, componentWillMount() { }, nextCancel() { this.setState({ addnextVisible: false }) }, //查看订单明细 orderDetails(record){ if(record){ $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/techproject/getProjectTaskDetail', data: { taskId: record.taskId }, success: function (data) { let thisData = data.data; if (!thisData) { if (data.error && data.error.length) { message.warning(data.error[0].message); }; thisData = {}; }; this.setState({ taskId:thisData.taskId, taskNo:thisData.taskNo, projectNo:thisData.projectNo, categoryId:thisData.categoryId, commodityName:thisData.commodityName, taskStatus:thisData.taskStatus, taskComment:thisData.taskComment, deletedSign:thisData.deletedSign, taskAllocatorName:thisData.taskAllocatorName, taskReceiverName:thisData.taskReceiverName, taskDistributionTime:thisData.taskDistributionTime, }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); } }, //创建项目保存 admissibleOrder(){ if(!this.state.autoId||!this.state.customerName){ message.warning('客户名称不匹配'); return false; }; if(!this.state.projectName){ message.warning('请选择项目负责人'); return false; }; if(!this.state.contractType){ message.warning('请选择业务品类'); return false; }; if(this.state.signComment&&this.state.signComment.length>45){ message.warning('项目说明字数不能超过45字'); return false; }; this.setState({ loading: true }); $.ajax({ method: "POST", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/techproject/createProject', data: { uid:this.state.autoId, signComment:this.state.signComment, aid:this.state.aid, projectType:0, contractType:this.state.contractType } }).done(function(data) { this.setState({ loading: false }); if(!data.error.length) { message.success('创建成功!'); this.projectOk() } else { message.warning(data.error[0].message); } }.bind(this)); }, //派单 //操作分配 confirmDelet(index){ this.setState({ taskIds:index.taskId, userDetaile:false, distributionVisible:true, transferState:false, lvState:true, distributionList:[] }); this.state.departmenttList=undefined; this.state.financeNameSearch=''; this.state.lvRadio=0; this.contactList(); }, distributionCancel(){ this.setState({ distributionVisible:false }) }, distributionOk(){ this.setState({ distributionVisible:false }) }, //分配对象列表 contactList(){ this.setState({ loading: true }); let api = this.state.lvRadio==2?'/api/admin/superviser/adminList':'/api/admin/superviser/selectAdminByOrg' $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + api, data: this.state.lvRadio==2?{ pageNo: 1, pageSize: 99, departmentId:this.state.departmenttList, name:this.state.financeNameSearch, }:{ //subOrSame:!this.state.lvRadio?"SUB":"SAME" }, success: function (data) { let theArr = []; if (!data.data) { if (data.error && data.error.length) { message.warning(data.error[0].message); }; } else { if(data.data.list){ for (let i = 0; i < data.data.list.length; i++) { let thisdata = data.data.list[i]; theArr.push({ key: i, id: thisdata.id, userNo: thisdata.userNo, name:thisdata.name, departmentName:thisdata.departmentName, departmentId:thisdata.departmentId, position:thisdata.position, mobile:thisdata.mobile, }); }; }else{ for (let i = 0; i < data.data.length; i++) { let thisdata = data.data[i]; theArr.push({ key: i, id: thisdata.id, userNo: thisdata.userNo, name:thisdata.name, departmentName:thisdata.departmentName, departmentId:thisdata.departmentId, position:thisdata.position, mobile:thisdata.mobile, }); }; } }; this.setState({ distributionList: theArr, }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); }, //选定对象 confirmSelect(record){ if(this.state.projectVisible){ this.setState({ aid:record.id, projectName:record.name }) this.distributionOk(); return false } this.setState({ loading: true }); $.ajax({ method: "POST", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/techproject/distributionTask", data: { taskId:this.state.taskIds, taskReceiverId:record.id } }).done(function (data) { if (!data.error.length) { message.success('分派成功!'); this.setState({ loading: false, }); this.distributionOk(); this.loadData(); this.props.closeDesc(false, true); } else { message.warning(data.error[0].message); }; }.bind(this)); }, //指派 //选定对象 transterSelect(record){ this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/techproject/transferProject", data: { contractId:this.state.id, projectReceiveId:record.id, orderNo:this.state.orderNok||'' } }).done(function (data) { if (!data.error.length) { message.success('转交成功!'); this.setState({ loading: false, }); this.distributionOk(); this.loaduser(this.props.datauser); } else { message.warning(data.error[0].message); }; }.bind(this)); }, searchOrder(){ this.contactList(); }, resetOrder(){ this.state.departmenttList=undefined; this.state.financeNameSearch=''; this.state.lvRadio=0; this.setState({ lvState:true, distributionList:[] }) this.contactList(); }, //添加任务 addTask(){ this.setState({ commodityQuantity:'', commodityName:'', taskComment:'', kid:'', commodityId:undefined, addTaskState:true, addnextVisible:true, customerArr:[] }); }, //客户名称自动补全 //加载(自动补全) supervisor(e,state){ //客户名称与服务名称自动补全 let api=state?'/api/admin/customer/findCustomerByName':'/api/admin/order/getBusinessProjectByName'; $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + api, data:state?{ name:e }:{ businessName:e }, success: function (data) { let thedata=data.data; if (!thedata) { if (data.error && data.error.length) { message.warning(data.error[0].message); }; thedata = {}; }; this.setState({ states:state, customerArr:thedata, }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); }, //服务值改变时请求客户名称 httpChange(e){ if(e.length>=2){ this.supervisor(e,false); } this.setState({ commodityName:e }) }, //上级主管输入框失去焦点是判断客户是否存在 selectAuto(value){ let kid=[]; let fwList=this.state.customerArr; fwList.map(function(item){ if(value==item.bname){ kid=item.id } }) this.setState({ kid:kid, commodityName:value, }) }, customerChange(e){ if(e.length>=2){ this.supervisor(e,true); } this.setState({ customerName:e }) }, //客户 selectAutoCUT(value){ let autoIds; let fwList=this.state.customerArr; fwList.map(function(item){ if(value==item.name){ autoIds=item.id } }) this.setState({ customerName:value, autoId:autoIds }) }, //任务新建、编辑保存 taskSumbit(e) { e.preventDefault(); if(this.state.addTaskState){ if(!this.state.kid){ message.warning('请输入服务项目名称'); return false; }; if(!this.state.commodityQuantity){ message.warning('请输入数量'); return false; }; } this.props.form.validateFields((err, values) => { if(!err) { this.setState({ loading: true }); let api=this.state.addTaskState?'/api/admin/techproject/addProjectTask':'/api/admin/techproject/updateProjectTask'; $.ajax({ method: "POST", dataType: "json", crossDomain: false, url: globalConfig.context + api, data: this.state.addTaskState?{ contractId:this.props.datauser.id, commodityId:this.state.kid, commodityName:this.state.commodityName, commodityQuantity:this.state.commodityQuantity, taskComment:this.state.taskComment, }:{ taskId:this.state.taskId, commodityId:this.state.kid?this.state.kid:this.state.commodityId, taskComment:this.state.taskComment } }).done(function(data) { this.setState({ loading: false }); if(!data.error.length) { message.success('保存成功!'); this.nextCancel(); this.loadData(); this.props.closeDesc(false, true); } else { message.warning(data.error[0].message); } }.bind(this)); } }); }, //任务项目各种骚操作 removeItem(){ //撤项 this.removeList(0) }, Knot(){ //结项 this.removeList(1) }, removeList(e){ this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/techproject/revokeOrComplete', data: { contractId:this.props.datauser.id, operatorType:e } }).done(function(data) { this.setState({ loading: false }); if(!data.error.length) { message.success('操作成功!'); this.handleOk() } else { message.warning(data.error[0].message); } }.bind(this)); }, //保存详情 knotSave(){ this.setState({ loading: true }); $.ajax({ method: "post", dataType: "json", crossDomain: false, url: globalConfig.context + '/api/admin/techproject/updateProject', data: { contractId:this.props.datauser.id, completeComment:this.state.completeComment, signComment:this.state.signComment, signDate:this.state.setTime?this.state.setTime:this.state.signTime, completeDate:this.state.selTime?this.state.selTime:this.state.completeTime } }).done(function(data) { this.setState({ loading: false }); if(!data.error.length) { message.success('保存成功!'); this.handleOk() } else { message.warning(data.error[0].message); } }.bind(this)); }, //负责人转交 transfer(){ this.setState({ distributionVisible:true, transferState:true, lvState:true, distributionList:[] }); this.state.departmenttList=undefined; this.state.financeNameSearch=''; this.state.lvRadio=0; this.contactList(); }, /* -----变更操作开始----- */ //新建变更 addChange(){ this.setState({ addChangeState:true, stateAdd:1, changeRemarks:'' }) }, //产看变更记录 lookChange(){ this.setState({ addChangeState:true, stateAdd:0 }) this.lookChangeData() }, //查看变更列表修改变更 modifyChangeCancel(){ this.setState({ modifyChangeState:false }) }, //获取变更记录 lookChangeData(){ this.setState({ loading:true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context +'/api/admin/order/viewOrderChange', data: { orderNo:this.props.datauser.orderNo, }, success: function (data) { let theArr = []; if (!data.data) { if (data.error && data.error.length) { message.warning(data.error[0].message); }; } else { for (let i = 0; i < data.data.length; i++) { theArr = data.data; }; }; this.setState({ changeHtml: theArr, }); }.bind(this), }).always(function () { this.setState({ loading: false }); }.bind(this)); }, //添加变更状态 addChangeCancel(){ this.setState({ addChangeState:false }) }, //新建变更 subChangeState(e){ e.preventDefault(); this.setState({ loading: true }); $.ajax({ method: "POST", dataType: "json", crossDomain: false, url: globalConfig.context +'/api/admin/order/addOrderChange' , data: { orderNo:this.props.datauser.orderNo, changeComment:this.state.changeRemarks } }).done(function(data) { this.setState({ loading: false }); if(!data.error.length) { message.success('保存成功!'); this.addChangeCancel(); this.seeOrderAjax(this.props.datauser); } else { message.warning(data.error[0].message); } }.bind(this)); }, //查看修改变更 modifyChange(item){ this.setState({ modifyChangeState:true, changePromoter:item.creater, changeTime:item.createTime, changeState:item.changeStatus, changeRemarks:item.changeComment, idt:item.changeId, orderNot:item.orderNo }) }, //删除变更 modifyDelete(item){ this.setState({ loading: true }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context +'/api/admin/order/deleteOrderChange' , data: { changeId:item.changeId, } }).done(function(data) { this.setState({ loading: false }); if(!data.error.length) { message.success('删除成功!'); this.lookChangeData(); this.seeOrderAjax(this.props.datauser) } else { message.warning(data.error[0].message); } }.bind(this)); }, //修改变更保存 changeModify(e){ e.preventDefault(); this.setState({ loading: true }); $.ajax({ method: "POST", dataType: "json", crossDomain: false, url: globalConfig.context +'/api/admin/order/updateOrderChange' , data: { changeId:this.state.idt, changeStatus:this.state.changeState, changeComment:this.state.changeRemarks } }).done(function(data) { this.setState({ loading: false }); if(!data.error.length) { message.success('保存成功!'); this.modifyChangeCancel(); this.lookChangeData(); this.seeOrderAjax(this.props.datauser) } else { message.warning(data.error[0].message); } }.bind(this)); }, /*-----变更操作结束----*/ //派单阶级操作 lvRadioFn(e){ if(e.target.value==2){ this.setState({ lvRadio:e.target.value, lvState:false }) }else{ this.setState({ lvRadio:e.target.value, lvState:true }) } }, tableRowClick(record, index) { this.setState({ addTaskState:false, addnextVisible:true, }); this.orderDetails(record) }, componentWillReceiveProps(nextProps) { //props改变时触发 this.state.projectVisible = nextProps.newProject; this.state.visible = nextProps.showDesc; if(nextProps.userDetaile && nextProps.showDesc ) { if(nextProps.datauser && nextProps.datauser.id ) { this.loaduser(nextProps.datauser); this.loadData(nextProps.datauser); this.seeOrderAjax(nextProps.datauser); } }else{ this.setState({ customerArr:[], customerName:'', autoId:'', signComment:'', projectName:'', aid:'', contractType:undefined }) } }, render() { const FormItem = Form.Item const formItemLayout = { labelCol: { span: 8 }, wrapperCol: { span: 14 }, }; const rowSelection = { selectedRowKey: this.state.selectedRowKey, onChange: (selectedRowKey, selectedRows) => { this.setState({ selectedRows: selectedRows.slice(-1), selectedRowKey: selectedRowKey.slice(-1) }); }, onSelectAll: (selected, selectedRows, changeRows) => { this.setState({ selectedRowKey:[] }) }, }; const changeHtml=this.state.changeHtml ||[]; const categoryList=this.props.categoryArr ||[]; let departmentArr = this.props.departmentArr || []; const hasSelected = this.state.selectedRowKey.length > 0; const orderDetaiel=this.state.orderList || []; const dataSources=this.state.customerArr || []; const orderArr=this.state.orderArr ||[]; const options = this.state.states?dataSources.map((group,index) => <Select.Option key={index} value={group.name}>{group.name}</Select.Option> ):dataSources.map((group,index) => <Select.Option key={index} value={group.bname}>{group.bname}</Select.Option> ) return( <div> <Modal maskClosable={false} visible={this.state.visible} onOk={this.handleOk} onCancel={this.handleCancel} width='1000px' title={this.props.projectState?'项目管理':'项目详情' } footer='' className="admin-desc-content"> <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} onSubmit={this.handleSubmit}> <Spin spinning={this.state.loading}> <div className="clearfix"> <div className="clearfix"> <FormItem className="half-item" {...formItemLayout} label="订单编号" > <span>{orderDetaiel.orderNo}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="项目编号" > <span>{orderDetaiel.serialNumber}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="客户名称" > <span>{orderDetaiel.buyerName}</span> {orderDetaiel.buyerName&&<Button onClick={this.seeContract} style={{float:'right',fontSize:'12px'}}>查看联系人</Button>} </FormItem> {orderDetaiel.orderNo&&<div> <FormItem className="half-item" {...formItemLayout} label="客户省份" > <span>{orderDetaiel.buyerProvince}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="下单时间" > <span>{orderArr.createTime}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="订单类型" > <span>{getOrderType(orderArr.orderType)}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="订单渠道" > <span>{getOrderChannel(orderArr.orderChannel)}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="订单状态" > <span>{getOrderState(orderArr.orderStatus)}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="已收款项" > <span>{orderArr.actuallyTotalAmount+'万元'}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="结算状态" > <span>{getPaymentState(orderArr.liquidationStatus)}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="市价订单金额" > <span>{orderArr.orderAmount+'万元'}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="市价首款金额" > <span>{orderArr.firstPayment+'万元'}</span> </FormItem> <div className='clearfix'> <FormItem className="half-item" {...formItemLayout} label="实签订单金额" > <span>{orderArr.signTotalAmount+'万元'}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="实签首款金额" > <span>{orderArr.signFirstPayment+'万元'}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="特批立项" > <span>{getApprovedState(orderArr.approval)}</span> </FormItem> <div className='clearfix'> <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="订单留言" > <span>{orderArr.orderRemarks}</span> </FormItem> </div> </div> </div>} </div> <div className="clearfix"> <FormItem className="half-item" {...formItemLayout} label="项目类型" > <span>{getOrderType(orderDetaiel.projectType)}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="项目负责人" > <span>{orderDetaiel.principalName}</span> {!this.props.queryProject?<Button onClick={this.transfer} style={{'float':"right"}}>转交</Button>:''} </FormItem> <FormItem className="half-item" {...formItemLayout} label="项目状态" > <span>{getProjectState(orderDetaiel.projectStatus)}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="是否锁定" > <span>{orderDetaiel.deleteSign==2?'锁定':'未锁定'}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="立项时间" > {!this.props.queryProject&&orderDetaiel.projectStatus==2? <DatePicker style={{marginTop:'2px',width:'200px'}} showTime format="YYYY-MM-DD HH:mm:ss" placeholder="选择时间" value={this.state.signDate} onChange={(e,time)=>{this.setTime(e,time)}} />: <span>{orderDetaiel.signDate}</span>} </FormItem> <FormItem className="half-item" {...formItemLayout} label="业务品类" > <span>{orderDetaiel.projectType}</span> </FormItem> <div className='clearfix'> <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="立项说明" > {!this.props.queryProject&&orderDetaiel.projectStatus==2?<Input type="textarea" placeholder="请输入立项说明" rows={4} value={this.state.signComment} onChange={(e)=>{this.setState({signComment:e.target.value})}}/>:<span>{orderDetaiel.signComment}</span>} </FormItem> </div> </div> <div className='clearfix'> <FormItem className="half-item" {...formItemLayout} label="结项日期" > {!this.props.queryProject&&orderDetaiel.projectStatus==3? <DatePicker style={{marginTop:'2px',width:'200px'}} showTime format="YYYY-MM-DD HH:mm:ss" placeholder="选择时间" value={this.state.completeDate} onChange={(e,time)=>{this.selTime(e,time)}} />: <span>{orderDetaiel.completeDate}</span>} </FormItem> </div> <div className='clearfix'> <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="结项说明" > {!this.props.queryProject&&orderDetaiel.projectStatus==3?<Input type="textarea" placeholder="请输入立项说明" rows={4} value={this.state.completeComment} onChange={(e)=>{this.setState({completeComment:e.target.value})}}/>: <span>{orderDetaiel.completeComment}</span> } </FormItem> </div> <div className='clearfix'> <FormItem className="half-item" {...formItemLayout} label="是否作废" > <span>{orderDetaiel.deleteSign==1?'作废':'未作废'}</span> </FormItem> </div> {orderDetaiel.orderNo&&<div className='clearfix'> <div className="changeStatusTxt"> <FormItem className="half-item" {...formItemLayout} style={{color:'red'}} label="变更状态" > <span>{getChangeState(orderArr.changeStatus)}</span> </FormItem> </div> <div className="clearfix"> {!this.props.queryProject&&<FormItem className="half-item" {...formItemLayout} label="变更操作" > <Button onClick={this.addChange}>添加变更</Button> </FormItem>} <FormItem className="half-item" {...formItemLayout} label="变更操作" > <Button onClick={this.lookChange}>查看变更纪录</Button> </FormItem> </div> </div>} <div> <span style={{marginLeft:'50px',fontSize:'20px'}}>项目任务</span> {orderDetaiel.projectStatus<3&&!this.props.queryProject?<Button type='primary' onClick={this.addTask} style={{float:'right',marginRight:'100px'}}>添加任务</Button>:''} </div> <div className="patent-table"> <Spin spinning={this.state.loading}> <Table columns={this.state.columns} dataSource={this.state.dataSource} pagination={false} onRowClick={this.tableRowClick} /> </Spin> </div> {!this.props.projectState?<div style={{marginTop:'30px',paddingLeft:'160px'}}> <div style={{display:orderDetaiel.projectStatus==3||orderDetaiel.projectStatus==2&&!this.props.queryProject?'block':'none'}}> <Button type="primary" onClick={this.knotSave} style={{margin:'15px'}}>保存</Button> <Button type="ghost" onClick={this.handleCancel}>返回</Button> </div> </div>: <div style={{marginTop:'30px',paddingLeft:'100px'}}> {orderDetaiel.projectStatus==3||orderDetaiel.projectStatus==2?<Button type="primary" onClick={this.knotSave} style={{margin:'15px'}}>保存</Button>:''} <Button type="danger" onClick={this.removeItem}>撤项</Button> <Button type="primary" onClick={this.Knot} style={{margin:'15px'}}>结项</Button> <Button type="ghost" onClick={this.handleCancel}>返回</Button> </div>} </div> </Spin> </Form > </Modal> <Modal maskClosable={false} visible={this.state.addnextVisible} onOk={this.nextCancel} onCancel={this.nextCancel} width='800px' title={this.state.addTaskState?'添加任务':'任务详情'} footer='' className="admin-desc-content"> <Form layout="horizontal" id="demand-form" onSubmit={this.taskSumbit}> <Spin spinning={this.state.loading}> {this.state.addTaskState?<div className="clearfix"> <FormItem className="half-item" {...formItemLayout} label="服务项目名称" > <AutoComplete className="certain-category-search" dropdownClassName="certain-category-search-dropdown" dropdownMatchSelectWidth={false} dropdownStyle={{ width: 200 }} style={{ width: '200px' }} dataSource={options} placeholder="输入服务名称" value={this.state.commodityName} onChange={this.httpChange} filterOption={true} onSelect={this.selectAuto} > <Input/> </AutoComplete> <span className="mandatory">*</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="数量" > <Input style={{ width: '200px' }} placeholder="输入数量" value={this.state.commodityQuantity} onChange={(e)=>{this.setState({commodityQuantity:e.target.value})}}/> <span className="mandatory">*</span> </FormItem> <div className='clearfix'> <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="任务说明" > <Input type="textarea" placeholder="请输入订单留言" rows={4} value={this.state.taskComment} onChange={(e)=>{this.setState({taskComment:e.target.value})}}/> </FormItem> </div> </div>: <div className="clearfix"> <FormItem className="half-item" {...formItemLayout} label="项目编号" > <span>{this.state.projectNo}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="任务编号" > <span>{this.state.taskNo}</span> </FormItem> {this.state.taskStatus<1?<FormItem className="half-item" {...formItemLayout} label="服务项目名称" > <AutoComplete className="certain-category-search" dropdownClassName="certain-category-search-dropdown" dropdownMatchSelectWidth={false} dropdownStyle={{ width: 200 }} style={{ width: '200px' }} dataSource={options} placeholder="输入服务名称" value={this.state.commodityName} onChange={this.httpChange} filterOption={true} onSelect={this.selectAuto} > <Input/> </AutoComplete> <span className="mandatory">*</span> </FormItem>: <FormItem className="half-item" {...formItemLayout} label="服务项目名称" > <span>{this.state.commodityName}</span> </FormItem>} <FormItem className="half-item" {...formItemLayout} label="任务状态" > <span>{getTaskStatus(this.state.taskStatus)}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="是否锁定" > <span>{this.state.deletedSign==2?'锁定':'未锁定'}</span> </FormItem> <div className='clearfix'> {this.state.taskStatus<1?<FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="任务说明" > <Input type="textarea" placeholder="请输入订单留言" rows={4} value={this.state.taskComment} onChange={(e)=>{this.setState({taskComment:e.target.value})}}/> </FormItem>: <FormItem className="half-item" {...formItemLayout} label="任务说明" > <span>{this.state.taskComment}</span> </FormItem>} </div> <div className='clearfix'> <FormItem className="half-item" {...formItemLayout} label="派单人" > <span>{this.state.taskAllocatorName}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="派单时间" > <span>{this.state.taskDistributionTime}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="资料负责人" > <span>{this.state.taskReceiverName}</span> </FormItem> </div> </div>} {this.state.taskStatus<1||this.state.addTaskState?<div className="clearfix" style={{marginBottom:'20px'}}> <Button className="setSave" type="primary" htmlType="submit">保存</Button> <Button className="cancel" type="ghost" onClick={this.nextCancel}>返回</Button> </div>:''} </Spin> </Form > </Modal> <Modal maskClosable={false} visible={this.state.projectVisible} onOk={this.projectOk} onCancel={this.projectCancel} width='600px' title='创建项目' footer='' className="admin-desc-content"> <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} > <Spin spinning={this.state.loading}> <div className="clearfix"> <div className='clearfix'> <div className="clearfix"> <FormItem {...formItemLayout} label="客户名称" > <AutoComplete className="certain-category-search" dropdownClassName="certain-category-search-dropdown" dropdownMatchSelectWidth={false} dropdownStyle={{ width: 200 }} size="large" style={{ width: '200px' }} dataSource={options} placeholder="输入客户名称" value={this.state.customerName} onChange={this.customerChange} filterOption={true} onBlur={this.blurCutor} onSelect={this.selectAutoCUT} > <Input/> </AutoComplete> <span className="mandatory">*</span> </FormItem> </div> <div className='clearfix'> <FormItem {...formItemLayout} label="项目负责人" > <span style={{width:'150px'}}>{this.state.projectName}</span> <Button onClick={this.confirmDelet} style={{float:'right',marginRight:'50px'}}>选择</Button> </FormItem> </div> <div className='clearfix'> <FormItem {...formItemLayout} label="业务品类" > <Select placeholder="请选择业务品类" style={{ width:'200px'}} value={this.state.contractType} onChange={(e)=>{this.setState({contractType:e})}}> { categoryList.map(function (item) { return <Select.Option key={item.id} >{item.name}</Select.Option> }) } </Select> <span className="mandatory">*</span> </FormItem> </div> <div className='clearfix'> <FormItem labelCol={{ span: 8 }} wrapperCol={{ span: 12 }} label="项目说明" > <Input type="textarea" placeholder="请输入签单备注" rows={4} value={this.state.signComment} onChange={(e)=>{this.setState({signComment:e.target.value})}}/> </FormItem> </div> </div> </div> <FormItem wrapperCol={{ span: 12, offset: 4 }} className="half-middle"> <Button type="primary" onClick={this.admissibleOrder} style={{marginLeft:'55px'}}>保存</Button> <Button className="submitSave" type="ghost" onClick={this.projectCancel}>返回</Button> </FormItem> </Spin> </Form > </Modal> <Modal maskClosable={false} visible={this.state.distributionVisible} onOk={this.distributionOk} onCancel={this.distributionCancel} width='800px' title={this.state.transferState?'转交责任人':'分派任务单' } footer='' className="admin-desc-content"> <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} > <Spin spinning={this.state.loading}> <div> <Radio.Group onChange={this.lvRadioFn} value={this.state.lvRadio}> <Radio value={0}>下级</Radio> <Radio value={2}>其他</Radio> </Radio.Group> {!this.state.lvState&&<Select placeholder="部门" style={{ width: 150 ,marginRight:'10px',marginLeft:'10px'}} value={this.state.departmenttList} onChange={(e) => { this.setState({ departmenttList: e }) }}> { departmentArr.map(function (item) { return <Select.Option key={item.id} >{item.name}</Select.Option> }) } </Select>} {!this.state.lvState&&<Input placeholder={this.state.transferState?"责任人":"咨询师"} style={{width:'150px',marginLeft:'10px'}} value={this.state.financeNameSearch} onChange={(e) => { this.setState({ financeNameSearch: e.target.value }); }} />} <Button type="primary" onClick={this.searchOrder} style={{marginLeft:'10px',marginRight:'10px'}}>搜索</Button> <Button onClick={this.resetOrder}>重置</Button> </div> <div className="patent-table" style={{marginTop:'10px'}}> <Spin spinning={this.state.loading}> <Table columns={this.state.userList} dataSource={this.state.distributionList} pagination={false} /> </Spin> </div> </Spin> </Form> </Modal> <Modal maskClosable={false} visible={this.state.orderVisible} onOk={this.orderCancel} onCancel={this.orderCancel} width='800px' title={this.state.seeState?'查看订单':'查看联系人'} footer='' className="admin-desc-content"> <Form layout="horizontal" id="demand-form" style={{paddingBottom:'40px'}} > <Spin spinning={this.state.loading}> <div className="patent-table" style={{marginTop:'10px'}}> <Spin spinning={this.state.loading}> {this.state.seeState? <div className="clearfix"> </div>: <Table columns={this.state.contractList} dataSource={this.state.contractArr} pagination={false} />} </Spin> </div> </Spin> </Form> </Modal> <Modal maskClosable={false} visible={this.state.addChangeState} onOk={this.addChangeCancel} onCancel={this.addChangeCancel} width='800px' title= {this.state.stateAdd?'添加变更':'查看变更记录'} footer='' className="admin-desc-content"> <Form layout="horizontal" id="demand-form"> <Spin spinning={this.state.loading}> <div className="clearfix"> {this.state.stateAdd?<div className="clearfix"> <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="变更说明" > <Input type="textarea" placeholder="请输入变更说明" rows={4} value={this.state.changeRemarks} onChange={(e)=>{this.setState({changeRemarks:e.target.value})}}/> </FormItem> <div className="clearfix"> <Button type="primary" onClick={this.subChangeState} style={{margin:"10px 50px 10px 128px"}}>保存</Button> <Button onClick={this.addChangeCancel}>取消</Button> </div> </div>: <div> { changeHtml.length?changeHtml.map(function(item,index){ return (<div className="changeBorder" key={index}> <FormItem className="half-item" {...formItemLayout} label="变更发起人" > <span>{item.creater}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="变更申请时间" > <span>{item.createTime}</span> </FormItem> <div className='clearfix'> <FormItem className="half-item" {...formItemLayout} label="变更状态" > <span>{getChangeState(item.changeStatus)}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="变更操作" > <Button onClick={(e)=>{this.modifyChange(item)}}>修改</Button> <Button type="danger" onClick={(e)=>{this.modifyDelete(item)}}>删除</Button> </FormItem> </div> <div className='clearfix changeRemark'> <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="变更说明" > <p>{item.changeComment}</p> </FormItem> </div> </div>) },this):<p style={{textAlign:"center"}}>暂无变更记录</p>} </div> } </div> </Spin> </Form > </Modal> <Modal maskClosable={false} visible={this.state.modifyChangeState} onOk={this.modifyChangeCancel} onCancel={this.modifyChangeCancel} width='600px' title= "修改变更 " footer='' className="admin-desc-content"> <Form layout="horizontal" id="demand-form"> <Spin spinning={this.state.loading}> <div className="clearfix"> <div className="clearfix"> <FormItem className="half-item" {...formItemLayout} label="变更发起人" > <span>{this.state.changePromoter}</span> </FormItem> <FormItem className="half-item" {...formItemLayout} label="变更申请时间" > <span>{this.state.changeTime}</span> </FormItem> <div className='clearfix'> <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="变更状态" > <Radio.Group onChange={(e)=>{this.setState({changeState:e.target.value})}} value={this.state.changeState}> <Radio value={1}>变更中</Radio> <Radio value={2}>变更完成</Radio> </Radio.Group> </FormItem> </div> <div className='clearfix'> <FormItem labelCol={{ span: 4 }} wrapperCol={{ span: 16 }} label="变更说明" > <Input type="textarea" placeholder="请输入变更说明" rows={4} value={this.state.changeRemarks} onChange={(e)=>{this.setState({changeRemarks:e.target.value})}}/> </FormItem> </div> <div className="clearfix"> <Button type="primary" onClick={this.changeModify} style={{margin:"10px 95px"}}>保存</Button> <Button onClick={this.modifyChangeCancel}>取消</Button> </div> </div> </div> </Spin> </Form > </Modal> </div> ) } })); export default MySettlementDetaile;