| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865 | import React,{Component} from "react";import {Button, Form, message, Modal, Spin, Table, Tag} from "antd";import OrderItemStatus from "../../../../common/orderItemStatus";import EnterpriseNameChange from "../../../../common/enterpriseNameChange";import {    getApprovedState,    getCuikuan,    getjiedian,    getLiquidationStatus,    getProcessStatus,    splitUrl} from "../../../../tools";import ImgList from "../../../../common/imgList";import $ from "jquery/src/ajax";import ProjectDetailsReadOnly from "../../../../common/projectDetailsReadOnly";import OrderRiZi from "@/orderRiZi.jsx";import OrderCoor from "../../../order/orderNew/changeComponent/orderCoor";import ContentUrl from "../../../order/orderNew/contentUrl";const FormItem = Form.Item;const formItemLayout = {    labelCol: { span: 8 },    wrapperCol: { span: 14 },};class Details extends Component{    constructor(props) {        super(props);        this.state={            loading:false,            columnsX: [                {                    title: "业务项目名称",                    dataIndex: "commodityName",                    key: "commodityName",                    render: (text, record) => {                        return <span>{text}<span style={{ color: "red" }}>{record.patentTypeName}</span>{"-" + record.id}</span>                      }                },                {                    title: "项目类别",                    dataIndex: "cname",                    key: "cname",                },                {                    title: "项目数量",                    dataIndex: "commodityQuantity",                    key: "commodityQuantity",                    render: (text, record) => {                        if (record.splitStatus == 1) {                            return (                                <span>                    {text}{" "}                                    <Tag                                        color="#108ee9"                                        onClick={(e) => {                                            e.stopPropagation();                                            this.showRes(record);                                        }}                                    >                      已拆                    </Tag>                  </span>                            );                        } else {                            return text;                        }                    },                },                {                    title: "金额(万元)",                    dataIndex: "commodityPrice",                    key: "commodityPrice",                },                {                    title: "负责人",                    dataIndex: "contacts",                    key: "contacts",                },                {                    title: "负责人电话",                    dataIndex: "contactsMobile",                    key: "contactsMobile",                },                {                    title: "主要项目",                    dataIndex: "main",                    key: "main",                    render: (text) => {                        return text ? "是" : "否";                    },                },                {                    title: "项目说明",                    dataIndex: "taskComment",                    key: "taskComment",                    render: (text) => {                        return text && text.length > 8 ? text.substr(0, 8) + "…" : text;                    },                },            ],            ContactsListsNew: [                {                    title: "项目名称",                    dataIndex: "commodityName",                    key: "commodityName",                    render: (text, record) => {                        return <span>{text + "-" + record.tid}</span>;                    },                },                {                    title: "项目分类",                    dataIndex: "projectType",                    key: "projectType",                    render: (text) => {                        let arr = this.state.dataSourceX || [];                        let str = "";                        for (let i = 0; i < arr.length; i++) {                            if (this.state.dataSourceX[i].sort == text) {                                str = this.state.dataSourceX[i].cname;                                return <span>{str}</span>;                            }                        }                    },                },                {                    title: "催款科目",                    dataIndex: "dunTypeName",                    key: "dunTypeName",                    render: (text, record) => {                        if (record.customizeName) {                            return text + record.customizeName;                        }                        return <span>{text}</span>;                    },                },                {                    title: "时间(天)",                    dataIndex: "waitDay",                    key: "waitDay",                    render: (text, record) => {                        if (record.dunTypeName) {                            if (record.customizeTimes) {                                return record.customizeTimes;                            }                            return <span>{text}</span>;                        }                    },                },                {                    title: "金额(万元)",                    dataIndex: "money",                    key: "money",                    render: (text, record) => {                        if (record.dunTypeName) {                            if (record.appropriationRatio) {                                return <span>{record.appropriationRatio}(拨款比例)</span>;                            } else {                                return <span>{text}</span>;                            }                        }                    },                },                {                    title: "服务年限",                    dataIndex: "startDate",                    key: "startDate",                    render: (text, record) => {                        if (record.dunTypeName) {                            return <span>{text}</span>;                        }                    },                },                {                    title: "催款状态",                    dataIndex: "status",                    key: "status",                    render: (text) => {                        return <span>{text == 1 ? "已启动" : "未启动"}</span>;                    },                },            ],            ContactsLists: [                {                    title: "催款科目",                    dataIndex: "dunSubject",                    key: "dunSubject",                    render: (text) => {                        return getjiedian(text);                    },                },                {                    title: "金额(万元)",                    dataIndex: "money",                    key: "money",                },                {                    title: "催款状态",                    dataIndex: "dunStatus",                    key: "dunStatus",                    render: (text) => {                        return getCuikuan(text);                    },                },            ],            dataSourceX:[],            contactList:[],            dataInfor:{},            totalCui:'',            dataSourcerizhi:[]        }        this.xiangqing = this.xiangqing.bind(this);        this.xiangmu = this.xiangmu.bind(this);        this.nextCancel = this.nextCancel.bind(this);        this.jiedianNew = this.jiedianNew.bind(this);        this.jiedian = this.jiedian.bind(this);        this.tableRowClickX = this.tableRowClickX.bind(this);        this.getOrderLog = this.getOrderLog.bind(this);        this.closeOrderLog = this.closeOrderLog.bind(this);        this.rizhi = this.rizhi.bind(this);    }    componentDidMount() {        this.xiangqing();        this.xiangmu();        this.jiedian();        this.jiedianNew();    }    //订单详情    xiangqing() {        this.setState({            loading: true,        });        $.ajax({            method: "get",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/newOrder/getOrderNewDetail",            data: {                orderNo: this.props.orderNo,            },            success: function (data) {                if(data.error.length){                    message.warning(data.error[0].message);                }else{                    let thisdata = data.data;                    this.setState({                        orderUid: thisdata.uid,                        orderNo: thisdata.orderNo, //订单编号                        contractNo: thisdata.contractNo, //合同编号                        userName: thisdata.userName, //客户名称                        signDate: thisdata.signDate, //签单时间                        processStatus: thisdata.processStatus, //流程状态                        liquidationStatus: thisdata.liquidationStatus, //结算状态                        contacts: thisdata.contacts, //企业联系人                        contactMobile: thisdata.contactMobile, //联系人电话                        legalPerson: thisdata.legalPerson, //法人                        legalPersonTel: thisdata.legalPersonTel, //法人电话                        firstAmount: thisdata.firstAmount, //签单金额                        totalAmount: thisdata.totalAmount, //首付金额                        approval: thisdata.approval, //特批状态                        settlementAmount: thisdata.settlementAmount, //已收款项                        orderRemarks: thisdata.orderRemarks, //订单留言                        orgCodeUrl: thisdata.contractPictureUrl                            ? splitUrl(                                thisdata.contractPictureUrl,                                ",",                                globalConfig.avatarHost + "/upload"                            )                            : [], //图片地址                        replenishUrl: thisdata.agreementUrl                            ? splitUrl(                                thisdata.agreementUrl,                                ",",                                globalConfig.avatarHost + "/upload"                            )                            : [], //图片地址                        contentUrl:thisdata.serviceContent                            ? splitUrl(                                thisdata.serviceContent,                                ",",                                globalConfig.avatarHost + "/upload"                              )                            : [], //图片地址                        salesmanName: thisdata.salesmanName, //营销员名称                        salesmanMobile: thisdata.salesmanMobile, //营销员电话                        oldSalesmanName: thisdata.oldSalesmanName, //营销员名称                        oldSalesmanMobile: thisdata.oldSalesmanMobile, //营销员电话                        financeName: thisdata.financeName, //财务名称                        financeMobile: thisdata.financeMobile, //财务电话                        nowFinance: thisdata.nowFinance, //财务名称                        nowFinanceMobile: thisdata.nowFinanceMobile, //财务电话                        depName: thisdata.depName,                        outsource: thisdata.outsource == 0 ? "否" : "是",                        deleteSign:thisdata.deleteSign,                    });                }            }.bind(this),        }).always(            function () {                this.setState({                    loading: false,                });            }.bind(this)        );    }    //项目列表    xiangmu() {        this.setState({            xiangmuLoading: true,        });        $.ajax({            method: "get",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/newOrder/getOrderTask",            data: {                orderNo: this.props.orderNo,            },            success: function (data) {                let theArr = [];                if (data.error.length || data.data.list == "") {                    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];                        thisdata.key = i;                        thisdata.sort = thisdata.cSort;                        theArr.push(thisdata);                    }                }                this.setState({                    dataSourceX: theArr,                });            }.bind(this),        }).always(            function () {                this.setState({                    xiangmuLoading: false,                });            }.bind(this)        );    }    //点击打卡项目详情    tableRowClickX(record) {        this.setState({            addnextVisible: true,            dataInfor:record,        });    }    //项目详情关闭    nextCancel() {        this.setState({            addnextVisible: false,            dataInfor:{},        });    }    //节点列表    jiedian() {        this.setState({            jiedianLoading: true,        });        $.ajax({            method: "get",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/newOrder/selectOrderDun",            data: {                orderNo: this.props.orderNo,            },            success: function (data) {                let theArr = [];                let thisData = [];                if (data.error.length || data.data.list == "") {                    if (data.error && data.error.length) {                        message.warning(data.error[0].message);                    }                } else {                    for (let i = 0; i < data.data.length; i++) {                        thisData = data.data[i];                        theArr.push({                            key: i,                            dunSubject: thisData.dunSubject                                ? thisData.dunSubject.toString()                                : "", //催款科目                            id: thisData.id, //节点Id                            money: thisData.money, //催款金额                            dunStatus: thisData.dunStatus, //催款状态                        });                    }                    this.setState({                        contactList: theArr,                    });                }            }.bind(this),        }).always(            function () {                this.setState({                    jiedianLoading: false,                });            }.bind(this)        );    }    //查看催款节点    jiedianNew() {        this.setState({            jiedianNewLoading: true,        });        $.ajax({            method: "get",            dataType: "json",            crossDomain: false,            url:                globalConfig.context + "/api/admin/newOrderDun/selectListNewOrderDun",            data: {                orderNo: this.props.orderNo,            },            success: function (data) {                if (data.error && data.error.length) {                    message.warning(data.error[0].message);                } else {                    let theArr = [];                    let thisData = [];                    let arr = data.data || [];                    let totalCui = 0;                    for (let i = 0; i < arr.length; i++) {                        thisData = arr[i];                        totalCui += +thisData.money;                        theArr.push({                            key: i,                            dunSubject: thisData.dunSubject                                ? thisData.dunSubject.toString()                                : "", //催款科目                            id: thisData.id, //节点Id                            money: thisData.money, //催款金额                            // orderNo: record ? record.orderNo : this.props.datauser.orderNo,                            commodityName: thisData.commodityName,                            projectType: thisData.projectType,                            dunTypeName: thisData.dunTypeName,                            status: thisData.status,                            waitDay: thisData.waitDay,                            effectiveCount: thisData.effectiveCount,                            startDate: thisData.startDate,                            dunType: thisData.dunType,                            appropriationRatio: thisData.appropriationRatio,                            customizeName: thisData.customizeName,                            customizeTimes: thisData.customizeTimes,                            tid: thisData.tid,                        });                    }                    if (!totalCui) {                        totalCui = 0;                    }                    totalCui = (Math.round(totalCui * 1000000) / 1000000).toFixed(6);                    this.setState({                        contactListNew: theArr,                        totalCui,                    });                }            }.bind(this),        }).always(            function () {                this.setState({                    jiedianNewLoading: false,                });            }.bind(this)        );    }    //查看订单日志    getOrderLog() {        this.setState({            rizhivisible: true,        });        this.rizhi();    }    closeOrderLog() {        this.setState({            rizhivisible: false,            dataSourcerizhi:[]        });    }    rizhi() {        this.setState({            rizhiLoading: true,        });        $.ajax({            method: "get",            dataType: "json",            crossDomain: false,            url: "/api/admin/newOrder/selectOrderLog",            data: {                orderNo: this.props.orderNo,            },            success: function (data) {                let theArr = [];                let thisData = data.data;                if (!thisData.length) {                    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({                            processName: thisdata.processName,                            adminName: thisdata.adminName,                            createDate: thisdata.createDate,                            remarks: thisdata.remarks,                        });                    }                }                this.setState({                    dataSourcerizhi: theArr,                });            }.bind(this),        }).always(            function () {                this.setState({                    rizhiLoading: false,                });            }.bind(this)        );    }    render() {        return (            <Modal                className="customeDetails"                footer=""                title="订单详情"                width="1000px"                visible={this.props.visible}                onOk={this.props.onCancel}                onCancel={this.props.onCancel}            >                <Form layout="horizontal" id="demand-form" style={{ paddingBottom: "40px" }}>                    <Spin spinning={this.state.loading}>                        <div className="clearfix">                            <div style={{position:"absolute",top:'-52px',left:'81px',zIndex:10000}}>                                <OrderItemStatus deleteSign={this.state.deleteSign}/>                            </div>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="订单编号"                            >                                <span>{this.state.orderNo}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="合同编号"                            >                                <span>{this.state.contractNo}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="客户名称"                            >                                <span>{this.state.userName}</span>                                <EnterpriseNameChange                                    type='journal'                                    style={{ marginLeft: 10 }}                                    enterpriseId={this.state.orderUid}/>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="合同签订时间"                            >                                <span>{this.state.signDate}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="流程状态"                            >                                <span>{getProcessStatus(this.state.processStatus)}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="结算状态"                            >                      <span>                        {getLiquidationStatus(this.state.liquidationStatus)}                      </span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="企业联系人"                            >                                <span>{this.state.contacts}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="联系人电话"                            >                                <span>{this.state.contactMobile}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="企业法人"                            >                                <span>{this.state.legalPerson}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="法人电话"                            >                                <span>{this.state.legalPersonTel}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="签单金额(万元)"                            >                                <span>{this.state.totalAmount}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="首付金额(万元)"                            >                                <span>{this.state.firstAmount}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="特批立项"                            >                                <span>{getApprovedState(this.state.approval)}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="已收款项(万元)"                            >                                <span>{this.state.settlementAmount}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="订单部门"                            >                                <span>{this.state.depName}</span>                            </FormItem>                            <FormItem                                className="half-item"                                {...formItemLayout}                                label="是否外包"                            >                                {this.state.outsource}                            </FormItem>                            <div className="clearfix">                                <FormItem                                    labelCol={{ span: 4 }}                                    wrapperCol={{ span: 16 }}                                    label="订单留言"                                >                                    <span>{this.state.orderRemarks}</span>                                </FormItem>                            </div>                            <div className="clearfix">                                <FormItem                                    labelCol={{ span: 4 }}                                    wrapperCol={{ span: 18 }}                                    label={"合同扫描件"}                                >                                    <div style={{paddingTop:'10px',paddingBottom:'10px'}}>                                        {this.props.visible && this.state.orgCodeUrl ? <ImgList fileList={this.state.orgCodeUrl} ItemWidth={'96px'}/> : <div/>}                                    </div>                                    <Button                                        style={{                                            float: "right",                                            marginRight: "140px",                                            marginTop: "20px",                                        }}                                        onClick={this.getOrderLog}                                    >                                        查看订单 日志                                    </Button>                                </FormItem>                                <FormItem                                    labelCol={{ span: 4 }}                                    wrapperCol={{ span: 18 }}                                    label="补充协议"                                >                                    <div style={{paddingTop:'10px',paddingBottom:'10px'}}>                                        {this.props.visible && this.state.replenishUrl ? <ImgList domId={'inquiry1'} fileList={this.state.replenishUrl} ItemWidth={'96px'}/> : <div/>}                                    </div>                                </FormItem>                            </div>                            <ContentUrl                             processStatus={1}                             domId = {"detailContent"}                             contentUrl = {this.state.contentUrl}                             imgId = {"detailContentImg"}                            />                            <div className="clearfix">                                <FormItem                                    className="half-item"                                    {...formItemLayout}                                    label="订单负责人"                                >                                    <span>{this.state.salesmanName}</span>                                </FormItem>                                <FormItem                                    className="half-item"                                    {...formItemLayout}                                    label="订单负责人电话"                                >                                    <span>{this.state.salesmanMobile}</span>                                </FormItem>                            </div>                            <div className="clearfix">                                <FormItem                                    className="half-item"                                    {...formItemLayout}                                    label="当前财务负责人"                                >                                    <span>{this.state.nowFinance}</span>                                </FormItem>                                <FormItem                                    className="half-item"                                    {...formItemLayout}                                    label="当前财务负责人电话"                                >                                    <span>{this.state.nowFinanceMobile}</span>                                </FormItem>                            </div>                            <div className="clearfix">                                <FormItem                                    className="half-item"                                    {...formItemLayout}                                    style={{ opacity: ".5" }}                                    label="原订单负责人"                                >                                    <span>{this.state.oldSalesmanName}</span>                                </FormItem>                                <FormItem                                    className="half-item"                                    {...formItemLayout}                                    style={{ opacity: ".5" }}                                    label="原订单负责人电话"                                >                                    <span>{this.state.oldSalesmanMobile}</span>                                </FormItem>                            </div>                            <div className="clearfix">                                <FormItem                                    className="half-item"                                    style={{ opacity: ".5" }}                                    {...formItemLayout}                                    label="实际财务操作人"                                >                                    <span>{this.state.financeName}</span>                                </FormItem>                                <FormItem                                    className="half-item"                                    {...formItemLayout}                                    style={{ opacity: ".5" }}                                    label="实际财务操作人电话"                                >                                    <span>{this.state.financeMobile}</span>                                </FormItem>                            </div>                            {/*  */}                            <OrderCoor orderNo={this.props.orderNo}/>                            <div>                            <span style={{ marginLeft: "50px", fontSize: "20px" }}>                              项目业务                            </span>                            </div>                            <div className="patent-table">                                <Spin spinning={this.state.xiangmuLoading}>                                    <Table                                        columns={this.state.columnsX}                                        dataSource={this.state.dataSourceX}                                        pagination={false}                                        onRowClick={this.tableRowClickX}                                        bordered                                        size="small"                                    />                                </Spin>                            </div>                            <div>                                <span style={{ marginLeft: "50px", fontSize: "20px" }}>                                  催款节点                                </span>                                <span                                    style={{                                        display: this.state.contactList.length ? "none" : "inline-block",                                        marginLeft: 10,                                        color: "red",                                    }}                                >                                 金额总计(万元): {this.state.totalCui}                                </span>                            </div>                            <div className="clearfix">                                <Spin spinning={                                    this.state.contactList.length ?                                        this.state.jiedianLoading :                                        this.state.jiedianNewLoading                                }>                                    <Form layout="horizontal" id="demand-form">                                        <Table                                            pagination={false}                                            bordered                                            size="small"                                            columns={                                                this.state.contactList.length                                                    ? this.state.ContactsLists                                                    : this.state.ContactsListsNew                                            }                                            dataSource={                                                this.state.contactList.length                                                    ? this.state.contactList                                                    : this.state.contactListNew                                            }                                        />                                    </Form>                                </Spin>                            </div>                        </div>                    </Spin>                </Form>                <OrderRiZi                    dataSourcerizhi={this.state.dataSourcerizhi}                    closeOrderLog={this.closeOrderLog}                    visible={this.state.rizhivisible}                    loading={this.state.rizhiLoading}                />                {this.state.addnextVisible && <ProjectDetailsReadOnly                    infor={this.state.dataInfor}                    visible={this.state.addnextVisible}                    onCancel={this.nextCancel}                />}            </Modal>        )    }}export default Details;
 |