| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188 | import React from 'react';import { Input, Button, Form, Select, Icon, Spin, InputNumber, Tag, message, Cascader } from 'antd';import './tech.less';import ajax from 'jquery/src/ajax/xhr.js';import $ from 'jquery/src/ajax';import { techFieldList } from '../../DicTechFieldList';const TechFrom = Form.create()(React.createClass({    getInitialState() {        return {            loading: false,            techzoneArr: [],            havetechzone: [],            skillArr: [],            haveskill: []        };    },    getData() {        this.props.spinState(true);        $.ajax({            method: "get",            dataType: "json",            url: globalConfig.context + "/api/user/job",            success: function (data) {                if (data.data) {                    this.setState({                        id: data.data.id,                        techpeople: data.data.technicalPeopleNum,                        techField: data.data.searchAreaCategory ? data.data.searchAreaCategory.split(",") : [],                        haveskill: data.data.specialty ? data.data.specialty.split(",") : []                    });                };            }.bind(this),        }).always(function () {            this.props.spinState(false);        }.bind(this));    },    componentWillMount() {        this.getData();    },    handleSubmit(e) {        e.preventDefault();        let specialty = this.state.haveskill.join(",");        this.props.form.validateFields((err, values) => {            if (!err) {                this.props.spinState(true);                $.ajax({                    method: "POST",                    dataType: "json",                    crossDomain: false,                    url: globalConfig.context + "/api/user/orgTech",                    data: {                        "id": this.state.id,                        "technicalPeopleNum": values.techpeople,                        "searchAreaCategory": values.techField ? values.techField.join(',') : '',                        "specialty": specialty                    }                }).done(function (data) {                    if (!data.error.length) {                        message.success('保存成功!');                        this.getData();                    } else {                        message.warning(data.error[0].message);                    }                }.bind(this)).always(function () {                    this.props.spinState(false);                }.bind(this));            }        });    },    addskill(e) {        let _me = this;        let theSkillArr = _me.state.haveskill;        let theskill = _me.props.form.getFieldValue('skill');        if (theskill !== undefined) {            if (_me.state.haveskill.length > 0) {                let thebool = true;                _me.state.haveskill.map(function (item, i) {                    if (item === theskill) {                        thebool = false                    };                });                if (thebool) {                    theSkillArr = _me.state.haveskill.concat(theskill);                }            } else if (_me.state.haveskill.length === 0) {                theSkillArr = _me.state.haveskill.concat(theskill);            };            this.setState({                haveskill: theSkillArr            });        };    },    deleteskill(e) {        let _me = this.state;        _me.haveskill.map(function (item, i) {            if (item === e) {                _me.haveskill.splice(i, 1);            }        });    },    render() {        const FormItem = Form.Item;        const Option = Select.Option;        const { getFieldDecorator } = this.props.form;        const formItemLayout = {            labelCol: { span: 4 },            wrapperCol: { span: 12 },        };        const _me = this;        return (            <Form horizontal onSubmit={this.handleSubmit} className="tech-form">                <FormItem                    labelCol={{ span: 4 }}                    wrapperCol={{ span: 6 }}                    label="技术人员数量"                >                    {getFieldDecorator('techpeople', {                        initialValue: this.state.techpeople                    })(                        <InputNumber />                        )}                    <span>人</span>                </FormItem>                <FormItem                    {...formItemLayout}                    label="专业领域"                >                    {getFieldDecorator('techField', {                        initialValue: this.state.techField                    })(                        <Cascader placeholder="请选择专业领域" options={techFieldList} style={{ width: 380 }} />                        )}                </FormItem>                <FormItem                    labelCol={{ span: 4 }}                    wrapperCol={{ span: 14 }}                    label="擅长能力"                >                    {getFieldDecorator('skill')(                        <div>                            擅长 <Input />的研究                            <Button type="primary" onClick={this.addskill}>添加</Button>                        </div>                    )}                </FormItem>                <div className="set-explain">                    {                        this.state.haveskill.map(function (item, i) {                            return <Tag key={item} closable onClose={_me.deleteskill.bind(this, item)}>{item}</Tag>                        }.bind(this))                    }                </div>                <FormItem wrapperCol={{ span: 12, offset: 3 }}>                    <Button className="set-submit" type="primary" htmlType="submit">保存</Button>                </FormItem>            </Form >        );    },}));const Person = React.createClass({    getInitialState() {        return {            loading: false        };    },    spinChange(e) {        this.setState({            loading: e        });    },    render() {        return (            <Spin spinning={this.state.loading} className='spin-box'>                <div className="set-tech">                    <div className="acc-title">                        <p><span>完善研究领域与擅长能力可加入平台专家,承接技术难题!</span></p>                    </div>                    <TechFrom spinState={this.spinChange} />                </div>            </Spin>        )    }});export default Person;
 |