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 { accessMethods, legalStatus, maintenanceStatus, confidentialities, decidabilities, rightLimitations } from './dict.js'; const FormItem = Form.Item; const Option = Select.Option; const formItemLayout = { labelCol: { span: 6 }, wrapperCol: { span: 10 } }; const EvaluateStep2 = 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/step2', 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('accessMethod', { rules: [{ required: true, message: '请选择技术取得的方式!' }], initialValue: this.stringify(initialData.accessMethod) })( <Select placeholder="请选择技术取得的方式"> {accessMethods.map((it) => { return <Option key={it.id} value={it.id}>{it.text}</Option> })} </Select> )} </FormItem> <FormItem label="法律状态" {...formItemLayout}> {getFieldDecorator('legalStatus', { rules: [{ required: true, message: '请选择法律保护状态!' }], initialValue: this.stringify(initialData.legalStatus) })( <Select placeholder="请选择法律保护状态"> {legalStatus.map((it) => { return <Option key={it.id} value={it.id}>{it.text}</Option> })} </Select> )} </FormItem> <FormItem label="专利维护" {...formItemLayout}> {getFieldDecorator('patentMaintenance', { rules: [{ required: true, message: '请选择专利维护状态!' }], initialValue: this.stringify(initialData.patentMaintenance) })( <Select placeholder="请选择专利维护状态"> {maintenanceStatus.map((it) => { return <Option key={it.id} value={it.id}>{it.text}</Option> })} </Select> )} </FormItem> <FormItem label="保密性" {...formItemLayout}> {getFieldDecorator('confidentiality', { rules: [{ required: true, message: '请选择保密性!' }], initialValue: this.stringify(initialData.confidentiality) })( <Select placeholder="请选择保密性"> {confidentialities.map((it) => { return <Option key={it.id} value={it.id}>{it.text}</Option> })} </Select> )} </FormItem> <FormItem label="他人侵权的易判定性" {...formItemLayout}> {getFieldDecorator('decidability', { rules: [{ required: true, message: '请选择他人侵权的易判定性!' }], initialValue: this.stringify(initialData.decidability) })( <Select placeholder="请选择他人侵权的易判定性"> {decidabilities.map((it) => { return <Option key={it.id} value={it.id}>{it.text}</Option> })} </Select> )} </FormItem> <FormItem label="是否涉及质押、担保、诉讼等权利限制" {...formItemLayout}> {getFieldDecorator('hasRightLimitation', { rules: [{ required: true, message: '请选择是否涉及质押、担保、诉讼等权利限制!' }], initialValue: this.stringify(initialData.hasRightLimitation) })( <Select placeholder="请选择是否涉及质押、担保、诉讼等权利限制"> {rightLimitations.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 EvaluateStep2;