kede-client/js/component/manageCenter/project/task/newSupplier.js

import React, { Component } from 'react';
import { AutoComplete, Button, Form, Input, message, Modal, InputNumber, Select, Spin } from "antd";
import {
    getMaterialStatus,
    getUrgentStatus,
} from '@/tools'
import $ from "jquery";

const { Option } = Select
const { TextArea } = Input

const formItemLayout = {
    labelCol: { span: 8 },
    wrapperCol: { span: 14 },
}

class NewSupplier extends Component {
    constructor(props) {
        super(props);
        this.state = {
            thirdCompanyName: props.thirdCompanyName && props.thirdCompanyName.split('-')[0],
            thirdUnitPrice: props.thirdUnitPrice || 0,
            thirdQuantity: props.thirdQuantity || 0,
            thirdRemarks: props.thirdRemarks,
            thirdMaterial: props.thirdMaterial,
            thirdUrgent: props.thirdUrgent,
            patentType: props.patentType,
            audit: props.audit,
            assets: props.assets,
            income: props.income,
            customerArr: [],
            loading: false,
            officialCost: "", //是否有官费
            costReduction: "", //是否有费减
        }
        this.calculatedAmount = this.calculatedAmount.bind(this);
    }

    componentDidMount() {
        if (this.props.ThirdId) {
            this.supervisor(this.state.thirdCompanyName)
        }
    }

    //服务值改变时请求供应商名称
    httpChange(e) {
        if (e.length >= 1) {
            this.supervisor(e)
        }
        this.props.otherOperations && this.props.otherOperations({
            thirdMaterial: this.state.thirdMaterial,
            thirdUrgent: this.state.thirdUrgent,
            customerArr: this.state.customerArr,
            thirdCompanyName: e,
        });
        this.setState({
            thirdCompanyName: e,
        })
    }

    //加载(自动补全)
    supervisor(e) {
        $.ajax({
            method: 'get',
            dataType: 'json',
            crossDomain: false,
            url: globalConfig.context + '/api/admin/company/selectVague',
            data: {
                name: e,
                //0软著用 1其他用 2专利申请用
                type:
                    this.props.projectType === 2 ?
                        0 :
                        (this.props.projectType === 1 && this.props.patentType === 0) ? 2 : 1     //this.props.projectType 0正常 1专利 2软著 3审计    this.props.patentType 0:专利申请/变更/转让  1:专利买卖
            },
            success: function (data) {
                let thedata = data.data
                if (!thedata) {
                    if (data.error && data.error.length) {
                        message.warning(data.error[0].message)
                    }
                    thedata = {}
                }
                this.setState({
                    customerArr: thedata,
                })
                this.props.otherOperations && this.props.otherOperations({
                    thirdMaterial: this.state.thirdMaterial,
                    thirdUrgent: this.state.thirdUrgent,
                    customerArr: thedata,
                    thirdCompanyName: this.state.thirdCompanyName,
                });
            }.bind(this),
        }).always(
            function () {
                this.setState({
                    loading: false,
                })
            }.bind(this)
        )
    }

    // 第三方信息自动计算总金额
    calculatedAmount() {
        let currentTotalPrice
        currentTotalPrice = (this.state.thirdQuantity * 1000000) * (this.state.thirdUnitPrice * 1000000) / 1000000 / 1000000
        currentTotalPrice = currentTotalPrice.toFixed(4)
        this.setState({
            currentTotalPrice: currentTotalPrice,
        })
    }

