| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199 | import React from 'react';import { Spin, Form, Button, Select, message } from 'antd';import ajax from 'jquery/src/ajax/xhr.js'import $ from 'jquery/src/ajax';import { progressiveness, innovativeness, ripeness, alternatives, defensive, prospect, supplyAndDemand, rangeOfApplication, imitable, profitability } from './dict.js';const FormItem = Form.Item;const Option = Select.Option;const formItemLayout = {  labelCol: { span: 4 },  wrapperCol: { span: 14 },};const EvaluateStep3 = Form.create({})(React.createClass({  getInitialState() {    return {      loading: false,      initialData: {}    };  },  componentWillMount() {    this.state.initialData = this.props.data || {};  },  next() {    if (this.state.loading) {      return;    }    this.props.form.validateFields((err, values) => {      if (!err) {        this.setState({          loading: true        })        values.id = this.props.id;        $.ajax({          url: globalConfig.context + '/api/user/evaluate/step3',          method: 'post',          data: values        }).done(function (res) {          if (res.error && res.error.length) {            message.error(res.error[0].message)          } else {            if (this.props.next) {              this.props.next(values);            }          }        }.bind(this)).fail(function () {          this.setState({            loading: false          })        }.bind(this));      }    });  },  prev() {    if (this.props.prev) {      this.props.prev();    }  },  stringify(val) {    return val && String(val)  },  render() {    let { loading, initialData } = this.state;    const { getFieldDecorator } = this.props.form;    return (      <Spin spinning={loading}>        <Form className="steps-form">          <FormItem label="先进性" {...formItemLayout}>            {getFieldDecorator('progressiveness', {              rules: [{ required: true, message: '请选择技术的先进性!' }],              initialValue: this.stringify(initialData.progressiveness)            })(              <Select placeholder="请选择技术的先进性">                {progressiveness.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="创新性" {...formItemLayout}>            {getFieldDecorator('innovativeness', {              rules: [{ required: true, message: '请选择技术的创新性!' }],              initialValue: this.stringify(initialData.innovativeness)            })(              <Select placeholder="请选择技术的创新性">                {innovativeness.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="成熟度" {...formItemLayout}>            {getFieldDecorator('ripeness', {              rules: [{ required: true, message: '请选择技术的成熟度!' }],              initialValue: this.stringify(initialData.ripeness)            })(              <Select placeholder="请选择技术的成熟度">                {ripeness.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="替代性" {...formItemLayout}>            {getFieldDecorator('alternatives', {              rules: [{ required: true, message: '请选择技术的替代性!' }],              initialValue: this.stringify(initialData.alternatives)            })(              <Select placeholder="请选择技术的替代性">                {alternatives.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="技术防御力" {...formItemLayout}>            {getFieldDecorator('defensive', {              rules: [{ required: true, message: '请选择技术的防御力!' }],              initialValue: this.stringify(initialData.defensive)            })(              <Select placeholder="请选择技术的防御力">                {defensive.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="技术领域发展前景" {...formItemLayout}>            {getFieldDecorator('prospect', {              rules: [{ required: true, message: '请选择技术领域发展前景!' }],              initialValue: this.stringify(initialData.prospect)            })(              <Select placeholder="请选择技术领域发展前景">                {prospect.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="供求关系" {...formItemLayout}>            {getFieldDecorator('supplyAndDemand', {              rules: [{ required: true, message: '请选择技术的供求关系!' }],              initialValue: this.stringify(initialData.supplyAndDemand)            })(              <Select placeholder="请选择技术的供求关系">                {supplyAndDemand.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="产品应用范围" {...formItemLayout}>            {getFieldDecorator('rangeOfApplication', {              rules: [{ required: true, message: '请选择技术的应用范围!' }],              initialValue: this.stringify(initialData.rangeOfApplication)            })(              <Select placeholder="请选择技术的应用范围">                {rangeOfApplication.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="遭他人模仿可能性" {...formItemLayout}>            {getFieldDecorator('imitable', {              rules: [{ required: true, message: '请选择技术的模仿可能性!' }],              initialValue: this.stringify(initialData.imitable)            })(              <Select placeholder="请选择技术的模仿可能性">                {imitable.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>          <FormItem label="独立获利能力" {...formItemLayout}>            {getFieldDecorator('profitability', {              rules: [{ required: true, message: '请选择技术的独立获利能力!' }],              initialValue: this.stringify(initialData.profitability)            })(              <Select placeholder="请选择技术的独立获利能力">                {profitability.map((it) => {                  return <Option key={it.id} value={it.id}>{it.text}</Option>                })}              </Select>              )}          </FormItem>        </Form>        <div className="steps-action">          <Button type="primary" onClick={() => this.next()}>保存,下一步</Button>          <Button style={{ marginLeft: 8 }} onClick={() => this.prev()}>上一步</Button>        </div>      </Spin>    )  },}));export default EvaluateStep3;
 |