import React,{Component} from 'react'; import {message, Modal, Tabs} from "antd"; import { cuiJieDian } from '@/dataDic.js' import ProjectOverview from './projectOverview' import {splitUrl} from '@/tools' import CheckProject from "../../../../components/checkProject"; import $ from "jquery"; const { TabPane } = Tabs class DetailsModal extends Component{ constructor(props) { super(props); this.state={ loading: false, activeKey:'1', paySubject: [], orderDtails: {}, containOfficialFees:0,//官费缴费情况 } this.visitCancel = this.visitCancel.bind(this); this.getCsortData = this.getCsortData.bind(this); } async componentDidMount() { if(this.props.tid){ this.waiDetail(); this.thirdTable(this.props.tid); await this.xiangqing(this.props.tid); await this.getCsortData(this.state.sort) await this.payNodeTable(this.props.tid); } } // 获取csort下的数据 getCsortData(cSort) { return cuiJieDian.map((item) => { if (item.value == cSort) { this.setState({ paySubject: item.children, }) } }) } visitOk(){ this.setState({ oldInfor: {} }); } visitCancel(){ this.setState({ oldInfor: {} }); this.props.visitCancel(); } waiDetail() { let url = window.location.href.substring(7) this.setState({ loading: true, }) $.ajax({ method: 'get', dataType: 'json', crossDomain: false, url: globalConfig.context + '/api/admin/outsourceOrg/orderOutsourceDtails', data: { tid: this.props.tid, orderNo: this.props.orderNo, }, }).done( function (data) { this.setState({ loading: false, }) if (!data.error.length && data.data) { if(data.data.unitNumber){ this.setState({ oldInfor: { companyName:data.data.companyName, unitPrice:data.data.unitPrice, unitNumber:data.data.unitNumber, amount:data.data.amount, outsourceRemarks:data.data.outsourceRemarks, refundStatus: data.data.refundStatus, pictureUrl: data.data.pictureUrl ? splitUrl( data.data.pictureUrl, ',', globalConfig.avatarHost + '/upload', url ) : [], //图片地址 } }) }else{ this.setState({ oldInfor: {} }) } this.setState({ containOfficialFees: data.data.actualOfficial,//官费类型 0实际已缴费 1实际未缴费 orderDtails: data.data, startType: data.data.startType, //类型 mid: data.data.id, outsourceRemarks: data.data.outsourceRemarks, refundStatus: data.data.refundStatus, pictureUrl: data.data.pictureUrl ? splitUrl( data.data.pictureUrl, ',', globalConfig.avatarHost + '/upload', url ) : [], //图片地址 }) } else if (data.error && data.error.length) { message.warning(data.error[0].message) } else if (!data.data) { this.setState({ refundStatus: undefined, }) } }.bind(this) ) } //查看第三方信息表格 thirdTable(id) { this.setState({ loadData: true, }) $.ajax({ method: 'get', dataType: 'json', crossDomain: false, url: globalConfig.context + '/api/admin/company/selectCompany', data: { tid: id, }, success: function (data) { if (data.error && data.error.length) { message.warning(data.error[0].message) } else { let companyNameArr = [] let theArr = [] let thisData = [] let arr = data.data || [] let allTotalAmount = 0 for (let i = 0; i < arr.length; i++) { thisData = arr[i] allTotalAmount = (allTotalAmount * 10000 + thisData.totalAmount * 10000) / 10000 companyNameArr.push(thisData.companyName); thisData.key = i; theArr.push(thisData) } for(let d=0;d<theArr.length;d++){ theArr[d].companyName = theArr[d].companyName+ '-' + theArr[d].id; // companyNameArr[d] = { // companyName: theArr[d].companyName, // id: theArr[d].id, // } } if (!allTotalAmount) { allTotalAmount = 0 } this.setState({ thirdInfoList: theArr, allTotalAmount: allTotalAmount, }) } }.bind(this), }).always( function () { this.setState({ loading: false, }) }.bind(this) ) } payNodeTable(id) { this.setState({ loadData: true, }) return $.ajax({ method: 'get', dataType: 'json', crossDomain: false, url: globalConfig.context + '/api/admin/company/selectPaymentNode', data: { tid: id, }, success: function (data) { if (data.error && data.error.length) { message.warning(data.error[0].message) } else { let payNodeArr = [] let thisData = [] let arr = data.data || [] //对#5283自定义的补充展示 this.state.paySubject.push({ key: '自定义', value: '0' }) for (let i = 0; i < arr.length; i++) { thisData = arr[i] //遍历paySubject,获取当前dunType对应的key this.state.paySubject.map((item) => { if (item.value == thisData.dunType) { thisData.dunType = item.key } }) payNodeArr.push({ key: i, id: thisData.id, //付款节点Id tid: thisData.tid, companyName: thisData.companyName, //供应商名称 projectType: thisData.projectType, //项目分类 dunType: thisData.dunType, //催款分类 unitPrice: thisData.unitPrice, //单价 quantity: thisData.quantity, //数量 totalAmount: thisData.totalAmount, //总价 partyAmount: thisData.partyAmount, //付款 partyTimes: thisData.partyTimes, //付款时间 cid: thisData.cid, //机构id }) } for(let d=0;d<payNodeArr.length;d++){ payNodeArr[d].companyName = payNodeArr[d].companyName+ '-' + payNodeArr[d].cid; } this.setState({ payNodeList: payNodeArr, }) } }.bind(this), }).always( function () { this.setState({ loading: false, }) }.bind(this) ) } //订单详情 xiangqing(id) { return $.ajax({ method: 'get', dataType: 'json', crossDomain: false, url: globalConfig.context + '/api/admin/orderProject/orderTaskDetail', data: { id: id, }, success: function (data) { let thisdata = data.data if (data.error.length || data.data.list == '') { if (data.error && data.error.length) { message.warning(data.error[0].message) } } else { localStorage.setItem('cSort', thisdata.sort); this.setState({ orderTaskOfficialCost: thisdata.officialCost, //官费 0无 1有 sort: thisdata.sort, }) } }.bind(this), }).always( function () { this.setState({ loading: false, }) }.bind(this) ) } render() { return( <Modal maskClosable={false} className="customeDetails" footer="" title="" width="900px" visible={this.props.visible} onOk={this.visitOk} onCancel={this.visitCancel} > <Tabs defaultActiveKey='1' activeKey={this.state.activeKey} onChange={(e) => { this.setState({ activeKey: e }) if(e === '1'){ this.waiDetail(); this.thirdTable(this.props.tid); this.payNodeTable(this.props.tid); this.xiangqing(this.props.tid); } }} tabBarExtraContent={ <div style={{fontWeight:'bold',paddingRight:'15px'}}> <span> 项目名称: <span style={{color:'#F00',paddingRight:'5px'}}>{this.props.taskName}</span> </span> <span style={{marginLeft:'15px'}}> 项目编号: <span style={{color:'#F00',paddingRight:'5px'}}> {this.props.taskID} </span> </span> </div> } > <TabPane tab="外包/供应商信息" key="1"> {this.state.activeKey === '1' ? <CheckProject {...this.props} tid={this.props.tid} oldInfor={this.state.oldInfor} orderTaskOfficialCost={this.state.orderTaskOfficialCost} //是否含官费 0无1有 containOfficialFees={this.state.containOfficialFees} //0:实际已缴费 1:实际未缴费 status={this.state.refundStatus} mid={this.state.mid} patentNameType={this.state.orderDtails.patentNameType} patentName={this.state.orderDtails.patentName} patentType={this.state.orderDtails.patentType} projectType={this.props.projectType} projectStatus={this.props.projectStatus} thirdInfoList={this.state.thirdInfoList} dataSource={this.state.payNodeList} outsourceRemarks={this.state.outsourceRemarks} fileList={this.state.pictureUrl} startType={this.state.startType} onRefresh={()=>{ this.waiDetail(); this.thirdTable(this.props.tid); this.payNodeTable(this.props.tid); this.xiangqing(this.props.tid); this.props.refreshList && this.props.refreshList(); }} /> : <div/>} </TabPane> <TabPane tab="项目概况" key="2"> <ProjectOverview projectStatus={this.props.projectStatus} tid={this.props.tid} taskName={this.props.taskName}/> </TabPane> </Tabs> </Modal> ) } } export default DetailsModal;