    // 保存供应商信息
    handleCancelq() {
        let api
        if (this.props.ThirdId) {
            //修改
            api = '/api/admin/company/updateCompany'
        } else {
            //新增
            api = '/api/admin/company/addCompany'
        }

        if (!this.state.thirdCompanyName) {
            message.warning('请输入供应商名称')
            return;
        }

        if (!this.state.thirdUnitPrice && this.props.projectType !== 2 && !(this.props.projectType === 1 && this.props.patentType === 0)) {
            message.warning('请输入正确的单价')
            return;
        }

        if (!this.state.thirdQuantity) {
            message.warning('请输入数量')
            return;
        }

        let customerId = 0;
        let isHave = this.state.customerArr.some((value) => {
            if (value.companyName === this.state.thirdCompanyName) {
                customerId = value.id
                return true;
            }
        });
        //软著  必须要使用查询出来第三方名称和对应id
        if (!isHave && this.props.projectType === 2) {   //projectType   0正常 1专利 2软著 3审计
            message.warning('请输入正确的供应商名称')
            return;
        }

        //专利  必须要使用查询出来第三方名称和对应id
        if (!isHave && this.props.projectType === 1 && this.props.patentType === 0) {   //projectType   0正常 1专利 2软著 3审计   patentType  0:专利申请/变更/转让  1:专利买卖
            message.warning('请输入正确的供应商名称')
            return;
        }

        let data = {
            id: this.props.ThirdId,                     //id
            tid: this.props.tid,                        //订单编号
            companyName: this.state.thirdCompanyName,   //第三方名称
            quantity: this.state.thirdQuantity,         //数量
            remarks: this.state.thirdRemarks,           //备注
        }
        if (isHave) {
            data.cid = customerId     //公司id            只有软著类要传cid,其他类型都是非必填的
        }
        if (this.props.projectType === 2) {
            data.material = this.state.thirdMaterial;   //方案
            data.urgent = this.state.thirdUrgent;       //加急
            data.calculation = 1;                       //0 其他 1软著 2专利
        } else {                                          //非软著类需要传总金额
            data.totalAmount = (this.state.thirdQuantity * 1000000) * (this.state.thirdUnitPrice * 1000000) / 1000000 / 1000000;
            data.calculation = 0;                       //0 其他 1软著 2专利
        }
        if (this.props.projectType === 1 && this.props.patentType === 0) {
            data.calculation = 2;                       //0 其他 1软著 2专利
        }

        // data.type = this.props.realProjectType === 1 ? (this.props.patentType === 0 ? 1 : 2) : 0   //0其他 1专利申请 2专利买卖
        if (this.props.realProjectType === 1) {                   //专利
            data.patentType = this.props.patentType === 0 ? 0 : 1;     //专利类型
            data.patentNameType = this.props.patentNameType;                                                     //专利名称
        }

        data.startType = this.props.startType;     //项目类型 0外包  1供应商

        if (this.props.projectType === 3) {
            if (!this.state.audit) {
                message.warning("请选择审计！");
                return false;
            }
            if (!this.state.assets) {
                message.warning("请输入公司资产！");
                return false;
            }
            if (!this.state.income) {
                message.warning("请输入收入！");
                return false;
            }
        }

        //projectType   0正常 1专利 2软著 3审计
        //软著不需要传 单价
        if (this.props.projectType !== 2) {
            data.unitPrice = this.state.thirdUnitPrice;       //单价
        }

        if (this.props.projectType === 3) {                   //审计
            data.assets = this.state.assets; //资产
            data.audit = this.state.audit;   //0无审计 1年审 2专审
            data.income = this.state.income;   //收入
        }

        //已经发起的供应商项目新增第三方时需要传type=1
        if (this.props.isLaunch && !this.props.ThirdId && this.props.startType === 1) {
            data.type = 1;   //在发起供应商后，新增第三方需要加上type=1,因为在发起供应商会计算成本，这个新增的需要单独去计算
        }

        this.setState({
            loading: true,
        })
        $.ajax({
            url: globalConfig.context + api,
            method: 'post',
            dataType: 'json',
            crossDomain: false,
            data: data,
        }).done(
            function (data) {
                this.setState({
                    loading: false,
                })
                if (!data.error.length) {
                    message.success('保存成功！')
                    this.setState({
                        thirdCompanyName: '', //第三方名称
                        thirdUnitPrice: 0, //单价
                        thirdQuantity: 0, //数量
                        currentTotalPrice: 0, //总价
                        thirdRemarks: '',
                        thirdUrgent: 0,
                    })
                    !!this.props.payNodeTable && this.props.payNodeTable();
                    this.props.onCancel();
                } else {
                    message.warning(data.error[0].message)
                }
            }.bind(this)
        )
    }

