kede-client/js/component/common/initiateOrder/index.jsx

import React, {Component} from "react";
import {Button, Col, Form, message, Radio, Spin, Table, Tag} from "antd";
import PatentCheck from "../patentCheck";
import CheckProject from "../../manageCenter/components/checkProject";

class InitiateOrder extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
            <div>
                <Spin
                    spinning={this.state.sureOutLoading || this.state.waiDetailLoading || this.state.payNodeLoading || this.state.thirdInfoLoading}>
                    <div style={{marginTop: 10}}>
                        <div className="clearfix">
                            <FormItem
                                className="half-item"
                                labelCol={{span: 3}}
                                wrapperCol={{span: 14}}
                                label={
                                    <span>
                            <strong style={{color: '#f00'}}>*</strong>
                            类型
                          </span>
                                }
                            >
                                <Radio.Group
                                    disabled={this.state.payNodeLoading || this.state.thirdInfoLoading}
                                    value={this.state.startType}
                                    onChange={(e) => {
                                        let _this = this;
                                        if (this.state.thirdInfoList.length > 0) {
                                            confirm({
                                                title: '确定要切换吗?',
                                                content: '切换将删除所有第三信息和付款节点',
                                                onOk() {
                                                    return new Promise((resolve, reject) => {
                                                        _this.setState({startType: e.target.value}, () => {
                                                            _this.projectTypeTabContent(_this.state.projectType);
                                                        })
                                                        _this.confirmDeletNew(-1, resolve, reject)
                                                        if (_this.state.payNodeList.length > 0) {
                                                            _this.payNodeConfirmDeletNew(-1, resolve, reject);
                                                        }
                                                    }).catch(() => console.log('Oops errors!'));
                                                },
                                                onCancel() {
                                                },
                                            });
                                        } else {
                                            this.setState({startType: e.target.value}, () => {
                                                this.projectTypeTabContent(this.state.projectType);
                                            })
                                        }
                                    }}
                                >
                                    <Radio value={0}>外包（不走总部）</Radio>
                                    <Radio value={1}>供应商信息</Radio>
                                </Radio.Group>
                            </FormItem>
                        </div>
                        {/* 专利类型 */}
                        <div
                            className="clearfix"
                            style={{
                                display: this.state.projectType === 1 ? 'block' : 'none',
                            }}
                        >
                            <FormItem
                                className="half-item"
                                labelCol={{span: 4}}
                                wrapperCol={{span: 14}}
                                label={
                                    <span>
                            <strong style={{color: '#f00'}}>*</strong>
                            专利类型
                          </span>
                                }
                            >
                                <Radio.Group
                                    disabled={this.state.payNodeLoading || this.state.thirdInfoLoading}
                                    value={this.state.patentType}
                                    onChange={(e) => {
                                        let _this = this;
                                        if (this.state.thirdInfoList.length > 0) {
                                            confirm({
                                                title: '确定要切换吗?',
                                                content: '切换将删除所有第三信息和付款节点',
                                                onOk() {
                                                    return new Promise((resolve, reject) => {
                                                        _this.setState({patentType: e.target.value}, () => {
                                                            _this.projectTypeTabContent(_this.state.projectType);
                                                        })
                                                        _this.confirmDeletNew(-1, resolve, reject)
                                                        if (_this.state.payNodeList.length > 0) {
                                                            _this.payNodeConfirmDeletNew(-1, resolve, reject);
                                                        }
                                                    }).catch(() => console.log('Oops errors!'));
                                                },
                                                onCancel() {
                                                },
                                            });
                                        } else {
                                            this.setState({patentType: e.target.value}, () => {
                                                this.projectTypeTabContent(this.state.projectType);
                                            })
                                        }
                                    }}
                                >
                                    <Radio value={0}>专利申请/变更/转让</Radio>
                                    <Radio value={1}>专利买卖</Radio>
                                </Radio.Group>
                            </FormItem>
                        </div>
                        <div
                            className="clearfix"
                            style={{
                                display: this.state.projectType === 1 ? 'block' : 'none',
                            }}
                        >
                            <FormItem
                                className="half-item"
                                labelCol={{span: 4}}
                                wrapperCol={{span: 14}}
                                label={
                                    <span>
                            <strong style={{color: '#f00'}}>*</strong>
                            专利名称
                          </span>
                                }
                            >
                                <Radio.Group
                                    disabled={this.state.payNodeLoading || this.state.thirdInfoLoading}
                                    value={this.state.patentNameType}
                                    onChange={(e) => {
                                        let _this = this;
                                        if (this.state.thirdInfoList.length > 0) {
                                            confirm({
                                                title: '确定要切换吗?',
                                                content: '切换将删除所有第三信息和付款节点',
                                                onOk() {
                                                    return new Promise((resolve, reject) => {
                                                        _this.setState({patentNameType: e.target.value}, () => {
                                                            _this.projectTypeTabContent(_this.state.projectType);
                                                        })
                                                        _this.confirmDeletNew(-1, resolve, reject)
                                                        if (_this.state.payNodeList.length > 0) {
                                                            _this.payNodeConfirmDeletNew(-1, resolve, reject);
                                                        }
                                                    }).catch(() => console.log('Oops errors!'));
                                                },
                                                onCancel() {
                                                },
                                            });
                                        } else {
                                            this.setState({patentNameType: e.target.value}, () => {
                                                this.projectTypeTabContent(this.state.projectType);
                                            })
                                        }
                                    }}
                                >
                                    <Radio value={0}>实用新型专利</Radio>
                                    <Radio value={1}>发明专利</Radio>
                                    <Radio value={2}>外观专利</Radio>
                                    {/*<Radio value={3}>*/}
                                    {/*  其他*/}
                                    {/*  <Input*/}
                                    {/*    disabled={this.state.patentNameType !== 3}*/}
                                    {/*    value={this.state.patentName}*/}
                                    {/*    style={{ marginLeft: '15px' }}*/}
                                    {/*    onChange={(e) => {*/}
                                    {/*      this.setState({*/}
                                    {/*        patentName: e.target.value,*/}
                                    {/*      })*/}
                                    {/*    }}*/}
                                    {/*    placeholder="请填写专利名称"*/}
                                    {/*  />*/}
                                    {/*</Radio>*/}
                                </Radio.Group>
                            </FormItem>
                        </div>
                        {/*外包类型无此选项*/}
                        {this.state.startType !== 0 && this.state.projectType === 1 ? <div className="clearfix">
                            <FormItem
                                className="half-item"
                                labelCol={{span: 3}}
                                wrapperCol={{span: 15}}
                                label={<span>官费</span>}>
                                {
                                    this.state.patentType === 1 ?
                                        <Radio.Group
                                            value={this.state.containOfficialFees}
                                            onChange={(e) => {
                                                this.setState({containOfficialFees: e.target.value})
                                            }}
                                        >
                                            <Radio value={0}>实际已缴费</Radio>
                                            <Radio value={1}>实际未缴费</Radio>
                                        </Radio.Group> :
                                        <PatentCheck
                                            style={{
                                                display: 'flex',
                                                alignItems: 'center',
                                            }}
                                            id={this.state.id}
                                            patentTypeName={this.state.patentTypeName}
                                            checkStatus={this.state.checkStatus}  //核对状态
                                            projectType={this.state.projectType}  //项目类型
                                            patentType={this.state.patentType}   //专利类型
                                            startType={this.state.startType}   //1供应商 0外包
                                            orderTaskOfficialCost={this.state.orderTaskOfficialCost}  //1含官费 0不含官费
                                            orderTaskCostReduction={this.state.orderTaskCostReduction} //1有费减 0无费减
                                            isPreviewPay={false}
                                            onRefresh={() => {
                                                this.xiangqing(this.state.tid);
                                            }}
                                            status={this.state.refundStatus}
                                        />
                                }
                            </FormItem>
                        </div> : <div/>}
                        {/* 第三方信息专利 */}
                        <div>
                      <span
                          style={{
                              fontSize: '18px',
                          }}
                      >
                        第三方信息
                      </span>
                            <span
                                style={{
                                    display: 'inline-block',
                                    marginLeft: 10,
                                    color: 'red',
                                }}
                            >
                        金额总计(万元): {this.state.allTotalAmount}
                      </span>
                            <Button
                                type="primary"
                                onClick={(e) => {
                                    //this.state.startType 0外包 1供应商   类型为外包时,当普通单
                                    if (this.state.projectType === 1 && this.state.patentType === -1) {
                                        message.info('请先选择专利类型');
                                    } else if (this.state.projectType === 1 && this.state.patentNameType === -1) {
                                        message.info('请先选择专利名称');
                                    } else {
                                        this.addThirdList()
                                    }
                                }}
                                style={{
                                    float: 'right',
                                    marginRight: '50px',
                                    marginBottom: '15px',
                                }}
                            >
                                +新增第三方信息
                            </Button>
                        </div>
                        <div
                            className="clearfix"
                            style={{
                                // display: this.state.type == 1 ? "block" : "none",
                                display: this.state.type == 1 ? 'block' : 'block',
                            }}
                        >
                            <Spin spinning={this.state.thirdInfoLoading}>
                                <Form layout="horizontal">
                                    <Table
                                        pagination={false}
                                        columns={this.state.ContactsListsNew}
                                        dataSource={this.state.thirdInfoList}
                                        onRowClick={this.tableRowClickOne}
                                        scroll={{x: 'max-content', y: 0}}
                                        bordered
                                        size="small"
                                    />
                                    <Col
                                        span={24}
                                        offset={9}
                                        style={{marginTop: '15px'}}
                                    />
                                </Form>
                            </Spin>
                        </div>
                        {/*如果是软著类或者专利类的专利申请，隐藏付款节点 但当为外包类型时,无需隐藏*/}
                        {/*this.state.startType 0外包 1供应商*/}
                        <div
                            style={{
                                display: this.state.startType === 0 ? 'block' : ((this.state.projectType === 1 && this.state.patentType === 0) || this.state.projectType === 2 ? 'none' : 'block'),  //0正常 1专利 2软著 3审计
                            }}
                        >
                      <span
                          style={{
                              fontSize: '18px',
                          }}
                      >
                        付款节点
                      </span>
                            <span
                                style={{
                                    display: 'inline-block',
                                    marginLeft: 10,
                                    color: 'red',
                                }}
                            />
                            <Button
                                type="primary"
                                onClick={(e) => {
                                    this.addPayNode()
                                }}
                                style={{
                                    float: 'right',
                                    marginRight: '50px',
                                    marginBottom: '15px',
                                }}
                            >
                                +新增付款节点
                            </Button>
                        </div>
                        {/*如果是软著类或者专利类的专利申请，隐藏付款节点 但当为外包类型时,无需隐藏*/}
                        <div
                            className="clearfix"
                            style={{
                                display: this.state.startType === 0 ? 'block' : ((this.state.projectType === 1 && this.state.patentType === 0) || this.state.projectType === 2 ? 'none' : 'block'),  //0正常 1专利 2软著 3审计
                            }}
                        >
                            <Spin spinning={this.state.payNodeLoading}>
                                <Form layout="horizontal">
                                    <Table
                                        pagination={false}
                                        columns={this.state.PayNodeTableColunms}
                                        dataSource={this.state.payNodeList}
                                        onRowClick={this.payNodeTableRowClickOne}
                                        scroll={{x: 'max-content', y: 0}}
                                        bordered
                                        size="small"
                                    />
                                    <Col
                                        span={24}
                                        offset={9}
                                        style={{marginTop: '15px'}}
                                    />
                                </Form>
                            </Spin>
                        </div>
                        <div className="clearfix">
                            <FormItem
                                className="half-item"
                                {...formItemLayout}
                                label={
                                    <span>
                            <strong style={{color: '#f00'}}>*</strong>备注
                          </span>
                                }
                            >
                                <TextArea
                                    rows={4}
                                    value={this.state.outsourceRemarks}
                                    onChange={(e) => {
                                        this.setState({
                                            outsourceRemarks: e.target.value,
                                        })
                                    }}
                                    placeholder="请输入备注"
                                />
                            </FormItem>
                        </div>
                        <p
                            className="tip"
                            style={{
                                paddingBottom: '12px',
                                width: '240px',
                                marginLeft: '145px',
                                color: 'red',
                            }}
                        >
                            首次派单项目,需上传协议,第2次起,同项目,只需写外包公司
                        </p>
                        <div className="clearfix">
                            <FormItem
                                labelCol={{span: 4}}
                                wrapperCol={{span: 18}}
                                label={
                                    <span>
                            合同/协议扫描件
                          </span>
                                }
                            >
                                <PicturesWall
                                    domId={'myTask3'}
                                    fileList={this.getOrgCodeUrlWai}
                                    pictureUrl={this.state.pictureUrl}
                                />
                                <p style={{color: 'red'}}>图片建议：要清晰。</p>
                            </FormItem>
                        </div>
                        {/*只有审核拒绝和第一次发起外包的时候才要填写发起原因   如果是类型为供应商则不需要发起原因*/}
                        {/*this.state.startType  0外包  1供应商*/}
                        {(typeof this.state.refundStatus === 'undefined' || this.state.refundStatus === 2) && this.state.startType !== 1 ?
                            <div className="clearfix">
                                <FormItem
                                    className="half-item"
                                    {...formItemLayout}
                                    label={
                                        <span>
                            <strong style={{color: '#f00'}}>*</strong>发起原因
                          </span>
                                    }
                                >
                                    <TextArea
                                        rows={4}
                                        value={this.state.reason}
                                        onChange={(e) => {
                                            this.setState({
                                                reason: e.target.value,
                                            })
                                        }}
                                        placeholder="请输入发起原因"
                                    />
                                </FormItem>
                            </div> : <div/>}
                        <div className="clearfix">
                            <div
                                style={{
                                    display: 'inline-black',
                                    textAlign: 'center',
                                }}
                            >
                                <Button
                                    type="primary"
                                    loading={this.state.loading}
                                    onClick={() => {
                                        this.sureOut(this.state.startType);
                                    }}
                                >
                                    {
                                        this.state.startType === 0 ? "确认发起外包,不通过总部1" : "提交供应商信息"
                                    }
                                </Button>
                                <p className="tip" style={{color: 'red'}}>
                                    {
                                        this.state.startType === 0 ? "提示:高于总部价格,费用个人承担" : "确定提交供应商信息,提交后,不可修改"
                                    }
                                </p>
                            </div>
                        </div>
                    </div>
                    {(this.state.refundStatus == 1 ||
                        this.state.refundStatus == 0 ||
                        this.state.refundStatus == 2) &&
                    this.state.startType !== 1
                        ? (
                            <div className="clearfix"
                                 style={{
                                     display: this.state.refundStatus == 0 ? 'none' : 'block',
                                 }}
                            >
                                <hr className="division"/>
                                {parseInt(this.state.startType) !== 1 ? <div style={{
                                    color: '#F00',
                                    fontWeight: 'bolder',
                                    paddingBottom: '20px',
                                }}>
                                    审核结果: <span
                                    style={{paddingLeft: '20px'}}>{getRefundStatus(this.state.refundStatus)}</span>
                                </div> : <div/>}
                                <div className="outsourceLogList">
                                    {
                                        this.state.outsourceLogs && this.state.outsourceLogs.map((value, index) => (
                                            <div key={index} className="outsourceLogItem outsource">
                                                <div style={{
                                                    display: 'flex',
                                                    flexFlow: 'row nowrap',
                                                    paddingBottom: '3px',
                                                    paddingTop: '3px',
                                                }}>
                                                    <div>
                                                        {value.aname}
                                                    </div>
                                                    <div style={{paddingLeft: '5px'}}>
                                                        {
                                                            value.status === 0 ?
                                                                <Tag color="#2db7f5">发起外包审核</Tag> :
                                                                value.status === 1 ? <Tag color="#87d068">通过</Tag> :
                                                                    <Tag color="#f50">驳回</Tag>
                                                        }
                                                    </div>
                                                    <div style={{
                                                        wordBreak: 'break-all',
                                                        maxWidth: '67%',
                                                    }}>
                                                        {value.remarks}
                                                    </div>
                                                    <div style={{paddingLeft: '10px'}}>
                                                        {value.createTimes}
                                                    </div>
                                                </div>
                                            </div>
                                        ))
                                    }
                                </div>
                            </div>
                        ) : (
                            ''
                        )}
                </Spin>
            </div>
        )
    }
}

export default InitiateOrder;