| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571 | import React,{Component} from "react";import {    Modal,    Form,    Row,    Col,    Table,    Spin,    message,    Button,    Input,    Select,    DatePicker,    Popconfirm,    Tooltip} from "antd";import $ from "jquery/src/ajax";import moment from 'moment';import ReminderLog from "../../customer/NEW/crm/reminderLog";import {getPatentType} from "@/tools.js";import { patentTypeList} from '@/dataDic.js';const FormItem = Form.Item;const formItemLayout = {    labelCol: { span: 10 },    wrapperCol: { span: 14 },};class PatentDetails extends Component{    constructor(props) {        super(props);        this.state={            columns:[                {                    title: "序号",                    dataIndex: "key",                    key: "key",                    width:'50px'                },                {                    title: "费用种类",                    dataIndex: "years",                    key: "years",                    width:'150px',                    render:(text)=>(                        <span>                            {getPatentType(this.props.detailsInfor.type)}                            第                            {text}                            年年费                        </span>                    )                },                {                    title: "金额",                    dataIndex: "patentAmount",                    key: "patentAmount",                    width:'100px'                },                {                    title: "缴费日",                    dataIndex: "endDate",                    key: "endDate",                    width:'100px',                    render:(text)=>(                        moment(text).format('YYYY-MM-DD')                    )                },            ],            dataSource:[],            loading:false,            detailsInfor:{},        }        this.payLoadData = this.payLoadData.bind(this);        this.onChange = this.onChange.bind(this);    }    componentDidMount() {        this.payLoadData();        const {detailsInfor, readOnly} = this.props;        if (!readOnly) {            this.setState({                patentNo: detailsInfor.patentNo,                tid: detailsInfor.tid,                email:detailsInfor.email,                name: detailsInfor.name,                type: detailsInfor.type,                holders: detailsInfor.holders,                inventor: detailsInfor.inventor,                applyDates: detailsInfor.applyDates,                authorizationDates: detailsInfor.authorizationDates,                annualFeeStatus: detailsInfor.annualFeeStatus,                delayingAmount: detailsInfor.delayingAmount,                recoveryAmount: detailsInfor.recoveryAmount,            })        }    }    payLoadData() {        this.setState({            loading: true,        });        const {detailsInfor} = this.props;        $.ajax({            method: "get",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/patentNew/patentPaymentDetails",            data: {                id:detailsInfor.id            },            success: function (data) {                if(data.error.length === 0){                    for(let i =0;i<data.data.length;i++){                        data.data[i].key = i+1;                    }                    this.setState({                        dataSource: data.data,                    });                }else{                    message.warning(data.error[0].message);                }            }.bind(this),        }).always(            function () {                this.setState({                    loading: false,                });            }.bind(this)        );    }    onChange(){        if(!this.state.patentNo){            message.warning('请输入专利号')            return;        }        if(!this.state.name){            message.warning('请输入专利名称')            return;        }        if(isNaN(parseInt(this.state.type))){            message.warning('请选择专利类型')            return;        }        if(!this.state.applyDates){            message.warning('请选择申请日期')            return;        }        if(!isNaN(parseInt(this.state.delayingAmount)) && this.state.delayingAmount < 0){            message.warning('滞纳金不能小于零')            return;        }        if(!isNaN(parseInt(this.state.recoveryAmount))  && this.state.recoveryAmount < 0){            message.warning('权利恢复费不能小于零')            return;        }        this.setState({            loading: true,        });        const {detailsInfor} = this.props;        $.ajax({            method: "POST",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/patentNew/updatePatentNew",            data: {                id:detailsInfor.id,                patentNo: this.state.patentNo,                name: this.state.name,                type: this.state.type,                applyDates: this.state.applyDates,                tid: this.state.tid || undefined,                email: this.state.email || undefined,                holders: this.state.holders || undefined,                inventor: this.state.inventor || undefined,                authorizationDates: this.state.authorizationDates || undefined,                annualFeeStatus: isNaN(parseInt(this.state.annualFeeStatus)) ? undefined : this.state.annualFeeStatus,                delayingAmount: isNaN(parseInt(this.state.delayingAmount)) ? undefined : this.state.delayingAmount,                recoveryAmount: isNaN(parseInt(this.state.recoveryAmount)) ? undefined : this.state.recoveryAmount,            },            success: function (data) {                if(data.error.length === 0){                    message.success('修改成功');                    this.props.onRefresh();                    this.props.onCancel();                }else{                    message.warning(data.error[0].message);                }            }.bind(this),        }).always(            function () {                this.setState({                    loading: false,                });            }.bind(this)        );    }    render() {        const {detailsInfor,readOnly} = this.props;        return (            <Modal                title='年费数据'                className='payRecordComponent'                width={800}                maskClosable={false}                footer={null}                visible={this.props.visible}                onCancel={this.props.onCancel}            >                <Button                    onClick={()=>{                        this.setState({                            visible:true,                            id:detailsInfor.id                        })                    }}                    style={{                        position: 'absolute',                        top: '9px',                        right: '49px',                    }}                    type='primary'>                    查看专利日志                </Button>                <Form layout="horizontal">                    <Row gutter={40}>                        <Col span={8}>                            <FormItem                                required                                {...formItemLayout}                                label='专利号'                            >                                {                                    readOnly ? detailsInfor.patentNo :                                        <Input                                            value={this.state.patentNo}                                            onChange={(e)=>{                                                this.setState({                                                    patentNo:e.target.value                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='专利名称'                                required                            >                                {                                    readOnly ? detailsInfor.name :                                        <Input                                            value={this.state.name}                                            onChange={(e)=>{                                                this.setState({                                                    name:e.target.value                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='专利类型'                                required                            >                                {                                    readOnly ?                                    getPatentType(detailsInfor.type) :                                    <Select                                        placeholder="请选择专利类型"                                        style={{paddingTop: '5px'}}                                        value={getPatentType(this.state.type)}                                        onChange={e => {                                            this.setState({ type: e });                                        }}                                    >                                        {patentTypeList.map(function(item) {                                            return (                                                <Select.Option key={item.value}>                                                    {item.key}                                                </Select.Option>                                            );                                        })}                                    </Select>                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='申请日期'                                required                            >                                {                                    readOnly ? detailsInfor.applyDates:                                        <DatePicker                                            value={this.state.applyDates ? moment(this.state.applyDates) : ''}                                            format='YYYY-MM-DD'                                            onChange={(date)=>{                                                this.setState({                                                    applyDates:date ? moment(date).format('YYYY-MM-DD') : '',                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='项目编号'                            >                                {                                    readOnly ? detailsInfor.tid :                                        <Input                                            value={this.state.tid}                                            onChange={(e)=>{                                                this.setState({                                                    tid:e.target.value                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='授权日期'                            >                                {                                    readOnly ? detailsInfor.authorizationDates:                                        <DatePicker                                            value={this.state.authorizationDates ? moment(this.state.authorizationDates) : ''}                                            format='YYYY-MM-DD'                                            onChange={(date)=>{                                                this.setState({                                                    authorizationDates:date ? moment(date).format('YYYY-MM-DD') : '',                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='Email'                            >                                {                                    readOnly ?                                        <Tooltip placement="topLeft" title={detailsInfor.email}>                                            <div style={{                                                width:'100%',                                                overflow: 'hidden',                                                whiteSpace: 'nowrap',                                                textOverflow: 'ellipsis',                                            }}>                                                {detailsInfor.email}                                            </div>                                        </Tooltip>:                                        <Input                                            value={this.state.email}                                            onChange={(e)=>{                                                this.setState({                                                    email:e.target.value                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='滞纳金'                            >                                {                                    readOnly ? detailsInfor.delayingAmount :                                        <Input                                            style={{paddingTop: '5px'}}                                            type='number'                                            value={this.state.delayingAmount}                                            onChange={(e)=>{                                                this.setState({                                                    delayingAmount:e.target.value                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='权利恢复费'                            >                                {                                    readOnly ? detailsInfor.recoveryAmount :                                        <Input                                            style={{paddingTop: '5px'}}                                            type='number'                                            value={this.state.recoveryAmount}                                            onChange={(e)=>{                                                this.setState({                                                    recoveryAmount:e.target.value                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='年费状态'                            >                                {                                    readOnly ? (                                            detailsInfor.annualFeeStatus === 0 ? '待缴费' :                                                detailsInfor.annualFeeStatus === 1 ? '已缴费' : ''                                        ) :                                        <Select style={{paddingTop: '5px'}} value={this.state.annualFeeStatus} onSelect={(e)=>{this.setState({annualFeeStatus:e})}}>                                            <Select.Option value={0}>待缴费</Select.Option>                                            <Select.Option value={1}>已缴费</Select.Option>                                        </Select>                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='权利人'                            >                                {                                    readOnly ? <Tooltip title={detailsInfor.holders}>                                        <div style={{                                            maxWidth:'120px',                                            overflow:'hidden',                                            textOverflow: "ellipsis",                                            whiteSpace:'nowrap',                                        }}>{detailsInfor.holders}</div>                                    </Tooltip> :                                        <Input                                            value={this.state.holders}                                            onChange={(e)=>{                                                this.setState({                                                    holders:e.target.value                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='发明人'                            >                                {                                    readOnly ? <Tooltip title={detailsInfor.inventor}>                                        <div style={{                                            maxWidth:'120px',                                            overflow:'hidden',                                            textOverflow: "ellipsis",                                            whiteSpace:'nowrap',                                        }}>{detailsInfor.inventor}</div>                                    </Tooltip> :                                        <Input                                            value={this.state.inventor}                                            onChange={(e)=>{                                                this.setState({                                                    inventor:e.target.value                                                })                                            }}                                        />                                }                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='年费'                            >                                {detailsInfor.patentAmount}                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='费减状态'                            >                                {detailsInfor.tid ? (detailsInfor.costReduction === 1 ? '有费减' : detailsInfor.costReduction === 0 ? '无费减' : '') : '无'}                            </FormItem>                        </Col>                        <Col span={8}>                            <FormItem                                {...formItemLayout}                                label='通知'                            >                                <div style={{display:'flex',alignItems:'center'}}>                                    {                                        detailsInfor.salesmanRemind === 0 ? '未通知' :                                            detailsInfor.salesmanRemind === 1 ? '已通知' : ''                                    }                                </div>                            </FormItem>                        </Col>                    </Row>                    {!readOnly ?                        <div style={{                            margin:'30px',                            display:'flex',                            justifyContent:'center'                        }}>                            <Popconfirm placement="top" title="确定提交吗?" onConfirm={(e)=>{                                e.stopPropagation();                                this.onChange();                            }} okText="确定" cancelText="取消">                                <Button                                    loading={this.state.loading}                                    size='large'                                    type="primary"                                    onClick={(e)=>{                                        e.stopPropagation();                                    }}                                >                                    确定提交                                </Button>                            </Popconfirm>                        </div>                        : null}                </Form>                <Spin spinning={this.state.loading}>                    <Table                        scroll={{ y: 320 }}                        columns={this.state.columns}                        dataSource={this.state.dataSource}                        pagination={false}                        bordered                        size="small"                    />                </Spin>                {this.state.visible ? <ReminderLog                    id={this.state.id}                    visible={this.state.visible}                    cancel={()=>{                        this.setState({                            visible:false,                            id:undefined                        })                    }}                /> : null}            </Modal>        )    }}export default PatentDetails;
 |