    render() {
        return (
            <Modal
                maskClosable={false}
                visible={this.props.visible}
                onCancel={this.props.onCancel}
                width={800}
                title={this.props.ThirdId ? "修改第三方信息" : "新增第三方信息"}
                footer=""
                className="admin-desc-content"
            >
                <Form
                    layout="horizontal"
                    style={{ paddingBottom: '40px' }}
                >
                    <Spin spinning={this.state.loading}>
                        <div className="clearfix">
                            <div className="clearfix">
                                {/*
                                     projectType   0正常 1专利 2软著 3审计
                                     patentType  0:专利申请/变更/转让  1:专利买卖
                                 */}
                                <Form.Item
                                    {...formItemLayout}
                                    label="供应商名称"
                                    help={
                                        this.props.projectType === 2 ||
                                            (this.props.projectType === 1 &&
                                                this.props.patentType === 0) ? '输入供应商关键字，并选择系统后台已有供应商，如“长沙科明”' : ''
                                    }
                                >
                                    <AutoComplete
                                        className="certain-category-search"
                                        dropdownClassName="certain-category-search-dropdown"
                                        dropdownMatchSelectWidth={false}
                                        dropdownStyle={{ width: 220 }}
                                        style={{ width: '220px' }}
                                        dataSource={(this.state.customerArr || []).map((group) => (
                                            <Select.Option key={group.id} value={group.companyName}>
                                                {group.companyName}
                                            </Select.Option>
                                        ))}
                                        placeholder="请输入供应商名称"
                                        value={this.state.thirdCompanyName}
                                        onChange={(e) => {
                                            this.httpChange(e)
                                        }}
                                        filterOption={true}
                                        required="required"
                                    />
                                    <span className="mandatory">*</span>
                                </Form.Item>
                            </div>
                            {/*projectType 0正常 1专利 2软著 3审计*/}
                            {this.props.projectType !== 2 && !(this.props.projectType === 1 && this.props.patentType === 0) ? <div className="clearfix">
                                <Form.Item {...formItemLayout} label="单价（万元）">
                                    <InputNumber
                                        min={0}
                                        value={this.state.thirdUnitPrice}
                                        placeholder="请输入单价(必填项)"
                                        required="required"
                                        onBlur={this.calculatedAmount}
                                        onChange={(value) => {
                                            this.setState({
                                                thirdUnitPrice: value,
                                            })
                                        }}
                                        dropdownStyle={{ width: 220 }}
                                        style={{
                                            width: '220px',
                                        }}
                                    />
                                    <span className="mandatory" style={{
                                        marginLeft: '-2px',
                                    }}>
                                        *
                                    </span>
                                </Form.Item>
                            </div> : <div />}
                            <div className="clearfix">
                                <Form.Item {...formItemLayout} label="数量">
                                    <InputNumber
                                        min={0}
                                        value={this.state.thirdQuantity}
                                        placeholder="请输入数量(必填项)"
                                        onBlur={this.calculatedAmount}
                                        precision={0}
                                        onChange={(value) => {
                                            this.setState({
                                                thirdQuantity: value,
                                            })
                                        }}
                                        style={{ width: '220px' }}
                                    />
                                    <span className="mandatory" style={{
                                        marginLeft: '-2px',
                                    }}>
                                        *
                                    </span>
                                </Form.Item>
                            </div>
                            {/*专利 的专利申请 和 软著没有总价*/}
                            {this.props.projectType !== 2 && this.props.patentType !== 0 ? <div className="clearfix">
                                <Form.Item {...formItemLayout} label="总价（万元）">
                                    <span>
                                        {
                                            ((this.state.thirdQuantity || 0) * 1000000) *
                                            ((this.state.thirdUnitPrice || 0) * 1000000) / 1000000 / 1000000
                                        }
                                    </span>
                                </Form.Item>
                            </div> : <div />}
                            {this.props.projectType === 2 ? <div>
                                <div className="clearfix">
                                    <Form.Item {...formItemLayout} label="方案">
                                        <Select
                                            value={this.state.thirdMaterial}
                                            onChange={(val) => {
                                                this.setState({
                                                    thirdMaterial: val,
                                                })
                                                this.props.otherOperations && this.props.otherOperations({
                                                    thirdMaterial: val,
                                                    thirdUrgent: this.state.thirdUrgent,
                                                    customerArr: this.state.customerArr,
                                                    thirdCompanyName: this.state.thirdCompanyName,
                                                });
                                            }}
                                            style={{ width: '220px' }}
                                            defaultValue="0"
                                        >
                                            <Option value={0}>无方案</Option>
                                            <Option value={1}>有方案</Option>
                                        </Select>
                                        <span className="mandatory">*</span>
                                    </Form.Item>
                                </div>
                                <div className="clearfix">
                                    <Form.Item {...formItemLayout} label="加急">
                                        <Select
                                            value={getUrgentStatus(this.state.thirdUrgent)}
                                            onChange={(val) => {
                                                this.setState({
                                                    thirdUrgent: val,
                                                })
                                                this.props.otherOperations && this.props.otherOperations({
                                                    thirdMaterial: this.state.thirdMaterial,
                                                    thirdUrgent: val,
                                                    customerArr: this.state.customerArr,
                                                    thirdCompanyName: this.state.thirdCompanyName
                                                });
                                            }}
                                            style={{ width: '220px' }}
                                            defaultValue="0"
                                        >
                                            <Option value="0">无加急</Option>
                                            <Option value="1">加急3-5个工作日</Option>
                                            <Option value="2">加急6-10个工作日</Option>
                                            <Option value="3">加急11-15个工作日</Option>
                                            <Option value="4">加急16-20个工作日</Option>
                                            <Option value="5">加急21-25个工作日</Option>
                                            <Option value="6">加急26-30个工作日</Option>
                                            <Option value="7">加急45个工作日</Option>
                                        </Select>
                                        <span className="mandatory">*</span>
                                    </Form.Item>
                                </div>
                            </div> : <div />}
                            {/*{*/}
                            {/*    this.props.patentType === 0 ? <div>*/}
                            {/*        <div className="clearfix">*/}
                            {/*            <Form.Item*/}
                            {/*                {...formItemLayout}*/}
                            {/*                label="官费："*/}
                            {/*            >*/}
                            {/*                <span style={{ color: "red", marginRight: "27px" }}>*/}
                            {/*                    **/}
                            {/*                </span>*/}
                            {/*                <Radio.Group*/}
                            {/*                    value={this.state.officialCost}*/}
                            {/*                    onChange={(e) => {*/}
                            {/*                        this.setState({ officialCost: e.target.value });*/}
                            {/*                    }}*/}
                            {/*                >*/}
                            {/*                    <Radio value={1}>含官费</Radio>*/}
                            {/*                    <Radio value={0}>不含官费</Radio>*/}
                            {/*                </Radio.Group>*/}
                            {/*            </Form.Item>*/}
                            {/*        </div>*/}
                            {/*        <div className="clearfix">*/}
                            {/*            <Form.Item*/}
                            {/*                {...formItemLayout}*/}
                            {/*                label="费减："*/}
                            {/*            >*/}
                            {/*                <span style={{ color: "red", marginRight: "27px" }}>*/}
                            {/*                    **/}
                            {/*                </span>*/}
                            {/*                <Radio.Group*/}
                            {/*                    value={this.state.costReduction}*/}
                            {/*                    onChange={(e) => {*/}
                            {/*                        this.setState({ costReduction: e.target.value });*/}
                            {/*                    }}*/}
                            {/*                >*/}
                            {/*                    <Radio value={1}>有费减</Radio>*/}
                            {/*                    <Radio value={0}>无费减</Radio>*/}
                            {/*                </Radio.Group>*/}
                            {/*            </Form.Item>*/}
                            {/*        </div>*/}
                            {/*    </div> : <div/>*/}
                            {/*}*/}
                            {
                                this.props.projectType === 3 ? <div>
                                    <div className="clearfix">
                                        <Form.Item {...formItemLayout} label="审计">
                                            <Select
                                                value={this.state.audit}
                                                onChange={(val) => {
                                                    this.setState({
                                                        audit: val,
                                                    })
                                                }}
                                                style={{ width: '220px' }}
                                                defaultValue="0"
                                            >
                                                {/*0无审计 1年审 2专审*/}
                                                <Option value={1}>年审</Option>
                                                <Option value={2}>专审</Option>
                                            </Select>
                                            <span className="mandatory">*</span>
                                        </Form.Item>
                                    </div>
                                    <div className="clearfix">
                                        <Form.Item {...formItemLayout} label="公司资产（万元）">
                                            <InputNumber
                                                min={0}
                                                value={this.state.assets}
                                                placeholder="请输入公司资产"
                                                required="required"
                                                onChange={(value) => {
                                                    this.setState({
                                                        assets: value,
                                                    })
                                                }}
                                                style={{ width: '220px' }}
                                            />
                                            <span className="mandatory">*</span>
                                        </Form.Item>
                                    </div>
                                    <div className="clearfix">
                                        <Form.Item {...formItemLayout} label="收入（万元）">
                                            <InputNumber
                                                min={0}
                                                value={this.state.income}
                                                placeholder="请输入收入"
                                                required="required"
                                                onChange={(value) => {
                                                    this.setState({
                                                        income: value,
                                                    })
                                                }}
                                                style={{ width: '220px' }}
                                            />
                                            <span className="mandatory">*</span>
                                        </Form.Item>
                                    </div>
                                </div> : <div />
                            }
                            <div className="clearfix">
                                <Form.Item
                                    style={{ height: 'auto' }}
                                    labelCol={{ span: 4 }}
                                    wrapperCol={{ span: 18 }}
                                    label="备注"
                                >
                                    <TextArea
                                        rows={4}
                                        placeholder="请输入备注"
                                        ref="signTotalAmount"
                                        style={{ width: '95%' }}
                                        value={this.state.thirdRemarks}
                                        onChange={(e) => {
                                            this.setState({
                                                thirdRemarks: e.target.value,
                                            })
                                        }}
                                    />
                                </Form.Item>
                            </div>
                            <div className="clearfix">
                                <div className="addSave" style={{ marginTop: '15px' }}>
                                    <Button
                                        className="cancel"
                                        type="primary"
                                        onClick={() => {
                                            this.handleCancelq();
                                        }}
                                        style={{ marginLeft: '300px' }}
                                        htmlType="submit"
                                    >
                                        保存
                                    </Button>
                                    <Button
                                        className="cancel"
                                        type="ghost"
                                        onClick={this.props.onCancel}
                                        style={{ marginLeft: '50px' }}
                                    >
                                        取消
                                    </Button>
                                </div>
                            </div>
                        </div>
                    </Spin>
                </Form>
            </Modal>
        )
    }
}

export default NewSupplier;